35 lines
1.5 KiB
Vue
35 lines
1.5 KiB
Vue
<script setup lang="ts">
|
|
import {DocumentDuplicateIcon, PencilSquareIcon, TrashIcon} from "@heroicons/vue/24/outline";
|
|
import {confirm} from "@/confirm";
|
|
import {RuleBook, useRuleBooksStore} from "@/rules";
|
|
import {routeNames} from "@/routes";
|
|
|
|
const ruleBooksStore = useRuleBooksStore();
|
|
|
|
const duplicate = async (ruleBook: RuleBook) => {
|
|
if (await confirm({title: "Duplicate Rule Book", message: `Duplicate ${ruleBook.name}?`, confirmLabel: "Duplicate"})) {
|
|
await ruleBooksStore.duplicate(ruleBook);
|
|
}
|
|
};
|
|
|
|
const remove = async (ruleBook: RuleBook) => {
|
|
if (await confirm({title: "Delete Rule Book", message: `Delete ${ruleBook.name}?`, confirmLabel: "Delete", danger: true})) {
|
|
await ruleBooksStore.remove(ruleBook.ruleBookId);
|
|
}
|
|
};
|
|
|
|
</script>
|
|
|
|
<template>
|
|
<div class="grid mb-2 mt-4">
|
|
<div class="flex justify-end border-b-1">
|
|
<RouterLink class="button mb-2 ms-2" :to="{ name: routeNames.newRuleBook}">New Rule Book</RouterLink>
|
|
</div>
|
|
<div v-for="ruleBook in ruleBooksStore.ruleBooks" :key="ruleBook.ruleBookId" class="flex items-center mt-2">
|
|
<span class="flex grow me-2">{{ruleBook.name}}</span>
|
|
<RouterLink class="btn-icon me-1" :to="{ name: routeNames.editRuleBook, params: { ruleBookId: ruleBook.ruleBookId } }"><PencilSquareIcon /></RouterLink>
|
|
<button class="btn-icon me-1" @click="duplicate(ruleBook)"><DocumentDuplicateIcon /></button>
|
|
<button class="btn-icon text-amber-700 hover:text-amber-600" @click="remove(ruleBook)"><TrashIcon /></button>
|
|
</div>
|
|
</div>
|
|
</template> |