@mixd-id/web-scaffold 0.1.230406068 → 0.1.230406070
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
package/src/components/Flex.vue
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div :class="computedClass">
|
|
3
3
|
|
|
4
|
-
<component v-for="(item, idx) in
|
|
4
|
+
<component v-for="(item, idx) in computedItems"
|
|
5
5
|
:is="item.type"
|
|
6
6
|
:items="item.items"
|
|
7
7
|
:="item.props"
|
|
@@ -25,10 +25,16 @@ export default{
|
|
|
25
25
|
padding: Array,
|
|
26
26
|
margin: Array,
|
|
27
27
|
display: Array,
|
|
28
|
+
enabled: undefined,
|
|
29
|
+
name: String
|
|
28
30
|
},
|
|
29
31
|
|
|
30
32
|
computed: {
|
|
31
33
|
|
|
34
|
+
computedItems(){
|
|
35
|
+
return this.items.filter((_) => _.props.enabled)
|
|
36
|
+
},
|
|
37
|
+
|
|
32
38
|
computedClass(){
|
|
33
39
|
|
|
34
40
|
const classNames = [
|
package/src/components/Grid.vue
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
<template>
|
|
2
2
|
<div :class="gridClass">
|
|
3
3
|
|
|
4
|
-
<component v-for="item in
|
|
4
|
+
<component v-for="item in computedItems"
|
|
5
5
|
:is="item.type"
|
|
6
6
|
:items="item.items"
|
|
7
7
|
:="item.props"
|
|
@@ -23,11 +23,17 @@ export default{
|
|
|
23
23
|
padding: Array,
|
|
24
24
|
margin: Array,
|
|
25
25
|
display: Array,
|
|
26
|
-
type: String
|
|
26
|
+
type: String,
|
|
27
|
+
enabled: undefined,
|
|
28
|
+
name: String
|
|
27
29
|
},
|
|
28
30
|
|
|
29
31
|
computed:{
|
|
30
32
|
|
|
33
|
+
computedItems(){
|
|
34
|
+
return this.items.filter((_) => _.props.enabled)
|
|
35
|
+
},
|
|
36
|
+
|
|
31
37
|
gridClass(){
|
|
32
38
|
|
|
33
39
|
const classNames = [
|
|
@@ -7,20 +7,13 @@
|
|
|
7
7
|
@moveup="moveUp(item)"
|
|
8
8
|
@movedown="moveDown(item)"
|
|
9
9
|
@change="$emit('change')"
|
|
10
|
-
@remove="modelValue.splice(index, 1);$emit('change')"
|
|
10
|
+
@remove="confirm($t('Remove this item?'), { onConfirm: () => { modelValue.splice(index, 1);$emit('change') }})"
|
|
11
11
|
@add="(items) => $emit('add', items)">
|
|
12
12
|
<template #default="{ item }">
|
|
13
13
|
<slot :item="item"></slot>
|
|
14
14
|
</template>
|
|
15
15
|
</TreeViewItem>
|
|
16
16
|
|
|
17
|
-
<div class="flex flex-row items-center justify-center">
|
|
18
|
-
<button type="button" class="p-3 text-primary flex flex-row gap-1 items-center" @click="add">
|
|
19
|
-
<svg width="14" height="14" class="fill-primary" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 384 512"><path d="M376 232H216V72c0-4.42-3.58-8-8-8h-32c-4.42 0-8 3.58-8 8v160H8c-4.42 0-8 3.58-8 8v32c0 4.42 3.58 8 8 8h160v160c0 4.42 3.58 8 8 8h32c4.42 0 8-3.58 8-8V280h160c4.42 0 8-3.58 8-8v-32c0-4.42-3.58-8-8-8z"/></svg>
|
|
20
|
-
Add
|
|
21
|
-
</button>
|
|
22
|
-
</div>
|
|
23
|
-
|
|
24
17
|
</div>
|
|
25
18
|
</template>
|
|
26
19
|
|
|
@@ -34,6 +27,8 @@ export default{
|
|
|
34
27
|
|
|
35
28
|
emits: [ 'add', 'change' ],
|
|
36
29
|
|
|
30
|
+
inject: [ 'confirm' ],
|
|
31
|
+
|
|
37
32
|
props: {
|
|
38
33
|
|
|
39
34
|
modelValue: Array
|
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
<div ref="item" :class="$style.item"
|
|
4
4
|
@mouseover="hoverMouseOver" @mouseout="hoverMouseOut">
|
|
5
5
|
<div class="cursor-move" ref="drag" @mousedown="mouseDown">
|
|
6
|
-
<svg width="14" height="14" class="fill-text-
|
|
6
|
+
<svg width="14" height="14" class="fill-text-100" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M496 288H16c-8.8 0-16 7.2-16 16v32c0 8.8 7.2 16 16 16h480c8.8 0 16-7.2 16-16v-32c0-8.8-7.2-16-16-16zm0-128H16c-8.8 0-16 7.2-16 16v32c0 8.8 7.2 16 16 16h480c8.8 0 16-7.2 16-16v-32c0-8.8-7.2-16-16-16z"/></svg>
|
|
7
7
|
</div>
|
|
8
8
|
<div class="flex flex-col hidden">
|
|
9
9
|
<button type="button" @click="$emit('moveup')">
|
|
@@ -29,7 +29,7 @@
|
|
|
29
29
|
:parent="item.items"
|
|
30
30
|
@moveup="moveUp(subItem)"
|
|
31
31
|
@movedown="moveDown(subItem)"
|
|
32
|
-
@remove="item.items.splice(index, 1);$emit('change')"
|
|
32
|
+
@remove="confirm($t('Remove this item?'), { onConfirm: () => { item.items.splice(index, 1);$emit('change') }})"
|
|
33
33
|
@add="(items) => $emit('add', items)"
|
|
34
34
|
@change="$emit('change')">
|
|
35
35
|
<template #default="{ item }">
|
|
@@ -55,6 +55,8 @@ export default{
|
|
|
55
55
|
|
|
56
56
|
emits: [ 'add', 'change', 'moveup', 'movedown', 'remove' ],
|
|
57
57
|
|
|
58
|
+
inject: [ 'confirm' ],
|
|
59
|
+
|
|
58
60
|
props: {
|
|
59
61
|
item: Object,
|
|
60
62
|
|