n20-common-lib 2.22.23 → 2.22.25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "n20-common-lib",
3
- "version": "2.22.23",
3
+ "version": "2.22.25",
4
4
  "private": false,
5
5
  "scripts": {
6
6
  "serve": "vue-cli-service serve",
@@ -1,28 +1,13 @@
1
1
  <template>
2
- <div
3
- class="w-100p flex-box"
4
- :style="{
5
- display: 'grid',
6
- flexWrap: 'wrap',
7
- gridTemplateColumns: `repeat(${columns}, 1fr)`,
8
- gap: '16px',
9
- padding: '0',
10
- overflowX: 'hidden'
11
- }"
12
- >
13
- <div v-for="(item, i) in otherAttData" :key="i" class="flex-box" style="width: 100%; padding: 0 20px">
2
+ <div class="w-100p">
3
+ <div v-for="(item, i) in otherAttData" :key="i" class="flex-box m-l-m m-r-m">
14
4
  <el-form-item
15
5
  class="m-r-ss m-b-s"
16
- :label-width="labelWidth"
17
6
  :class="item.cfgHasRemark === '1' ? 'flex-auto' : 'flex-1'"
18
7
  :label="item.cfgName"
19
8
  >
20
9
  <span slot="label">
21
- <span
22
- v-title="item.cfgName"
23
- style="display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis"
24
- :style="{ maxWidth: labelWidth }"
25
- >
10
+ <span style="display: inline-block; white-space: wrap">
26
11
  <span v-if="required" style="color: red">*</span>
27
12
  {{ item.cfgName }}
28
13
  </span>
@@ -56,20 +41,10 @@
56
41
  >
57
42
  <el-option v-for="(row, i) in JSON.parse(item.cfgJson)" :key="i" :label="row.value" :value="row.code" />
58
43
  </el-select>
59
- <el-radio-group
60
- v-if="item.cfgType === '22'"
61
- v-model="item.cfgVal"
62
- class="input-w"
63
- @change="(val) => changeFn(val, item)"
64
- >
44
+ <el-radio-group v-if="item.cfgType === '22'" v-model="item.cfgVal" @change="(val) => changeFn(val, item)">
65
45
  <el-radio v-for="(row, i) in JSON.parse(item.cfgJson)" :key="i" :label="row.code">{{ row.value }}</el-radio>
66
46
  </el-radio-group>
67
- <el-checkbox-group
68
- v-if="item.cfgType === '32'"
69
- v-model="item.checkList"
70
- class="input-w"
71
- @change="(val) => changeFn(val, item)"
72
- >
47
+ <el-checkbox-group v-if="item.cfgType === '32'" v-model="item.checkList" @change="(val) => changeFn(val, item)">
73
48
  <el-checkbox v-for="(row, i) in JSON.parse(item.cfgJson || '[]')" :key="i" :label="row.code">{{
74
49
  row.value
75
50
  }}</el-checkbox>
@@ -105,18 +80,10 @@
105
80
  import axios from '../../utils/axios'
