diff --git a/src/component/Detail/DesignDetail.vue b/src/component/Detail/DesignDetail.vue
index e59834a6..73ce0ad1 100644
--- a/src/component/Detail/DesignDetail.vue
+++ b/src/component/Detail/DesignDetail.vue
@@ -772,7 +772,7 @@ export default defineComponent({
this.designShowPrview = num
let setDesignItem:any = isMoible() ? this.$refs.setDesignItemMobile : this.$refs.setDesignItem
if(this.designShowPrview == 3){
- setDesignItem.init()
+ setDesignItem.setImgSize()
}
// this.others = designItemDetail.others
diff --git a/src/component/Detail/setDesignItem2.vue b/src/component/Detail/setDesignItem2.vue
index d447fb83..4024855c 100644
--- a/src/component/Detail/setDesignItem2.vue
+++ b/src/component/Detail/setDesignItem2.vue
@@ -8,7 +8,9 @@
-
+
+
+
{{ $t('LibraryPage.Reset') }}
OK
@@ -57,6 +59,16 @@ export default defineComponent({
}
return num
}
+ let computeZindex = (designItemDetail)=>{
+ let arr = designItemDetail.clothes
+ arr.sort((a, b) => {
+ var a_num = a.priority;
+ var b_num = b.priority;
+ return a_num - b_num;
+ });
+ designItemDetail.clothes = arr
+ return designItemDetail
+ }
let setImgSize = async ()=>{
let designItemDetail = JSON.parse(JSON.stringify(store.state.DesignDetailModule.designItemDetail))
let front = []
@@ -68,6 +80,7 @@ export default defineComponent({
}
});
let ratio = await setPostition(body.layersObject[0]?.imageUrl)
+ designItemDetail = computeZindex(designItemDetail)
designItemDetail.clothes.forEach((v,index)=>{
for (let i = v.layersObject.length-1; i >= 0; i--) {
v.layersObject[i].style = {
@@ -115,9 +128,14 @@ export default defineComponent({
}))
setCanvas(frontBack)
}
- const canvasDom = ref(null)
let canvas = reactive({})
let setCanvas = (frontBack)=>{
+ let canvasBox = document.querySelector('.design_compile_content .designOpenrtion_imgMask')
+ var canvasDom = document.createElement('canvas')
+ console.log(canvasDom);
+ canvasBox.innerHTML = ''; // 清空原有内容
+ canvasBox.appendChild(canvas);
+ canvas = reactive(null)
canvas = new fabric.Canvas(canvasDom.value, {
backgroundColor: "rgba(255,255,255,1)",
// fill: '#ffde7d',
@@ -127,13 +145,16 @@ export default defineComponent({
isDrawingMode: false, // 开启绘图模式
});
canvas.clear();
+ canvasFontBackMove = reactive({
+ back:[],
+ front:[],
+ })
+ console.log(canvas.getObjects());
let fontBackMove = []
canvas.on('selection:cleared', ()=>{
designShowIndex.value = -1
})
frontBack.back.forEach((item) => {
-
- console.log(item);
if(!item.imageUrl){
return
}
@@ -164,6 +185,7 @@ export default defineComponent({
canvas.add(img);
});
frontBack.front.forEach((item) => {
+ console.log(item);
if(!item.imageUrl){
return
}
@@ -178,7 +200,6 @@ export default defineComponent({
canvas.add(img);
canvasFontBackMove.back.forEach((backItem) => {
if(backItem && backItem.id == item.id){
- console.log(backItem);
img.on('moving', function() {
// 计算第二个矩形应该移动的距离
// 更新第二个矩形的位置
@@ -210,14 +231,16 @@ export default defineComponent({
});
var objects = canvas.getObjects();
- console.log(objects);
}
let clothesOpen = (item,index)=>{
- setpitch(item,index)
- designShowIndex.value = index
+ setCanvas(frontBack)
+ // setpitch(item,index)
+ // designShowIndex.value = index
}
let setpitch = (item,index)=>{
+ console.log(canvas.discardActiveObject);
+ canvas.discardActiveObject();
// this.designItemDetail.clothes.forEach((item)=>{
// item.clothesOpen = false
// })
@@ -247,7 +270,6 @@ export default defineComponent({
frontBack,
setRevocation,
frontBackOld,
- canvasDom,
canvasFontBackMove,
setImgSize,
clothesOpen,