tianheng-ui 0.1.73 → 0.1.75
Sign up to get free protection for your applications and to get access to all the features.
- package/lib/theme-chalk/styles/card.scss +2 -2
- package/lib/theme-chalk/styles/feature.scss +70 -21
- package/lib/theme-chalk/styles/grid.scss +2 -2
- package/lib/theme-chalk/styles/variable.scss +2 -1
- package/lib/tianheng-ui.js +13 -13
- package/package.json +1 -1
- package/packages/Card/index.vue +1 -1
- package/packages/Cell/index.vue +3 -3
- package/packages/FormMaking/WidgetConfig.vue +3 -3
- package/packages/FormMaking/custom/configs/descriptions.vue +4 -4
- package/packages/FormMaking/custom/configs/workflow.vue +8 -8
- package/packages/FormMaking/custom/items/workflow.vue +1 -1
- package/packages/FormMaking/index.vue +2 -2
- package/packages/Grid/index.vue +1 -1
- package/packages/TableMaking/index.vue +1 -1
- package/packages/TableMaking/util/bus.js +2 -0
- package/packages/TableMaking/widgetConfig.vue +30 -4
- package/packages/TableMaking/widgetGuide.vue +131 -10
package/package.json
CHANGED
package/packages/Card/index.vue
CHANGED
package/packages/Cell/index.vue
CHANGED
@@ -51,11 +51,11 @@ export default {
|
|
51
51
|
selfCellClass() {
|
52
52
|
let className = "th-cell";
|
53
53
|
if (this.customClass) className = `${className} ${this.customClass}`;
|
54
|
-
if (this.center) className = `${className} th-
|
54
|
+
if (this.center) className = `${className} th-alignItems_center`;
|
55
55
|
if (this.active)
|
56
|
-
className = `${className} ${this.activeClass || "th-
|
56
|
+
className = `${className} ${this.activeClass || "th-active"}`;
|
57
57
|
if (this.hover)
|
58
|
-
className = `${className} ${this.hoverClass || "th-
|
58
|
+
className = `${className} ${this.hoverClass || "th-hover"}`;
|
59
59
|
return className;
|
60
60
|
}
|
61
61
|
},
|
@@ -314,7 +314,7 @@
|
|
314
314
|
:modal-append-to-body="false"
|
315
315
|
@on-fullscreen="$refs.codeEditor && $refs.codeEditor.resize()"
|
316
316
|
>
|
317
|
-
<div class="eventsSetting th-flex_box th-
|
317
|
+
<div class="eventsSetting th-flex_box th-border">
|
318
318
|
<div class="list th-flex_aside">
|
319
319
|
<div class="events-header">
|
320
320
|
<div>动作库</div>
|
@@ -328,9 +328,9 @@
|
|
328
328
|
</div>
|
329
329
|
<div
|
330
330
|
v-for="(item, index) in dialog.data"
|
331
|
-
class="list-item th-
|
331
|
+
class="list-item th-hover"
|
332
332
|
:class="{
|
333
|
-
'th-
|
333
|
+
'th-active':
|
334
334
|
dialog.active && dialog.active.label === item.label
|
335
335
|
}"
|
336
336
|
:key="item.key"
|
@@ -132,8 +132,8 @@
|
|
132
132
|
:modal-append-to-body="false"
|
133
133
|
:showFooter="false"
|
134
134
|
>
|
135
|
-
<div class="th-flex_box th-
|
136
|
-
<div class="box-list th-flex_aside th-
|
135
|
+
<div class="th-flex_box th-border">
|
136
|
+
<div class="box-list th-flex_aside th-border_right">
|
137
137
|
<div class="box-header th-sticky_top">
|
138
138
|
<div>数据列表</div>
|
139
139
|
<el-button
|
@@ -146,9 +146,9 @@
|
|
146
146
|
</div>
|
147
147
|
<div
|
148
148
|
v-for="(item, index) in widget.options.defaultValue"
|
149
|
-
class="list-item th-
|
149
|
+
class="list-item th-hover"
|
150
150
|
:class="{
|
151
|
-
'th-
|
151
|
+
'th-active': dialog.data && dialog.data.label === item.label
|
152
152
|
}"
|
153
153
|
:key="index"
|
154
154
|
@click="dialog.data = item"
|
@@ -170,9 +170,9 @@
|
|
170
170
|
>
|
171
171
|
<div
|
172
172
|
v-if="dialog.action === 'processInstTaskRsps'"
|
173
|
-
class="th-flex_box th-
|
173
|
+
class="th-flex_box th-border"
|
174
174
|
>
|
175
|
-
<div class="box-list th-flex_aside th-
|
175
|
+
<div class="box-list th-flex_aside th-border_right">
|
176
176
|
<div class="box-header th-sticky_top">
|
177
177
|
<div>节点列表</div>
|
178
178
|
<el-button
|
@@ -186,9 +186,9 @@
|
|
186
186
|
<div
|
187
187
|
v-for="(item, index) in widget.options.defaultValue
|
188
188
|
.processInstTaskRsps"
|
189
|
-
class="list-item th-
|
189
|
+
class="list-item th-hover"
|
190
190
|
:class="{
|
191
|
-
'th-
|
191
|
+
'th-active': dialog.data && dialog.data.name === item.name
|
192
192
|
}"
|
193
193
|
:key="index"
|
194
194
|
@click="dialog.data = item"
|
@@ -238,9 +238,9 @@
|
|
238
238
|
</div>
|
239
239
|
<div
|
240
240
|
v-if="dialog.action === 'processInstButtons'"
|
241
|
-
class="th-flex_box th-
|
241
|
+
class="th-flex_box th-border"
|
242
242
|
>
|
243
|
-
<div class="box-list th-flex_aside th-
|
243
|
+
<div class="box-list th-flex_aside th-border_right">
|
244
244
|
<div class="box-header th-sticky_top">
|
245
245
|
<div>操作列表</div>
|
246
246
|
<el-button
|
@@ -253,9 +253,9 @@
|
|
253
253
|
</div>
|
254
254
|
<div
|
255
255
|
v-for="(item, index) in widget.options.buttons"
|
256
|
-
class="list-item th-
|
256
|
+
class="list-item th-hover"
|
257
257
|
:class="{
|
258
|
-
'th-
|
258
|
+
'th-active': dialog.data && dialog.data.name === item.name
|
259
259
|
}"
|
260
260
|
:key="index"
|
261
261
|
@click="dialog.data = item"
|
@@ -2,7 +2,7 @@
|
|
2
2
|
<div class="th-formMaking th-flex_box">
|
3
3
|
<!-- 左侧字段区 -->
|
4
4
|
<div
|
5
|
-
class="formMaking-fields th-flex_aside th-
|
5
|
+
class="formMaking-fields th-flex_aside th-border_right"
|
6
6
|
style="width:250px"
|
7
7
|
>
|
8
8
|
<div class="fields-header th-sticky_top">组件列表</div>
|
@@ -127,7 +127,7 @@
|
|
127
127
|
</div>
|
128
128
|
|
129
129
|
<!-- 右侧配置区 -->
|
130
|
-
<div class="th-flex_aside th-
|
130
|
+
<div class="th-flex_aside th-border_left" style="width:300px">
|
131
131
|
<widget-config
|
132
132
|
:data="widgetFormSelect"
|
133
133
|
:config="formConfig.config"
|
package/packages/Grid/index.vue
CHANGED
@@ -19,7 +19,7 @@ export default {
|
|
19
19
|
computed: {
|
20
20
|
seflClass() {
|
21
21
|
let className = `${this.shadow}-shadow`;
|
22
|
-
if (this.border) className = `${className} th-
|
22
|
+
if (this.border) className = `${className} th-border_top th-border_left`;
|
23
23
|
return className;
|
24
24
|
}
|
25
25
|
},
|
@@ -13,7 +13,7 @@
|
|
13
13
|
:config="tableConfig"
|
14
14
|
></widget-table>
|
15
15
|
</div>
|
16
|
-
<div class="th-flex_aside th-
|
16
|
+
<div class="th-flex_aside th-border_left" style="width:300px">
|
17
17
|
<widget-config
|
18
18
|
:config="tableConfig"
|
19
19
|
:formOptions="formOptions"
|
@@ -518,7 +518,7 @@
|
|
518
518
|
:modal-append-to-body="false"
|
519
519
|
:showFooter="false"
|
520
520
|
>
|
521
|
-
<div class="eventsSetting th-flex_box th-
|
521
|
+
<div class="eventsSetting th-flex_box th-border">
|
522
522
|
<div class="list th-flex_aside">
|
523
523
|
<div class="events-header th-sticky_top">
|
524
524
|
<div>按钮库</div>
|
@@ -528,9 +528,9 @@
|
|
528
528
|
</div>
|
529
529
|
<div
|
530
530
|
v-for="item in Object.values(config.tools || [])"
|
531
|
-
class="list-item th-
|
531
|
+
class="list-item th-hover"
|
532
532
|
:class="{
|
533
|
-
'th-
|
533
|
+
'th-active': dialog.data && dialog.data.name === item.name
|
534
534
|
}"
|
535
535
|
:key="item.type"
|
536
536
|
@click="dialog.data = item"
|
@@ -661,6 +661,7 @@
|
|
661
661
|
<script>
|
662
662
|
import Draggable from "vuedraggable";
|
663
663
|
import { deepClone } from "../FormMaking/util";
|
664
|
+
import bus from "./util/bus";
|
664
665
|
export default {
|
665
666
|
components: { Draggable },
|
666
667
|
props: {
|
@@ -802,7 +803,30 @@ export default {
|
|
802
803
|
return data;
|
803
804
|
}
|
804
805
|
},
|
805
|
-
mounted() {
|
806
|
+
mounted() {
|
807
|
+
bus.$on("fieldsInParamsActive", activeParams => {
|
808
|
+
const data = [];
|
809
|
+
const initParams = list => {
|
810
|
+
list.map(item => {
|
811
|
+
if (activeParams.includes(item.id)) data.push(item);
|
812
|
+
if (item.children) initParams(item.children);
|
813
|
+
});
|
814
|
+
};
|
815
|
+
initParams(this.fieldsData.inParams);
|
816
|
+
this.config.search.options = data;
|
817
|
+
});
|
818
|
+
bus.$on("fieldsOutParamsActive", activeParams => {
|
819
|
+
const data = [];
|
820
|
+
const initParams = list => {
|
821
|
+
list.map(item => {
|
822
|
+
if (activeParams.includes(item.id)) data.push(item);
|
823
|
+
if (item.children) initParams(item.children);
|
824
|
+
});
|
825
|
+
};
|
826
|
+
initParams(this.fieldsData.outParams);
|
827
|
+
this.config.table.options = data;
|
828
|
+
});
|
829
|
+
},
|
806
830
|
methods: {
|
807
831
|
handleResetTableFields() {
|
808
832
|
this.config.search.options = [];
|
@@ -845,6 +869,7 @@ export default {
|
|
845
869
|
initParams(this.fieldsData.inParams);
|
846
870
|
this.fieldsData.outParams = deepClone(res.outParams || []);
|
847
871
|
initParams(this.fieldsData.outParams);
|
872
|
+
bus.$emit("fieldsData", this.fieldsData);
|
848
873
|
}
|
849
874
|
};
|
850
875
|
this.$emit("remote-params", apiId, callback);
|
@@ -856,6 +881,7 @@ export default {
|
|
856
881
|
initParams(this.fieldsData.inParams);
|
857
882
|
this.fieldsData.outParams = deepClone(api.outParams || []);
|
858
883
|
initParams(this.fieldsData.outParams);
|
884
|
+
bus.$emit("fieldsData", this.fieldsData);
|
859
885
|
}
|
860
886
|
}
|
861
887
|
},
|
@@ -3,17 +3,17 @@
|
|
3
3
|
<el-steps :active="step" finish-status="success" simple>
|
4
4
|
<el-step title="列表配置" icon="el-icon-s-operation" description="">
|
5
5
|
</el-step>
|
6
|
-
|
6
|
+
<el-step
|
7
7
|
title="字段配置"
|
8
8
|
icon="el-icon-c-scale-to-original"
|
9
9
|
description=""
|
10
|
-
></el-step>
|
10
|
+
></el-step>
|
11
11
|
<el-step title="按钮配置" icon="el-icon-set-up" description=""></el-step>
|
12
12
|
</el-steps>
|
13
13
|
<div class="content">
|
14
14
|
<el-form :model="config" label-width="80px" size="small">
|
15
15
|
<div v-show="step === 0">
|
16
|
-
<el-form-item
|
16
|
+
<el-form-item>
|
17
17
|
<el-tooltip
|
18
18
|
slot="label"
|
19
19
|
effect="light"
|
@@ -42,10 +42,10 @@
|
|
42
42
|
<el-tooltip
|
43
43
|
slot="label"
|
44
44
|
effect="light"
|
45
|
-
content="
|
45
|
+
content="列表初始化完成后,调用该接口获取字段数据"
|
46
46
|
placement="top"
|
47
47
|
>
|
48
|
-
<span style="color: #409EFF;"
|
48
|
+
<span style="color: #409EFF;">字段接口</span>
|
49
49
|
</el-tooltip>
|
50
50
|
<el-select
|
51
51
|
v-model="config.table.mounted.api"
|
@@ -70,11 +70,58 @@
|
|
70
70
|
placeholder="请输入"
|
71
71
|
></el-input>
|
72
72
|
</el-form-item>
|
73
|
+
<el-form-item label="是否分页">
|
74
|
+
<el-switch v-model="config.table.pageInfo.show"> </el-switch>
|
75
|
+
</el-form-item>
|
73
76
|
</div>
|
74
77
|
<div v-show="step === 1">
|
78
|
+
<el-tabs tab-position="left">
|
79
|
+
<el-tab-pane label="查询字段">
|
80
|
+
<el-transfer
|
81
|
+
v-model="inParamsActive"
|
82
|
+
filter-placeholder="请输入城市拼音"
|
83
|
+
:data="fieldsData.inParams"
|
84
|
+
:props="{ key: 'id' }"
|
85
|
+
:titles="['字段列表', '已选字段']"
|
86
|
+
@change="handleInParamsChange"
|
87
|
+
>
|
88
|
+
<div class="fields-item" slot-scope="{ option }">
|
89
|
+
<span>{{ option.label }}</span>
|
90
|
+
<span>{{ option.pAlias }}</span>
|
91
|
+
<span>{{ option.javaType }}</span>
|
92
|
+
</div>
|
93
|
+
</el-transfer>
|
94
|
+
</el-tab-pane>
|
95
|
+
<el-tab-pane label="列表字段">
|
96
|
+
<el-transfer
|
97
|
+
v-model="outParamsActive"
|
98
|
+
filter-placeholder="请输入城市拼音"
|
99
|
+
:data="fieldsData.outParams"
|
100
|
+
:props="{ key: 'id' }"
|
101
|
+
:titles="['字段列表', '已选字段']"
|
102
|
+
@change="handleOutParamsChange"
|
103
|
+
>
|
104
|
+
<div class="fields-item" slot-scope="{ option }">
|
105
|
+
<span>{{ option.label }}</span>
|
106
|
+
<span>{{ option.pAlias }}</span>
|
107
|
+
<span>{{ option.javaType }}</span>
|
108
|
+
</div>
|
109
|
+
</el-transfer>
|
110
|
+
</el-tab-pane>
|
111
|
+
</el-tabs>
|
112
|
+
</div>
|
113
|
+
<div v-show="step === 2">
|
75
114
|
<el-form-item label="">
|
76
|
-
<div
|
77
|
-
|
115
|
+
<div
|
116
|
+
class="tools-item"
|
117
|
+
v-for="item in Object.values(config.tools)"
|
118
|
+
:key="item.type"
|
119
|
+
>
|
120
|
+
<el-checkbox
|
121
|
+
v-model="item.show"
|
122
|
+
:label="item.name"
|
123
|
+
border
|
124
|
+
></el-checkbox>
|
78
125
|
</div>
|
79
126
|
</el-form-item>
|
80
127
|
</div>
|
@@ -92,7 +139,7 @@
|
|
92
139
|
>上一步</el-button
|
93
140
|
>
|
94
141
|
<el-button
|
95
|
-
v-if="step !==
|
142
|
+
v-if="step !== 2"
|
96
143
|
type="primary"
|
97
144
|
size="small"
|
98
145
|
@click="handleNext"
|
@@ -108,12 +155,15 @@
|
|
108
155
|
</template>
|
109
156
|
|
110
157
|
<script>
|
158
|
+
import bus from "./util/bus";
|
111
159
|
export default {
|
112
160
|
props: { config: Object, apiOptions: Array },
|
113
161
|
data() {
|
114
162
|
return {
|
115
163
|
step: 0,
|
116
|
-
|
164
|
+
fieldsData: { inParams: [], outParams: [] },
|
165
|
+
inParamsActive: [],
|
166
|
+
outParamsActive: []
|
117
167
|
};
|
118
168
|
},
|
119
169
|
computed: {
|
@@ -122,16 +172,53 @@ export default {
|
|
122
172
|
}
|
123
173
|
},
|
124
174
|
created() {},
|
125
|
-
mounted() {
|
175
|
+
mounted() {
|
176
|
+
bus.$on("fieldsData", data => {
|
177
|
+
const initParams = (list, params) => {
|
178
|
+
list.map(item => {
|
179
|
+
params.push(item);
|
180
|
+
if (item.children) {
|
181
|
+
initParams(item.children, params);
|
182
|
+
return;
|
183
|
+
}
|
184
|
+
});
|
185
|
+
};
|
186
|
+
const inParams = [];
|
187
|
+
initParams(data.inParams, inParams);
|
188
|
+
const outParams = [];
|
189
|
+
initParams(data.outParams, outParams);
|
190
|
+
this.fieldsData = { inParams, outParams };
|
191
|
+
});
|
192
|
+
},
|
126
193
|
methods: {
|
127
194
|
handleBack() {
|
128
195
|
this.step--;
|
196
|
+
if (this.step === 1) {
|
197
|
+
this.handleParamsActive();
|
198
|
+
}
|
129
199
|
},
|
130
200
|
handleNext() {
|
131
201
|
this.step++;
|
202
|
+
if (this.step === 1) {
|
203
|
+
this.handleParamsActive();
|
204
|
+
}
|
132
205
|
},
|
133
206
|
handleSave() {
|
134
207
|
this.$emit("save");
|
208
|
+
},
|
209
|
+
handleParamsActive() {
|
210
|
+
this.inParamsActive = this.config.search.options.map(item => {
|
211
|
+
return item.id;
|
212
|
+
});
|
213
|
+
this.outParamsActive = this.config.table.options.map(item => {
|
214
|
+
return item.id;
|
215
|
+
});
|
216
|
+
},
|
217
|
+
handleInParamsChange() {
|
218
|
+
bus.$emit("fieldsInParamsActive", this.inParamsActive);
|
219
|
+
},
|
220
|
+
handleOutParamsChange() {
|
221
|
+
bus.$emit("fieldsOutParamsActive", this.outParamsActive);
|
135
222
|
}
|
136
223
|
}
|
137
224
|
};
|
@@ -145,6 +232,10 @@ export default {
|
|
145
232
|
.content {
|
146
233
|
height: calc(100% - 96px);
|
147
234
|
padding-top: 10px;
|
235
|
+
|
236
|
+
.tools-item {
|
237
|
+
margin-bottom: 10px;
|
238
|
+
}
|
148
239
|
}
|
149
240
|
.footer {
|
150
241
|
height: 50px;
|
@@ -156,5 +247,35 @@ export default {
|
|
156
247
|
.stepView {
|
157
248
|
}
|
158
249
|
}
|
250
|
+
.fields-item {
|
251
|
+
span {
|
252
|
+
padding: 0px 8px 2px 8px;
|
253
|
+
border-radius: 4px;
|
254
|
+
}
|
255
|
+
span:nth-child(1) {
|
256
|
+
color: #1890ff;
|
257
|
+
background-color: #e8f4ff;
|
258
|
+
}
|
259
|
+
span:nth-child(2) {
|
260
|
+
color: #13ce66;
|
261
|
+
background-color: #e7faf0;
|
262
|
+
}
|
263
|
+
span:nth-child(3) {
|
264
|
+
color: #909399;
|
265
|
+
background-color: #f4f4f5;
|
266
|
+
}
|
267
|
+
}
|
268
|
+
}
|
269
|
+
</style>
|
270
|
+
|
271
|
+
<style lang="scss">
|
272
|
+
.widgetGuide {
|
273
|
+
.el-transfer {
|
274
|
+
display: flex;
|
275
|
+
align-items: center;
|
276
|
+
}
|
277
|
+
.el-transfer-panel {
|
278
|
+
flex: 1;
|
279
|
+
}
|
159
280
|
}
|
160
281
|
</style>
|