feat(aigc): add video template display support

add video media detection and rendering in TemplateCard and TemplateVersionHero components
update scss styles to support both image and video media elements
update sample template data to use video covers and adjust template information
comment out unused deprecated culture postcard template entry

src/pages-aigc/useTemplate/components/TemplateVersionHero/index.vue

@@ -4,7 +4,19 @@
     :class="`is-${variant}`"
     :style="{ '--template-accent': template.accent || '#0a4d46' }"
   >
-    <image class="template-version-image" :src="template.cover" mode="aspectFill" />
+    <video
+      v-if="isVideoTemplate"
+      class="template-version-video"
+      :src="template.cover"
+      autoplay
+      muted
+      loop
+      :controls="false"
+      :show-play-btn="false"
+      :show-center-play-btn="false"
+      object-fit="cover"
+    />
+    <image v-else class="template-version-image" :src="template.cover" mode="aspectFill" />
     <view class="template-version-shade" />
 
     <view class="template-version-copy">
@@ -16,7 +28,9 @@
 </template>
 
 <script setup>
-defineProps({
+import { computed } from "vue";
+
+const props = defineProps({
   template: {
     type: Object,
     default: () => ({}),
@@ -26,6 +40,15 @@ defineProps({
     default: "default",
   },
 });
+
+const VIDEO_EXT_REGEXP = /\.(mp4|mov|webm|m4v)(\?.*)?$/i;
+
+const isVideoTemplate = computed(() => {
+  const mediaType = props.template.type || props.template.mediaType;
+  if (mediaType === "video") return true;
+
+  return VIDEO_EXT_REGEXP.test(props.template.cover || "");
+});
 </script>
 
 <style scoped lang="scss">

src/pages-aigc/useTemplate/components/TemplateVersionHero/styles/index.scss

@@ -14,7 +14,8 @@
   box-shadow: 0 12px 24px rgba(15, 29, 37, 0.08);
 }
 
-.template-version-image {
+.template-version-image,
+.template-version-video {
   position: absolute;
   top: 0;
   right: 0;