@tongfun/tf-widget 0.1.20 → 0.1.21
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/README.md +49 -46
- package/lib/tf-widget.common.js +460 -416
- package/lib/tf-widget.css +1 -1
- package/lib/tf-widget.umd.js +460 -416
- package/lib/tf-widget.umd.min.js +3 -3
- package/package/svg-icon/index.js +8 -8
- package/package/svg-icon/src/SvgIcon.vue +59 -59
- package/package/t-data-list/index.js +6 -6
- package/package/t-data-list/main.vue +193 -193
- package/package/t-data-list/src/condition-input/basic.vue +31 -31
- package/package/t-data-list/src/condition-input/date.vue +106 -106
- package/package/t-data-list/src/condition-input/index.vue +100 -100
- package/package/t-data-list/src/condition-input/input.vue +31 -31
- package/package/t-data-list/src/condition-input/number.vue +115 -115
- package/package/t-data-list/src/condition-input/select.vue +86 -86
- package/package/t-data-list/src/js/fieldTypeEnum.js +10 -10
- package/package/t-data-list/src/js/operatorEnum.js +108 -108
- package/package/t-data-list/src/js/qureyParamsEnum.js +4 -4
- package/package/t-data-list/src/js/util.js +34 -34
- package/package/t-data-list/src/mixins/button-controll-mixin.js +93 -93
- package/package/t-data-list/src/pushdown/push-down.vue +158 -158
- package/package/t-data-list/src/t-list-search.vue +36 -36
- package/package/t-data-list/src/t-plan/condition-always-item.vue +143 -143
- package/package/t-data-list/src/t-plan/condition-mult-item.vue +222 -222
- package/package/t-data-list/src/t-plan/index.vue +195 -195
- package/package/t-data-list/src/t-plan/plan-content.vue +389 -389
- package/package/t-data-list/src/t-table/index.vue +129 -129
- package/package/t-data-list/src/t-table/table-group-item-edit.vue +238 -238
- package/package/t-data-list/src/t-table/table-group-item.vue +87 -87
- package/package/t-data-list/src/t-table/table-group.vue +180 -180
- package/package/t-data-list/src/t-table/table-records-header-popover.vue +246 -246
- package/package/t-data-list/src/t-table/table-records-selected.vue +159 -159
- package/package/t-data-list/src/t-table/table-records.vue +337 -337
- package/package/t-input/children/address.vue +101 -101
- package/package/t-input/children/basic-display.vue +41 -41
- package/package/t-input/children/basic.vue +253 -253
- package/package/t-input/children/date.vue +89 -89
- package/package/t-input/children/group-components/group-dialog.vue +344 -344
- package/package/t-input/children/group.vue +126 -126
- package/package/t-input/children/input.vue +72 -72
- package/package/t-input/children/number.vue +74 -74
- package/package/t-input/children/select.vue +89 -89
- package/package/t-input/children/tfile/fiile-enclosure.vue +233 -233
- package/package/t-input/index.js +7 -7
- package/package/t-input/index.vue +337 -337
- package/package/t-input/tInputCache.js +24 -24
- package/package/tf-icon-picker/README.md +7 -7
- package/package/tf-icon-picker/index.js +8 -8
- package/package/tf-icon-picker/src/tf-icon-picker.vue +266 -266
- package/package/tf-layout/README.md +115 -115
- package/package/tf-layout/index.js +8 -8
- package/package/tf-layout/src/components/tf-labelbar.vue +394 -382
- package/package/tf-layout/src/components/tf-menu.vue +180 -180
- package/package/tf-layout/src/components/tf-right-menu.vue +89 -89
- package/package/tf-layout/src/components/tf-rotate-box.vue +50 -50
- package/package/tf-layout/src/tf-layout.vue +140 -120
- package/package/tf-widget/index.js +8 -8
- package/package/tf-widget/src/assets/common-input.less +10 -10
- package/package/tf-widget/src/children/basic-data/basic-data.vue +361 -361
- package/package/tf-widget/src/children/basic-data/dependcy/basic-data-selector.vue +1087 -1087
- package/package/tf-widget/src/children/basic-data/dependcy/common-table.vue +750 -750
- package/package/tf-widget/src/children/basic-data/dependcy/condition-filter.vue +519 -519
- package/package/tf-widget/src/children/basic-data/dependcy/pagination.vue +93 -93
- package/package/tf-widget/src/children/basic-data/dependcy/table-control.vue +240 -240
- package/package/tf-widget/src/children/basic-data/dependcy/view-picture.vue +108 -108
- package/package/tf-widget/src/children/date-time.vue +103 -103
- package/package/tf-widget/src/children/date.vue +103 -103
- package/package/tf-widget/src/children/decimal.vue +115 -115
- package/package/tf-widget/src/children/integer.vue +104 -104
- package/package/tf-widget/src/children/property.vue +59 -59
- package/package/tf-widget/src/children/single-line-text.vue +82 -82
- package/package/tf-widget/src/children/small-pictures.vue +223 -223
- package/package/tf-widget/src/children/text-area.vue +74 -74
- package/package/tf-widget/src/children/tf-select.vue +113 -113
- package/package/tf-widget/src/tf-widget.vue +175 -175
- package/package.json +44 -44
- package/src/api/edit.js +97 -97
- package/src/api/file-enclosure.js +26 -26
- package/src/api/push-down.js +19 -19
- package/src/api/table.js +294 -294
- package/src/api/tableV3.js +160 -160
- package/src/assets/images/icons/index.js +9 -9
- package/src/assets/images/icons/svg/add.svg +5 -5
- package/src/assets/images/icons/svg/push-down.svg +1 -1
- package/src/assets/images/icons/svg/remove.svg +1 -1
- package/src/assets/styles/common-table.less +202 -202
- package/src/directives/debounce.js +24 -24
- package/src/index.js +31 -31
- package/src/mixins/t-data-query-mixin.js +290 -290
- package/src/utils/auth.js +22 -22
- package/src/utils/request.js +42 -42
- package/src/utils/stato-anormale.js +59 -59
- package/src/utils/utils.js +109 -109
- package/src/utils/validate.js +84 -84
|
@@ -1,290 +1,290 @@
|
|
|
1
|
-
import { getTableData, getTableSum, getTableLayout } from '@/api/tableV3.js'
|
|
2
|
-
import { getOperator } from '../../package/t-data-list/src/js/util'
|
|
3
|
-
export default {
|
|
4
|
-
data () {
|
|
5
|
-
return {
|
|
6
|
-
/**
|
|
7
|
-
* 通用过滤查询参数
|
|
8
|
-
*/
|
|
9
|
-
// 被指定为搜索建议的查询的字段列表
|
|
10
|
-
suggestFieldList: [],
|
|
11
|
-
// 搜索建议的高级条件
|
|
12
|
-
searchSuggestCondition: [],
|
|
13
|
-
// 方案切换的高级条件
|
|
14
|
-
queryPlanCondition: [],
|
|
15
|
-
|
|
16
|
-
// 数据查询接口的参数
|
|
17
|
-
query: {
|
|
18
|
-
// 常用条件
|
|
19
|
-
conditionAlwaysList: [],
|
|
20
|
-
// 分组条件
|
|
21
|
-
conditionGroup: null,
|
|
22
|
-
// 高级过滤条件
|
|
23
|
-
conditionMultiList: [],
|
|
24
|
-
// 表头的过滤条件
|
|
25
|
-
conditionQuickList: [],
|
|
26
|
-
// 分页条件
|
|
27
|
-
pageNum: 1,
|
|
28
|
-
pageSize: 200
|
|
29
|
-
},
|
|
30
|
-
|
|
31
|
-
/**
|
|
32
|
-
* 数据查询结果相关
|
|
33
|
-
*/
|
|
34
|
-
// 列表的字段信息(表头,可能包含了表头过滤的配置信息和其他的布局信息)
|
|
35
|
-
tableLayout: [],
|
|
36
|
-
// 列表数据
|
|
37
|
-
tableData: {
|
|
38
|
-
total: 1,
|
|
39
|
-
records: []
|
|
40
|
-
},
|
|
41
|
-
// 列表底部合计
|
|
42
|
-
tableSum: ['合计'],
|
|
43
|
-
|
|
44
|
-
/**
|
|
45
|
-
* 列表操作过程中使用组件变量
|
|
46
|
-
*/
|
|
47
|
-
// 被标记为id的字段,这个属性只在弹窗中才被使用
|
|
48
|
-
// 但是因为获取布局依赖了这个属性所以提取为公共属性,但是只有弹窗中才被使用
|
|
49
|
-
idField: null,
|
|
50
|
-
// 列表选中行的完整数据
|
|
51
|
-
selectedRows: [],
|
|
52
|
-
// 列表选中行的id数组
|
|
53
|
-
ids: [],
|
|
54
|
-
|
|
55
|
-
/**
|
|
56
|
-
* 通过provie传递全局数据
|
|
57
|
-
*/
|
|
58
|
-
syncData: {
|
|
59
|
-
displayField: '',
|
|
60
|
-
tableLoading: false,
|
|
61
|
-
tableSelectionClear: true // 表格数据刷新之后是否清空已选的标识
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
},
|
|
65
|
-
computed: {
|
|
66
|
-
/**
|
|
67
|
-
* 高级过滤条件由多个条件来源的数据拼凑而成,使用计算属性来达到缓存的目的
|
|
68
|
-
* 且无法确定需求上的变动是否需要动态让某个来源的条件消失,所以更改为计算属性
|
|
69
|
-
* 来源如下:
|
|
70
|
-
* 搜索建议和右上角复用搜索建议的接口的搜索框拼凑的高级过滤条件
|
|
71
|
-
* 来自限定搜索范围的条件生成的高级过滤条件
|
|
72
|
-
* 来自方案中填写点击查询按钮,或者进行切换方案的时候产生高级过滤条件
|
|
73
|
-
*/
|
|
74
|
-
multiCondition () {
|
|
75
|
-
const multiResult = []
|
|
76
|
-
// 拼接方案中的高级过滤条件
|
|
77
|
-
multiResult.push(...this.queryPlanCondition)
|
|
78
|
-
// 拼接限定查询的条件
|
|
79
|
-
multiResult.push(...this.limitationCondition)
|
|
80
|
-
|
|
81
|
-
// 搜索建议永远被拼接到最后面
|
|
82
|
-
// 并且在前面有条件的时候,将搜索建议的条件用双层括号整个进行包裹((a)(b))
|
|
83
|
-
// 避免后端sql 优先级问题导致结果不准确
|
|
84
|
-
const stillEmpty = multiResult.length === 0
|
|
85
|
-
this.searchSuggestCondition.forEach((item, index) => {
|
|
86
|
-
if (index === 0) {
|
|
87
|
-
item.leftBracket = stillEmpty ? '(' : '(('
|
|
88
|
-
}
|
|
89
|
-
if (index === multiResult.length - 1) {
|
|
90
|
-
item.rightBracket = stillEmpty ? ')' : '))'
|
|
91
|
-
}
|
|
92
|
-
})
|
|
93
|
-
multiResult.push(...this.searchSuggestCondition)
|
|
94
|
-
|
|
95
|
-
// 处理条件的排序的序号
|
|
96
|
-
multiResult.forEach((item, index) => {
|
|
97
|
-
item.sort = index
|
|
98
|
-
})
|
|
99
|
-
return multiResult
|
|
100
|
-
},
|
|
101
|
-
// 限定查询范围的条件
|
|
102
|
-
limitationCondition () {
|
|
103
|
-
if (!this.limitation) {
|
|
104
|
-
return []
|
|
105
|
-
}
|
|
106
|
-
const result = []
|
|
107
|
-
for (const key in this.limitation) {
|
|
108
|
-
const fieldItem = this.tableLayout.find(v => v.field === key)
|
|
109
|
-
if (!fieldItem) continue
|
|
110
|
-
|
|
111
|
-
let value = ''
|
|
112
|
-
if (fieldItem.componentValueType === 'PARAM_BASIC') {
|
|
113
|
-
value = this.limitation[key]?.name
|
|
114
|
-
} else if (fieldItem.componentValueType === 'PARAM_ENUM') {
|
|
115
|
-
value = this.limitation[key]?.id
|
|
116
|
-
} else {
|
|
117
|
-
value = this.limitation[key]
|
|
118
|
-
}
|
|
119
|
-
|
|
120
|
-
value && result.push(this.createMultiCondition(fieldItem, value))
|
|
121
|
-
}
|
|
122
|
-
return result
|
|
123
|
-
}
|
|
124
|
-
},
|
|
125
|
-
provide () {
|
|
126
|
-
return {
|
|
127
|
-
getDbRow: this.getDbRow,
|
|
128
|
-
target: this.target,
|
|
129
|
-
enumOptionCache: {},
|
|
130
|
-
selectedRows: this.selectedRows,
|
|
131
|
-
ids: this.ids,
|
|
132
|
-
showSummary: this.queryType === 'LIST',
|
|
133
|
-
syncData: this.syncData,
|
|
134
|
-
queryType: this.queryType
|
|
135
|
-
}
|
|
136
|
-
},
|
|
137
|
-
methods: {
|
|
138
|
-
/**
|
|
139
|
-
* 获取表单的布局
|
|
140
|
-
*/
|
|
141
|
-
async getTableLayout () {
|
|
142
|
-
const res = await getTableLayout(this.target)
|
|
143
|
-
if (res.code !== 0) {
|
|
144
|
-
return this.$message.error(res.msg)
|
|
145
|
-
}
|
|
146
|
-
this.tableLayout = res.data.sort((a, b) => a.sort - b.sort)
|
|
147
|
-
this.suggestFieldList = res.data.filter(item => item.isSuggest)
|
|
148
|
-
this.displayField = this.syncData.displayField = res.data.find(item => item.isDisplayField)?.field
|
|
149
|
-
this.idField = res.data.find(item => item.isId).field
|
|
150
|
-
},
|
|
151
|
-
|
|
152
|
-
/**
|
|
153
|
-
* 列表数据
|
|
154
|
-
* 获取列表数据有三个地方进行调用
|
|
155
|
-
* 1 搜索建议: 场景为SELECTOR ,不获取合计
|
|
156
|
-
* 2 列表中数据查询:使场景为LIST, 获取合计
|
|
157
|
-
* 3 弹窗中数据: 场景为SELECTOR,不获取合计
|
|
158
|
-
*
|
|
159
|
-
* 关于是否获取合计,还有一层判断来自获取合计的借口对场景进行判断
|
|
160
|
-
* 此函数的判断只判断针对翻页页码变化这类不获取合计,至于弹窗中还是列表中的判断,在获取合计的借口中进行判断
|
|
161
|
-
*/
|
|
162
|
-
async getTableData (isSuggest = false, getSum = false) {
|
|
163
|
-
if (!isSuggest) {
|
|
164
|
-
this.syncData.tableLoading = true
|
|
165
|
-
}
|
|
166
|
-
const queryParams = !isSuggest
|
|
167
|
-
? JSON.parse(JSON.stringify(this.query))
|
|
168
|
-
: {
|
|
169
|
-
conditionAlwaysList: [],
|
|
170
|
-
conditionGroup: null,
|
|
171
|
-
conditionMultiList: [],
|
|
172
|
-
conditionQuickList: [],
|
|
173
|
-
pageNum: 1,
|
|
174
|
-
pageSize: 20
|
|
175
|
-
}
|
|
176
|
-
|
|
177
|
-
this.enableSum && getSum && await this.getTableSum()
|
|
178
|
-
try {
|
|
179
|
-
// 查询数据之前赋值高级过滤条件
|
|
180
|
-
queryParams.conditionMultiList = this.multiCondition
|
|
181
|
-
const res = await getTableData(this.target, queryParams, this.queryType)
|
|
182
|
-
if (res.code !== 0) {
|
|
183
|
-
this.$message.error(res.msg)
|
|
184
|
-
this.syncData.tableSelectionClear = true
|
|
185
|
-
return !isSuggest ? undefined : []
|
|
186
|
-
}
|
|
187
|
-
if (isSuggest) {
|
|
188
|
-
return res.data.record
|
|
189
|
-
}
|
|
190
|
-
this.tableData.total = Number(res.data.total)
|
|
191
|
-
this.tableData.records = res.data.record
|
|
192
|
-
} catch (err) {
|
|
193
|
-
// 恢复成默认值
|
|
194
|
-
this.syncData.tableSelectionClear = true
|
|
195
|
-
} finally {
|
|
196
|
-
this.syncData.tableLoading = false
|
|
197
|
-
}
|
|
198
|
-
},
|
|
199
|
-
// 表格数据合计
|
|
200
|
-
async getTableSum () {
|
|
201
|
-
// 只有列表中显示合计,
|
|
202
|
-
if (this.queryType !== 'LIST') {
|
|
203
|
-
return
|
|
204
|
-
}
|
|
205
|
-
const params = JSON.parse(JSON.stringify(this.query))
|
|
206
|
-
delete params.pageNum
|
|
207
|
-
delete params.pageSize
|
|
208
|
-
params.conditionMultiList = this.multiCondition
|
|
209
|
-
const res = await getTableSum(this.target, params)
|
|
210
|
-
if (res.code !== 0) {
|
|
211
|
-
return this.$message.error(res.msg)
|
|
212
|
-
}
|
|
213
|
-
// 没有合计的时候后端返回空对象,有数据该对象只有一个sum属性
|
|
214
|
-
if (!res.data.sum) {
|
|
215
|
-
return
|
|
216
|
-
}
|
|
217
|
-
const sumData = res.data.sum
|
|
218
|
-
const sumArr = ['合计']
|
|
219
|
-
const tableVisibleColumn = this.tableLayout.filter(item => item.visible)
|
|
220
|
-
for (const key in sumData) {
|
|
221
|
-
const index = tableVisibleColumn.findIndex(item => item.field === key)
|
|
222
|
-
sumArr[index + 1] = sumData[key]
|
|
223
|
-
}
|
|
224
|
-
this.tableSum = sumArr
|
|
225
|
-
},
|
|
226
|
-
/**
|
|
227
|
-
* 处理条件变更和重新获取数据的逻辑
|
|
228
|
-
* @param {boolean} queryString 用户输入的内容
|
|
229
|
-
* @param {boolean} isList 分为两个场景,1:列表和弹窗中输入框 2:弹窗未打开之前的如输入框中搜索建议
|
|
230
|
-
*/
|
|
231
|
-
// 基础资料搜索建议和列表页面右上角的搜索输入框的条件处理
|
|
232
|
-
handleSuggestMultiCondition (queryString, isList = true) {
|
|
233
|
-
const conditionMultiList = []
|
|
234
|
-
for (const item of this.suggestFieldList) {
|
|
235
|
-
conditionMultiList.push(this.createMultiCondition(item, queryString, false, false))
|
|
236
|
-
}
|
|
237
|
-
this.searchSuggestCondition = conditionMultiList
|
|
238
|
-
// todo: 列表和弹窗 还有一个子分类,弹窗不进行合计调用
|
|
239
|
-
!isList
|
|
240
|
-
? this.getTableData(true, false)
|
|
241
|
-
: this.queryType === 'LIST'
|
|
242
|
-
? this.getTableData(false, true)
|
|
243
|
-
: this.getTableData(false, false)
|
|
244
|
-
},
|
|
245
|
-
/**
|
|
246
|
-
* 创建一个高级过滤条件
|
|
247
|
-
* @param {object} fieldObj 后端传递给前端的列表布局中一个字段的配置信息
|
|
248
|
-
* @param {*} value 高级过滤条件字段
|
|
249
|
-
* @param {boolean} isStrict 条件是否是严格匹配 "等于" 否则采用模糊匹配 "包含"
|
|
250
|
-
* @param {boolean} isAndRelation and还是or sql中多个条件的分隔符号
|
|
251
|
-
* @returns
|
|
252
|
-
*/
|
|
253
|
-
createMultiCondition (fieldObj, value, isStrict = true, isAndRelation = true) {
|
|
254
|
-
// isSuggest
|
|
255
|
-
const relation = isAndRelation ? 'AND' : 'OR'
|
|
256
|
-
const operator = getOperator(fieldObj.componentValueType, isStrict)?.value
|
|
257
|
-
return {
|
|
258
|
-
leftBracket: '(',
|
|
259
|
-
field: fieldObj.field,
|
|
260
|
-
fieldType: fieldObj.componentType,
|
|
261
|
-
operator,
|
|
262
|
-
sort: '',
|
|
263
|
-
value,
|
|
264
|
-
rightBracket: ')',
|
|
265
|
-
relation
|
|
266
|
-
}
|
|
267
|
-
},
|
|
268
|
-
// 每页条数变化
|
|
269
|
-
handleSizeChange (newSize) {
|
|
270
|
-
this.query.pageSize = newSize
|
|
271
|
-
this.query.pageNum = 1
|
|
272
|
-
this.getTableData(false, false)
|
|
273
|
-
},
|
|
274
|
-
// 翻页
|
|
275
|
-
handleCurrentChange (newNum) {
|
|
276
|
-
this.query.pageNum = newNum
|
|
277
|
-
this.getTableData(false, false)
|
|
278
|
-
},
|
|
279
|
-
// 分组条件改变
|
|
280
|
-
handleGroupChange (group) {
|
|
281
|
-
this.query.conditionGroup = group
|
|
282
|
-
this.getTableData(false, true)
|
|
283
|
-
},
|
|
284
|
-
// 表头快捷过滤条件变更
|
|
285
|
-
handleHeadChange (newHeadCondition) {
|
|
286
|
-
this.query.conditionQuickList = newHeadCondition
|
|
287
|
-
this.getTableData(false, true)
|
|
288
|
-
}
|
|
289
|
-
}
|
|
290
|
-
}
|
|
1
|
+
import { getTableData, getTableSum, getTableLayout } from '@/api/tableV3.js'
|
|
2
|
+
import { getOperator } from '../../package/t-data-list/src/js/util'
|
|
3
|
+
export default {
|
|
4
|
+
data () {
|
|
5
|
+
return {
|
|
6
|
+
/**
|
|
7
|
+
* 通用过滤查询参数
|
|
8
|
+
*/
|
|
9
|
+
// 被指定为搜索建议的查询的字段列表
|
|
10
|
+
suggestFieldList: [],
|
|
11
|
+
// 搜索建议的高级条件
|
|
12
|
+
searchSuggestCondition: [],
|
|
13
|
+
// 方案切换的高级条件
|
|
14
|
+
queryPlanCondition: [],
|
|
15
|
+
|
|
16
|
+
// 数据查询接口的参数
|
|
17
|
+
query: {
|
|
18
|
+
// 常用条件
|
|
19
|
+
conditionAlwaysList: [],
|
|
20
|
+
// 分组条件
|
|
21
|
+
conditionGroup: null,
|
|
22
|
+
// 高级过滤条件
|
|
23
|
+
conditionMultiList: [],
|
|
24
|
+
// 表头的过滤条件
|
|
25
|
+
conditionQuickList: [],
|
|
26
|
+
// 分页条件
|
|
27
|
+
pageNum: 1,
|
|
28
|
+
pageSize: 200
|
|
29
|
+
},
|
|
30
|
+
|
|
31
|
+
/**
|
|
32
|
+
* 数据查询结果相关
|
|
33
|
+
*/
|
|
34
|
+
// 列表的字段信息(表头,可能包含了表头过滤的配置信息和其他的布局信息)
|
|
35
|
+
tableLayout: [],
|
|
36
|
+
// 列表数据
|
|
37
|
+
tableData: {
|
|
38
|
+
total: 1,
|
|
39
|
+
records: []
|
|
40
|
+
},
|
|
41
|
+
// 列表底部合计
|
|
42
|
+
tableSum: ['合计'],
|
|
43
|
+
|
|
44
|
+
/**
|
|
45
|
+
* 列表操作过程中使用组件变量
|
|
46
|
+
*/
|
|
47
|
+
// 被标记为id的字段,这个属性只在弹窗中才被使用
|
|
48
|
+
// 但是因为获取布局依赖了这个属性所以提取为公共属性,但是只有弹窗中才被使用
|
|
49
|
+
idField: null,
|
|
50
|
+
// 列表选中行的完整数据
|
|
51
|
+
selectedRows: [],
|
|
52
|
+
// 列表选中行的id数组
|
|
53
|
+
ids: [],
|
|
54
|
+
|
|
55
|
+
/**
|
|
56
|
+
* 通过provie传递全局数据
|
|
57
|
+
*/
|
|
58
|
+
syncData: {
|
|
59
|
+
displayField: '',
|
|
60
|
+
tableLoading: false,
|
|
61
|
+
tableSelectionClear: true // 表格数据刷新之后是否清空已选的标识
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
},
|
|
65
|
+
computed: {
|
|
66
|
+
/**
|
|
67
|
+
* 高级过滤条件由多个条件来源的数据拼凑而成,使用计算属性来达到缓存的目的
|
|
68
|
+
* 且无法确定需求上的变动是否需要动态让某个来源的条件消失,所以更改为计算属性
|
|
69
|
+
* 来源如下:
|
|
70
|
+
* 搜索建议和右上角复用搜索建议的接口的搜索框拼凑的高级过滤条件
|
|
71
|
+
* 来自限定搜索范围的条件生成的高级过滤条件
|
|
72
|
+
* 来自方案中填写点击查询按钮,或者进行切换方案的时候产生高级过滤条件
|
|
73
|
+
*/
|
|
74
|
+
multiCondition () {
|
|
75
|
+
const multiResult = []
|
|
76
|
+
// 拼接方案中的高级过滤条件
|
|
77
|
+
multiResult.push(...this.queryPlanCondition)
|
|
78
|
+
// 拼接限定查询的条件
|
|
79
|
+
multiResult.push(...this.limitationCondition)
|
|
80
|
+
|
|
81
|
+
// 搜索建议永远被拼接到最后面
|
|
82
|
+
// 并且在前面有条件的时候,将搜索建议的条件用双层括号整个进行包裹((a)(b))
|
|
83
|
+
// 避免后端sql 优先级问题导致结果不准确
|
|
84
|
+
const stillEmpty = multiResult.length === 0
|
|
85
|
+
this.searchSuggestCondition.forEach((item, index) => {
|
|
86
|
+
if (index === 0) {
|
|
87
|
+
item.leftBracket = stillEmpty ? '(' : '(('
|
|
88
|
+
}
|
|
89
|
+
if (index === multiResult.length - 1) {
|
|
90
|
+
item.rightBracket = stillEmpty ? ')' : '))'
|
|
91
|
+
}
|
|
92
|
+
})
|
|
93
|
+
multiResult.push(...this.searchSuggestCondition)
|
|
94
|
+
|
|
95
|
+
// 处理条件的排序的序号
|
|
96
|
+
multiResult.forEach((item, index) => {
|
|
97
|
+
item.sort = index
|
|
98
|
+
})
|
|
99
|
+
return multiResult
|
|
100
|
+
},
|
|
101
|
+
// 限定查询范围的条件
|
|
102
|
+
limitationCondition () {
|
|
103
|
+
if (!this.limitation) {
|
|
104
|
+
return []
|
|
105
|
+
}
|
|
106
|
+
const result = []
|
|
107
|
+
for (const key in this.limitation) {
|
|
108
|
+
const fieldItem = this.tableLayout.find(v => v.field === key)
|
|
109
|
+
if (!fieldItem) continue
|
|
110
|
+
|
|
111
|
+
let value = ''
|
|
112
|
+
if (fieldItem.componentValueType === 'PARAM_BASIC') {
|
|
113
|
+
value = this.limitation[key]?.name
|
|
114
|
+
} else if (fieldItem.componentValueType === 'PARAM_ENUM') {
|
|
115
|
+
value = this.limitation[key]?.id
|
|
116
|
+
} else {
|
|
117
|
+
value = this.limitation[key]
|
|
118
|
+
}
|
|
119
|
+
|
|
120
|
+
value && result.push(this.createMultiCondition(fieldItem, value))
|
|
121
|
+
}
|
|
122
|
+
return result
|
|
123
|
+
}
|
|
124
|
+
},
|
|
125
|
+
provide () {
|
|
126
|
+
return {
|
|
127
|
+
getDbRow: this.getDbRow,
|
|
128
|
+
target: this.target,
|
|
129
|
+
enumOptionCache: {},
|
|
130
|
+
selectedRows: this.selectedRows,
|
|
131
|
+
ids: this.ids,
|
|
132
|
+
showSummary: this.queryType === 'LIST',
|
|
133
|
+
syncData: this.syncData,
|
|
134
|
+
queryType: this.queryType
|
|
135
|
+
}
|
|
136
|
+
},
|
|
137
|
+
methods: {
|
|
138
|
+
/**
|
|
139
|
+
* 获取表单的布局
|
|
140
|
+
*/
|
|
141
|
+
async getTableLayout () {
|
|
142
|
+
const res = await getTableLayout(this.target)
|
|
143
|
+
if (res.code !== 0) {
|
|
144
|
+
return this.$message.error(res.msg)
|
|
145
|
+
}
|
|
146
|
+
this.tableLayout = res.data.sort((a, b) => a.sort - b.sort)
|
|
147
|
+
this.suggestFieldList = res.data.filter(item => item.isSuggest)
|
|
148
|
+
this.displayField = this.syncData.displayField = res.data.find(item => item.isDisplayField)?.field
|
|
149
|
+
this.idField = res.data.find(item => item.isId).field
|
|
150
|
+
},
|
|
151
|
+
|
|
152
|
+
/**
|
|
153
|
+
* 列表数据
|
|
154
|
+
* 获取列表数据有三个地方进行调用
|
|
155
|
+
* 1 搜索建议: 场景为SELECTOR ,不获取合计
|
|
156
|
+
* 2 列表中数据查询:使场景为LIST, 获取合计
|
|
157
|
+
* 3 弹窗中数据: 场景为SELECTOR,不获取合计
|
|
158
|
+
*
|
|
159
|
+
* 关于是否获取合计,还有一层判断来自获取合计的借口对场景进行判断
|
|
160
|
+
* 此函数的判断只判断针对翻页页码变化这类不获取合计,至于弹窗中还是列表中的判断,在获取合计的借口中进行判断
|
|
161
|
+
*/
|
|
162
|
+
async getTableData (isSuggest = false, getSum = false) {
|
|
163
|
+
if (!isSuggest) {
|
|
164
|
+
this.syncData.tableLoading = true
|
|
165
|
+
}
|
|
166
|
+
const queryParams = !isSuggest
|
|
167
|
+
? JSON.parse(JSON.stringify(this.query))
|
|
168
|
+
: {
|
|
169
|
+
conditionAlwaysList: [],
|
|
170
|
+
conditionGroup: null,
|
|
171
|
+
conditionMultiList: [],
|
|
172
|
+
conditionQuickList: [],
|
|
173
|
+
pageNum: 1,
|
|
174
|
+
pageSize: 20
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
this.enableSum && getSum && await this.getTableSum()
|
|
178
|
+
try {
|
|
179
|
+
// 查询数据之前赋值高级过滤条件
|
|
180
|
+
queryParams.conditionMultiList = this.multiCondition
|
|
181
|
+
const res = await getTableData(this.target, queryParams, this.queryType)
|
|
182
|
+
if (res.code !== 0) {
|
|
183
|
+
this.$message.error(res.msg)
|
|
184
|
+
this.syncData.tableSelectionClear = true
|
|
185
|
+
return !isSuggest ? undefined : []
|
|
186
|
+
}
|
|
187
|
+
if (isSuggest) {
|
|
188
|
+
return res.data.record
|
|
189
|
+
}
|
|
190
|
+
this.tableData.total = Number(res.data.total)
|
|
191
|
+
this.tableData.records = res.data.record
|
|
192
|
+
} catch (err) {
|
|
193
|
+
// 恢复成默认值
|
|
194
|
+
this.syncData.tableSelectionClear = true
|
|
195
|
+
} finally {
|
|
196
|
+
this.syncData.tableLoading = false
|
|
197
|
+
}
|
|
198
|
+
},
|
|
199
|
+
// 表格数据合计
|
|
200
|
+
async getTableSum () {
|
|
201
|
+
// 只有列表中显示合计,
|
|
202
|
+
if (this.queryType !== 'LIST') {
|
|
203
|
+
return
|
|
204
|
+
}
|
|
205
|
+
const params = JSON.parse(JSON.stringify(this.query))
|
|
206
|
+
delete params.pageNum
|
|
207
|
+
delete params.pageSize
|
|
208
|
+
params.conditionMultiList = this.multiCondition
|
|
209
|
+
const res = await getTableSum(this.target, params)
|
|
210
|
+
if (res.code !== 0) {
|
|
211
|
+
return this.$message.error(res.msg)
|
|
212
|
+
}
|
|
213
|
+
// 没有合计的时候后端返回空对象,有数据该对象只有一个sum属性
|
|
214
|
+
if (!res.data.sum) {
|
|
215
|
+
return
|
|
216
|
+
}
|
|
217
|
+
const sumData = res.data.sum
|
|
218
|
+
const sumArr = ['合计']
|
|
219
|
+
const tableVisibleColumn = this.tableLayout.filter(item => item.visible)
|
|
220
|
+
for (const key in sumData) {
|
|
221
|
+
const index = tableVisibleColumn.findIndex(item => item.field === key)
|
|
222
|
+
sumArr[index + 1] = sumData[key]
|
|
223
|
+
}
|
|
224
|
+
this.tableSum = sumArr
|
|
225
|
+
},
|
|
226
|
+
/**
|
|
227
|
+
* 处理条件变更和重新获取数据的逻辑
|
|
228
|
+
* @param {boolean} queryString 用户输入的内容
|
|
229
|
+
* @param {boolean} isList 分为两个场景,1:列表和弹窗中输入框 2:弹窗未打开之前的如输入框中搜索建议
|
|
230
|
+
*/
|
|
231
|
+
// 基础资料搜索建议和列表页面右上角的搜索输入框的条件处理
|
|
232
|
+
handleSuggestMultiCondition (queryString, isList = true) {
|
|
233
|
+
const conditionMultiList = []
|
|
234
|
+
for (const item of this.suggestFieldList) {
|
|
235
|
+
conditionMultiList.push(this.createMultiCondition(item, queryString, false, false))
|
|
236
|
+
}
|
|
237
|
+
this.searchSuggestCondition = conditionMultiList
|
|
238
|
+
// todo: 列表和弹窗 还有一个子分类,弹窗不进行合计调用
|
|
239
|
+
!isList
|
|
240
|
+
? this.getTableData(true, false)
|
|
241
|
+
: this.queryType === 'LIST'
|
|
242
|
+
? this.getTableData(false, true)
|
|
243
|
+
: this.getTableData(false, false)
|
|
244
|
+
},
|
|
245
|
+
/**
|
|
246
|
+
* 创建一个高级过滤条件
|
|
247
|
+
* @param {object} fieldObj 后端传递给前端的列表布局中一个字段的配置信息
|
|
248
|
+
* @param {*} value 高级过滤条件字段
|
|
249
|
+
* @param {boolean} isStrict 条件是否是严格匹配 "等于" 否则采用模糊匹配 "包含"
|
|
250
|
+
* @param {boolean} isAndRelation and还是or sql中多个条件的分隔符号
|
|
251
|
+
* @returns
|
|
252
|
+
*/
|
|
253
|
+
createMultiCondition (fieldObj, value, isStrict = true, isAndRelation = true) {
|
|
254
|
+
// isSuggest
|
|
255
|
+
const relation = isAndRelation ? 'AND' : 'OR'
|
|
256
|
+
const operator = getOperator(fieldObj.componentValueType, isStrict)?.value
|
|
257
|
+
return {
|
|
258
|
+
leftBracket: '(',
|
|
259
|
+
field: fieldObj.field,
|
|
260
|
+
fieldType: fieldObj.componentType,
|
|
261
|
+
operator,
|
|
262
|
+
sort: '',
|
|
263
|
+
value,
|
|
264
|
+
rightBracket: ')',
|
|
265
|
+
relation
|
|
266
|
+
}
|
|
267
|
+
},
|
|
268
|
+
// 每页条数变化
|
|
269
|
+
handleSizeChange (newSize) {
|
|
270
|
+
this.query.pageSize = newSize
|
|
271
|
+
this.query.pageNum = 1
|
|
272
|
+
this.getTableData(false, false)
|
|
273
|
+
},
|
|
274
|
+
// 翻页
|
|
275
|
+
handleCurrentChange (newNum) {
|
|
276
|
+
this.query.pageNum = newNum
|
|
277
|
+
this.getTableData(false, false)
|
|
278
|
+
},
|
|
279
|
+
// 分组条件改变
|
|
280
|
+
handleGroupChange (group) {
|
|
281
|
+
this.query.conditionGroup = group
|
|
282
|
+
this.getTableData(false, true)
|
|
283
|
+
},
|
|
284
|
+
// 表头快捷过滤条件变更
|
|
285
|
+
handleHeadChange (newHeadCondition) {
|
|
286
|
+
this.query.conditionQuickList = newHeadCondition
|
|
287
|
+
this.getTableData(false, true)
|
|
288
|
+
}
|
|
289
|
+
}
|
|
290
|
+
}
|
package/src/utils/auth.js
CHANGED
|
@@ -1,22 +1,22 @@
|
|
|
1
|
-
const TOKEN = 'token' // 用户token
|
|
2
|
-
// const RETOKEN = 'RefreshToken' // 刷线token
|
|
3
|
-
|
|
4
|
-
// 设置用户token
|
|
5
|
-
export function setToken (token) {
|
|
6
|
-
localStorage.setItem(TOKEN, token)
|
|
7
|
-
}
|
|
8
|
-
|
|
9
|
-
// 清除用户token
|
|
10
|
-
export function removeToken () {
|
|
11
|
-
localStorage.removeItem(TOKEN)
|
|
12
|
-
}
|
|
13
|
-
|
|
14
|
-
// 更新token
|
|
15
|
-
export function changeToken (token) {
|
|
16
|
-
localStorage.setItem(TOKEN, token)
|
|
17
|
-
}
|
|
18
|
-
|
|
19
|
-
// 获取用户token
|
|
20
|
-
export function getToken () {
|
|
21
|
-
return localStorage.getItem(TOKEN)
|
|
22
|
-
}
|
|
1
|
+
const TOKEN = 'token' // 用户token
|
|
2
|
+
// const RETOKEN = 'RefreshToken' // 刷线token
|
|
3
|
+
|
|
4
|
+
// 设置用户token
|
|
5
|
+
export function setToken (token) {
|
|
6
|
+
localStorage.setItem(TOKEN, token)
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
// 清除用户token
|
|
10
|
+
export function removeToken () {
|
|
11
|
+
localStorage.removeItem(TOKEN)
|
|
12
|
+
}
|
|
13
|
+
|
|
14
|
+
// 更新token
|
|
15
|
+
export function changeToken (token) {
|
|
16
|
+
localStorage.setItem(TOKEN, token)
|
|
17
|
+
}
|
|
18
|
+
|
|
19
|
+
// 获取用户token
|
|
20
|
+
export function getToken () {
|
|
21
|
+
return localStorage.getItem(TOKEN)
|
|
22
|
+
}
|