Skip to content

Commit 5c99e75

Browse files
GavinZhuLeiGavinZhuLei
committed
添加左侧菜单配置
1 parent 1fbd164 commit 5c99e75

File tree

1 file changed

+65
-45
lines changed

1 file changed

+65
-45
lines changed

‎src/components/Container.vue

Lines changed: 65 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -4,53 +4,61 @@
44
<el-container>
55
<el-aside width="250px">
66
<div class="components-list">
7-
<div class="widget-cate">基础字段</div>
8-
<draggable tag="ul" :list="basicComponents"
9-
v-bind="{group:{ name:'people', pull:'clone',put:false},sort:false, ghostClass: 'ghost'}"
10-
@end="handleMoveEnd"
11-
@start="handleMoveStart"
12-
:move="handleMove"
13-
>
14-
15-
<li class="form-edit-widget-label" v-for="(item, index) in basicComponents" :key="index">
16-
<a>
17-
<i class="icon iconfont" :class="item.icon"></i>
18-
<span>{{item.name}}</span>
19-
</a>
20-
</li>
21-
</draggable>
7+
<template v-if="basicFields.length">
8+
<div class="widget-cate">基础字段</div>
9+
<draggable tag="ul" :list="basicComponents"
10+
v-bind="{group:{ name:'people', pull:'clone',put:false},sort:false, ghostClass: 'ghost'}"
11+
@end="handleMoveEnd"
12+
@start="handleMoveStart"
13+
:move="handleMove"
14+
>
15+
16+
<li v-if="basicFields.indexOf(item.type)>=0" class="form-edit-widget-label" :class="{'no-put': item.type == 'divider'}" v-for="(item, index) in basicComponents" :key="index">
17+
<a>
18+
<i class="icon iconfont" :class="item.icon"></i>
19+
<span>{{item.name}}</span>
20+
</a>
21+
</li>
22+
</draggable>
23+
</template>
24+
25+
<template v-if="advanceFields.length">
26+
<div class="widget-cate">高级字段</div>
27+
<draggable tag="ul" :list="advanceComponents"
28+
v-bind="{group:{ name:'people', pull:'clone',put:false},sort:false, ghostClass: 'ghost'}"
29+
@end="handleMoveEnd"
30+
@start="handleMoveStart"
31+
:move="handleMove"
32+
>
33+
34+
<li v-if="advanceFields.indexOf(item.type) >= 0" class="form-edit-widget-label" :class="{'no-put': item.type == 'table'}" v-for="(item, index) in advanceComponents" :key="index">
35+
<a>
36+
<i class="icon iconfont" :class="item.icon"></i>
37+
<span>{{item.name}}</span>
38+
</a>
39+
</li>
40+
</draggable>
41+
</template>
2242

23-
<div class="widget-cate">高级字段</div>
24-
<draggable tag="ul" :list="advanceComponents"
25-
v-bind="{group:{ name:'people', pull:'clone',put:false},sort:false, ghostClass: 'ghost'}"
26-
@end="handleMoveEnd"
27-
@start="handleMoveStart"
28-
:move="handleMove"
29-
>
30-
31-
<li class="form-edit-widget-label" v-for="(item, index) in advanceComponents" :key="index">
32-
<a>
33-
<i class="icon iconfont" :class="item.icon"></i>
34-
<span>{{item.name}}</span>
35-
</a>
36-
</li>
37-
</draggable>
3843

39-
<div class="widget-cate">布局字段</div>
40-
<draggable tag="ul" :list="layoutComponents"
41-
v-bind="{group:{ name:'people', pull:'clone',put:false},sort:false, ghostClass: 'ghost'}"
42-
@end="handleMoveEnd"
43-
@start="handleMoveStart"
44-
:move="handleMove"
45-
>
46-
47-
<li class="form-edit-widget-label data-grid" v-for="(item, index) in layoutComponents" :key="index">
48-
<a>
49-
<i class="icon iconfont" :class="item.icon"></i>
50-
<span>{{item.name}}</span>
51-
</a>
52-
</li>
53-
</draggable>
44+
<template v-if="layoutFields.length">
45+
<div class="widget-cate">布局字段</div>
46+
<draggable tag="ul" :list="layoutComponents"
47+
v-bind="{group:{ name:'people', pull:'clone',put:false},sort:false, ghostClass: 'ghost'}"
48+
@end="handleMoveEnd"
49+
@start="handleMoveStart"
50+
:move="handleMove"
51+
>
52+
53+
<li v-if="layoutFields.indexOf(item.type) >=0" class="form-edit-widget-label no-put" v-for="(item, index) in layoutComponents" :key="index">
54+
<a>
55+
<i class="icon iconfont" :class="item.icon"></i>
56+
<span>{{item.name}}</span>
57+
</a>
58+
</li>
59+
</draggable>
60+
</template>
61+
5462
</div>
5563

5664
</el-aside>
@@ -192,6 +200,18 @@ export default {
192200
clearable: {
193201
type: Boolean,
194202
default: false
203+
},
204+
basicFields: {
205+
type: Array,
206+
default: () => ['input', 'textarea', 'number', 'radio', 'checkbox', 'time', 'date', 'rate', 'color', 'select', 'switch', 'slider']
207+
},
208+
advanceFields: {
209+
type: Array,
210+
default: () => ['blank', 'imgupload', 'editor', 'cascader']
211+
},
212+
layoutFields: {
213+
type: Array,
214+
default: () => ['grid']
195215
}
196216
},
197217
data () {

0 commit comments

Comments
 (0)