agilebuilder-ui 1.0.621 → 1.0.962

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.
Files changed (120) hide show
  1. package/lib/super-ui.css +1 -1
  2. package/lib/super-ui.js +115880 -110424
  3. package/lib/super-ui.umd.cjs +103 -95
  4. package/package.json +6 -3
  5. package/packages/department-tree/src/department-tree.vue +27 -10
  6. package/packages/department-tree-inline/src/department-tree-service.js +20 -41
  7. package/packages/department-tree-mobile/src/department-tree-app.vue +6 -6
  8. package/packages/department-tree-mobile/src/department-tree-inline-app.vue +15 -15
  9. package/packages/department-user-tree/src/department-user-tree.vue +17 -2
  10. package/packages/department-user-tree-inline/src/department-user-multiple-tree-inline.vue +61 -26
  11. package/packages/department-user-tree-inline/src/department-user-single-tree-inline.vue +64 -22
  12. package/packages/department-user-tree-inline/src/department-user-tree-single-service.js +0 -6
  13. package/packages/department-user-tree-inline/src/group-user/group-input.vue +162 -0
  14. package/packages/department-user-tree-inline/src/group-user/group-list.vue +99 -0
  15. package/packages/department-user-tree-inline/src/group-user/group-user.vue +42 -0
  16. package/packages/department-user-tree-inline/src/group-user-multiple-tree.vue +304 -0
  17. package/packages/department-user-tree-inline/src/group-user-single-tree.vue +155 -0
  18. package/packages/department-user-tree-inline/src/group-user-tree-service.js +74 -0
  19. package/packages/department-user-tree-inline/src/search-result.vue +34 -36
  20. package/packages/department-user-tree-mobile/src/department-user-tree-app.vue +6 -6
  21. package/packages/department-user-tree-mobile/src/department-user-tree-inline-app.vue +17 -19
  22. package/packages/department-user-tree-mobile/src/department-user-tree-service.ts +0 -11
  23. package/packages/dynamic-source-select/src/dynamic-source-select.vue +795 -799
  24. package/packages/dynamic-source-select/src/events.js +11 -16
  25. package/packages/fs-upload-list/src/fs-upload-list.vue +183 -122
  26. package/packages/fs-upload-new/src/file-upload-mobile/file-upload-app.vue +246 -0
  27. package/packages/fs-upload-new/src/file-upload-mobile/file-upload-browser.vue +480 -0
  28. package/packages/fs-upload-new/src/file-upload-mobile/file-upload-component.vue +127 -0
  29. package/packages/fs-upload-new/src/file-upload-mobile/file-upload-input.vue +246 -0
  30. package/packages/fs-upload-new/src/file-upload-mobile/file-upload.vue +255 -0
  31. package/packages/fs-upload-new/src/fs-button-upload.vue +10 -13
  32. package/packages/fs-upload-new/src/fs-drag-upload.vue +4 -8
  33. package/packages/fs-upload-new/src/fs-preview-new.vue +103 -36
  34. package/packages/fs-upload-new/src/fs-upload-new.vue +160 -13
  35. package/packages/index.js +11 -2
  36. package/packages/organization-input/src/organization-input.vue +493 -539
  37. package/packages/plugins/export-data-new.js +34 -1
  38. package/packages/rich-editor/index.vue +29 -0
  39. package/packages/row-form/index.js +7 -0
  40. package/packages/row-form/index.vue +211 -0
  41. package/packages/scan-code-input/src/scan-code-input.vue +136 -104
  42. package/packages/scan-code-input-browser/index.js +6 -0
  43. package/packages/{scan-code-input/src/scan-code-input-colse.vue → scan-code-input-browser/src/scan-code-input.vue} +1 -28
  44. package/packages/secret-info/index.vue +2 -2
  45. package/packages/super-grid/src/apis.js +158 -10
  46. package/packages/super-grid/src/components/grid-icon.vue +7 -14
  47. package/packages/super-grid/src/components/hyperlinks.vue +24 -8
  48. package/packages/super-grid/src/custom-formatter.js +312 -380
  49. package/packages/super-grid/src/dynamic-input.vue +346 -43
  50. package/packages/super-grid/src/formValidatorUtil.js +79 -15
  51. package/packages/super-grid/src/group-column.vue +5 -0
  52. package/packages/super-grid/src/normal-column-content.vue +1056 -0
  53. package/packages/super-grid/src/normal-column.vue +57 -740
  54. package/packages/super-grid/src/row-detail.vue +50 -0
  55. package/packages/super-grid/src/row-operation.vue +19 -10
  56. package/packages/super-grid/src/scan-util.ts +243 -0
  57. package/packages/super-grid/src/search-button.vue +18 -14
  58. package/packages/super-grid/src/search-form-advancedQuery.vue +9 -2
  59. package/packages/super-grid/src/search-form-item.vue +10 -3
  60. package/packages/super-grid/src/search-form-mobile.vue +250 -0
  61. package/packages/super-grid/src/search-form.vue +159 -82
  62. package/packages/super-grid/src/super-grid-service.js +51 -6
  63. package/packages/super-grid/src/super-grid.vue +657 -761
  64. package/packages/super-grid/src/utils.js +126 -170
  65. package/packages/super-nine-grid/src/super-nine-grid.vue +1032 -1141
  66. package/packages/workflow-button/src/workflow-button.vue +6 -1
  67. package/packages/workgroup-tree/src/workgroup-tree.vue +31 -0
  68. package/packages/workgroup-tree-inline/src/workgroup-tree-inline.vue +28 -0
  69. package/packages/workgroup-tree-inline/src/workgroup-tree-service.js +26 -0
  70. package/packages/workgroup-tree-mobile/index.js +6 -0
  71. package/packages/workgroup-tree-mobile/src/dept-result.vue +51 -0
  72. package/packages/workgroup-tree-mobile/src/workgroup-tree-app.vue +120 -0
  73. package/packages/workgroup-tree-mobile/src/workgroup-tree-inline-app.vue +375 -0
  74. package/packages/workgroup-tree-mobile/src/workgroup-tree-service.ts +62 -0
  75. package/packages/workgroup-user-tree/src/workgroup-user-tree.vue +15 -0
  76. package/packages/workgroup-user-tree-inline/src/workgroup-tree-inline-service.js +27 -0
  77. package/packages/workgroup-user-tree-inline/src/workgroup-user-tree-inline.vue +11 -0
  78. package/packages/workgroup-user-tree-mobile/index.js +6 -0
  79. package/packages/workgroup-user-tree-mobile/src/dept-path.vue +36 -0
  80. package/packages/workgroup-user-tree-mobile/src/dept-result.vue +58 -0
  81. package/packages/workgroup-user-tree-mobile/src/workgroup-user-tree-app.vue +119 -0
  82. package/packages/workgroup-user-tree-mobile/src/workgroup-user-tree-inline-app.vue +394 -0
  83. package/packages/workgroup-user-tree-mobile/src/workgroup-user-tree-service.ts +41 -0
  84. package/src/api/sso-service.js +44 -15
  85. package/src/directives/permission/permission.js +4 -3
  86. package/src/i18n/langs/cn.js +19 -3
  87. package/src/i18n/langs/en.js +18 -2
  88. package/src/permission.js +114 -122
  89. package/src/store/modules/user.js +32 -33
  90. package/src/styles/index.scss +1 -0
  91. package/src/styles/table.scss +12 -0
  92. package/src/styles/theme/dark-blue/button.scss +2 -2
  93. package/src/styles/theme/dark-blue/index.scss +1 -1
  94. package/src/styles/theme/dark-blue/sidebar.scss +10 -0
  95. package/src/styles/theme/dark-blue/table.scss +8 -52
  96. package/src/styles/theme/green/button.scss +2 -2
  97. package/src/styles/theme/green/green.scss +1 -1
  98. package/src/styles/theme/green/index.scss +1 -1
  99. package/src/styles/theme/green/sidebar.scss +20 -0
  100. package/src/styles/theme/green/table.scss +7 -51
  101. package/src/styles/theme/ocean-blue/button.scss +2 -2
  102. package/src/styles/theme/ocean-blue/index.scss +1 -1
  103. package/src/styles/theme/ocean-blue/ocean-blue.scss +1 -1
  104. package/src/styles/theme/ocean-blue/sidebar.scss +10 -0
  105. package/src/styles/theme/ocean-blue/table.scss +7 -52
  106. package/src/utils/auth.js +23 -3
  107. package/src/utils/calculator/calculator-factory.js +4 -4
  108. package/src/utils/calculator/calculator-util.js +14 -0
  109. package/src/utils/common-util.js +270 -124
  110. package/src/utils/i18n-util.js +145 -0
  111. package/src/utils/jump-page-utils.js +245 -314
  112. package/src/utils/permission.js +7 -1
  113. package/src/utils/permissionAuth.js +155 -37
  114. package/src/utils/request.js +10 -11
  115. package/src/utils/util.js +154 -205
  116. package/src/views/layout/EmptyLayout.vue +1 -1
  117. package/src/views/layout/components/Menubar/Item.vue +27 -4
  118. package/src/views/layout/components/Menubar/SidebarItem.vue +7 -3
  119. package/src/views/layout/components/Menubar/index.vue +14 -2
  120. package/src/views/layout/tab-content-index.vue +1 -1
