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

detail调整

Browse Source
This commit is contained in:
X1627315083
2024-07-08 09:42:21 +08:00
parent 3fd6343e53
commit b6cb8e9bf0
22 changed files with 276 additions and 157 deletions
Download Patch File Download Diff File Expand all files Collapse all files

112
src/component/Detail/DesignPrintOperation.vue
View File

@@ -96,10 +96,7 @@
<img crossOrigin="anonymous" :src="item?.path" :style="{transform:`rotateZ(${printStyleList[stateOverallSingle][index]?.transform?.rotateZ}deg)`}" class="designOpenrtion_imgItme" draggable="false">
</div>
</div>
<!-- <img v-if="overallSingle" :src="current?.layersObject?.[1]?.maskUrl" alt="" class="designOpenrtion_sketch"> -->
<!-- {{printStyleList[stateOverallSingle][0]}} -->
<img :src="current?.path" alt="" class="designOpenrtion_sketch">
<img v-show="overallSingle" :src="current?.layersObject?.[1]?.maskUrl" alt="" class="designOpenrtion_sketch_mask">
<img v-lazy="operationCurrent.undividedLayer || operationCurrent.path" alt="" class="designOpenrtion_sketch">
<div class="designOpenrtion_btn">
<ul v-if="overallSingle" v-for="item,index in printStyleList[stateOverallSingle]" :key="item" :class="{active:item?.designOpenrtionBtn?item?.designOpenrtionBtn:false}" class="designOpenrtion_Mousingle" :style="item.style" @mousedown.stop="itemMoveMousedown(index,$event)">
<li class="designOpenrtion_btn_top" @mousedown.stop="itemSizeMousedown('top',$event)"></li>
@@ -199,6 +196,9 @@ export default defineComponent({
let sketch = ref({
width:'',
height:''
})
let operationCurrent = ref({
})
let loadingShow = ref(false)
let currentFullBodyView = ref('')
@@ -224,6 +224,7 @@ export default defineComponent({
imgDomIndex,
print,
sketch,
operationCurrent,
loadingShow,
setRevocation,
t,
@@ -295,11 +296,14 @@ export default defineComponent({
if(designItemDetail.others.length == 0){
this.body = true
}
//设置前片后片
this.operationCurrent = Object.assign({},this.current)
this.designOpenrtion = true
this.clearModal()
this.overallSingle = this.current.printObject.ifSingle?true:false
this.ifListOver()
if(this.current.printObject.prints)this.exhibitionOpenrtionList[this.stateOverallSingle] = JSON.parse(JSON.stringify(this.current.printObject.prints))
let printList = JSON.parse(JSON.stringify(this.current.printObject.prints))
this.setprintList(printList)
if(this.$parent.exhibitionList.print)this.designOpenrtionList = JSON.parse(JSON.stringify(this.$parent.exhibitionList.print))
if(this.$parent.elementsList)this.designList = JSON.parse(JSON.stringify(this.$parent.printsList))
if(this.overallSingle == false && this.designOpenrtionList.length > 0){
@@ -307,7 +311,6 @@ export default defineComponent({
}else if(this.overallSingle == false && this.designOpenrtionList.length == 0){
this.setpitch(this.designList[0],0)
}
// this.overallSingle = this.current.ifSingle?false:this.current.ifSingle
let skecth = new Image
skecth.src = this.current.path
skecth.onload=()=>{
@@ -315,14 +318,29 @@ export default defineComponent({
this.sketch.height = skecth.height/10+'rem'
skecth.remove()
}
if(this.exhibitionOpenrtionList[this.stateOverallSingle].length > 0){
this.exhibitionOpenrtionList[this.stateOverallSingle].forEach((item,index)=>{
this.setTemplate(item,index)
if(this.exhibitionOpenrtionList.overall.length > 0){
let str = 'overall'
this.exhibitionOpenrtionList[str].forEach((item,index)=>{
this.setTemplate(item,index,str)
})
}
if(this.exhibitionOpenrtionList.single.length > 0){
let str = 'single'
this.exhibitionOpenrtionList[str].forEach((item,index)=>{
this.setTemplate(item,index,str)
})
}else{
}
},
setprintList(arr){
arr.forEach(item=>{
if(item.ifSingle){
this.exhibitionOpenrtionList.single.push(item)
}else{
this.exhibitionOpenrtionList.overall.push(item)
}
})
},
ifListOver(){
if(!this.overallSingle){
// this.designOpenrtionList = this.designOpenrtionList.filter((item)=>item.level2Type == "Pattern")
@@ -367,6 +385,7 @@ export default defineComponent({
})
if(!this.overallSingle){
if(item.checked){
this.imgDomIndex = 0
this.deletePrint()
item.checked = false
return
@@ -389,7 +408,8 @@ export default defineComponent({
path:item.path,
priority:1,
scale:.3,
location:[0,0]
location:[0,0],
ifSingle:false,
}
this.systemDesignerPercentage = item.scale?item.scale*100:30
}else{
@@ -403,9 +423,10 @@ export default defineComponent({
path:item.path,
priority:1,
scale:1,
location:[0,0]
location:[0,0],
ifSingle:true,
})
this.refetchTemplate(currentIndex,false)
this.refetchTemplate(currentIndex,true)
}
},
//设置移动
@@ -555,34 +576,41 @@ export default defineComponent({
},
//随机重置图片顺序
refetchTemplate(index,boor) {
// let scale = (Math.trunc(Math.random()*15)+1)*.1
let rotateZ1 = Math.trunc(Math.random()*360)+1
let rotateZ2 = Math.trunc(Math.random()*360)+1
let sketch = document.getElementsByClassName("designOpenrtion_modal")[0]?.getElementsByClassName('designOpenrtion_sketch')[0]
let width
let scale
if(sketch.width<sketch.height){
width = Math.trunc(Math.random()*(sketch?.width-sketch?.width/2))+sketch?.width/4
if(boor){
width = Math.trunc((sketch?.width-sketch?.width/2))+sketch?.width/4
}
scale = width / this.print.width.replace(/px/g,'')
}else{
width = Math.trunc(Math.random()*(sketch?.height-sketch?.height/2))+sketch?.height/4
if(boor){
width = Math.trunc((sketch?.height-sketch?.height/2))+sketch?.height/4
}
scale = width / this.print.height.replace(/px/g,'')
}
// let x = sketch.width-Number(this.print.width.replace(/px/g,''))
// let y = sketch.height-Number(this.print.height.replace(/px/g,''))
let x = sketch?.width - this.print.width.replace(/px/g,'')*scale
if(!this.overallSingle){
x = sketch?.width - this.print.width.replace(/px/g,'')*scale/2
}
let y = sketch?.height-this.print.height.replace(/px/g,'')*scale
let left = sketch.offsetWidth/2-this.print.width.replace(/px/g,'')*scale/2
let top = sketch.offsetHeight/2-this.print.height.replace(/px/g,'')*scale/2
if(this.stateOverallSingle == 'overall'){
left = sketch.offsetWidth/2-5
top = sketch.offsetHeight/2-5
}
this.printStyleList[this.stateOverallSingle][index]={
centers:{
left:0,
top:0,
},
style:{
left:(boor?sketch.offsetWidth/2:Math.trunc(Math.random()*x)+1)+"px",
top:(boor?sketch.offsetHeight/2:Math.trunc(Math.random()*y)+1)+"px",
left:(boor?left:Math.trunc(Math.random()*x)+1)+"px",
top:(boor?top:Math.trunc(Math.random()*y)+1)+"px",
right:"auto",
bottom:"auto",
width:this.print.width.replace(/px/g,'')*scale+'px',
@@ -598,7 +626,7 @@ export default defineComponent({
}
},
//设置图片
async setTemplate(item,index) {
async setTemplate(item,index,str) {
await this.setPrintWH(item.path)
this.designOpenrtionList
let sketch = document.getElementsByClassName("designOpenrtion_modal")[0]?.getElementsByClassName('designOpenrtion_sketch')[0]
@@ -614,7 +642,8 @@ export default defineComponent({
if(sketch.offsetHeight < item.location[1]/sketchNum){
top = sketch.offsetHeight +'px'
}
this.printStyleList[this.stateOverallSingle][index]={
this.systemDesignerPercentage = item.scale?item.scale*100:30
this.printStyleList[str][index]={
centers:{
left:0,
top:0,
@@ -635,25 +664,34 @@ export default defineComponent({
designOpenrtionBtn:false
}
},
computeZindex(){
let arr = JSON.parse(JSON.stringify(this.printStyleList[this.stateOverallSingle]))
arr.sort((a, b) => {
var a_num = a["style"].zIndex;
var b_num = b["style"].zIndex;
computeZindex(resolve,prints){
prints.sort((a, b) => {
var a_num = a.priority;
var b_num = b.priority;
return a_num - b_num;
});
let num = 1
arr.forEach((v)=>{
v.style.zIndex = num++
prints.forEach((v)=>{
v.priority = num++
})
return this.computeSize(arr)//计算单件衣服初始大小到目前大小的缩放比
resolve(prints)
},
computeSize(arr){
computeSize(){
return new Promise(async (resolve, reject) => {
let arr = JSON.parse(JSON.stringify(this.printStyleList[this.stateOverallSingle]))
// let num = this.sketch/
let sketch = document.getElementsByClassName("designOpenrtion_sketch")[0]
let sketchNum = this.sketch.width.replace(/rem/g,'')*10/sketch.offsetWidth
let prints = []
prints = this.operationCurrent.printObject.prints.filter(item=>!!!item.ifSingle)
if(this.stateOverallSingle == 'overall'){
prints = this.operationCurrent.printObject.prints.filter(item=>!!item.ifSingle)
}else{
prints = this.operationCurrent.printObject.prints.filter(item=>!!!item.ifSingle)
}
let scale
let location
for (let index = 0; index < arr.length; index++) {
@@ -676,10 +714,11 @@ export default defineComponent({
level2Type:this.exhibitionOpenrtionList[this.stateOverallSingle][index].level2Type,
path:this.exhibitionOpenrtionList[this.stateOverallSingle][index].path,
minIOPath:this.exhibitionOpenrtionList[this.stateOverallSingle][index].minIOPath,
ifSingle:!!this.exhibitionOpenrtionList[this.stateOverallSingle][index].ifSingle,
}
prints.push(obj)
}
resolve(prints)
this.computeZindex(resolve,prints)
})
},
async setPreview(){
@@ -699,7 +738,7 @@ export default defineComponent({
// timeZone:Intl.DateTimeFormat().resolvedOptions().timeZone,
// }
let data = JSON.parse(JSON.stringify(this.store.state.DesignDetailModule.designPreviewData))
await this.computeZindex().then((rv)=>{
await this.computeSize().then((rv)=>{
this.setOkData = rv
})
data.designSingleItemDTOList[index].printObject={
@@ -710,6 +749,8 @@ export default defineComponent({
this.loadingShow = true
Https.axiosPost(Https.httpUrls.designSingle, data).then(
(rv) => {
this.operationCurrent = Object.assign({},rv.clothes[index])
// designItemDetail.clothes[index].printObject.path = rv.clothes[0].printObject.path
this.currentFullBodyView = rv.currentFullBodyView
this.designItemDetailTS.rv = rv
@@ -1003,7 +1044,8 @@ export default defineComponent({
max-width: calc(60rem*1.2);
}
.designOpenrtion_sketch_mask{
z-index: 3;
z-index: 2;
// z-index: 3;
position: absolute;
inset: 0;
width: 100%;
@@ -1058,10 +1100,12 @@ export default defineComponent({
border: none;
width: calc(1.4rem*1.2);
height: calc(1.4rem*1.2);
z-index: 2;
i{
display: flex;
color: #14bcff;
justify-content: center;
cursor: pointer;
}
.animtion1{
animation: anim 4s 2s linear infinite;