feat(titles-template): 片头片尾页面

2025-01-16 23:37:43 +08:00
parent 57ad96e87b
commit bb75f72759
4 changed files with 453 additions and 13 deletions
--- a/components/aigc/generation/TitlesTemplate.vue
+++ b/components/aigc/generation/TitlesTemplate.vue
@@ -0,0 +1,81 @@
+<script lang="ts" setup>
+defineProps({
+  type: {
+    type: String as PropType<'system' | 'user'>,
+    required: true,
+  },
+  data: {
+    type: Object as PropType<TitlesTemplate>,
+    required: true,
+  },
+})
+
+const emit = defineEmits({
+  'user-titles-request': (_titles: TitlesTemplate) => true,
+  'user-titles-delete': (_titles: TitlesTemplate) => true,
+  'system-titles-delete': (_titles: TitlesTemplate) => true,
+})
+
+const loginState = useLoginState()
+</script>
+
+<template>
+  <div
+    class="relative w-full flex flex-col rounded-lg border border-neutral-200 dark:border-neutral-700 overflow-hidden shadow-none hover:shadow transition-shadow"
+  >
+    <NuxtImg
+      placeholder
+      placeholder-class="w-full aspect-[16/9] object-cover bg-neutral-200 dark:bg-neutral-800"
+      class="w-full h-full object-cover relative"
+      :src="data.opening_url"
+    />
+    <div class="relative p-2 flex justify-between items-center gap-2">
+      <div class="flex-1">
+        <h1
+          class="text-base font-medium line-clamp-1"
+          :title="data.title"
+        >
+          {{ data.title }}
+        </h1>
+        <p class="text-xs font-medium text-gray-400">
+          {{ data.description }}
+        </p>
+      </div>
+      <div>
+        <UButtonGroup
+          size="xs"
+          v-if="type === 'system'"
+        >
+          <UButton
+            label="使用模板"
+            color="white"
+            @click="emit('user-titles-request', data)"
+          />
+          <UButton
+            icon="tabler:trash"
+            color="red"
+            @click="emit('system-titles-delete', data)"
+            v-if="
+              /** TODO: Temporarily disable this button */ false &&
+              loginState.user.auth_code === 2
+            "
+          />
+        </UButtonGroup>
+        <UButtonGroup
+          size="xs"
+          v-if="type === 'user'"
+        >
+          <UButton
+            icon="tabler:trash"
+            label="删除素材"
+            variant="soft"
+            color="red"
+            @click="emit('user-titles-delete', data)"
+          />
+        </UButtonGroup>
+      </div>
+    </div>
+  </div>
+</template>
+
+<style scoped></style>