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

页面调整

Browse Source
This commit is contained in:
X1627315083
2025-07-19 14:04:48 +08:00
parent 22ee9c6cf1
commit 4b694236ee
161 changed files with 2934 additions and 3979 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
src/component/home/batchGeneration/createCloud.vue
View File

@@ -75,10 +75,7 @@
show-search
allowClear
:show-arrow="false"
:default-active-first-option="false"
:not-found-content="null"
:filter-option="false"
style="width: 16rem"
style="width: 200px"
:placeholder="$t('batchGeneration.PleaseSelect')"
:options="objectList"
@search="getHistoryProjectList"
@@ -227,7 +224,7 @@
:headers="{ Authorization: getCookie('token') }"
:before-upload="beforeUpload"
:data="{
projectId:projectData
projectId:projectData?.value?projectData?.value:''
}"
v-model:file-list="fileList"
:multiple="true"
@@ -304,7 +301,10 @@ export default defineComponent({
numberOfImages: "",
credits: 0,
exhibitionImgList: [], //选择的图片
projectData: null, //批量id
projectData: {
id:'',
name:'',
}, //批量id
objectList: [],
porjectName: "", //任务名字
//toProduct
@@ -312,6 +312,7 @@ export default defineComponent({
similarity: [20, 40],
brightenValue: 1, //亮度
relightDirection: "Right Light", //打光方向
sequence:'',
relightDirectionList: [
{
value: "Right Light",
@@ -337,10 +338,15 @@ export default defineComponent({
const getUploadElement = () => {
operations.loadingShow = true;
let value = {
id: operationsData.projectData,
id: operationsData.projectData?.value,
moduleList: ["uploadElement"],
};
operationsData.placeholder = "Batch_" + setPlaceholder();
let str = setPlaceholder()
if(!str){
str = props.cloudList.filter((item)=>item.value == operationsData.buildType)[0].label
str = str.replace(/\s+/g, '_')
}
operationsData.placeholder = "Batch_" + str + '_' + operationsData.sequence;
Https.axiosPost(Https.httpUrls.getModuleContent, value)
.then(async (rv) => {
operationsData.uploadElement = rv.uploadElement;
@@ -350,17 +356,18 @@ export default defineComponent({
operations.loadingShow = false;
});
};
let init = (projectData, buildType) => {
let init = (projectData, buildType,sequence) => {
operationsData.sequence = sequence
operations.operationsModal = true;
clearData();
if (projectData?.id) {
operationsData.projectData = {
label: projectData.name,
label: projectData.label,
value: projectData.id,
};
getUploadElement();
}
if (buildType.value) operationsData.buildType = buildType;
if (buildType.value) operationsData.buildType = buildType.value;
};
const clearData = () => {
operationsData.porjectName = "";
@@ -370,17 +377,28 @@ export default defineComponent({
operationsData.fileList = [];
operationsData.uploadElement = [];
};
const changeProject = () => {
const changeProject = (rv) => {
let porjectData = operationsData.objectList.find(
(item) => item.id === rv
);
operationsData.projectData = {
value: porjectData?.id,
label: porjectData?.name,
}
getUploadElement();
};
const changeBuildType = () => {
// operationsData.exhibitionImgList = []
operationsData.projectData = null;
operationsData.projectData = {
label:'',
value:'',
};
props.cloudList.forEach((item) => {
if (item.value == operationsData.buildType) {
operationsData.credits = item.consumption;
}
});
getUploadElement();
getHistoryProjectList();
};
const getGenerateCloudImgList = (type) => {
@@ -399,7 +417,9 @@ export default defineComponent({
if (type == "POSE_TRANSFER") {
obj = {
poseId: 1,
elementId: item.id,
productImage: getMinioUrl(item.imgUrl),
elementType: item.type?item.type:"ProductElement",
};
} else {
obj = {
@@ -474,7 +494,8 @@ export default defineComponent({
return {
buildType: buildTypeCorresponding[operationsData.buildType],
nums: operationsData.numberOfImages,
projectId: operationsData.projectData,
sequence:operationsData.sequence,
projectId: operationsData.projectData?.value?operationsData.projectData?.value:'',
name: operationsData.porjectName || operationsData.placeholder,
//productimg
toProductImage: {
@@ -483,7 +504,7 @@ export default defineComponent({
operationsData.buildType
), //选择的图片
// toProductImageVOList:getPorductImg(),//选择的图片
projectId: operationsData.projectData,
projectId: operationsData.projectData?.value?operationsData.projectData?.value:'',
direction: operationsData.relightDirection, //打光方向
brightenValue: operationsData.brightenValue,
imageStrength: (100 - getImageStrength()) / 100,
@@ -498,8 +519,8 @@ export default defineComponent({
operationsData.buildType == "POSE_TRANSFER"
? getGenerateCloudImgList("POSE_TRANSFER")
: [],
private: operationsData.projectData,
ToProductImageDTO: operationsData.projectData,
private: operationsData.projectData?.value,
ToProductImageDTO: operationsData.projectData?.value,
};
};
let cancelDsign = () => {
@@ -523,13 +544,13 @@ export default defineComponent({
return message.warning("Please select or upload the picture first.");
// if(data.poseTransform.length == 0)return message.warning("You must first generate results in the 'To Product Image' module before you can use the 'Transfer Pose' cloud generation feature.")
}
if (operationsData.buildType == "DESIGN" && !operationsData.projectData)
if (operationsData.buildType == "DESIGN" && !operationsData.projectData?.value)
return message.warning("Please select a project");
if (
!data.buildType ||
!data.nums ||
!data.name ||
(operationsData.buildType == "DESIGN" && !operationsData.projectData)
(operationsData.buildType == "DESIGN" && !operationsData.projectData?.value)
)
return message.warning("Please check the input box marked with *");
operations.loadingShow = true;
@@ -539,7 +560,7 @@ export default defineComponent({
operations.loadingShow = false;
cancelDsign();
let porjectData = operationsData.objectList.find(
(item) => item.id === operationsData.projectData
(item) => item.id === operationsData.projectData?.value
);
let project = {
value: porjectData?.id,
@@ -625,9 +646,10 @@ export default defineComponent({
}
};
const setPlaceholder = () => {
if (!operationsData.projectData) return "";
if(operationsData.projectData?.label)return operationsData.projectData.label
if (!operationsData.projectData?.value) return "";
let index = operationsData.objectList.findIndex(
(item) => item.id === operationsData.projectData
(item) => item.id === operationsData.projectData?.value
);
return operationsData.objectList[index].name;
};

72
src/component/home/batchGeneration/index.vue
View File

@@ -55,14 +55,14 @@
<input type="text" v-model="renameText">
<i class="fi fi-br-check" @click="submitRename(row)"></i>
</div>
<div v-else style="white-space: nowrap;text-overflow: ellipsis;overflow: hidden;">
<div v-else :title="header?.fun?header.fun(row[header.value]) : row[header.value]" style="white-space: nowrap;text-overflow: ellipsis;overflow: hidden;width: 15rem;">
{{header?.fun?header.fun(row[header.value]) : row[header.value]}}
</div>
</div>
<span style="color: #007EE5; cursor: pointer; margin-right: 1rem;" v-show="header.value == 'operation'" @click="setRename(row)">
{{$t('batchGeneration.Rename')}}
</span>
<span style="color: #007EE5; cursor: pointer; margin-right: 1rem;" v-show="header.value == 'operation'" @click="detailIamge(row)">
<span style="color: #007EE5; cursor: pointer; margin-right: 1rem;" :style="{opacity:row.status == 1?1:.5}" v-show="header.value == 'operation'" @click="detailIamge(row)">
{{$t('batchGeneration.Review')}}
</span>
<span style="color: #007EE5; cursor: pointer;" v-show="header.value == 'operation'" @click="deleteRom(row)">
@@ -177,6 +177,10 @@ export default defineComponent({
// sketchDesign:[]
},
cloudTiltleList:[
{
name:computed(()=>t('batchGeneration.sequence')),
value:'sequence',
},
{
name:computed(()=>t('batchGeneration.TaskName')),
value:'name',
@@ -205,6 +209,7 @@ export default defineComponent({
},
{
name:computed(()=>t('batchGeneration.StartTime')),
value:'startTime',
fun:(value:any)=>{
//没开始内容为 -
if(!value)return
@@ -243,8 +248,21 @@ export default defineComponent({
const dataDom = reactive({
createCloud,
})
const getNextSequence = ()=>{
return new Promise((resolve, reject) => {
data.loadingShow = true
Https.axiosGet(Https.httpUrls.getNextSequence).then((rv)=>{
data.loadingShow = false
data.isGetContentList = false
resolve(rv)
}).catch(()=>{
data.loadingShow = false
resolve('')
})
})
}
const createClound = ()=>{
data.isGetContentList = false
let obj = {}
if(data.createData){
data.generateList.seriesDesign.forEach((item:any)=>{
@@ -253,8 +271,10 @@ export default defineComponent({
}
})
}
dataDom.createCloud.init(data.createData,obj)
console.log(obj)
getNextSequence().then((rv)=>{
dataDom.createCloud.init(data.createData,obj,rv)
})
}
const createData = ()=>{
store.commit("createProbject");
@@ -274,6 +294,17 @@ export default defineComponent({
buildType:item.buildType,
}
createData()
if(item.buildType == 'design'){
router.push(`/home?history=${item.projectId}&source=batch`)
}else if(item.buildType == 'toProductImage'){
router.push(`/home/tools?tools=toProduct&id=${item.projectId}&source=batch`)
}else if(item.buildType == 'relight'){
router.push(`/home/tools?tools=${item.buildType}&id=${item.projectId}&source=batch`)
}else if(item.buildType == 'poseTransfer'){
router.push(`/home/tools?tools=${item.buildType}&id=${item.projectId}&source=batch`)
}
data.isGetContentList = false
return
Https.axiosPost(Https.httpUrls.getDesignCloudResult,value).then((rv)=>{
if(item.buildType == 'design'){
store.commit('addDesignCollectionList',rv.design)
@@ -294,19 +325,6 @@ export default defineComponent({
// store.commit('setCloudList',{str:'poseTransfer',list:rv.poseTransfer})
router.push(`/home/tools?tools=${item.buildType}&id=${item.projectId}&source=batch`)
}
// if(rv.design && rv.design.length > 0){
// store.commit('addDesignCollectionList',rv.design)
// emit('retrieve','design')
// }else if(rv.toProductImage && rv.toProductImage.length > 0){
// store.commit('setCloudList',{str:'toProduct',list:rv.toProductImage})
// emit('retrieve','toProduct')
// }else if(rv.relight && rv.relight.length > 0){
// store.commit('setCloudList',{str:'relight',list:rv.relight})
// emit('retrieve','relight')
// }else if(rv.poseTransfer && rv.poseTransfer.length > 0){
// store.commit('setCloudList',{str:'poseTransfer',list:rv.poseTransfer})
// emit('retrieve','poseTransfer')
// }
data.isGetContentList = false
})
}
@@ -412,14 +430,22 @@ export default defineComponent({
onBeforeUnmount(()=>{
data.isGetContentList = false
})
onMounted(()=>{
data.isGetContentList = true
watch(()=>route.query.id,(newValue,oldValue)=>{
if(route.query?.id){
data.projectData = {
value:route.query?.id,
label:route.query?.name,
}
data.createData = {
label:route.query?.name,
id:route.query?.id,
process:route.query?.process
}
createClound()
}
},{immediate:true})
onMounted(()=>{
data.isGetContentList = true
getContentList()
// if(route.query?.type == 'creation')dataDom.createCloud.init(data.projectData)
})
@@ -510,7 +536,11 @@ export default defineComponent({
line-height: 4.6rem;
font-size: 2rem;
color: #666666;
width: calc(100% / 4);
// width: calc(100% / 4);
width: 20rem;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
text-align: center;
}
}

24
src/component/home/chat/index.vue
View File

@@ -3,7 +3,7 @@
<div class="top" :class="{active:!isChattingRecords}" @click="()=>{isChattingRecords=!isChattingRecords}">
<i class="fi fi-br-angle-small-down"></i>
</div>
<div v-show="!openChat" class="left" @click="()=>{openChat = !openChat;isChattingRecords=true}">
<div v-show="!openChat" class="left" @click="leftOpenChat('left')">
<i class="fi fi-br-angle-small-down"></i>
</div>
<div class="chatBox">
@@ -17,7 +17,7 @@
<div class="text" v-show="item.content.think || item.content.message || item.content.img || item.content.color">
<span class="content">
<div class="showThink" :class="{active:item.content?.isThink}" v-show="item.content.think" @click="()=>item.content?.isThink?(item.content.isThink = false):(item.content.isThink = true)">
<div>已深度思考</div>
<div>{{ $t('chat.DeepThinking') }}</div>
<i class="fi fi-br-angle-small-down"></i>
</div>
<div class="think" v-show="item.content?.isThink">{{item.content.think}}</div>
@@ -48,7 +48,7 @@
</div>
</div>
<div class="content" @click="openChattingRecords">
<textarea ref="textarea" @input="inputText($event)" @keydown.enter.prevent="sendChat" placeholder="Write your message"></textarea>
<textarea ref="textarea" @input="inputText($event)" @keydown.enter.prevent="sendChat" :placeholder="$t('chat.message')"></textarea>
<div class="btn">
<div class="uploadBox">
<div class="filList">
@@ -60,7 +60,7 @@
<i class="fi fi-rs-paperclip-vertical">
<input type="file" @change="handleFileUpload($event)">
</i>
<div class="enableThinking" :class="{active:enableThinking}" @click="()=>enableThinking = !enableThinking">Deep Thinking</div>
<div class="enableThinking" :class="{active:enableThinking}" @click="()=>enableThinking = !enableThinking">{{ $t('chat.DeepThinking') }}</div>
</div>
<div class="sendBox">
<div class="maxNum">{{ chatContent?.length }}/10000</div>
@@ -71,7 +71,7 @@
</div>
</div>
</div>
<div v-show="openChat" class="right" @click="()=>{openChat = !openChat;isChattingRecords=false}">
<div v-show="openChat" class="right" @click="leftOpenChat('right')">
<i class="fi fi-br-angle-small-down"></i>
</div>
</div>
@@ -97,7 +97,7 @@ export default defineComponent({
const route = useRoute()
const data = reactive({
chatContent:'',
openChat:false,
openChat:computed(()=>store.state.Workspace.openChat),
chatList:[
] as any,
isChattingRecords:false,
@@ -114,7 +114,7 @@ export default defineComponent({
watch(()=>data.selectObject.id,(newValue,oldValue)=>{
if(newValue && (data.selectObject.httpType == 'SERIES_DESIGN' || data.selectObject.httpType == 'SINGLE_DESIGN')){
data.chatList = []
if(route.query?.chatMode == 'true')data.openChat = true
if(route.query?.chatMode == 'true')store.commit('setOpenChatStatus',true)
if(route.query?.create)return
nextTick(()=>{
@@ -329,6 +329,15 @@ export default defineComponent({
})
}
const leftOpenChat = (str:string)=>{
if(str == 'left'){
data.isChattingRecords=true
store.commit('setOpenChatStatus',true)
}else{
data.isChattingRecords=false
store.commit('setOpenChatStatus',false)
}
}
return{
...toRefs(dataDom),
...toRefs(data),
@@ -338,6 +347,7 @@ export default defineComponent({
handleFileUpload,
deleteFile,
imgError,
leftOpenChat,
}
},
provide() {

13
src/component/home/design/collection.vue
View File

@@ -135,7 +135,7 @@ export default defineComponent({
value[str] = data[str]
if(!value[str] || value[str]?.length == 0)return
Https.axiosPost(Https.httpUrls.saveModuleContent, value).then((rv)=>{
if(rv.boundingBox)store.commit('setShowSketchboard',rv.boundingBox)
if(rv?.boundingBox)store.commit('setShowSketchboard',rv.boundingBox)
})
})
}
@@ -224,10 +224,15 @@ export default defineComponent({
</script>
<style lang="less" scoped>
.collectionModal{
:deep(.ant-modal-body){
padding-top: 10rem;
:deep(.collection){
> .ant-modal-content{
.ant-modal-body{
padding-top: 10rem;
}
}
}
.collection_title{
top: calc(4rem*1.2);
display: flex;

4
src/component/home/design/collection/ColorboardUpload.vue
View File

@@ -1341,7 +1341,7 @@ export default defineComponent({
border-radius: 50%;
width: 4rem;
height: 4rem;
border: solid 2px #39215b;
border: solid 2px #000;
display: flex;
align-items: center;
justify-content: center;
@@ -1359,7 +1359,7 @@ export default defineComponent({
width: 1rem;
height: 1rem;
border-radius: 50%;
background: #39215b;
background: #000;
}
}
}

7
src/component/home/design/collection/PrintboardUpload.vue
View File

@@ -148,11 +148,11 @@
<label @click="()=>{if(!item?.pin)item.pin = false;item.pin = !item.pin}">
<i v-if="item.pin" class="fi fi-rr-check"></i>
<i v-else class="fi noCheck"></i>
<span>PIN</span>
<span>{{ $t('PrintboardUpload.PIN') }}</span>
</label>
</div>
<div class="moreBox" @click.stop>
<more :moreList="['edit','down','enlargement','delete']" :item="item" :index="index" @deleteFile="deleteFile" @scaleImage="scaleImage"></more>
<more level1Type="Printboard" :moreList="['edit','down','enlargement','delete']" :item="item" :index="index" @deleteFile="deleteFile" @scaleImage="scaleImage"></more>
</div>
</div>
</div>
@@ -839,7 +839,8 @@ export default defineComponent({
}
}
.modal_layout{
padding-bottom: 4.8rem;
padding-bottom: 2.8rem;
// padding-bottom: 4.8rem;
.modal_img{
width: calc(40rem*1.2);
height: calc(5rem*1.2);

8
src/component/home/design/collection/SketchboardUpload.vue
View File

@@ -90,6 +90,7 @@
:data="{
...upload,
gender:workspace.sex,
ageGroup:workspace.ageGroup,
}"
:multiple="!driver__.driver"
:before-upload="beforeUpload"
@@ -168,11 +169,11 @@
<label @click="()=>{if(!item?.pin)item.pin = false;item.pin = !item.pin}">
<i v-if="item.pin" class="fi fi-rr-check"></i>
<i v-else class="fi noCheck"></i>
<span>PIN</span>
<span>{{ $t('PrintboardUpload.PIN') }}</span>
</label>
</div>
<div class="moreBox" @click.stop>
<more :moreList="['edit','down','enlargement','delete']" :item="item" :index="index" @deleteFile="deleteFile" @scaleImage="scaleImage"></more>
<more level1Type="Sketchboard" :moreList="['edit','down','enlargement','delete']" :item="item" :index="index" @deleteFile="deleteFile" @scaleImage="scaleImage"></more>
</div>
</div>
</div>
@@ -783,7 +784,8 @@ export default defineComponent({
}
}
.modal_layout{
padding-bottom: 4.8rem;
// padding-bottom: 4.8rem;
padding-bottom: 2.8rem;
.modal_img{
width: calc(40rem*1.2);
height: calc(5rem*1.2);

16
src/component/home/design/collection/more.vue
View File

@@ -20,6 +20,7 @@
</div>
</div>
</div>
<modalCanvas ref="modalCanvas" @setSloganData="saveBase64Img"></modalCanvas>
</template>
<script lang="ts">
import { defineComponent,computed,ref,provide,nextTick,createVNode,toRefs, reactive} from 'vue'
@@ -29,14 +30,17 @@ import { Https } from "@/tool/https";
import { useStore } from "vuex";
import { useI18n } from 'vue-i18n'
import { downloadIamge } from "@/tool/util";
import modalCanvas from "@/component/modules/generalModalCanvas.vue";
export default defineComponent({
components:{
modalCanvas,
},
props:{
moreList:{type:Array,default:()=>[]},
item:{type:Object,default:()=>{}},
index:{type:Number,default:0},
level1Type:{type:String,default:''},
},
emits:['deleteFile','scaleImage'],
setup(props,{emit}) {
@@ -46,6 +50,7 @@ export default defineComponent({
})
const dataDom = reactive({
modalCanvas:null as any
})
const openList = ()=>{
data.show = true
@@ -59,20 +64,25 @@ export default defineComponent({
if(str == 'delete'){
emit("deleteFile",props.item);
}else if(str == 'edit'){
emit("scaleImage",props.index);
console.log(props.item)
dataDom.modalCanvas.init(props.item,'')
}else if(str == 'down'){
console.log(props.item);
downloadIamge(props.item.url)
downloadIamge(props.item.url || props.item.imgUrl)
}else if(str == 'enlargement'){
emit("scaleImage",props.index);
}
setShow()
}
const saveBase64Img = (rv)=>{
console.log(rv)
}
return{
...toRefs(dataDom),
...toRefs(data),
openList,
setMore,
saveBase64Img,
}
},

664
src/component/home/design/editDesignType/index.vue
View File

@@ -1,6 +1,6 @@
<template>
<a-modal
class="scaleImage_modal generalModel"
class="editDesignType_modal generalModel"
v-model:visible="scaleImage"
:footer="null"
width="78%"
@@ -26,7 +26,7 @@
</div>
<div class="scaleImage_content" v-if="scaleImage">
<div class="productImg_modal">
<div class="productImg_left">
<div class="productImg_left generalModel_state">
<div class="productImg_content_item_title productImg_content_item_title_menu">
<span v-if="scaleImageList[scaleImageIndex]?.resultType == 'ToProductImage'">{{$t('ProductImg.MagicTools')}}</span>
<span v-if="scaleImageList[scaleImageIndex]?.resultType == 'Relight'">{{$t('ProductImg.relightingTool')}}</span>
@@ -34,27 +34,28 @@
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.SelectionFunction')}}</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 v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight'" class="productImg_content_item_Direction generalModel_state_item" style="margin-bottom: 1rem;">
<a-select size="large" 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">
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'ToProductImage' && speedData.value != 'flux'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.Similarity')}}</span>
</div>
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'ToProductImage'" class="productImg_content_item_similarity ">
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'ToProductImage' && speedData.value != 'flux'" class="productImg_content_item_similarity ">
<a-slider class="system_silder"
v-model:value="productimgSimilarity"
:tooltipVisible="false"
:step="5"
:max="70"
@afterChange="()=>{}"
>
</a-slider>
<input type="number" readonly v-model="productimgSimilarity">
<input style="margin-left: 2rem;" type="number" readonly v-model="productimgSimilarity">
</div>
<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' && speedData.value != 'flux'" class="productImg_content_item_Direction">
<a-select style="width: 100%;" v-model:value="productimgRelightDirection" :options="productimgRelightDirectionList"></a-select>
<div v-show="scaleImageList[scaleImageIndex]?.resultType == 'Relight' && speedData.value != 'flux'" class="productImg_content_item_Direction generalModel_state_item">
<a-select size="large" style="width: 100%;" v-model:value="productimgRelightDirection" :options="productimgRelightDirectionList"></a-select>
</div>
<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>
@@ -68,31 +69,37 @@
:step="0.1"
>
</a-slider>
<input type="number" readonly v-model="productimgBrightenValue">
<input style="margin-left: 2rem;" type="number" readonly v-model="productimgBrightenValue">
</div>
<div class="input_border productImg_content_item_generate" v-show="scaleImageList[scaleImageIndex]?.resultType != 'PoseTransfer'">
<div class="input_box">
<div class="input_box_btnBox">
<input
<div class="input_box_btnBox" style="height: auto;">
<!-- <input
class="search_input"
:placeholder="$t('Generate.inputContent1')"
v-model="productimgSearchName"
@keydown.enter="getPrductimg()"
/>
<i v-show="!productimgIsTextarea" class="fi fi-br-expand" @click.stop="()=>productimgIsTextarea = !productimgIsTextarea"></i>
<i v-show="productimgIsTextarea" class="fi fi-bs-compress" @click.stop="()=>productimgIsTextarea = !productimgIsTextarea"></i>
<i v-show="productimgIsTextarea" class="fi fi-bs-compress" @click.stop="()=>productimgIsTextarea = !productimgIsTextarea"></i> -->
<textarea
ref="textarea"
class="textarea "
:placeholder="$t('Generate.inputContent1')"
@input="ifMaximumLength"
@keydown.enter="getPrductimg()"
v-model="productimgSearchName"
></textarea>
</div>
<textarea
v-show="productimgIsTextarea"
class="search_textarea "
@keydown.enter="getPrductimg()"
v-model="productimgSearchName"
></textarea>
</div>
</div>
<div class="selectText" v-show="scaleImageList[scaleImageIndex]?.resultType == 'ToProductImage' && speedData.value == 'flux'">
<div :title="$t('poseTransfer.hint')" @click="()=>{productimgSearchName = $t('poseTransfer.hint');ifMaximumLength()}">{{ $t('poseTransfer.hint') }}</div>
</div>
<div class="transferPose" v-show="scaleImageList[scaleImageIndex]?.resultType == 'PoseTransfer'">
<div class="head">
<div class="text">Choose pose</div>
<div class="text">{{$t('poseTransfer.Selectpose')}}</div>
</div>
<div class="imgBox" v-mousewheel>
<div class="item" v-for="item,index in poseList" @click="setSelectPose(item,index)">
@@ -110,29 +117,29 @@
</div>
</div>
<div class="generage_btn_box" style="margin-left: auto;">
<div class="generage_btn started_btn" v-show="!generateSuccess.productimgIsProductimg">
<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.stop="setSpeed(item)" :title="item.title">{{ item.label }}</div>
</div>
</div>
<div class="generage_btn started_btn" v-show="generateSuccess.productimgIsProductimg && !generateSuccess.productimgRemProductimg">
<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="generateSuccess.productimgRemProductimg" @click="removeProductimg">
<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="!generateSuccess.productimgIsProductimg" class="generage_btn started_btn" @click.stop="getPrductimg">
<div v-show="!productimgIsProductimg" class="generage_btn started_btn" @click.stop="getPrductimg">
{{ $t('Generate.Generate') }}
</div>
<div v-show="generateSuccess.productimgIsProductimg && !generateSuccess.productimgRemProductimg" class="generage_btn started_btn" @click="getPrductimg">
<div v-show="productimgIsProductimg && !productimgRemProductimg" class="generage_btn started_btn" @click="getPrductimg">
<i class="fi fi-br-loading"></i>
</div>
<div v-show="generateSuccess.productimgRemProductimg" @click="removeProductimg" class="generage_btn started_btn">
<div v-show="productimgRemProductimg" @click="removeProductimg" class="generage_btn started_btn">
{{$t('Generate.Close')}}
</div>
</div>
@@ -140,27 +147,26 @@
</div>
</div>
<div class="scaleImage_content_imgBox" :class="{active:isComparison}">
<img v-if="isComparison" :src="scaleImageList[scaleImageIndex]?.sourceUrl || generateSuccess?.productImage">
<div class="loadBox" v-show="generateSuccess">
<div class="load" v-show="generateSuccess.productimgIsProductimg">
<img v-if="isComparison" :src="selectGenerate?.sourceUrl || selectGenerate?.productImage">
<div class="loadBox" v-show="selectGenerate">
<div class="load" v-show="productimgIsProductimg">
<a-spin size="large" class="content_img_flex"></a-spin>
</div>
<div class="imgBox" v-show="!generateSuccess.productimgIsProductimg">
<img v-show="scaleImageList[scaleImageIndex]?.resultType !='PoseTransfer'" :src="generateSuccess?.newData?.designOutfitUrl || generateSuccess?.designOutfitUrl || generateSuccess?.url" alt="">
<div class="imgBox" v-show="!productimgIsProductimg">
<img v-show="selectGenerate?.resultType !='PoseTransfer'" :src="generateCourse?.url || selectGenerate?.url" alt="">
<img
v-show="scaleImageList[scaleImageIndex]?.resultType == 'PoseTransfer'"
:src="generateSuccess.newData?.firstFrameUrl || generateSuccess.firstFrameUrl"
v-show="selectGenerate?.resultType == 'PoseTransfer'"
:src="generateCourse?.firstFrameUrl || selectGenerate?.firstFrameUrl"
alt=""
@mouseenter.stop="gifPlay($event,generateSuccess.newData || generateSuccess)"
@mouseleave.stop="gifPause($event,generateSuccess.newData || generateSuccess)"
@mouseenter.stop="gifPlay($event,generateCourse || selectGenerate)"
@mouseleave.stop="gifPause($event,generateCourse || selectGenerate)"
>
</div>
</div>
<div class="img_operate_block" v-if="isLike">
<!-- <div class="img_operate_block" v-if="isLike">
<i v-if="!scaleImageList[scaleImageIndex]?.like" class="fi fi-rr-heart operate_icon" @click.stop="LikeFile(scaleImageList[scaleImageIndex],'like')"></i>
<i v-else class="fi fi-sr-heart operate_icon" :adminLike="!!scaleImageList[scaleImageIndex]?.like" @click.stop="LikeFile(scaleImageList[scaleImageIndex],'noLike')"></i>
</div>
</div> -->
</div>
</div>
<!-- <div class="scaleImage_nav">
@@ -214,7 +220,7 @@ props:{
default:''
},
},
emits:['addGenerateImg','setGenerateAwait'],
emits:['addGenerateImg','upDataDesignLikeList'],
setup(props:any,{emit}) {
const store = useStore();
let userDetail:any= computed(()=>{
@@ -224,6 +230,7 @@ setup(props:any,{emit}) {
let productimg = reactive({
isGenerate:false,//判断是否进行generate
UpgradePlan:null,
textarea:null as any,
productimgSearchName:'',
productimgIsTextarea:false,
productimgRemProductimg:false,
@@ -234,9 +241,16 @@ setup(props:any,{emit}) {
productimgRelightDirection:props.productData.RelightDirection,
productimgRelightDirectionList:props.productData.RelightDirectionList,
selectObject:computed(()=>store.state.Workspace.probjects),//选择的项目
generateSuccess:null as any,//生成成功后返回的数据
likeDesignCollectionList:computed(() => {
return store.state.HomeStoreModule.likeDesignCollectionList;
}),
selectGenerate:null as any,//生成成功后返回的数据
poseList:[],
selectPose:null as any,
openType:'',
scaleImageIndex: 0,
scaleImageList:[],
generateCourse:null as any,
})
let speed = reactive({
speedList:[
@@ -289,37 +303,39 @@ setup(props:any,{emit}) {
speed.speedState = false
}
let scaleImage: any = ref(false);
let isShowMark = ref(false)
let loadingShow = ref(false)
let isComparison = ref(false)
const visible = ref<boolean>(false);
const setVisible = (value:any): void => {
visible.value = value;
};
let scaleImageList:any = ref([
])
let scaleImageMask:any = ref(false)
let scaleImageIndex:any = ref(0)
let isLike:any = ref(true)
let robotAssits:any = ref(0)
//procuctimg
let remPrductimgTime:any = null
let prductimgTime:any = null
const getData = ()=>{
let obj = null as any
if(scaleImageList.value[scaleImageIndex.value]?.resultType == 'ToProductImage'){
console.log(productimg.scaleImageList[productimg.scaleImageIndex])
if(productimg.scaleImageList[productimg.scaleImageIndex]?.resultType == 'ToProductImage'){
obj = {
elementId:scaleImageList.value[scaleImageIndex.value].designOutfitId||scaleImageList.value[scaleImageIndex.value].elementId,
elementId:productimg.scaleImageList[productimg.scaleImageIndex].designOutfitId||productimg.scaleImageList[productimg.scaleImageIndex].elementId,
elementType:'DesignOutfit',
parentId:productimg.selectGenerate.parentId || productimg.selectGenerate.userLikeSortId,
userLikeSortId:productimg.openType == 'add'?(productimg.selectGenerate.userLikeSortId || null):null,
}
}else if(scaleImageList.value[scaleImageIndex.value]?.resultType == 'Relight'){
obj = {
elementId:scaleImageList.value[scaleImageIndex.value].designItemId || scaleImageList.value[scaleImageIndex.value].id,
elementType:'ToProductImage',
if(productimg.scaleImageList[productimg.scaleImageIndex]?.relationType == "Design"){
delete obj.userLikeSortId
}
}else if(scaleImageList.value[scaleImageIndex.value]?.resultType == 'PoseTransfer'){
}else if(productimg.scaleImageList[productimg.scaleImageIndex]?.resultType == 'Relight'){
obj = {
elementId:productimg.scaleImageList[productimg.scaleImageIndex].designItemId || productimg.scaleImageList[productimg.scaleImageIndex].id || productimg.scaleImageList[productimg.scaleImageIndex],
elementType:'ToProductImage',
parentId:productimg.selectGenerate.parentId || productimg.selectGenerate.userLikeSortId,
userLikeSortId:productimg.openType == 'add'?(productimg.selectGenerate.userLikeSortId || null):null,
}
}else if(productimg.scaleImageList[productimg.scaleImageIndex]?.resultType == 'PoseTransfer'){
}
return obj
@@ -328,11 +344,15 @@ setup(props:any,{emit}) {
return {
poseId:productimg.selectPose,
projectId:productimg.selectObject.id,
productImage:getMinioUrl(scaleImageList.value[scaleImageIndex.value].sourceUrl),
productImage:getMinioUrl(productimg.scaleImageList[productimg.scaleImageIndex].sourceUrl),
modelName:speed.speedData.value,
parentId:productimg.selectGenerate.parentId || productimg.selectGenerate.userLikeSortId,
userLikeSortId:productimg.openType == 'add'?(productimg.selectGenerate.userLikeSortId || null):null,
isDefaultLike:true,//表示是否生成就like
}
}
let getPrductimg = ()=>{
let getPrductimg = async ()=>{
let obj = getData()
let imageStrength = productimg.productimgSimilarity == 100? 95 :productimg.productimgSimilarity
let data:any ={
@@ -343,44 +363,72 @@ setup(props:any,{emit}) {
brightenValue:productimg.productimgBrightenValue,
projectId:productimg.selectObject.id,
imageStrength:(100 - imageStrength)/100,
ageGroup:productimg.selectObject.ageGroup
ageGroup:productimg.selectObject.ageGroup,
isDefaultLike:true,//表示是否生成就like
}
// return
productimg.generateSuccess.productimgIsProductimg = true
// productimg.generateSuccess.remPrductimgTime = setTimeout(()=>{
// productimg.generateSuccess.productimgRemProductimg = true
// remPrductimgTime = setTimeout(()=>{
// productimg.productimgRemProductimg = true
// },10000)
let url = Https.httpUrls.relight
if(scaleImageList.value[scaleImageIndex.value]?.resultType == 'ToProductImage'){
if(productimg.scaleImageList[productimg.scaleImageIndex]?.resultType == 'ToProductImage'){
url = Https.httpUrls.toProduct
}else if(scaleImageList.value[scaleImageIndex.value]?.resultType == 'PoseTransfer'){
}else if(productimg.scaleImageList[productimg.scaleImageIndex]?.resultType == 'PoseTransfer'){
url = Https.httpUrls.poseTransform
await new Promise((res,reject)=>{
Modal.confirm({
title: t('poseTransfer.jsContent1'),
icon: createVNode(ExclamationCircleOutlined),
okText: 'Yes',
cancelText: 'No',
mask:false,
centered:true,
onOk() {
res('')
},
cancel(){
reject()
}
});
}).then(()=>{
}).catch(()=>{
return
})
data = getPoseTransformData()
}
productimg.productimgIsProductimg = true
// setPrductimg([{taskId:"f785fbbf-425c-4d9b-b4d0-0f38f480c64e-83"}])
// return
productimg.generateSuccess.isShowMark = true
Https.axiosPost(url, data).then(
(rv) => {
productimg.generateSuccess.productimgRemProductimg = true
productimg.generateSuccess.isShowMark = false
scaleImageList.value[scaleImageIndex.value].imgUrl = '/image/loading.gif'
productimg.productimgRemProductimg = true
productimg.scaleImageList[productimg.scaleImageIndex].imgUrl = '/image/loading.gif'
let arr:any = []
if(scaleImageList.value[scaleImageIndex.value]?.resultType != 'PoseTransfer'){
if(productimg.scaleImageList[productimg.scaleImageIndex]?.resultType == 'PoseTransfer'){
arr.push(rv.taskId)
}else{
rv.forEach((item:any)=>{
arr.push(item.taskId)
})
}else{
arr.push(rv)
}
productimg.generateCourse = {
...rv[0],
parentId:productimg.selectGenerate?.parentId || productimg.selectGenerate.userLikeGroupId,
sourceUrl:productimg.selectGenerate?.sourceUrl || productimg.selectGenerate?.productImage,
status:null,
resultType:productimg.selectGenerate?.resultType,
}
setPrductimg(arr)
productimg.isGenerate = true
}
).catch(res=>{
productimg.generateSuccess.isShowMark = false
productimg.generateSuccess.productimgIsProductimg = false
clearInterval(productimg.generateSuccess.remPrductimgTime)
productimg.generateSuccess.productimgRemProductimg = false
productimg.productimgIsProductimg = false
clearInterval(remPrductimgTime)
productimg.productimgRemProductimg = false
if(res.errCode === 2){
Modal.confirm({
title: res.errMsg,
@@ -408,92 +456,63 @@ setup(props:any,{emit}) {
let dataNum = dataList.length
let state = true
let url = Https.httpUrls.relightResult
if(scaleImageList.value[scaleImageIndex.value]?.resultType == 'ToProductImage'){
if(productimg.scaleImageList[productimg.scaleImageIndex]?.resultType == 'ToProductImage'){
url = Https.httpUrls.toProductImageResult
}else if(scaleImageList.value[scaleImageIndex.value]?.resultType == 'PoseTransfer'){
}else if(productimg.scaleImageList[productimg.scaleImageIndex]?.resultType == 'PoseTransfer'){
url = Https.httpUrls.poseTransformResult
data = {
taskId:dataList[0],
}
data = dataList
}
// url = Https.httpUrls.poseTransformResult
// data = {taskId: "00169296-220e-4032-bfce-ca8ff67d6468-83"}
productimg.generateSuccess.prductimgTime = setInterval(()=>{
prductimgTime = setInterval(()=>{
if(!state)return
state = false
Https.axiosPost(url, data).then(
(rv) => {
if(scaleImageList.value[scaleImageIndex.value]?.resultType == 'PoseTransfer'){
rv = [rv]
}
state = true
if(productimg.generateSuccess.productimgIsProductimg){//防止取消后有正在执行的获取状态
// generateProceedList = rv.filter((item:any)=>item.status != 'Success' && item.status != 'Fail' && item.status != 'Invalid')
if(productimg.productimgIsProductimg){//防止取消后有正在执行的获取状态
let isEnd = false
if(rv[0].status == 'Success'){
// let id = productimg.generateSuccess?.designItemId || rv[0].id
// rv[0].id = id
// let listType = productimg.generateSuccess.listType
rv[0].sourceUrl = productimg.generateSuccess.sourceUrl
rv[0].designOutfitUrl = rv[0].url
productimg.generateSuccess.newData = rv[0]
console.log(productimg.generateSuccess.newData)
if(!scaleImage.value){
productimg.generateSuccess.status = 'add'
setCove()
}
// productimg.generateSuccess.listType = listType
productimg.generateCourse.url = rv[0].url
productimg.generateCourse.designOutfitUrl = rv[0].url
isEnd = true
clearInterval(productimg.generateSuccess.remPrductimgTime)
clearInterval(remPrductimgTime)
}else if(rv[0].status == 'Fail'){
message.info(t('ProductImg.jsContent3'))
isEnd = true
productimg.generateCourse = null
}
generateProceedList = data
if(!scaleImage.value){
let awaitData = {awaitId:productimg.generateSuccess.awaitId,parentId:productimg.generateSuccess.parentId,listType:productimg.generateSuccess.listType,taskId:generateProceedList[0]}
emit('setGenerateAwait',awaitData)
}
if(isEnd){
store.state.store.dispatch('getCredits')
clearInterval(productimg.generateSuccess.prductimgTime)
clearInterval(productimg.generateSuccess.remPrductimgTime)
productimg.generateSuccess.productimgRemProductimg = false
productimg.generateSuccess.productimgIsProductimg = false
delete productimg.generateSuccess.productimgIsProductimg
delete productimg.generateSuccess.productimgRemProductimg
delete productimg.generateSuccess.remPrductimgTime
delete productimg.generateSuccess.prductimgTime
clearInterval(prductimgTime)
clearInterval(remPrductimgTime)
productimg.productimgRemProductimg = false
productimg.productimgIsProductimg = false
}
}
}
).catch(res=>{
clearInterval(productimg.generateSuccess.prductimgTime)
clearInterval(productimg.generateSuccess.remPrductimgTime)
productimg.generateSuccess.productimgIsProductimg = false
productimg.generateSuccess.productimgRemProductimg= false
delete productimg.generateSuccess.productimgIsProductimg
delete productimg.generateSuccess.productimgRemProductimg
delete productimg.generateSuccess.remPrductimgTime
delete productimg.generateSuccess.prductimgTime
clearInterval(prductimgTime)
clearInterval(remPrductimgTime)
productimg.productimgIsProductimg = false
productimg.productimgRemProductimg= false
});
},scaleImageList.value[scaleImageIndex.value]?.resultType == 'PoseTransfer'?20000:1000)
},productimg.scaleImageList[productimg.scaleImageIndex]?.resultType == 'PoseTransfer'?20000:1000)
}
let removeProductimg = ()=>{
productimg.generateSuccess.productimgIsProductimg = false
productimg.generateSuccess.productimgRemProductimg= false
clearInterval(productimg.generateSuccess.prductimgTime)
delete productimg.generateSuccess.productimgIsProductimg
delete productimg.generateSuccess.productimgRemProductimg
delete productimg.generateSuccess.prductimgTime
productimg.productimgIsProductimg = false
productimg.productimgRemProductimg= false
clearInterval(prductimgTime)
productimg.generateCourse = null
if(generateProceedList){
// let str = generateProceedList.length > 1?generateProceedList.join(',')
let data = {
uniqueId:generateProceedList,
userId:userDetail.value.userId,
type:scaleImageList.value[scaleImageIndex.value]?.resultType
type:productimg.scaleImageList[productimg.scaleImageIndex]?.resultType
}
if(scaleImageList.value[scaleImageIndex.value]?.resultType == 'PoseTransfer'){
if(productimg.scaleImageList[productimg.scaleImageIndex]?.resultType == 'PoseTransfer'){
// data = {
// uniqueId:data.waitList,
// userId:store.state.UserHabit.userDetail.userId,
@@ -509,23 +528,52 @@ setup(props:any,{emit}) {
});
}
}
let setCove = ()=>{
let data = {
...JSON.parse(JSON.stringify(productimg.generateSuccess.newData)),
sourceUrl:productimg.generateSuccess.newData.sourceUrl || scaleImageList.value[scaleImageIndex.value].sourceUrl,
oldId:productimg.generateSuccess.id,
awaitId:productimg.generateSuccess.awaitId,
status:productimg.generateSuccess.status,
listType:productimg.generateSuccess.listType,
isIndex:productimg.generateSuccess.isIndex,
userLikeSortId:productimg.generateSuccess.userLikeSortId,
parentId:productimg.generateSuccess.parentId
let init = async (list:any,index:any,dialogueIndex:any,status:any,listType:string)=>{
scaleImage.value = true
productimg.openType = status
if(status == 'add'){
productimg.selectGenerate = {
...list[index],
listType,
}
// productimgRemProductimg:false,
// productimgIsProductimg:false,
delete productimg.selectGenerate.url
}else{
productimg.selectGenerate = {
...list[index],
}
productimg.selectGenerate.listType = listType
productimg.selectGenerate.isIndex = index
if(!list[index]?.id &&( (list[index].resultType == 'PoseTransfer' && !list[index].gifUrl) || (list[index].resultType == 'PoseTransfer' && !list[index].url))){
productimg.productimgIsProductimg = true
productimg.productimgRemProductimg = true
setPrductimg([list[index].taskId])
}
}
productimg.selectGenerate.parentId = list[index].parentId || list[index].userLikeSortId
if(productimg.productimgSearchName){
await nextTick()
ifMaximumLength()
}
emit('addGenerateImg',data)
delete productimg.generateSuccess.isShowMark
delete productimg.generateSuccess.listType
if(productimg.poseList.length == 0 && list[index].resultType == 'PoseTransfer'){
getPoseList()
}
productimg.isGenerate = false
productimg.scaleImageList = list
if(productimg.scaleImageList[index].resultType == "PoseTransfer"){
speed.speedList = speed.speedTypeList.poseTransfer
}
if(productimg.scaleImageList[index].resultType == "Relight"){
speed.speedList = [speed.speedTypeList.toPorductImg[0],speed.speedTypeList.toPorductImg[1]]
}else if(productimg.scaleImageList[index].resultType != "PoseTransfer"){
speed.speedList = [speed.speedTypeList.toPorductImg[0],speed.speedTypeList.toPorductImg[1]]
}
speed.speedData = JSON.parse(JSON.stringify(speed.speedList[0]))
productimg.scaleImageIndex = index
if(dialogueIndex)robotAssits.value = dialogueIndex
}
const getPoseList = ()=>{
Https.axiosGet(Https.httpUrls.getAllPose).then((rv)=>{
@@ -547,6 +595,68 @@ setup(props:any,{emit}) {
productimg.poseList[index].isChecked = true
productimg.selectPose = item.id
}
const cancelDsign = async ()=>{
if(productimg.isGenerate){
if(productimg.productimgIsProductimg){
clearInterval(prductimgTime)
clearInterval(remPrductimgTime)
productimg.productimgRemProductimg = false
productimg.productimgIsProductimg = false
}
productimg.generateCourse.oldData = {
// id:productimg.selectGenerate.id,
}
if(productimg.selectGenerate.resultType == "Design"){
productimg.generateCourse.oldData.resultType = productimg.selectGenerate.resultType
// productimg.generateCourse.parentId = productimg.selectGenerate.userLikeSortId
// let index = productimg.likeDesignCollectionList.findIndex((item:any)=>(item.userLikeSortId == productimg.selectGenerate.userLikeSortId && item.resultType == "Design"))
// if(!productimg.likeDesignCollectionList[index]?.childList)productimg.likeDesignCollectionList[index].childList = []
// if(productimg.openType == 'add')productimg.likeDesignCollectionList[index]?.childList.push(productimg.generateCourse)
}else{
// productimg.generateCourse.parentId = productimg.selectGenerate.parentId
// let index = productimg.likeDesignCollectionList.findIndex((item:any)=>(item.userLikeSortId == productimg.selectGenerate.parentId && item.resultType == "Design"))
// if(!productimg.likeDesignCollectionList[index]?.childList){
// productimg.likeDesignCollectionList[index].childList = []
// }
// if(productimg.openType == 'add'){
// productimg.likeDesignCollectionList[index]?.childList.push(productimg.generateCourse)
// }else{
// let childIndex = productimg.likeDesignCollectionList[index].childList.findIndex((item:any)=>(item.id == productimg.selectGenerate.id))
// productimg.likeDesignCollectionList[index].childList[childIndex] = productimg.generateCourse
// }
}
let emitData = {
status:productimg.openType,
generateCourse:[{
...productimg.generateCourse,
}]
}
emit('upDataDesignLikeList',emitData)
}
productimg.openType = ''
scaleImage.value = false
}
const ifMaximumLength = async ()=>{
await nextTick()
let textarea = productimg.textarea;
const scrollTop = textarea.scrollTop;
// 2. 计算单行高度
const lineHeight = parseInt(getComputedStyle(textarea).lineHeight) || 20; // 默认20px
// 3. 重置高度为1行
textarea.style.height = lineHeight + 'px';
// 4. 计算实际需要的高度
const newHeight = Math.max(lineHeight, textarea.scrollHeight);
textarea.style.height = newHeight + 'px';
textarea.scrollTop = scrollTop;
}
onBeforeUnmount(()=>{
clearInterval(prductimgTime)
clearInterval(remPrductimgTime)
productimg.productimgIsProductimg = false
productimg.productimgRemProductimg= false
})
return {
t,
...toRefs(productimg),
@@ -554,24 +664,25 @@ setup(props:any,{emit}) {
openSpeed,
setSpeed,
scaleImage,
isShowMark,
loadingShow,
isComparison,
visible,
setVisible,
scaleImageList,
scaleImageMask,
scaleImageIndex,
isLike,
robotAssits,
getPrductimg,
removeProductimg,
setCove,
getPoseList,
gifPlay,
gifPause,
setSelectPose,
generateProceedList,
init,
cancelDsign,
prductimgTime,
remPrductimgTime,
ifMaximumLength,
};
},
data() {
@@ -598,162 +709,17 @@ directives:{
mounted() {
},
methods: {
init(list:any,index:any,dialogueIndex:any,status:any,listType:string){
if(status == 'add'){
this.generateSuccess = {
listType,
}
}else{
this.generateSuccess = list[index]
this.generateSuccess.listType = listType
this.generateSuccess.isIndex = index
}
// this.
this.generateSuccess.awaitId = list[index].id
this.generateSuccess.userLikeSortId = list[index].userLikeSortId
this.generateSuccess.parentId = list[index].parentId || list[index].userLikeSortId
this.generateSuccess.productimgIsProductimg = !!this.generateSuccess.productimgIsProductimg
this.generateSuccess.productimgRemProductimg = !!this.generateSuccess.productimgRemProductimg
this.generateSuccess.isShowMark = !!this.generateSuccess.isShowMark
this.generateSuccess.remPrductimgTime = this.generateSuccess.remPrductimgTime?this.generateSuccess.remPrductimgTime:null
this.generateSuccess.prductimgTime = this.generateSuccess.prductimgTime?this.generateSuccess.prductimgTime:null
this.scaleImage = true
if(this.poseList.length == 0 && list[index].resultType == 'PoseTransfer'){
this.getPoseList()
}
// if(status == 'edit'){
// this.generateSuccess = {
// ...list[index],
// id:list[index].designItemId || list[index].id,
// oldId:list[index].designItemId || list[index].id,
// url:list[index].designOutfitUrl || list[index].url,
// designItemId:list[index].designOutfitId,
// listType,
// }
// if(list[index].imageStrength)this.productimgSimilarity = 100 - list[index].imageStrength * 100
// if(list[index].imageStrength)list[index].brightenValue
// if(list[index].imageStrength)list[index].direction
// }else{
// this.generateSuccess = {
// listType,
// }
// }
this.scaleImage = true
this.isGenerate = false
this.scaleImageList = list
if(this.scaleImageList[index].resultType == "PoseTransfer"){
this.speedList = this.speedTypeList.poseTransfer
}else{
this.speedList = this.speedTypeList.toPorductImg
}
if(this.scaleImageList[index].resultType == "Relight"){
this.speedData = JSON.parse(JSON.stringify(this.speedList[1]))
}else{
this.speedData = JSON.parse(JSON.stringify(this.speedList[0]))
}
// if(this.scaleImageList[index]?.resultType == 'ToProductImage')this.scaleImageList[index].sourceUrl = this.scaleImageList[index].imgUrl
this.scaleImageIndex = index
if(dialogueIndex)this.robotAssits = dialogueIndex
// let scaleImageList = this.store.state.UploadFilesModule.moodboard
document.addEventListener('keydown',this.setKeydown)
},
async cancelDsign(){
document.removeEventListener('keydown',this.setKeydown)
if(this.generateSuccess.productimgIsProductimg){
let awaitData = {awaitId:this.generateSuccess.awaitId,parentId:this.generateSuccess.parentId,listType:this.generateSuccess.listType,taskId:this.generateProceedList[0]}
this.$emit('setGenerateAwait',awaitData)
}
// let data = {
// ...JSON.parse(JSON.stringify(this.generateSuccess)),
// }
// let isIndex = -1
// if(data?.oldId){
// this.scaleImageList.forEach((rv:any,index:number)=>{
// if(rv.designItemId == data?.oldId || rv.id == data?.oldId){
// isIndex = index
// }
// })
// }
// data.isIndex = isIndex
if(this.isGenerate && this.generateSuccess.id){
await new Promise((resolve,reject)=>{
let this_ = this
Modal.confirm({
title: this.t('scaleImage.cover'),
icon: createVNode(ExclamationCircleOutlined),
okText: 'Yes',
cancelText: 'No',
mask:false,
centered:true,
onOk() {
// this_.$emit('addGenerateImg',data)
//另存为操作
this_.generateSuccess.status = 'add'
if(this_.generateSuccess?.newData){
this_.setCove()
}
resolve('')
},
onCancel(){
//覆盖操作
this_.generateSuccess.status = 'cove'
if(this_.generateSuccess?.newData){
this_.setCove()
}
// if(!this_.generateSuccess?.newData?.id){
// this_.setCove()
// }else{
// }
resolve('')
}
});
})
}else{
this.generateSuccess.status = 'add'
if(this.generateSuccess?.newData){
this.setCove()
}
}
this.scaleImage = false
// this.scaleImageIndex = 0
this.isNext = false
// this.generateSuccess = null
// this.scaleImageList = []
},
lastStep(){
if(this.generateSuccess.productimgIsProductimg) return
if(this.isNext)return
let num = this.scaleImageIndex
if(this.scaleImageIndex <= 0){
}else{
num -=1
this.setImageIndex(num)
}
},
nextStep(){
if(this.generateSuccess.productimgIsProductimg) return
if(this.isNext)return
let num = this.scaleImageIndex
if(this.scaleImageIndex >= this.scaleImageList.length-1){
}else{
num += 1
this.setImageIndex(num)
}
},
download(){
let url
if(this.generateSuccess?.resultType == 'PoseTransfer' || this.generateSuccess?.newData?.resultType == 'PoseTransfer'){
url = this.generateSuccess?.videoUrl
if(this.generateSuccess?.newData?.videoUrl){
url = this.generateSuccess.newData.videoUrl
if(this.selectGenerate?.resultType == 'PoseTransfer' || this.generateCourse?.resultType == 'PoseTransfer'){
url = this.selectGenerate?.videoUrl
if(this.generateCourse?.videoUrl){
url = this.generateCourse.videoUrl
}
downloadVideoWithFetch(url)
}else{
url = this.generateSuccess?.newData?.designOutfitUrl || this.generateSuccess?.designOutfitUrl || this.generateSuccess?.url
url = this.generateCourse?.url || this.selectGenerate?.designOutfitUrl || this.selectGenerate?.url
downloadIamge(url)
}
},
@@ -797,51 +763,43 @@ methods: {
parent.likeFile(item,str)
}
},
setKeydown(event:any){
if(event.keyCode == 37){
this.lastStep()
}else if(event.keyCode == 39){
this.nextStep()
}
},
},
});
</script>
<style>
.scaleImage_modal{
.editDesignType_modal{
overflow: visible !important;
}
</style>
<style lang="less">
.scaleImage_modal {
<style lang="less" >
.editDesignType_modal {
.ant-modal-body {
display: flex;
flex-direction: column;
}
.productImg_content_item_title{
font-weight: 600;
font-size: 1.6rem;
&.productImg_content_item_title_menu{
margin-bottom: 6rem;
}
}
.scaleImage_content{
display: flex;
justify-content: center;
// margin-top: calc(5rem*1.2);
// height: 75%;
height: 100%;
position: relative;
width: 100%;
.productImg_modal{
position: relative;
left: 0;
z-index: 9;
flex: 1;
overflow: hidden;
.productImg_left{
width: 24rem;
display: flex;
height: 100%;
flex-direction: column;
width: 100%;
align-items: stretch;
flex-wrap: nowrap;
.input_box_btnBox{
width: 100%;
}
@@ -856,6 +814,79 @@ overflow: visible !important;
justify-content: space-around;
margin-top: 0;
}
.productImg_content_item_title{
font-weight: 600;
font-size: 1.6rem;
margin-bottom: 1rem;
&.productImg_content_item_title_menu{
margin-bottom: 6rem;
:deep(.generalMenu_printModel){
margin: 0;
width: 100%;
> div,> ul{
width: 100%;
}
}
.productImg_content_item_title_menubtn{
font-size: 1.6rem;
font-weight: 500;
}
}
&.productImg_content_item_title_similarity{
// margin-bottom: 8rem;
}
}
.productImg_content_item_Direction{
padding-bottom: 1rem;
margin-right: 0;
margin-bottom: 1rem;
}
.selectText{
margin-bottom: 2rem;
display: flex;
width: 100%;
> div{
background: #efeff1;
width: 100%;
font-size: 1.6rem;
margin-right: 1.2rem;
border-radius: 1.6rem;
cursor: pointer;
padding: 1.2rem;
white-space: nowrap; /* 文本不换行 */
overflow: hidden; /* 溢出部分隐藏 */
text-overflow: ellipsis; /* 显示省略号 */
&:hover{
background: #f5f5f5;
}
&:first-child{
margin-right: 0;
}
}
}
.selectText{
margin-bottom: 2rem;
display: flex;
width: 100%;
> div{
background: #efeff1;
width: 100%;
height: 4.8rem;
margin-right: 1.2rem;
border-radius: 1.6rem;
cursor: pointer;
padding: 1.2rem;
white-space: nowrap; /* 文本不换行 */
overflow: hidden; /* 溢出部分隐藏 */
text-overflow: ellipsis; /* 显示省略号 */
&:hover{
background: #f5f5f5;
}
&:first-child{
margin-right: 0;
}
}
}
.transferPose{
display: flex;
flex-direction: column;
@@ -943,8 +974,9 @@ overflow: visible !important;
}
.scaleImage_content_imgBox{
position: relative;
// max-width: 70rem;
width: 100%;
width: auto;
// min-width: 70%;
width: 76%;
text-align: center;
justify-content: center;
> .loadBox{

579
src/component/home/design/index.vue
View File

@@ -4,8 +4,8 @@
<div class="page_content_body">
<div class="designPage_body">
<div class="designPage_left" ref="hidden">
<div class="designPage_left_content" :class="{'active':(domHidden)}">
<div class="designPage_left" :class="{'active':(domHidden)}" ref="hidden">
<div class="designPage_left_content">
<!-- 有图状态 start-->
<div class="home_left_info">
@@ -38,12 +38,12 @@
</div>
<div class="generage_btn_box white">
<div class="generage_btn started_btn" style="margin-left: 2rem;">
<div class="" @click.stop="openEditTools()" style="margin-left: 1rem;">
<div class="" @click.stop="openEditTools()" style="margin-left: 1rem;font-weight: 900">
{{ $t('Header.Tools') }}
</div>
<div class="icon iconfont icon-xiala" :class="{active:speedState}" @click.stop="openSpeed"></div>
<div class="content" v-show="speedState">
<div v-for="item in speedList" :key="item.value" style="font-size: 1.4rem;" :class="{active:item.value == speedData.value}" @click.stop="setSpeed(item)" :title="item.title">{{ item.label }}</div>
<div v-for="item in speedList" v-show="(item.value != 'poseTransfer' || selectProbject.type != 'singleProductDesign')" :key="item.value" style="font-size: 1.4rem;" :class="{active:item.value == speedData.value}" @click.stop="setSpeed(item)" :title="item.title">{{ item.label }}</div>
</div>
</div>
</div>
@@ -72,7 +72,7 @@
{{ $t('HomeView.SelectedDesign') }}
</span>
</div>
<div class="generalModel_state" v-show="likeDesignTools">
<div class="generalModel_state">
<div>
<selectMenu
:selectList="resultTypeList"
@@ -90,7 +90,7 @@
v-model:select="resultType"
>
<template v-slot:btnText>
Classify
{{ $t('Header.Filter') }}
</template>
</selectMenu>
</div>
@@ -98,11 +98,11 @@
<selectMenu
:selectList="[
{
label:'Unfold',
label:$t('Header.expand'),
value:true,
},
{
label:'Merge',
label:$t('Header.collapse'),
value:false,
},
]"
@@ -168,13 +168,13 @@
'like'
)">
<img class="content_img"
v-if="design?.resultType == 'PoseTransfer'"
v-if="design?.resultType == 'PoseTransfer' && design?.firstFrameUrl"
:src="design?.firstFrameUrl" alt=""
@mouseenter.stop="gifPlay($event,design)"
@mouseleave.stop="gifPause($event,design)" >
<!-- <div :style="{'background-image': `url(${design?.designOutfitUrl||design?.url})`}" class="content_img" v-if="design?.designOutfitUrl||design?.url" :key="design?.designOutfitUrl" designType="like" :index="index"></div> -->
<img class="content_img" v-if="design?.designOutfitUrl||design?.url" :src="design?.designOutfitUrl||design?.url"
:key="design?.designOutfitUrl" designType="like" :index="index"/>
:key="design?.status" designType="like" :index="index"/>
<a-spin v-show="!design?.designOutfitUrl && !design?.url && !design?.firstFrameUrl" size="large"></a-spin>
<!-- <div class="content_img_block_child" @click.stop>
@@ -215,7 +215,7 @@
<div class="designPage_left_bottom left" @click="setShowHide('domHidden')" >
<span class="icon iconfont icon-xiala" :class="{'active':domHidden}"></span>
</div>
<div class="designPage_left_bottom right" :class="{active:recycleDomHidden}" @click="setShowHide('recycleDomHidden')" v-show="designCollectionId">
<div class="designPage_left_bottom right" :class="{active:recycleDomHidden}" @click="setShowHide('recycleDomHidden')" v-show="designCollectionList.length > 0">
<span class="icon iconfont icon-xiala" :class="{'active':recycleDomHidden}"></span>
</div>
</div>
@@ -280,19 +280,24 @@
<div class="text">{{$t('Header.toolsToProduct')}}</div>
<i class="fi fi fi-ss-box-open"></i>
</div>
<div class="item" v-show="selectEditBtn?.resultType == 'ToProductImage' || selectEditBtn?.resultType == 'Relight'" @click="setEditDesignType(selectLikeDesign,selectEditBtnIndex,'Relight','add','like')">
<div class="item" v-show="(selectEditBtn?.resultType == 'ToProductImage' || selectEditBtn?.resultType == 'Relight')" @click="setEditDesignType(selectLikeDesign,selectEditBtnIndex,'Relight','add','like')">
<div class="text">{{$t('Header.toolsRelight')}}</div>
<i class="fi fi fi-br-keyboard-brightness"></i>
</div>
<div class="item" v-show="selectEditBtn?.resultType == 'ToProductImage' || selectEditBtn?.resultType == 'Relight'" @click="setEditDesignType(selectLikeDesign,selectEditBtnIndex,'PoseTransfer','add','like')">
<div class="item" v-show="(selectEditBtn?.resultType == 'ToProductImage' || selectEditBtn?.resultType == 'Relight') && (selectProbject.type != 'singleProductDesign')" @click="setEditDesignType(selectLikeDesign,selectEditBtnIndex,'PoseTransfer','add','like')">
<div class="text">{{$t('Header.toolsToTransferPose')}}</div>
<i class="fi fi fi-rr-play-alt"></i>
</div>
<div class="item" @click="dislikeDesignCollection(selectEditBtn,selectEditBtn?.resultType,selectEditBtnIndex)">
<div class="item" v-show="selectEditBtn?.resultType != 'Design'" @click="setNoDesignLike(selectEditBtn,selectEditBtnIndex,selectEditBtn?.resultType,'disLike')">
<div class="text">{{$t('Header.Delete')}}</div>
<i class="fi fi-rr-trash icon_delete">
</i>
</div>
<div class="item" v-show="selectEditBtn?.resultType == 'Design'" @click="dislikeDesignCollection(selectEditBtn,selectEditBtn?.resultType,selectEditBtnIndex)">
<div class="text">{{$t('Header.onLiked')}}</div>
<i class="icon iconfont icon-jushoucang icon_like">
</i>
</div>
</div>
<collectionModal ref="collectionModal"></collectionModal>
@@ -308,20 +313,20 @@
<DesignDetailcopy v-if="detailDestroy" ref="designDetail" @destroy="setDetailDestroy" @finishRedesign="finishRedesign"></DesignDetailcopy>
<editDesignType ref="editDesignType"
@addGenerateImg="addGenerateImg"
@setGenerateAwait="generateLoad"
@upDataDesignLikeList="generateLoad"
:productData="{
upload:upload,
RelightDirection:RelightDirection,
RelightDirectionList:RelightDirectionList,
}"
:isProductimg="true"></editDesignType>
<designTools ref="designTools" @editToolsSuccess="editToolsSuccess"></designTools>
<designTools ref="designTools" :source="'design'" @editToolsSuccess="generateLoad"></designTools>
</div>
</template>
<script lang="ts">
import { defineComponent, h, ref, computed, toRefs, inject,provide,nextTick,reactive,onBeforeUnmount, toRef, watch} from "vue";
import { defineComponent, h, ref, computed, toRefs, createVNode,provide,nextTick,reactive,onBeforeUnmount, toRef, watch} from "vue";
// import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import NewCollectionReview from "@/component/HomePage/NewCollectionReview.vue";
import generalCanvas from "@/component/modules/generalCanvas.vue";
@@ -344,6 +349,7 @@ import { removeClass } from "element-plus/es/utils";
import collectionModal from './collection.vue'
import designTools from './tools.vue'
import selectMenu from '@/component/modules/selectMenu.vue'
import { forEach } from "jszip";
export default defineComponent({
name: "homePage",
@@ -368,6 +374,9 @@ export default defineComponent({
const {t} = useI18n()
const store = useStore();
const editDesignType = reactive({
selectProbject:computed(()=>{
return store.state.Workspace.probjects
}),
upload:{id:store.state.Workspace.probjects.id},
RelightDirectionList:[
{
@@ -463,12 +472,12 @@ export default defineComponent({
label:computed(()=>t('Header.toolsToProduct')),
value:'toProduct',
},{
label:computed(()=>t('Header.toolsToTransferPose')),
value:'poseTransfer',
},{
label:computed(()=>t('Header.toolsRelight')),
value:'relight',
},{
label:computed(()=>t('Header.toolsToTransferPose')),
value:'poseTransfer',
},
],
speedState:false,
@@ -496,12 +505,6 @@ export default defineComponent({
const openCanvas = ()=>{
dataDom.designTools.init('editCanvas')
}
const editToolsSuccess = ()=>{
nextTick().then(()=>{
designData.isUnfold = true
uploadLikeDom()
})
}
const designData = reactive({
openEditBtnId:-1,
selectEditBtn:null as any,
@@ -674,8 +677,10 @@ export default defineComponent({
store.commit("cancelDeleteDesignCollectionList",index);
}
const designMousedown = (e:any,design:any,str:string)=>{
if(design.resultType != 'Design' || designData.isUnfold)return
if(str != 'like' && showDesignMark.value) return
if(str != 'disLike'){
if(design.resultType != 'Design' || designData.isUnfold)return
if(str != 'like' && showDesignMark.value) return
}
let Id = design.userLikeSortId || design.id
let arr = str == 'like'? posiitonData.value.likeElList:posiitonData.value.generateElList
let item:any = arr.filter((item:any)=>item.userLikeSortId == Id)[0]
@@ -786,17 +791,17 @@ export default defineComponent({
}
}
const setLikeDislLike = (str:string,value:any)=>{
designData.selectLikeDesign = []
posiitonData.value.likeSelectIndex = 0
nextTick(()=>{
if(str == 'like'){
designData.selectLikeDesign = []
let elArr = likeItemDom.value.children
posiitonData.value.likeElList.push({
el: elArr[0],
sort: value.sort - 1,
index: value.sort - 1,
userLikeSortId:value.userLikeSortId
});
// posiitonData.value.likeElList.push({
// el: elArr[0],
// sort: value.sort - 1,
// index: value.sort - 1,
// userLikeSortId:value.userLikeSortId
// });
let collItem = posiitonData.value.generateElList.filter((item:any)=>(item.userLikeSortId == value.designItemId || item.userLikeSortId == value.id))[0]
if(collItem){
posiitonData.value.generateElList = posiitonData.value.generateElList.filter((item:any)=>item.userLikeSortId != value.designItemId)
@@ -808,12 +813,12 @@ export default defineComponent({
}
}else if(str == 'disLike'){
let elArr = collItemDom.value.querySelectorAll('.content_img_GetWidth')
posiitonData.value.likeElList = posiitonData.value.likeElList.filter((item:any)=>(item.sort + 1) != value.sort)
posiitonData.value.likeElList.forEach((item:any)=>{
if(item.sort > value.sort - 1){
item.sort-=1
}
})
// posiitonData.value.likeElList = posiitonData.value.likeElList.filter((item:any)=>(item.sort + 1) != value.sort)
// posiitonData.value.likeElList.forEach((item:any)=>{
// if(item.sort > value.sort - 1){
// item.sort-=1
// }
// })
posiitonData.value.generateElList.push({
el: elArr[elArr.length-1],
sort: posiitonData.value.generateElList.length,
@@ -821,8 +826,10 @@ export default defineComponent({
userLikeSortId:value.designItemId||value.id
});
}
setDesignItemStyle()
setSystemDesigner(100)
setDesignItemStyle()
uploadLikeDom()
// moveItem('disLike');
})
}
@@ -878,6 +885,7 @@ export default defineComponent({
}
let setEditDesignType = (arr:any,index:any,type:any,status:any,listType:string)=>{
arr = JSON.parse(JSON.stringify(arr))
store.commit('setOpenChatStatus',false)
let item = arr[index]
if(status == 'add'){
item.sourceUrl = item.designOutfitUrl || item.url
@@ -887,89 +895,28 @@ export default defineComponent({
arr[index].resultType = type
// dataDom.editDesignType.isProductimg = isLike
dataDom.editDesignType.isProductimg = true
clearInterval(prductimgTime.ToProductImage)
clearInterval(prductimgTime.PoseTransfer)
clearInterval(prductimgTime.Relight)
dataDom.editDesignType.init(arr,index,null,status,listType)
dataDom.editDesignType.isLike = false
dataDom.editDesignType.productimgRelightDirection = editDesignType.RelightDirection
dataDom.editDesignType.isComparison = true
}
const addGenerateImg = (data:any)=>{
const addGenerateImg = async (data:any)=>{
if(!data.id)return
let obj = {
id:data.id,
designItemId:data.id,
// designItemId:data.elementId,
designOutfitId:'',
designOutfitUrl:data.designOutfitUrl,
sourceUrl:data.sourceUrl,
resultType:data.resultType,
elementId:data.elementId,
elementType:data.elementType,
userGroupId:data.userGroupId || data.id,
firstFrameUrl:data.firstFrameUrl,
gifUrl:data.gifUrl,
awaitId:data.awaitId,
taskId:data.taskId,
parentId:data.parentId || data.userLikeSortId,
videoUrl:data?.videoUrl,
}
let list = []
if(data.listType == 'disLike'){
list = designCollectionList.value
}else{
list = likeDesignCollectionList.value
}
if(list[data.isIndex]?.generateAwait)list[data.isIndex].generateAwait = false;
if(data.status == 'add'){
if(data.listType == 'like'){
likeDesignCollection(obj,-1,data.resultType)
}else{
list.unshift(obj)
}
}else if(data.status == 'cove'){
// collectionLikeUpdate
// Https
if(data.listType == 'like'){
let value = {
"oldRelationId": data.oldId,
"relationId": data.id,
"relationType": data.resultType,
}
Https.axiosPost(Https.httpUrls.collectionLikeUpdate,value).then((rv:any)=>{
if(rv){
}
})
}
list.forEach((item)=>{
if(data.parentId == item.userLikeSortId){
item.childList.forEach((childItem)=>{
if(childItem.id == data.awaitId){
childItem.designOutfitUrl = obj.designOutfitUrl
childItem.resultType = obj.resultType
childItem.id = obj.id
childItem.designItemId = obj.designItemId
childItem.sourceUrl = obj.sourceUrl
}
})
}
})
nextTick().then(()=>{
uploadLikeDom()
})
}
// nextTick().then(()=>{
// // setDesignItemStyle()
// // setSystemDesigner(100)
// uploadLikeDom()
// })
await nextTick().then(()=>{
designData.isUnfold = true
uploadLikeDom()
})
upDataSuccess(data)
}
const setNoDesignLike = (design:any,index:any,type:any,str:string) => {
let url
let data = {
toProductImageResultId:[(design.designItemId || design.id)],
projectId: store.state.Workspace.probjects.id,
collectionSortParentId:designData?.selectDesign?.parentId || design.parentId,
collectionSortParentId:designData?.selectDesign?.parentId || design?.parentId,
} as any
let params = {} as any
if(type == 'ToProductImage' || type == 'Relight'){
@@ -1004,41 +951,43 @@ export default defineComponent({
}
designData.likeLoading = true;
Https.axiosPost(url, data,{params:params.likeOrDislike?params:''}).then(
(rv) => {
if(str == 'like'){
// likeDesignCollectionList.value.forEach((item)=>{
// if(item.userLikeSortId == designData.selectDesign.userLikeSortId){
// // if(item?.childList.)
// item.unshift(data)
// }
// })
// if(){
// }else{
// }
likeDesignCollectionList.value.forEach((item:any)=>{
if(item.resultType == 'Design' && item.userLikeSortId == designData.selectDesign.userLikeSortId){
if(!item?.childList)item.childList = []
// if(item?.childList)
const removeIndex = item?.childList.findIndex(childItem => childItem?.taskId === design?.taskId);
if (removeIndex !== -1) {
item.childList[removeIndex] = design
}else{
item.childList.push(design)
async (rv) => {
await new Promise((resolve, reject) => {
if(str == 'like'){
likeDesignCollectionList.value.forEach((item:any)=>{
if(item.resultType == 'Design' && item.userLikeSortId == designData.selectDesign.userLikeSortId){
if(!item?.childList)item.childList = []
// if(item?.childList)
const removeIndex = item?.childList.findIndex(childItem => childItem?.taskId === design?.taskId);
if (removeIndex !== -1) {
item.childList[removeIndex] = design
}else{
item.childList.push(design)
}
}
}
})
}else{
likeDesignCollectionList.value.forEach((item:any)=>{
if(item.resultType == 'Design' && item.userLikeSortId == designData.selectDesign.userLikeSortId){
item.childList = item.childList.filter((childItem:any)=>{
return childItem.id != design.id
})
}
})
}
})
}else{
console.log(design)
likeDesignCollectionList.value.forEach((item:any)=>{
if(item.resultType == 'Design' && item.userLikeSortId == designData.selectDesign.userLikeSortId){
item.childList.forEach((childItem:any)=>{
if(childItem.sort > design.oldSort){
console.log(childItem)
childItem.sort -= 1
}
})
item.childList = item.childList.filter((childItem:any)=>{
return childItem.id != design.id
})
console.log(item)
}
})
}
resolve('')
})
nextTick().then(()=>{
console.log(111)
designData.isUnfold = true
uploadLikeDom()
})
@@ -1073,76 +1022,175 @@ export default defineComponent({
designData.likeLoading = false;
});
}
let likeDesignCollection = (design:any,index:any,type:any) => {
if (designData.likeLoading) {
return;
}
if(type != 'Design'){
setNoDesignLike(design,index,type,'like')
return
}
let data = {
designItemId: design.designItemId,
userGroupId: store.state.HomeStoreModule.userGroupId,
projectId: store.state.Workspace.probjects.id,
timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,
designPythonOutfitId:design.designOutfitId?design.designOutfitId:design.designPythonOutfitId
};
designData.likeLoading = true;
Https.axiosPost(Https.httpUrls.designLike, data)
.then((rv: any) => {
if (rv) {
let value:any = {
...design,
id:rv.userLikeId,
groupDetailId:rv.userLikeId,
userLikeSortId:rv.userLikeSortId,
userLikeGroupId:rv.userGroupId,
sort:rv.sort,
}
store.commit("setUserGroupId", rv.userGroupId);
design.groupDetailId = rv.groupDetailId;
store.commit(
"addLikeDesignCollectionList",
value
);
setLikeDislLike('like',value)
if(index != -1)store.commit("deleteDesignCollectionList", index);
}
designData.likeLoading = false;
})
.catch((rv) => {
designData.likeLoading = false;
});
}
const upDataLikeListType = ()=>{
}
const generateLoad = (data:any)=>{
if(!data.taskId)return
let list = []
if(data.listType == 'disLike'){
list = designCollectionList.value
}else{
// list = designData.selectLikeDesign
list = likeDesignCollectionList.value
const upDataSuccess = (element)=>{
console.log(JSON.parse(JSON.stringify(likeDesignCollectionList.value)))
if(designData.isUnfold){
designData.selectLikeDesign.forEach((item:any,index:any) => {
if(element.taskId == item.taskId){
designData.selectLikeDesign[index].url = element.url
designData.selectLikeDesign[index].status = element.status
designData.selectLikeDesign[index].elementType = element.elementType
designData.selectLikeDesign[index].elementId = element.elementId
designData.selectLikeDesign[index].id = element.id
}
});
}
list.forEach((item)=>{
if(data.parentId == item.userLikeSortId){
const removeIndex = item?.childList.findIndex(childItem => childItem?.taskId === data?.taskId);
if(removeIndex == -1){
item.childList.push(data)
likeDesignCollectionList.value.forEach((likeItem:any,index:any)=>{
if(likeItem?.childList?.length > 0){
likeItem.childList.forEach((childItem:any,index:any)=>{
if(childItem.taskId == element.taskId){
console.log(childItem)
likeItem.childList[index].url = element.url
likeItem.childList[index].status = element.status
likeItem.childList[index].elementType = element.elementType
likeItem.childList[index].elementId = element.elementId
likeItem.childList[index].id = element.id
console.log(likeItem.childList)
}
})
}
})
nextTick(()=>{
setSystemDesigner(0)
})
}
const upDataSort = (generateCourseItem:any,likeIndex:number)=>{
let list = likeDesignCollectionList.value
if(list[likeIndex].childList.length == 0)return
list[likeIndex].childList.forEach((likeItem:any,index:any)=>{
console.log(likeItem)
if(likeItem.sort >= generateCourseItem.sort){
likeItem.sort += 1
}
})
}
const generateLoad = async (data:any)=>{
// return
clearInterval(prductimgTime.ToProductImage)
clearInterval(prductimgTime.PoseTransfer)
clearInterval(prductimgTime.Relight)
let list = likeDesignCollectionList.value
data.generateCourse.forEach((generateCourseItem:any)=>{
let oldData = generateCourseItem.oldData
if(oldData?.resultType == "Design"){
let index = list.findIndex((item:any)=>(item.userLikeSortId == generateCourseItem.parentId && item.resultType == "Design"))
if(!list[index]?.childList)list[index].childList = []
if(data.status == 'add'){
generateCourseItem.sort = list[index]?.childList.length + 1
upDataSort(generateCourseItem,index)
list[index]?.childList.push(generateCourseItem)
}
}else{
console.log(generateCourseItem)
let index = list.findIndex((item:any)=>(item.userLikeSortId == generateCourseItem.parentId))
if(!list[index]?.childList){
list[index].childList = []
}
if(data.status == 'add'){
upDataSort(generateCourseItem,index)
list[index]?.childList.push(generateCourseItem)
}else{
let childIndex = list[index].childList.findIndex((item:any)=>(item.id == generateCourseItem.id))
list[index].childList[childIndex] = generateCourseItem
}
}
})
nextTick().then(()=>{
await nextTick().then(()=>{
designData.isUnfold = true
uploadLikeDom()
})
// list[data.index].generateAwait = true;
let toProductImage = []
let poseTransfer = []
let relight = []
list.forEach((item:any)=>{
if(!item?.childList)item.childList = []
item.childList.forEach((childItem:any)=>{
if(childItem.resultType == 'PoseTransfer'){
if(!childItem.status && !childItem?.firstFrameUrl){
poseTransfer.push(childItem.taskId)
}
}else if(childItem.resultType == 'ToProductImage'){
if(!childItem.status && (!childItem?.url || !childItem?.designOutfitUrl)){
toProductImage.push(childItem.taskId)
}
}else if(childItem.resultType == 'Relight'){
if(!childItem.status && (!childItem?.url || !childItem?.designOutfitUrl)){
relight.push(childItem.taskId)
}
}
})
})
setPrductimg(toProductImage,'ToProductImage')
setPrductimg(poseTransfer,'PoseTransfer')
setPrductimg(relight,'Relight')
}
let prductimgTime = {
ToProductImage:null,
PoseTransfer:null,
Relight:null,
}
const setFail = (list:any)=>{
list.forEach((listItem)=>{
if(designData.isUnfold){
let index = designData.selectLikeDesign.findIndex((item:any)=>{return item.taskId == listItem})
designData.selectLikeDesign.splice(index,1)
}
likeDesignCollectionList.value.forEach((likeItem:any,index:any)=>{
if(likeItem?.childList?.length > 0){
let index = likeItem.childList.findIndex((item:any)=>{return item.taskId == listItem})
likeItem.childList.splice(index,1)
}
})
})
nextTick().then(()=>{
uploadLikeDom()
})
}
let setPrductimg = (dataList:any,type:string)=>{
if(dataList.length == 0)return
let data = dataList
let state = true
let url = Https.httpUrls.relightResult
if(type == 'ToProductImage'){
url = Https.httpUrls.toProductImageResult
}else if(type == 'PoseTransfer'){
url = Https.httpUrls.poseTransformResult
}
// url = Https.httpUrls.poseTransformResult
// data = {taskId: "00169296-220e-4032-bfce-ca8ff67d6468-83"}
prductimgTime[type] = setInterval(()=>{
if(!state)return
state = false
Https.axiosPost(url, data).then(
(rv) => {
if(type == 'PoseTransfer'){
rv = [rv]
}
state = true
rv.forEach((element:any) => {
if(element?.status == 'Success'){
// setFail([element.taskId])
upDataSuccess(element)
data = data.filter((item:any) => item !== element.taskId);
}else if(element?.status == 'Fail' || element?.status == 'Invalid'){
data = data.filter((item:any) => item !== element.taskId);
setFail([element.taskId])
message.info(t('Generate.everyTimeEffectPoor'));
}
});
if(data.length == 0){
store.state.store.dispatch('getCredits')
clearInterval(prductimgTime[type])
}
}
).catch(res=>{
clearInterval(prductimgTime[type])
setFail(data)
});
},type == 'PoseTransfer'?20000:3000)
}
const gifPlay = (e:any,item:any)=>{
e.target.src = item.gif || item.gifUrl//使用gif图片
@@ -1172,7 +1220,10 @@ export default defineComponent({
item.oldSort = item.sort
if(item?.childList?.length > 0){
item.childList.forEach((childItem:any,childIndex:number)=>{
childItem.sort = childIndex + item.sort + childLength
childItem.oldSort = childItem.sort
console.log(childItem.sort,childLength,index)
childItem.sort = childItem.sort + childLength + index
// childItem.sort = childIndex + item.sort + childLength
designData.selectLikeDesign.push(childItem)
})
childLength = item.childList.length + childLength
@@ -1193,6 +1244,7 @@ export default defineComponent({
const parents = designData.selectLikeDesign.filter((item:any) => item.resultType === 'Design');
parents.map((parent:any) => {
parent.sort = parent.oldSort||parent.sort
delete parent.oldSort
return {
...parent,
childList: designData.selectLikeDesign.filter((item:any) =>
@@ -1207,6 +1259,13 @@ export default defineComponent({
})
}
const changeResultType = ()=>{
if(designData.resultType == 'Design'){
designData.isUnfold = false
setUnfold()
}else{
designData.isUnfold = true
// setUnfold()
}
if(designData.resultType != 'All'){
if(designData.oldSelectLikeDesign.length == 0)designData.oldSelectLikeDesign = designData.selectLikeDesign
if(designData.resultType == 'Product'){
@@ -1263,7 +1322,6 @@ export default defineComponent({
setSpeed,
openEditTools,
openCanvas,
editToolsSuccess,
uploadLikeDom,
likeItemDom,
@@ -1284,7 +1342,6 @@ export default defineComponent({
openCollection,
setEditDesignType,
openEditBtn,
addGenerateImg,
setNoDesignLike,
upDataLikeListType,
generateLoad,
@@ -1294,6 +1351,7 @@ export default defineComponent({
endHover,
setUnfold,
changeResultType,
addGenerateImg,
};
},
data() {
@@ -1785,7 +1843,27 @@ export default defineComponent({
},
//不喜欢设计
dislikeDesignCollection(design:any,type:string, index: any) {
async dislikeDesignCollection(design:any,type:string) {
if(design?.childList?.length > 0){
await new Promise((resolve, reject) => {
Modal.confirm({
title: this.t('LibraryPage.jsContent11'),
icon: createVNode(ExclamationCircleOutlined),
okText: 'Yes',
cancelText: 'No',
mask:false,
zIndex:99999,
centered:true,
onOk() {
resolve('')
},
onCancel(){
return
}
});
})
}
let data = {
designId: design.designId || this.designId,
designPythonOutfitId:design.designOutfitId,
@@ -1793,10 +1871,6 @@ export default defineComponent({
timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,
projectId:this.store.state.Workspace.probjects.id,
};
if(type != 'Design'){
this.setNoDesignLike(design,index,type,'disLike')
return
}
if (this.disLikeLoading) {
return;
}
@@ -1804,17 +1878,27 @@ export default defineComponent({
Https.axiosPost(Https.httpUrls.designDislike, data)
.then((rv: any) => {
if (rv) {
// this.store.commit("addDesignCollectionList", [design]);
this.likeDesignCollectionList.forEach((item:any)=>{
if(item.sort > design.sort){
this.recycleDomHidden = true
this.store.commit("addDesignCollectionList", [design]);
let index = -1
this.likeDesignCollectionList.forEach((item:any,likeIndex:number)=>{
if(item.id == design.id){
design.childList = []
index = likeIndex
}
if((item?.oldSort || item.sort) > (design?.oldSort || design.sort)){
item.sort-=1
}
})
this.store.commit(
"deleteLikeDesignCollectionList",
index
);
this.setLikeDislLike('disLike',design)
this.likeDesignCollectionList.splice(index,1)
// this.store.commit(
// "deleteLikeDesignCollectionList",
// index
// );
design.childList = []
nextTick(()=>{
this.setLikeDislLike('disLike',design)
})
}
this.disLikeLoading = false;
})
@@ -1997,6 +2081,7 @@ export default defineComponent({
) {
// if()
if(this.isMove)return
this.store.commit('setOpenChatStatus',false)
if(design.resultType != "Design"){
this.setEditDesignType(collectionList,index,design.resultType,'edit',type)
return
@@ -2123,29 +2208,29 @@ export default defineComponent({
width: 100%;
height: 100%;
display: flex;
// padding-left: 0.7rem;
box-sizing: border-box;
// overflow: hidden;
.designPage_left {
// width: 44.4rem;
width: 33%;
height: 100%;
background: rgba(255, 255, 255, 0.2);
position: relative;
// overflow: hidden;
.designPage_left_content {
height: 100%;
width: 50rem;
// width: 55rem;
overflow: hidden;
// transition: all .3s;
padding-right: 1.2rem;
&.active{
&.active{
width: 0;
.designPage_left_content{
padding-right: 0;
width: 0;
}
}
.designPage_left_content {
height: 100%;
// width: 50rem;
width: 100%;
overflow: hidden;
padding-right: 1.2rem;
.home_left_info {
height: 100%;
display: flex;
@@ -2273,8 +2358,9 @@ export default defineComponent({
flex: 1;
display: flex;
position: relative;
width: 0;
flex-direction: column;
// min-width: 40%;
width: 50%;
&.recycleBin{
flex: none;
margin-left: 0;
@@ -2283,9 +2369,10 @@ export default defineComponent({
&.recycleBinShow{
width: auto;
margin-left: 2rem;
width: calc(50% - 2rem);
}
.right_content_body {
width: 55rem;
width: 100%;
// width: 55rem;
.right_content_img_block{
@@ -2413,11 +2500,11 @@ export default defineComponent({
top: 0rem;
> .childItem{
> .content_img_flex{
object-fit: contain;
border: 2px solid #00000070;
}
position: relative !important;
>img{
}
}
}
@@ -2431,20 +2518,21 @@ export default defineComponent({
border: 2px solid #000;
}
&.PoseTransfer{
border: 2px solid #f0d9d0;
border: 2px solid #c7c7c7;
}
&.ToProductImage{
border: 2px solid #ccece5;
border: 2px solid #c7c7c7;
}
&.Relight{
border: 2px solid #ccece5;
border: 2px solid #c7c7c7;
}
}
}
.content_img {
height: 100%;
// object-fit: contain;
object-fit: cover;
width: 100%;
object-fit: contain;
// object-fit: cover;
}
.btn{
@@ -2454,6 +2542,10 @@ export default defineComponent({
position: absolute;
flex-direction: column;
align-items: center;
@media (min-width: 1024px) {
top: 1.5rem;
right: 1.5rem;
}
> i{
cursor: pointer;
width: 3rem;
@@ -2464,6 +2556,9 @@ export default defineComponent({
text-shadow: 0px 0px 2px black, 0px 0px 2px black, 0px 0px 2px black;
color: #fff;
font-size: 1.7rem;
@media (min-width: 1024px) {
font-size: 2rem;
}
}
.icon_like,.icon_delete {

8
src/component/home/design/mannequin/index.vue
View File

@@ -5,7 +5,7 @@
<!-- <div class="text">Style：</div>
<div class="text" style="margin: 0 9rem 0 4rem;">{{ selectObject?.styleName }}</div>
<div class="gallery_btn" style="line-height: 5rem;" @click="setStyle">{{ $t('Habit.Select') }}</div> -->
<div class="text" v-show="systemUser">Style：</div>
<div class="text" v-show="systemUser">{{ $t('Model.Style：') }}</div>
<div class="generalModel_state" style="width: 20rem;" v-show="systemUser">
<div class="generalModel_state_item" style="margin: 0; width: 100%;">
<a-select
@@ -27,7 +27,7 @@
</div>
</div>
<div class="selectModel">
Current Model :
{{ $t('Model.CurrentModel') }} :
<div class="item" v-for="item ,index in selectObject.model" @click="deleteSelectModel(index)">
<img :src="item.url" alt="">
<span class="icon iconfont icon-shanchu"></span>
@@ -154,8 +154,8 @@ export default defineComponent({
if(list.length <= 3){
let model = {
id:item.id,
url:item.presignedUrl,
type:data.systemUser?'System':'Library',
url:item.presignedUrl || item.url,
type:item.type?item.type:data.systemUser?'System':'Library',
}
list.push(model)
}else{

85
src/component/home/design/tools.vue
View File

@@ -34,6 +34,7 @@
:isDesignPage="true"
@setLike="designLike"
class="toProduct"
:source="source"
:isState="openType =='toProduct'"
v-if="openType == 'toProduct'"
></toProductRelight>
@@ -42,10 +43,11 @@
:isDesignPage="true"
@setLike="designLike"
class="relight"
:source="source"
:isState="openType =='relight'"
v-if="openType == 'relight'"
></toProductRelight>
<poseTransfer v-if="openType == 'poseTransfer'" :isDesignPage="true" @setLike="designLike" ref="poseTransfer"></poseTransfer>
<poseTransfer v-if="openType == 'poseTransfer'" :source="source" :isDesignPage="true" @setLike="designLike" ref="poseTransfer"></poseTransfer>
<div v-if="openType == 'editCanvas'" class="canvasBox" :class="{editCanvas:openType == 'editCanvas'}">
<div class="canvas" ref="canvasBox">
<editCanvas @changeCanvas="changeCanvas" ref="editCanvas">
@@ -56,12 +58,13 @@
</div>
<div class="btn">
<div class="gallery_btn" @click="saveCanvas">Save</div>
<div class="gallery_btn">Share</div>
<div class="gallery_btn" @click="share">Share</div>
<div class="gallery_btn" @click="exportElement">Export</div>
</div>
</div>
</div>
</div>
<publish ref="publish" @clearPublish="clearPublish"></publish>
<div class="mark_loading" v-show="isShowMark">
<a-spin size="large" />
</div>
@@ -78,12 +81,17 @@ import poseTransfer from '../tools/poseTransfer/index.vue'
import editCanvas from "@/component/Canvas/CanvasEditor/index.vue";
import ExistsImageList from "@/component/Canvas/ExistsImageList/index.vue";
import JSZip, { forEach } from "jszip";
import publish from "@/component/WorksPage/publish.vue";
export default defineComponent({
components:{
toProductRelight,poseTransfer,editCanvas,ExistsImageList
toProductRelight,poseTransfer,editCanvas,ExistsImageList,publish
},
props:{
source:{
type:String,
default:'',
},
},
emits:['editToolsSuccess'],
setup(props,{emit}) {
@@ -103,8 +111,10 @@ export default defineComponent({
relight:null as any,
poseTransfer:null as any,
editCanvas:null as any,
publish:null as any,
}) as any
const init = (value:any,list:any)=>{
store.commit('toolsClear')
data.designTools = true
data.openType = value
if(value == 'editCanvas'){
@@ -114,31 +124,74 @@ export default defineComponent({
data.likeDesignList = list
nextTick(()=>{
let fileList = [] as any
let likeList = [] as any
if(value == 'toProduct'){
list.forEach((item:any) => {
item.type = 'DesignOutfit'
fileList.push(item)
item.childList.forEach((child:any) => {
if(child.resultType == 'ToProductImage'){
likeList.push(child)
}
});
});
}else if(value == 'relight' || value == 'poseTransfer'){
console.log(list)
list.forEach((item:any) => {
if(item.childList){
item.childList.forEach((child:any) => {
if(child.resultType == 'ToProductImage' || child.resultType == 'Relight'){
fileList.push(child)
}
console.log(fileList)
if(child.resultType == 'Relight' && value == 'relight'){
likeList.push(child)
}else if(child.resultType == 'PoseTransfer' && value == 'poseTransfer'){
likeList.push(child)
}
console.log(likeList)
});
}
});
}
console.log(fileList)
let likeData = {
likedList: likeList,
str:'add',
index:-1,
}
if(data.openType == 'toProduct'){
store.commit("setToProductImage", likeData);
}else if(data.openType == 'relight'){
store.commit("setRelightList", likeData);
}else if(data.openType == 'poseTransfer'){
console.log(likeData)
store.commit("setPoseTransfer", likeData);
}
dataDom[value].openSetData(fileList)
})
}
let cleardata = async ()=>{
let list = []
if(data.openType == 'toProduct'){
list = store.state.HomeStoreModule.toProductImageList.likedList
}else if(data.openType == 'relight'){
list = store.state.HomeStoreModule.relightList.likedList
}else if(data.openType == 'poseTransfer'){
list = store.state.HomeStoreModule.poseTransfer.likedList
}
let generateCourse = list.filter((item)=>item.oldSort)
generateCourse = generateCourse.map(item => {
return item.oldSort ? { ...item, sort: item.oldSort } : item;
});
let emitData = {
status:'add',
generateCourse:generateCourse,
}
emit('editToolsSuccess',emitData)
data.openType = ''
data.likeDesignList = []
data.designTools = false
store.commit('toolsClear')
}
const designLike = ()=>{
@@ -147,7 +200,9 @@ export default defineComponent({
//画布相关
const getSelectCanvasImg = ()=>{
data.canvasSelectList = []
let allCollection = store.state.UploadFilesModule.allBoardData
console.log(allCollection)
let allCollectionStr = [
{value:'disposeMoodboard',name:'Entirety Moodboard'},
{value:'moodboardFiles',name:'Moodboard'},
@@ -208,7 +263,6 @@ export default defineComponent({
}
const saveCanvas = ()=>{
let canvasJSON = dataDom.editCanvas.getJSON()
console.log(JSON.parse(canvasJSON))
if(!canvasJSON)return
let blob = new Blob([canvasJSON], { type: "application/json" });
let formData = new FormData();
@@ -229,7 +283,7 @@ export default defineComponent({
console.log(data.canvasDetailData)
let img = [] as any;
if(data.canvasDetailData.commandManager.undoStack.length > 0){
await dataDom.editCanvas.exportImage({isContainBg:false,isContainFixed:false}).then((rv:any)=>{
await dataDom.editCanvas.exportImage({isContainBg:true,isContainFixed:false}).then((rv:any)=>{
var imageDataURL = rv
img.push({
imgUrl: imageDataURL,
@@ -239,7 +293,6 @@ export default defineComponent({
}
for(let i = 0; i < data.canvasSelectList.length;i++){
let item = data.canvasSelectList[i]
console.log(item)
item.imgList.forEach((imgItem:any,index:any)=>{
let nameTail = imgItem.url?.split(".").pop().split("?").shift();
img.push({
@@ -308,6 +361,20 @@ export default defineComponent({
};
const changeCanvas = (value:any)=>{
data.canvasDetailData = value
}
const share = async ()=>{
var imageDataURL = '';
await dataDom.editCanvas.exportImage({isContainBg:true,isContainFixed:false}).then((rv:any)=>{
imageDataURL = rv
})
let value = {
imgUrl:imageDataURL,
userlikeGroupId:1111,
}
dataDom.publish.init(value)
}
const clearPublish = ()=>{
}
return{
...toRefs(dataDom),
@@ -319,6 +386,8 @@ export default defineComponent({
saveCanvas,
exportElement,
changeCanvas,
share,
clearPublish,
}
},
provide() {

42
src/component/home/index.vue
View File

@@ -26,7 +26,7 @@ import { useRouter,useRoute } from 'vue-router'
import design from "./design/index.vue"
import newPorject from "./newProject/index.vue"
import router from '@/router';
import {getMinioUrl} from '@/tool/util'
import {getMinioUrl, getUniversalZoomLevel} from '@/tool/util'
import chat from "./chat/index.vue"
export default defineComponent({
components:{
@@ -76,7 +76,16 @@ export default defineComponent({
if(query.history || query.id){
if(data.openType == 'tools')data.isShowMark = true
data.dataLoad = true
if(query?.source != 'batch')createData()
if(query?.source != 'batch'){
createData()
}else{
let arr = ['moodBoard','printBoard','sketchBoard','colorBoard']
arr.forEach((item:any)=>{
store.commit("clearAllBoardData",item);
})
store.commit("createProbject");
store.commit("clearAllData");
}
if(query.type == 'Works'){
getWorks(query.id || query.history)
}else{
@@ -98,7 +107,6 @@ export default defineComponent({
store.commit("clearAllCollection");
store.commit("setAllBoardDataChoose",{});
store.commit("clearShowSketchboard",{});
store.commit("clearAllCollection");
store.commit("clearAllCloudList");
let arr = ['moodBoard','printBoard','sketchBoard','colorBoard']
arr.forEach((item:any)=>{
@@ -225,7 +233,7 @@ export default defineComponent({
return new Promise((resolve, reject) => {
let moduleList = [] as any
if(type == 'design'){
moduleList = ["moodBoard", "printBoard", "colorBoard", "sketchBoard",'design','mannequin']
moduleList = ["moodBoard", "printBoard", "colorBoard", "sketchBoard",'design','mannequin','toProduct','relight','poseTransfer']
}else{
moduleList = ["printBoard", "colorBoard", "sketchBoard",'design','toProduct','relight','poseTransfer','mannequin',"patternMaking3D",'deReconstruction','uploadElement']
}
@@ -282,7 +290,7 @@ export default defineComponent({
})
data.isShowMark = false
data.dataLoad = false
if(type == 'design'){
if(type == 'design' && dataDom.design){
nextTick(()=>{
dataDom.design.openSetData()
})
@@ -357,7 +365,8 @@ export default defineComponent({
store.commit("setUserGroupId", dataValue.design?.userGroupId);
if(dataValue.toProduct){
let value = {
list: dataValue.toProduct,
list:dataValue.toProduct.list.filter((rv)=>rv.status != 'Invalid' && rv.status != 'Fail'),
likedList:dataValue.toProduct.likedList,
str:'add',
index:-1,
}
@@ -365,7 +374,8 @@ export default defineComponent({
}
if(dataValue.relight){
let value = {
list: dataValue.relight,
list:dataValue.relight.list.filter((rv)=>rv.status != 'Invalid' && rv.status != 'Fail'),
likedList:dataValue.relight.likedList,
str:'add',
index:-1,
}
@@ -391,6 +401,24 @@ export default defineComponent({
};
store.commit('setPatternMaking3D',patternMaking3DData)
}
if(dataValue.deReconstruction){
let deReconstruction = {
str:'add',
list:[
{
isLike:dataValue.deReconstruction.liked,
category:dataValue.deReconstruction.category,
url:dataValue.deReconstruction.collageSketchUrl,
categoryValue:dataValue.deReconstruction.categoryValue,
}
]
};
let uploadImages = {
str:'add',
list:dataValue.deReconstruction?.uploadImages
};
store.commit('setDeReconstructionUploadImages',uploadImages)
}
}
//统一处理选择组的渲染数据
const dealViewChooseData = (dataValue: any,str:string)=> {

24
src/component/home/newProject/index.vue
View File

@@ -2,7 +2,7 @@
<div class="newProject">
<div class="contentBox">
<div class="content">
<div class="title">{{$t('newProjectg.helpYou')}}</div>
<div class="title" v-show="chatOrSetting == 'chat'">{{$t('newProjectg.helpYou')}}</div>
<div class="selectFlow">
<div class="select">
<div class="item" @click="setFlow(item)" :class="{active:item.title == selectFlow.title}" v-for="item in flowList">{{ item.title }}</div>
@@ -44,7 +44,7 @@
<workspace @setProject="setProject" :httpWorkflowType="selectFlow.value"></workspace>
</div>
<div class="hint" v-show="chatOrSetting == 'chat'">
<div class="item" v-for="item in hintList" :title="item" @click="addChatContent(item)">{{ item }}</div>
<div class="item" v-for="item in hintList[selectFlow.value]" :title="item.value" @click="addChatContent(item)">{{ item }}</div>
</div>
</div>
</div>
@@ -98,11 +98,18 @@ export default defineComponent({
]
},
chatContent:'',
hintList:[
computed(()=>t('newProjectg.hintList1')),
computed(()=>t('newProjectg.hintList2')),
computed(()=>t('newProjectg.hintList3')),
],
hintList:{
SERIES_DESIGN:[
computed(()=>t('newProjectg.hintListSERIES1')),
computed(()=>t('newProjectg.hintListSERIES2')),
computed(()=>t('newProjectg.hintListSERIES3')),
],
SINGLE_DESIGN:[
computed(()=>t('newProjectg.hintListSIGNLE1')),
computed(()=>t('newProjectg.hintListSIGNLE2')),
computed(()=>t('newProjectg.hintListSIGNLE3')),
],
},
enableThinking:false,//深度思考
uploadFile:null as any,
loadingShow:false,
@@ -446,9 +453,10 @@ export default defineComponent({
> div{
background: #efeff1;
width: 25rem;
height: 4.8rem;
// height: 4.8rem;
margin-right: 1.2rem;
border-radius: 1.6rem;
font-size: 1.6rem;
cursor: pointer;
padding: 1.2rem;
white-space: nowrap; /* 文本不换行 */

2
src/component/home/newProject/setting.vue
View File

@@ -28,7 +28,7 @@
<div>Setting</div>
</div>
<div class="workspaceBox">
<workspace ref="workspace" @setProject="setProject" :httpWorkflowType="projectData.process"></workspace>
<workspace ref="workspace" :status="'edit'" @setProject="setProject" :httpWorkflowType="projectData.process"></workspace>
</div>
</div>
<div class="mark_loading" v-show="isShowMark">

35
src/component/home/newProject/workspace.vue
View File

@@ -8,27 +8,27 @@
</div>
</div>
<div class="gender marginBottom" v-if="show.age">
<div class="text">{{$t('Habit.Role')}}</div>
<div class="text">{{$t('Habit.Role')}}:</div>
<div class="radio">
<label>
<input type="radio" name="ageGroup" v-model="selectObject.ageGroup" value="Adult">
<input type="radio" :disabled="status == 'edit'" name="ageGroup" v-model="selectObject.ageGroup" value="Adult">
<span>{{$t('Habit.Adult')}}</span>
</label>
<label>
<input type="radio" name="ageGroup" v-model="selectObject.ageGroup" value="Child">
<input type="radio" :disabled="status == 'edit'" name="ageGroup" v-model="selectObject.ageGroup" value="Child">
<span>{{$t('Habit.Child')}}</span>
</label>
</div>
</div>
<div class="gender marginBottom">
<div class="text">{{$t('Habit.Gender')}}：</div>
<div class="text">{{$t('Habit.Gender')}}:</div>
<div class="radio">
<label>
<input type="radio" name="gender" v-model="selectObject.sex" value="Female">
<input type="radio" :disabled="status == 'edit'" name="gender" v-model="selectObject.sex" value="Female">
<span>{{$t('Habit.Female')}}</span>
</label>
<label>
<input type="radio" name="gender" v-model="selectObject.sex" value="Male">
<input type="radio" :disabled="status == 'edit'" name="gender" v-model="selectObject.sex" value="Male">
<span>{{$t('Habit.Male')}}</span>
</label>
</div>
@@ -39,14 +39,14 @@
<div class="gallery_btn" style="line-height: 5rem;" @click="setStyle">{{ $t('Habit.Select') }}</div>
</div>
<div class="style marginBottom brand">
<div class="text">{{$t('Habit.Brand')}}</div>
<div class="text">{{$t('Habit.Brand')}}:</div>
<div class="text"><img v-show="selectObject.userBrandDna" :src="selectObject.userBrandDnaImg"></div>
<!-- <div class="text"><img v-show="selectObject.userBrandDna" :src="selectObject.userBrandDnaImg">{{ selectObject.userBrandDnaName }}</div> -->
<div class="gallery_btn" style="line-height: 5rem;" @click="setBrandDNA">{{ $t('Habit.Select') }}</div>
</div>
<div class="brandDNAStrenght marginBottom" v-if="selectObject.userBrandDna">
<div class="text">
{{$t('Habit.BrandStrength')}}
{{$t('Habit.BrandStrength')}}:
</div>
<a-slider class="system_silder"
v-model:value="selectObject.brandPercentage"
@@ -75,10 +75,10 @@
<div class="text">
{{$t('Habit.Category')}}:
</div>
<generalMenu style="width:80%" :selectWidth="'100%'" :dataList="selectObject.positionList" @setprintModel="setprintModel" :item="selectObject.position"></generalMenu>
<generalMenu style="width:80%" :ulStyle="{background: '#fff'}" :selectWidth="'100%'" :dataList="selectObject.positionList" @setprintModel="setprintModel" :item="selectObject.position"></generalMenu>
</div>
<div class="complete">
<div class="gallery_btn" @click="complete">{{$t('Habit.Complete')}}</div>
<div class="gallery_btn" @click="complete">{{$t('HomeView.Start')}}</div>
</div>
</div>
<habitSetStyle ref="habitSetStyle" @setWorkspaceStyle="setWorkspaceStyle" :mannequinStyle="mannequinStyle"></habitSetStyle>
@@ -120,6 +120,10 @@ export default defineComponent({
firstTime:{
type:Boolean,
default:false
},
status:{
type:String,
default:''
}
},
emits:['setProject'],
@@ -194,9 +198,9 @@ export default defineComponent({
name:data.selectObject.name,
process:props.httpWorkflowType,
styleId:data.show.style?data.selectObject.styleId:null,
id:data.selectObject.id,
id:data.selectObject.id == -1?'':data.selectObject.id,
workspace:{
id:data.selectObject.workspaceId,
id:data.workspaceId?.id == -1?'':data.workspaceId?.id,
sex:data.selectObject.sex,
// sex:data.show.gender?data.selectObject.sex:null,
systemDesignerPercentage:data.show.systemDesigner?data.selectObject.systemDesignerPercentage:null,
@@ -261,9 +265,9 @@ export default defineComponent({
onMounted(()=>{
store.commit('createProbject')
data.selectObject = JSON.parse(JSON.stringify(data.selectObject_))
data.selectObject.style = store.state.UserHabit.mannequinStyle[0].value
data.selectObject.styleName = store.state.UserHabit.mannequinStyle[0].name
data.selectObject.styleId = store.state.UserHabit.mannequinStyle[0].id
data.selectObject.style = store.state.UserHabit?.mannequinStyle?.[0]?.value
data.selectObject.styleName = store.state.UserHabit?.mannequinStyle?.[0]?.name
data.selectObject.styleId = store.state.UserHabit?.mannequinStyle?.[0]?.id
})
onBeforeUnmount(()=>{
})
@@ -315,6 +319,7 @@ export default defineComponent({
padding: 0 5rem;
width: 100%;
padding: 0;
overflow-y: auto;
// display: flex;
// flex-wrap: wrap;
// justify-content: space-between;

141
src/component/home/tools/deReconstruction/canvas/index.vue
View File

@@ -3,12 +3,19 @@
<div class="canvasBox" ref="canvasBox">
<editCanvas v-if="canvasLoad" ref="editCanvas"
:config="canvasConfig"
:clothingImageUrl="modelUrl"
:clothingImageUrl="changeImageUrl"
@changeCanvas="changeCanvas"
:clothing-image-opts="{
imageMode:'contains',
}"
></editCanvas>
>
<template #customTools="{ toolButtonProps }">
<div class="custom-tool-btn" :class="{active:isHiddenModel}" @click="setHiddenmodel()">
<i class="fi fi-rr-eye"></i>
<div class="tool-tooltip">Hidden model</div>
</div>
</template>
</editCanvas>
</div>
<div class="mark_loading" v-show="isShowMark">
<a-spin size="large" />
@@ -24,12 +31,26 @@ import { useStore } from "vuex";
import { useI18n } from "vue-i18n";
import canvasGeneral from "@/tool/canvasGeneralCopy";
import editCanvas from "@/component/Canvas/CanvasEditor/index.vue";
import defaultModel from "@/assets/images/homePage/defaultModel.png"
import FemaleAdultModel from "@/assets/images/homePage/FemaleAdultModel.png"
import FemaleChildModel from "@/assets/images/homePage/FemaleChildModel.png"
import MaleAdultModel from "@/assets/images/homePage/MaleAdultModel.png"
import MaleChildModel from "@/assets/images/homePage/MaleChildModel.png"
export default defineComponent({
components: {
editCanvas,
},
props:{
selectSexAge:{
type:Object,
default:()=>{
return {
sex:'',
age:'',
}
}
}
},
emits:['setGenerateImg','setCanvasJSON'],
setup(props,{emit}) {
const { t } = useI18n();
@@ -40,10 +61,11 @@ export default defineComponent({
const createProbject = inject('createProbject',()=>{})
const data = reactive({
canvasLoad:false,
isHiddenModel:true,
canvasConfig:{},
modelUrl:'',
probjects:computed(()=>store.state.Workspace.probjects),
undoStack:0,
changeImageUrl:'',
})
const dataDom = reactive({
editCanvas:null,
@@ -52,19 +74,31 @@ export default defineComponent({
const openSetData = ()=>{
// dataDom.canvasContent.openSetData()
}
const addImage = async (value)=>{
if(!data?.probjects?.id){
await createProbject()
const setFixedImg = ()=>{
let sex = props.selectSexAge.value
let age = props.selectSexAge.age
let changeImageUrl = ''
if(sex == 'Male' && age == 'Adult'){
changeImageUrl = MaleAdultModel
}else if(sex == 'Male' && age == 'Child'){
changeImageUrl = MaleChildModel
}else if(sex == 'Female' && age == 'Adult'){
changeImageUrl = FemaleAdultModel
}else if(sex == 'Female' && age == 'Child'){
changeImageUrl = FemaleChildModel
}
// dataDom.editCanvas.addImageToLayer(value.imgUrl)
dataDom.editCanvas.addImageToLayer(value.url)
changeImageUrl = new URL(changeImageUrl, import.meta.url).href
return changeImageUrl
}
const addBottomImage = (value)=>{
dataDom.editCanvas.changeFixedImage(value)
const changeFixedImage = async ()=>{
await nextTick()
data.changeImageUrl = setFixedImg()
dataDom.editCanvas.changeFixedImage(data.changeImageUrl, {
imageMode: "contains", // 设置底图包含在画布内
});
}
const getData = async ()=>{
console.log(dataDom.editCanvas.getCanvasManager().commandManager)
// if(dataDom.editCanvas.getState())
dataDom.editCanvas.exportImage({isContainBg:false,isContainFixed:false}).then((rv)=>{
emit('setGenerateImg',rv)
})
@@ -75,7 +109,6 @@ export default defineComponent({
const setCanvas = (url)=>{
return new Promise((res,rev)=>{
let img = new Image()
console.log(url)
img.onload = ()=>{
let wH = [1,1]
let domHeight = dataDom.canvasBox.offsetHeight - 200
@@ -99,16 +132,26 @@ export default defineComponent({
emit('setCanvasJSON',getCanvasJSON())
},5000)
}
const setHiddenmodel = ()=>{
data.isHiddenModel = !data.isHiddenModel
let index = dataDom.editCanvas.layers.findIndex((item)=>item.type == "fixed")
let layerId = dataDom.editCanvas.layers[index].id
let canvasManager = dataDom.editCanvas.getCanvasManager()
canvasManager?.layerManager?.toggleLayerVisibility(layerId);
}
const addImage = (url)=>{
dataDom.editCanvas.addImageToLayer(url.url,{imageMode:'contains'})
}
onMounted(() => {
nextTick(()=>{
let url = new URL(defaultModel, import.meta.url).href
data.modelUrl = url
setCanvas(url).then(()=>{
data.changeImageUrl = setFixedImg()
setCanvas(data.changeImageUrl).then(()=>{
})
})
});
onBeforeUnmount(()=>{
data.canvasLoad = false
data.isHiddenModel = true
// canvasGeneral.canvasClear()
})
return {
@@ -116,10 +159,12 @@ export default defineComponent({
...toRefs(dataDom),
isShowMark,
openSetData,
addImage,
getData,
getCanvasJSON,
changeCanvas,
changeFixedImage,
setHiddenmodel,
addImage,
};
},
data(prop) {
@@ -150,5 +195,65 @@ export default defineComponent({
width: 100%;
height: 100%;
}
.custom-tool-btn {
position: relative;
width: 36px;
height: 36px;
display: flex;
align-items: center;
justify-content: center;
background: none;
border: none;
border-radius: 4px;
cursor: pointer;
font-size: 16px;
color: #333;
transition: all 0.2s ease;
i{
font-size: 3rem;
display: flex;
}
&.active{
background-color: #e6f7ff;
color: #1890ff;
}
}
.custom-tool-btn:hover {
background-color: #f0f0f0;
&.active{
background-color: #e6f7ff;
color: #1890ff;
}
}
.custom-tool-btn:hover .tool-tooltip {
display: block;
}
.tool-tooltip {
display: none;
position: absolute;
left: 100%;
top: 50%;
transform: translateY(-50%);
background-color: rgba(0, 0, 0, 0.7);
color: white;
padding: 4px 8px;
border-radius: 4px;
margin-left: 8px;
white-space: nowrap;
font-size: 12px;
z-index: 10;
}
.tool-tooltip:before {
content: "";
position: absolute;
top: 50%;
right: 100%;
margin-top: -5px;
border-width: 5px;
border-style: solid;
border-color: transparent rgba(0, 0, 0, 0.7) transparent transparent;
}
}
</style>

79
src/component/home/tools/deReconstruction/index.vue
View File

@@ -17,11 +17,11 @@
<div class="generalModel_state_item smail" style="margin-right: 0">
<a-select
ref="select"
v-model:value="sex"
v-model:value="sexId"
:options="sexList"
size="large"
:fieldNames="{ label: 'name', value: 'value' }"
style="width:10rem"
:fieldNames="{ label: 'name', value: 'id' }"
style="width:13rem"
@change="sexChange"
>
<template #suffixIcon
@@ -37,7 +37,7 @@
</selectList>
</div>
<div class="canvas itemBox">
<canvasBox @setGenerateImg="setGenerateImg" @setCanvasJSON="setCanvasJSON" ref="canvasBox"></canvasBox>
<canvasBox @setGenerateImg="setGenerateImg" :selectSexAge="selectSexAge" @setCanvasJSON="setCanvasJSON" ref="canvasBox"></canvasBox>
<!-- <canvasUpload :config="ceditorConfig" clothingImageUrl="https://www.minio-api.aida.com.hk/aida-sys-image/models/female/2e4815b9-1191-419d-94ed-5771239ca4a5.png?response-content-type=image%2Fpng&response-content-disposition=inline&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=admin%2F20250608%2Fus-east-1%2Fs3%2Faws4_request&X-Amz-Date=20250608T161025Z&X-Amz-Expires=86400&X-Amz-SignedHeaders=host&X-Amz-Signature=a4374c0954d11c2490ef3b86a1924cf6d423ed8ac56023b3c3ccabcdf0672620"></canvasUpload> -->
</div>
<div class="finished itemBox">
@@ -48,7 +48,7 @@
</div>
<div class="content">
<img v-if="generateImg?.[0]?.url" :src="generateImg?.[0]?.url" alt="">
<sketchCategory v-if="generateImg?.[0]?.url" v-model:disignTypeList="sketchCatecoryList" :item="generateImg[0]" :isSpread="false"></sketchCategory>
<sketchCategory v-if="generateImg?.[0]?.url" v-model:disignTypeList="sketchCatecoryList" :item="generateImg[0]" :isSetSketchCategory="true" :isSpread="false"></sketchCategory>
</div>
<div class="btnBottom" @click="getCanvasData">
<div class="gallery_btn">{{ $t('DeReconstruction.Download') }}</div>
@@ -61,6 +61,7 @@ import { defineComponent,computed,ref,provide,nextTick,createVNode,toRefs, react
import { ExclamationCircleOutlined } from '@ant-design/icons-vue';
import { Https } from "@/tool/https";
import { useStore } from "vuex";
import { downloadIamge,getMinioUrl } from "@/tool/util";
import { useI18n } from 'vue-i18n'
import selectList from '@/component/DetailCopy/detailLeft/module/selectList.vue'
import sketchCategory from "@/component/HomePage/sketchCategory.vue";
@@ -76,37 +77,49 @@ export default defineComponent({
emits:[],
setup(props,{emit}) {
const store = useStore();
const {t} = useI18n()
const data = reactive({
sketchCatecoryList:computed(()=>{
return store.state.Workspace.probjects.positionList
}),
sketchCatecoryList:[],
segmentationType:'product',
segmentationTypeList:[{value:'product',name:'product'},{value:'sketch',name:'sketch'}],
generateImg:computed(()=>store.state.HomeStoreModule.deReconstruction) as any,
selectObject:computed(()=>store.state.Workspace.probjects),//选择的项目
sexList:[
],
// sexList:computed(()=>store.state.UserHabit.sex.value),
femalePosition:computed(()=>store.state.UserHabit.FemalePosition),//男性衣服位置
malePosition:computed(()=>store.state.UserHabit.MalePosition),//女性衣服位置
sex:'Male',
sexId:1,
ceditorConfig:{
width: 800,
height: 600,
backgroundColor: "#f8f8f8",
},
defaultModel:'',
selectSexAge:{},
})
const createProbject:any = inject('createProbject',()=>{}) as any
const setIsShowMark:any = inject('setIsShowMark')
const dataDom = reactive({
canvasBox:null as any,
})
const selectImgItem = (data:any)=>{
console.log(data)
const selectImgItem = async (value:any)=>{
// getSegmentation(data)
getSegmentation(data)
if(!data.selectObject?.id)await createProbject()
getSegmentation(value)
}
const canvasAddImg = (list:any)=>{
console.log(list)
list.segmentedImages.forEach((url:any) => {
list.imgUrl = url
dataDom.canvasBox.addImage({url})
});
}
const getSegmentation = (value:any)=>{
console.log(value)
let segmentationType = ''
if(value.designType == "Library"){
segmentationType = 'sketch'
@@ -191,7 +204,13 @@ export default defineComponent({
}
const setCanvasJSON = (canvasJSON)=>{
if(!canvasJSON)return
let blob = new Blob([canvasJSON], { type: "application/json" });
let canvasData = JSON.parse(canvasJSON)
console.log(canvasData)
canvasData.canvas.objects.forEach((objectsItem:any) => {
if(objectsItem.type == 'image')objectsItem.minioUrl = getMinioUrl(objectsItem.src)
});
let blob = new Blob([JSON.stringify(canvasData)], { type: "application/json" });
let formData = new FormData();
formData.append("file", blob, "data.json");
formData.append("module", "deReconstruction");
@@ -201,7 +220,6 @@ export default defineComponent({
};
Https.axiosPost(Https.httpUrls.exportSave, formData, config).then(
(rv) => {
console.log(rv)
}
);
}
@@ -209,9 +227,39 @@ export default defineComponent({
dataDom.canvasBox.setCanvas(str)
}
const getCanvasData = ()=>{
let data = dataDom.canvasBox.getCanvasData()
return data
downloadIamge(data.generateImg[0].url,'downloadIamge')
}
const sexChange = ()=>{
data.selectSexAge = data.sexList.filter((item)=>item.id == data.sexId)[0]
store.commit('setProbject',{sex:data.selectSexAge.value})
if(data.selectSexAge.value == 'Male'){
data.sketchCatecoryList = data.malePosition
}else{
data.sketchCatecoryList = data.femalePosition
}
if(dataDom.canvasBox?.canvasLoad)dataDom.canvasBox.changeFixedImage()
}
onMounted(()=>{
let sexList = store.state.UserHabit.sex.value
let id = 0
data.sexList = []
sexList.forEach((item:any,index) => {
let obj = {
age:'Adult',
name:item.name,
value:item.value,
id:index + 1,
} as any
id = index+1;
data.sexList.push(obj)
});
data.sexList.push({age:'Child',name:t('DeReconstruction.Girls'),value:'Female',id:id+=1})
data.sexList.push({age:'Child',name:t('DeReconstruction.Boys'),value:'Male',id:id+=1})
data.sex = data.sexList[0].value
data.selectSexAge = data.sexList[0]
data.sexId = 1
sexChange()
})
return{
...toRefs(dataDom),
...toRefs(data),
@@ -223,6 +271,7 @@ export default defineComponent({
getCanvasData,
setCanvas,
setCanvasJSON,
sexChange,
}
},
provide() {

10
src/component/home/tools/patternMaking3D/index.vue
View File

@@ -83,7 +83,7 @@
<download ref="download"></download>
</div>
<collection ref="collection" :isNext="false"></collection>
<scaleImage ref="scaleImage"></scaleImage>
<scaleImage ref="scaleImage" :maxWidth="'100rem'"></scaleImage>
</div>
</template>
<script lang="ts">
@@ -141,7 +141,7 @@ export default defineComponent({
}
const createProbject:any = inject('createProbject',()=>{}) as any
const setSelectModel = async (item:any)=>{
if(!data.selectObject.id)await createProbject()
if(!data.selectObject?.id)await createProbject()
data.isShowMark = true
if(!item.threeDSimpleId)return
const value = {
@@ -165,7 +165,7 @@ export default defineComponent({
})
}
const setSelectPrint = async (item:any)=>{
if(!data.selectObject.id)await createProbject()
if(!data.selectObject?.id)await createProbject()
let patternMaking3DData = {
collectionElementId:item.id,
url:item.imgUrl,
@@ -239,7 +239,7 @@ export default defineComponent({
}
const setPrint = async (item:any)=>{
if(dataDom.threeBox){
if(!data.selectObject.id)await createProbject()
if(!data.selectObject?.id)await createProbject()
dataDom.threeBox.addMaterial(item)
const stateData = {
printMinioUrl:getMinioUrl(item.imgUrl || item.url)
@@ -262,7 +262,7 @@ export default defineComponent({
if(!data[str])return
value[str] = data[str]
Https.axiosPost(Https.httpUrls.saveModuleContent, value).then((rv)=>{
if(rv.boundingBox)store.commit('setShowSketchboard',rv.boundingBox)
if(rv?.boundingBox)store.commit('setShowSketchboard',rv.boundingBox)
})
})
},2000)

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

@@ -18,12 +18,12 @@
<div class="" v-if="item.status == 'uploading'" style="display: flex;align-items: center;">
<a-spin size="large" />
</div>
<img v-show="item.status != 'uploading'" :src="item.designOutfitUrl || item.imgUrl || item.url" alt="">
<div v-show="item.status != 'uploading'" class="btnBox">
<img v-show="item.designOutfitUrl || item.imgUrl || item.url" :src="item.designOutfitUrl || item.imgUrl || item.url" alt="">
<div v-show="item.designOutfitUrl || item.imgUrl || item.url" class="btnBox">
<div :class="{active:item.isChecked}">
<i class="fi fi-br-check"></i>
</div>
<div @click.stop="setUploadDelete(item,index)">
<div @click.stop="setUploadDelete(item,index)" v-if="source != 'design'">
<i class="fi fi-rr-trash icon_delete"></i>
</div>
</div>
@@ -97,7 +97,7 @@
</div>
<div class="likeBox">
<div class="element">
<div class="title"><i class="fi fi-rs-comments"></i><span>{{$t('poseTransfer.InputVideo')}}</span></div>
<div class="title"><i class="fi fi-rs-comments"></i><span>{{$t('poseTransfer.LikeVideo')}}</span></div>
<div class="content">
<generalDrag ref="generalDragLeft" :list="likeList" :isLike="true" :isVideo="true" @setBtn="likeSetBtn"></generalDrag>
</div>
@@ -142,6 +142,10 @@ export default defineComponent({
type:Boolean,
default:false,
},
source:{
type:String,
default:'',
},
},
emits:[],
setup(props,{emit}) {
@@ -253,10 +257,29 @@ export default defineComponent({
dataDom.generalDragRight.setItemPosition()
},200)
}
const getgenerate = ()=>{
if(!data.selectImg.minioUrl)return
const getgenerate = async ()=>{
if(!data.selectImg.minioUrl)return message.info(t('ProductImg.jsContent2'))
if(data.isGenerate)return
await new Promise((res,reject)=>{
Modal.confirm({
title: t('poseTransfer.jsContent1'),
icon: createVNode(ExclamationCircleOutlined),
okText: 'Yes',
cancelText: 'No',
mask:false,
centered:true,
onOk() {
res()
},
cancel(){
reject()
}
});
}).then(()=>{
}).catch(()=>{
return
})
data.isGenerate = true
// data.remGenerateTime = setTimeout(()=>{
// },10000)
@@ -265,12 +288,15 @@ export default defineComponent({
projectId:store.state.Workspace.probjects.id,
productImage:data.selectImg.minioUrl,
modelName:speed.speedData.value,
isDefaultLike:false,//表示是否生成就like
parentId:data.selectImg?.parentId,//parentId 添加在指定父级里面
userLikeSortId:null,//是否进行排序
}
Https.axiosPost(Https.httpUrls.poseTransform,value).then((rv)=>{
data.remGenerate = true
data.noLikeList.unshift({taskId:rv,parentId:data.selectImg.parentId})
data.noLikeList.unshift({taskId:rv.taskId,parentId:data.selectImg.parentId})
console.log(data.noLikeList)
setGenerate(rv)
setGenerate([rv.taskId])
}).catch((res:any)=>{
data.isGenerate = false
clearInterval(data.remGenerateTime)
@@ -285,7 +311,7 @@ export default defineComponent({
if(!data.isGenerate || !data.remGenerate)return
if(!state)return
state = false
Https.axiosPost(Https.httpUrls.poseTransformResult,{taskId:list}).then(
Https.axiosPost(Https.httpUrls.poseTransformResult,list).then(
(rv) => {
rv=[rv]
state = true
@@ -408,7 +434,14 @@ export default defineComponent({
}
const noLikeSetBtn = (id:any,str:string)=>{
if(str == 'delete'){
data.noLikeList = data.noLikeList.filter((v:any) => v.id != id);
let value = {
id,
projectId:store.state.Workspace.probjects.id
}
Https.axiosGet(Https.httpUrls.generateDeleteResult,{params:value}).then(()=>{
let index = data.noLikeList.findIndex((v:any) => v.id == id)
data.noLikeList.splice(index,1)
})
}else{
data.noLikeList.forEach((item:any,index:any)=>{
if(item.id == id && id){
@@ -496,19 +529,28 @@ export default defineComponent({
store.commit('setUploadElement',storeData)
})
}
watch(()=>store.state.HomeStoreModule.uploadElement.length,(newVal,oldVal)=>{
if(props.isDesignPage)return
data.fileList = store.state.HomeStoreModule.uploadElement
})
watch(()=>store.state.Workspace.probjects.id,(newVal,oldVal)=>{
nextTick(()=>{
data.fileList = store.state.HomeStoreModule.uploadElement
let list = store.state.HomeStoreModule.poseTransfer.list
let taskIdList = list.filter((item:any)=>!item.id)
let taskIdList = list.filter((item:any)=>!item.videoUrl)
if(taskIdList.length > 0){
data.isGenerate = true
data.remGenerate = true
console.log(taskIdList)
setGenerate(taskIdList[0].taskId)
setGenerate([taskIdList[0].taskId])
}
})
},{immediate: true })
onBeforeUnmount(()=>{
clearInterval(data.generateTime)
clearInterval(data.remGenerateTime)
data.isGenerate = false
data.remGenerate = false
})
return{
...toRefs(speed),
...toRefs(dataDom),
@@ -813,7 +855,7 @@ export default defineComponent({
}
> .designPage{
padding-left: 4rem;
margin-right: 4rem;
}
> .noLikeBox{
padding-left: 2.3rem;

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

@@ -6,13 +6,13 @@
<div class="modal_title_text_intro"></div>
</div> -->
<div class="productImg_content_bottom">
<div class="productImg_left" :class="{active:button.left}">
<div class="productImg_left generalModel_state" :class="{active:button.left}">
<!-- <div class="productImg_content_item_title productImg_content_item_title_menu">
<generalMenu class="productImg_content_item_title_menubtn" :class="{hideEvents:driver__.driver}" :dataList="productimgMenuList" @setprintModel="setproduct" :item="productimgMenu"></generalMenu>
</div> -->
<div class="selectImg">
<div class="selectImg" style="margin-bottom:2rem">
<div class="head">
<div class="text">{{$t('ProductImg.SelectCollection')}}</div>
<div class="text">{{source == 'design'?$t('ProductImg.DesignSelectCollection'):productimgMenu.value == 'ToProductImage'?$t('ProductImg.SelectCollection'):$t('ProductImg.SelectCollectionRelight')}}</div>
</div>
<div class="imgBox" v-mousewheel>
<!-- <div class="item" :class="[item?.isChecked?'active':'']" v-for="item in selectList[productimgMenu.value]" @click="setGenerate(item)">
@@ -28,7 +28,7 @@
<div :class="{active:item.isChecked}">
<i class="fi fi-br-check"></i>
</div>
<div @click.stop="setUploadDelete(item,index)">
<div @click.stop="setUploadDelete(item,index)" v-if="source != 'design'">
<i class="fi fi-rr-trash icon_delete"></i>
</div>
</div>
@@ -61,30 +61,31 @@
</div>
</div>
</div>
<div v-show="productimgMenu.value == 'ToProductImage'" class="productImg_content_item_title productImg_content_item_title_similarity">
<div v-show="productimgMenu.value == 'ToProductImage' && speedData.value != 'flux'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.Similarity')}}</span>
</div>
<div v-show="productimgMenu.value == 'ToProductImage'" class="productImg_content_item_similarity">
<div v-show="productimgMenu.value == 'ToProductImage' && speedData.value != 'flux'" class="productImg_content_item_similarity">
<a-slider class="system_silder"
v-model:value="similarity"
@afterChange="setSimilarity"
:tooltipVisible="false"
:step="5"
:max="70"
>
</a-slider>
<input type="number" readonly v-model="similarity">
<input style="margin-left: 2rem;" type="number" readonly v-model="similarity">
</div>
<div v-show="productimgMenu.value == 'Relight'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.SelectionFunction')}}</span>
</div>
<div v-show="productimgMenu.value == 'Relight'" class="productImg_content_item_Direction">
<a-select style="width: 100%;" v-model:value="speedData.value" :options="speedList" :field-names="{ label: 'relightLabel', value: 'value' }"></a-select>
<div v-show="productimgMenu.value == 'Relight'" class="productImg_content_item_Direction generalModel_state_item">
<a-select size="large" style="width: 100%;" v-model:value="speedData.value" :options="speedList" :field-names="{ label: 'relightLabel', value: 'value' }"></a-select>
</div>
<div v-show="productimgMenu.value == 'Relight' && speedData.value != 'flux'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.RelightDirection')}}</span>
</div>
<div v-show="productimgMenu.value == 'Relight' && speedData.value != 'flux'" class="productImg_content_item_Direction">
<a-select style="width: 100%;" v-model:value="RelightDirection" :options="RelightDirectionList"></a-select>
<div v-show="productimgMenu.value == 'Relight' && speedData.value != 'flux'" class="productImg_content_item_Direction generalModel_state_item">
<a-select size="large" style="width: 100%;" v-model:value="RelightDirection" :options="RelightDirectionList"></a-select>
</div>
<div v-show="productimgMenu.value == 'Relight' && speedData.value != 'flux'" class="productImg_content_item_title productImg_content_item_title_similarity">
<span>{{$t('ProductImg.Highlight')}}</span>
@@ -98,7 +99,7 @@
:step="0.1"
>
</a-slider>
<input type="number" readonly v-model="brightenValue">
<input style="margin-left: 2rem;" type="number" readonly v-model="brightenValue">
</div>
<div class="input_border productImg_content_item_generate">
<div class="input_box">
@@ -111,6 +112,7 @@
/> -->
<textarea
class="textarea"
ref="textarea"
@input="ifMaximumLength"
:placeholder="productimgMenu.value == 'Relight'?$t('ProductImg.relightInput'):$t('ProductImg.productInput')"
@keydown.enter.prevent="getPrductimg()"
@@ -119,6 +121,9 @@
</div>
</div>
</div>
<div class="selectText" v-show="productimgMenu.value == 'ToProductImage' && speedData.value == 'flux'">
<div :title="$t('poseTransfer.hint')" @click="()=>{searchName[productimgMenu.value] = $t('poseTransfer.hint');ifMaximumLength()}">{{ $t('poseTransfer.hint') }}</div>
</div>
<div class="productImg_content_item_generate_btn input_border">
<div class="generage_btn_box ">
<div v-show="!isProductimg" class="generage_btn started_btn">
@@ -143,7 +148,7 @@
<div class="productImg_right_item_box generalScroll">
<div class="content_header_left">
<i class="fi fi-rs-comments"></i><span class="content_header_des">
{{ $t('ProductImg.SelectedDesign') }}
{{source == 'design'?$t('ProductImg.DesignSelectedDesign'):$t('ProductImg.SelectedDesign')}}
</span>
</div>
<div class="content">
@@ -163,11 +168,11 @@
<div class="productImg_right_item_box right generalScroll">
<div class="content_header_left">
<i class="fi fi-rs-comments"></i><span class="content_header_des">
{{ $t('ProductImg.productImageDrafts') }}
{{source == 'design'?$t('ProductImg.DesignproductImageDrafts'):$t('ProductImg.productImageDrafts')}}
</span>
</div>
<div class="content">
<generalDrag ref="generalDragRight" :type="productimgMenu.value" :isCopy="!isDesignPage" @setBtn="generateSetBtn" :list="generateList" :showMark="isShowMark"></generalDrag>
<generalDrag ref="generalDragRight" :type="productimgMenu.value" :isCopy="!isDesignPage" @setBtn="generateSetBtn" :list="generateList[productimgMenu.value]" :showMark="isShowMark"></generalDrag>
</div>
</div>
</div>
@@ -217,6 +222,10 @@ export default defineComponent({
return {}
}
},
source:{
type:String,
default:'',
},
productimgMenu:{
type:Object,
default:()=>{
@@ -252,11 +261,14 @@ export default defineComponent({
remProductimg:false,//是否出现取消按钮
isProductimg:false,//开始生成
selectProductimgList:[],
generateList:[],
generateList:{
ToProductImage:computed(()=>store.state.HomeStoreModule.toProductImageList.list),
Relight:computed(()=>store.state.HomeStoreModule.relightList.list),
},
selectObject:computed(()=>store.state.Workspace.probjects),//选择的项目
likeList:{
ToProductImage:computed(()=>store.state.HomeStoreModule.toProductImageList),
Relight:computed(()=>store.state.HomeStoreModule.relightList),
ToProductImage:computed(()=>store.state.HomeStoreModule.toProductImageList.likedList),
Relight:computed(()=>store.state.HomeStoreModule.relightList.likedList),
} as any,
similarity:30,
brightenValue:1,
@@ -265,6 +277,7 @@ export default defineComponent({
left:false,
right:false,
},
textarea:null as any,
})
let speed = reactive({
speedList:[
@@ -288,17 +301,14 @@ export default defineComponent({
value:'flux',
},
})
//watch立即执行一次
watch(()=>productImgData.selectObject.id,(newVal,oldVal)=>{
createProbject.generateList = []
},{immediate: true })
watch(() => route.query.id,
(query:any, oldQuery:any) => {
if(oldQuery && query != oldQuery){
productImgData.generateList = []
}
},
);
// watch(() => route.query.id,
// (query:any, oldQuery:any) => {
// if(oldQuery && query != oldQuery){
// productImgData.generateList = []
// }
// },
// );
watch(()=>store.state.HomeStoreModule.uploadElement.length,(newVal,oldVal)=>{
if(props.isDesignPage)return
productImgData.fileList[props.productimgMenu.value] = store.state.HomeStoreModule.uploadElement
@@ -360,11 +370,11 @@ export default defineComponent({
let arr = store.state.UploadFilesModule.cloudList
if(props.productimgMenu.value == 'ToProductImage'){
let list = JSON.parse(JSON.stringify(arr.toProduct)) || []
productImgData.generateList.unshift(...list)
productImgData.generateList[props.productimgMenu.value].unshift(...list)
store.commit('clearCloudList','ToProductImage')
}else if(props.productimgMenu.value == 'Relight'){
let list = JSON.parse(JSON.stringify(arr.relight)) || []
productImgData.generateList.unshift(...list)
productImgData.generateList[props.productimgMenu.value].unshift(...list)
store.commit('clearCloudList','relight')
}
@@ -383,7 +393,7 @@ export default defineComponent({
item.imgUrl = item.url
});
let value = {
list: rv,
likedList: rv,
str:'add',
index:-1,
}
@@ -466,6 +476,7 @@ export default defineComponent({
})
}
let likeFile = (item:any,str:any,index:any) =>{
console.log(item)
let url
let data = {
toProductImageResultId:[item.id],
@@ -480,8 +491,10 @@ export default defineComponent({
Https.axiosPost(url, data).then(
(rv) => {
if(str == 'like'){
if(rv?.sort)item.oldSort = rv.sort
if(rv?.id)item.userLikeSortId = rv.id
let value = {
list:[item],
likedList:[item],
str:'add',
index:-1,
}
@@ -490,14 +503,14 @@ export default defineComponent({
}else{
store.commit("setRelightList", value);
}
productImgData.generateList.splice(index,1)
productImgData.generateList[props.productimgMenu.value].splice(index,1)
}else{
let value = {
list:[item],
likedList:[item],
str:'splice',
index:index,
}
productImgData.generateList.push(item)
productImgData.generateList[props.productimgMenu.value].push(item)
if(props.productimgMenu.value == 'ToProductImage'){
store.commit("setToProductImage", value);
}else{
@@ -524,17 +537,20 @@ export default defineComponent({
"taskId": "",
"toProductImageRecordId": 0,
"url": "",
parentId:null,
}
if(productImgData.fileList[props.productimgMenu.value]){
productImgData.fileList[props.productimgMenu.value].forEach((item:any)=>{
console.log(item)
if(item.isChecked){
if(item.resultType == 'Design'){
obj.elementId = item.designOutfitId
obj.elementType = 'DesignOutfit'
}else{
obj.elementId = item.id
obj.elementType = item.type || 'ProductElement'
obj.elementType = item.resultType || 'ProductElement'
}
obj.parentId = item?.parentId || item?.userLikeSortId,
selectArr.push(JSON.parse(JSON.stringify(obj)))
}
})
@@ -553,6 +569,8 @@ export default defineComponent({
direction:RelightDirection.value,
brightenValue:productImgData.brightenValue,
imageStrength:(100 - imageStrength)/100,
isDefaultLike:false,//表示是否生成就like
}
productImgData.isProductimg = true
// remPrductimgTime = setTimeout(()=>{
@@ -571,7 +589,7 @@ export default defineComponent({
rv.forEach((item:any)=>{
arr.push(item.taskId)
})
productImgData.generateList.unshift(...rv)
productImgData.generateList[props.productimgMenu.value].unshift(...rv)
setPrductimg(arr)
}
).catch(res=>{
@@ -621,17 +639,14 @@ export default defineComponent({
rv.forEach((element:any) => {
if(element.status == 'Success'){
element.imgUrl = element.url
// if(!productImgData.generateList[props.productimgMenu.value]){
// productImgData.generateList[props.productimgMenu.value] = []
// }
let index = productImgData.generateList.findIndex((obj:any) => obj.taskId === element.taskId);
productImgData.generateList[index] = element
let index = productImgData.generateList[props.productimgMenu.value].findIndex((obj:any) => obj.taskId === element.taskId);
productImgData.generateList[props.productimgMenu.value][index] = element
// productImgData.generateList[props.productimgMenu.value].unshift(element)
data = data.filter((item:any) => item !== element.taskId);
}else if(element.status == 'Fail'){
message.info(t('ProductImg.jsContent3'))
let index = productImgData.generateList.findIndex((obj:any) => obj.taskId === element.taskId);
productImgData.generateList.splice(index,1)
let index = productImgData.generateList[props.productimgMenu.value].findIndex((obj:any) => obj.taskId === element.taskId);
productImgData.generateList[props.productimgMenu.value].splice(index,1)
data = data.filter((item:any) => item !== element.taskId);
}
});
@@ -648,7 +663,7 @@ export default defineComponent({
}
}
).catch(res=>{
productImgData.generateList.filter((item:any)=>item.status == 'Success')
productImgData.generateList[props.productimgMenu.value].filter((item:any)=>item.status == 'Success')
clearInterval(prductimgTime)
clearInterval(remPrductimgTime)
productImgData.isProductimg = false
@@ -671,10 +686,10 @@ export default defineComponent({
Https.axiosGet(Https.httpUrls.generateStopWaiting, {params:data}).then(
(rv) => {
generateProceedList = []
productImgData.generateList = productImgData.generateList.filter((item:any)=>item.status == 'Success')
productImgData.generateList[props.productimgMenu.value] = productImgData.generateList[props.productimgMenu.value].filter((item:any)=>item.status == 'Success')
}
).catch(res=>{
productImgData.generateList = productImgData.generateList.filter((item:any)=>item.status == 'Success')
productImgData.generateList[props.productimgMenu.value] = productImgData.generateList[props.productimgMenu.value].filter((item:any)=>item.status == 'Success')
});
}
}
@@ -747,13 +762,24 @@ export default defineComponent({
}
const generateSetBtn = (id:any,str:string)=>{
if(str == 'delete'){
productImgData.generateList = productImgData.generateList.filter((v:any) => v.id != id);
let type = 'ToProductImage'
if(props.productimgMenu.value == 'Relight')type = 'Relight'
let value = {
type,
id,
projectId:productImgData.selectObject.id
}
Https.axiosGet(Https.httpUrls.historyDeleteResult,{params:value}).then(()=>{
let index = productImgData.generateList[props.productimgMenu.value].findIndex((v:any) => v.id == id)
productImgData.generateList[props.productimgMenu.value].splice(index,1)
})
// productImgData.generateList[props.productimgMenu.value] = productImgData.generateList[props.productimgMenu.value].filter((v:any) => v.id != id);
}else{
productImgData.generateList.forEach((item:any,index:number)=>{
productImgData.generateList[props.productimgMenu.value].forEach((item:any,index:number)=>{
if(item.id == id){
let selectStr = ''
str == 'zoom'?selectStr = 'zoom':selectStr ='like'
setLikeZoom(item,str,index,productImgData.generateList)
setLikeZoom(item,str,index,productImgData.generateList[props.productimgMenu.value])
}
})
}
@@ -778,8 +804,9 @@ export default defineComponent({
setItemPosition()
})
}
const ifMaximumLength = (event:any)=>{
let textarea = event.target as HTMLTextAreaElement;
const ifMaximumLength = async ()=>{
await nextTick()
let textarea = productImgData.textarea;
const scrollTop = textarea.scrollTop;
// 2. 计算单行高度
const lineHeight = parseInt(getComputedStyle(textarea).lineHeight) || 20; // 默认20px
@@ -803,6 +830,28 @@ export default defineComponent({
speed.speedState = false
document.removeEventListener('click',openSpeed)
}
//watch立即执行一次
watch(()=>productImgData.selectObject.id,(newVal,oldVal)=>{
createProbject.generateList = []
let list = []
if(props?.productimgMenu.value == "ToProductImage"){
list = store.state.HomeStoreModule.toProductImageList.list || []
}else{
list = store.state.HomeStoreModule.relightList.list || []
}
let taskIdList = list.filter((item:any)=>!item?.url)
if(taskIdList.length > 0){
let arr:any = []
taskIdList.forEach((item:any)=>{
arr.push(item.taskId)
})
productImgData.isProductimg = true
productImgData.remProductimg = true
productImgData.isShowMark = false
console.log(taskIdList)
setPrductimg(arr)
}
},{immediate: true })
return {
upload,
driver__,
@@ -1103,6 +1152,8 @@ export default defineComponent({
flex-direction: column;
padding-right: 3.8rem;
width: 39rem;
align-items: stretch;
flex-wrap: nowrap;
&.active{
width: 0;
padding: 0;
@@ -1154,19 +1205,29 @@ export default defineComponent({
}
.productImg_content_item_Direction{
padding-bottom: 1rem;
:deep(.ant-select){
margin-right: 0;
margin-bottom: 1rem;
}
.selectText{
margin-bottom: 2rem;
display: flex;
width: 100%;
> div{
background: #efeff1;
width: 100%;
font-size: 1.6rem;
.ant-select-selector::after{
line-height: 1;
margin-right: 1.2rem;
border-radius: 1.6rem;
cursor: pointer;
padding: 1.2rem;
white-space: nowrap; /* 文本不换行 */
overflow: hidden; /* 溢出部分隐藏 */
text-overflow: ellipsis; /* 显示省略号 */
&:hover{
background: #f5f5f5;
}
.ant-select-selector .ant-select-selection-item{
line-height: 1;
}
.ant-select-selector{
height: auto;
padding: 1rem 1rem;
box-shadow: none !important;
border: calc(0.1rem* 1.2) solid #F1F1F1;
&:first-child{
margin-right: 0;
}
}
}
@@ -1265,6 +1326,6 @@ export default defineComponent({
}
.designPage{
padding-left: 4rem;
margin-right: 4rem;
}
</style>