From 615afbc211b295c82175b308373c1c96b336c63c Mon Sep 17 00:00:00 2001
From: WangLeo <690854599@qq.com>
Date: Tue, 9 Jun 2026 11:42:00 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20=E6=96=B0=E5=A2=9E=20Video=20=E5=B9=B3?=
 =?UTF-8?q?=E5=8F=B0=E5=8C=85=EF=BC=88descriptor=20+=20=E6=8E=A7=E4=BB=B6?=
 =?UTF-8?q?=E8=BF=81=E7=A7=BB=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/platforms/video/controls/pattern.vue    |  96 ++++++
 src/platforms/video/controls/proportion.vue | 242 ++++++++++++++
 src/platforms/video/controls/time.vue       |  84 +++++
 src/platforms/video/imageUploader.vue       | 330 ++++++++++++++++++++
 src/platforms/video/index.js                | 166 ++++++++++
 src/platforms/video/modelSelector.vue       | 149 +++++++++
 6 files changed, 1067 insertions(+)
 create mode 100644 src/platforms/video/controls/pattern.vue
 create mode 100644 src/platforms/video/controls/proportion.vue
 create mode 100644 src/platforms/video/controls/time.vue
 create mode 100644 src/platforms/video/imageUploader.vue
 create mode 100644 src/platforms/video/index.js
 create mode 100644 src/platforms/video/modelSelector.vue

