feat: 产品图转视频

src/component/home/tools/poseTransfer/Tips.vue

@@ -0,0 +1,82 @@
+<template>
+  <div ref="modalContainer"></div>
+  <a-modal
+    class="prompt-modal generalModel"
+    v-model:visible="showModal"
+    :footer="null"
+    :get-container="() => $refs.modalContainer"
+    width="78%"
+    :maskClosable="false"
+    :centered="true"
+    :closable="false"
+    wrapClassName="#app"
+    :keyboard="false"
+  >
+    <div class="generalModel_btn">
+      <div class="generalModel_closeIcon" @click.stop="handleClose()">
+        <svg
+          width="100%"
+          height="100%"
+          viewBox="0 0 46 46"
+          fill="none"
+          xmlns="http://www.w3.org/2000/svg"
+        >
+          <circle cx="23" cy="23" r="23" fill="#000" fill-opacity="0.3" />
+          <rect
+            x="32.5063"
+            y="12"
+            width="3"
+            height="29"
+            rx="1.5"
+            transform="rotate(45 32.5063 12)"
+            fill="white"
+          />
+          <rect
+            x="34.6274"
+            y="32.5059"
+            width="3"
+            height="29"
+            rx="1.5"
+            transform="rotate(135 34.6274 32.5059)"
+            fill="white"
+          />
+        </svg>
+      </div>
+    </div>
+    <div class="title-container">
+      <div class="title">{{ $t('ProductImg.PromptAssit') }}</div>
+      <div class="sub-title">{{ $t('ProductImg.AssitSubTitle') }}</div>
+    </div>
+  </a-modal>
+</template>
+
+<script lang="ts" setup>
+import { ref, useTemplateRef } from 'vue'
+
+import { downloadIamge } from '@/tool/util'
+import { useI18n } from 'vue-i18n'
+const { t, locale } = useI18n()
+
+const modalContainer = useTemplateRef('modalContainer')
+const showModal = defineModel<boolean>('showModal', { required: true })
+
+const handleClose = () => {
+  showModal.value = false
+}
+</script>
+
+<style lang="less" scoped>
+.prompt-modal {
+  .title-container {
+    .title {
+      font-size: 3.5rem;
+      color: #181818;
+    }
+    .sub-title {
+      font-size: 2rem;
+      font-weight: 400;
+      color: #000;
+    }
+  }
+}
+</style>

src/lang/cn.ts

@@ -285,7 +285,7 @@ export default {
     AssitSubTitle: '您可以复制并使用以下提示词：',
     CopySuccess: '已复制到剪贴板',
     CopyFiled: '复制失败',
-    noPrompt:'请输入提示词'
+    noPrompt: '请输入提示词'
   },
   poseTransfer: {
     SelectDesign: '产品图',
@@ -308,7 +308,11 @@ export default {
     UploadWithModel:
       '创建模特穿着该服装的真实感摄影棚照片。若原有模特存在则保留，否则生成合适模特。采用站立姿势面向镜头。精确保留服装细节——图案、颜色、质地及装饰元素。', // 上传线稿,带模特
     UploadWithoutModel:
-      '专业产品摄影：服装以自然形态展示，无模特。采用影棚灯光。保留精确细节——图案、色彩、质感、装饰元素。' // 上传线稿,不带模特
+      '专业产品摄影：服装以自然形态展示，无模特。采用影棚灯光。保留精确细节——图案、色彩、质感、装饰元素。', // 上传线稿,不带模特
+    VideoType: '视频类型',
+    FirstFrame: '首帧',
+    FirstAndLastFrames: '首帧和尾帧',
+    FirstFrameAndSkeleton: '首帧和骨架'
   },
   LibraryPage: {
     library: '收藏',

src/lang/en.ts

@@ -295,7 +295,7 @@ export default {
     AssitSubTitle: 'You can copy following prompt and try:',
     CopySuccess: 'Copied to clipboard',
     CopyFiled: 'Failed to copy',
-    noPrompt:'Please enter prompt'
+    noPrompt: 'Please enter prompt'
   },
   poseTransfer: {
     SelectDesign: 'Product image',
@@ -318,7 +318,11 @@ export default {
     UploadWithModel:
       'Create realistic studio photo with model wearing this garment. Keep original model if present, or generate appropriate model. Standing pose, facing camera. Preserve exact garment details - patterns, colors, textures, embellishments.', // 上传线稿,带模特
     UploadWithoutModel:
-      'Professional product photo: garment displayed with natural shape, no model. Studio lighting. Preserve exact details - patterns, colors, textures, embellishments.' // 上传线稿,不带模特
+      'Professional product photo: garment displayed with natural shape, no model. Studio lighting. Preserve exact details - patterns, colors, textures, embellishments.', // 上传线稿,不带模特
+    VideoType: 'Video Type',
+    FirstFrame: 'First frame',
+    FirstAndLastFrames: 'First and last frames',
+    FirstFrameAndSkeleton: 'First frame and skeleton',
   },
   LibraryPage: {
     library: 'Library',

src/store/homeStore/homeStore.ts

@@ -41,6 +41,7 @@ const HomeStoreModule : Module<DesignDetail,RootState> = {
 			likedList:[],
 		},
 		uploadElement:[],
+		lastFrameList:[],
 		poseTransfer:{
 			list:[],
 			likedList:[],
@@ -70,6 +71,19 @@ const HomeStoreModule : Module<DesignDetail,RootState> = {
     mutations:{
 		setshowSketchList(state,data){
             state.showSketchList = data
+        },
+		setPoseTransferLastFrameList(state,data){
+			console.log('设置尾帧store-------------')
+			// 支持两种方式：set 替换整个列表；add/删除与 uploadElement 一致
+			if(data.str === 'set'){
+				state.poseTransfer.lastFrameList = data.list || []
+				return
+			}
+			if(data.str === 'add'){
+				state.poseTransfer.lastFrameList.unshift(...(data.list || []))
+			}else{
+				state.poseTransfer.lastFrameList.splice(data.index,1)
+			}
         },
         setDesignCollectionList(state,data){
             state.designCollectionList = data