leisure-core 0.5.23 → 0.5.25
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/le-list/src/main.vue +64 -21
- package/le-list-form/src/main.vue +63 -27
- package/package.json +1 -1
package/le-list/src/main.vue
CHANGED
|
@@ -5,23 +5,49 @@
|
|
|
5
5
|
<el-form-item>
|
|
6
6
|
<slot></slot>
|
|
7
7
|
<le-button type="primary" @click="onClickQuery()">查询</le-button>
|
|
8
|
-
<le-button type="primary" @click="addItem()" v-if="isDispAddBtn"
|
|
8
|
+
<le-button type="primary" @click="addItem()" v-if="isDispAddBtn">{{
|
|
9
|
+
addBtnText
|
|
10
|
+
}}</le-button>
|
|
9
11
|
<slot name="headerBtns" :params="searchData"></slot>
|
|
10
12
|
</el-form-item>
|
|
11
13
|
</el-form>
|
|
12
|
-
<el-table
|
|
13
|
-
|
|
14
|
-
|
|
14
|
+
<el-table
|
|
15
|
+
ref="eltablemain"
|
|
16
|
+
:max-height="elTableMaxHeight"
|
|
17
|
+
:data="tableData"
|
|
18
|
+
border
|
|
19
|
+
:row-key="rowId"
|
|
20
|
+
:header-cell-style="{ 'text-align': 'center' }"
|
|
21
|
+
:cell-style="{ 'text-align': 'center' }"
|
|
22
|
+
stripe
|
|
23
|
+
style="width: 100%"
|
|
24
|
+
reserve-selection
|
|
25
|
+
@selection-change="handleSelectionChange"
|
|
26
|
+
>
|
|
15
27
|
<el-table-column type="selection" v-if="showChecked" width="55" />
|
|
16
|
-
<el-table-column
|
|
17
|
-
|
|
28
|
+
<el-table-column
|
|
29
|
+
v-for="column in tableColumns"
|
|
30
|
+
show-overflow-tooltip
|
|
31
|
+
:key="column.prop"
|
|
32
|
+
:prop="column.prop"
|
|
33
|
+
:label="column.label"
|
|
34
|
+
:width="column.width"
|
|
35
|
+
>
|
|
18
36
|
<template #default="scope">
|
|
19
37
|
<!-- <span v-html="renderColumnContent(column, scope)"></span> -->
|
|
20
|
-
<component
|
|
38
|
+
<component
|
|
39
|
+
:is="renderColumnContent(column)"
|
|
40
|
+
v-bind="getComponentProps(column, scope)"
|
|
41
|
+
></component>
|
|
21
42
|
</template>
|
|
22
43
|
</el-table-column>
|
|
23
44
|
<slot name="extColumn"></slot>
|
|
24
|
-
<el-table-column
|
|
45
|
+
<el-table-column
|
|
46
|
+
fixed="right"
|
|
47
|
+
label="操作"
|
|
48
|
+
:width="btnCellWidht"
|
|
49
|
+
align="center"
|
|
50
|
+
>
|
|
25
51
|
<template slot-scope="scope">
|
|
26
52
|
<template v-if="$scopedSlots.rowAllBtns">
|
|
27
53
|
<slot name="rowAllBtns" :rowItem="scope.row"></slot>
|
|
@@ -29,10 +55,14 @@
|
|
|
29
55
|
<template v-else>
|
|
30
56
|
<div class="rowBtns">
|
|
31
57
|
<le-button @click="editItem(scope.row)" v-if="disBtn === 'edit'">
|
|
32
|
-
编辑</le-button
|
|
58
|
+
编辑</le-button
|
|
59
|
+
>
|
|
33
60
|
<le-button @click="detail(scope.row)" v-if="disBtn === 'detail'">
|
|
34
|
-
详情</le-button
|
|
35
|
-
|
|
61
|
+
详情</le-button
|
|
62
|
+
>
|
|
63
|
+
<le-button-msg @click="del(scope.row.id)" v-if="isDispDelBtn"
|
|
64
|
+
>删除</le-button-msg
|
|
65
|
+
>
|
|
36
66
|
<div class="rowBtnsExt">
|
|
37
67
|
<slot name="rowBtns" :scope="scope"></slot>
|
|
38
68
|
</div>
|
|
@@ -42,11 +72,21 @@
|
|
|
42
72
|
</el-table-column>
|
|
43
73
|
</el-table>
|
|
44
74
|
<div style="text-align: center; margin-top: 30px">
|
|
45
|
-
<el-pagination
|
|
46
|
-
|
|
75
|
+
<el-pagination
|
|
76
|
+
background
|
|
77
|
+
layout="prev, pager, next"
|
|
78
|
+
:current-page="searchData.pageNo"
|
|
79
|
+
:total="searchData.total"
|
|
80
|
+
:page-size="searchData.pageSize"
|
|
81
|
+
@current-change="current_change"
|
|
82
|
+
>
|
|
47
83
|
</el-pagination>
|
|
48
84
|
</div>
|
|
49
|
-
<le-dialog-container
|
|
85
|
+
<le-dialog-container
|
|
86
|
+
:title="dialogTitle"
|
|
87
|
+
:width="dialogWidth"
|
|
88
|
+
:showDialog="showDialog"
|
|
89
|
+
>
|
|
50
90
|
<slot name="sub" v-if="showDialog" :rowItem="toparam"></slot>
|
|
51
91
|
</le-dialog-container>
|
|
52
92
|
</div>
|
|
@@ -76,12 +116,16 @@ export default {
|
|
|
76
116
|
},
|
|
77
117
|
searchParam: {
|
|
78
118
|
type: Object,
|
|
79
|
-
default: () => {
|
|
119
|
+
default: () => {},
|
|
80
120
|
},
|
|
81
121
|
isDispAddBtn: {
|
|
82
122
|
type: Boolean,
|
|
83
123
|
default: true,
|
|
84
124
|
},
|
|
125
|
+
addBtnText: {
|
|
126
|
+
type: String,
|
|
127
|
+
default: "新建",
|
|
128
|
+
},
|
|
85
129
|
isDispDelBtn: {
|
|
86
130
|
type: Boolean,
|
|
87
131
|
default: false,
|
|
@@ -100,12 +144,12 @@ export default {
|
|
|
100
144
|
},
|
|
101
145
|
showChecked: {
|
|
102
146
|
type: Boolean,
|
|
103
|
-
default: false
|
|
147
|
+
default: false,
|
|
104
148
|
},
|
|
105
149
|
rowId: {
|
|
106
150
|
type: String,
|
|
107
|
-
default:
|
|
108
|
-
}
|
|
151
|
+
default: "id",
|
|
152
|
+
},
|
|
109
153
|
},
|
|
110
154
|
watch: {
|
|
111
155
|
searchParam: {
|
|
@@ -151,12 +195,11 @@ export default {
|
|
|
151
195
|
},
|
|
152
196
|
computed: {
|
|
153
197
|
toparam() {
|
|
154
|
-
if (this.showChecked)
|
|
155
|
-
return this.rowItems;
|
|
198
|
+
if (this.showChecked) return this.rowItems;
|
|
156
199
|
else {
|
|
157
200
|
return this.rowItem;
|
|
158
201
|
}
|
|
159
|
-
}
|
|
202
|
+
},
|
|
160
203
|
},
|
|
161
204
|
created() {
|
|
162
205
|
EventBus.$on("closeDialog", this.closeDialog);
|
|
@@ -1,19 +1,42 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<el-form
|
|
2
|
+
<el-form
|
|
3
|
+
:model="formPop"
|
|
4
|
+
:rules="rules"
|
|
5
|
+
ref="ruleForm"
|
|
6
|
+
:label-width="labelWidth"
|
|
7
|
+
class="le-form-container"
|
|
8
|
+
>
|
|
3
9
|
<div class="form-grid" :style="gridStyle">
|
|
4
|
-
<el-form-item
|
|
5
|
-
|
|
10
|
+
<el-form-item
|
|
11
|
+
v-for="(item, index) in formColumns"
|
|
12
|
+
:key="index"
|
|
13
|
+
:label="item.label"
|
|
14
|
+
:prop="item.prop"
|
|
15
|
+
class="leisure-form-item-class"
|
|
16
|
+
>
|
|
6
17
|
<div class="comContainerClass">
|
|
7
|
-
<component
|
|
8
|
-
|
|
18
|
+
<component
|
|
19
|
+
:is="componentType(item.type)"
|
|
20
|
+
v-model="formPop[item.prop]"
|
|
21
|
+
v-bind="mergeProps(getComponentProps(item), item.attr || {})"
|
|
22
|
+
v-on="item.event"
|
|
23
|
+
class="compontClass"
|
|
24
|
+
>
|
|
9
25
|
<template v-if="item.type === 'radio'">
|
|
10
|
-
<el-radio
|
|
11
|
-
option.
|
|
12
|
-
|
|
26
|
+
<el-radio
|
|
27
|
+
v-for="(option, index) in item.options"
|
|
28
|
+
:label="option.id"
|
|
29
|
+
:key="index + '_radio'"
|
|
30
|
+
>{{ option.lable }}</el-radio
|
|
31
|
+
>
|
|
13
32
|
</template>
|
|
14
33
|
<template v-else-if="item.type === 'select'">
|
|
15
|
-
<le-select-option
|
|
16
|
-
:
|
|
34
|
+
<le-select-option
|
|
35
|
+
:options="fieldOptions[item.prop]"
|
|
36
|
+
:label="item.kv.label"
|
|
37
|
+
:value="item.kv.key"
|
|
38
|
+
:keyNum="item.keyNum"
|
|
39
|
+
/>
|
|
17
40
|
</template>
|
|
18
41
|
</component>
|
|
19
42
|
<slot :name="item.prop"></slot>
|
|
@@ -23,7 +46,12 @@
|
|
|
23
46
|
<slot></slot>
|
|
24
47
|
<el-form-item v-rfooter class="form-footer">
|
|
25
48
|
<slot name="footerBtn"></slot>
|
|
26
|
-
<le-button
|
|
49
|
+
<le-button
|
|
50
|
+
type="primary"
|
|
51
|
+
@click="saveData"
|
|
52
|
+
v-if="handleStatus == 1 || handleStatus == 2"
|
|
53
|
+
>保存</le-button
|
|
54
|
+
>
|
|
27
55
|
<le-button type="info" @click="close()">关闭</le-button>
|
|
28
56
|
</el-form-item>
|
|
29
57
|
</el-form>
|
|
@@ -39,11 +67,11 @@ export default {
|
|
|
39
67
|
},
|
|
40
68
|
formData: {
|
|
41
69
|
type: Object,
|
|
42
|
-
default: () => {
|
|
70
|
+
default: () => {},
|
|
43
71
|
},
|
|
44
72
|
rules: {
|
|
45
73
|
type: Object,
|
|
46
|
-
default: () => {
|
|
74
|
+
default: () => {},
|
|
47
75
|
},
|
|
48
76
|
labelWidth: {
|
|
49
77
|
type: String,
|
|
@@ -52,7 +80,7 @@ export default {
|
|
|
52
80
|
|
|
53
81
|
fieldOptions: {
|
|
54
82
|
type: Object,
|
|
55
|
-
default: () => {
|
|
83
|
+
default: () => {},
|
|
56
84
|
},
|
|
57
85
|
handleStatus: {
|
|
58
86
|
type: Number,
|
|
@@ -61,18 +89,18 @@ export default {
|
|
|
61
89
|
columnsPerRow: {
|
|
62
90
|
type: Number,
|
|
63
91
|
default: 1,
|
|
64
|
-
validator: (value) => value > 0 && value <= 4 // 限制最大4列，避免太拥挤
|
|
92
|
+
validator: (value) => value > 0 && value <= 4, // 限制最大4列，避免太拥挤
|
|
65
93
|
},
|
|
66
94
|
// 新增属性：列间距
|
|
67
95
|
columnGap: {
|
|
68
96
|
type: String,
|
|
69
|
-
default: "20px"
|
|
97
|
+
default: "20px",
|
|
70
98
|
},
|
|
71
99
|
// 新增属性：行间距
|
|
72
100
|
rowGap: {
|
|
73
101
|
type: String,
|
|
74
|
-
default: "16px"
|
|
75
|
-
}
|
|
102
|
+
default: "16px",
|
|
103
|
+
},
|
|
76
104
|
},
|
|
77
105
|
watch: {
|
|
78
106
|
formData: {
|
|
@@ -119,6 +147,13 @@ export default {
|
|
|
119
147
|
},
|
|
120
148
|
select: { component: "le-select", props: {} },
|
|
121
149
|
image: { component: "le-image-container", props: {} },
|
|
150
|
+
area: {
|
|
151
|
+
component: "le-area",
|
|
152
|
+
props: {
|
|
153
|
+
initArea: "initArea",
|
|
154
|
+
level: "level",
|
|
155
|
+
},
|
|
156
|
+
},
|
|
122
157
|
},
|
|
123
158
|
formPop: {},
|
|
124
159
|
options: {}, //{field1:[{value:1,label:'选项1'},{value:2,label:'选项2'}]}
|
|
@@ -127,13 +162,13 @@ export default {
|
|
|
127
162
|
computed: {
|
|
128
163
|
gridStyle() {
|
|
129
164
|
return {
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
165
|
+
"grid-template-columns": `repeat(${this.columnsPerRow}, 1fr)`,
|
|
166
|
+
"column-gap": this.columnGap,
|
|
167
|
+
"row-gap": this.rowGap,
|
|
133
168
|
};
|
|
134
|
-
}
|
|
169
|
+
},
|
|
135
170
|
},
|
|
136
|
-
mounted() {
|
|
171
|
+
mounted() {},
|
|
137
172
|
methods: {
|
|
138
173
|
componentType(type) {
|
|
139
174
|
let result = this.componentMap[type]?.component || "le-input";
|
|
@@ -145,7 +180,7 @@ export default {
|
|
|
145
180
|
if (type === "image") {
|
|
146
181
|
let images = [];
|
|
147
182
|
images.push(this.formPop[item.prop]);
|
|
148
|
-
props = { ...props,
|
|
183
|
+
props = { ...props, images: images };
|
|
149
184
|
return props;
|
|
150
185
|
}
|
|
151
186
|
return this.componentMap[item.type]?.props || {};
|
|
@@ -160,7 +195,7 @@ export default {
|
|
|
160
195
|
saveData() {
|
|
161
196
|
this.$refs["ruleForm"].validate((valid) => {
|
|
162
197
|
if (valid) {
|
|
163
|
-
this.$emit("saveData", this.formPop, () => {
|
|
198
|
+
this.$emit("saveData", this.formPop, () => {});
|
|
164
199
|
} else {
|
|
165
200
|
return false;
|
|
166
201
|
}
|
|
@@ -187,7 +222,8 @@ le-form-container {
|
|
|
187
222
|
margin-bottom: 0; // 使用grid的gap控制间距，不需要margin-bottom
|
|
188
223
|
}
|
|
189
224
|
|
|
190
|
-
.leisure-form-item-class {
|
|
225
|
+
.leisure-form-item-class {
|
|
226
|
+
}
|
|
191
227
|
|
|
192
228
|
.comContainerClass {
|
|
193
229
|
display: flex;
|
|
@@ -195,7 +231,7 @@ le-form-container {
|
|
|
195
231
|
line-height: inherit;
|
|
196
232
|
|
|
197
233
|
.compontClass {
|
|
198
|
-
flex: 1
|
|
234
|
+
flex: 1;
|
|
199
235
|
}
|
|
200
236
|
}
|
|
201
237
|
|