diff --git a/src/platforms/video/controls/pattern.vue b/src/platforms/video/controls/pattern.vue
new file mode 100644
index 0000000..2ad910d
--- /dev/null
+++ b/src/platforms/video/controls/pattern.vue
@@ -0,0 +1,96 @@
+<template>
+    <Select
+        v-model="quantity"
+        :options="quantityOptions"
+        class="quantity-select"
+        position="top"
+    >
+        <template #prefix>
+            <img :src="selectedIcon" alt="" style="width: 20px;">
+        </template>
+        <template #option="{ option }">
+            <div class="option-content-custom">
+                <img :src="option.icon" alt="" style="width: 20px;">
+                <span v-if="option.labelText" class="option-label-text">{{ option.labelText }}</span>
+            </div>
+        </template>
+    </Select>
+</template>
+
+<script setup>
+import Select from '@/components/Select/index.vue'
+
+import videoPattern2 from '@/assets/dialog/videoPattern2.svg'
+import videoPattern4 from '@/assets/dialog/videoPattern4.svg'
+import videoPattern5 from '@/assets/dialog/videoPattern5.svg'
+import videoPattern6 from '@/assets/dialog/videoPattern6.svg'
+
+const props = defineProps({
+  modelValue: {
+    type: String,
+    default: '全能参考'
+  }
+})
+
+const emit = defineEmits(['update:modelValue'])
+
+const quantity = computed({
+  get: () => props.modelValue,
+  set: (value) => emit('update:modelValue', value)
+})
+
+const quantityOptions = [
+  { value: '文生视频', label: '文生视频', labelText: '文生视频', icon: videoPattern2 },
+  { value: '首尾帧', label: '首尾帧', labelText: '首尾帧', icon: videoPattern2 },
+  { value: '数字人', label: '数字人', labelText: '数字人', icon: videoPattern2 },
+  { value: '全能参考', label: '全能参考', labelText: '全能参考', icon: videoPattern4 },
+  { value: '智能多帧', label: '智能多帧', labelText: '智能多帧', icon: videoPattern5 },       
+  { value: '主体参考', label: '主体参考', labelText: '主体参考', icon: videoPattern6 }
+]
+
+const selectedIcon = computed(() => {
+  const option = quantityOptions.find(opt => opt.value === quantity.value)
+  return option ? option.icon : videoPattern1
+})
+</script>
+
+<style lang="less" scoped>
+.quantity-select {
+    :deep(.select-header) {
+        height: 40px;
+        padding: 0 15px;
+        border-radius: 10px;
+        border: 1px solid #E8E9EB;
+        background: #f5f6f7;
+        
+        &:hover {
+            background: #e9eaeb;
+        }
+    }
+    
+    :deep(.select-text) {
+        font-size: 14px;
+    }
+    
+    :deep(.dropdown-menu) {
+        min-width: 140px;
+    }
+    
+    :deep(.dropdown-item) {
+        min-width: 80px;
+        justify-content: start;
+    }
+}
+
+.option-content-custom {
+    display: flex;
+    align-items: center;
+    justify-content: start;
+    gap: 8px;
+}
+
+.option-label-text {
+    font-size: 14px;
+    color: inherit;
+}
+</style>
diff --git a/src/platforms/video/controls/proportion.vue b/src/platforms/video/controls/proportion.vue
new file mode 100644
index 0000000..0aeafae
--- /dev/null
+++ b/src/platforms/video/controls/proportion.vue
@@ -0,0 +1,242 @@
+<template>
+    <Popover placement="top">
+        <div class="proportion-container">
+            <div class="section">
+                <h3>选择比例</h3>
+                <div class="proportion-options" :style="{ marginBottom: props.type === 'Video' ? '0px' : '20px' }">
+                    <div 
+                        v-for="item in proportionOptions" 
+                        :key="item.value"
+                        class="proportion-item"
+                        :class="{ active: proportion === item.value }"
+                        :style="getProportionStyle(item.value)"
+                        @click="selectProportion(item.value)"
+                    >
+                        {{ item.label }}
+                    </div>
+                </div>
+            </div>
+
+            <div class="section">
+                <h3>选择分辨率</h3>
+                <div class="resolution-options">
+                    <div 
+                        v-for="item in resolutionOptions" 
+                        :key="item.value"
+                        class="resolution-item"
+                        :class="{ active: resolution === item.value }"
+                        @click="selectResolution(item.value)"
+                    >
+                        {{ item.label }}
+                    </div>
+                </div>
+            </div>
+        </div>
+        <template #reference>
+            <div class="choice-btn">
+                <img src="@/assets/dialog/proportion.svg" alt="" style="width: 16px;">
+                <span>{{ proportion }}</span>
+                <div style="border: 0.5px solid #000; width: 1px; height:13px;margin: 0 5px;" />
+                <span>{{ resolution }}</span>
+            </div>
+        </template>
+    </Popover>
+</template>
+
+<script setup>
+import Popover from '@/components/Popover/index.vue'
+
+const props = defineProps({
+  modelValue: {
+    type: String,
+    default: '1:1'
+  },
+  resolution: {
+    type: String,
+    default: '2k'
+  },
+  proportionOptions: {
+    type: Array,
+    default: () => [
+      { value: '21:9', label: '21:9' },
+      { value: '16:9', label: '16:9' },
+      { value: '4:3', label: '4:3' },
+      { value: '1:1', label: '1:1' },
+      { value: '3:4', label: '3:4' },
+      { value: '9:16', label: '9:16' }
+    ]
+  },
+  resolutionOptions: {
+    type: Array,
+    default: () => [
+      { value: '360', label: '流畅 360P' },
+      { value: '540', label: '标清 540P' },
+      { value: '720', label: '高清 720P' },
+      { value: '1k', label: '超清 1K' }
+    ]
+  }
+})
+
+const emit = defineEmits(['update:modelValue', 'update:resolution'])
+
+const proportion = computed({
+  get: () => props.modelValue,
+  set: (value) => emit('update:modelValue', value)
+})
+
+const resolution = computed({
+  get: () => props.resolution,
+  set: (value) => emit('update:resolution', value)
+})
+
+const selectProportion = (value) => {
+  proportion.value = value
+}
+
+const selectResolution = (value) => {
+  resolution.value = value
+}
+
+const getProportionStyle = (value) => {
+  if (value === '智能') {
+    return {
+      '--width': '20px',
+      '--height': '20px'
+    }
+  }
+  const [w, h] = value.split(':').map(Number)
+  const aspectRatio = w / h
+  const baseSize = 20
+  
+  if (aspectRatio > 1) {
+    return {
+      '--width': `${baseSize}px`,
+      '--height': `${Math.round(baseSize / aspectRatio)}px`
+    }
+  } else {
+    return {
+      '--width': `${Math.round(baseSize * aspectRatio)}px`,
+      '--height': `${baseSize}px`
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.choice-btn{
+  display: flex;
+  height: 40px;
+  padding: 0 15px;
+  justify-content: center;
+  align-items: center;
+  gap: 5px;
+  border-radius: 10px;
+  border: 1px solid #E8E9EB;
+  background: #f5f6f7;
+  cursor: pointer;
+  position: relative;
+}
+.choice-btn:hover{
+  background: #e9eaeb;
+}
+
+.proportion-container{
+  padding: 20px;
+  min-width: 300px;
+}
+
+.section{
+  margin-bottom: 20px;
+  border-radius: 20px;
+  
+  &:last-child{
+    margin-bottom: 0;
+  }
+  
+  h3{
+    font-family: "Microsoft YaHei";
+    font-size: 12px;
+    font-weight: 400;
+    margin-bottom: 12px;
+    color: #999;
+  }
+}
+.proportion-options{
+  display: flex;
+  flex-wrap: nowrap;
+  gap: 5px;
+  margin-bottom: 16px;
+  background-color: #F8F9FA;
+  padding: 5px;
+  border-radius: 10px;
+}
+
+.proportion-item{
+  display: flex;
+  flex: 1;
+  flex-direction: column;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 4px;
+  padding: 5px;
+  cursor: pointer;
+  font-size: 12px;
+  transition: all 0.2s ease;
+  border-radius: 5px;
+  text-align: bottom;
+  color: #999;
+  
+  &::before{
+    content: '';
+    width: var(--width, 20px);
+    height: var(--height, 20px);
+    background: #F5F6F7;
+    border-radius: 4px;
+    transition: all 0.2s ease;
+    border: 2px solid #999;
+  }
+  
+  &:hover{
+    background: #e0e0e0;
+  }
+  
+  &.active{
+    color: #000F33;
+    background: #ffffff;
+  }
+  &.active::before{
+    border-color: #000F33;
+  }
+}
+
+.resolution-options{
+  display: flex;
+  padding: 5px;
+  align-items: center;
+  align-self: stretch;
+  border-radius: 10px;
+  background: #F8F9FA;
+  gap: 10px;
+}
+
+.resolution-item{
+  flex: 1;
+  padding: 10px;
+  border-radius: 8px;
+  cursor: pointer;
+  font-size: 14px;
+  text-align: center;
+  transition: all 0.2s ease;
+  color: #666;
+  
+  &:hover{
+    background: #e0e0e0;
+  }
+  
+  &.active{
+    background: #ffffff;
+    color: #000000;
+    font-weight: 500;
+  }
+}
+</style>
diff --git a/src/platforms/video/controls/time.vue b/src/platforms/video/controls/time.vue
new file mode 100644
index 0000000..7acfe1a
--- /dev/null
+++ b/src/platforms/video/controls/time.vue
@@ -0,0 +1,84 @@
+<template>
+    <Select
+        v-model="quantity"
+        :options="quantityOptions"
+        class="quantity-select"
+        position="top"
+    >
+        <template #prefix>
+            <img src="@/assets/dialog/time.svg" alt="" style="width: 20px;">
+        </template>
+        <template #header>
+            <span class="header">选择视频生成时长</span>
+        </template>
+    </Select>
+</template>
+
+<script setup>
+import Select from '@/components/Select/index.vue'
+
+const props = defineProps({
+  modelValue: {
+    type: Number,
+    default: 1
+  },
+  options: {
+    type: Array,
+    default: () => [
+      { value: 5, label: '5s' },
+      { value: 6, label: '6s' },
+      { value: 7, label: '7s' },
+      { value: 8, label: '8s' },
+      { value: 9, label: '9s' },
+      { value: 10, label: '10s' }
+    ]
+  }
+})
+
+const emit = defineEmits(['update:modelValue'])
+
+const quantity = computed({
+  get: () => props.modelValue,
+  set: (value) => emit('update:modelValue', value)
+})
+
+const quantityOptions = computed(() => props.options)
+</script>
+
+<style lang="less" scoped>
+.quantity-select {
+    :deep(.select-header) {
+        height: 40px;
+        padding: 0 15px;
+        border-radius: 10px;
+        border: 1px solid #E8E9EB;
+        background: #f5f6f7;
+        
+        &:hover {
+            background: #e9eaeb;
+        }
+    }
+    
+    :deep(.select-text) {
+        font-size: 14px;
+    }
+    
+    :deep(.dropdown-menu) {
+        min-width: 136px;
+    }
+    
+    :deep(.dropdown-item) {
+        min-width: 80px;
+        justify-content: center;
+    }
+}
+.header{
+    margin-left: 10px;
+    color: #999;
+    font-family: "Microsoft YaHei";
+    font-size: 12px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: normal;
+}
+</style>
diff --git a/src/platforms/video/imageUploader.vue b/src/platforms/video/imageUploader.vue
new file mode 100644
index 0000000..4c7c708
--- /dev/null
+++ b/src/platforms/video/imageUploader.vue
@@ -0,0 +1,330 @@
+<template>
+  <div class="video-image-uploader">
+    <div class="image-list">
+      <div
+        v-for="(item, index) in localPreviewList"
+        :key="item.uid"
+        class="image-item"
+      >
+        <img :src="item.url" class="uploaded-image" :alt="getFrameLabel(index)" />
+        <div class="frame-label">{{ getFrameLabel(index) }}</div>
+        <div class="delete-icon" @click.stop="handleDelete(index)">
+          <i-ep-close />
+        </div>
+      </div>
+      <template v-for="i in maxImages" :key="i">
+        <div
+          v-if="localPreviewList.length < maxImages && !localPreviewList[i - 1]"
+          class="upload-trigger"
+          @click="triggerUpload(i - 1)"
+        >
+          <i-ep-plus color="#333333" />
+          <div class="upload-text">{{ getUploadText(i) }}</div>
+        </div>
+      </template>
+    </div>
+    <el-upload
+      v-for="i in maxImages"
+      :key="i"
+      :ref="el => setUploadRef(el, i - 1)"
+      v-show="false"
+      :action="uploadurl"
+      :limit="1"
+      :before-upload="beforeUpload"
+      :on-success="(response, uploadFile) => handleSuccess(response, uploadFile, i - 1)"
+      :on-error="handleError"
+    />
+  </div>
+</template>
+
+<script setup>
+import { genFileId } from 'element-plus'
+
+const props = defineProps({
+  modelType: {
+    type: String,
+    default: 'text'
+  },
+  imagesCount: {
+    type: Number,
+    default: 1
+  },
+  modelValue: {
+    type: Array,
+    default: () => []
+  }
+})
+
+const emit = defineEmits(['update:modelValue'])
+
+const uploadurl = import.meta.env.VITE_API_WORKFLOW_UPLOAD
+const uploadRefs = ref([])
+const imageList = ref([...props.modelValue])
+const localPreviewList = ref([...props.modelValue])
+const isUploading = ref(false)
+
+const showEndFrame = computed(() => props.modelType === 'image' && props.imagesCount === 2)
+const maxImages = computed(() => props.modelType === 'image' ? (showEndFrame.value ? 2 : 1) : 1)
+
+const setUploadRef = (el, index) => {
+  if (el) {
+    uploadRefs.value[index] = el
+  }
+}
+
+const getFrameLabel = (index) => {
+  if (props.modelType === 'digitalHuman') {
+    return ''
+  }
+  return index === 0 ? '首帧' : '尾帧'
+}
+
+const getUploadText = (i) => {
+  if (props.modelType === 'digitalHuman') {
+    return '参考内容'
+  }
+  return i === 1 ? '首帧' : '尾帧'
+}
+
+watch(() => props.modelValue, async (newVal) => {
+  if (isUploading.value) {
+    return
+  }
+  
+  imageList.value = [...newVal]
+  
+  const newPreviewList = []
+  for (const img of newVal) {
+    let previewImg = { ...img }
+    if (img.url && !img.url.startsWith('blob:')) {
+      try {
+        const response = await fetch(img.url)
+        const blob = await response.blob()
+        previewImg = {
+          ...img,
+          url: URL.createObjectURL(blob),
+          serverUrl: img.url
+        }
+      } catch (error) {
+        console.error('Failed to create blob URL:', error)
+        previewImg = {
+          ...img,
+          serverUrl: img.url
+        }
+      }
+    }
+    newPreviewList.push(previewImg)
+  }
+  localPreviewList.value = newPreviewList
+}, { deep: true, immediate: true })
+
+const triggerUpload = (index) => {
+  if (uploadRefs.value[index]) {
+    uploadRefs.value[index].$el.querySelector('input').click()
+  }
+}
+
+const beforeUpload = (rawFile) => {
+  const allowedTypes = ['image/jpeg', 'image/png']
+
+  if (!allowedTypes.includes(rawFile.type)) {
+    ElMessage.error('不支持的文件类型，请上传 JPG、PNG 格式的图片')
+    return false
+  }
+
+  if (rawFile.size / 1024 / 1024 > 10) {
+    ElMessage.error('图片大小不能超过 10MB')
+    return false
+  }
+}
+
+const handleSuccess = (response, uploadFile, index) => {
+  ElMessage.success('上传成功')
+  
+  isUploading.value = true
+  
+  const localUrl = URL.createObjectURL(uploadFile.raw)
+  
+  const newImage = {
+    uid: uploadFile.uid,
+    url: response.url
+  }
+  
+  if (imageList.value[index]) {
+    const previewItem = localPreviewList.value[index]
+    if (previewItem && previewItem.url && previewItem.url.startsWith('blob:')) {
+      URL.revokeObjectURL(previewItem.url)
+    }
+    imageList.value[index] = newImage
+    localPreviewList.value[index] = {
+      uid: uploadFile.uid,
+      url: localUrl,
+      serverUrl: response.url
+    }
+  } else {
+    imageList.value[index] = newImage
+    localPreviewList.value[index] = {
+      uid: uploadFile.uid,
+      url: localUrl,
+      serverUrl: response.url
+    }
+  }
+  
+  emit('update:modelValue', [...imageList.value])
+  
+  nextTick(() => {
+    isUploading.value = false
+  })
+}
+
+const handleError = () => {
+  ElMessage.error('上传失败，请重新选择图片')
+}
+
+const handleDelete = (index) => {
+  const previewItem = localPreviewList.value[index]
+  if (previewItem && previewItem.url && previewItem.url.startsWith('blob:')) {
+    URL.revokeObjectURL(previewItem.url)
+  }
+  
+  localPreviewList.value.splice(index, 1)
+  imageList.value.splice(index, 1)
+  emit('update:modelValue', [...imageList.value])
+}
+
+const handleSelect = async (url, index = 0) => {
+  const initialFile = await fetch(url)
+  const blob = await initialFile.blob()
+  const file = new File([blob], `selected_image_${Date.now()}.jpg`, { type: blob.type })
+  file.uid = genFileId()
+
+  if (uploadRefs.value[index]) {
+    uploadRefs.value[index].handleStart(file)
+    uploadRefs.value[index].submit()
+  }
+}
+
+defineExpose({
+  handleSelect
+})
+</script>
+
+<style lang="less" scoped>
+.video-image-uploader {
+  display: flex;
+  align-items: center;
+}
+
+.image-list {
+  display: flex;
+  gap: 8px;
+  align-items: center;
+}
+
+.image-item {
+  position: relative;
+  width: 56px;
+  height: 56px;
+  cursor: pointer;
+  transition: all 0.3s ease;
+
+  &:hover {
+    transform: scale(1.1);
+    z-index: 10;
+
+    .delete-icon {
+      opacity: 1;
+    }
+  }
+
+  .uploaded-image {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    transition: all 0.3s ease;
+    border-radius: 8px;
+  }
+
+  .frame-label {
+    position: absolute;
+    bottom: 4px;
+    right: 4px;
+    width: 32px;
+    height: 20px;
+    background: rgba(0, 15, 51, 0.8);
+    border-radius: 4px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: white;
+    font-size: 10px;
+    font-weight: bold;
+    z-index: 5;
+    transition: all 0.3s ease;
+  }
+
+  .delete-icon {
+    position: absolute;
+    top: -6px;
+    right: -6px;
+    width: 20px;
+    height: 20px;
+    background: #ef4444;
+    border-radius: 50%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    color: white;
+    font-size: 12px;
+    cursor: pointer;
+    opacity: 0;
+    transition: all 0.3s ease;
+    z-index: 20;
+
+    &:hover {
+      background: #dc2626;
+      transform: scale(1.1);
+    }
+  }
+}
+
+.upload-trigger {
+  width: 56px;
+  height: 56px;
+  background: rgba(0, 15, 51, 0.04);
+  backdrop-filter: blur(5px);
+  border-radius: 8px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+  cursor: pointer;
+  color: #9ca3af;
+  font-size: 15px;
+  transition: all 0.3s ease;
+
+  span {
+    color: #333;
+    font-family: "Microsoft YaHei";
+    font-size: 12px;
+    font-style: normal;
+    font-weight: 400;
+    line-height: normal;
+  }
+
+  &:hover {
+    background-color: #F0F1F2;
+    border-color: #626aef;
+    transform: scale(1.05);
+  }
+}
+
+.upload-text {
+  color: #666;
+  font-family: "Microsoft YaHei";
+  font-size: 12px;
+  font-style: normal;
+  font-weight: 400;
+  line-height: normal;
+}
+</style>
diff --git a/src/platforms/video/index.js b/src/platforms/video/index.js
new file mode 100644
index 0000000..b2cf613
--- /dev/null
+++ b/src/platforms/video/index.js
@@ -0,0 +1,166 @@
+import { ref, markRaw } from 'vue'
+import { fetchModelConfig } from '@/utils/modelConfig'
+import { fetchPlatformModels, getPlatformCode } from '@/utils/modelApi'
+import VideoModelSelector from './modelSelector.vue'
+import Pattern from './controls/pattern.vue'
+import VideoProportion from './controls/proportion.vue'
+import Time from './controls/time.vue'
+import VideoImageUploader from './imageUploader.vue'
+import { registerPlatform } from '../registry.js'
+
+export function defineVideoPlatform() {
+  const model = ref('LTX2.0')
+  const modelType = ref('text')
+  const proportion = ref('16:9')
+  const resolution = ref('1k')
+  const duration = ref(5)
+  const videoPattern = ref('文生视频')
+
+  const resolutionOptions = ref([
+    { value: '1k', label: '标清 1K' },
+    { value: '2k', label: '高清 2K' },
+    { value: '4k', label: '超清 4K' },
+  ])
+  const proportionOptions = ref([
+    { value: '智能', label: '智能' },
+    { value: '21:9', label: '21:9' },
+    { value: '16:9', label: '16:9' },
+    { value: '4:3', label: '4:3' },
+    { value: '1:1', label: '1:1' },
+    { value: '3:4', label: '3:4' },
+    { value: '9:16', label: '9:16' },
+  ])
+  const durationOptions = ref([])
+  const modelDisplayConfig = ref(null)
+  const promptPlaceholder = ref('描述你想生成的画面和动作。')
+
+  const state = {
+    model, modelType,
+    proportion, resolution,
+    duration, videoPattern,
+    resolutionOptions, proportionOptions, durationOptions,
+    modelDisplayConfig,
+  }
+
+  async function loadInternalConfig(modelName, modelTypeVal) {
+    const config = await fetchModelConfig('Video', modelName, modelTypeVal)
+    modelDisplayConfig.value = config
+    if (config?.display) {
+      const d = config.display
+      if (d.resolution) {
+        resolution.value = d.resolution.default || '1k'
+        resolutionOptions.value = d.resolution.options || []
+      }
+      if (d.proportion) {
+        proportion.value = d.proportion.default || '16:9'
+        proportionOptions.value = d.proportion.options || []
+      }
+      if (d.duration) {
+        duration.value = d.duration.default || 5
+        durationOptions.value = d.duration.options || []
+      }
+      if (d.promptPlaceholder) {
+        promptPlaceholder.value = d.promptPlaceholder.default || '描述你想生成的画面和动作。'
+      }
+    }
+    return config
+  }
+
+  const controls = [
+    {
+      name: 'pattern',
+      component: markRaw(Pattern),
+      show: () => true,
+      props: () => ({
+        modelValue: videoPattern.value,
+        'onUpdate:modelValue': (v) => { videoPattern.value = v },
+      }),
+    },
+    {
+      name: 'proportion',
+      component: markRaw(VideoProportion),
+      show: () => true,
+      props: () => ({
+        modelValue: proportion.value,
+        'onUpdate:modelValue': (v) => { proportion.value = v },
+        resolution: resolution.value,
+        'onUpdate:resolution': (v) => { resolution.value = v },
+        proportionOptions: proportionOptions.value,
+        resolutionOptions: resolutionOptions.value,
+      }),
+    },
+    {
+      name: 'time',
+      component: markRaw(Time),
+      show: () => true,
+      props: () => ({
+        modelValue: duration.value,
+        'onUpdate:modelValue': (v) => { duration.value = v },
+        options: durationOptions.value,
+      }),
+    },
+  ]
+
+  const platform = {
+    id: 'video',
+    label: 'AI视频2026',
+    ModelSelector: markRaw(VideoModelSelector),
+    modelSelectorProps: () => ({ videoPattern: videoPattern.value }),
+    controls,
+    ImageUploader: markRaw(VideoImageUploader),
+    state,
+    model,
+    modelType,
+    modelDisplayConfig,
+    promptPlaceholder,
+
+    async loadModels() {
+      const code = getPlatformCode('Video')
+      return fetchPlatformModels(code)
+    },
+
+    async loadConfig(modelName, modelTypeVal) {
+      return loadInternalConfig(modelName, modelTypeVal)
+    },
+
+    getDefaultModel() {
+      return 'LTX2.0'
+    },
+
+    showImageUploader() {
+      return modelType.value !== 'text'
+    },
+
+    imageUploadLimit() {
+      return modelDisplayConfig.value?.display?.images || 1
+    },
+
+    isImageRequired() {
+      return modelType.value !== 'text'
+    },
+
+    buildTaskBody(shared) {
+      const modelParams = {
+        prompt: shared.prompt.value,
+        proportion: proportion.value,
+        resolution: resolution.value,
+        duration: duration.value,
+        videoPattern: videoPattern.value,
+      }
+      return modelParams
+    },
+
+    fillFromResult(resultData) {
+      if (resultData.model !== undefined) model.value = resultData.model
+      if (resultData.modelType !== undefined) modelType.value = resultData.modelType
+      if (resultData.proportion !== undefined) proportion.value = resultData.proportion
+      if (resultData.resolution !== undefined) resolution.value = resultData.resolution
+      if (resultData.duration !== undefined) duration.value = resultData.duration
+      if (resultData.videoPattern !== undefined) videoPattern.value = resultData.videoPattern
+    },
+  }
+
+  return platform
+}
+
+registerPlatform('Video', defineVideoPlatform)
diff --git a/src/platforms/video/modelSelector.vue b/src/platforms/video/modelSelector.vue
new file mode 100644
index 0000000..7fa0dee
--- /dev/null
+++ b/src/platforms/video/modelSelector.vue
@@ -0,0 +1,149 @@
+<template>
+    <Select
+        v-model="model"
+        :options="modelGroups"
+        class="model-select"
+        position="top"
+    >
+        <template #prefix>
+            <img src="@/assets/dialog/model.svg" alt="" style="width: 16px;">
+        </template>
+    </Select>
+</template>
+
+<script setup>
+import Select from '@/components/Select/index.vue'
+
+const props = defineProps({
+  modelValue: {
+    type: String,
+    default: ''
+  },
+  typeValue: {
+    type: String,
+    default: 'text'
+  },
+  videoPattern: {
+    type: String,
+    default: '文生视频'
+  }
+})
+
+const emit = defineEmits(['update:modelValue', 'update:typeValue'])
+
+const videoConfig = ref({})
+
+const fetchConfig = async () => {
+  try {
+    const url = `${import.meta.env.VITE_API_MODEL_RESOURCE}/static/public/Platform/AIGC_modelConfig/video.json`
+    const response = await fetch(url)
+    const data = await response.json()
+    videoConfig.value = data
+  } catch (error) {
+    console.error('Failed to fetch video config:', error)
+  }
+}
+
+
+fetchConfig()
+
+watch(() => videoConfig.value, (newConfig) => {
+  const models = newConfig[props.videoPattern] || []
+  if (models.length > 0) {
+    const enabledModels = models.filter(m => !m.disabled)
+    if (enabledModels.length > 0) {
+      const currentModelExists = enabledModels.find(m => m.value === props.modelValue)
+      if (!currentModelExists) {
+        model.value = enabledModels[0].value
+      }
+    }
+  }
+}, { deep: true })
+
+
+const model = computed({
+  get: () => props.modelValue,
+  set: (value) => {
+    emit('update:modelValue', value)
+    const newType = getModelType(props.videoPattern)
+    emit('update:typeValue', newType)
+  }
+})
+
+const modelGroups = computed(() => {
+  const models = videoConfig.value[props.videoPattern] || []
+  return models
+})
+
+const getModelType = (value) => {
+  switch (value) {
+    case '文生视频':
+      return 'text'
+    case '首尾帧':
+      return 'image'
+    case '数字人':
+      return 'digitalHuman'
+    default:
+      return 'text'
+  }
+}
+
+watch(() => props.videoPattern, (newPattern) => {
+  const models = videoConfig.value[newPattern] || []
+  if (models.length > 0) {
+    const enabledModels = models.filter(m => !m.disabled)
+    if (enabledModels.length > 0) {
+      const currentModelExists = enabledModels.find(m => m.value === props.modelValue)
+      if (!currentModelExists) {
+        model.value = enabledModels[0].value
+      }
+    }
+  }
+})
+
+watch(() => props.modelValue, (newValue) => {
+  const models = videoConfig.value[props.videoPattern] || []
+  const currentModel = models.find(m => m.value === newValue)
+  if (currentModel && currentModel.disabled) {
+    const enabledModels = models.filter(m => !m.disabled)
+    if (enabledModels.length > 0) {
+      model.value = enabledModels[0].value
+    }
+  }
+}, { immediate: true })
+</script>
+
+<style lang="less" scoped>
+.model-select {
+    :deep(.select-header) {
+        height: 40px;
+        padding: 0 15px;
+        border-radius: 10px;
+        border: 1px solid #E8E9EB;
+        background: #f5f6f7;
+        
+        &:hover {
+            background: #e9eaeb;
+        }
+    }
+    
+    :deep(.select-text) {
+      font-size: 14px;
+    }
+    
+    :deep(.dropdown-menu) {
+        max-height: 510px;
+        overflow-y: auto;
+    }
+    
+    :deep(.dropdown-item) {
+        min-width: 120px;
+        
+        &.active {
+            background: rgba(0, 15, 51, 0.10);
+            color: #000F33;
+            font-weight: 600;
+        }
+    }
+}
+</style>