初代测试版本
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
<template>
|
||||
<div class="design_compile_content">
|
||||
<div class="design_compile_content" id="design_compile_content">
|
||||
<div class="designOpenrtion_centent" id="designOpenrtionCentent">
|
||||
<div class="designOpenrtion_imgMask" :style="frontBack?.body?.style">
|
||||
<!-- <div
|
||||
@@ -30,6 +30,7 @@
|
||||
</div>
|
||||
<div @click="setPreviewData" class="subitOkPreviewBtn">OK</div>
|
||||
</div>
|
||||
<div class="designOpenrtion_imgMask_open" @click.stop="deleteBorder"></div>
|
||||
<div class="mark_loading" v-show="loadingShow">
|
||||
<a-spin size="large" />
|
||||
</div>
|
||||
@@ -331,6 +332,11 @@ export default defineComponent({
|
||||
setPreviewData(){
|
||||
this.$emit('setSubmit','preview');
|
||||
},
|
||||
deleteBorder(){
|
||||
this.frontBack?.front?.forEach((item)=>{
|
||||
item.designOpenrtionBtn = false
|
||||
})
|
||||
},
|
||||
async setPreview(data){
|
||||
let ratio = this.frontBack.body.layersObject[0].imageSize[0]/this.frontBack.body.style.width.replace(/px/g,'')
|
||||
let designItemDetail = this.store.state.DesignDetailModule.designItemDetail
|
||||
@@ -389,120 +395,15 @@ export default defineComponent({
|
||||
i.layersObject = item.layersObject
|
||||
}
|
||||
})
|
||||
// data.designSingleItemDTOList.front.forEach((i)=>{
|
||||
// if(item.type === i.type){
|
||||
// // item.position = [
|
||||
// // item.position[0] += left,
|
||||
// // item.position[1] += top
|
||||
// // ]
|
||||
// console.log(item.position,left ,top);
|
||||
// i.layersObject = item.layersObject
|
||||
// }
|
||||
// })
|
||||
|
||||
})
|
||||
this.$emit('setDesignCoverage');
|
||||
this.store.commit("setDesignItemDetail", designItemDetail);
|
||||
// let designCollectionList = this.store.state.HomeStoreModule.designCollectionList
|
||||
// let likeDesignCollectionList = this.store.state.HomeStoreModule.likeDesignCollectionList
|
||||
// designCollectionList.forEach((item) => {
|
||||
// if(item.designItemId == rv.designItemId){
|
||||
// item.designOutfitUrl = rv.designItemUrl
|
||||
// }
|
||||
// });
|
||||
// likeDesignCollectionList.forEach((item) => {
|
||||
// if(item.designItemId == rv.designItemId){
|
||||
// item.designOutfitUrl = rv.designItemUrl
|
||||
// }
|
||||
// });
|
||||
// this.store.commit('setDesignCollectionList',designCollectionList)
|
||||
// this.store.commit('setLikeDesignCollectionList',likeDesignCollectionList)
|
||||
|
||||
}
|
||||
).catch(res=>{
|
||||
this.loadingShow = false
|
||||
});
|
||||
//顺序不能乱
|
||||
// let arr = [...this.frontBack.front,...this.frontBack.back,...this.frontBack.body.layersObject]
|
||||
// let layers=[]
|
||||
// let num = 0
|
||||
// let front = this.frontBack.back.length+2
|
||||
// let back = this.frontBack.back.length-1
|
||||
// let str
|
||||
// arr.forEach(item => {
|
||||
// let obj
|
||||
// if(item.imageCategory == 'body'){
|
||||
// obj = item
|
||||
// obj.priority = this.frontBack.back.length+1
|
||||
// }else{
|
||||
// str = str?str:item?.imageCategory.split('_')[0]
|
||||
// obj = {
|
||||
// id:item.id,
|
||||
// imageCategory:item.imageCategory,
|
||||
// scale:item?.imageSize?Number(((item?.style?.width.replace(/px/g,'')*ratio)/item?.imageSize[0]).toFixed(2)):1,
|
||||
// position:[Number((item?.style?.top?.replace(/px/g,'')*ratio).toFixed(0)),Number((item?.style?.left?.replace(/px/g,'')*ratio).toFixed(0))],
|
||||
// imageSize: item.imageSize,
|
||||
// priority:item.style.zIndex,
|
||||
// }
|
||||
// if(item?.imageCategory?.indexOf("front") == -1){
|
||||
// // if(str == item?.imageCategory.split('_')[0])
|
||||
// if(str == item?.imageCategory.split('_')[0]){
|
||||
// num = 0
|
||||
// back = this.frontBack.back.length-1
|
||||
// }else{
|
||||
// num = 1
|
||||
// back++
|
||||
// }
|
||||
// obj.scale = layers[num].scale
|
||||
// obj.position = layers[num].position
|
||||
// obj.imageSize = layers[num].imageSize
|
||||
// obj.priority = back
|
||||
// }else{
|
||||
// obj.priority = front++
|
||||
// }
|
||||
|
||||
// }
|
||||
// obj.imageUrl = item.imageMinioUrl
|
||||
// obj.maskUrl = item.maskMinioUrl
|
||||
// layers.push(obj)
|
||||
// });
|
||||
// console.log(layers);
|
||||
// let data = {
|
||||
// layers:{
|
||||
// designItemId:designItemDetail.designItemId,
|
||||
// designItemUrl:designItemDetail.designItemUrl,
|
||||
// layers:layers
|
||||
// },
|
||||
// timeZone:Intl.DateTimeFormat().resolvedOptions().timeZone,
|
||||
// }
|
||||
|
||||
// this.loadingShow = true
|
||||
// Https.axiosPost(Https.httpUrls.designSingle, data).then(
|
||||
// (rv) => {
|
||||
// // let top,bottom
|
||||
// // let desingStr0 = designItemDetail.clothes[0].type
|
||||
// // let desingStr1 = designItemDetail.clothes[1].type
|
||||
// // rv.layers.forEach((item)=>{
|
||||
// // let str = this.capitalizeFirstLetter(item.imageCategory)
|
||||
// // if(str.split('_')[0] == desingStr0){
|
||||
// // top.push(item)
|
||||
// // }else if(str.split('_')[0] == desingStr1){
|
||||
// // bottom.push(item)
|
||||
// // }
|
||||
// // })
|
||||
// // console.log(rv,designItemDetail);
|
||||
// // designItemDetail.clothes[0]
|
||||
// // designItemDetail.clothes.forEach((item)=>{
|
||||
// // if(item.type == desingStr0){
|
||||
// // item.layersObject = top
|
||||
// // }else if(item.type == desingStr1){
|
||||
// // item.layersObject = bottom
|
||||
// // }
|
||||
// // })
|
||||
// // this.store.commit("setDesignItemDetail", designItemDetail);
|
||||
// this.loadingShow = false
|
||||
// }
|
||||
// ).catch(res=>{
|
||||
// this.loadingShow = false
|
||||
// });
|
||||
},
|
||||
},
|
||||
});
|
||||
@@ -542,6 +443,7 @@ export default defineComponent({
|
||||
justify-content: space-between;
|
||||
position: relative;
|
||||
user-select:none;
|
||||
z-index: 2;
|
||||
position: relative;
|
||||
&.active{
|
||||
flex-direction: row;
|
||||
@@ -675,5 +577,10 @@ export default defineComponent({
|
||||
position: relative;
|
||||
}
|
||||
}
|
||||
.designOpenrtion_imgMask_open{
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user