detail更新

This commit is contained in:
X1627315083
2025-02-25 15:32:55 +08:00
parent 3b230ae222
commit 6cfcd4ce16
28 changed files with 1701 additions and 1056 deletions

View File

@@ -1,5 +1,5 @@
<template>
<div class="molepositon">
<div class="molepositon" :class="{active:!imgDesignImg}">
<div class="designOpenrtion_imgMask" v-if="frontBack?.body" :style="frontBack?.body?.style">
<div class="designOpenrtion_print" v-for="item,index in frontBack.back" @mousedown.stop="itemMoveMousedown(index,getMousePosition($event,false))" @touchstart.passive="itemMoveMousedown(index,getMousePosition($event,true))" @click="setpitch(item,index)" :style="frontBack.front[index].style">
<img :style="item.imageUrl?'':'display:none;'" :src="item.imageUrl" alt="">
@@ -21,6 +21,13 @@
<img src="" alt="">
</div>
</div>
<div class="molepositon" :class="{active:imgDesignImg}">
<div class="designOpenrtion_imgMask">
<div class="detail_modal_item_front">
<img :src="designDetail.designItemUrl" alt="">
</div>
</div>
</div>
</template>
<script lang="ts">
import { defineComponent,computed,inject,watch,nextTick,createVNode,toRefs, reactive} from 'vue'
@@ -34,6 +41,12 @@ import newFollowVue from '@/component/Account/message/newFollow.vue';
export default defineComponent({
components:{
},
props:{
imgDesignImg:{
default:false,
type:Boolean,
}
},
setup(props,{emit}) {
const store = useStore();
const detailData = reactive({
@@ -211,23 +224,27 @@ export default defineComponent({
item.priority = num++
})
let data:any = {
scale:[],
offset:[],
priority:-1,
scale:null,
offset:null,
priority:'',
maskUrl:'',
maskMinioUrl:'',
}
let state = false
for (let index = 0; index < arr.length; index++) {
if(value.id == arr[index].id){
state = true
let y = ((arr[index]?.style?.top.replace(/px/g,'')*ratio).toFixed(0) as any - arr[index]?.position[0])
let x = ((arr[index]?.style?.left.replace(/px/g,'')*ratio).toFixed(0) as any - arr[index]?.position[1])
let scaleWidth = arr[index]?.imageSize?Number(((arr[index]?.style?.width.replace(/px/g,'')*ratio)/(arr[index]?.imageSize[0]/arr[index].scale[0])).toFixed(2)):1
let scaleHeight = arr[index]?.imageSize?Number(((arr[index]?.style?.height.replace(/px/g,'')*ratio)/(arr[index]?.imageSize[1]/arr[index].scale[1])).toFixed(2)):1
// let widthScale = (arr[index].style.width.replace(/px/g,'')/arr[index].style.height.replace(/px/g,'')).toFixed(2)
data.scale = [scaleWidth,scaleHeight]
let top = y == 0 ? value.layersObject[0].offset[1]:y+value.layersObject[0].offset[1]
let left = x == 0 ? value.layersObject[0].offset[0]:x+value.layersObject[0].offset[0]
data.offset = [left,top]
data.offset = [left?left:0,top?top:0]
// data.offset = [left?left:0,top?top:0]
data.maskUrl = arr[index].maskUrl
data.maskMinioUrl = arr[index].maskMinioUrl
// data.priority = arr[index].style.zIndex
@@ -237,7 +254,11 @@ export default defineComponent({
break
}
}
if(!state){
data.scale = [1,1]
data.offset = [0,0]
data.priority = 10+arr.length
}
return data
}
const deleteNav = ()=>{
@@ -304,6 +325,12 @@ export default defineComponent({
flex-direction: column;
// margin: auto 0;
padding-top: 3rem;
position: relative;
display: none;
&.active{
display: block;
z-index: 2;
}
> .designOpenrtion_imgMask{
width: auto;
height: auto;
@@ -341,7 +368,7 @@ export default defineComponent({
z-index: 1 !important;
}
> .designOpenrtion_btn{
z-index: 9999;
z-index: 99;
ul{
list-style: none;
// width: 100%;