This commit is contained in:
X1627315083
2024-03-04 09:57:46 +08:00
parent aa5f2e4208
commit 1dcafb8d5d
6 changed files with 571 additions and 494 deletions

View File

@@ -1011,125 +1011,125 @@ export default defineComponent({
exportModel.init()
},
//导出合成图
async exportCanvas() {
let collectionReview: any = document.querySelector(
"#exportNewCoolection"
);
let rightContentImgBlock: any = document.querySelector(
"#right_content_img_block"
);
if(this.driver__.driver){
nextTick().then(()=>{
driverObj__.moveNext();
})
}
// async exportCanvas() {
// let collectionReview: any = document.querySelector(
// "#exportNewCoolection"
// );
// let rightContentImgBlock: any = document.querySelector(
// "#right_content_img_block"
// );
// if(this.driver__.driver){
// nextTick().then(()=>{
// driverObj__.moveNext();
// })
// }
let a = document.createElement("a");
// this.isShowMark = true;
let img:any = []
await html2canvas(collectionReview, { useCORS: true, scale: 3 }).then(
async (canvas) => {
let blob: any = dataURLtoBlob(
canvas.toDataURL("image/png")
);
let allBoardData: any =
this.store.state.UploadFilesModule.allBoardData;
let index = 0;
img.push({
imgUrl: URL.createObjectURL(blob),
name: "collection.png",
})
let num = 0
for (let key in allBoardData) {
if (key !== "colorBoards" && key !== "moodTemplateId") {
if(this.exportNav[num]?.change || key == 'disposeMoodboard'){
for (let item of allBoardData[key]) {
if(key == 'disposeMoodboard' && allBoardData[key][0]==undefined){
break
}
let nameTail = item?.imgUrl?.split(".").pop().split("?").shift();
let data = {
imgUrl: item.imgUrl,
name:
item?.resData?.name +
index +
"." +
nameTail,
};
img.push(data);
index++;
}
}else{
}
num++
}
}
let dataList:any = []
this.likeDesignCollectionList.forEach((item:any)=>{
let nameTail = item?.designOutfitUrl?.split(".").pop().split("?").shift();
let data = {
imgUrl: item.designOutfitUrl,
name:
'result' +
index +
"." +
nameTail,
};
dataList.push(item.designItemId)
img.push(data);
index++;
})
let mannequinList:any = []
await Https.axiosPost(Https.httpUrls.designGetModel, dataList)
.then((rv: any) => {
mannequinList = rv
})
.catch((rv) => {
});
// let a = document.createElement("a");
// // this.isShowMark = true;
// let img:any = []
// await html2canvas(collectionReview, { useCORS: true, scale: 3 }).then(
// async (canvas) => {
// let blob: any = dataURLtoBlob(
// canvas.toDataURL("image/png")
// );
// let allBoardData: any =
// this.store.state.UploadFilesModule.allBoardData;
// let index = 0;
// img.push({
// imgUrl: URL.createObjectURL(blob),
// name: "collection.png",
// })
// let num = 0
// for (let key in allBoardData) {
// if (key !== "colorBoards" && key !== "moodTemplateId") {
// if(this.exportNav[num]?.change || key == 'disposeMoodboard'){
// for (let item of allBoardData[key]) {
// if(key == 'disposeMoodboard' && allBoardData[key][0]==undefined){
// break
// }
// let nameTail = item?.imgUrl?.split(".").pop().split("?").shift();
// let data = {
// imgUrl: item.imgUrl,
// name:
// item?.resData?.name +
// index +
// "." +
// nameTail,
// };
// img.push(data);
// index++;
// }
// }else{
// }
// num++
// }
// }
// let dataList:any = []
// this.likeDesignCollectionList.forEach((item:any)=>{
// let nameTail = item?.designOutfitUrl?.split(".").pop().split("?").shift();
// let data = {
// imgUrl: item.designOutfitUrl,
// name:
// 'result' +
// index +
// "." +
// nameTail,
// };
// dataList.push(item.designItemId)
// img.push(data);
// index++;
// })
// let mannequinList:any = []
// await Https.axiosPost(Https.httpUrls.designGetModel, dataList)
// .then((rv: any) => {
// mannequinList = rv
// })
// .catch((rv) => {
// });
mannequinList.forEach((item:any) => {
let nameTail = item?.split(".").pop().split("?").shift();
let data = {
imgUrl: item,
name:
'mannequin' +
index +
"." +
nameTail,
};
img.push(data);
index++;
});
// a.setAttribute('href', URL.createObjectURL(blob));
// a.setAttribute('download', `collection.png`);
// a.click();
}
);
//单独导出模特图
// await html2canvas(rightContentImgBlock, { useCORS: true, scale: 3 }).then(
// (canvas) => {
// let blob: any = dataURLtoBlob(
// canvas.toDataURL("image/png")
// );
// let allBoardData: any =
// this.store.state.UploadFilesModule.allBoardData;
// let index = 0;
// img.push({
// imgUrl: URL.createObjectURL(blob),
// name: "achievement.png",
// },)
// this.likeDesignCollectionList.forEach((item:any) => {
// let data = {
// imgUrl:item.designItemUrl,
// name:item.pictureName
// }
// img.push(data)
// });
// }
// );
// return
this.downImg(img);
},
// mannequinList.forEach((item:any) => {
// let nameTail = item?.split(".").pop().split("?").shift();
// let data = {
// imgUrl: item,
// name:
// 'mannequin' +
// index +
// "." +
// nameTail,
// };
// img.push(data);
// index++;
// });
// // a.setAttribute('href', URL.createObjectURL(blob));
// // a.setAttribute('download', `collection.png`);
// // a.click();
// }
// );
// //单独导出模特图
// // await html2canvas(rightContentImgBlock, { useCORS: true, scale: 3 }).then(
// // (canvas) => {
// // let blob: any = dataURLtoBlob(
// // canvas.toDataURL("image/png")
// // );
// // let allBoardData: any =
// // this.store.state.UploadFilesModule.allBoardData;
// // let index = 0;
// // img.push({
// // imgUrl: URL.createObjectURL(blob),
// // name: "achievement.png",
// // },)
// // this.likeDesignCollectionList.forEach((item:any) => {
// // let data = {
// // imgUrl:item.designItemUrl,
// // name:item.pictureName
// // }
// // img.push(data)
// // });
// // }
// // );
// // return
// this.downImg(img);
// },
//打开图片详情
designDetail(
@@ -1186,34 +1186,34 @@ export default defineComponent({
});
},
// imgDataUrl 数据的url数组
downImg(imagesParams: any) {
let _this: any = this;
let zip = new JSZip();
let cache: any = {};
let promises = [];
for (let item of imagesParams) {
const promise = _this
.getImgArrayBuffer(item.imgUrl)
.then((data: any) => {
// 下载文件, 并存成ArrayBuffer对象(blob)
zip.file(item.name, data, { binary: true }); // 逐个添加文件
cache[item.title] = data;
});
promises.push(promise);
}
Promise.all(promises)
.then(() => {
zip.generateAsync({ type: "blob" }).then((content: any) => {
// 生成二进制流
FileSaver.saveAs(content, "DesignFiles"); // 利用file-saver保存文件 自定义文件名
this.isShowMark = false;
});
})
.catch((res) => {
message.warning(this.t('HomeView.jsContent3'));
this.isShowMark = false;
});
},
// downImg(imagesParams: any) {
// let _this: any = this;
// let zip = new JSZip();
// let cache: any = {};
// let promises = [];
// for (let item of imagesParams) {
// const promise = _this
// .getImgArrayBuffer(item.imgUrl)
// .then((data: any) => {
// // 下载文件, 并存成ArrayBuffer对象(blob)
// zip.file(item.name, data, { binary: true }); // 逐个添加文件
// cache[item.title] = data;
// });
// promises.push(promise);
// }
// Promise.all(promises)
// .then(() => {
// zip.generateAsync({ type: "blob" }).then((content: any) => {
// // 生成二进制流
// FileSaver.saveAs(content, "DesignFiles"); // 利用file-saver保存文件 自定义文件名
// this.isShowMark = false;
// });
// })
// .catch((res) => {
// message.warning(this.t('HomeView.jsContent3'));
// this.isShowMark = false;
// });
// },
},
});
</script>