zydx-plus 1.0.11 → 1.1.12
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/package.json
CHANGED
|
@@ -0,0 +1,102 @@
|
|
|
1
|
+
|
|
2
|
+
<template>
|
|
3
|
+
<div class="padding20">
|
|
4
|
+
<div>
|
|
5
|
+
<div>
|
|
6
|
+
<div class="fontSize20 height30 lineHeight30">代码示例：</div>
|
|
7
|
+
<div style="border: 1px solid #cccccc">
|
|
8
|
+
<div class="menu-layout-container">
|
|
9
|
+
<paginaton :pageCount="15"
|
|
10
|
+
:total="2000"
|
|
11
|
+
@page:change="handleUpdatePage"></paginaton>
|
|
12
|
+
</div>
|
|
13
|
+
</div>
|
|
14
|
+
</div>
|
|
15
|
+
</div>
|
|
16
|
+
<el-divider content-position="right">zydx-ui</el-divider>
|
|
17
|
+
<div>
|
|
18
|
+
<div class="fontSize20 height30 lineHeight30">树形数据类型：</div>
|
|
19
|
+
<pre class="language-xml"
|
|
20
|
+
v-html="content"></pre>
|
|
21
|
+
</div>
|
|
22
|
+
<div class="margin30_0">
|
|
23
|
+
<div>
|
|
24
|
+
<div class="fontSize20 height30 lineHeight30">参数说明:</div>
|
|
25
|
+
<div>
|
|
26
|
+
<el-table :data="paramTableData"
|
|
27
|
+
style="width: 100%">
|
|
28
|
+
<el-table-column prop="field_key"
|
|
29
|
+
label="参数字段"
|
|
30
|
+
width="180">
|
|
31
|
+
</el-table-column>
|
|
32
|
+
<el-table-column prop="field_title"
|
|
33
|
+
label="参数名称"
|
|
34
|
+
width="180">
|
|
35
|
+
</el-table-column>
|
|
36
|
+
<el-table-column prop="field_value"
|
|
37
|
+
label="示例值">
|
|
38
|
+
</el-table-column>
|
|
39
|
+
<el-table-column prop="field_default"
|
|
40
|
+
label="默认值"
|
|
41
|
+
width="180">
|
|
42
|
+
</el-table-column>
|
|
43
|
+
<el-table-column prop="field_remarks"
|
|
44
|
+
label="备注">
|
|
45
|
+
</el-table-column>
|
|
46
|
+
</el-table>
|
|
47
|
+
</div>
|
|
48
|
+
</div>
|
|
49
|
+
</div>
|
|
50
|
+
</div>
|
|
51
|
+
</template>
|
|
52
|
+
|
|
53
|
+
<script>
|
|
54
|
+
import paginaton from '@/components/pagination/src/pagination.vue'
|
|
55
|
+
export default {
|
|
56
|
+
name: "TreeDemo",
|
|
57
|
+
components: { paginaton },
|
|
58
|
+
data() {
|
|
59
|
+
return {
|
|
60
|
+
|
|
61
|
+
content: ``,
|
|
62
|
+
// 参数说明
|
|
63
|
+
paramTableData: [
|
|
64
|
+
{
|
|
65
|
+
field_key: "pageCount",
|
|
66
|
+
field_title: "一页有多少条数据",
|
|
67
|
+
field_value: "Number",
|
|
68
|
+
field_default: "1",
|
|
69
|
+
field_remarks: ``,
|
|
70
|
+
},
|
|
71
|
+
{
|
|
72
|
+
field_key: "total",
|
|
73
|
+
field_title: "一共有多少页",
|
|
74
|
+
field_value: "Number",
|
|
75
|
+
field_default: "",
|
|
76
|
+
field_remarks: ``,
|
|
77
|
+
},
|
|
78
|
+
{
|
|
79
|
+
field_key: "page:change",
|
|
80
|
+
field_title: "回调：页码改变时触发",
|
|
81
|
+
field_value: "Function",
|
|
82
|
+
field_default: "''",
|
|
83
|
+
field_remarks: ``,
|
|
84
|
+
},
|
|
85
|
+
],
|
|
86
|
+
};
|
|
87
|
+
},
|
|
88
|
+
methods: {
|
|
89
|
+
handleUpdatePage: function (v) {
|
|
90
|
+
console.log("回调函数", v);
|
|
91
|
+
},
|
|
92
|
+
},
|
|
93
|
+
};
|
|
94
|
+
</script>
|
|
95
|
+
|
|
96
|
+
<style scoped>
|
|
97
|
+
.menu-layout-container {
|
|
98
|
+
width: 320px;
|
|
99
|
+
height: 600px;
|
|
100
|
+
margin: 0 auto;
|
|
101
|
+
}
|
|
102
|
+
</style>
|
|
@@ -43,6 +43,10 @@ export default {
|
|
|
43
43
|
border: {
|
|
44
44
|
type: String,
|
|
45
45
|
default: 'none'
|
|
46
|
+
},
|
|
47
|
+
height: {
|
|
48
|
+
type: String,
|
|
49
|
+
default: '30px'
|
|
46
50
|
}
|
|
47
51
|
},
|
|
48
52
|
data() {
|
|
@@ -98,6 +102,10 @@ export default {
|
|
|
98
102
|
},
|
|
99
103
|
updateSelect: function (tree) {
|
|
100
104
|
this.$emit('update:select', tree)
|
|
105
|
+
},
|
|
106
|
+
textStyle: function (tree) {
|
|
107
|
+
const { fontSize = 16 } = tree
|
|
108
|
+
return `font-size: ${fontSize}px`
|
|
101
109
|
}
|
|
102
110
|
},
|
|
103
111
|
}
|
|
@@ -114,14 +122,20 @@ export default {
|
|
|
114
122
|
<div class="tree_node_indent"
|
|
115
123
|
v-for="i in tree.level"
|
|
116
124
|
:key="i">
|
|
117
|
-
<div style="width:
|
|
125
|
+
<div :style="`width: ${tree.indent}px`"></div>
|
|
118
126
|
</div>
|
|
119
127
|
</template>
|
|
120
128
|
<template v-if="tree.icon">
|
|
121
|
-
<
|
|
122
|
-
|
|
129
|
+
<template v-if="['svg', 'image'].includes(tree.icon.type)">
|
|
130
|
+
<span class="tree_icon"
|
|
131
|
+
v-html="tree.icon.value"></span>
|
|
132
|
+
</template>
|
|
133
|
+
<template v-else>
|
|
134
|
+
<i :class="`iconfont' 'tree_icon' ${tree.icon.value}`"></i>
|
|
135
|
+
</template>
|
|
123
136
|
</template>
|
|
124
|
-
<span class="tree_text"
|
|
137
|
+
<span class="tree_text"
|
|
138
|
+
:style="textStyle(tree)">
|
|
125
139
|
{{ tree.name }}
|
|
126
140
|
</span>
|
|
127
141
|
</div>
|
|
@@ -153,9 +167,9 @@ export default {
|
|
|
153
167
|
align-items: center;
|
|
154
168
|
justify-content: flex-start;
|
|
155
169
|
text-align: left;
|
|
156
|
-
height:
|
|
170
|
+
height: v-bind(height);
|
|
157
171
|
cursor: pointer;
|
|
158
|
-
gap:
|
|
172
|
+
gap: 16px;
|
|
159
173
|
border-bottom: v-bind(border)
|
|
160
174
|
}
|
|
161
175
|
|
package/src/index.js
CHANGED
|
@@ -4,13 +4,15 @@ import Switch from './components/switch/index';
|
|
|
4
4
|
import menuTree from './components/menuTree/index';
|
|
5
5
|
import coloring from './components/coloring/index';
|
|
6
6
|
import tree from './components/tree/index';
|
|
7
|
+
import Pagination from './components/pagination/index';
|
|
7
8
|
|
|
8
9
|
const components = [
|
|
9
10
|
Calendar,
|
|
10
11
|
Switch,
|
|
11
12
|
menuTree,
|
|
12
13
|
coloring,
|
|
13
|
-
tree
|
|
14
|
+
tree,
|
|
15
|
+
Pagination
|
|
14
16
|
];
|
|
15
17
|
|
|
16
18
|
function install(app) {
|
|
@@ -21,13 +23,14 @@ function install(app) {
|
|
|
21
23
|
}
|
|
22
24
|
|
|
23
25
|
export default {
|
|
24
|
-
version: '1.
|
|
26
|
+
version: '1.1.12',
|
|
25
27
|
install,
|
|
26
28
|
Calendar,
|
|
27
29
|
Message,
|
|
28
30
|
Switch,
|
|
29
31
|
menuTree,
|
|
30
32
|
coloring,
|
|
31
|
-
tree
|
|
33
|
+
tree,
|
|
34
|
+
Pagination
|
|
32
35
|
};
|
|
33
36
|
|