@@ -1,85 +1,75 @@
1
1
  <template>
2
2
  <span class="select-top-span">
3
3
  <el-select
4
- ref="dynamicDataSourceRef"
5
- :allow-create="allowCreate"
6
- :clearable="clearable"
7
- :filterable="remote"
8
- :loading="loading"
9
- :model-value="value"
10
- :placeholder="placeholder"
11
- :remote="remote"
12
- :remote-method="remoteMethod"
13
- :reserve-keyword="true"
14
- :size="size"
15
- :style="fullWidth ? { width: '100%', height: '100%' } : {}"
16
- :title="getClassOptionTitle(value)"
17
- :value-key="valueAttribute"
18
- default-first-option
19
- v-bind="myProps"
20
- @blur="blurEvent($event)"
21
- @change="changeEvent"
22
- @clear="clear"
23
- @focus="focus"
24
- @visible-change="visibleChange"
25
- @remove-tag="removeTag(remote, $event)"
4
+ ref="dynamicDataSourceRef"
5
+ :allow-create="allowCreate"
6
+ :clearable="clearable"
7
+ :filterable="remote"
8
+ :loading="loading"
9
+ :model-value="value"
10
+ :placeholder="placeholder"
11
+ :remote="remote"
12
+ :remote-method="remoteMethod"
13
+ :reserve-keyword="true"
14
+ :size="size"
15
+ :style="fullWidth ? { width: '100%', height: '100%' } : {}"
16
+ :title="getClassOptionTitle(value)"
17
+ :value-key="valueAttribute"
18
+ default-first-option
19
+ v-bind="myProps"
20
+ @blur="blurEvent($event)"
21
+ @change="changeEvent"
22
+ @clear="clear"
23
+ @focus="focus"
24
+ @visible-change="visibleChange"
25
+ @remove-tag="removeTag(remote, $event)"
26
26
  >
27
27
  <template v-if="descriptionAttribute">
28
28
  <div v-if="optionWidth > 0" :style="{ width: optionWidth + 'px' }">
29
29
  <el-option
30
- v-for="item in optionItems"
31
- :key="item.value"
32
- :label="item._label_"
33
- :title="item._label_ + item._description_"
34
- :value="item[valueAttribute]"
30
+ v-for="item in optionItemList"
31
+ :key="item.value"
32
+ :label="item._label_"
33
+ :title="item._description_ ? item._label_ + item._description_ : item._label_"
34
+ :value="baseProps.multiple && item.value === 'saveAll' ? item.value : item[valueAttribute]"
35
35
  >
36
36
  <div style="display: flex">
37
37
  <span>{{ item._label_ }}</span>
38
- <span
39
- style="color: #8492a6; font-size: 13px; margin-left: 30px"
40
- >{{ item._description_ }}</span
41
- >
38
+ <span style="color: #8492a6; font-size: 13px; margin-left: 30px">{{
39
+ item._description_ ? item._description_ : item._label_
40
+ }}</span>
42
41
  </div>
43
42
  </el-option>
44
43
  </div>
45
44
  <el-option
46
- v-for="item in optionItems"
47
- :key="item.value"
48
- v-else
49
- :label="item._label_"
50
- :title="item._label_ + item._description_"
51
- :value="item[valueAttribute]"
45
+ v-else
46
+ v-for="item in optionItemList"
47
+ :key="item.value"
48
+ :label="item._label_"
49
+ :title="item._description_ ? item._label_ + item._description_ : item._label_"
50
+ :value="baseProps.multiple && item.value === 'saveAll' ? item.value : item[valueAttribute]"
52
51
  >
53
52
  <span style="float: left">{{ item._label_ }}</span>
54
- <span
55
- style="
56
- float: right;
57
- color: #8492a6;
58
- font-size: 13px;
59
- margin-left: 30px;
60
- "
61
- >{{ item._description_ }}</span
62
- >
53
+ <span style="float: right; color: #8492a6; font-size: 13px; margin-left: 30px">{{
54
+ item._description_ ? item._description_ : item._label_
55
+ }}</span>
63
56
  </el-option>
64
57
  </template>
65
58
  <template v-else>
66
- <div
67
- v-if="optionWidth > 0"
68
- :style="{ width: optionWidth + 'px', position: 'relative' }"
69
- >
59
+ <div v-if="optionWidth > 0" :style="{ width: optionWidth + 'px', position: 'relative' }">
70
60
  <el-option
71
- v-for="item in optionItems"
72
- :key="item.value"
73
- :label="item._label_"
74
- :value="item[valueAttribute]"
61
+ v-for="item in optionItemList"
62
+ :key="item.value"
63
+ :label="item._label_"
64
+ :value="baseProps.multiple && item.value === 'saveAll' ? item.value : item[valueAttribute]"
75
65
  />
76
66
  </div>
77
67
  <el-option
78
- v-for="item in optionItems"
79
- :key="item.value"
80
- v-else
81
- :label="item._label_"
82
- :value="item[valueAttribute]"
68
+ v-else
69
+ v-for="item in optionItemList"
70
+ :key="item.value"
71
+ :label="item._label_"
72
+ :value="baseProps.multiple && item.value === 'saveAll' ? item.value : item[valueAttribute]"
83
73
  />
84
74
  </template>
85
75
  </el-select>
@@ -87,217 +77,215 @@
87
77
  </template>
88
78
 
89
79
  <script>
90
- import {$on} from '../../utils/gogocodeTransfer'
80
+ import { $on } from '../../utils/gogocodeTransfer'
91
81
  import dynamicSourceSelectService from './dynamic-source-select-service'
92
82
  import events from './events'
93
83
  import eventBus from '../../../src/utils/eventBus'
94
- import {getEntityFieldValue, getPropNameWhenJoinTable, setEntityFieldValue} from '../../../src/utils/util'
84
+ import { getEntityFieldValue, getPropNameWhenJoinTable, setEntityFieldValue } from '../../../src/utils/util'
95
85
 
