vsyswin-ui 0.2.63 → 0.2.66
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/lib/vsyswin-ui.common.js +96 -65
- package/lib/vsyswin-ui.common.js.map +1 -1
- package/lib/vsyswin-ui.umd.js +96 -65
- package/lib/vsyswin-ui.umd.js.map +1 -1
- package/lib/vsyswin-ui.umd.min.js +9 -9
- package/lib/vsyswin-ui.umd.min.js.map +1 -1
- package/package.json +1 -1
- package/packages/search-bar/src/search-bar.scss +11 -1
- package/packages/search-bar/src/search-bar.vue +72 -42
- package/packages/styles/common-old.scss +14 -0
package/package.json
CHANGED
|
@@ -28,6 +28,11 @@
|
|
|
28
28
|
margin-left: 8px;
|
|
29
29
|
color: $--color-primary;
|
|
30
30
|
font-size: $--font-size-base;
|
|
31
|
+
&:hover {
|
|
32
|
+
background: transparent !important;
|
|
33
|
+
color: #027aff !important;
|
|
34
|
+
border-color: transparent !important;
|
|
35
|
+
}
|
|
31
36
|
.el-icon-caret-bottom {
|
|
32
37
|
transition: $--all-transition;
|
|
33
38
|
|
|
@@ -50,12 +55,17 @@
|
|
|
50
55
|
}
|
|
51
56
|
}
|
|
52
57
|
|
|
53
|
-
@include e(reset) {
|
|
58
|
+
@include e(reset) {
|
|
54
59
|
padding: 0;
|
|
55
60
|
width: $--button-width-base;
|
|
56
61
|
height: $--button-height-base;
|
|
57
62
|
font-size: $--button-font-size;
|
|
58
63
|
border-radius: $--button-border-radius-small;
|
|
64
|
+
&:hover {
|
|
65
|
+
color: #606266 !important;
|
|
66
|
+
border-color: #DCDFE6 !important;
|
|
67
|
+
background: #fff !important;
|
|
68
|
+
}
|
|
59
69
|
}
|
|
60
70
|
|
|
61
71
|
@include e(listBtns) {
|
|
@@ -314,6 +314,22 @@
|
|
|
314
314
|
import _ from 'lodash'
|
|
315
315
|
import moment from 'moment'
|
|
316
316
|
import saveLocal from './save-local'
|
|
317
|
+
|
|
318
|
+
function deepCopyFunction(arr1, arr2) {
|
|
319
|
+
for (let i = 0; i < arr1.length; i++) {
|
|
320
|
+
const father1 = arr1[i]
|
|
321
|
+
const father2 = arr2[i]
|
|
322
|
+
for (let j = 0; j < father1.itemList.length; j++) {
|
|
323
|
+
const item1 = father1.itemList[j]
|
|
324
|
+
const item2 = father2.itemList[j]
|
|
325
|
+
if (item1.type === 'slot') {
|
|
326
|
+
item1.getValue = item2.getValue
|
|
327
|
+
item1.setValue = item2.setValue
|
|
328
|
+
}
|
|
329
|
+
}
|
|
330
|
+
}
|
|
331
|
+
}
|
|
332
|
+
|
|
317
333
|
export default {
|
|
318
334
|
name: 'SySearchbar',
|
|
319
335
|
components: {
|
|
@@ -382,7 +398,7 @@ export default {
|
|
|
382
398
|
saveToLocalPosition: {
|
|
383
399
|
type: String,
|
|
384
400
|
default: 'right',
|
|
385
|
-
validator: function(value) {
|
|
401
|
+
validator: function (value) {
|
|
386
402
|
return ['left', 'right'].indexOf(value) !== -1
|
|
387
403
|
}
|
|
388
404
|
},
|
|
@@ -411,6 +427,7 @@ export default {
|
|
|
411
427
|
searchList: {
|
|
412
428
|
handler(value) {
|
|
413
429
|
this.currentSearchList = _.cloneDeep(value)
|
|
430
|
+
deepCopyFunction(this.currentSearchList, value)
|
|
414
431
|
if (!this.hasSetDefaultTag) {
|
|
415
432
|
this.setDefaultTagList()
|
|
416
433
|
this.hasSetDefaultTag = true
|
|
@@ -438,8 +455,8 @@ export default {
|
|
|
438
455
|
createTagList() {
|
|
439
456
|
const list = []
|
|
440
457
|
this.currentSearchList.length &&
|
|
441
|
-
this.currentSearchList.forEach(ele => {
|
|
442
|
-
ele.itemList.forEach(item => {
|
|
458
|
+
this.currentSearchList.forEach((ele) => {
|
|
459
|
+
ele.itemList.forEach((item) => {
|
|
443
460
|
if (item.isActive || item.type === 'slot') {
|
|
444
461
|
let obj = {
|
|
445
462
|
pId: ele.id,
|
|
@@ -472,13 +489,14 @@ export default {
|
|
|
472
489
|
} else if (item.type === 'select') {
|
|
473
490
|
if (!item.value) return
|
|
474
491
|
if (item.multiple) {
|
|
475
|
-
const valueOptions = item.value.map(x => item.options.find(f => f.value === x))
|
|
476
|
-
obj.name = valueOptions.map(x => x.label).join(',')
|
|
492
|
+
const valueOptions = item.value.map((x) => item.options.find((f) => f.value === x))
|
|
493
|
+
obj.name = valueOptions.map((x) => x.label).join(',')
|
|
477
494
|
} else {
|
|
478
|
-
obj.name = item.options.find(x => x.value === item.value).label
|
|
495
|
+
obj.name = item.options.find((x) => x.value === item.value).label
|
|
479
496
|
}
|
|
480
497
|
} else if (item.type === 'slot') {
|
|
481
|
-
|
|
498
|
+
if (!item.getValue) return
|
|
499
|
+
const info = item.getValue() // 这里不能直接调,因为是深拷贝过来的
|
|
482
500
|
if (!info.name || !info.value) {
|
|
483
501
|
// 如果没有选择数据,则不处理
|
|
484
502
|
return
|
|
@@ -544,9 +562,9 @@ export default {
|
|
|
544
562
|
this.$emit('on-search', { keyword: this.keyword, filterList })
|
|
545
563
|
},
|
|
546
564
|
handleTagClose(tag) {
|
|
547
|
-
const parentItem = this.currentSearchList.find(x => x.id === tag.pId)
|
|
548
|
-
const parentIndex = this.currentSearchList.findIndex(x => x.id === tag.pId)
|
|
549
|
-
const childIndex = parentItem.itemList.findIndex(x => x.id === tag.id)
|
|
565
|
+
const parentItem = this.currentSearchList.find((x) => x.id === tag.pId)
|
|
566
|
+
const parentIndex = this.currentSearchList.findIndex((x) => x.id === tag.pId)
|
|
567
|
+
const childIndex = parentItem.itemList.findIndex((x) => x.id === tag.id)
|
|
550
568
|
parentItem.itemList.forEach((item, index) => {
|
|
551
569
|
if (parentItem.multiple) {
|
|
552
570
|
// 多选
|
|
@@ -575,10 +593,10 @@ export default {
|
|
|
575
593
|
},
|
|
576
594
|
// 关闭所有的标签
|
|
577
595
|
handleClearAllTags() {
|
|
578
|
-
this.tagList.forEach(tag => {
|
|
579
|
-
const parentItem = this.currentSearchList.find(x => x.id === tag.pId)
|
|
580
|
-
const parentIndex = this.currentSearchList.findIndex(x => x.id === tag.pId)
|
|
581
|
-
const childIndex = parentItem.itemList.findIndex(x => x.id === tag.id)
|
|
596
|
+
this.tagList.forEach((tag) => {
|
|
597
|
+
const parentItem = this.currentSearchList.find((x) => x.id === tag.pId)
|
|
598
|
+
const parentIndex = this.currentSearchList.findIndex((x) => x.id === tag.pId)
|
|
599
|
+
const childIndex = parentItem.itemList.findIndex((x) => x.id === tag.id)
|
|
582
600
|
parentItem.itemList.forEach((item, index) => {
|
|
583
601
|
if (parentItem.multiple) {
|
|
584
602
|
// 多选
|
|
@@ -612,8 +630,8 @@ export default {
|
|
|
612
630
|
this.keyword = ''
|
|
613
631
|
|
|
614
632
|
const currentSearchList = _.cloneDeep(this.currentSearchList)
|
|
615
|
-
currentSearchList.forEach(ele => {
|
|
616
|
-
ele.itemList.forEach(item => {
|
|
633
|
+
currentSearchList.forEach((ele) => {
|
|
634
|
+
ele.itemList.forEach((item) => {
|
|
617
635
|
item.isActive = !!item.default
|
|
618
636
|
if (['month', 'year'].includes(item.type)) {
|
|
619
637
|
item.value = item.default && item.defaultValue ? item.defaultValue : ''
|
|
@@ -624,8 +642,8 @@ export default {
|
|
|
624
642
|
if (item.type === 'select') {
|
|
625
643
|
if (item.default && item.defaultValue) {
|
|
626
644
|
if (item.multiple) {
|
|
627
|
-
const valueOptions = item.defaultValue.map(x => item.options.find(f => f.value === x))
|
|
628
|
-
item.value = valueOptions.map(x => x.value)
|
|
645
|
+
const valueOptions = item.defaultValue.map((x) => item.options.find((f) => f.value === x))
|
|
646
|
+
item.value = valueOptions.map((x) => x.value)
|
|
629
647
|
} else {
|
|
630
648
|
item.value = item.defaultValue
|
|
631
649
|
}
|
|
@@ -642,8 +660,8 @@ export default {
|
|
|
642
660
|
setDefaultTagList() {
|
|
643
661
|
const list = []
|
|
644
662
|
if (this.currentSearchList) {
|
|
645
|
-
this.currentSearchList.forEach(ele => {
|
|
646
|
-
ele.itemList.forEach(item => {
|
|
663
|
+
this.currentSearchList.forEach((ele) => {
|
|
664
|
+
ele.itemList.forEach((item) => {
|
|
647
665
|
if (item.default) {
|
|
648
666
|
// 如果是默认值
|
|
649
667
|
const obj = {
|
|
@@ -676,10 +694,10 @@ export default {
|
|
|
676
694
|
} else if (item.type === 'select') {
|
|
677
695
|
if (!item.defaultValue) return
|
|
678
696
|
if (item.multiple) {
|
|
679
|
-
const valueOptions = item.defaultValue.map(x => item.options.find(f => f.value === x))
|
|
680
|
-
obj.name = valueOptions.map(x => x.label).join(',')
|
|
697
|
+
const valueOptions = item.defaultValue.map((x) => item.options.find((f) => f.value === x))
|
|
698
|
+
obj.name = valueOptions.map((x) => x.label).join(',')
|
|
681
699
|
} else {
|
|
682
|
-
const defaultItem = item.options.find(x => x.value === item.defaultValue)
|
|
700
|
+
const defaultItem = item.options.find((x) => x.value === item.defaultValue)
|
|
683
701
|
obj.name = defaultItem.label
|
|
684
702
|
obj.value = defaultItem
|
|
685
703
|
}
|
|
@@ -751,15 +769,16 @@ export default {
|
|
|
751
769
|
// 切换保存过滤条件的下拉框
|
|
752
770
|
handleChangeCondition(value) {
|
|
753
771
|
this.conditionValue = value
|
|
754
|
-
const list = this.conditionList.filter(item => item.value === value)
|
|
772
|
+
const list = this.conditionList.filter((item) => item.value === value)
|
|
755
773
|
if (list.length) {
|
|
756
774
|
const currentSearchList = _.cloneDeep(this.currentSearchList)
|
|
775
|
+
deepCopyFunction(currentSearchList, this.currentSearchList)
|
|
757
776
|
const { keyword = '', filterList = [] } = list[0]
|
|
758
777
|
this.keyword = keyword
|
|
759
778
|
|
|
760
779
|
// 先清空所有标签
|
|
761
|
-
currentSearchList.forEach(ele => {
|
|
762
|
-
ele.itemList.forEach(item => {
|
|
780
|
+
currentSearchList.forEach((ele) => {
|
|
781
|
+
ele.itemList.forEach((item) => {
|
|
763
782
|
item.isActive = false
|
|
764
783
|
item.type === 'daterange' && (item.value = null)
|
|
765
784
|
})
|
|
@@ -767,21 +786,32 @@ export default {
|
|
|
767
786
|
|
|
768
787
|
// 设置选中的标签
|
|
769
788
|
if (filterList && filterList.length) {
|
|
770
|
-
filterList.forEach(ele => {
|
|
771
|
-
currentSearchList.forEach(item => {
|
|
789
|
+
filterList.forEach((ele) => {
|
|
790
|
+
currentSearchList.forEach((item) => {
|
|
772
791
|
if (ele.pId === item.id) {
|
|
773
|
-
item.itemList.forEach(v => {
|
|
774
|
-
if (v.type === '
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
792
|
+
item.itemList.forEach((v) => {
|
|
793
|
+
if (v.type === 'text') {
|
|
794
|
+
if (item.multiple) {
|
|
795
|
+
// 多选
|
|
796
|
+
v.id === ele.id && (v.isActive = true)
|
|
797
|
+
v.id === ele.id && v.type === 'daterange' && (v.value = ele.value)
|
|
798
|
+
} else {
|
|
799
|
+
// 单选
|
|
800
|
+
v.isActive = v.id === ele.id
|
|
801
|
+
v.type === 'daterange' && (v.value = v.id === ele.id ? ele.value : null)
|
|
802
|
+
}
|
|
803
|
+
} else if (v.type === 'slot') {
|
|
804
|
+
v.setValue && v.setValue({ value: ele.value, name: ele.name, ...ele })
|
|
805
|
+
} else if (v.type === 'select') {
|
|
806
|
+
if (v.multiple) {
|
|
807
|
+
v.value = ele.value
|
|
808
|
+
} else {
|
|
809
|
+
v.value = ele.value
|
|
810
|
+
}
|
|
811
|
+
} else if (v.type === 'month' || v.type === 'year') {
|
|
812
|
+
v.value = ele.value
|
|
813
|
+
} else if (v.type === 'daterange' || v.type === 'datetimerange') {
|
|
814
|
+
v.value = ele.value
|
|
785
815
|
}
|
|
786
816
|
})
|
|
787
817
|
}
|
|
@@ -807,7 +837,7 @@ export default {
|
|
|
807
837
|
let localList = localStorage.getItem(`syswin${this.storageName}`)
|
|
808
838
|
if (!['', undefined, null].includes(localList)) {
|
|
809
839
|
localList = JSON.parse(localList)
|
|
810
|
-
const idx = localList.findIndex(ele => ele.value === item.value)
|
|
840
|
+
const idx = localList.findIndex((ele) => ele.value === item.value)
|
|
811
841
|
idx > -1 && localList.splice(idx, 1)
|
|
812
842
|
localList.length > 0
|
|
813
843
|
? localStorage.setItem(`syswin${this.storageName}`, JSON.stringify(localList))
|
|
@@ -828,7 +858,7 @@ export default {
|
|
|
828
858
|
this.conditionValue = momentValue
|
|
829
859
|
} else {
|
|
830
860
|
// 编辑
|
|
831
|
-
const index = this.conditionList.findIndex(ele => ele.value === this.currentData.value)
|
|
861
|
+
const index = this.conditionList.findIndex((ele) => ele.value === this.currentData.value)
|
|
832
862
|
const item = this.conditionList[index]
|
|
833
863
|
item.label = label
|
|
834
864
|
this.$set(this.conditionList, index, item)
|
|
@@ -504,3 +504,17 @@ input:focus {
|
|
|
504
504
|
color: #000;
|
|
505
505
|
}
|
|
506
506
|
}
|
|
507
|
+
|
|
508
|
+
.sy-btn-ellipsis {
|
|
509
|
+
.el-button {
|
|
510
|
+
outline: none !important;
|
|
511
|
+
&.el-button--text {
|
|
512
|
+
color: $primary-color;
|
|
513
|
+
}
|
|
514
|
+
}
|
|
515
|
+
.el-button:hover, .el-button:active, .el-button:focus {
|
|
516
|
+
background: none !important;
|
|
517
|
+
color: $primary-color !important;
|
|
518
|
+
border: 1px solid transparent !important;
|
|
519
|
+
}
|
|
520
|
+
}
|