doway-coms 1.6.9 → 1.6.11

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 (65) hide show
  1. package/.browserslistrc +2 -2
  2. package/README.md +28 -28
  3. package/package.json +52 -52
  4. package/packages/BaseButton/index.js +7 -7
  5. package/packages/BaseButton/src/index.vue +241 -241
  6. package/packages/BaseCheckbox/index.js +7 -7
  7. package/packages/BaseCheckbox/src/index.vue +134 -134
  8. package/packages/BaseDate/index.js +7 -7
  9. package/packages/BaseDate/src/index.vue +197 -197
  10. package/packages/BaseDateWeek/index.js +7 -7
  11. package/packages/BaseDateWeek/src/index.vue +163 -163
  12. package/packages/BaseDatetime/index.js +7 -7
  13. package/packages/BaseDatetime/src/index.vue +196 -196
  14. package/packages/BaseForm/index.js +7 -7
  15. package/packages/BaseForm/src/index.vue +666 -666
  16. package/packages/BaseGantt/index.js +9 -9
  17. package/packages/BaseGantt/src/index.vue +608 -608
  18. package/packages/BaseGrid/index.js +9 -9
  19. package/packages/BaseGrid/src/index.vue +2725 -2725
  20. package/packages/BaseGridAdjust/index.js +9 -9
  21. package/packages/BaseGridAdjust/src/index.vue +455 -455
  22. package/packages/BaseInput/index.js +7 -7
  23. package/packages/BaseInput/src/index.vue +164 -164
  24. package/packages/BaseIntervalInput/index.js +7 -7
  25. package/packages/BaseIntervalInput/src/index.vue +310 -310
  26. package/packages/BaseKanbanEmpty/index.js +7 -7
  27. package/packages/BaseKanbanEmpty/src/index.vue +176 -176
  28. package/packages/BaseNumberInput/index.js +7 -7
  29. package/packages/BaseNumberInput/src/index.vue +229 -229
  30. package/packages/BasePagination/index.js +7 -7
  31. package/packages/BasePagination/src/index.vue +91 -91
  32. package/packages/BasePictureCard/index.js +7 -7
  33. package/packages/BasePictureCard/src/index.vue +561 -561
  34. package/packages/BasePrintPreview/index.js +7 -7
  35. package/packages/BasePrintPreview/src/index.vue +117 -117
  36. package/packages/BasePulldown/index.js +7 -7
  37. package/packages/BasePulldown/src/index.vue +1090 -1087
  38. package/packages/BaseSearch/index.js +7 -7
  39. package/packages/BaseSearch/src/index.vue +935 -935
  40. package/packages/BaseSelect/index.js +7 -7
  41. package/packages/BaseSelect/src/index.vue +155 -153
  42. package/packages/BaseSelectMulti/index.js +7 -7
  43. package/packages/BaseSelectMulti/src/index.vue +148 -148
  44. package/packages/BaseTextArea/index.js +7 -7
  45. package/packages/BaseTextArea/src/index.vue +178 -178
  46. package/packages/BaseTime/index.js +7 -7
  47. package/packages/BaseTime/src/index.vue +166 -166
  48. package/packages/BaseTool/index.js +7 -7
  49. package/packages/BaseTool/src/index.vue +349 -349
  50. package/packages/BaseToolStatus/index.js +7 -7
  51. package/packages/BaseToolStatus/src/index.vue +383 -383
  52. package/packages/index.js +165 -165
  53. package/packages/styles/default.less +80 -80
  54. package/packages/utils/api.js +45 -45
  55. package/packages/utils/auth.js +38 -38
  56. package/packages/utils/common.js +583 -583
  57. package/packages/utils/dom.js +181 -181
  58. package/packages/utils/enum.js +83 -83
  59. package/packages/utils/filters.js +458 -458
  60. package/packages/utils/gridFormat.js +52 -52
  61. package/packages/utils/msg.js +16 -16
  62. package/packages/utils/patchFiles.js +44 -44
  63. package/packages/utils/request.js +169 -169
  64. package/packages/utils/store.js +261 -261
  65. package/vue.config.js +59 -59
