fix(client): ロールの条件を削除する手段が無かったのを修正
This commit is contained in:
parent
8d2c3bb18d
commit
d43a4a2d46
1 changed files with 17 additions and 1 deletions
|
@ -13,6 +13,9 @@
|
||||||
<button v-if="draggable" class="drag-handle _button" :class="$style.dragHandle">
|
<button v-if="draggable" class="drag-handle _button" :class="$style.dragHandle">
|
||||||
<i class="ti ti-menu-2"></i>
|
<i class="ti ti-menu-2"></i>
|
||||||
</button>
|
</button>
|
||||||
|
<button v-if="draggable" class="_button" :class="$style.remove" @click="removeSelf">
|
||||||
|
<i class="ti ti-x"></i>
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-if="type === 'and' || type === 'or'" :class="$style.values" class="_gaps">
|
<div v-if="type === 'and' || type === 'or'" :class="$style.values" class="_gaps">
|
||||||
|
@ -20,7 +23,7 @@
|
||||||
<template #item="{element}">
|
<template #item="{element}">
|
||||||
<div :class="$style.item">
|
<div :class="$style.item">
|
||||||
<!-- divが無いとエラーになる https://github.com/SortableJS/vue.draggable.next/issues/189 -->
|
<!-- divが無いとエラーになる https://github.com/SortableJS/vue.draggable.next/issues/189 -->
|
||||||
<RolesEditorFormula :model-value="element" draggable @update:model-value="updated => valuesItemUpdated(updated)"/>
|
<RolesEditorFormula :model-value="element" draggable @update:model-value="updated => valuesItemUpdated(updated)" @remove="removeItem(element)"/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</Sortable>
|
</Sortable>
|
||||||
|
@ -55,6 +58,7 @@ const Sortable = defineAsyncComponent(() => import('vuedraggable').then(x => x.d
|
||||||
|
|
||||||
const emit = defineEmits<{
|
const emit = defineEmits<{
|
||||||
(ev: 'update:modelValue', value: any): void;
|
(ev: 'update:modelValue', value: any): void;
|
||||||
|
(ev: 'remove'): void;
|
||||||
}>();
|
}>();
|
||||||
|
|
||||||
const props = defineProps<{
|
const props = defineProps<{
|
||||||
|
@ -93,6 +97,14 @@ function valuesItemUpdated(item) {
|
||||||
const i = v.value.values.findIndex(_item => _item.id === item.id);
|
const i = v.value.values.findIndex(_item => _item.id === item.id);
|
||||||
v.value.values[i] = item;
|
v.value.values[i] = item;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
function removeItem(item) {
|
||||||
|
v.value.values = v.value.values.filter(_item => _item.id !== item.id);
|
||||||
|
}
|
||||||
|
|
||||||
|
function removeSelf() {
|
||||||
|
emit('remove');
|
||||||
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" module>
|
<style lang="scss" module>
|
||||||
|
@ -113,6 +125,10 @@ function valuesItemUpdated(item) {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.remove {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
.item {
|
.item {
|
||||||
border: solid 2px var(--divider);
|
border: solid 2px var(--divider);
|
||||||
border-radius: var(--radius);
|
border-radius: var(--radius);
|
||||||
|
|
Loading…
Reference in a new issue