vsyswin-ui 0.2.47 → 0.2.51
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 +27 -31
- package/lib/vsyswin-ui.common.js +156 -106
- package/lib/vsyswin-ui.common.js.map +1 -1
- package/lib/vsyswin-ui.umd.js +156 -106
- package/lib/vsyswin-ui.umd.js.map +1 -1
- package/lib/vsyswin-ui.umd.min.js +12 -12
- package/lib/vsyswin-ui.umd.min.js.map +1 -1
- package/package.json +44 -44
- package/packages/newSearchBar/src/newSearchBar.vue +5 -1
- package/packages/search-bar/src/search-bar.vue +75 -40
package/package.json
CHANGED
|
@@ -1,46 +1,46 @@
|
|
|
1
1
|
{
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
2
|
+
"name": "vsyswin-ui",
|
|
3
|
+
"version": "0.2.51",
|
|
4
|
+
"main": "lib/vsyswin-ui.umd.min.js",
|
|
5
|
+
"private": false,
|
|
6
|
+
"description": "Vue2.x的应用组件库.",
|
|
7
|
+
"keywords": [
|
|
8
|
+
"syswin",
|
|
9
|
+
"syswin-ui"
|
|
10
|
+
],
|
|
11
|
+
"scripts": {
|
|
12
|
+
"serve": "vue-cli-service serve",
|
|
13
|
+
"build": "vue-cli-service build",
|
|
14
|
+
"lint": "vue-cli-service lint",
|
|
15
|
+
"lib": "vue-cli-service build --target lib --name vsyswin-ui --dest lib packages/index.js"
|
|
16
|
+
},
|
|
17
|
+
"dependencies": {
|
|
18
|
+
"core-js": "^3.6.5",
|
|
19
|
+
"deepmerge": "^4.2.2",
|
|
20
|
+
"element-ui": "^2.14.1",
|
|
21
|
+
"jquery": "^3.5.1",
|
|
22
|
+
"lodash": "^4.17.20",
|
|
23
|
+
"moment": "^2.29.1",
|
|
24
|
+
"throttle-debounce": "^3.0.1",
|
|
25
|
+
"vue": "^2.6.12",
|
|
26
|
+
"vuedraggable": "^2.23.2"
|
|
27
|
+
},
|
|
28
|
+
"devDependencies": {
|
|
29
|
+
"@vue/cli-plugin-babel": "~4.5.0",
|
|
30
|
+
"@vue/cli-plugin-eslint": "~4.5.0",
|
|
31
|
+
"@vue/cli-service": "~4.5.0",
|
|
32
|
+
"@vue/eslint-config-standard": "^5.1.2",
|
|
33
|
+
"babel-eslint": "^10.1.0",
|
|
34
|
+
"eslint": "^6.7.2",
|
|
35
|
+
"eslint-plugin-import": "^2.20.2",
|
|
36
|
+
"eslint-plugin-node": "^11.1.0",
|
|
37
|
+
"eslint-plugin-promise": "^4.2.1",
|
|
38
|
+
"eslint-plugin-standard": "^4.0.0",
|
|
39
|
+
"eslint-plugin-vue": "^6.2.2",
|
|
40
|
+
"sass": "^1.26.5",
|
|
41
|
+
"sass-loader": "^8.0.2",
|
|
42
|
+
"vue-router": "^3.5.3",
|
|
43
|
+
"vue-template-compiler": "^2.6.11",
|
|
44
|
+
"xe-utils": "^3.0.4"
|
|
45
|
+
}
|
|
46
46
|
}
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
<i class="el-icon-caret-bottom" :class="{ rotate180: !shrinkFilterList }"></i>
|
|
18
18
|
</a>
|
|
19
19
|
<el-button size="small" class="search-btn hover-btn" @click.stop="searchTable">查询</el-button>
|
|
20
|
-
<el-button size="small" class="search-btn reset-btn" @click="clearTags">重置</el-button>
|
|
20
|
+
<el-button v-if="resetBtnFlag" size="small" class="search-btn reset-btn" @click="clearTags">重置</el-button>
|
|
21
21
|
<div class="header-filter-btns">
|
|
22
22
|
<slot name="listBtns"></slot>
|
|
23
23
|
</div>
|
|
@@ -82,6 +82,10 @@ export default {
|
|
|
82
82
|
showSaveCondition: {
|
|
83
83
|
type: Boolean,
|
|
84
84
|
default: true
|
|
85
|
+
},
|
|
86
|
+
resetBtnFlag: {
|
|
87
|
+
type: Boolean,
|
|
88
|
+
default: true
|
|
85
89
|
}
|
|
86
90
|
},
|
|
87
91
|
created() {
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
>
|
|
44
44
|
</template>
|
|
45
45
|
<template v-else-if="item.type === 'daterange'">
|
|
46
|
-
<span class="syswin-filter-item__name" v-if="item.name">{{ item.name }}</span>
|
|
46
|
+
<span class="syswin-filter-item__name" v-if="item.name && !item.hideName">{{ item.name }}</span>
|
|
47
47
|
<el-date-picker
|
|
48
48
|
type="daterange"
|
|
49
49
|
v-model="item.value"
|
|
@@ -58,8 +58,20 @@
|
|
|
58
58
|
>
|
|
59
59
|
</el-date-picker>
|
|
60
60
|
</template>
|
|
61
|
+
<template v-else-if="item.type === 'month' || item.type === 'year'">
|
|
62
|
+
<span class="syswin-filter-item__name" v-if="item.name && !item.hideName">{{ item.name }}</span>
|
|
63
|
+
<el-date-picker
|
|
64
|
+
:type="item.type"
|
|
65
|
+
v-model="item.value"
|
|
66
|
+
size="small"
|
|
67
|
+
:placeholder="`选择${item.type === 'month' ? '月' : '年'}`"
|
|
68
|
+
:value-format="`${item.type === 'month' ? 'yyyy-MM' : 'yyyy'}`"
|
|
69
|
+
@change="handleChangeDateragne(idx, index)"
|
|
70
|
+
>
|
|
71
|
+
</el-date-picker>
|
|
72
|
+
</template>
|
|
61
73
|
<template v-else-if="item.type === 'datetimerange'">
|
|
62
|
-
<span class="syswin-filter-item__name" v-if="item.name">{{ item.name }}</span>
|
|
74
|
+
<span class="syswin-filter-item__name" v-if="item.name && !item.hideName">{{ item.name }}</span>
|
|
63
75
|
<el-date-picker
|
|
64
76
|
type="datetimerange"
|
|
65
77
|
v-model="item.value"
|
|
@@ -77,7 +89,7 @@
|
|
|
77
89
|
</el-date-picker>
|
|
78
90
|
</template>
|
|
79
91
|
<template v-else-if="item.type === 'select'">
|
|
80
|
-
<span class="syswin-filter-item__name" v-if="item.name">{{ item.name }}</span>
|
|
92
|
+
<span class="syswin-filter-item__name" v-if="item.name && !item.hideName">{{ item.name }}</span>
|
|
81
93
|
<el-select
|
|
82
94
|
:multiple="!!item.multiple"
|
|
83
95
|
collapse-tags
|
|
@@ -120,20 +132,17 @@
|
|
|
120
132
|
</template>
|
|
121
133
|
<template v-else-if="item.type === 'daterange'">
|
|
122
134
|
<span class="syswin-filter-item__name" v-if="item.name">{{ item.name }}</span>
|
|
123
|
-
<el-date-picker
|
|
124
|
-
|
|
125
|
-
v-model="item.value"
|
|
126
|
-
size="small"
|
|
127
|
-
range-separator="至"
|
|
128
|
-
start-placeholder="开始日期"
|
|
129
|
-
end-placeholder="结束日期"
|
|
130
|
-
:editable="false"
|
|
131
|
-
:unlink-panels="true"
|
|
132
|
-
value-format="timestamp"
|
|
133
|
-
@change="handleChangeDateragne(idx, index)"
|
|
135
|
+
<el-date-picker type="daterange" v-model="item.value" size="small" range-separator="至" start-placeholder="开始日期"
|
|
136
|
+
end-placeholder="结束日期" :editable="false" :unlink-panels="true" value-format="timestamp" @change="handleChangeDateragne(idx, index)"
|
|
134
137
|
>
|
|
135
138
|
</el-date-picker>
|
|
136
139
|
</template>
|
|
140
|
+
<template v-else-if="item.type === 'month' || item.type === 'year'">
|
|
141
|
+
<span class="syswin-filter-item__name" v-if="item.name && !item.hideName">{{ item.name }}</span>
|
|
142
|
+
<el-date-picker :type="item.type" v-model="item.value" size="small" :placeholder="`选择${item.type === 'month' ? '月' : '年'}`" :value-format="`${item.type === 'month' ? 'yyyy-MM' : 'yyyy'}`"
|
|
143
|
+
@change="handleChangeDateragne(idx, index)">
|
|
144
|
+
</el-date-picker>
|
|
145
|
+
</template>
|
|
137
146
|
<template v-else-if="item.type === 'datetimerange'">
|
|
138
147
|
<span class="syswin-filter-item__name" v-if="item.name">{{ item.name }}</span>
|
|
139
148
|
<el-date-picker
|
|
@@ -153,7 +162,7 @@
|
|
|
153
162
|
</el-date-picker>
|
|
154
163
|
</template>
|
|
155
164
|
<template v-else-if="item.type === 'select'">
|
|
156
|
-
<span class="syswin-filter-item__name" v-if="item.name">{{ item.name }}</span>
|
|
165
|
+
<span class="syswin-filter-item__name" v-if="item.name && !item.hideName">{{ item.name }}</span>
|
|
157
166
|
<el-select
|
|
158
167
|
:multiple="!!item.multiple"
|
|
159
168
|
collapse-tags
|
|
@@ -352,7 +361,7 @@ export default {
|
|
|
352
361
|
saveToLocalPosition: {
|
|
353
362
|
type: String,
|
|
354
363
|
default: 'right',
|
|
355
|
-
validator: function
|
|
364
|
+
validator: function(value) {
|
|
356
365
|
return ['left', 'right'].indexOf(value) !== -1
|
|
357
366
|
}
|
|
358
367
|
},
|
|
@@ -408,8 +417,8 @@ export default {
|
|
|
408
417
|
createTagList() {
|
|
409
418
|
const list = []
|
|
410
419
|
this.currentSearchList.length &&
|
|
411
|
-
this.currentSearchList.forEach(
|
|
412
|
-
ele.itemList.forEach(
|
|
420
|
+
this.currentSearchList.forEach(ele => {
|
|
421
|
+
ele.itemList.forEach(item => {
|
|
413
422
|
if (item.isActive || item.type === 'slot') {
|
|
414
423
|
let obj = {
|
|
415
424
|
pId: ele.id,
|
|
@@ -422,6 +431,9 @@ export default {
|
|
|
422
431
|
}
|
|
423
432
|
if (item.type === 'text') {
|
|
424
433
|
obj.name = item.name
|
|
434
|
+
} else if (item.type === 'month' || item.type === 'year') {
|
|
435
|
+
if (!item.value) return
|
|
436
|
+
obj.name = item.value + (item.type === 'month' ? '月' : '年')
|
|
425
437
|
} else if (item.type === 'daterange') {
|
|
426
438
|
if (!item.value || !item.value[0]) {
|
|
427
439
|
return
|
|
@@ -439,10 +451,10 @@ export default {
|
|
|
439
451
|
} else if (item.type === 'select') {
|
|
440
452
|
if (!item.value) return
|
|
441
453
|
if (item.multiple) {
|
|
442
|
-
const valueOptions = item.value.map(
|
|
443
|
-
obj.name = valueOptions.map(
|
|
454
|
+
const valueOptions = item.value.map(x => item.options.find(f => f.value === x))
|
|
455
|
+
obj.name = valueOptions.map(x => x.label).join(',')
|
|
444
456
|
} else {
|
|
445
|
-
obj.name = item.options.find(
|
|
457
|
+
obj.name = item.options.find(x => x.value === item.value).label
|
|
446
458
|
}
|
|
447
459
|
} else if (item.type === 'slot') {
|
|
448
460
|
const info = item.getValue()
|
|
@@ -504,12 +516,27 @@ export default {
|
|
|
504
516
|
this.keyword = ''
|
|
505
517
|
|
|
506
518
|
const currentSearchList = _.cloneDeep(this.currentSearchList)
|
|
507
|
-
currentSearchList.forEach(
|
|
508
|
-
ele.itemList.forEach(
|
|
519
|
+
currentSearchList.forEach(ele => {
|
|
520
|
+
ele.itemList.forEach(item => {
|
|
509
521
|
item.isActive = !!item.default
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
522
|
+
if (['month', 'year'].includes(item.type)) {
|
|
523
|
+
item.value = (item.default && item.defaultValue) ? item.defaultValue : ''
|
|
524
|
+
}
|
|
525
|
+
if (item.type === 'daterange' || item.type === 'datetimerange') {
|
|
526
|
+
item.value = (item.default && item.defaultValue) ? item.defaultValue : null
|
|
527
|
+
}
|
|
528
|
+
if (item.type === 'select') {
|
|
529
|
+
if (item.default && item.defaultValue) {
|
|
530
|
+
if (item.multiple) {
|
|
531
|
+
const valueOptions = item.defaultValue.map(x => item.options.find(f => f.value === x))
|
|
532
|
+
item.value = valueOptions.map(x => x.value)
|
|
533
|
+
} else {
|
|
534
|
+
item.value = item.defaultValue
|
|
535
|
+
}
|
|
536
|
+
} else {
|
|
537
|
+
item.value = null
|
|
538
|
+
}
|
|
539
|
+
}
|
|
513
540
|
item.type === 'slot' && item.setValue({ value: '', name: '' })
|
|
514
541
|
})
|
|
515
542
|
})
|
|
@@ -519,8 +546,8 @@ export default {
|
|
|
519
546
|
setDefaultTagList() {
|
|
520
547
|
const list = []
|
|
521
548
|
if (this.currentSearchList) {
|
|
522
|
-
this.currentSearchList.forEach(
|
|
523
|
-
ele.itemList.forEach(
|
|
549
|
+
this.currentSearchList.forEach(ele => {
|
|
550
|
+
ele.itemList.forEach(item => {
|
|
524
551
|
if (item.default) {
|
|
525
552
|
// 如果是默认值
|
|
526
553
|
const obj = {
|
|
@@ -533,6 +560,9 @@ export default {
|
|
|
533
560
|
}
|
|
534
561
|
if (item.type === 'text') {
|
|
535
562
|
obj.name = item.name
|
|
563
|
+
} else if (item.type === 'month' || item.type === 'year') {
|
|
564
|
+
if (!item.defaultValue) return
|
|
565
|
+
obj.name = item.defaultValue + (item.type === 'month' ? '月' : '年')
|
|
536
566
|
} else if (item.type === 'daterange') {
|
|
537
567
|
if (!item.defaultValue || !item.defaultValue[0]) {
|
|
538
568
|
return
|
|
@@ -550,10 +580,12 @@ export default {
|
|
|
550
580
|
} else if (item.type === 'select') {
|
|
551
581
|
if (!item.defaultValue) return
|
|
552
582
|
if (item.multiple) {
|
|
553
|
-
const valueOptions = item.defaultValue.map(
|
|
554
|
-
obj.name = valueOptions.map(
|
|
583
|
+
const valueOptions = item.defaultValue.map(x => item.options.find(f => f.value === x))
|
|
584
|
+
obj.name = valueOptions.map(x => x.label).join(',')
|
|
555
585
|
} else {
|
|
556
|
-
|
|
586
|
+
const defaultItem = item.options.find(x => x.value === item.defaultValue)
|
|
587
|
+
obj.name = defaultItem.label
|
|
588
|
+
obj.value = defaultItem
|
|
557
589
|
}
|
|
558
590
|
} else if (item.type === 'slot') {
|
|
559
591
|
// slot选项不设置默认值
|
|
@@ -576,6 +608,9 @@ export default {
|
|
|
576
608
|
// 单选
|
|
577
609
|
item.isActive = index === childIndex ? !childItem.isActive : false
|
|
578
610
|
;(item.type === 'daterange' || item.type === 'datetimerange') && (item.value = null)
|
|
611
|
+
if (item.type === 'month' || item.type === 'year') {
|
|
612
|
+
item.value = ''
|
|
613
|
+
}
|
|
579
614
|
if (item.type === 'select') {
|
|
580
615
|
item.value = item.multiple ? [] : null
|
|
581
616
|
}
|
|
@@ -607,7 +642,7 @@ export default {
|
|
|
607
642
|
this.$set(this.currentSearchList, parentIndex, parentItem)
|
|
608
643
|
}
|
|
609
644
|
} else {
|
|
610
|
-
item.value = null
|
|
645
|
+
item.value = item.type === 'month' || item.type === 'year' ? '' : null
|
|
611
646
|
item.isActive = false
|
|
612
647
|
this.$set(this.currentSearchList[parentIndex].itemList, childIndex, item)
|
|
613
648
|
}
|
|
@@ -620,15 +655,15 @@ export default {
|
|
|
620
655
|
// 切换保存过滤条件的下拉框
|
|
621
656
|
handleChangeCondition(value) {
|
|
622
657
|
this.conditionValue = value
|
|
623
|
-
const list = this.conditionList.filter(
|
|
658
|
+
const list = this.conditionList.filter(item => item.value === value)
|
|
624
659
|
if (list.length) {
|
|
625
660
|
const currentSearchList = _.cloneDeep(this.currentSearchList)
|
|
626
661
|
const { keyword = '', filterList = [] } = list[0]
|
|
627
662
|
this.keyword = keyword
|
|
628
663
|
|
|
629
664
|
// 先清空所有标签
|
|
630
|
-
currentSearchList.forEach(
|
|
631
|
-
ele.itemList.forEach(
|
|
665
|
+
currentSearchList.forEach(ele => {
|
|
666
|
+
ele.itemList.forEach(item => {
|
|
632
667
|
item.isActive = false
|
|
633
668
|
item.type === 'daterange' && (item.value = null)
|
|
634
669
|
})
|
|
@@ -636,10 +671,10 @@ export default {
|
|
|
636
671
|
|
|
637
672
|
// 设置选中的标签
|
|
638
673
|
if (filterList && filterList.length) {
|
|
639
|
-
filterList.forEach(
|
|
640
|
-
currentSearchList.forEach(
|
|
674
|
+
filterList.forEach(ele => {
|
|
675
|
+
currentSearchList.forEach(item => {
|
|
641
676
|
if (ele.pId === item.id) {
|
|
642
|
-
item.itemList.forEach(
|
|
677
|
+
item.itemList.forEach(v => {
|
|
643
678
|
if (v.type === 'slot') {
|
|
644
679
|
v.setValue({ value: ele.value, name: ele.name, ...ele })
|
|
645
680
|
}
|
|
@@ -676,7 +711,7 @@ export default {
|
|
|
676
711
|
let localList = localStorage.getItem(`syswin${this.storageName}`)
|
|
677
712
|
if (!['', undefined, null].includes(localList)) {
|
|
678
713
|
localList = JSON.parse(localList)
|
|
679
|
-
const idx = localList.findIndex(
|
|
714
|
+
const idx = localList.findIndex(ele => ele.value === item.value)
|
|
680
715
|
idx > -1 && localList.splice(idx, 1)
|
|
681
716
|
localList.length > 0
|
|
682
717
|
? localStorage.setItem(`syswin${this.storageName}`, JSON.stringify(localList))
|
|
@@ -697,7 +732,7 @@ export default {
|
|
|
697
732
|
this.conditionValue = momentValue
|
|
698
733
|
} else {
|
|
699
734
|
// 编辑
|
|
700
|
-
const index = this.conditionList.findIndex(
|
|
735
|
+
const index = this.conditionList.findIndex(ele => ele.value === this.currentData.value)
|
|
701
736
|
const item = this.conditionList[index]
|
|
702
737
|
item.label = label
|
|
703
738
|
this.$set(this.conditionList, index, item)
|