@@ -1,1088 +1,1091 @@
1
- <template>
2
- <div class="d-control-container">
3
- <div
4
- class="d-control-label"
5
- v-if="showLabel === true"
6
- :style="{ width: labelWidth > 0 ? labelWidth + 'px' : 'none' }"
7
- >
8
- {{ label }}
9
- <span v-if="rules && rules['required']" class="d-control-label-required"
10
- >*</span
11
- >
12
- <Tooltip :title="tooltip" v-if="tooltip" style="margin: 0 2px">
13
- <img src="../../styles/icon/help.png" alt="" style="width: 14px" />
14
- </Tooltip>
15
- </div>
16
- <div
17
- :class="{
18
- 'd-control': showLabel === true,
19
- 'd-grid-control': showLabel === false,
20
- }"
21
- >
22
- <VxePulldown
23
- style="width: 100%"
24
- @hide-panel="pullDownHideEvent"
25
- ref="pulldownRef"
26
- v-if="edit === true"
27
- transfer
28
- >
29
- <template #default>
30
- <ValidationProvider :name="label" v-slot="v" :rules="rules">
31
- <a-input
32
- :size="'small'"
33
- allow-clear
34
- @change="inputChangeEvent"
35
- class="inner-cell-control"
36
- v-model="currentValue"
37
- @click="inputClickEvent"
38
- @focus="inputFocusEvent"
39
- @blur="inputBlurEvent"
40
- @keydown="inputKeydownEvent"
41
- @keyup="inputKeyupEvent"
42
- :class="{ 'd-error-input': v.errors.length > 0 }"
43
- ></a-input>
44
- <div class="d-error-msg">
45
- {{ v.errors[0] }}
46
- </div>
47
- </ValidationProvider>
48
- </template>
49
- <template #dropdown>
50
- <div class="pulldown-grid interceptor-class">
51
- <vxe-grid
52
- size="mini"
53
- border
54
- :row-class-name="gridRowStyle"
55
- highlight-current-row
56
- :keyboard-config="{ isArrow: true }"
57
- highlight-hover-row
58
- auto-resize
59
- resizable
60
- :loading="gridLoading"
61
- height="auto"
62
- ref="pupupGridView"
63
- :data="searchRows"
64
- @cell-click="gridCellClick"
65
- @filter-visible="filterVisible"
66
- :columns="internalColumns"
67
- :checkbox-config="{ checkMethod: checkMethod }"
68
- @sort-change="sortChange"
69
- :filter-config="{
70
- remote: true,
71
- }"
72
- :sort-config="{
73
- multiple: true,
74
- remote: true,
75
- chronological: true,
76
- defaultSort: defaultSort,
77
- }"
78
- >
79
- <!-- :pager-config="gridPagerConfig" -->
80
- <!-- @page-change="pageChangeEvent" -->
81
- <template #matCode_header="{ column }">
82
- <div class="first-col">
83
- <div class="first-col-top">
84
- {{ column.title }}
85
- </div>
86
- <div class="first-col-bottom">
87
- <input style="width: 100%" />
88
- </div>
89
- </div>
90
- </template>
91
- <!-- 普通输入框的过滤筛选-->
92
- <template #text_filter="{ column }">
93
- <div class="interceptor-class">
94
- <div
95
- v-for="(item, $index) in column.filters"
96
- :key="$index"
97
- >
98
- <a-input allowClear v-model="item.data" @keyup.enter.native="filterConfirm(column)" style="margin-bottom: 5px;" />
99
- </div>
100
- <a-button @click="filterAddExp(column)">添加条件</a-button>
101
- <a-button @click="filterConfirm(column)">确认</a-button>
102
- </div>
103
- </template>
104
- <!-- 选择筛选框-->
105
- <template #select_filter="{ column }">
106
- <div class="interceptor-class">
107
- <a-checkbox-group
108
- v-model="column.filters[0].data"
109
- @keyup.enter.native="filterConfirm(column)"
110
- >
111
- <div style="max-height:200px;overflow-y:scroll">
112
- <div style="text-align:left;" v-for="loopSource in column.params.dataSource" :key="loopSource.value">
113
- <a-checkbox
114
- :value="loopSource.value"
115
- style="margin: 5px 0;"
116
- >{{ loopSource.caption }}
117
- </a-checkbox>
118
- </div>
119
- </div>
120
- </a-checkbox-group>
121
- <br>
122
- <a-button @click="filterConfirm(column)">确认</a-button>
123
- </div>
124
- </template>
125
- <template #pager>
126
- <a-row>
127
- <a-col :span="8">
128
- <a-button
129
- v-if="isMultiSelect === true"
130
- type="primary"
131
- size="small"
132
- style="margin: 5px"
133
- @click="multiSelectConfirm"
134
- >
135
- 确认选择
136
- </a-button>
137
- <a-button
138
- v-if="popupAddName"
139
- type="primary"
140
- size="small"
141
- style="margin: 5px"
142
- @click="pagerBtnClick(btn)"
143
- >
144
- 新增
145
- </a-button>
146
-
147
- <template v-if="optBtns.length > 0">
148
- <a-button
149
- v-for="btn in optBtns"
150
- :key="btn.field"
151
- type="primary"
152
- size="small"
153
- style="margin: 5px"
154
- @click="pagerBtnClick(btn)"
155
- >
156
- {{ btn.name }}
157
- </a-button>
158
- </template>
159
- </a-col>
160
- <a-col :span="16">
161
- <vxe-pager
162
- align="right"
163
- size="mini"
164
- :current-page.sync="gridPagerConfig.currentPage"
165
- :page-size.sync="gridPagerConfig.pageSize"
166
- :total="gridPagerConfig.total"
167
- @page-change="pageChangeEvent"
168
- >
169
- </vxe-pager>
170
- </a-col>
171
- </a-row>
172
- </template>
173
- </vxe-grid>
174
- </div>
175
- </template>
176
- </VxePulldown>
177
- <span v-if="edit === false">
178
- <a v-if="route" @click="routeLinkClick">{{ currentValue }}</a>
179
- <span v-else> {{ currentValue }}</span>
180
- </span>
181
- </div>
182
- <keep-alive>
183
- <div
184
- :is="popupAddName"
185
- ref="pupupAddView"
186
- @popupSaveAfter="popupSaveAfter"
187
- ></div>
188
- </keep-alive>
189
- </div>
190
- </template>
191
-
192
- <script>
193
- import XEUtils from "xe-utils";
194
- import { sysRowState, sysFormState, controlType } from "../../utils/enum";
195
- import { replaceParamString, replaceParam } from "../../utils/common";
196
- import request from "../../utils/request";
197
- import {Input, Button, Row, Col, Checkbox} from "ant-design-vue";
198
- import { ValidationProvider } from "vee-validate";
199
- import { Pulldown } from "vxe-table";
200
- import { Tooltip } from "ant-design-vue";
201
- export default {
202
- name: "BasePulldown",
203
- components: {
204
- "a-input": Input,
205
- "a-button": Button,
206
- "a-row": Row,
207
- "a-col": Col,
208
- "a-checkbox": Checkbox,
209
- "a-checkbox-group": Checkbox.Group,
210
- VxePulldown: Pulldown,
211
- ValidationProvider,
212
- Tooltip,
213
- },
214
- data() {
215
- return {
216
- fetchFields: "",
217
- internalColumns: [],
218
- isInputChanged: false,
219
- inputTimeout: null,
220
- searchRows: [],
221
- filterCols: [],
222
- gridLoading: false,
223
- gridPagerConfig: {
224
- total: 0,
225
- currentPage: 1,
226
- pageSize: 10,
227
- },
228
- sorts: [],
229
- defaultSort: [],
230
- filterExpression: {
231
- operator: 'and',
232
- expressions: []
233
- }
234
- };
235
- },
236
- props: {
237
- labelWidth: {
238
- type: Number,
239
- default: function () {
240
- return 0;
241
- },
242
- },
243
- isMultiSelect: {
244
- type: Boolean,
245
- default: function () {
246
- return false;
247
- },
248
- },
249
- popupAddName: {
250
- type: String,
251
- default: function () {
252
- return null;
253
- },
254
- },
255
- popupAddPath: {
256
- type: String,
257
- default: function () {
258
- return null;
259
- },
260
- },
261
- rules: {
262
- type: Object,
263
- default: function () {
264
- return null;
265
- },
266
- },
267
- showLabel: {
268
- type: Boolean,
269
- default: function () {
270
- return true;
271
- },
272
- },
273
- label: {
274
- type: String,
275
- default: function () {
276
- return "";
277
- },
278
- },
279
- defaultExpression: {
280
- type: String,
281
- default: function () {
282
- return "";
283
- },
284
- },
285
- formRow: {
286
- type: Object,
287
- default: function () {
288
- return {};
289
- },
290
- },
291
- row: {
292
- type: Object,
293
- default: function () {
294
- return {};
295
- },
296
- },
297
- edit: {
298
- type: Boolean,
299
- default: function () {
300
- return false;
301
- },
302
- },
303
- route: Object,
304
- placeholder: {
305
- // 提示信息
306
- type: String,
307
- },
308
- api: {
309
- // api接口
310
- type: String,
311
- },
312
- field: {
313
- type: String,
314
- },
315
- pageSize: {
316
- // 分页数量,默认不分页
317
- type: Number,
318
- default: () => {
319
- return 0;
320
- },
321
- },
322
- columns: {
323
- // 列集合
324
- type: Array,
325
- default: () => {
326
- return [];
327
- },
328
- },
329
- isOld: {
330
- // 列集合
331
- type: Boolean,
332
- default: () => {
333
- return false;
334
- },
335
- },
336
- exps: {
337
- // 条件
338
- type: Array,
339
- default: () => {
340
- return [];
341
- },
342
- },
343
- value: {
344
- type: String,
345
- default: function () {
346
- return "";
347
- },
348
- },
349
- optBtns: {
350
- // 操作按钮
351
- type: Array,
352
- default: () => {
353
- return [];
354
- },
355
- },
356
- gridTable: {
357
- // 操作按钮
358
- type: Object,
359
- default: () => {
360
- return null;
361
- },
362
- },
363
- immediate: {
364
- type: Boolean,
365
- default: true,
366
- },
367
- isLocalData: {
368
- type: Boolean,
369
- default: false,
370
- },
371
- tooltip: {
372
- type: String,
373
- default: function () {
374
- return "";
375
- },
376
- },
377
- propTableData: {
378
- type: Array,
379
- default: function () {
380
- return [];
381
- },
382
- },
383
- },
384
- watch: {},
385
- computed: {
386
- currentValue: {
387
- // 动态计算currentValue的值
388
- get: function () {
389
- return this.value; // 将props中的value赋值给currentValue
390
- },
391
- set: function (val) {
392
- this.$emit("input", val); // 通过$emit触发父组件
393
- },
394
- },
395
- },
396
- created() {
397
- // if (this.popupAddName && !this.$options.components[this.popupAddName]) {
398
- // // const tempRequire = require('@/views' + this.popupAddPath + '.vue').default
399
- // // this.$options.components[this.popupAddName] = tempRequire
400
- // this.$options.components[this.popupAddName] = () =>
401
- // import('@/views' + this.popupAddPath + '.vue')
402
- // }
403
- this.gridPagerConfig.pageSize = this.pageSize;
404
-
405
- this.internalColumns.push({
406
- type: "seq",
407
- fixed: "left",
408
- width: 50,
409
- });
410
-
411
- if (this.isMultiSelect === true) {
412
- this.internalColumns.push({
413
- type: "checkbox",
414
- fixed: "left",
415
- width: 40,
416
- });
417
- }
418
-
419
- for (let i = 0; i < this.columns.length; i++) {
420
- this.fetchFields = this.fetchFields + this.columns[i].field + ",";
421
- this.columns[i]["params"] = {
422
- dataSource: [],
423
- };
424
- if (this.columns[i].dataSource) {
425
- this.columns[i]["params"].dataSource = this.columns[i].dataSource;
426
- }
427
- if (!this.columns[i].width) {
428
- this.columns[i]["width"] = 100;
429
- }
430
- if (this.columns[i].isCheckbox === true) {
431
- this.columns[i]["type"] = "checkbox";
432
- }
433
- // 设置字段的过滤插槽
434
- if(this.columns[i].filter) {
435
- this.columns[i]["filterMultiple"] = false;
436
-
437
- switch(this.columns[i].controlType) {
438
- case 'checkbox':
439
- this.columns[i]['slots'] = {
440
- filter: `checkbox_filter`
441
- }
442
- break
443
- case 'select':
444
- this.columns[i]['slots'] = {
445
- filter: `select_filter`
446
- }
447
- this.columns[i]['filters'] = [
448
- {
449
- data: []
450
- }
451
- ]
452
- break
453
- default:
454
- this.columns[i]['slots'] = {
455
- filter: `text_filter`
456
- }
457
- this.columns[i]['filters'] = [
458
- {
459
- data: ''
460
- }
461
- ]
462
- break
463
- }
464
- }
465
- // 默认排序
466
- if (this.columns[i].defaultSort) {
467
- this.defaultSort.push({
468
- field: this.columns[i].field,
469
- order: this.columns[i].defaultSort,
470
- });
471
- this.sorts.push([this.columns[i].field, this.columns[i].defaultSort]);
472
- }
473
- this.internalColumns.push(this.columns[i]);
474
- if (this.columns[i].filter === true) {
475
- this.filterCols.push(this.columns[i]);
476
- }
477
- }
478
- },
479
- methods: {
480
- gridRowStyle(scope) {
481
- if (scope.row.sysRepeat === true) {
482
- return "row--pending";
483
- }
484
- // if(scope.row.)
485
- },
486
- clearInputValue() {
487
- if (this.isInputChanged === true) {
488
- this.setLinkValue(null, this.row);
489
- this.$emit("selectChanged", null);
490
- }
491
- },
492
- routeLinkClick() {
493
- //首先需要判断是否有权限
494
- // let treeModule = XEUtils.findTree(
495
- // this.$store.getters.addRouters,
496
- // item => item.name === this.route.name
497
- // )
498
- // if (!treeModule) {
499
- // this.$antwarning('没有权限')
500
- // return
501
- // }
502
- this.$router.pushRoute({
503
- name: this.route.name,
504
- query: { id: this.row[this.route.field] },
505
- });
506
- },
507
- /**
508
- * 输入框改变事件
509
- */
510
- inputChangeEvent(event) {
511
- this.isInputChanged = true;
512
- if (event.type === "click" && event.pointerType === "mouse") {
513
- //点击了清空按钮
514
- this.$nextTick(() => {
515
- this.clearInputValue();
516
- this.inputClickEvent(null);
517
- });
518
- }
519
- },
520
- inputBlurEvent(event) {},
521
- /**
522
- * 输入框获取焦点事件
523
- */
524
- inputFocusEvent(event) {
525
- event.currentTarget.select();
526
- // this.$refs.pulldownRef.showPanel()
527
- // this.searchData()
528
- },
529
- /**
530
- * Tab键隐藏面板
531
- */
532
- inputKeydownEvent(event) {
533
- if (event.keyCode === 9) {
534
- //tab事件
535
- this.$refs.pulldownRef.hidePanel();
536
- this.clearInputValue();
537
- }
538
- },
539
- inputClickEvent(event) {
540
- if (this.$refs.pulldownRef.isPanelVisible() === false) {
541
- this.$refs.pulldownRef.showPanel();
542
- this.clearColumnFilter()
543
- this.searchData();
544
- } else {
545
- this.$refs.pulldownRef.hidePanel();
546
- }
547
- },
548
- /**
549
- * 输入库输入事件
550
- */
551
- inputKeyupEvent(event) {
552
- //好像ok
553
- if (!this.immediate && event.keyCode !== 13) {
554
- console.debug("davistest");
555
- } else {
556
- if (this.inputTimeout) {
557
- clearTimeout(this.inputTimeout);
558
- }
559
- let vm = this;
560
- this.inputTimeout = setTimeout(() => {
561
- //判断面板是否打开
562
- if (vm.$refs.pulldownRef.isPanelVisible() === false) {
563
- vm.$refs.pulldownRef.showPanel();
564
- }
565
- vm.searchData();
566
- }, 500);
567
- }
568
- },
569
- /**
570
- * 网格列选中事件
571
- */
572
- gridCellClick({ row, column }) {
573
- if (row.sysRepeat === true) {
574
- return;
575
- }
576
- if (column.type === "seq" || column.type === "checkbox") {
577
- return;
578
- }
579
- this.isInputChanged = false;
580
- this.setLinkValue(row, this.row);
581
- this.$emit("selectChanged", row);
582
- this.$refs.pulldownRef.hidePanel();
583
- },
584
- setLinkValue(pulldownRow, oriRow) {
585
- for (let i = 0; i < this.internalColumns.length; i++) {
586
- if (this.internalColumns[i].linkField) {
587
- let tempLinkFields = this.internalColumns[i].linkField.split(".");
588
- let tempRow = oriRow;
589
- // for(let j=0;j<tempLinkFields.length;j++){
590
- // let tempField = tempLinkFields[j]
591
- // //如果赋值的属性不存在数据集中,就忽略更新,防止修改后网格单元格值不更细
592
- // if (!(tempField in tempRow)) {
593
- // this.$antwarning(
594
- // '赋值字段[' + this.internalColumns[i].linkField + ']不存在'
595
- // )
596
- // break
597
- // }
598
- // if(j===tempLinkFields.length-1){
599
- // if (pulldownRow === null) {
600
- // if (this.internalColumns[i].nullClear === false) {
601
- // //是否空值清除数据,用于可选可输入的控件
602
- // continue
603
- // }
604
- // this.$set(tempRow, tempField, null)
605
- // } else {
606
- // this.$set(
607
- // tempRow,
608
- // tempField,
609
- // this.getLinkValue(tempField, pulldownRow)
610
- // )
611
- // }
612
- // }else{
613
- // tempRow = tempRow[tempField]
614
- // }
615
- // }
616
-
617
- //如果赋值的属性不存在数据集中,就忽略更新,防止修改后网格单元格值不更细
618
- if (!(this.internalColumns[i].linkField in oriRow)) {
619
- this.$antwarning(
620
- "赋值字段[" + this.internalColumns[i].linkField + "]不存在"
621
- );
622
- continue;
623
- }
624
- if (pulldownRow === null) {
625
- if (this.internalColumns[i].nullClear === false) {
626
- //是否空值清楚数据,用于可选可输入的控件
627
- continue;
628
- }
629
- this.$set(oriRow, this.internalColumns[i].linkField, null);
630
- } else {
631
- this.$set(
632
- oriRow,
633
- this.internalColumns[i].linkField,
634
- this.getLinkValue(this.internalColumns[i].field, pulldownRow)
635
- );
636
- }
637
- }
638
- }
639
- },
640
- getLinkValue(field, row) {
641
- let linkField = field.split(".");
642
- if (linkField.length > 1) {
643
- let fieldValue = row;
644
- for (let i = 0; i < linkField.length; i++) {
645
- if (
646
- fieldValue[linkField[i]] === undefined ||
647
- fieldValue[linkField[i]] === null
648
- ) {
649
- return null;
650
- }
651
- fieldValue = fieldValue[linkField[i]];
652
- }
653
- return fieldValue;
654
- }
655
- return row[field];
656
- },
657
- /**
658
- * 左下角按钮点击事件
659
- */
660
- pagerBtnClick(btn) {
661
- this.$refs.pupupAddView.show();
662
- // this.$emit('pulldownBtnClick', btn)
663
- this.$refs.pulldownRef.hidePanel();
664
- },
665
- // 多选内容时,若数据不满足条件,不可选中
666
- checkMethod({ row }) {
667
- if (row.sysRepeat) {
668
- return false;
669
- }
670
- return true;
671
- },
672
- /**
673
- * 确认多选
674
- */
675
- multiSelectConfirm() {
676
- this.isInputChanged = false;
677
- this.$emit(
678
- "confirmMultiSelect",
679
- this,
680
- this.$refs.pupupGridView.getCheckboxRecords(true)
681
- );
682
- this.$refs.pulldownRef.hidePanel();
683
- },
684
- popupSaveAfter(pupupAddRowInfo) {
685
- let postData = {
686
- fields: null,
687
- begin: 1,
688
- size: 1,
689
- expression: {},
690
- sorts: "",
691
- };
692
- let tempKeyExp = XEUtils.find(
693
- this.internalColumns,
694
- (item) => item.isKey === true
695
- );
696
- postData.expression = {
697
- operator: "and",
698
- expressions: [
699
- {
700
- operator: "and",
701
- expressions: [
702
- {
703
- field: tempKeyExp.field,
704
- operator: "EQ",
705
- value: pupupAddRowInfo["id"],
706
- },
707
- ],
708
- },
709
- ],
710
- };
711
- let vm = this;
712
- let tempApi = this.getPostApi(postData);
713
- request({
714
- url: tempApi,
715
- method: "post",
716
- data: postData,
717
- })
718
- .then((responseData) => {
719
- if (responseData.content.length > 0) {
720
- vm.setLinkValue(responseData.content[0], vm.row);
721
- vm.$emit("selectChanged", responseData.content[0]);
722
- }
723
- })
724
- .catch((error) => {
725
- console.error(error);
726
- })
727
- .finally(() => {});
728
- },
729
- /**
730
- * 分页改变事件
731
- */
732
- pageChangeEvent({ currentPage, pageSize }) {
733
- this.gridPagerConfig.currentPage = currentPage;
734
- this.gridPagerConfig.pageSize = pageSize;
735
- this.searchData();
736
- },
737
- /**
738
- * 面板隐藏事件
739
- */
740
- pullDownHideEvent({ $event }) {
741
- this.clearInputValue();
742
- },
743
- /**
744
- * 查询数据
745
- */
746
- searchData() {
747
- if (this.isLocalData === true) {
748
- let tempSearch = {
749
- value: this.currentValue,
750
- dataSource: [],
751
- };
752
- this.$emit("preSearch", tempSearch);
753
- this.searchRows = tempSearch.dataSource;
754
- this.gridPagerConfig.total = tempSearch.dataSource.length;
755
- return;
756
- }
757
-
758
- let tempExp = {
759
- operator: "or",
760
- expressions: [],
761
- };
762
- if (this.isOld === true) {
763
- tempExp = "";
764
- }
765
- if (this.currentValue) {
766
- for (let i = 0; i < this.filterCols.length; i++) {
767
- if (this.isOld === true) {
768
- tempExp =
769
- tempExp +
770
- this.filterCols[i].field +
771
- '.contains("' +
772
- this.currentValue +
773
- '")';
774
- if (i < this.filterCols.length - 1) {
775
- tempExp = tempExp + " or ";
776
- }
777
- } else {
778
- if (this.filterCols[i].controlType == "number") {
779
- tempExp.expressions.push({
780
- field: this.filterCols[i].field,
781
- operator: "EQ",
782
- value: Number(this.currentValue),
783
- });
784
- } else {
785
- tempExp.expressions.push({
786
- field: this.filterCols[i].field,
787
- operator: "CO",
788
- value: this.currentValue,
789
- });
790
- }
791
- }
792
- }
793
- }
794
- if (this.isOld === true && tempExp.length > 0) {
795
- tempExp = "(" + tempExp + ")";
796
- }
797
-
798
- if (this.defaultExpression) {
799
- let tempDefault = replaceParamString(
800
- this.defaultExpression,
801
- this.formRow,
802
- this.$store.getters.moduleSelectItems[this.$route.meta.moduleId]
803
- );
804
-
805
- if (tempExp) {
806
- tempExp = tempExp + " and (" + tempDefault + ")";
807
- } else {
808
- tempExp = tempDefault;
809
- }
810
- }
811
-
812
- let postExpression = {
813
- field: this.field,
814
- expression: tempExp,
815
- extendParams: {},
816
- };
817
- let repeatRowInfo = {
818
- field: "",
819
- values: [],
820
- };
821
- //查询之前从外部组件构造其他的条件
822
- this.$emit("preSearch", postExpression, repeatRowInfo);
823
- if(this.filterExpression.expressions.length > 0) {
824
- postExpression.expression.expressions.push(this.filterExpression)
825
- }
826
- let postData = {
827
- fields: this.fetchFields,
828
- begin:
829
- (this.gridPagerConfig.currentPage - 1) *
830
- this.gridPagerConfig.pageSize +
831
- 1,
832
- size: this.gridPagerConfig.pageSize,
833
- expression: postExpression.expression,
834
- sorts: this.sorts,
835
- extendParams: postExpression.extendParams,
836
- };
837
- // console.log(postData.sorts);
838
- let tempApi = this.getPostApi(postData);
839
-
840
- // let tempApi = this.api
841
- // if (this.api.indexOf('?') > 0) {
842
- // tempApi = this.api.substring(0, this.api.indexOf('?'))
843
- // let tempExtenParams = this.api.substring(this.api.indexOf('?') + 1)
844
- // tempExtenParams = replaceParam(tempExtenParams, this.formRow)
845
- // let tempSplitParams = tempExtenParams.split('&')
846
- // for (let i = 0; i < tempSplitParams.length; i++) {
847
- // let tempSplitValue = tempSplitParams[i].split('=')
848
- // this.$set(
849
- // postData.extendParams,
850
- // tempSplitValue[0],
851
- // tempSplitValue[1]
852
- // )
853
- // }
854
- // }
855
- let vm = this;
856
- vm.gridLoading = true;
857
- request({
858
- url: tempApi,
859
- method: "post",
860
- data: postData,
861
- })
862
- .then((responseData) => {
863
- if (vm.isOld === true) {
864
- vm.searchRows = responseData.data;
865
- vm.gridPagerConfig.total = responseData.extData.totalRows;
866
- } else {
867
- vm.searchRows = responseData.content;
868
- vm.$refs.pupupGridView.loadData(vm.searchRows)
869
- vm.gridPagerConfig.total = responseData.otherContent.totalRows;
870
- }
871
- if (repeatRowInfo.field) {
872
- //设置重复值
873
- XEUtils.arrayEach(vm.searchRows, (item) => {
874
- if (
875
- XEUtils.arrayIndexOf(
876
- repeatRowInfo.values,
877
- item[repeatRowInfo.field]
878
- ) > -1
879
- ) {
880
- item["sysRepeat"] = true;
881
- } else {
882
- item["sysRepeat"] = false;
883
- }
884
- });
885
- }
886
- // 设置字段sysRepeat后,所定字段的值全部相同则不可选择
887
- let fieldNames = vm.columns
888
- .filter((x) => x.sysRepeat)
889
- .map((y) => {
890
- return {
891
- field: y.field,
892
- linkField: y.linkField,
893
- };
894
- });
895
- if (fieldNames.length) {
896
- vm.searchRows.forEach((info) => {
897
- vm.propTableData.forEach((item) => {
898
- // 接口字段可能和表字段field不一致,linkField一致
899
- let arr = [];
900
- for (let j = 0; j < fieldNames.length; j++) {
901
- if (
902
- info[fieldNames[j].field] == item[fieldNames[j].linkField]
903
- ) {
904
- arr.push(true);
905
- }
906
- }
907
- if (fieldNames.length === arr.length) {
908
- info.sysRepeat = true;
909
- }
910
- });
911
- });
912
- }
913
- })
914
- .catch((error) => {
915
- console.error(error);
916
- })
917
- .finally(() => {
918
- vm.gridLoading = false;
919
- });
920
- },
921
- getPostApi(postData) {
922
- let tempApi = this.api;
923
- if (this.api.indexOf("?") > 0) {
924
- tempApi = this.api.substring(0, this.api.indexOf("?"));
925
- let tempExtenParams = this.api.substring(this.api.indexOf("?") + 1);
926
- tempExtenParams = replaceParam(tempExtenParams, this.formRow);
927
- let tempSplitParams = tempExtenParams.split("&");
928
- for (let i = 0; i < tempSplitParams.length; i++) {
929
- let tempSplitValue = tempSplitParams[i].split("=");
930
- this.$set(
931
- postData.extendParams,
932
- tempSplitValue[0],
933
- tempSplitValue[1]
934
- );
935
- }
936
- }
937
- return tempApi;
938
- },
939
- sortChange({ column, property, order, sortBy, sortList, $event }) {
940
- let currentSort = sortList.map((x) => {
941
- return [x.field, x.order];
942
- });
943
- this.sorts = currentSort;
944
- this.searchData();
945
- },
946
-
947
- // 下拉容器筛选条件被触发
948
- filterVisible({column}) {
949
- XEUtils.remove(column.filters, item => {
950
- return item.data === ''
951
- })
952
- if(column.filters.length === 0) {
953
- column.filters.push({
954
- data: ''
955
- })
956
- }
957
- },
958
- filterConfirm(column) {
959
- let vm = this
960
- this.filterExpression = {
961
- operator: 'and',
962
- expressions: []
963
- }
964
- let col= this.columns.find(x=>x.field === column.field)
965
- switch(col.controlType) {
966
- case 'select':
967
- column.filters[0].checked =
968
- column.filters[0].data.length > 0
969
- break;
970
- default:
971
- column.filters[0].checked =
972
- column.filters[0].data !== ''
973
- break;
974
- }
975
- //通知外部筛选改变事件
976
- let columns = this.$refs.pupupGridView.getTableColumn().collectColumn
977
- XEUtils.each(columns, item => {
978
- let filterExpression = {
979
- operator: 'or',
980
- expressions: []
981
- }
982
- switch (col.controlType) {
983
- case 'select':
984
- if(item.filters && item.filters[0].checked) {
985
- XEUtils.each(item.filters[0].data, loopItem => {
986
- filterExpression.expressions.push({
987
- field: item.field,
988
- operator: "EQ",
989
- value: loopItem
990
- })
991
- })
992
- if(filterExpression.expressions.length > 0) {
993
- vm.filterExpression.expressions.push(filterExpression)
994
- }
995
- }
996
- break
997
- default:
998
- if(item.filters && item.filters[0].checked) {
999
- XEUtils.each(item.filters, loopItem => {
1000
- if(loopItem.data) {
1001
- filterExpression.expressions.push({
1002
- field: item.field,
1003
- operator: "CO",
1004
- value: loopItem.data
1005
- })
1006
- }
1007
- })
1008
- if(filterExpression.expressions.length > 0) {
1009
- vm.filterExpression.expressions.push(filterExpression)
1010
- }
1011
- }
1012
- break
1013
- }
1014
- })
1015
- this.gridPagerConfig.currentPage = 1
1016
- this.searchData()
1017
- this.$refs.pupupGridView.closeFilter()
1018
- },
1019
- // 添加筛选条件
1020
- filterAddExp(column) {
1021
- column['filters'].push({
1022
- data: ''
1023
- })
1024
- },
1025
-
1026
- // 清楚筛选条件
1027
- clearColumnFilter() {
1028
- let columns = []
1029
- let vm = this
1030
- try {
1031
- columns = this.$refs.pupupGridView.getTableColumn().collectColumn
1032
- }catch (err) {
1033
- console.debug(err)
1034
- }
1035
-
1036
- XEUtils.each(columns, item => {
1037
- let col= vm.columns.find(x=>x.field === item.field)
1038
- switch(col.controlType) {
1039
- case 'select':
1040
- if(item.filters && item.filters[0].checked) {
1041
- item.filters = [{
1042
- data: []
1043
- }]
1044
- }
1045
- break;
1046
- default:
1047
- if(item.filters && item.filters[0].checked) {
1048
- item.filters = [{
1049
- data: ''
1050
- }]
1051
- }
1052
- break;
1053
- }
1054
-
1055
- })
1056
- this.filterExpression = {
1057
- operator: 'and',
1058
- expressions: []
1059
- }
1060
- },
1061
- },
1062
- };
1063
- </script>
1064
-
1065
- <style lang="scss" scoped>
1066
- .pulldown-grid {
1067
- min-width: 600px;
1068
- width: auto;
1069
- height: 350px;
1070
- background-color: #fff;
1071
- box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
1072
- }
1073
-
1074
- .d-grid-control {
1075
- height: 30px;
1076
- }
1077
- .interceptor-class {
1078
- padding: 10px;
1079
- ::v-deep .ant-btn {
1080
- margin: 10px 10px 0;
1081
- }
1082
- }
1083
- </style>
1084
-
1085
-
1086
- <style lang="less">
1087
- @import "../../styles/default.less";
1
+ <template>
2
+ <div class="d-control-container">
3
+ <div
4
+ class="d-control-label"
5
+ v-if="showLabel === true"
6
+ :style="{ width: labelWidth > 0 ? labelWidth + 'px' : 'none' }"
7
+ >
8
+ {{ label }}
9
+ <span v-if="rules && rules['required']" class="d-control-label-required"
10
+ >*</span
11
+ >
12
+ <Tooltip :title="tooltip" v-if="tooltip" style="margin: 0 2px">
13
+ <img src="../../styles/icon/help.png" alt="" style="width: 14px" />
14
+ </Tooltip>
15
+ </div>
16
+ <div
17
+ :class="{
18
+ 'd-control': showLabel === true,
19
+ 'd-grid-control': showLabel === false,
20
+ }"
21
+ >
22
+ <VxePulldown
23
+ style="width: 100%"
24
+ @hide-panel="pullDownHideEvent"
25
+ ref="pulldownRef"
26
+ v-if="edit === true"
27
+ transfer
28
+ >
29
+ <template #default>
30
+ <ValidationProvider :name="label" v-slot="v" :rules="rules">
31
+ <a-input
32
+ :size="'small'"
33
+ allow-clear
34
+ @change="inputChangeEvent"
35
+ class="inner-cell-control"
36
+ v-model="currentValue"
37
+ @click="inputClickEvent"
38
+ @focus="inputFocusEvent"
39
+ @blur="inputBlurEvent"
40
+ @keydown="inputKeydownEvent"
41
+ @keyup="inputKeyupEvent"
42
+ :class="{ 'd-error-input': v.errors.length > 0 }"
43
+ ></a-input>
44
+ <div class="d-error-msg">
45
+ {{ v.errors[0] }}
46
+ </div>
47
+ </ValidationProvider>
48
+ </template>
49
+ <template #dropdown>
50
+ <div class="pulldown-grid interceptor-class">
51
+ <vxe-grid
52
+ size="mini"
53
+ border
54
+ :row-class-name="gridRowStyle"
55
+ highlight-current-row
56
+ :keyboard-config="{ isArrow: true }"
57
+ highlight-hover-row
58
+ auto-resize
59
+ resizable
60
+ :loading="gridLoading"
61
+ height="auto"
62
+ ref="pupupGridView"
63
+ :data="searchRows"
64
+ @cell-click="gridCellClick"
65
+ @filter-visible="filterVisible"
66
+ :columns="internalColumns"
67
+ :checkbox-config="{ checkMethod: checkMethod }"
68
+ @sort-change="sortChange"
69
+ :filter-config="{
70
+ remote: true,
71
+ }"
72
+ :sort-config="{
73
+ multiple: true,
74
+ remote: true,
75
+ chronological: true,
76
+ defaultSort: defaultSort,
77
+ }"
78
+ >
79
+ <!-- :pager-config="gridPagerConfig" -->
80
+ <!-- @page-change="pageChangeEvent" -->
81
+ <template #matCode_header="{ column }">
82
+ <div class="first-col">
83
+ <div class="first-col-top">
84
+ {{ column.title }}
85
+ </div>
86
+ <div class="first-col-bottom">
87
+ <input style="width: 100%" />
88
+ </div>
89
+ </div>
90
+ </template>
91
+ <!-- 普通输入框的过滤筛选-->
92
+ <template #text_filter="{ column }">
93
+ <div class="interceptor-class">
94
+ <div
95
+ v-for="(item, $index) in column.filters"
96
+ :key="$index"
97
+ >
98
+ <a-input allowClear v-model="item.data" @keyup.enter.native="filterConfirm(column)" style="margin-bottom: 5px;" />
99
+ </div>
100
+ <a-button @click="filterAddExp(column)">添加条件</a-button>
101
+ <a-button @click="filterConfirm(column)">确认</a-button>
102
+ </div>
103
+ </template>
104
+ <!-- 选择筛选框-->
105
+ <template #select_filter="{ column }">
106
+ <div class="interceptor-class">
107
+ <a-checkbox-group
108
+ v-model="column.filters[0].data"
109
+ @keyup.enter.native="filterConfirm(column)"
110
+ >
111
+ <div style="max-height:200px;overflow-y:scroll">
112
+ <div style="text-align:left;" v-for="loopSource in column.params.dataSource" :key="loopSource.value">
113
+ <a-checkbox
114
+ :value="loopSource.value"
115
+ style="margin: 5px 0;"
116
+ >{{ loopSource.caption }}
117
+ </a-checkbox>
118
+ </div>
119
+ </div>
120
+ </a-checkbox-group>
121
+ <br>
122
+ <a-button @click="filterConfirm(column)">确认</a-button>
123
+ </div>
124
+ </template>
125
+ <template #pager>
126
+ <a-row>
127
+ <a-col :span="8">
128
+ <a-button
129
+ v-if="isMultiSelect === true"
130
+ type="primary"
131
+ size="small"
132
+ style="margin: 5px"
133
+ @click="multiSelectConfirm"
134
+ >
135
+ 确认选择
136
+ </a-button>
137
+ <a-button
138
+ v-if="popupAddName"
139
+ type="primary"
140
+ size="small"
141
+ style="margin: 5px"
142
+ @click="pagerBtnClick(btn)"
143
+ >
144
+ 新增
145
+ </a-button>
146
+
147
+ <template v-if="optBtns.length > 0">
148
+ <a-button
149
+ v-for="btn in optBtns"
150
+ :key="btn.field"
151
+ type="primary"
152
+ size="small"
153
+ style="margin: 5px"
154
+ @click="pagerBtnClick(btn)"
155
+ >
156
+ {{ btn.name }}
157
+ </a-button>
158
+ </template>
159
+ </a-col>
160
+ <a-col :span="16">
161
+ <vxe-pager
162
+ align="right"
163
+ size="mini"
164
+ :current-page.sync="gridPagerConfig.currentPage"
165
+ :page-size.sync="gridPagerConfig.pageSize"
166
+ :total="gridPagerConfig.total"
167
+ @page-change="pageChangeEvent"
168
+ >
169
+ </vxe-pager>
170
+ </a-col>
171
+ </a-row>
172
+ </template>
173
+ </vxe-grid>
174
+ </div>
175
+ </template>
176
+ </VxePulldown>
177
+ <span v-if="edit === false">
178
+ <a v-if="route" @click="routeLinkClick">{{ currentValue }}</a>
179
+ <span v-else> {{ currentValue }}</span>
180
+ </span>
181
+ </div>
182
+ <keep-alive>
183
+ <div
184
+ :is="popupAddName"
185
+ ref="pupupAddView"
186
+ @popupSaveAfter="popupSaveAfter"
187
+ ></div>
188
+ </keep-alive>
189
+ </div>
190
+ </template>
191
+
192
+ <script>
193
+ import XEUtils from "xe-utils";
194
+ import { sysRowState, sysFormState, controlType } from "../../utils/enum";
195
+ import { replaceParamString, replaceParam } from "../../utils/common";
196
+ import request from "../../utils/request";
197
+ import {Input, Button, Row, Col, Checkbox} from "ant-design-vue";
198
+ import { ValidationProvider } from "vee-validate";
199
+ import { Pulldown } from "vxe-table";
200
+ import { Tooltip } from "ant-design-vue";
201
+ export default {
202
+ name: "BasePulldown",
203
+ components: {
204
+ "a-input": Input,
205
+ "a-button": Button,
206
+ "a-row": Row,
207
+ "a-col": Col,
208
+ "a-checkbox": Checkbox,
209
+ "a-checkbox-group": Checkbox.Group,
210
+ VxePulldown: Pulldown,
211
+ ValidationProvider,
212
+ Tooltip,
213
+ },
214
+ data() {
215
+ return {
216
+ fetchFields: "",
217
+ internalColumns: [],
218
+ isInputChanged: false,
219
+ inputTimeout: null,
220
+ searchRows: [],
221
+ filterCols: [],
222
+ gridLoading: false,
223
+ gridPagerConfig: {
224
+ total: 0,
225
+ currentPage: 1,
226
+ pageSize: 10,
227
+ },
228
+ sorts: [],
229
+ defaultSort: [],
230
+ filterExpression: {
231
+ operator: 'and',
232
+ expressions: []
233
+ }
234
+ };
235
+ },
236
+ props: {
237
+ labelWidth: {
238
+ type: Number,
239
+ default: function () {
240
+ return 0;
241
+ },
242
+ },
243
+ isMultiSelect: {
244
+ type: Boolean,
245
+ default: function () {
246
+ return false;
247
+ },
248
+ },
249
+ popupAddName: {
250
+ type: String,
251
+ default: function () {
252
+ return null;
253
+ },
254
+ },
255
+ popupAddPath: {
256
+ type: String,
257
+ default: function () {
258
+ return null;
259
+ },
260
+ },
261
+ rules: {
262
+ type: Object,
263
+ default: function () {
264
+ return null;
265
+ },
266
+ },
267
+ showLabel: {
268
+ type: Boolean,
269
+ default: function () {
270
+ return true;
271
+ },
272
+ },
273
+ label: {
274
+ type: String,
275
+ default: function () {
276
+ return "";
277
+ },
278
+ },
279
+ defaultExpression: {
280
+ type: String,
281
+ default: function () {
282
+ return "";
283
+ },
284
+ },
285
+ formRow: {
286
+ type: Object,
287
+ default: function () {
288
+ return {};
289
+ },
290
+ },
291
+ row: {
292
+ type: Object,
293
+ default: function () {
294
+ return {};
295
+ },
296
+ },
297
+ edit: {
298
+ type: Boolean,
299
+ default: function () {
300
+ return false;
301
+ },
302
+ },
303
+ route: Object,
304
+ placeholder: {
305
+ // 提示信息
306
+ type: String,
307
+ },
308
+ api: {
309
+ // api接口
310
+ type: String,
311
+ },
312
+ field: {
313
+ type: String,
314
+ },
315
+ pageSize: {
316
+ // 分页数量,默认不分页
317
+ type: Number,
318
+ default: () => {
319
+ return 0;
320
+ },
321
+ },
322
+ columns: {
323
+ // 列集合
324
+ type: Array,
325
+ default: () => {
326
+ return [];
327
+ },
328
+ },
329
+ isOld: {
330
+ // 列集合
331
+ type: Boolean,
332
+ default: () => {
333
+ return false;
334
+ },
335
+ },
336
+ exps: {
337
+ // 条件
338
+ type: Array,
339
+ default: () => {
340
+ return [];
341
+ },
342
+ },
343
+ value: {
344
+ type: String,
345
+ default: function () {
346
+ return "";
347
+ },
348
+ },
349
+ optBtns: {
350
+ // 操作按钮
351
+ type: Array,
352
+ default: () => {
353
+ return [];
354
+ },
355
+ },
356
+ gridTable: {
357
+ // 操作按钮
358
+ type: Object,
359
+ default: () => {
360
+ return null;
361
+ },
362
+ },
363
+ immediate: {
364
+ type: Boolean,
365
+ default: true,
366
+ },
367
+ isLocalData: {
368
+ type: Boolean,
369
+ default: false,
370
+ },
371
+ tooltip: {
372
+ type: String,
373
+ default: function () {
374
+ return "";
375
+ },
376
+ },
377
+ propTableData: {
378
+ type: Array,
379
+ default: function () {
380
+ return [];
381
+ },
382
+ },
383
+ },
384
+ watch: {},
385
+ computed: {
386
+ currentValue: {
387
+ // 动态计算currentValue的值
388
+ get: function () {
389
+ return this.value; // 将props中的value赋值给currentValue
390
+ },
391
+ set: function (val) {
392
+ this.$emit("input", val); // 通过$emit触发父组件
393
+ },
394
+ },
395
+ },
396
+ created() {
397
+ // if (this.popupAddName && !this.$options.components[this.popupAddName]) {
398
+ // // const tempRequire = require('@/views' + this.popupAddPath + '.vue').default
399
+ // // this.$options.components[this.popupAddName] = tempRequire
400
+ // this.$options.components[this.popupAddName] = () =>
401
+ // import('@/views' + this.popupAddPath + '.vue')
402
+ // }
403
+ this.gridPagerConfig.pageSize = this.pageSize;
404
+
405
+ this.internalColumns.push({
406
+ type: "seq",
407
+ fixed: "left",
408
+ width: 50,
409
+ });
410
+
411
+ if (this.isMultiSelect === true) {
412
+ this.internalColumns.push({
413
+ type: "checkbox",
414
+ fixed: "left",
415
+ width: 40,
416
+ });
417
+ }
418
+
419
+ for (let i = 0; i < this.columns.length; i++) {
420
+ this.fetchFields = this.fetchFields + this.columns[i].field + ",";
421
+ this.columns[i]["params"] = {
422
+ dataSource: [],
423
+ };
424
+ if (this.columns[i].dataSource) {
425
+ this.columns[i]["params"].dataSource = this.columns[i].dataSource;
426
+ }
427
+ if (!this.columns[i].width) {
428
+ this.columns[i]["width"] = 100;
429
+ }
430
+ if (this.columns[i].isCheckbox === true) {
431
+ this.columns[i]["type"] = "checkbox";
432
+ }
433
+ if(!this.columns[i].controlType) {
434
+ this.columns[i].controlType = 'text'
435
+ }
436
+ // 设置字段的过滤插槽
437
+ if(this.columns[i].filter) {
438
+ this.columns[i]["filterMultiple"] = false;
439
+
440
+ switch(this.columns[i].controlType) {
441
+ case 'checkbox':
442
+ this.columns[i]['slots'] = {
443
+ filter: `checkbox_filter`
444
+ }
445
+ break
446
+ case 'select':
447
+ this.columns[i]['slots'] = {
448
+ filter: `select_filter`
449
+ }
450
+ this.columns[i]['filters'] = [
451
+ {
452
+ data: []
453
+ }
454
+ ]
455
+ break
456
+ default:
457
+ this.columns[i]['slots'] = {
458
+ filter: `text_filter`
459
+ }
460
+ this.columns[i]['filters'] = [
461
+ {
462
+ data: ''
463
+ }
464
+ ]
465
+ break
466
+ }
467
+ }
468
+ // 默认排序
469
+ if (this.columns[i].defaultSort) {
470
+ this.defaultSort.push({
471
+ field: this.columns[i].field,
472
+ order: this.columns[i].defaultSort,
473
+ });
474
+ this.sorts.push([this.columns[i].field, this.columns[i].defaultSort]);
475
+ }
476
+ this.internalColumns.push(this.columns[i]);
477
+ if (this.columns[i].filter === true) {
478
+ this.filterCols.push(this.columns[i]);
479
+ }
480
+ }
481
+ },
482
+ methods: {
483
+ gridRowStyle(scope) {
484
+ if (scope.row.sysRepeat === true) {
485
+ return "row--pending";
486
+ }
487
+ // if(scope.row.)
488
+ },
489
+ clearInputValue() {
490
+ if (this.isInputChanged === true) {
491
+ this.setLinkValue(null, this.row);
492
+ this.$emit("selectChanged", null);
493
+ }
494
+ },
495
+ routeLinkClick() {
496
+ //首先需要判断是否有权限
497
+ // let treeModule = XEUtils.findTree(
498
+ // this.$store.getters.addRouters,
499
+ // item => item.name === this.route.name
500
+ // )
501
+ // if (!treeModule) {
502
+ // this.$antwarning('没有权限')
503
+ // return
504
+ // }
505
+ this.$router.pushRoute({
506
+ name: this.route.name,
507
+ query: { id: this.row[this.route.field] },
508
+ });
509
+ },
510
+ /**
511
+ * 输入框改变事件
512
+ */
513
+ inputChangeEvent(event) {
514
+ this.isInputChanged = true;
515
+ if (event.type === "click" && event.pointerType === "mouse") {
516
+ //点击了清空按钮
517
+ this.$nextTick(() => {
518
+ this.clearInputValue();
519
+ this.inputClickEvent(null);
520
+ });
521
+ }
522
+ },
523
+ inputBlurEvent(event) {},
524
+ /**
525
+ * 输入框获取焦点事件
526
+ */
527
+ inputFocusEvent(event) {
528
+ event.currentTarget.select();
529
+ // this.$refs.pulldownRef.showPanel()
530
+ // this.searchData()
531
+ },
532
+ /**
533
+ * Tab键隐藏面板
534
+ */
535
+ inputKeydownEvent(event) {
536
+ if (event.keyCode === 9) {
537
+ //tab事件
538
+ this.$refs.pulldownRef.hidePanel();
539
+ this.clearInputValue();
540
+ }
541
+ },
542
+ inputClickEvent(event) {
543
+ if (this.$refs.pulldownRef.isPanelVisible() === false) {
544
+ this.$refs.pulldownRef.showPanel();
545
+ this.clearColumnFilter()
546
+ this.searchData();
547
+ } else {
548
+ this.$refs.pulldownRef.hidePanel();
549
+ }
550
+ },
551
+ /**
552
+ * 输入库输入事件
553
+ */
554
+ inputKeyupEvent(event) {
555
+ //好像ok
556
+ if (!this.immediate && event.keyCode !== 13) {
557
+ console.debug("davistest");
558
+ } else {
559
+ if (this.inputTimeout) {
560
+ clearTimeout(this.inputTimeout);
561
+ }
562
+ let vm = this;
563
+ this.inputTimeout = setTimeout(() => {
564
+ //判断面板是否打开
565
+ if (vm.$refs.pulldownRef.isPanelVisible() === false) {
566
+ vm.$refs.pulldownRef.showPanel();
567
+ }
568
+ vm.searchData();
569
+ }, 500);
570
+ }
571
+ },
572
+ /**
573
+ * 网格列选中事件
574
+ */
575
+ gridCellClick({ row, column }) {
576
+ if (row.sysRepeat === true) {
577
+ return;
578
+ }
579
+ if (column.type === "seq" || column.type === "checkbox") {
580
+ return;
581
+ }
582
+ this.isInputChanged = false;
583
+ this.setLinkValue(row, this.row);
584
+ this.$emit("selectChanged", row);
585
+ this.$refs.pulldownRef.hidePanel();
586
+ },
587
+ setLinkValue(pulldownRow, oriRow) {
588
+ for (let i = 0; i < this.internalColumns.length; i++) {
589
+ if (this.internalColumns[i].linkField) {
590
+ let tempLinkFields = this.internalColumns[i].linkField.split(".");
591
+ let tempRow = oriRow;
592
+ // for(let j=0;j<tempLinkFields.length;j++){
593
+ // let tempField = tempLinkFields[j]
594
+ // //如果赋值的属性不存在数据集中,就忽略更新,防止修改后网格单元格值不更细
595
+ // if (!(tempField in tempRow)) {
596
+ // this.$antwarning(
597
+ // '赋值字段[' + this.internalColumns[i].linkField + ']不存在'
598
+ // )
599
+ // break
600
+ // }
601
+ // if(j===tempLinkFields.length-1){
602
+ // if (pulldownRow === null) {
603
+ // if (this.internalColumns[i].nullClear === false) {
604
+ // //是否空值清除数据,用于可选可输入的控件
605
+ // continue
606
+ // }
607
+ // this.$set(tempRow, tempField, null)
608
+ // } else {
609
+ // this.$set(
610
+ // tempRow,
611
+ // tempField,
612
+ // this.getLinkValue(tempField, pulldownRow)
613
+ // )
614
+ // }
615
+ // }else{
616
+ // tempRow = tempRow[tempField]
617
+ // }
618
+ // }
619
+
620
+ //如果赋值的属性不存在数据集中,就忽略更新,防止修改后网格单元格值不更细
621
+ if (!(this.internalColumns[i].linkField in oriRow)) {
622
+ this.$antwarning(
623
+ "赋值字段[" + this.internalColumns[i].linkField + "]不存在"
624
+ );
625
+ continue;
626
+ }
627
+ if (pulldownRow === null) {
628
+ if (this.internalColumns[i].nullClear === false) {
629
+ //是否空值清楚数据,用于可选可输入的控件
630
+ continue;
631
+ }
632
+ this.$set(oriRow, this.internalColumns[i].linkField, null);
633
+ } else {
634
+ this.$set(
635
+ oriRow,
636
+ this.internalColumns[i].linkField,
637
+ this.getLinkValue(this.internalColumns[i].field, pulldownRow)
638
+ );
639
+ }
640
+ }
641
+ }
642
+ },
643
+ getLinkValue(field, row) {
644
+ let linkField = field.split(".");
645
+ if (linkField.length > 1) {
646
+ let fieldValue = row;
647
+ for (let i = 0; i < linkField.length; i++) {
648
+ if (
649
+ fieldValue[linkField[i]] === undefined ||
650
+ fieldValue[linkField[i]] === null
651
+ ) {
652
+ return null;
653
+ }
654
+ fieldValue = fieldValue[linkField[i]];
655
+ }
656
+ return fieldValue;
657
+ }
658
+ return row[field];
659
+ },
660
+ /**
661
+ * 左下角按钮点击事件
662
+ */
663
+ pagerBtnClick(btn) {
664
+ this.$refs.pupupAddView.show();
665
+ // this.$emit('pulldownBtnClick', btn)
666
+ this.$refs.pulldownRef.hidePanel();
667
+ },
668
+ // 多选内容时,若数据不满足条件,不可选中
669
+ checkMethod({ row }) {
670
+ if (row.sysRepeat) {
671
+ return false;
672
+ }
673
+ return true;
674
+ },
675
+ /**
676
+ * 确认多选
677
+ */
678
+ multiSelectConfirm() {
679
+ this.isInputChanged = false;
680
+ this.$emit(
681
+ "confirmMultiSelect",
682
+ this,
683
+ this.$refs.pupupGridView.getCheckboxRecords(true)
684
+ );
685
+ this.$refs.pulldownRef.hidePanel();
686
+ },
687
+ popupSaveAfter(pupupAddRowInfo) {
688
+ let postData = {
689
+ fields: null,
690
+ begin: 1,
691
+ size: 1,
692
+ expression: {},
693
+ sorts: "",
694
+ };
695
+ let tempKeyExp = XEUtils.find(
696
+ this.internalColumns,
697
+ (item) => item.isKey === true
698
+ );
699
+ postData.expression = {
700
+ operator: "and",
701
+ expressions: [
702
+ {
703
+ operator: "and",
704
+ expressions: [
705
+ {
706
+ field: tempKeyExp.field,
707
+ operator: "EQ",
708
+ value: pupupAddRowInfo["id"],
709
+ },
710
+ ],
711
+ },
712
+ ],
713
+ };
714
+ let vm = this;
715
+ let tempApi = this.getPostApi(postData);
716
+ request({
717
+ url: tempApi,
718
+ method: "post",
719
+ data: postData,
720
+ })
721
+ .then((responseData) => {
722
+ if (responseData.content.length > 0) {
723
+ vm.setLinkValue(responseData.content[0], vm.row);
724
+ vm.$emit("selectChanged", responseData.content[0]);
725
+ }
726
+ })
727
+ .catch((error) => {
728
+ console.error(error);
729
+ })
730
+ .finally(() => {});
731
+ },
732
+ /**
733
+ * 分页改变事件
734
+ */
735
+ pageChangeEvent({ currentPage, pageSize }) {
736
+ this.gridPagerConfig.currentPage = currentPage;
737
+ this.gridPagerConfig.pageSize = pageSize;
738
+ this.searchData();
739
+ },
740
+ /**
741
+ * 面板隐藏事件
742
+ */
743
+ pullDownHideEvent({ $event }) {
744
+ this.clearInputValue();
745
+ },
746
+ /**
747
+ * 查询数据
748
+ */
749
+ searchData() {
750
+ if (this.isLocalData === true) {
751
+ let tempSearch = {
752
+ value: this.currentValue,
753
+ dataSource: [],
754
+ };
755
+ this.$emit("preSearch", tempSearch);
756
+ this.searchRows = tempSearch.dataSource;
757
+ this.gridPagerConfig.total = tempSearch.dataSource.length;
758
+ return;
759
+ }
760
+
761
+ let tempExp = {
762
+ operator: "or",
763
+ expressions: [],
764
+ };
765
+ if (this.isOld === true) {
766
+ tempExp = "";
767
+ }
768
+ if (this.currentValue) {
769
+ for (let i = 0; i < this.filterCols.length; i++) {
770
+ if (this.isOld === true) {
771
+ tempExp =
772
+ tempExp +
773
+ this.filterCols[i].field +
774
+ '.contains("' +
775
+ this.currentValue +
776
+ '")';
777
+ if (i < this.filterCols.length - 1) {
778
+ tempExp = tempExp + " or ";
779
+ }
780
+ } else {
781
+ if (this.filterCols[i].controlType == "number") {
782
+ tempExp.expressions.push({
783
+ field: this.filterCols[i].field,
784
+ operator: "EQ",
785
+ value: Number(this.currentValue),
786
+ });
787
+ } else {
788
+ tempExp.expressions.push({
789
+ field: this.filterCols[i].field,
790
+ operator: "CO",
791
+ value: this.currentValue,
792
+ });
793
+ }
794
+ }
795
+ }
796
+ }
797
+ if (this.isOld === true && tempExp.length > 0) {
798
+ tempExp = "(" + tempExp + ")";
799
+ }
800
+
801
+ if (this.defaultExpression) {
802
+ let tempDefault = replaceParamString(
803
+ this.defaultExpression,
804
+ this.formRow,
805
+ this.$store.getters.moduleSelectItems[this.$route.meta.moduleId]
806
+ );
807
+
808
+ if (tempExp) {
809
+ tempExp = tempExp + " and (" + tempDefault + ")";
810
+ } else {
811
+ tempExp = tempDefault;
812
+ }
813
+ }
814
+
815
+ let postExpression = {
816
+ field: this.field,
817
+ expression: tempExp,
818
+ extendParams: {},
819
+ };
820
+ let repeatRowInfo = {
821
+ field: "",
822
+ values: [],
823
+ };
824
+ //查询之前从外部组件构造其他的条件
825
+ this.$emit("preSearch", postExpression, repeatRowInfo);
826
+ if(this.filterExpression.expressions.length > 0) {
827
+ postExpression.expression.expressions.push(this.filterExpression)
828
+ }
829
+ let postData = {
830
+ fields: this.fetchFields,
831
+ begin:
832
+ (this.gridPagerConfig.currentPage - 1) *
833
+ this.gridPagerConfig.pageSize +
834
+ 1,
835
+ size: this.gridPagerConfig.pageSize,
836
+ expression: postExpression.expression,
837
+ sorts: this.sorts,
838
+ extendParams: postExpression.extendParams,
839
+ };
840
+ // console.log(postData.sorts);
841
+ let tempApi = this.getPostApi(postData);
842
+
843
+ // let tempApi = this.api
844
+ // if (this.api.indexOf('?') > 0) {
845
+ // tempApi = this.api.substring(0, this.api.indexOf('?'))
846
+ // let tempExtenParams = this.api.substring(this.api.indexOf('?') + 1)
847
+ // tempExtenParams = replaceParam(tempExtenParams, this.formRow)
848
+ // let tempSplitParams = tempExtenParams.split('&')
849
+ // for (let i = 0; i < tempSplitParams.length; i++) {
850
+ // let tempSplitValue = tempSplitParams[i].split('=')
851
+ // this.$set(
852
+ // postData.extendParams,
853
+ // tempSplitValue[0],
854
+ // tempSplitValue[1]
855
+ // )
856
+ // }
857
+ // }
858
+ let vm = this;
859
+ vm.gridLoading = true;
860
+ request({
861
+ url: tempApi,
862
+ method: "post",
863
+ data: postData,
864
+ })
865
+ .then((responseData) => {
866
+ if (vm.isOld === true) {
867
+ vm.searchRows = responseData.data;
868
+ vm.gridPagerConfig.total = responseData.extData.totalRows;
869
+ } else {
870
+ vm.searchRows = responseData.content;
871
+ vm.$refs.pupupGridView.loadData(vm.searchRows)
872
+ vm.gridPagerConfig.total = responseData.otherContent.totalRows;
873
+ }
874
+ if (repeatRowInfo.field) {
875
+ //设置重复值
876
+ XEUtils.arrayEach(vm.searchRows, (item) => {
877
+ if (
878
+ XEUtils.arrayIndexOf(
879
+ repeatRowInfo.values,
880
+ item[repeatRowInfo.field]
881
+ ) > -1
882
+ ) {
883
+ item["sysRepeat"] = true;
884
+ } else {
885
+ item["sysRepeat"] = false;
886
+ }
887
+ });
888
+ }
889
+ // 设置字段sysRepeat后,所定字段的值全部相同则不可选择
890
+ let fieldNames = vm.columns
891
+ .filter((x) => x.sysRepeat)
892
+ .map((y) => {
893
+ return {
894
+ field: y.field,
895
+ linkField: y.linkField,
896
+ };
897
+ });
898
+ if (fieldNames.length) {
899
+ vm.searchRows.forEach((info) => {
900
+ vm.propTableData.forEach((item) => {
901
+ // 接口字段可能和表字段field不一致,linkField一致
902
+ let arr = [];
903
+ for (let j = 0; j < fieldNames.length; j++) {
904
+ if (
905
+ info[fieldNames[j].field] == item[fieldNames[j].linkField]
906
+ ) {
907
+ arr.push(true);
908
+ }
909
+ }
910
+ if (fieldNames.length === arr.length) {
911
+ info.sysRepeat = true;
912
+ }
913
+ });
914
+ });
915
+ }
916
+ })
917
+ .catch((error) => {
918
+ console.error(error);
919
+ })
920
+ .finally(() => {
921
+ vm.gridLoading = false;
922
+ });
923
+ },
924
+ getPostApi(postData) {
925
+ let tempApi = this.api;
926
+ if (this.api.indexOf("?") > 0) {
927
+ tempApi = this.api.substring(0, this.api.indexOf("?"));
928
+ let tempExtenParams = this.api.substring(this.api.indexOf("?") + 1);
929
+ tempExtenParams = replaceParam(tempExtenParams, this.formRow);
930
+ let tempSplitParams = tempExtenParams.split("&");
931
+ for (let i = 0; i < tempSplitParams.length; i++) {
932
+ let tempSplitValue = tempSplitParams[i].split("=");
933
+ this.$set(
934
+ postData.extendParams,
935
+ tempSplitValue[0],
936
+ tempSplitValue[1]
937
+ );
938
+ }
939
+ }
940
+ return tempApi;
941
+ },
942
+ sortChange({ column, property, order, sortBy, sortList, $event }) {
943
+ let currentSort = sortList.map((x) => {
944
+ return [x.field, x.order];
945
+ });
946
+ this.sorts = currentSort;
947
+ this.searchData();
948
+ },
949
+
950
+ // 下拉容器筛选条件被触发
951
+ filterVisible({column}) {
952
+ XEUtils.remove(column.filters, item => {
953
+ return item.data === ''
954
+ })
955
+ if(column.filters.length === 0) {
956
+ column.filters.push({
957
+ data: ''
958
+ })
959
+ }
960
+ },
961
+ filterConfirm(column) {
962
+ let vm = this
963
+ this.filterExpression = {
964
+ operator: 'and',
965
+ expressions: []
966
+ }
967
+ let col= this.columns.find(x=>x.field === column.field)
968
+ switch(col.controlType) {
969
+ case 'select':
970
+ column.filters[0].checked =
971
+ column.filters[0].data.length > 0
972
+ break;
973
+ default:
974
+ column.filters[0].checked =
975
+ column.filters[0].data !== ''
976
+ break;
977
+ }
978
+ //通知外部筛选改变事件
979
+ let columns = this.$refs.pupupGridView.getTableColumn().collectColumn
980
+ XEUtils.each(columns, item => {
981
+ let filterExpression = {
982
+ operator: 'or',
983
+ expressions: []
984
+ }
985
+ switch (col.controlType) {
986
+ case 'select':
987
+ if(item.filters && item.filters[0].checked) {
988
+ XEUtils.each(item.filters[0].data, loopItem => {
989
+ filterExpression.expressions.push({
990
+ field: item.field,
991
+ operator: "EQ",
992
+ value: loopItem
993
+ })
994
+ })
995
+ if(filterExpression.expressions.length > 0) {
996
+ vm.filterExpression.expressions.push(filterExpression)
997
+ }
998
+ }
999
+ break
1000
+ default:
1001
+ if(item.filters && item.filters[0].checked) {
1002
+ XEUtils.each(item.filters, loopItem => {
1003
+ if(loopItem.data) {
1004
+ filterExpression.expressions.push({
1005
+ field: item.field,
1006
+ operator: "CO",
1007
+ value: loopItem.data
1008
+ })
1009
+ }
1010
+ })
1011
+ if(filterExpression.expressions.length > 0) {
1012
+ vm.filterExpression.expressions.push(filterExpression)
1013
+ }
1014
+ }
1015
+ break
1016
+ }
1017
+ })
1018
+ this.gridPagerConfig.currentPage = 1
1019
+ this.searchData()
1020
+ this.$refs.pupupGridView.closeFilter()
1021
+ },
1022
+ // 添加筛选条件
1023
+ filterAddExp(column) {
1024
+ column['filters'].push({
1025
+ data: ''
1026
+ })
1027
+ },
1028
+
1029
+ // 清楚筛选条件
1030
+ clearColumnFilter() {
1031
+ let columns = []
1032
+ let vm = this
1033
+ try {
1034
+ columns = this.$refs.pupupGridView.getTableColumn().collectColumn
1035
+ }catch (err) {
1036
+ console.debug(err)
1037
+ }
1038
+
1039
+ XEUtils.each(columns, item => {
1040
+ let col= vm.columns.find(x=>x.field === item.field)
1041
+ switch(col.controlType) {
1042
+ case 'select':
1043
+ if(item.filters && item.filters[0].checked) {
1044
+ item.filters = [{
1045
+ data: []
1046
+ }]
1047
+ }
1048
+ break;
1049
+ default:
1050
+ if(item.filters && item.filters[0].checked) {
1051
+ item.filters = [{
1052
+ data: ''
1053
+ }]
1054
+ }
1055
+ break;
1056
+ }
1057
+
1058
+ })
1059
+ this.filterExpression = {
1060
+ operator: 'and',
1061
+ expressions: []
1062
+ }
1063
+ },
1064
+ },
1065
+ };
1066
+ </script>
1067
+
1068
+ <style lang="scss" scoped>
1069
+ .pulldown-grid {
1070
+ min-width: 600px;
1071
+ width: auto;
1072
+ height: 350px;
1073
+ background-color: #fff;
1074
+ box-shadow: 0 0 6px 2px rgba(0, 0, 0, 0.1);
1075
+ }
1076
+
1077
+ .d-grid-control {
1078
+ height: 30px;
1079
+ }
1080
+ .interceptor-class {
1081
+ padding: 10px;
1082
+ ::v-deep .ant-btn {
1083
+ margin: 10px 10px 0;
1084
+ }
1085
+ }
1086
+ </style>
1087
+
1088
+
1089
+ <style lang="less">
1090
+ @import "../../styles/default.less";
1088
1091
  </style>