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