st-comp 0.0.6 → 0.0.8
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/components.d.ts +1 -0
- package/lib/bundle.js +2521 -2347
- package/lib/bundle.umd.cjs +10 -10
- package/package.json +1 -1
- package/packages/Table/index.vue +78 -70
package/package.json
CHANGED
package/packages/Table/index.vue
CHANGED
|
@@ -1,83 +1,87 @@
|
|
|
1
1
|
<template>
|
|
2
|
-
<el-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
v-for="item in columnConfig"
|
|
11
|
-
:key="item.prop"
|
|
12
|
-
:prop="item.prop"
|
|
13
|
-
:label="item.label"
|
|
14
|
-
:sortable="item.sortable"
|
|
15
|
-
:width="item.width"
|
|
16
|
-
:min-width="item.minWidth"
|
|
2
|
+
<el-config-provider :locale="zhCn">
|
|
3
|
+
<el-table
|
|
4
|
+
v-loading="loading"
|
|
5
|
+
:data="data"
|
|
6
|
+
:empty-text="emptyText"
|
|
7
|
+
stripe
|
|
8
|
+
style="width: 100%"
|
|
9
|
+
@sort-change="sortChange"
|
|
17
10
|
>
|
|
18
|
-
<
|
|
19
|
-
v-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
</template>
|
|
27
|
-
<template
|
|
28
|
-
v-else-if="item.type === 'slot'"
|
|
29
|
-
#default="scope"
|
|
30
|
-
>
|
|
31
|
-
<slot
|
|
32
|
-
:name="item.slot"
|
|
33
|
-
:row="scope.row"
|
|
34
|
-
/>
|
|
35
|
-
</template>
|
|
36
|
-
<template
|
|
37
|
-
v-else-if="item.type === 'btns'"
|
|
38
|
-
#default="scope"
|
|
11
|
+
<el-table-column
|
|
12
|
+
v-for="item in columnConfig"
|
|
13
|
+
:key="item.prop"
|
|
14
|
+
:prop="item.prop"
|
|
15
|
+
:label="item.label"
|
|
16
|
+
:sortable="item.sortable"
|
|
17
|
+
:width="item.width"
|
|
18
|
+
:min-width="item.minWidth"
|
|
39
19
|
>
|
|
40
20
|
<template
|
|
41
|
-
v-
|
|
42
|
-
|
|
21
|
+
v-if="item.type === 'formatter'"
|
|
22
|
+
#default="scope"
|
|
43
23
|
>
|
|
44
|
-
<
|
|
45
|
-
|
|
46
|
-
placement="bottom"
|
|
47
|
-
trigger="hover"
|
|
48
|
-
:popper-style="{ minWidth: '0px', width: null }"
|
|
49
|
-
>
|
|
50
|
-
<template #reference>
|
|
51
|
-
<el-icon
|
|
52
|
-
:style="{ marginLeft: '10px', verticalAlign: '-5px', cursor: 'pointer' }"
|
|
53
|
-
size="20"
|
|
54
|
-
>
|
|
55
|
-
<MoreFilled />
|
|
56
|
-
</el-icon>
|
|
57
|
-
</template>
|
|
58
|
-
<div
|
|
59
|
-
v-for="(subBtn, subBtnIndex) in btn.children"
|
|
60
|
-
:key="`${subBtn.text}-${subBtnIndex}`"
|
|
61
|
-
:style="{ marginTop: subBtnIndex === 0 ? 0 : '10px'}"
|
|
62
|
-
>
|
|
63
|
-
<Button
|
|
64
|
-
:option="subBtn"
|
|
65
|
-
:scope="scope"
|
|
66
|
-
/>
|
|
67
|
-
</div>
|
|
68
|
-
</el-popover>
|
|
69
|
-
<Button
|
|
70
|
-
v-else
|
|
71
|
-
:option="btn"
|
|
24
|
+
<Formatter
|
|
25
|
+
:option="item"
|
|
72
26
|
:scope="scope"
|
|
73
27
|
/>
|
|
74
28
|
</template>
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
29
|
+
<template
|
|
30
|
+
v-else-if="item.type === 'slot'"
|
|
31
|
+
#default="scope"
|
|
32
|
+
>
|
|
33
|
+
<slot
|
|
34
|
+
:name="item.slot"
|
|
35
|
+
:row="scope.row"
|
|
36
|
+
/>
|
|
37
|
+
</template>
|
|
38
|
+
<template
|
|
39
|
+
v-else-if="item.type === 'btns'"
|
|
40
|
+
#default="scope"
|
|
41
|
+
>
|
|
42
|
+
<template
|
|
43
|
+
v-for="(btn, btnIndex) in item.btns"
|
|
44
|
+
:key="`${btn.text}-${btnIndex}`"
|
|
45
|
+
>
|
|
46
|
+
<el-popover
|
|
47
|
+
v-if="btn.children"
|
|
48
|
+
placement="bottom"
|
|
49
|
+
trigger="hover"
|
|
50
|
+
:popper-style="{ minWidth: '0px', width: null }"
|
|
51
|
+
>
|
|
52
|
+
<template #reference>
|
|
53
|
+
<el-icon
|
|
54
|
+
:style="{ marginLeft: '10px', verticalAlign: '-5px', cursor: 'pointer' }"
|
|
55
|
+
size="20"
|
|
56
|
+
>
|
|
57
|
+
<MoreFilled />
|
|
58
|
+
</el-icon>
|
|
59
|
+
</template>
|
|
60
|
+
<div
|
|
61
|
+
v-for="(subBtn, subBtnIndex) in btn.children"
|
|
62
|
+
:key="`${subBtn.text}-${subBtnIndex}`"
|
|
63
|
+
:style="{ marginTop: subBtnIndex === 0 ? 0 : '10px'}"
|
|
64
|
+
>
|
|
65
|
+
<Button
|
|
66
|
+
:option="subBtn"
|
|
67
|
+
:scope="scope"
|
|
68
|
+
/>
|
|
69
|
+
</div>
|
|
70
|
+
</el-popover>
|
|
71
|
+
<Button
|
|
72
|
+
v-else
|
|
73
|
+
:option="btn"
|
|
74
|
+
:scope="scope"
|
|
75
|
+
/>
|
|
76
|
+
</template>
|
|
77
|
+
</template>
|
|
78
|
+
</el-table-column>
|
|
79
|
+
</el-table>
|
|
80
|
+
</el-config-provider>
|
|
78
81
|
</template>
|
|
79
82
|
|
|
80
83
|
<script setup lang="ts">
|
|
84
|
+
import zhCn from 'element-plus/es/locale/lang/zh-cn'
|
|
81
85
|
import { computed } from 'vue'
|
|
82
86
|
import { MoreFilled } from '@element-plus/icons-vue'
|
|
83
87
|
import Button from './components/Button/index.vue'
|
|
@@ -96,7 +100,11 @@
|
|
|
96
100
|
loading: {
|
|
97
101
|
type: Boolean,
|
|
98
102
|
default: () => false
|
|
99
|
-
}
|
|
103
|
+
},
|
|
104
|
+
emptyText: {
|
|
105
|
+
type: String,
|
|
106
|
+
default: () => ''
|
|
107
|
+
},
|
|
100
108
|
})
|
|
101
109
|
|
|
102
110
|
const columnConfig: any = computed(() => {
|