合并画布代码

This commit is contained in:
X1627315083
2025-06-18 11:05:23 +08:00
parent 903c0ebdf5
commit 9c7fae36eb
118 changed files with 23633 additions and 8201 deletions

View File

@@ -31,7 +31,12 @@
<span v-if="scaleImageList[scaleImageIndex]?.resultType == 'ToProductImage'">{{$t('ProductImg.MagicTools')}}</span>
<span v-if="scaleImageList[scaleImageIndex]?.resultType == 'Relight'">{{$t('ProductImg.relightingTool')}}</span>
</div>
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>Selection Function</span>
</div>
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight'" class="productImg_content_item_Direction" style="margin-bottom: 1rem;">
<a-select style="width: 100%;" v-model:value="speedData.value" :options="speedList" :field-names="{ label: 'relightLabel', value: 'value' }"></a-select>
</div>
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'ToProductImage'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.Similarity')}}</span>
</div>
@@ -45,10 +50,10 @@
</a-slider>
<input type="number" readonly v-model="productimgSimilarity">
</div>
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight'" class="productImg_content_item_title productImg_content_item_title_similarity">
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight' && speedData.value != 'flux'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.RelightDirection')}}</span>
</div>
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight'" class="productImg_content_item_Direction">
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight' && speedData.value != 'flux'" class="productImg_content_item_Direction">
<!-- <a-slider class="system_silder"
v-model:value="similarity"
@afterChange="setSimilarity"
@@ -58,10 +63,10 @@
</a-slider> -->
<a-select style="width: 100%;" v-model:value="productimgRelightDirection" :options="productimgRelightDirectionList"></a-select>
</div>
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight'" class="productImg_content_item_title productImg_content_item_title_similarity">
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight' && speedData.value != 'flux'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.Highlight')}}</span>
</div>
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight'" class="productImg_content_item_similarity">
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight' && speedData.value != 'flux'" class="productImg_content_item_similarity">
<a-slider class="system_silder"
v-model:value="productimgBrightenValue"
:tooltipVisible="false"
@@ -92,7 +97,22 @@
></textarea>
</div>
</div>
<div class="productImg_content_item_generate_btn input_border">
<div class="generage_btn_box" style="margin-left: auto;">
<div class="generage_btn started_btn" v-show="!productimgIsProductimg">
<i class="fi fi-bs-magic-wand" style="background-color: #000; font-size: 2.3rem; flex: 1;margin: 0;" @click="getPrductimg()"></i>
<div class="icon iconfont icon-xiala" v-show="scaleImageList[scaleImageIndex]?.resultType != 'Relight'" :class="{active:speedState}" @click.stop="openSpeed"></div>
<div class="content" v-show="speedState">
<div v-for="item in speedList" :key="item.value" :class="{active:item.value == speedData.value}" @click="setSpeed(item)" :title="item.title">{{ item.label }}</div>
</div>
</div>
<div class="generage_btn started_btn" v-show="productimgIsProductimg && !productimgRemProductimg">
<i class="fi fi-br-loading" ></i>
</div>
<div class="generage_btn started_btn" v-show="productimgRemProductimg" @click="removeProductimg">
{{$t('Generate.Close')}}
</div>
</div>
<!-- <div class="productImg_content_item_generate_btn input_border">
<div class="input_box">
<div v-show="!productimgIsProductimg" class="generage_btn started_btn" @click.stop="getPrductimg">
{{ $t('Generate.Generate') }}
@@ -104,7 +124,7 @@
{{$t('Generate.Close')}}
</div>
</div>
</div>
</div> -->
</div>
</div>
<div class="scaleImage_content_imgBox" :class="{active:isComparison}">
@@ -189,6 +209,55 @@ export default defineComponent({
productimgRelightDirection:props.productData.RelightDirection,
productimgRelightDirectionList:props.productData.RelightDirectionList,
})
let speed = reactive({
speedList:[
] as any,
speedTypeList:{
poseTransfer:[
{
title:'Generate high-quality images',
label:'High',
value:'',
},{
title:'Generate using Wanxiang',
label:'WX',
value:'wx',
},
],
toPorductImg:[
{
title:'Generate with high quality',
label:'High',
relightLabel:'Relight',
value:'',
},{
title:'',
label:'FLUX',
relightLabel:'Edit',
value:'flux',
},
]
},
speedState:false,
speedData:{
title:'Generate high-quality images',
relightLabel:'Relight',
label:'High',
value:'',
},
})
const openSpeed = ()=>{
speed.speedState = !speed.speedState
if(speed.speedState){
document.addEventListener('click',openSpeed)
}else{
document.removeEventListener('click',openSpeed)
}
}
const setSpeed = (item:any)=>{
speed.speedData = item
speed.speedState = false
}
let scaleImage: any = ref(false);
let isShowMark = ref(false)
let loadingShow = ref(false)
@@ -224,9 +293,9 @@ export default defineComponent({
}
productimg.productimgIsProductimg = true
remPrductimgTime = setTimeout(()=>{
productimg.productimgRemProductimg = true
},10000)
// remPrductimgTime = setTimeout(()=>{
// productimg.productimgRemProductimg = true
// },10000)
let url = Https.httpUrls.relight
if(scaleImageList.value[scaleImageIndex.value]?.resultType == 'ToProductImage'){
url = Https.httpUrls.toProduct
@@ -234,6 +303,7 @@ export default defineComponent({
isShowMark.value = true
Https.axiosPost(url, data).then(
(rv) => {
productimg.productimgRemProductimg = true
isShowMark.value = false
scaleImageList.value[scaleImageIndex.value].imgUrl = '/image/loading.gif'
let arr:any = []
@@ -381,6 +451,9 @@ export default defineComponent({
return {
t,
...toRefs(productimg),
...toRefs(speed),
openSpeed,
setSpeed,
scaleImage,
isShowMark,
loadingShow,
@@ -427,6 +500,12 @@ export default defineComponent({
this.scaleImageIndex = index
if(dialogueIndex)this.robotAssits = dialogueIndex
// let scaleImageList = this.store.state.UploadFilesModule.moodboard
if(this.scaleImageList[index].resultType == "PoseTransfer"){
this.speedList = this.speedTypeList.poseTransfer
}else{
this.speedList = this.speedTypeList.toPorductImg
}
this.speedData = JSON.parse(JSON.stringify(this.speedList[0]))
document.addEventListener('keydown',this.setKeydown)
},
cancelDsign(){