feat: three nuxt frontends, demo seed, rounding + money-exponent + rate-cast fixes, archived specs

2026-09-17 13:34:38 +08:00
parent dc9fd31c5e
commit 653f13161a
85 changed files with 4327 additions and 106 deletions
@@ -0,0 +1,110 @@
+<script setup lang="ts">
+import { t as localized } from "@vmall/shared";
+import type { Category, Product, ProductUpsertBody } from "@vmall/shared";
+
+const props = defineProps<{
+  product?: Product;
+  categories: Category[];
+  busy?: boolean;
+}>();
+const emit = defineEmits<{ submit: [body: ProductUpsertBody] }>();
+const { t: translate, locale } = useI18n();
+
+const slug = ref("");
+const nameEn = ref("");
+const nameZh = ref("");
+const descriptionEn = ref("");
+const descriptionZh = ref("");
+const categoryId = ref("");
+const images = ref("");
+const validationError = ref("");
+
+function resetFromProduct(product: Product | undefined): void {
+  slug.value = product?.slug ?? "";
+  nameEn.value = product?.name.en ?? "";
+  nameZh.value = product?.name.zh ?? "";
+  descriptionEn.value = product?.description.en ?? "";
+  descriptionZh.value = product?.description.zh ?? "";
+  categoryId.value = product?.category_id ?? "";
+  images.value = product?.images.join("\n") ?? "";
+  validationError.value = "";
+}
+
+watch(() => props.product, resetFromProduct, { immediate: true });
+
+function submit(): void {
+  const cleanSlug = slug.value.trim();
+  if (!/^[a-z0-9]+(?:-[a-z0-9]+)*$/.test(cleanSlug)) {
+    validationError.value = translate("shop.slugInvalid");
+    return;
+  }
+  if (!nameEn.value.trim()) {
+    validationError.value = translate("shop.productNameRequired");
+    return;
+  }
+  validationError.value = "";
+  const body: ProductUpsertBody = {
+    category_id: categoryId.value || null,
+    slug: cleanSlug,
+    name: { en: nameEn.value.trim(), zh: nameZh.value.trim() },
+    description: { en: descriptionEn.value.trim(), zh: descriptionZh.value.trim() },
+    images: images.value
+      .split("\n")
+      .map((image) => image.trim())
+      .filter((image) => image.length > 0),
+  };
+  emit("submit", body);
+}
+</script>
+
+<template>
+  <form class="card form-narrow product-form" @submit.prevent="submit">
+    <div v-if="validationError" class="error-text" role="alert">{{ validationError }}</div>
+    <div class="field">
+      <label for="product-slug">{{ $t("product.slug") }}</label>
+      <input id="product-slug" v-model="slug" required pattern="[a-z0-9]+(?:-[a-z0-9]+)*" />
+    </div>
+    <div class="field">
+      <label for="product-name-en">{{ $t("product.nameEn") }}</label>
+      <input id="product-name-en" v-model="nameEn" required />
+    </div>
+    <div class="field">
+      <label for="product-name-zh">{{ $t("product.nameZh") }}</label>
+      <input id="product-name-zh" v-model="nameZh" />
+    </div>
+    <div class="field">
+      <label for="product-description-en">{{ $t("product.descEn") }}</label>
+      <textarea id="product-description-en" v-model="descriptionEn" rows="4" />
+    </div>
+    <div class="field">
+      <label for="product-description-zh">{{ $t("product.descZh") }}</label>
+      <textarea id="product-description-zh" v-model="descriptionZh" rows="4" />
+    </div>
+    <div class="field">
+      <label for="product-category">{{ $t("product.category") }}</label>
+      <select id="product-category" v-model="categoryId">
+        <option value="">{{ $t("shop.categoryOptional") }}</option>
+        <option v-for="category in categories" :key="category.id" :value="category.id">
+          {{ localized(category.name, locale) }}
+        </option>
+      </select>
+    </div>
+    <div class="field">
+      <label for="product-images">{{ $t("product.images") }}</label>
+      <textarea id="product-images" v-model="images" rows="4" :placeholder="$t('shop.imagesHint')" />
+    </div>
+    <button class="btn primary" type="submit" :disabled="busy">
+      {{ busy ? $t("common.loading") : product ? $t("shop.updateProduct") : $t("shop.saveProduct") }}
+    </button>
+  </form>
+</template>
+
+<style scoped>
+.product-form {
+  max-width: 720px;
+  margin: 0;
+}
+.product-form textarea {
+  resize: vertical;
+}
+</style>