feat(item): add delete functionality

This commit introduces the ability to delete items. A new `ItemDeleteModal` component provides a confirmation step
before removal.

- Adds a 'Delete' option to the action menu in the items table.
- Refactors the `useItems` composable to ensure reactivity with `useLocalStorage` by creating new array references on
add/remove operations.
- Renames `AddModal` to `EditModal` to better align with its future role in both adding and editing items.

app/components/item/EditModal.vue

@@ -0,0 +1,123 @@
+<template>
+  <UModal v-model:open="open" title="新增物品" description="新增一件新的物品">
+    <UButton label="新增" icon="lucide:plus" />
+
+    <template #body>
+      <UForm
+        ref="itemForm"
+        :schema="itemSchema"
+        :state="itemState"
+        @submit="onSubmit"
+        class="space-y-4"
+      >
+        <UFormField label="标品名称" required name="name">
+          <UInput
+            v-model="itemState.name"
+            placeholder="请输入物品名称"
+            class="w-full"
+          />
+        </UFormField>
+
+        <UFormField label="图片 URL">
+          <UInput
+            v-model="itemState.imageUrl"
+            placeholder="https://img.tootaio.com/i/2025/09/26/gxuf17.jpeg"
+            class="w-full"
+          />
+          <template #hint>
+            <div class="text-xs text-gray-500">请粘贴您的图床图片链接</div>
+          </template>
+        </UFormField>
+
+        <UFormField label="描述">
+          <UTextarea
+            v-model="itemState.description"
+            placeholder="请输入物品描述（可选）"
+            class="w-full"
+          />
+        </UFormField>
+
+        <UFormField label="标签">
+          <UInput
+            v-model="itemState.tags"
+            placeholder="Johnnie Walker,Whiskey"
+            class="w-full"
+          />
+          <template #hint>
+            <div class="text-xs text-gray-500">用英文逗号隔开</div>
+          </template>
+        </UFormField>
+      </UForm>
+    </template>
+
+    <template #footer>
+      <div class="flex justify-end w-full gap-2">
+        <UButton
+          label="取消"
+          color="neutral"
+          variant="subtle"
+          @click="open = false"
+        />
+        <UButton
+          label="创建"
+          color="primary"
+          variant="solid"
+          @click="itemForm.submit()"
+        />
+      </div>
+    </template>
+  </UModal>
+</template>
+
+<script lang="ts" setup>
+import type { FormSubmitEvent } from "@nuxt/ui";
+import * as z from "zod";
+
+const itemForm = ref();
+const open = ref<boolean>(false);
+const toast = useToast();
+const { stats, isNameAvailable, addItem } = useItemsStore();
+
+const itemSchema = z.object({
+  name: z
+    .string()
+    .min(1, "名称不能为空")
+    .refine(isNameAvailable, "该名称已被占用，请更换一个"),
+  imageUrl: z.string().nullable().optional(),
+  description: z.string().nullable().optional(),
+  tags: z.string().nullable().optional(),
+});
+
+type ItemSchema = z.output<typeof itemSchema>;
+
+const itemState = reactive<ItemSchema>({
+  name: "",
+  imageUrl: null,
+  description: null,
+  tags: null,
+});
+
+const onSubmit = async (event: FormSubmitEvent<ItemSchema>) => {
+  const item: Item = {
+    id: stats.latestId.value,
+    name: event.data.name,
+    imageUrl: event.data.imageUrl,
+    description: event.data.description,
+    tags: event.data.tags?.split(",").map((tag) => tag.trim()),
+    createdAt: new Date(),
+    updatedAt: new Date(),
+  };
+
+  // TODO: Check is add or edit
+  addItem(item);
+
+  toast.add({
+    title: "成功",
+    description: `${event.data.name} 已被添加到数据库中`,
+    color: "success",
+  });
+  open.value = false;
+};
+</script>
+
+<style></style>