dev

Co-authored-by: Copilot <copilot@github.com>
2026-05-05 18:59:06 +08:00
parent 44c9df9b20
commit 01b648a3e7
52 changed files with 2491 additions and 89 deletions
@@ -0,0 +1,76 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from "vue";
+
+import { GalleryVerticalEnd, Shuffle } from "lucide-vue-next";
+
+import { cn } from "@/lib/utils";
+import { Button } from "@/components/ui/button";
+import {
+  Field,
+  FieldDescription,
+  FieldGroup,
+  FieldLabel,
+  FieldSeparator,
+} from "@/components/ui/field";
+import { InputGroup, InputGroupInput, InputGroupAddon } from "@/components/ui/input-group";
+import { Kbd } from "@/components/ui/kbd";
+import { useDnfHelperStore } from "@/stores/dnfhelper";
+
+const props = defineProps<{
+  class?: HTMLAttributes["class"];
+}>();
+
+const helperId = ref("");
+
+const onSubmit = async (e: Event) => {
+  e.preventDefault();
+  await useDnfHelperStore().refleshHelperInfo(helperId.value);
+};
+</script>
+
+<template>
+  <div :class="cn('flex flex-col gap-6', props.class)">
+    <form @submit="onSubmit">
+      <FieldGroup>
+        <div class="flex flex-col items-center gap-2 text-center">
+          <a href="#" class="flex flex-col items-center gap-2 font-medium">
+            <div class="flex size-8 items-center justify-center rounded-md">
+              <GalleryVerticalEnd class="size-6" />
+            </div>
+            <span class="sr-only">DNF计算器</span>
+          </a>
+          <!-- <h1 class="text-xl font-bold">输入助手ID</h1> -->
+          <!-- <FieldDescription>请输入助手的社区ID </FieldDescription> -->
+        </div>
+        <Field class="flex flex-col items-center">
+          <FieldLabel for="helperId" class="sr-only"> 助手ID </FieldLabel>
+          <InputGroup>
+            <InputGroupInput
+              id="helperId"
+              type="number"
+              placeholder="助手社区ID"
+              required
+              v-model="helperId"
+            />
+            <InputGroupAddon>
+              <Shuffle />
+            </InputGroupAddon>
+            <InputGroupAddon align="inline-end">
+              <Kbd>Enter</Kbd>
+            </InputGroupAddon>
+          </InputGroup>
+          <!-- <FieldDescription class="text-center">
+            Didn't receive the code? <a href="#">Resend</a>
+          </FieldDescription> -->
+        </Field>
+        <Field>
+          <Button class="self-center w-sm!" type="submit"> 确认 </Button>
+        </Field>
+      </FieldGroup>
+    </form>
+    <FieldSeparator class="w-sm self-center">没有助手ID</FieldSeparator>
+    <FieldDescription class="px-6 text-center">
+      <Button variant="outline"> 选择职业 </Button>
+    </FieldDescription>
+  </div>
+</template>