feat: add aigc record, video preview & custom recharge

- create useAigcRecordStore to centralize current AIGC generation record state
- add video media type support to ResultPreview component
- update RecordCard to only display view button for completed tasks
- implement custom recharge amount with input validation and 9999 max limit
- refactor detail page to load record from Pinia store instead of mock data
- clean up TemplateCarousel markup and remove unused badge styles
- fix minor formatting and code style issues

src/pages-aigc/recharge/components/CustomAmountCard/index.vue

@@ -1,13 +1,15 @@
 <template>
-  <view class="custom-card is-selected">
-    <text class="custom-title">充值金额</text>
+  <view :class="['custom-card', { 'is-selected': selected }]" @tap="emit('select')">
+    <text class="custom-title">自选金额</text>
 
     <label class="custom-input-wrap">
       <text class="custom-currency">¥</text>
       <input
         class="custom-input"
         type="number"
+        :maxlength="4"
         :value="modelValue"
+        @focus="emit('select')"
         @input="handleInput"
       />
     </label>
@@ -24,13 +26,20 @@ defineProps({
     type: String,
     default: "",
   },
+  selected: {
+    type: Boolean,
+    default: false,
+  },
 });
 
-const emit = defineEmits(["update:modelValue"]);
+const emit = defineEmits(["update:modelValue", "select"]);
+const MAX_CUSTOM_AMOUNT = 9999;
 
 const handleInput = (event) => {
   const rawValue = event?.detail?.value ?? event?.target?.value ?? "";
-  const value = String(rawValue).replace(/\D/g, "");
+  const digits = String(rawValue).replace(/\D/g, "");
+  const value = digits ? String(Math.min(Number(digits), MAX_CUSTOM_AMOUNT)) : "";
+  emit("select");
   emit("update:modelValue", value);
 };
 </script>