96
86
  export default {
97
- name: 'DynamicSourceSelect',
98
- components: {},
99
- model: {
100
- prop: 'value',
101
- event: 'input',
102
- },
103
- props: {
104
- // 字段配置 只有列表行编辑时候才用
105
- column: {
106
- type: Object,
107
- default: null,
108
- },
109
- value: {
110
- type: [String, Boolean, Number, Array],
111
- default: null,
112
- },
113
- baseProps: {
114
- type: Object,
115
- default: null,
116
- },
117
- entity: {
118
- type: Object,
119
- default: null,
120
- },
121
- // dynamicDataSourceCode、valueSetOptions、isSql(默认是false,在配置系统中使用时需要是true)、additionalParameter( json字符串)
122
- options: {
123
- type: Object,
124
- default: null,
125
- },
126
- // 列表组件行编辑使用,sql查询时数据表名称,用于自定义系统中列表组件中字段多表查询带有别名时,将点"."改成两个下划线"__"时使用
127
- tableName: {
128
- type: String,
129
- default: null,
130
- },
131
- // 列表组件行编辑使用,是否是关联表,用于确定属性名是否需要拼接tableName
132
- isJoinTable: {
133
- type: Boolean,
134
- default: false,
135
- },
136
- // 子表行编辑时,父表单数据
137
- parent: {
138
- type: Object,
139
- default: null,
140
- },
141
- // 所在的列表编码
142
- listCode: {
143
- type: String,
144
- default: null,
145
- },
146
- // 所在的表单编码
147
- formCode: {
148
- type: String,
149
- default: null,
150
- },
151
- listToolbarFormData: {
152
- type: Object,
153
- default: () => {
154
- return {}
155
- },
156
- },
157
- fullWidth: {
158
- type: Boolean,
159
- default: true,
160
- },
161
- clearable: {
162
- type: Boolean,
163
- default: true,
164
- },
165
- size: {
166
- type: String,
167
- default: 'default',
168
- },
169
- allowCreate: {
170
- type: Boolean,
171
- default: false,
172
- },
173
- analysisArea: {
174
- type: Number,
175
- default: null,
176
- // 1 为工具栏解析
177
- },
178
- placeholder: {
179
- type: String,
180
- default: null,
181
- },
182
- // 下拉框配置宽度
183
- optionWidth: {
184
- default: 0,
185
- },
186
- },
187
- // 是否是页面预览, 从页面管理传递
188
- inject: {
189
- isPageInfo: {value: 'isPageInfo', default: false},
190
- },
191
- data() {
192
- const myProps = Object.assign({}, this.baseProps)
193
- let markValue
194
- if (this.entity) {
195
- markValue = JSON.stringify(this.entity)
196
- }
197
- let lastValues = []
198
- if (this.baseProps.multiple !== undefined && this.baseProps.multiple === true) {
199
- if (this.value !== undefined && this.value !== null && this.value && Array.isArray(this.value)) {
200
- lastValues = JSON.parse(JSON.stringify(this.value))
201
- }
202
- }
203
- return {
204
- /**
205
- * 用于回显动态数据源选择的默认值,因为初始进入编辑状态时,没有获取映射关系,
206
- * 如果当前字段是保存的label值则无法确定当前选项组的值对应哪一个,导致row中的对应字段变成了空值,所以备份一份
207
- * 然后在获取动态数据源选项组后,给上默认值
208
- */
209
- markValue,
210
- optionItems: [],
211
- myProps,
212
- valueSetOptions: [], // 字段映射集合配置
213
- dynamicDataSourceCode: '', // 动态数据源编码
214
- loading: false, // 是否在加载
215
- valueAttribute: null, // 选项值字段,即控制下拉框组件的value-key属性的
216
- remote: false, // 是否是远程搜索
217
- additionalParameterStr: this.options.additionalParameter, // 附加参数json字符串
218
- isLoaded: false, // 动态数据源是否直接显示静态页面
219
- watchAttr: null, // 监控的entity属性名,多个属性名逗号分隔。即当该属性修改时,需要走后台重新获得当前下拉选的选项集合
220
- backendUrl: null, // 后台访问路径
221
- descriptionAttribute: null,
222
- queryParam: {}, // 请求参数,
223
- lastValues // 最后一次的value值,用于判断是否是增加元素
224
- }
225
- },
226
- watch: {
227
- baseProps: {
228
- deep: true,
229
- handler(newModels) {
230
- this.myProps = Object.assign({}, newModels)
231
- },
232
- },
233
- },
234
- created() {
235
- if (this.options && this.options.dynamicDataSourceCode) {
236
- this.dynamicDataSourceCode = this.options.dynamicDataSourceCode.trim()
237
- const param = {
238
- _listCode: this.listCode,
239
- _formCode: this.formCode,
240
- _tableName: this.tableName,
241
- }
242
- if (this.parent) {
243
- param.parent = this.parent
244
- }
245
- if (!this.isPageInfo) {
246
- this.packageDynamicDataSourceInfo(this.dynamicDataSourceCode, param)
247
- .then((dynamicDataSourceDto) => {
248
- // console.log('UI获取的数据', dynamicDataSourceDto)
249
- if (dynamicDataSourceDto.backendUrl) {
250
- this.backendUrl = dynamicDataSourceDto.backendUrl
251
- }
252
- if (
253
- dynamicDataSourceDto.fuzzyQuery !== undefined &&
254
- dynamicDataSourceDto.fuzzyQuery === true
255
- ) {
256
- // 是否启用远程搜索
257
- this.remote = true
258
- }
259
- if (this.options && this.options.valueSetOptions) {
260
- this.valueSetOptions = this.options.valueSetOptions
261
- }
262
- if (
263
- this.options &&
264
- this.options.isSql !== undefined &&
265
- this.options.isSql !== null
266
- ) {
267
- this.isSql = this.options.isSql
268
- }
269
- if (this.watchAttr) {
270
- let initWatchValue
271
- const watchAttrs = this.watchAttr.split(',')
272
- watchAttrs.forEach((attr) => {
273
- // 初始化下拉选内容
274
- if (this.entity) {
275
- initWatchValue = this.entity[attr]
276
- }
277
- this.$watch('entity.' + attr, function (newValue, oldValue) {
278
- this.watchAttrValueChange(newValue)
279
- // this.inputValue('')
280
- const items = this.optionItems.filter(
281
- (item) => item[this.valueAttribute] === newValue
282
- )
283
- if (!items) {
284
- this.inputValue('')
285
- }
286
- })
287
- })
288
- this.watchAttrValueChange(initWatchValue)
289
- }
290
- this.isLoaded = true
291
- // // 解决当监控值变化时,数据源重新加载后select输入框中显示的值和下拉中的值不一致问题
292
- // if (this.baseProps.multiple !== undefined && this.baseProps.multiple === true) {
293
- // this.$nextTick(() => {
294
- // // this.$refs['dynamicDataSourceRef'].setSelected()
295
- // })
296
- // }
297
- // 默认选中处理
298
- if (dynamicDataSourceDto.defaultSelect) {
299
- // 多选处理
300
- /**
87
+ name: 'DynamicSourceSelect',
88
+ components: {},
89
+ model: {
90
+ prop: 'value',
91
+ event: 'input'
92
+ },
93
+ props: {
94
+ // 字段配置 只有列表行编辑时候才用
95
+ column: {
96
+ type: Object,
97
+ default: null
98
+ },
99
+ value: {
100
+ type: [String, Boolean, Number, Array],
101
+ default: null
102
+ },
103
+ baseProps: {
104
+ type: Object,
105
+ default: null
106
+ },
107
+ entity: {
108
+ type: Object,
109
+ default: null
110
+ },
111
+ // dynamicDataSourceCode、valueSetOptions、isSql(默认是false,在配置系统中使用时需要是true)、additionalParameter( json字符串)
112
+ options: {
113
+ type: Object,
114
+ default: null
115
+ },
116
+ // 列表组件行编辑使用,sql查询时数据表名称,用于自定义系统中列表组件中字段多表查询带有别名时,将点"."改成两个下划线"__"时使用
117
+ tableName: {
118
+ type: String,
119
+ default: null
120
+ },
121
+ // 列表组件行编辑使用,是否是关联表,用于确定属性名是否需要拼接tableName
122
+ isJoinTable: {
123
+ type: Boolean,
124
+ default: false
125
+ },
126
+ // 子表行编辑时,父表单数据
127
+ parent: {
128
+ type: Object,
129
+ default: null
130
+ },
131
+ // 所在的列表编码
132
+ listCode: {
133
+ type: String,
134
+ default: null
135
+ },
136
+ // 所在的表单编码
137
+ formCode: {
138
+ type: String,
139
+ default: null
140
+ },
141
+ listToolbarFormData: {
142
+ type: Object,
143
+ default: () => {
144
+ return {}
145
+ }
146
+ },
147
+ fullWidth: {
148
+ type: Boolean,
149
+ default: true
150
+ },
151
+ clearable: {
152
+ type: Boolean,
153
+ default: true
154
+ },
155
+ size: {
156
+ type: String,
157
+ default: 'default'
158
+ },
159
+ allowCreate: {
160
+ type: Boolean,
161
+ default: false
162
+ },
163
+ analysisArea: {
164
+ type: Number,
165
+ default: null
166
+ // 1 为工具栏解析
167
+ },
168
+ placeholder: {
169
+ type: String,
170
+ default: null
171
+ },
172
+ // 下拉框配置宽度
173
+ optionWidth: {
174
+ default: 0
175
+ }
176
+ },
177
+ // 是否是页面预览, 从页面管理传递
178
+ inject: {
179
+ isPageInfo: { value: 'isPageInfo', default: false }
180
+ },
181
+ data() {
182
+ const myProps = Object.assign({}, this.baseProps)
183
+ let markValue
184
+ if (this.entity) {
185
+ markValue = JSON.stringify(this.entity)
186
+ }
187
+ let lastValues = []
188
+ if (this.baseProps.multiple !== undefined && this.baseProps.multiple === true) {
189
+ if (this.value !== undefined && this.value !== null && Array.isArray(this.value)) {
190
+ lastValues = JSON.parse(JSON.stringify(this.value))
191
+ }
192
+ }
193
+ return {
194
+ /**
195
+ * 用于回显动态数据源选择的默认值,因为初始进入编辑状态时,没有获取映射关系,
196
+ * 如果当前字段是保存的label值则无法确定当前选项组的值对应哪一个,导致row中的对应字段变成了空值,所以备份一份
197
+ * 然后在获取动态数据源选项组后,给上默认值
198
+ */
199
+ markValue,
200
+ optionItems: [],
201
+ myProps,
202
+ valueSetOptions: [], // 字段映射集合配置
203
+ dynamicDataSourceCode: '', // 动态数据源编码
204
+ loading: false, // 是否在加载
205
+ valueAttribute: null, // 选项值字段,即控制下拉框组件的value-key属性的
206
+ remote: false, // 是否是远程搜索
207
+ additionalParameterStr: this.options.additionalParameter, // 附加参数json字符串
208
+ isLoaded: false, // 动态数据源是否直接显示静态页面
209
+ watchAttr: null, // 监控的entity属性名,多个属性名逗号分隔。即当该属性修改时,需要走后台重新获得当前下拉选的选项集合
210
+ backendUrl: null, // 后台访问路径
211
+ descriptionAttribute: null,
212
+ queryParam: {}, // 请求参数,
213
+ lastValues, // 最后一次的value值,用于判断是否是增加元素
214
+ optionItemList: [] // 多选时会多一个saveAll 全选 选项
215
+ }
216
+ },
217
+ watch: {
218
+ baseProps: {
219
+ deep: true,
220
+ handler(newModels) {
221
+ this.myProps = Object.assign({}, newModels)
222
+ }
223
+ }
224
+ },
225
+ created() {
226
+ if (this.options && this.options.backendUrl) {
227
+ this.backendUrl = this.options.backendUrl
228
+ }
229
+ if (this.options && this.options.dynamicDataSourceCode) {
230
+ this.dynamicDataSourceCode = this.options.dynamicDataSourceCode.trim()
231
+ const param = {
232
+ _listCode: this.listCode,
233
+ _formCode: this.formCode,
234
+ _tableName: this.tableName
235
+ }
236
+ if (this.parent) {
237
+ param.parent = this.parent
238
+ }
239
+ if (!this.isPageInfo) {
240
+ this.packageDynamicDataSourceInfo(this.dynamicDataSourceCode, param)
241
+ .then((dynamicDataSourceDto) => {
242
+ // console.log('UI获取的数据', dynamicDataSourceDto)
243
+ if (dynamicDataSourceDto.backendUrl) {
244
+ this.backendUrl = dynamicDataSourceDto.backendUrl
245
+ }
246
+ if (dynamicDataSourceDto.fuzzyQuery !== undefined && dynamicDataSourceDto.fuzzyQuery === true) {
247
+ // 是否启用远程搜索
248
+ this.remote = true
249
+ }
250
+ if (this.options && this.options.valueSetOptions) {
251
+ this.valueSetOptions = this.options.valueSetOptions
252
+ }
253
+ if (this.options && this.options.isSql !== undefined && this.options.isSql !== null) {
254
+ this.isSql = this.options.isSql
255
+ }
256
+ if (this.watchAttr) {
257
+ let initWatchValue
258
+ const watchAttrs = this.watchAttr.split(',')
259
+ watchAttrs.forEach((attr) => {
260
+ // 初始化下拉选内容
261
+ if (this.entity) {
262
+ initWatchValue = this.entity[attr]
263
+ }
264
+ this.$watch('entity.' + attr, function (newValue, oldValue) {
265
+ this.watchAttrValueChange(newValue)
266
+ // this.inputValue('')
267
+ const items = this.optionItems.filter((item) => item[this.valueAttribute] === newValue)
268
+ if (!items) {
269
+ this.inputValue('')
270
+ }
271
+ })
272
+ })
273
+ this.watchAttrValueChange(initWatchValue)
274
+ }
275
+ this.isLoaded = true
276
+ // // 解决当监控值变化时,数据源重新加载后select输入框中显示的值和下拉中的值不一致问题
277
+ // if (this.baseProps.multiple !== undefined && this.baseProps.multiple === true) {
278
+ // this.$nextTick(() => {
279
+ // // this.$refs['dynamicDataSourceRef'].setSelected()
280
+ // })
281
+ // }
282
+ // 默认选中处理
283
+ if (
284
+ dynamicDataSourceDto.defaultSelect &&
285
+ (this.value === undefined || this.value === null || this.value === '')
286
+ ) {
287
+ // 多选处理
288
+ /**
301
289
  if (this.baseProps.multiple) {
302
290
  this.$emit('set-default-value', [
303
291
  this.optionItems[0][this.valueAttribute],
@@ -311,549 +299,557 @@ export default {
311
299
  )
312
300
  }
313
301
  } */
314
- this.setValues(this.optionItems[0][this.valueAttribute])
315
- }
316
- // console.log('判断参数',this.analysisArea);
317
- // console.log('判断参数',this.remote);
318
- if (this.analysisArea !== 1 && this.remote) {
319
- // 传递初始化查询供重置用
320
- const that = this
321
- $on(eventBus, 'remoteMethod', () => {
322
- that.remoteMethod('')
323
- })
324
- // console.log('传递了参数');
325
- }
326
- this.$emit('load-completed', dynamicDataSourceDto)
327
- })
328
- .catch((error) => {
329
- console.log(error)
330
- this.$emit('load-completed', {
331
- code: this.dynamicDataSourceCode,
332
- error: error,
333
- })
334
- this.isLoaded = true
335
- })
336
- }
337
- } else {
338
- this.isLoaded = true
339
- }
340
- },
341
- methods: {
342
- ...dynamicSourceSelectService,
343
- ...events,
344
- blurEvent(event) {
345
- // // 解决当监控值变化时,数据源重新加载后select输入框中显示的值和下拉中的值不一致问题
346
- // if (this.baseProps.multiple !== undefined && this.baseProps.multiple === false) {
347
- // this.$nextTick(() => {
348
- // // this.$refs['dynamicDataSourceRef'].setSelected()
349
- // })
350
- // }
351
- this.$emit('blur', event)
352
- },
353
- changeEvent(newValue){
354
- this.inputValue(newValue)
355
- this.$emit('change', newValue)
356
- },
357
- /**
358
- * @description: 获取提示标题
359
- * @Date: 2023-08-04 10:04:42
360
- * @param {*}
361
- * @return {*}
362
- */
363
- getClassOptionTitle(val) {
364
- if (val !== null && val !== undefined && val !== '' && val.length > 0) {
365
- let selectTittle = ''
366
- if (typeof val === 'string') {
367
- // 单选
368
- if (this.descriptionAttribute) {
369
- this.optionItems.forEach((item) => {
370
- if (item[this.valueAttribute] === val) {
371
- selectTittle = item._label_ + item._description_
372
- }
373
- })
374
- } else {
375
- this.optionItems.forEach((Ttem) => {
376
- if (Ttem[this.valueAttribute] === val) {
377
- selectTittle = Ttem._label_
378
- }
379
- })
380
- }
381
- } else {
382
- // 多选
383
- if (this.descriptionAttribute) {
384
- this.optionItems.forEach((item) => {
385
- val.forEach((Vtem) => {
386
- if (item[this.valueAttribute] === Vtem) {
387
- selectTittle = selectTittle + item._label_ + ','
388
- }
389
- })
390
- })
391
- selectTittle = selectTittle.slice(0, selectTittle.length - 1)
392
- } else {
393
- this.optionItems.forEach((Ttem) => {
394
- val.forEach((Vtem) => {
395
- if (Ttem[this.valueAttribute] === Vtem) {
396
- selectTittle = selectTittle + Ttem._label_ + ','
397
- }
398
- })
399
- })
400
- selectTittle = selectTittle.slice(0, selectTittle.length - 1)
401
- }
402
- }
403
- return selectTittle
404
- }
405
- },
406
- // 必须有该方法,否则无法给字段赋值
407
- inputValue(newValue) {
408
- this.$emit('update:value', newValue)
409
- if (this.remote && (newValue === null || newValue === undefined || newValue === '')) {
410
- this.remoteQueryMethod(newValue)
411
- }
412
- this.setValues(newValue)
413
- },
414
- packageDynamicDataSourceInfo(dynamicDataSourceCode, param) {
415
- return new Promise((resolve, reject) => {
416
- this.findDynamicDataSourceByCode(
417
- dynamicDataSourceCode,
418
- this.entity,
419
- param,
420
- this.additionalParameterStr,
421
- this.backendUrl
422
- )
423
- .then((dynamicDataSourceDto) => {
424
- if (dynamicDataSourceDto) {
425
- if (dynamicDataSourceDto.options) {
426
- this.optionItems = dynamicDataSourceDto.options
427
- // if (this.watchAttr) {
428
- // // 解决当监控值变化时,数据源重新加载后select输入框中显示的值和下拉中的值不一致问题
429
- // if (
430
- // this.baseProps.multiple !== undefined &&
431
- // this.baseProps.multiple === true
432
- // ) {
433
- // this.$nextTick(() => {
434
- // // this.$refs['dynamicDataSourceRef'].setSelected()
435
- // })
436
- // }
437
- // }
438
- //
439
- if (this.column) {
440
- // 只有行编辑时处理
441
- // 设置选项组数据、 选项组值字段、 映射关系
442
- if (
443
- this.column.prop !== dynamicDataSourceDto.valueAttribute
444
- ) {
445
- this.column['_dynamic-source-data-' + this.column.prop] = {
446
- valueSetOptions: this.options.valueSetOptions,
447
- optionItems: this.optionItems,
448
- valueAttribute: dynamicDataSourceDto.valueAttribute,
449
- }
450
- }
451
- for (
452
- let i = 0;
453
- i < this.options.valueSetOptions.length;
454
- i++
455
- ) {
456
- const valueSetOption = this.options.valueSetOptions[i]
457
- if (
458
- dynamicDataSourceDto.valueAttribute ===
459
- valueSetOption.columnName
460
- ) {
461
- if (this.markValue) {
462
- const muMarkValue = JSON.parse(this.markValue)
463
- if (
464
- muMarkValue &&
465
- muMarkValue[valueSetOption.valueColumn.dbColumnName]
466
- ) {
467
- let targeValue = (
468
- muMarkValue[
469
- valueSetOption.valueColumn.dbColumnName
470
- ] + ''
471
- ).split(',')
472
- if (this.column.componentType === 'select') {
473
- // 如果是单选
474
- targeValue = targeValue[0]
475
- }
476
- // 不需要再赋值了 如果当前字段不上动态数据源的值字段,那就表示不需要回显
477
- // if (valueSetOption.valueColumn.dbColumnName === this.column.prop) {
478
- // this.$emit('set-value', {
479
- // value: targeValue,
480
- // targetColumnName: this.column.prop,
481
- // options: this.optionItems,
482
- // valueAttribute: this.valueAttribute
483
- // })
484
- // }
485
- }
486
- }
487
- break
488
- }
489
- }
490
- }
491
- } else {
492
- this.optionItems = []
493
- }
494
- if (dynamicDataSourceDto.valueAttribute) {
495
- this.valueAttribute = dynamicDataSourceDto.valueAttribute
496
- }
497
- if (dynamicDataSourceDto.descriptionAttribute) {
498
- this.descriptionAttribute =
499
- dynamicDataSourceDto.descriptionAttribute
500
- }
501
- this.valueAttribute = this.getValueAttribute()
502
- this.watchAttr = dynamicDataSourceDto.watchAttr
503
- this.$emit('load-completed', dynamicDataSourceDto)
504
- resolve(dynamicDataSourceDto)
505
- } else {
506
- resolve()
507
- }
508
- })
509
- .catch((error) => {
510
- reject(error)
511
- })
512
- })
513
- },
514
- // 远程搜索方法
515
- remoteQuery(searchText, watchAttrValue) {
516
- if (
517
- (searchText !== null && searchText !== undefined) ||
518
- (watchAttrValue !== null && watchAttrValue !== undefined)
519
- ) {
520
- const param = {
521
- _listCode: this.listCode,
522
- _formCode: this.formCode,
523
- _tableName: this.tableName,
524
- }
525
- if (searchText !== null && searchText !== undefined) {
526
- param.searchText = searchText
527
- }
528
- if (watchAttrValue !== null && watchAttrValue !== undefined) {
529
- // 监控的属性值改变了远程搜索方法
530
- if (
531
- Object.prototype.toString.apply(watchAttrValue) === '[object Array]'
532
- ) {
533
- param.watchAttrValue = watchAttrValue.join(',')
534
- } else {
535
- param.watchAttrValue = watchAttrValue + ''
536
- }
537
- } else if (this.entity) {
538
- // 搜索时下拉选项的集合
539
- const watchValue = this.entity[this.watchAttr]
540
- if (watchValue !== null && watchValue !== undefined) {
541
- if (
542
- Object.prototype.toString.apply(watchValue) === '[object Array]'
543
- ) {
544
- param.watchAttrValue = watchValue.join(',')
545
- } else {
546
- param.watchAttrValue = watchValue + ''
547
- }
548
- }
549
- }
550
- if (this.parent) {
551
- param.parent = this.parent
552
- }
553
- this.loading = true
554
- this.packageDynamicDataSourceInfo(this.dynamicDataSourceCode, param)
555
- .then((dynamicDataSourceDto) => {
556
- // 解决当监控值变化时,数据源重新加载后select输入框中显示的值和下拉中的值不一致问题
557
- // if (this.baseProps.multiple !== undefined && this.baseProps.multiple === true) {
558
- // this.$nextTick(() => {
559
- // // this.$refs['dynamicDataSourceRef'].setSelected()
560
- // })
561
- // }
562
- this.loading = false
563
- })
564
- .catch((error) => {
565
- console.log(error)
566
- this.loading = false
567
- })
568
- }
569
- },
570
- // 远程搜索方法
571
- remoteQueryMethod(searchText) {
572
- if (Array.isArray(this.value)) {
573
- if (this.value.length === 0) {
574
- this.remoteQuery(searchText, null)
575
- }
576
- } else {
577
- this.remoteQuery(searchText, null)
578
- }
579
- },
580
- /**
581
- * 输入框输入查询值时搜索方法,
582
- * 不使用remoteQueryMethod, 解决输入框第一次输入时可查询,第二次输入时没有触发查询方法问题
583
- * @param {*} searchText
584
- */
585
- remoteMethod(searchText) {
586
- this.remoteQuery(searchText, null)
587
- },
588
- // 监控的属性值改变了远程搜索方法
589
- watchAttrValueChange(watchAttrValues) {
590
- this.remoteQuery(null, watchAttrValues)
591
- },
592
- getValueAttribute() {
593
- return !this.valueAttribute || this.valueAttribute === '[label]'
594
- ? '_label_'
595
- : this.valueAttribute
596
- },
597
- setValues(newValue) {
598
- if (this.valueSetOptions && this.valueSetOptions.length > 0) {
599
- if (this.baseProps.multiple !== undefined && this.baseProps.multiple === true) {
600
- // 多选时
601
- this.setColumnValueWhenMulti(newValue)
602
- } else {
603
- // 单选时
604
- this.valueSetOptions.forEach((columnInfo) => {
605
- const sourceColumnName = columnInfo.columnName
606
- let value
607
- if (this.optionItems && sourceColumnName) {
608
- value = this.getTargetColumnValue(newValue, sourceColumnName)
609
- }
610
- let targetColumnName = null
611
- const targetColumnInfo = columnInfo.valueColumn
612
- if (targetColumnInfo) {
613
- targetColumnName = targetColumnInfo.name
614
- if (this.isSql === true) {
615
- targetColumnName = targetColumnInfo.dbColumnName
616
- targetColumnName = getPropNameWhenJoinTable(
617
- targetColumnName,
618
- this.isJoinTable,
619
- this.tableName
620
- )
621
- }
622
- }
623
- if (
624
- this.entity &&
625
- targetColumnName &&
626
- targetColumnName !== null &&
627
- targetColumnName !== ''
628
- ) {
629
- setEntityFieldValue(this.entity, targetColumnName, value)
630
- }
631
- const item = this.getSelectedOptionItem(newValue)
632
- this.$emit('set-value', {
633
- value: value,
634
- sourceColumnName: sourceColumnName,
635
- targetColumnName: targetColumnName,
636
- options: this.optionItems,
637
- valueAttribute: this.valueAttribute,
638
- selectedItem: item,
639
- })
640
- })
641
- }
642
- }
643
- },
644
- // 设置字段的值
645
- setColumnValue(sourceColumnName, value, columnInfo) {
646
- let targetColumnName = null
647
- const targetColumnInfo = columnInfo.valueColumn
648
- if (targetColumnInfo) {
649
- targetColumnName = targetColumnInfo.name
650
- if (this.isSql === true) {
651
- targetColumnName = targetColumnInfo.dbColumnName
652
- targetColumnName = getPropNameWhenJoinTable(
653
- targetColumnName,
654
- this.isJoinTable,
655
- this.tableName
656
- )
657
- }
658
- }
659
- if (
660
- this.entity &&
661
- targetColumnName &&
662
- targetColumnName !== null &&
663
- targetColumnName !== ''
664
- ) {
665
- setEntityFieldValue(this.entity, targetColumnName, value)
666
- }
667
- this.$emit('set-value', {
668
- value: value,
669
- sourceColumnName: sourceColumnName,
670
- targetColumnName: targetColumnName,
671
- options: this.optionItems,
672
- valueAttribute: this.valueAttribute
673
- })
674
- },
675
- // 多选下拉框时处理增加tag、减少tag时,映射字段赋值问题
676
- setColumnValueWhenMulti(newValue) {
677
- // 是否添加tag
678
- let isAddTag = false
679
- let removeTag
680
- this.valueSetOptions.forEach(columnInfo => {
681
- const sourceColumnName = columnInfo.columnName
682
- if (sourceColumnName === this.valueAttribute) {
683
- // 是当前下拉选组件对应的字段时,才需要走该方法
684
- // 字段的值
685
- let value
686
- if (this.optionItems && sourceColumnName) {
687
- value = this.getTargetColumnValue(newValue, sourceColumnName)
688
- }
689
- this.setColumnValue(sourceColumnName, value, columnInfo)
690
- if (this.lastValues.length < newValue.length) {
691
- // 表示是增加tag
692
- isAddTag = true
693
- } else if (this.lastValues.length > newValue.length) {
694
- // 表示减少tag
695
- isAddTag = false
696
- const totalArr = [...this.lastValues, ...newValue]
697
- const totalSet = new Set(totalArr)
698
- const arr = Array.from(totalSet)
699
- const removeTagArr = [...arr.filter(item => !this.lastValues.includes(item)), ...arr.filter(item => !newValue.includes(item))]
700
- if (removeTagArr && removeTagArr.length > 0) {
701
- removeTag = removeTagArr[0]
702
- }
703
- }
704
- this.lastValues = JSON.parse(JSON.stringify(newValue))
705
- // 跳出forEach循环
706
-
707
- }
708
- })
709
- if (isAddTag) {
710
- // 表示是增加tag
711
- const isRemove = false
712
- const lastSelectTag = newValue[newValue.length - 1]
713
- const items = this.optionItems.filter(
714
- item => item[this.valueAttribute] === lastSelectTag
715
- )
716
- if (items && items.length > 0) {
717
- this.setTagValue(null, isRemove, items[0])
718
- }
719
- } else {
720
- // 表示是减少tag
721
- const isRemove = true
722
- this.setTagValue(removeTag, isRemove)
723
- }
724
- },
725
- // 根据tag参数设置映射字段的值
726
- setTagValue(tag, isRemove, selectItem) {
727
- if (this.valueSetOptions && this.valueSetOptions.length > 0) {
728
- this.valueSetOptions.forEach(columnInfo => {
729
- const sourceColumnName = columnInfo.columnName
730
- if (sourceColumnName !== this.valueAttribute) {
731
- let targetColumnName = null
732
- const targetColumnInfo = columnInfo.valueColumn
733
- if (targetColumnInfo) {
734
- targetColumnName = targetColumnInfo.name
735
- if (this.isSql === true) {
736
- targetColumnName = targetColumnInfo.dbColumnName
737
- targetColumnName = getPropNameWhenJoinTable(
738
- targetColumnName,
739
- this.isJoinTable,
740
- this.tableName
741
- )
742
- }
743
- }
744
- let value
745
- if (targetColumnName) {
746
- const originalValue = getEntityFieldValue(this.entity, targetColumnName)
747
- if (isRemove) {
748
- // 移除tag
749
- const index = this.value.indexOf(tag)
750
- if (originalValue !== undefined && originalValue !== null && originalValue !== '') {
751
- const originalVals = originalValue.split(',')
752
- originalVals.splice(index, 1)
753
- value = originalVals.join(',')
754
- }
755
- } else {
756
- // 添加tag
757
- let addValue
758
- if (selectItem) {
759
- addValue = selectItem[sourceColumnName]
760
- }
761
- if (originalValue !== undefined && originalValue !== null && originalValue !== '') {
762
- value = originalValue + ',' + addValue
763
- } else {
764
- value = addValue
765
- }
766
- }
767
- }
768
- if (
769
- this.entity &&
770
- targetColumnName &&
771
- targetColumnName !== null &&
772
- targetColumnName !== ''
773
- ) {
774
- setEntityFieldValue(this.entity, targetColumnName, value)
775
- }
776
- this.$emit('set-value', {
777
- value: value,
778
- sourceColumnName: sourceColumnName,
779
- targetColumnName: targetColumnName,
780
- options: this.optionItems,
781
- valueAttribute: this.valueAttribute
782
- })
783
- }
784
- })
785
- }
786
- },
787
- // 获得目的字段的值
788
- getTargetColumnValue(newValue, sourceColumnName) {
789
- if (newValue) {
790
- let value = ''
791
- if (
792
- this.baseProps.multiple !== undefined &&
793
- this.baseProps.multiple === true &&
794
- Array.isArray(newValue)
795
- ) {
796
- // 多选值处理,数组信息,使用逗号分开的格式设置其它字段的值
797
- let i = 0
798
- newValue.forEach((itemValue) => {
799
- const items = this.optionItems.filter(
800
- (item) => item[this.valueAttribute] === itemValue
801
- )
802
- if (items && items.length > 0) {
803
- value += items[0][sourceColumnName]
804
- if (i < newValue.length - 1) {
805
- // 最后一个元素不加逗号
806
- value += ','
807
- }
808
- i++
809
- }
810
- })
811
- } else {
812
- // 单选
813
- const items = this.optionItems.filter(
814
- (item) => item[this.valueAttribute] === newValue
815
- )
816
- if (items && items.length > 0) {
817
- value = items[0][sourceColumnName]
818
- }
819
- }
820
- return value
821
- }
822
- },
823
- // 移除所有tag和clear时候清除markValue的值解决清除选项时关联字段清空了但是当前动态数据源控件仍然有值问题
824
- clearMarkValue() {
825
- if (this.markValue && this.entity) {
826
- const muMarkValue = JSON.parse(this.markValue)
827
- for (let i = 0; i < this.options.valueSetOptions.length; i++) {
828
- const valueSetOption = this.options.valueSetOptions[i]
829
- muMarkValue[valueSetOption.valueColumn.dbColumnName] = null
830
- }
831
- this.markValue = JSON.stringify(muMarkValue)
832
- }
833
- },
834
- },
835
- emits: [
836
- 'set-default-value',
837
- 'load-completed',
838
- 'update:value',
839
- 'set-value',
840
- 'update:value',
841
- 'focus',
842
- 'blur',
843
- 'visible-change',
844
- 'change'
845
- ],
302
+ this.setValues(this.optionItems[0][this.valueAttribute])
303
+ }
304
+ // console.log('判断参数',this.analysisArea);
305
+ // console.log('判断参数',this.remote);
306
+ if (this.analysisArea !== 1 && this.remote) {
307
+ // 传递初始化查询供重置用
308
+ const that = this
309
+ $on(eventBus, 'remoteMethod', () => {
310
+ that.remoteMethod('')
311
+ })
312
+ // console.log('传递了参数');
313
+ }
314
+ this.$emit('load-completed', dynamicDataSourceDto)
315
+ })
316
+ .catch((error) => {
317
+ console.log(error)
318
+ this.$emit('load-completed', {
319
+ code: this.dynamicDataSourceCode,
320
+ error: error
321
+ })
322
+ this.isLoaded = true
323
+ })
324
+ }
325
+ } else {
326
+ this.isLoaded = true
327
+ }
328
+ },
329
+ methods: {
330
+ ...dynamicSourceSelectService,
331
+ ...events,
332
+ blurEvent(event) {
333
+ // // 解决当监控值变化时,数据源重新加载后select输入框中显示的值和下拉中的值不一致问题
334
+ // if (this.baseProps.multiple !== undefined && this.baseProps.multiple === false) {
335
+ // this.$nextTick(() => {
336
+ // // this.$refs['dynamicDataSourceRef'].setSelected()
337
+ // })
338
+ // }
339
+ this.$emit('blur', event)
340
+ },
341
+ changeEvent(newValue) {
342
+ this.inputValue(newValue)
343
+ this.change(newValue)
344
+ },
345
+ /**
346
+ * @description: 获取提示标题
347
+ * @Date: 2023-08-04 10:04:42
348
+ * @param {*}
349
+ * @return {*}
350
+ */
351
+ getClassOptionTitle(val) {
352
+ if (val !== null && val !== undefined && val !== '' && val.length > 0) {
353
+ let selectTittle = ''
354
+ if (typeof val === 'string') {
355
+ // 单选
356
+ if (this.descriptionAttribute) {
357
+ this.optionItems.forEach((item) => {
358
+ if (item[this.valueAttribute] === val) {
359
+ selectTittle = item._label_ + item._description_
360
+ }
361
+ })
362
+ } else {
363
+ this.optionItems.forEach((Ttem) => {
364
+ if (Ttem[this.valueAttribute] === val) {
365
+ selectTittle = Ttem._label_
366
+ }
367
+ })
368
+ }
369
+ } else {
370
+ // 多选
371
+ if (this.descriptionAttribute) {
372
+ this.optionItems.forEach((item) => {
373
+ val.forEach((Vtem) => {
374
+ if (item[this.valueAttribute] === Vtem) {
375
+ selectTittle = selectTittle + item._label_ + ','
376
+ }
377
+ })
378
+ })
379
+ selectTittle = selectTittle.slice(0, selectTittle.length - 1)
380
+ } else {
381
+ this.optionItems.forEach((Ttem) => {
382
+ val.forEach((Vtem) => {
383
+ if (Ttem[this.valueAttribute] === Vtem) {
384
+ selectTittle = selectTittle + Ttem._label_ + ','
385
+ }
386
+ })
387
+ })
388
+ selectTittle = selectTittle.slice(0, selectTittle.length - 1)
389
+ }
390
+ }
391
+ return selectTittle
392
+ }
393
+ },
394
+ // 必须有该方法,否则无法给字段赋值
395
+ inputValue(newValue) {
396
+ let isClickSaveAll = false
397
+ if (
398
+ this.baseProps.multiple !== undefined &&
399
+ this.baseProps.multiple === true &&
400
+ newValue &&
401
+ newValue.indexOf('saveAll') >= 0
402
+ ) {
403
+ // 表示点击了全选选项
404
+ isClickSaveAll = true
405
+ if (newValue.length - 1 >= this.optionItems.length) {
406
+ // 表示需要取消全选
407
+ newValue = []
408
+ } else {
409
+ // 表示需要全选
410
+ const allValues = []
411
+ for (let i = 0; i < this.optionItems.length; i++) {
412
+ const item = this.optionItems[i]
413
+ allValues.push(item[this.valueAttribute])
414
+ }
415
+ newValue = allValues
416
+ }
417
+ }
418
+ this.$emit('update:value', newValue)
419
+ if (this.remote && (newValue === null || newValue === undefined || newValue === '')) {
420
+ this.remoteQueryMethod(newValue)
421
+ }
422
+ this.setValues(newValue, isClickSaveAll)
423
+ },
424
+ packageDynamicDataSourceInfo(dynamicDataSourceCode, param) {
425
+ return new Promise((resolve, reject) => {
426
+ this.findDynamicDataSourceByCode(
427
+ dynamicDataSourceCode,
428
+ this.entity,
429
+ param,
430
+ this.additionalParameterStr,
431
+ this.backendUrl
432
+ )
433
+ .then((dynamicDataSourceDto) => {
434
+ if (dynamicDataSourceDto) {
435
+ if (dynamicDataSourceDto.options) {
436
+ this.optionItems = dynamicDataSourceDto.options
437
+ let optionsResult = dynamicDataSourceDto.options
438
+ if (
439
+ this.baseProps.multiple !== undefined &&
440
+ this.baseProps.multiple === true &&
441
+ optionsResult &&
442
+ optionsResult.length > 0
443
+ ) {
444
+ const saveAll = { value: 'saveAll', _label_: this.$t('superGrid.selectAll') }
445
+ optionsResult = [saveAll, ...optionsResult]
446
+ }
447
+ this.optionItemList = optionsResult
448
+ if (this.column) {
449
+ // 只有行编辑时处理 主要为了当前字段不是动态数据源值字段时的回显问题
450
+ // 设置选项组数据、 选项组值字段、 映射关系
451
+ if (this.column.prop !== dynamicDataSourceDto.valueAttribute) {
452
+ this.column['_dynamic-source-data-' + this.column.prop] = {
453
+ valueSetOptions: this.options.valueSetOptions,
454
+ optionItems: this.optionItems,
455
+ valueAttribute: dynamicDataSourceDto.valueAttribute
456
+ }
457
+ // 获取值字段的映射设置关系, 根据关系获取当前行字段中保存的值字段对应的值
458
+ const valueSetItem = this.options.valueSetOptions.find(
459
+ (item) => item.columnName === dynamicDataSourceDto.valueAttribute
460
+ )
461
+ if (valueSetItem) {
462
+ // 值字段的选项值
463
+ let valueAttributeValue = this.entity[valueSetItem.valueColumn.dbColumnName]
464
+ if (valueAttributeValue) {
465
+ this.$emit('set-value', {
466
+ value: valueAttributeValue,
467
+ targetColumnName: this.column.prop,
468
+ options: this.optionItems,
469
+ valueAttribute: this.valueAttribute
470
+ })
471
+ }
472
+ }
473
+ }
474
+ }
475
+ } else {
476
+ this.optionItems = []
477
+ }
478
+ if (dynamicDataSourceDto.valueAttribute) {
479
+ this.valueAttribute = dynamicDataSourceDto.valueAttribute
480
+ }
481
+ if (dynamicDataSourceDto.descriptionAttribute) {
482
+ this.descriptionAttribute = dynamicDataSourceDto.descriptionAttribute
483
+ }
484
+ this.valueAttribute = this.getValueAttribute()
485
+ this.watchAttr = dynamicDataSourceDto.watchAttr
486
+ this.$emit('load-completed', dynamicDataSourceDto)
487
+ resolve(dynamicDataSourceDto)
488
+ } else {
489
+ resolve()
490
+ }
491
+ })
492
+ .catch((error) => {
493
+ reject(error)
494
+ })
495
+ })
496
+ },
497
+ // 远程搜索方法
498
+ remoteQuery(searchText, watchAttrValue) {
499
+ if (
500
+ (searchText !== null && searchText !== undefined) ||
501
+ (watchAttrValue !== null && watchAttrValue !== undefined)
502
+ ) {
503
+ const param = {
504
+ _listCode: this.listCode,
505
+ _formCode: this.formCode,
506
+ _tableName: this.tableName
507
+ }
508
+ if (searchText !== null && searchText !== undefined) {
509
+ param.searchText = searchText
510
+ }
511
+ if (watchAttrValue !== null && watchAttrValue !== undefined) {
512
+ // 监控的属性值改变了远程搜索方法
513
+ if (Object.prototype.toString.apply(watchAttrValue) === '[object Array]') {
514
+ param.watchAttrValue = watchAttrValue.join(',')
515
+ } else {
516
+ param.watchAttrValue = watchAttrValue + ''
517
+ }
518
+ } else if (this.entity) {
519
+ // 搜索时下拉选项的集合
520
+ const watchValue = this.entity[this.watchAttr]
521
+ if (watchValue !== null && watchValue !== undefined) {
522
+ if (Object.prototype.toString.apply(watchValue) === '[object Array]') {
523
+ param.watchAttrValue = watchValue.join(',')
524
+ } else {
525
+ param.watchAttrValue = watchValue + ''
526
+ }
527
+ }
528
+ }
529
+ if (this.parent) {
530
+ param.parent = this.parent
531
+ }
532
+ this.loading = true
533
+ this.packageDynamicDataSourceInfo(this.dynamicDataSourceCode, param)
534
+ .then((dynamicDataSourceDto) => {
535
+ // 解决当监控值变化时,数据源重新加载后select输入框中显示的值和下拉中的值不一致问题
536
+ // if (this.baseProps.multiple !== undefined && this.baseProps.multiple === true) {
537
+ // this.$nextTick(() => {
538
+ // // this.$refs['dynamicDataSourceRef'].setSelected()
539
+ // })
540
+ // }
541
+ this.loading = false
542
+ })
543
+ .catch((error) => {
544
+ console.log(error)
545
+ this.loading = false
546
+ })
547
+ }
548
+ },
549
+ // 远程搜索方法
550
+ remoteQueryMethod(searchText) {
551
+ if (Array.isArray(this.value)) {
552
+ if (this.value.length === 0) {
553
+ this.remoteQuery(searchText, null)
554
+ }
555
+ } else {
556
+ this.remoteQuery(searchText, null)
557
+ }
558
+ },
559
+ /**
560
+ * 输入框输入查询值时搜索方法,
561
+ * 不使用remoteQueryMethod, 解决输入框第一次输入时可查询,第二次输入时没有触发查询方法问题
562
+ * @param {*} searchText
563
+ */
564
+ remoteMethod(searchText) {
565
+ this.remoteQuery(searchText, null)
566
+ },
567
+ // 监控的属性值改变了远程搜索方法
568
+ watchAttrValueChange(watchAttrValues) {
569
+ this.remoteQuery(null, watchAttrValues)
570
+ },
571
+ getValueAttribute() {
572
+ return !this.valueAttribute || this.valueAttribute === '[label]' ? '_label_' : this.valueAttribute
573
+ },
574
+ setValues(newValue, isClickSaveAll) {
575
+ if (this.valueSetOptions && this.valueSetOptions.length > 0) {
576
+ if (this.baseProps.multiple !== undefined && this.baseProps.multiple === true) {
577
+ // 多选时
578
+ this.setColumnValueWhenMulti(newValue, isClickSaveAll)
579
+ } else {
580
+ // 单选时
581
+ this.valueSetOptions.forEach((columnInfo) => {
582
+ const sourceColumnName = columnInfo.columnName
583
+ let value
584
+ if (this.optionItems && sourceColumnName) {
585
+ value = this.getTargetColumnValue(newValue, sourceColumnName)
586
+ }
587
+ let targetColumnName = null
588
+ const targetColumnInfo = columnInfo.valueColumn
589
+ if (targetColumnInfo) {
590
+ targetColumnName = targetColumnInfo.name
591
+ if (this.isSql === true) {
592
+ targetColumnName = targetColumnInfo.dbColumnName
593
+ targetColumnName = getPropNameWhenJoinTable(targetColumnName, this.isJoinTable, this.tableName)
594
+ }
595
+ }
596
+ if (this.entity && targetColumnName && targetColumnName !== null && targetColumnName !== '') {
597
+ setEntityFieldValue(this.entity, targetColumnName, value)
598
+ }
599
+ const item = this.getSelectedOptionItem(newValue)
600
+ this.$emit('set-value', {
601
+ value: value,
602
+ sourceColumnName: sourceColumnName,
603
+ targetColumnName: targetColumnName,
604
+ options: this.optionItems,
605
+ valueAttribute: this.valueAttribute,
606
+ selectedItem: item
607
+ })
608
+ })
609
+ }
610
+ }
611
+ },
612
+ // 设置字段的值
613
+ setColumnValue(sourceColumnName, value, columnInfo) {
614
+ let targetColumnName = null
615
+ const targetColumnInfo = columnInfo.valueColumn
616
+ if (targetColumnInfo) {
617
+ targetColumnName = targetColumnInfo.name
618
+ if (this.isSql === true) {
619
+ targetColumnName = targetColumnInfo.dbColumnName
620
+ targetColumnName = getPropNameWhenJoinTable(targetColumnName, this.isJoinTable, this.tableName)
621
+ }
622
+ }
623
+ if (this.entity && targetColumnName && targetColumnName !== null && targetColumnName !== '') {
624
+ setEntityFieldValue(this.entity, targetColumnName, value)
625
+ }
626
+ this.$emit('set-value', {
627
+ value: value,
628
+ sourceColumnName: sourceColumnName,
629
+ targetColumnName: targetColumnName,
630
+ options: this.optionItems,
631
+ valueAttribute: this.valueAttribute
632
+ })
633
+ },
634
+ // 多选下拉框时处理增加tag、减少tag时,映射字段赋值问题
635
+ setColumnValueWhenMulti(newValue, isClickSaveAll) {
636
+ // 是否添加tag
637
+ let isAddTag = false
638
+ let removeTag
639
+ this.valueSetOptions.forEach((columnInfo) => {
640
+ const sourceColumnName = columnInfo.columnName
641
+ if (sourceColumnName === this.valueAttribute) {
642
+ // 是当前下拉选组件对应的字段时,才需要走该方法
643
+ // 字段的值
644
+ let value
645
+ if (this.optionItems && sourceColumnName) {
646
+ value = this.getTargetColumnValue(newValue, sourceColumnName)
647
+ }
648
+ this.setColumnValue(sourceColumnName, value, columnInfo)
649
+ if (this.lastValues.length < newValue.length) {
650
+ // 表示是增加tag
651
+ isAddTag = true
652
+ } else if (this.lastValues.length > newValue.length) {
653
+ // 表示减少tag
654
+ isAddTag = false
655
+ const totalArr = [...this.lastValues, ...newValue]
656
+ const totalSet = new Set(totalArr)
657
+ const arr = Array.from(totalSet)
658
+ const removeTagArr = [
659
+ ...arr.filter((item) => !this.lastValues.includes(item)),
660
+ ...arr.filter((item) => !newValue.includes(item))
661
+ ]
662
+ if (removeTagArr && removeTagArr.length > 0) {
663
+ removeTag = removeTagArr[0]
664
+ }
665
+ }
666
+ this.lastValues = JSON.parse(JSON.stringify(newValue))
667
+ // 跳出forEach循环
668
+ }
669
+ })
670
+ if (isAddTag) {
671
+ // 表示是增加tag
672
+ const isRemove = false
673
+ if (isClickSaveAll) {
674
+ // 全选
675
+ this.setAllTagValue(isRemove)
676
+ } else {
677
+ const lastSelectTag = newValue[newValue.length - 1]
678
+ const items = this.optionItems.filter((item) => item[this.valueAttribute] === lastSelectTag)
679
+ if (items && items.length > 0) {
680
+ this.setTagValue(null, isRemove, items[0])
681
+ }
682
+ }
683
+ } else {
684
+ // 表示是减少tag
685
+ const isRemove = true
686
+ if (isClickSaveAll) {
687
+ this.setAllTagValue(isRemove)
688
+ } else {
689
+ this.setTagValue(removeTag, isRemove)
690
+ }
691
+ }
692
+ },
693
+ setAllTagValue(isRemove) {
694
+ if (this.valueSetOptions && this.valueSetOptions.length > 0) {
695
+ this.valueSetOptions.forEach((columnInfo) => {
696
+ const sourceColumnName = columnInfo.columnName
697
+ if (sourceColumnName !== this.valueAttribute) {
698
+ let targetColumnName = null
699
+ const targetColumnInfo = columnInfo.valueColumn
700
+ if (targetColumnInfo) {
701
+ targetColumnName = targetColumnInfo.name
702
+ if (this.isSql === true) {
703
+ targetColumnName = targetColumnInfo.dbColumnName
704
+ targetColumnName = getPropNameWhenJoinTable(targetColumnName, this.isJoinTable, this.tableName)
705
+ }
706
+ }
707
+ let value
708
+ if (targetColumnName) {
709
+ if (isRemove) {
710
+ // 移除tag
711
+ value = null
712
+ } else {
713
+ // 添加tag
714
+ let originalValue = ''
715
+ if (this.optionItems && this.optionItems.length > 0) {
716
+ this.optionItems.forEach((selectItem) => {
717
+ const addValue = selectItem[sourceColumnName]
718
+ if (originalValue !== undefined && originalValue !== null && originalValue !== '') {
719
+ originalValue = originalValue + ',' + addValue
720
+ } else {
721
+ originalValue = addValue
722
+ }
723
+ })
724
+ value = originalValue
725
+ }
726
+ }
727
+ }
728
+ this.setTargetColumnValue(sourceColumnName, targetColumnName, value)
729
+ }
730
+ })
731
+ }
732
+ },
733
+ setTargetColumnValue(sourceColumnName, targetColumnName, value) {
734
+ if (this.entity && targetColumnName && targetColumnName !== null && targetColumnName !== '') {
735
+ setEntityFieldValue(this.entity, targetColumnName, value)
736
+ }
737
+ this.$emit('set-value', {
738
+ value: value,
739
+ sourceColumnName: sourceColumnName,
740
+ targetColumnName: targetColumnName,
741
+ options: this.optionItems,
742
+ valueAttribute: this.valueAttribute
743
+ })
744
+ },
745
+ // 根据tag参数设置映射字段的值
746
+ setTagValue(tag, isRemove, selectItem) {
747
+ if (this.valueSetOptions && this.valueSetOptions.length > 0) {
748
+ this.valueSetOptions.forEach((columnInfo) => {
749
+ const sourceColumnName = columnInfo.columnName
750
+ if (sourceColumnName !== this.valueAttribute) {
751
+ let targetColumnName = null
752
+ const targetColumnInfo = columnInfo.valueColumn
753
+ if (targetColumnInfo) {
754
+ targetColumnName = targetColumnInfo.name
755
+ if (this.isSql === true) {
756
+ targetColumnName = targetColumnInfo.dbColumnName
757
+ targetColumnName = getPropNameWhenJoinTable(targetColumnName, this.isJoinTable, this.tableName)
758
+ }
759
+ }
760
+ let value
761
+ if (targetColumnName) {
762
+ const originalValue = getEntityFieldValue(this.entity, targetColumnName)
763
+ if (isRemove) {
764
+ // 移除tag
765
+ const index = this.value.indexOf(tag)
766
+ if (originalValue !== undefined && originalValue !== null && originalValue !== '') {
767
+ let originalVals = originalValue
768
+ if (typeof originalValue === 'string') {
769
+ originalVals = originalValue.split(',')
770
+ }
771
+ originalVals.splice(index, 1)
772
+ value = originalVals.join(',')
773
+ }
774
+ } else {
775
+ // 添加tag
776
+ let addValue
777
+ if (selectItem) {
778
+ addValue = selectItem[sourceColumnName]
779
+ }
780
+ if (originalValue !== undefined && originalValue !== null && originalValue !== '') {
781
+ value = originalValue + ',' + addValue
782
+ } else {
783
+ value = addValue
784
+ }
785
+ }
786
+ }
787
+ this.setTargetColumnValue(sourceColumnName, targetColumnName, value)
788
+ }
789
+ })
790
+ }
791
+ },
792
+ // 获得目的字段的值
793
+ getTargetColumnValue(newValue, sourceColumnName) {
794
+ if (newValue) {
795
+ let value = ''
796
+ if (this.baseProps.multiple !== undefined && this.baseProps.multiple === true && Array.isArray(newValue)) {
797
+ // 多选值处理,数组信息,使用逗号分开的格式设置其它字段的值
798
+ let i = 0
799
+ newValue.forEach((itemValue) => {
800
+ const items = this.optionItems.filter((item) => item[this.valueAttribute] === itemValue)
801
+ if (items && items.length > 0) {
802
+ value += items[0][sourceColumnName]
803
+ if (i < newValue.length - 1) {
804
+ // 最后一个元素不加逗号
805
+ value += ','
806
+ }
807
+ i++
808
+ }
809
+ })
810
+ } else {
811
+ // 单选
812
+ const items = this.optionItems.filter((item) => item[this.valueAttribute] === newValue)
813
+ if (items && items.length > 0) {
814
+ value = items[0][sourceColumnName]
815
+ }
816
+ }
817
+ return value
818
+ }
819
+ },
820
+ // 移除所有tag和clear时候清除markValue的值解决清除选项时关联字段清空了但是当前动态数据源控件仍然有值问题
821
+ clearMarkValue() {
822
+ if (this.markValue && this.entity) {
823
+ const muMarkValue = JSON.parse(this.markValue)
824
+ for (let i = 0; i < this.options.valueSetOptions.length; i++) {
825
+ const valueSetOption = this.options.valueSetOptions[i]
826
+ muMarkValue[valueSetOption.valueColumn.dbColumnName] = null
827
+ }
828
+ this.markValue = JSON.stringify(muMarkValue)
829
+ }
830
+ }
831
+ },
832
+ emits: [
833
+ 'set-default-value',
834
+ 'load-completed',
835
+ 'set-value',
836
+ 'update:value',
837
+ 'focus',
838
+ 'blur',
839
+ 'visible-change',
840
+ 'change'
841
+ ]
846
842
  }
847
843
  </script>
848
844
 
849
845
  <style>
850
846
  .select-top-span {
851
- width: 100%;
847
+ width: 100%;
852
848
  }
853
849
  </style>
854
850
 
855
851
  <style lang="scss" scoped>
856
852
  :deep(.el-select-dropdown__item) {
857
- display: inline-block;
853
+ display: inline-block;
858
854
  }
859
855
  </style>