From d43a4a2d46bd6ec09a7146958b0769ea5a690746 Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Fri, 13 Jan 2023 11:51:36 +0900
Subject: [PATCH] =?UTF-8?q?fix(client):=20=E3=83=AD=E3=83=BC=E3=83=AB?=
=?UTF-8?q?=E3=81=AE=E6=9D=A1=E4=BB=B6=E3=82=92=E5=89=8A=E9=99=A4=E3=81=99?=
=?UTF-8?q?=E3=82=8B=E6=89=8B=E6=AE=B5=E3=81=8C=E7=84=A1=E3=81=8B=E3=81=A3?=
=?UTF-8?q?=E3=81=9F=E3=81=AE=E3=82=92=E4=BF=AE=E6=AD=A3?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../src/pages/admin/RolesEditorFormula.vue | 18 +++++++++++++++++-
1 file changed, 17 insertions(+), 1 deletion(-)
diff --git a/packages/frontend/src/pages/admin/RolesEditorFormula.vue b/packages/frontend/src/pages/admin/RolesEditorFormula.vue
index 76ba639277..1cce5e58e8 100644
--- a/packages/frontend/src/pages/admin/RolesEditorFormula.vue
+++ b/packages/frontend/src/pages/admin/RolesEditorFormula.vue
@@ -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);