106
81
  export default {
107
82
  props: {
108
- labelWidth: {
109
- type: String,
110
- default: '12em'
111
- },
112
83
  taskId: {
113
84
  type: [String, Number],
114
85
  default: ''
115
86
  },
116
- columns: {
117
- type: Number,
118
- default: 1
119
- },
120
87
  form: {
121
88
  type: Object,
122
89
  default: () => ({})
@@ -143,6 +110,34 @@ export default {
143
110
  this.getData(this.otherAttDataA)
144
111
  },
145
112
  methods: {
113
+ setDefaultValue(item) {
114
+ const defaultTypes = ['22', '21', '31', '32']
115
+ // 不满足条件的直接返回
116
+ if (!defaultTypes.includes(item.cfgType) || item.cfgVal) return
117
+
118
+ try {
119
+ // 解析cfgJson,获取默认选项
120
+ const cfgJson = JSON.parse(item.cfgJson || '[]')
121
+ const defaultItems = cfgJson.filter((row) => row.isDefault === '1')
122
+ if (!defaultItems.length) return
123
+ // 获取默认选项的code值
124
+ const defaultCodes = defaultItems.map((row) => row.code)
125
+ if (['22', '21'].includes(item.cfgType)) {
126
+ item.cfgVal = defaultCodes[0]
127
+ item.cfgText = defaultItems[0]?.value
128
+ } else if (['31', '32'].includes(item.cfgType)) {
129
+ item.cfgVal = defaultCodes.join(',')
130
+ item.cfgText = defaultItems.map((row) => row.value).join(',')
131
+ if (item.cfgType === '31') {
132
+ item.selectList = defaultCodes
133
+ } else {
134
+ item.checkList = defaultCodes
135
+ }
136
+ }
137
+ } catch (e) {
138
+ // JSON解析失败时忽略
139
+ }
140
+ },
146
141
  getData(data) {
147
142
  if (data.length) {
148
143
  this.otherAttData = data
@@ -155,6 +150,10 @@ export default {
155
150
  if (['32'].includes(item.cfgType)) {
156
151
  item.checkList = item.checkList ? item.checkList : []
157
152
  }
153
+ if (['31'].includes(item.cfgType)) {
154
+ item.selectList = item.selectList ? item.selectList : []
155
+ }
156
+ this.setDefaultValue(item)
158
157
  return item
159
158
  }) || []
160
159
  }
@@ -192,8 +192,13 @@
192
192
  >{{ '审查意见:' | $lc }} <i class="n20-icon-shouqizhedie f-s-m"></i
193
193
  ></span>
194
194
  <div v-show="showFlowHistoryChild" class="n20-description-bgc p-a-s">
195
- <div v-for="(s, i) in row.flowHistoryCfgs" :key="i">
196
- {{ s.cfgName }}:{{ s.cfgText ? s.cfgText : s.cfgVal }}
195
+ <div
196
+ v-for="(s, i) in row.flowHistoryCfgs"
197
+ :key="i"
198
+ :class="{ 'flex-box': align === 'left-right' }"
199
+ :style="align === 'left-right' ? 'justify-content: space-between' : ''"
200
+ >
201
+ <span>{{ s.cfgName }}:</span><span>{{ s.cfgText ? s.cfgText : s.cfgVal }}</span>
197
202
  </div>
198
203
  </div>
199
204
  </div>
@@ -266,8 +271,16 @@
266
271
  >{{ '审查意见:' | $lc }}<i class="n20-icon-shouqizhedie f-s-m"></i
267
272
  ></span>
268
273
  <div v-show="showFlowHistory" class="n20-description-bgc p-a-s">
269
- <div v-for="(s, i) in item.flowHistoryCfgs" :key="i" class="p-b-s">
270
- <div>{{ s.cfgName }}:{{ s.cfgText ? s.cfgText : s.cfgVal }}</div>
274
+ <div
275
+ v-for="(s, i) in item.flowHistoryCfgs"
276
+ :key="i"
277
+ class="p-b-s"
278
+ :class="{ 'flex-box': align === 'left-right' }"
279
+ :style="align === 'left-right' ? 'justify-content: space-between' : ''"
280
+ >
281
+ <div>
282
+ <span>{{ s.cfgName }}:</span><span>{{ s.cfgText ? s.cfgText : s.cfgVal }}</span>
283
+ </div>
271
284
  <div>{{ s.cfgRemark }}</div>
272
285
  </div>
273
286
  </div>
@@ -412,6 +425,10 @@ export default {
412
425
  hideLoading: {
413
426
  type: Boolean,
414
427
  default: false
428
+ },
429
+ align: {
430
+ type: String,
431
+ default: 'left-right'
415
432
  }
416
433
  },
417
434
  data() {
@@ -21,6 +21,7 @@
21
21
  class="p-a"
22
22
  :proc-inst-id="procInstIdC"
23
23
  style="height: 70vh; overflow: auto"
24
+ :align="align"
24
25
  />
25
26
  </el-dialog>
26
27
  <el-dialog
@@ -40,7 +41,7 @@
40
41
  <template slot="tips">
41
42
  <el-button size="mini" plain @click="imgV = true">{{ '流程图查看' | $lc }}</el-button>
42
43
  </template>
43
- <approvalCard :api-prefix="apiPrefix" :proc-inst-id="procInstIdC" />
44
+ <approvalCard :api-prefix="apiPrefix" :proc-inst-id="procInstIdC" :align="align" />
44
45
  <el-dialog
45
46
  v-drag
46
47
  :title="'查看流程' | $lc"
@@ -80,6 +81,10 @@ export default {
80
81
  buttonMode: {
81
82
  type: Boolean,
82
83
  default: true
84
+ },
85
+ align: {
86
+ type: String,
87
+ default: 'left-right'
83
88
  }
84
89
  },
85
90
  data() {
@@ -33,9 +33,9 @@
33
33
  </el-form-item>
34
34
  </el-form>
35
35
  <ExpandablePane v-if="otherAttDataA.length > 0" title="自定义项" :default-expand="true">
36
- <el-form ref="approveBtnGroup" label-position="right" :label-width="labelWidth">
36
+ <el-form ref="approveBtnGroup" label-position="top">
37
37
  <div
38
- class="p-b-lg p-t-lg p-r-lg"
38
+ class="p-b-s p-t-s"
39
39
  style="max-height: 350px; overflow-y: auto; border: 1px dashed var(--border-color-base); border-radius: 5px"
40
40
  >
41
41
  <show-other-att-new
@@ -44,8 +44,6 @@
44
44
  :other-att-data-a="otherAttDataA"
45
45
  :proc-inst-id="procInstId || this.$route.query.processInstanceId"
46
46
  :required="true"
47
- :columns="columns"
48
- :label-width="labelWidth"
49
47
  />
50
48
  </div>
51
49
  </el-form>
@@ -71,14 +69,7 @@ export default {
71
69
  type: String,
72
70
  default: '85%'
73
71
  },
74
- labelWidth: {
75
- type: String,
76
- default: '12em'
77
- },
78
- columns: {
79
- type: Number,
80
- default: 1
81
- },
72
+
82
73
  afterGetConf: {
83
74
  type: Function,
84
75
  default: undefined
@@ -117,77 +108,108 @@ export default {
117
108
  },
118
109
  methods: {
119
110
  /**
120
- *
121
- * @param typeCode {String} 业务类型编码
111
+ * 获取办理意见配置
112
+ * @param {String} typeCode - 业务类型编码
113
+ * @param {String} procInstId - 流程实例ID,用于回显历史数据
122
114
  */
123
115
  async getHandlingAdvice(typeCode, procInstId) {
124
116
  try {
125
- const { code, data } = await axios.post(
126
- `/bems/activiti/admin/todo/isFlowStartWithOptions`,
127
- { typeCode },
128
- {
129
- noMsg: true
130
- }
131
- )
132
- // data.whether = true
133
- // data.optionsRequired = true
134
-
135
- if (code === 200) {
136
- this.otherAttDataA = data.customizationList || []
137
- this.whether = data.whether
138
- this.optionsRequired = data.optionsRequired
139
- if (data.optionsRequired) {
140
- this.placeholder = '请选择或输入意见(必填)'
141
- } else {
142
- this.placeholder = '请选择或输入意见(选填)'
143
- }
144
- this.visible = data.whether === true || this.otherAttDataA.length > 0
145
- this.flowOptions = data?.opinions?.map((d) => {
146
- return {
147
- label: d,
148
- value: d
149
- }
150
- })
151
- if (!data.whether && this.afterGetConf && this.otherAttDataA.length === 0) {
152
- this.afterGetConf()
153
- }
154
- }
155
- // 回显操作
117
+ // 1. 获取办理意见配置
118
+ await this.fetchHandlingAdviceConfig(typeCode)
119
+
120
+ // 2. 回显历史数据(编辑场景)
156
121
  if (procInstId) {
157
- const { data: data1 } = await axios.get(
158
- `/bems/activiti/sample/getStartEventFlowHistory/${procInstId}`,
159
- {},
160
- {
161
- noMsg: true
162
- }
163
- )
164
- this.reason = data1?.suggestion || ''
165
- this.reasonSelect = data1?.suggestion || ''
166
- if (data1 && data1.flowHistoryCfgs && data1.flowHistoryCfgs.length > 0) {
167
- this.otherAttDataA = this.otherAttDataA.map((item) => {
168
- const bcData = data1.flowHistoryCfgs.find((item2) => {
169
- return item2.cfgKey === item.cfgKey
170
- })
171
- return {
172
- ...item,
173
- cfgVal: ['31'].includes(item.cfgType) ? bcData.cfgVal.split(',') : bcData.cfgVal,
174
- cfgText: ['31'].includes(item.cfgType) ? bcData.cfgText && bcData.cfgText.split(',') : bcData.cfgText,
175
- selectList: ['31'].includes(item.cfgType) ? bcData.cfgVal.split(',') : undefined,
176
- checkList: ['32'].includes(item.cfgType) ? bcData.cfgVal.split(',') : undefined,
177
- cfgHasRemark: bcData.cfgHasRemark,
178
- cfgRemark: bcData.cfgRemark
179
- }
180
- })
181
- }
122
+ await this.loadFlowHistory(procInstId)
182
123
  }
183
- // 重新执行一次 使数据更新
184
- this.$refs.showOtherAttNew && this.$refs.showOtherAttNew.getData(this.otherAttDataA)
124
+
125
+ // 3. 更新子组件数据
126
+ this.updateOtherAttData()
185
127
  } catch (error) {
186
- if (this.afterGetConf) {
187
- this.afterGetConf()
188
- }
128
+ // 异常时执行回调
129
+ this.afterGetConf?.()
130
+ }
131
+ },
132
+
133
+ /** 获取办理意见配置接口 */
134
+ async fetchHandlingAdviceConfig(typeCode) {
135
+ const { code, data } = await axios.post(
136
+ `/bems/activiti/admin/todo/isFlowStartWithOptions`,
137
+ { typeCode },
138
+ { noMsg: true }
139
+ )
140
+
141
+ if (code !== 200) return
142
+
143
+ // 设置自定义项列表
144
+ this.otherAttDataA = data.customizationList || []
145
+ // 是否显示意见输入
146
+ this.whether = data.whether
147
+ // 意见是否必填
148
+ this.optionsRequired = data.optionsRequired
149
+
150
+ // 设置占位提示
151
+ this.placeholder = data.optionsRequired ? '请选择或输入意见(必填)' : '请选择或输入意见(选填)'
152
+ // 显示弹窗条件:需要输入意见 或 存在自定义项
153
+ this.visible = data.whether === true || this.otherAttDataA.length > 0
154
+ // 转换意见选项为下拉格式
155
+ this.flowOptions = data?.opinions?.map((d) => ({ label: d, value: d })) || []
156
+
157
+ // 无需弹窗时直接执行回调
158
+ if (!data.whether && this.afterGetConf && this.otherAttDataA.length === 0) {
159
+ this.afterGetConf()
160
+ }
161
+ },
162
+
163
+ /** 加载流程历史数据用于回显 */
164
+ async loadFlowHistory(procInstId) {
165
+ const { data: historyData } = await axios.get(
166
+ `/bems/activiti/sample/getStartEventFlowHistory/${procInstId}`,
167
+ {},
168
+ { noMsg: true }
169
+ )
170
+
171
+ // 回显意见内容
172
+ this.reason = historyData?.suggestion || ''
173
+ this.reasonSelect = historyData?.suggestion || ''
174
+
175
+ // 回显自定义项数据
176
+ if (historyData?.flowHistoryCfgs?.length > 0) {
177
+ this.otherAttDataA = this.mergeHistoryToCustomization(historyData.flowHistoryCfgs)
189
178
  }
190
179
  },
180
+
181
+ /** 将历史数据合并到自定义项配置 */
182
+ mergeHistoryToCustomization(flowHistoryCfgs) {
183
+ const CFG_TYPE = {
184
+ MULTI_SELECT: '31', // 多选下拉
185
+ CHECKBOX: '32' // 复选框
186
+ }
187
+
188
+ return this.otherAttDataA.map((item) => {
189
+ const historyItem = flowHistoryCfgs.find((h) => h.cfgKey === item.cfgKey)
190
+ if (!historyItem) return item
191
+
192
+ const isMultiSelect = item.cfgType === CFG_TYPE.MULTI_SELECT
193
+ const isCheckbox = item.cfgType === CFG_TYPE.CHECKBOX
194
+ const cfgValArray = historyItem.cfgVal?.split(',') || []
195
+ const cfgTextArray = historyItem.cfgText?.split(',') || []
196
+
197
+ return {
198
+ ...item,
199
+ cfgVal: isMultiSelect ? cfgValArray : historyItem.cfgVal,
200
+ cfgText: isMultiSelect ? cfgTextArray : historyItem.cfgText,
201
+ selectList: isMultiSelect ? cfgValArray : undefined,
202
+ checkList: isCheckbox ? cfgValArray : undefined,
203
+ cfgHasRemark: historyItem.cfgHasRemark,
204
+ cfgRemark: historyItem.cfgRemark
205
+ }
206
+ })
207
+ },
208
+
209
+ /** 更新子组件数据 */
210
+ updateOtherAttData() {
211
+ this.$refs.showOtherAttNew?.getData(this.otherAttDataA)
212
+ },
191
213
  changeReasonSelect(val) {
192
214
  this.reason = val
193
215
  },