aidlab/aida_front
7
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 高级工具转产品图 prompt assist弹窗内容修改

Browse Source
This commit is contained in:
zhangyh
2025-11-20 13:39:23 +08:00
parent ae142b8edf
commit f28eaef252
12 changed files with 301 additions and 140 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/component/home/tools/poseTransfer/index.vue
View File

@@ -168,7 +168,10 @@
</div>
</div>
<div class="prompt-input-container" v-show="!showMotion">
<div class="title">{{ $t('ProductImg.Prompt') }}</div>
<div class="title">
<span>{{ $t('ProductImg.Prompt') }}</span>
<i class="fi fi-rs-interrogation tips-icon" />
</div>
<promptInput :content="inputPrompt" ref="promptInput" />
</div>
<div class="poses" v-show="showMotion">
@@ -1527,6 +1530,15 @@ export default defineComponent({
}
.prompt-input-container {
margin-top: 4rem;
.title{
display: flex;
align-items: center;
column-gap: 1rem;
i{
display: flex;
cursor: pointer;
}
}
}
.title {
font-size: 1.8rem;

182
src/component/home/tools/toProduct/Prompt.vue
View File

@@ -2,6 +2,7 @@
<!-- <div ref="modalContainer"></div> -->
<a-modal
class="prompt-modal generalModel"
:class="{ design: isDesignPage }"
v-model:visible="showModal"
:footer="null"
width="78%"
@@ -82,44 +83,102 @@
</template>
<script lang="ts" setup>
import { ref, useTemplateRef, onMounted } from 'vue'
import { ref, useTemplateRef, onMounted, computed } from 'vue'
import { message } from 'ant-design-vue'
import originalDress from '@/assets/images/product/original_dress.png'
import generatedDress from '@/assets/images/product/geneated_dress.png'
import originalModel from '@/assets/images/product/original_model.png'
import generatedModel from '@/assets/images/product/generated_model.png'
import generatedSketch from '@/assets/images/product/generated_sketch.png'
import maleSingleGarmentSketch from '@/assets/images/product/male_single_garment_sketch.png'
import maleSingleGarmentResult from '@/assets/images/product/male_single_garment_result.png'
import maleSingleModelSketch from '@/assets/images/product/male_single_garment_model_sketch.png'
import maleSingleModelResult from '@/assets/images/product/male_single_garment_model_sketch.png'
import femaleChildModelResult from '@/assets/images/product/single_female_child_model_result.png'
import maleSingleChildSketch from '@/assets/images/product/single_male_child_model_sketch.png'
import maleSingleChildResult from '@/assets/images/product/single_male_child_model_result.png'
import { downloadIamge } from '@/tool/util'
import { useI18n } from 'vue-i18n'
import { useStore } from 'vuex'
const { t, locale } = useI18n()
const store = useStore()
const props = defineProps<{
promptList: string[]
isDesignPage: boolean
}>()
const promptList = computed(() => {
const isFromDesignPage = props.source === 'design' || props.isDesignPage
const { ageGroup, httpType, sex } = store.state.Workspace.probjects
const isSingleDesign = httpType === 'SINGLE_DESIGN'
const isAdult = ageGroup === 'Adult'
const isFemale = sex === 'Female'
if (!isFromDesignPage) {
// 如果不是从design来的，返回两个提示词
return [t('ProductImg.UploadWithoutModel'), t('ProductImg.UploadWithModel')]
} else {
// 如果是从design来的
if (isSingleDesign) {
// SINGLE_DESIGN: 两个提示词
// 根据年龄和性别选择对应的提示词
let firstPrompt: string // 不带模特的提示词
let secondPrompt: string // 带模特的提示词
if (isAdult) {
// 成人
if (isFemale) {
// 成人女
firstPrompt = t('ProductImg.SingleAdultFemaleWithoutModel')
secondPrompt = t('ProductImg.SingleAdultFemaleWithModel')
} else {
// 成人男
firstPrompt = t('ProductImg.SingleAdultMaleWithoutModel')
secondPrompt = t('ProductImg.SingleAdultMaleWithModel')
}
} else {
// 儿童
if (isFemale) {
// 儿童女
firstPrompt = t('ProductImg.SingleChildFemaleWithoutModel')
secondPrompt = t('ProductImg.SingleChildFemaleWithModel')
} else {
// 儿童男
firstPrompt = t('ProductImg.SingleChildMaleWithoutModel')
secondPrompt = t('ProductImg.SingleChildMaleWithModel')
}
}
return [firstPrompt, secondPrompt]
}
}
})
const modalContainer = useTemplateRef('modalContainer')
const showModal = defineModel<boolean>('showModal', { required: true })
const garmentExample = [
{
title: 'originalDress',
title: 'Original Dress',
src: originalDress,
isOriginal: true
},
{
title: 'generatedDress',
title: 'Generated Result',
src: generatedDress
}
]
const sketchExample = [
{
title: 'origianlDress',
title: 'Origianl Sketch',
src: originalDress,
isOriginal: true
},
{
title: 'generatedSketch',
title: 'Generated Sketch',
src: generatedSketch
}
]
@@ -136,11 +195,98 @@ const modelExample = [
}
]
const exampleList = {
garmentExample,
sketchExample,
modelExample
}
const femaleAdultGarment = [...garmentExample]
const femaleAdultWithModel = [...modelExample]
const maleAdultGarment = [
{
title: 'originalDress',
src: maleSingleGarmentSketch,
isOriginal: true
},
{
title: 'generated male sketch',
src: maleSingleGarmentResult
}
]
const maleAdultWithModel = [
{
title: 'original male model',
src: maleSingleModelSketch,
isOriginal: true
},
{
title: 'generated male model',
src: maleSingleModelResult
}
]
const childFemaleGarment = [...garmentExample]
const childFemaleWithModel = [
{
title: 'Origianl Sketch',
src: originalDress,
isOriginal: true
},
{
title: 'Generated female girl Sketch',
src: femaleChildModelResult
}
]
const childMaleGarment = [...maleAdultGarment]
const childMaleWithModel = [
{
title: 'original sketch',
src: maleSingleChildSketch,
isOriginal: true
},
{
title: 'generate child male model',
src: maleSingleChildResult
}
]
const exampleList = computed(() => {
let obj = {}
if (!props.isDesignPage) {
obj = {
garmentExample,
sketchExample,
modelExample
}
} else {
const { ageGroup, httpType, sex } = store.state.Workspace.probjects
const isSingleDesign = httpType === 'SINGLE_DESIGN'
if (!isSingleDesign) return {}
const isAdult = ageGroup === 'Adult'
const isFemale = sex === 'Female'
if (isAdult) {
if (isFemale) {
obj = {
femaleAdultGarment,
femaleAdultWithModel
}
} else {
obj = {
maleAdultGarment,
maleAdultWithModel
}
}
} else {
if (isFemale) {
obj = {
childFemaleGarment,
childFemaleWithModel
}
} else {
obj = {
childMaleGarment,
childMaleWithModel
}
}
}
}
return obj
})
const handleClose = () => {
showModal.value = false
@@ -200,6 +346,7 @@ const handleCopy = async (value: string) => {
justify-content: space-between;
overflow-x: auto;
overflow-y: hidden;
.example-wrapper {
display: flex;
gap: 0;
@@ -227,6 +374,7 @@ const handleCopy = async (value: string) => {
}
}
}
.prompt-list {
margin-top: 3.5rem;
display: flex;
@@ -252,6 +400,18 @@ const handleCopy = async (value: string) => {
}
}
}
&.design {
.example-content {
padding-left: 0;
justify-content: space-around;
}
.prompt-list {
justify-content: space-around;
.prompt-item {
width: 40%;
}
}
}
}
:deep(.generalModel .ant-modal-body) {
padding: 5rem 4.4rem 8rem 4.6rem;

68
src/component/home/tools/toProduct/index.vue
View File

@@ -320,8 +320,15 @@
}"
:isProductimg="true"
></scaleImage>
<Prompt v-if="productimgMenu.value == 'ToProductImage'" v-model:showModal="showPromptAssist" :promptList="promptTextList" />
<PromptEditProduct v-if="productimgMenu.value == 'Relight'" v-model:showModal="showPromptAssist"></PromptEditProduct>
<Prompt
v-if="productimgMenu.value == 'ToProductImage'"
v-model:showModal="showPromptAssist"
:isDesignPage="isDesignPage"
/>
<PromptEditProduct
v-if="productimgMenu.value == 'Relight'"
v-model:showModal="showPromptAssist"
></PromptEditProduct>
</div>
</template>
@@ -364,7 +371,7 @@ export default defineComponent({
generalMenu,
generalDrag,
Prompt,
PromptEditProduct
PromptEditProduct
},
props: {
setTask: {
@@ -727,8 +734,8 @@ export default defineComponent({
let remPrductimgTime: any = null
let prductimgTime: any = null
let getPrductimg = () => {
// 未输入prompt时不可生成
if (!productImgData.searchName[props.productimgMenu.value]) {
// 非高级工具 未输入prompt时不可生成
if (!productImgData.searchName[props.productimgMenu.value] && !props.isDesignPage) {
message.info(t('ProductImg.noPrompt'))
return
}
@@ -784,22 +791,6 @@ export default defineComponent({
}
productImgData.isProductimg = true
// 设置默认prompt
if (!productImgData.searchName[props.productimgMenu.value]) {
const isFromDesignPage = props.source == 'design' || props.isDesignPage
const { ageGroup, httpType } = store.state.Workspace.probjects
const isSingleDesign = httpType === 'SINGLE_DESIGN'
if (!isFromDesignPage) {
data.prompt = t('poseTransfer.UploadWithModel')
} else if (ageGroup === 'Adult') {
data.prompt = isSingleDesign
? t('poseTransfer.SingleAdultTryOn')
: t('poseTransfer.SeriesAdultTryOn')
} else if (isSingleDesign) {
data.prompt = t('poseTransfer.SingleGarment')
}
}
let url = Https.httpUrls.toProduct
if (props.productimgMenu.value == 'Relight') {
url = Https.httpUrls.relight
@@ -1107,36 +1098,16 @@ export default defineComponent({
})
// 计算属性：根据条件生成提示词列表
const promptTextList = computed(() => {
const isFromDesignPage = props.source === 'design' || props.isDesignPage
const { ageGroup, httpType } = store.state.Workspace.probjects
const isSingleDesign = httpType === 'SINGLE_DESIGN'
const isAdult = ageGroup === 'Adult'
if (!isFromDesignPage) {
// 如果不是从design来的，返回两个提示词
return [t('poseTransfer.UploadWithoutModel'), t('poseTransfer.UploadWithModel')]
} else {
// 如果是从design来的
if (isSingleDesign) {
// SINGLE_DESIGN: 两个提示词
const secondPrompt = isAdult
? t('poseTransfer.SingleAdultTryOn')
: t('poseTransfer.SingleChildTryOn')
return [t('poseTransfer.SingleGarment'), secondPrompt]
} else {
// SERIES_DESIGN: 一个提示词
return [
isAdult
? t('poseTransfer.SeriesAdultTryOn')
: t('poseTransfer.SeriesChildTryOn')
]
}
}
})
const showPromptAssist = ref(false)
const handleClickAssistBtn = () => {
const { httpType } = store.state.Workspace.probjects
const isSingleDesign = httpType === 'SINGLE_DESIGN'
if (props.isDesignPage && !isSingleDesign) {
const promptText = t('ProductImg.Series')
productImgData.searchName[props.productimgMenu.value] = promptText
return
}
showPromptAssist.value = true
}
@@ -1150,7 +1121,6 @@ export default defineComponent({
productimgMenuList,
RelightDirectionList,
RelightDirection,
promptTextList,
showPromptAssist,
setproduct,