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,41 @@
+<script setup lang="ts">
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardFooter,
+  CardHeader,
+  CardTitle,
+} from "@/components/ui/card";
+
+const props = defineProps<{
+  list: {
+    roleId: string;
+    roleName: string;
+    roleJob: string;
+    avatarLink: string;
+    fame: number;
+  }[];
+}>();
+
+const { list } = toRefs(props);
+</script>
+
+<template>
+  <div class="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 lg:grid-cols-5 gap-4 p-5 box-border">
+    <template v-for="item in list" :key="item.roleId">
+      <Card class="w-full">
+        <CardHeader>
+          <CardTitle>{{ item.roleJob }}</CardTitle>
+        </CardHeader>
+        <CardContent class="flex items-center justify-center h-sm">
+          <img :src="item.avatarLink" alt="avatar" class="w-auto h-sm rounded-full object-cover" />
+        </CardContent>
+        <CardFooter class="flex justify-between">
+          <span>{{ item.roleName }}</span>
+          <span>{{ item.fame }} </span>
+        </CardFooter>
+      </Card>
+    </template>
+  </div>
+</template>