zartui 2.0.51 → 2.0.53
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/es/hierarchy-select/breadcrumb.js +24 -23
- package/es/hierarchy-select/index.css +1 -1
- package/es/hierarchy-select/index.js +79 -83
- package/es/hierarchy-select/index.less +159 -261
- package/es/hierarchy-select/markList.js +24 -67
- package/es/index.js +1 -1
- package/es/style/var.less +2 -18
- package/lib/hierarchy-select/breadcrumb.js +24 -23
- package/lib/hierarchy-select/index.css +1 -1
- package/lib/hierarchy-select/index.js +82 -85
- package/lib/hierarchy-select/index.less +159 -261
- package/lib/hierarchy-select/markList.js +21 -64
- package/lib/index.css +1 -1
- package/lib/index.js +1 -1
- package/lib/style/var.less +2 -18
- package/lib/zart.js +110 -308
- package/lib/zart.min.js +1 -1
- package/package.json +2 -2
- package/es/hierarchy-select/hierarchySelect.js +0 -162
- package/lib/hierarchy-select/hierarchySelect.js +0 -177
|
@@ -4,8 +4,7 @@ import Icon from "../icon";
|
|
|
4
4
|
|
|
5
5
|
var _createNamespace = createNamespace('hierarchy-select-breadcrumb'),
|
|
6
6
|
createComponent = _createNamespace[0],
|
|
7
|
-
bem = _createNamespace[1]
|
|
8
|
-
t = _createNamespace[2];
|
|
7
|
+
bem = _createNamespace[1];
|
|
9
8
|
|
|
10
9
|
export default createComponent({
|
|
11
10
|
props: {
|
|
@@ -22,43 +21,47 @@ export default createComponent({
|
|
|
22
21
|
textKey: {
|
|
23
22
|
type: String,
|
|
24
23
|
default: "name"
|
|
24
|
+
},
|
|
25
|
+
breadcrumbTitle: {
|
|
26
|
+
type: String,
|
|
27
|
+
default: "全部"
|
|
25
28
|
}
|
|
26
29
|
},
|
|
27
|
-
data: function data() {
|
|
28
|
-
return {};
|
|
29
|
-
},
|
|
30
30
|
methods: {
|
|
31
31
|
chooseSenior: function chooseSenior(index) {
|
|
32
|
+
if (this.data.length === index + 1) {
|
|
33
|
+
return;
|
|
34
|
+
}
|
|
35
|
+
|
|
32
36
|
this.$emit("chooseSenior", index);
|
|
33
37
|
}
|
|
34
38
|
},
|
|
35
|
-
render: function render(
|
|
39
|
+
render: function render() {
|
|
36
40
|
var _this = this;
|
|
37
41
|
|
|
38
|
-
|
|
42
|
+
var h = arguments[0];
|
|
43
|
+
return h("section", {
|
|
39
44
|
"class": bem()
|
|
40
|
-
}, [h("
|
|
41
|
-
"class": bem(
|
|
42
|
-
}
|
|
43
|
-
"class": bem(
|
|
44
|
-
}, [h("span", {
|
|
45
|
-
"style": {
|
|
46
|
-
color: '#0091fa'
|
|
47
|
-
},
|
|
45
|
+
}, [h("div", {
|
|
46
|
+
"class": bem('list')
|
|
47
|
+
}, [h("div", {
|
|
48
|
+
"class": bem('default'),
|
|
48
49
|
"on": {
|
|
49
50
|
"click": function click() {
|
|
50
51
|
_this.chooseSenior(-1);
|
|
51
52
|
}
|
|
52
53
|
}
|
|
53
|
-
}, [
|
|
54
|
+
}, [this.breadcrumbTitle]), this.data.map(function (item, index) {
|
|
54
55
|
return h("div", {
|
|
55
|
-
"class": bem(
|
|
56
|
+
"class": bem('item')
|
|
56
57
|
}, [h(Icon, {
|
|
58
|
+
"class": bem('icon'),
|
|
57
59
|
"attrs": {
|
|
58
|
-
"name": "arrow-right"
|
|
59
|
-
|
|
60
|
-
|
|
60
|
+
"name": "arrow-right",
|
|
61
|
+
"color": "#C6CED9"
|
|
62
|
+
}
|
|
61
63
|
}), h("span", {
|
|
64
|
+
"class": bem('name'),
|
|
62
65
|
"style": {
|
|
63
66
|
color: index === _this.data.length - 1 ? '' : '#0091fa'
|
|
64
67
|
},
|
|
@@ -68,8 +71,6 @@ export default createComponent({
|
|
|
68
71
|
}
|
|
69
72
|
}
|
|
70
73
|
}, [item[_this.textKey]])]);
|
|
71
|
-
})])
|
|
72
|
-
"class": "fill-blur"
|
|
73
|
-
})]) : h()]);
|
|
74
|
+
})])]);
|
|
74
75
|
}
|
|
75
76
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
.zt2-hierarchy-
|
|
1
|
+
.zt2-hierarchy-select__loading{height:100%;width:100%;position:absolute;top:calc(50% - 18px);left:calc(50% - 18px);z-index:2}.zt2-hierarchy-select__list{position:relative}.zt2-hierarchy-select__list span{height:24px;font-size:16px;font-family:PingFangSC,PingFangSC-Semibold;font-weight:600;color:#0091fa;line-height:24px}.zt2-hierarchy-select__list .flex{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-hierarchy-select-breadcrumb{padding:0 16px}.zt2-hierarchy-select-breadcrumb__list{box-sizing:border-box;height:44px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;color:#0091fa;width:100%;overflow-x:scroll}.zt2-hierarchy-select-breadcrumb__list::-webkit-scrollbar{width:0;height:0}.zt2-hierarchy-select-breadcrumb__default{display:-webkit-box;display:-webkit-flex;display:flex;white-space:nowrap}.zt2-hierarchy-select-breadcrumb__item{height:44px;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center;white-space:nowrap}.zt2-hierarchy-select-breadcrumb__item:last-child{color:#2d4b73}.zt2-hierarchy-select-breadcrumb__icon{padding:0 4px}.zt2-hierarchy-mark-list{background-color:#fff}.zt2-hierarchy-mark-list>div:last-child::after{display:none}.zt2-hierarchy-mark-list__multiple-button{margin-right:8px}.zt2-hierarchy-mark-list__select-icon{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;align-items:center;text-align:center;border-radius:100%;font-size:22px;cursor:pointer}.zt2-hierarchy-mark-list__select-icon--normal{color:transparent;background-image:-webkit-linear-gradient(315deg,#e6ebf0 0,#fff 100%);background-image:linear-gradient(135deg,#e6ebf0 0,#fff 100%);border:1px solid rgba(45,75,115,.13);box-shadow:-1px -1px 2px 0 #fff,0 0 3px 0 rgba(45,75,115,.2)}.zt2-hierarchy-mark-list__select-icon--checked{color:#fff;background-color:#0091fa;border:1px solid rgba(255,255,255,.5);box-shadow:inset 1px 1px 2px 0 rgba(0,0,0,.2)}.zt2-hierarchy-mark-list__score-item{position:relative;display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-pack:justify;-webkit-justify-content:space-between;justify-content:space-between;-webkit-box-align:center;-webkit-align-items:center;align-items:center;padding:10px 0;background-color:#fff;margin-left:16px}.zt2-hierarchy-mark-list__score-item::after{content:" ";position:absolute;bottom:0;height:1px;width:100%;background-color:rgba(0,0,0,.1);box-shadow:0 0 0 0 #000 inset}.zt2-hierarchy-mark-list__item-content{-webkit-box-flex:1;-webkit-flex:1;flex:1;margin-right:16px;width:278px;font-size:16px;font-family:PingFangSC,PingFangSC-Regular;font-weight:400;text-align:left;color:#2d4b73;line-height:24px;word-break:break-all}.zt2-hierarchy-mark-list__item-content span{color:#0091fa}.zt2-hierarchy-mark-list__item-nav{padding:0 16px;border-left:rgba(0,0,0,.1) 1px solid}.zt2-hierarchy-mark-list__sub-level{display:-webkit-box;display:-webkit-flex;display:flex;-webkit-box-align:center;-webkit-align-items:center;align-items:center}.zt2-hierarchy-mark-list__sub-level span{color:#0091fa}.zt2-hierarchy-mark-list__sub-level--disable{opacity:.2}.zt2-hierarchy-mark-list__sub-icon{margin-right:4px;font-size:0;width:20px;height:20px}.zt2-hierarchy-mark-list__disable .zt2-hierarchy-mark-list__item-content,.zt2-hierarchy-mark-list__disable-parent .zt2-hierarchy-mark-list__item-content{color:#c8c9cc}.zt2-hierarchy-mark-list__disable .zt2-hierarchy-mark-list__multiple-button>.zt2-icon,.zt2-hierarchy-mark-list__disable-parent .zt2-hierarchy-mark-list__multiple-button>.zt2-icon{cursor:not-allowed;background-image:-webkit-linear-gradient(316deg,#e1e6eb 0,#e5edf5 100%);background-image:linear-gradient(134deg,#e1e6eb 0,#e5edf5 100%);border:1px solid rgba(45,75,115,.08);box-shadow:-1px -1px 2px 0 #fff,0 0 3px 0 rgba(45,75,115,.2)}.zt2-hierarchy-mark-list__disable .zt2-hierarchy-mark-list__item-nav{cursor:not-allowed;opacity:.4}
|
|
@@ -1,21 +1,22 @@
|
|
|
1
1
|
// Utils
|
|
2
2
|
import { createNamespace } from '../utils';
|
|
3
|
+
import { deepClone } from '../utils/deep-clone';
|
|
4
|
+
import Breadcrumb from "./breadcrumb";
|
|
5
|
+
import MarkList from "./markList";
|
|
6
|
+
import Loading from '../loading';
|
|
7
|
+
import Toast from '../toast';
|
|
3
8
|
|
|
4
9
|
var _createNamespace = createNamespace('hierarchy-select'),
|
|
5
10
|
createComponent = _createNamespace[0],
|
|
6
|
-
bem = _createNamespace[1]
|
|
7
|
-
t = _createNamespace[2];
|
|
11
|
+
bem = _createNamespace[1];
|
|
8
12
|
|
|
9
|
-
import HierarchySelect from './hierarchySelect';
|
|
10
|
-
import Popup from '../popup';
|
|
11
|
-
import { PopupMixin } from '../mixins/popup';
|
|
12
|
-
import Icon from "../icon";
|
|
13
13
|
export default createComponent({
|
|
14
|
-
mixins: [PopupMixin()],
|
|
15
14
|
props: {
|
|
16
15
|
treeData: {
|
|
17
16
|
type: Array,
|
|
18
|
-
default:
|
|
17
|
+
default: function _default() {
|
|
18
|
+
return [];
|
|
19
|
+
}
|
|
19
20
|
},
|
|
20
21
|
disableParent: {
|
|
21
22
|
type: Boolean,
|
|
@@ -37,109 +38,104 @@ export default createComponent({
|
|
|
37
38
|
type: String,
|
|
38
39
|
default: "name"
|
|
39
40
|
},
|
|
40
|
-
|
|
41
|
+
breadcrumbTitle: {
|
|
41
42
|
type: String,
|
|
42
|
-
default: "
|
|
43
|
-
},
|
|
44
|
-
returnChainData: {
|
|
45
|
-
type: Boolean,
|
|
46
|
-
default: false
|
|
47
|
-
},
|
|
48
|
-
showTitle: {
|
|
49
|
-
type: Boolean,
|
|
50
|
-
default: true
|
|
51
|
-
},
|
|
52
|
-
customCancel: {
|
|
53
|
-
type: Boolean,
|
|
54
|
-
default: false
|
|
43
|
+
default: "全部"
|
|
55
44
|
},
|
|
56
|
-
|
|
45
|
+
autoChangeToChildren: {
|
|
57
46
|
type: Boolean,
|
|
58
47
|
default: false
|
|
59
48
|
}
|
|
60
49
|
},
|
|
61
50
|
data: function data() {
|
|
62
51
|
return {
|
|
63
|
-
|
|
52
|
+
dataList: [],
|
|
53
|
+
indexTree: [],
|
|
54
|
+
breadcrumbData: [],
|
|
55
|
+
callback: null,
|
|
56
|
+
historyLayers: [],
|
|
57
|
+
loading: false
|
|
64
58
|
};
|
|
65
59
|
},
|
|
60
|
+
mounted: function mounted() {
|
|
61
|
+
this.dataList = deepClone(this.treeData);
|
|
62
|
+
},
|
|
66
63
|
methods: {
|
|
67
|
-
|
|
68
|
-
this
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
64
|
+
clickNext: function clickNext(obj) {
|
|
65
|
+
var _this = this;
|
|
66
|
+
|
|
67
|
+
var item = obj.item,
|
|
68
|
+
index = obj.index;
|
|
69
|
+
|
|
70
|
+
if (item.children && item.children.length) {
|
|
71
|
+
this.historyLayers.push(this.dataList);
|
|
72
|
+
this.breadcrumbData.push(item);
|
|
73
|
+
this.dataList = item.children;
|
|
74
|
+
} else if (this.asyncGetter) {
|
|
75
|
+
this.loading = true;
|
|
76
|
+
this.asyncGetter(item[this.valueKey]).then(function (list) {
|
|
77
|
+
_this.loading = false;
|
|
78
|
+
|
|
79
|
+
if (!list || list.length === 0) {
|
|
80
|
+
Toast("无下级数据");
|
|
81
|
+
_this.dataList[index].children = _this.autoChangeToChildren ? undefined : [];
|
|
82
|
+
return;
|
|
83
|
+
}
|
|
84
|
+
|
|
85
|
+
_this.historyLayers.push(_this.dataList);
|
|
86
|
+
|
|
87
|
+
_this.breadcrumbData.push(item);
|
|
88
|
+
|
|
89
|
+
_this.dataList = list;
|
|
90
|
+
}).catch(function () {
|
|
91
|
+
_this.loading = false;
|
|
92
|
+
});
|
|
93
|
+
}
|
|
75
94
|
},
|
|
76
|
-
|
|
77
|
-
this.$emit("
|
|
78
|
-
this.hide();
|
|
95
|
+
selected: function selected(item) {
|
|
96
|
+
this.$emit("selected", item);
|
|
79
97
|
},
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
this.hide();
|
|
85
|
-
}
|
|
98
|
+
chooseSenior: function chooseSenior(index) {
|
|
99
|
+
this.breadcrumbData.splice(index + 1);
|
|
100
|
+
this.dataList = this.historyLayers[index + 1];
|
|
101
|
+
this.historyLayers.splice(index + 1);
|
|
86
102
|
},
|
|
87
|
-
|
|
88
|
-
this.$emit("
|
|
103
|
+
change: function change(item) {
|
|
104
|
+
this.$emit("change", item);
|
|
89
105
|
}
|
|
90
106
|
},
|
|
91
107
|
render: function render(h) {
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
return h(Popup, {
|
|
95
|
-
"attrs": {
|
|
96
|
-
"position": "bottom",
|
|
97
|
-
"closeOnPopstate": true,
|
|
98
|
-
"getContainer": this.getContainer
|
|
99
|
-
},
|
|
100
|
-
"class": bem('popup'),
|
|
101
|
-
"model": {
|
|
102
|
-
value: _this.showPicker,
|
|
103
|
-
callback: function callback($$v) {
|
|
104
|
-
_this.showPicker = $$v;
|
|
105
|
-
}
|
|
106
|
-
}
|
|
107
|
-
}, [h("div", {
|
|
108
|
+
return h("div", {
|
|
108
109
|
"class": bem()
|
|
109
|
-
}, [h(
|
|
110
|
-
"directives": [{
|
|
111
|
-
name: "show",
|
|
112
|
-
value: this.showTitle
|
|
113
|
-
}],
|
|
114
|
-
"class": bem("title")
|
|
115
|
-
}, [h(Icon, {
|
|
110
|
+
}, [h(Breadcrumb, {
|
|
116
111
|
"attrs": {
|
|
117
|
-
"
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
112
|
+
"data": this.breadcrumbData,
|
|
113
|
+
"valueKey": this.valueKey,
|
|
114
|
+
"textKey": this.textKey,
|
|
115
|
+
"breadcrumbTitle": this.breadcrumbTitle
|
|
121
116
|
},
|
|
122
117
|
"on": {
|
|
123
|
-
"
|
|
124
|
-
_this.showPicker = false;
|
|
125
|
-
}
|
|
118
|
+
"chooseSenior": this.chooseSenior
|
|
126
119
|
}
|
|
127
|
-
}), h("div",
|
|
120
|
+
}), h("div", {
|
|
121
|
+
"class": bem("list")
|
|
122
|
+
}, [this.loading ? h(Loading, {
|
|
123
|
+
"class": bem('loading')
|
|
124
|
+
}) : h(), h(MarkList, {
|
|
125
|
+
"ref": "markList",
|
|
128
126
|
"attrs": {
|
|
129
|
-
"
|
|
130
|
-
"disableParent": this.disableParent,
|
|
131
|
-
"asyncGetter": this.asyncGetter,
|
|
132
|
-
"resetReplaceCancel": this.resetReplaceCancel,
|
|
127
|
+
"dataList": this.dataList,
|
|
133
128
|
"multiple": this.multiple,
|
|
129
|
+
"resetReplaceCancel": this.resetReplaceCancel,
|
|
130
|
+
"disableParent": this.disableParent,
|
|
134
131
|
"valueKey": this.valueKey,
|
|
135
132
|
"textKey": this.textKey,
|
|
136
|
-
"
|
|
133
|
+
"autoChangeToChildren": this.autoChangeToChildren
|
|
137
134
|
},
|
|
138
135
|
"on": {
|
|
139
|
-
"
|
|
140
|
-
"
|
|
141
|
-
"
|
|
142
|
-
"reset": this.reset
|
|
136
|
+
"clickNext": this.clickNext,
|
|
137
|
+
"selected": this.selected,
|
|
138
|
+
"change": this.change
|
|
143
139
|
}
|
|
144
140
|
})])]);
|
|
145
141
|
}
|