Skip to content

E
electron-printer
Commit fe4127ef by linjinhong
Options

修改铺满问题

parent 34c277f4
Showing with 52 additions and 48 deletions
package.json
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
"name": "JomallProductionAssistant", "name": "JomallProductionAssistant",
"productName": "JomallProductionAssistant", "productName": "JomallProductionAssistant",
"description": "", "description": "",
"version": "1.0.12", "version": "1.0.13",
"private": true, "private": true,
"scripts": { "scripts": {
"serve": "vue-cli-service serve", "serve": "vue-cli-service serve",
......
src/views/design/main/index.vue
...@@ -24,7 +24,7 @@ export default { ...@@ -24,7 +24,7 @@ export default {
PrintDialog, PrintDialog,
VueDragResizeRotate, VueDragResizeRotate,
ImgSetting, ImgSetting,
PicScrollbarBox PicScrollbarBox,
}, },
props: { factoryType: { type: String, default: "CN" } }, props: { factoryType: { type: String, default: "CN" } },
destroyed() { destroyed() {
...@@ -66,7 +66,7 @@ export default { ...@@ -66,7 +66,7 @@ export default {
return { return {
w: this.grid[this.systemSetting.gridValue].w, w: this.grid[this.systemSetting.gridValue].w,
v: this.grid[this.systemSetting.gridValue].value, v: this.grid[this.systemSetting.gridValue].value,
h: this.grid[this.systemSetting.gridValue].h h: this.grid[this.systemSetting.gridValue].h,
}; };
}, },
gridSpacing() { gridSpacing() {
...@@ -76,7 +76,7 @@ export default { ...@@ -76,7 +76,7 @@ export default {
if (unit === "mm") { if (unit === "mm") {
return { return {
w: gridSpacing + "px", w: gridSpacing + "px",
h: gridSpacing + "px" h: gridSpacing + "px",
}; };
} else if (unit === "inch") { } else if (unit === "inch") {
let w = this.grid[this.systemSetting.gridValue].w; let w = this.grid[this.systemSetting.gridValue].w;
...@@ -86,7 +86,7 @@ export default { ...@@ -86,7 +86,7 @@ export default {
return { return {
// w: gridSpacing * ((w - row + 1) / row) + "px", // w: gridSpacing * ((w - row + 1) / row) + "px",
w: gridSpacing * (w / row) + "px", w: gridSpacing * (w / row) + "px",
h: gridSpacing * (h / col) + "px" h: gridSpacing * (h / col) + "px",
}; };
} }
return { w: "480px", h: "540px" }; return { w: "480px", h: "540px" };
...@@ -98,7 +98,7 @@ export default { ...@@ -98,7 +98,7 @@ export default {
if (unit === "mm") { if (unit === "mm") {
return { return {
w: gridSpacing + "px", w: gridSpacing + "px",
h: gridSpacing + "px" h: gridSpacing + "px",
}; };
} else if (unit === "inch") { } else if (unit === "inch") {
let w = 480; let w = 480;
...@@ -107,7 +107,7 @@ export default { ...@@ -107,7 +107,7 @@ export default {
let h = 540; let h = 540;
return { return {
w: gridSpacing * (w / row) + "px", w: gridSpacing * (w / row) + "px",
h: gridSpacing * (h / col) + "px" h: gridSpacing * (h / col) + "px",
}; };
} }
return { w: "480px", h: "540px" }; return { w: "480px", h: "540px" };
...@@ -140,8 +140,8 @@ export default { ...@@ -140,8 +140,8 @@ export default {
"WHproportion", "WHproportion",
"grid", "grid",
"windowWH", "windowWH",
"countryList" "countryList",
]) ]),
}, },
data() { data() {
return { return {
...@@ -159,7 +159,7 @@ export default { ...@@ -159,7 +159,7 @@ export default {
"hsva(120, 40, 94, 0.5)", "hsva(120, 40, 94, 0.5)",
"hsl(181, 100%, 37%)", "hsl(181, 100%, 37%)",
"hsla(209, 100%, 56%, 0.73)", "hsla(209, 100%, 56%, 0.73)",
"#c7158577" "#c7158577",
], ],
actionList: [], actionList: [],
checkList: [], checkList: [],
...@@ -194,7 +194,7 @@ export default { ...@@ -194,7 +194,7 @@ export default {
col: 7, col: 7,
oldImgStyle: "", oldImgStyle: "",
drrDom: null, drrDom: null,
imgDom: null imgDom: null,
}; };
}, },
watch: { watch: {
...@@ -222,7 +222,7 @@ export default { ...@@ -222,7 +222,7 @@ export default {
this.$store.commit("changeImgList", this.imgList); this.$store.commit("changeImgList", this.imgList);
}, },
deep: true, deep: true,
immediate: true immediate: true,
}, },
selectIndex() { selectIndex() {
if (this.selectIndex >= 0) { if (this.selectIndex >= 0) {
...@@ -266,7 +266,7 @@ export default { ...@@ -266,7 +266,7 @@ export default {
this.imgDom = ""; this.imgDom = "";
} }
}, },
immediate: true immediate: true,
}, },
systemSetting: { systemSetting: {
handler() { handler() {
...@@ -274,8 +274,8 @@ export default { ...@@ -274,8 +274,8 @@ export default {
this.$refs.imgSetting?.getCurrentItem(this.imgList[this.selectIndex]); this.$refs.imgSetting?.getCurrentItem(this.imgList[this.selectIndex]);
} }
}, },
deep: true deep: true,
} },
}, },
methods: { methods: {
// 重构为可手动触发的方法 // 重构为可手动触发的方法
...@@ -299,8 +299,8 @@ export default { ...@@ -299,8 +299,8 @@ export default {
formData.append("file", files[i]); formData.append("file", files[i]);
let { data } = await that.$api.post("/uploadImage", formData, { let { data } = await that.$api.post("/uploadImage", formData, {
headers: { headers: {
"Content-Type": "application/x-www-form-urlencoded" "Content-Type": "application/x-www-form-urlencoded",
} },
}); });
that.selectImgIndex = 0; that.selectImgIndex = 0;
that.addFile(data, () => { that.addFile(data, () => {
...@@ -432,7 +432,7 @@ export default { ...@@ -432,7 +432,7 @@ export default {
) { ) {
size = { size = {
width: this.detail.mssWidth, width: this.detail.mssWidth,
height: this.detail.mssHeight height: this.detail.mssHeight,
}; };
} }
this.getBackFile({ files: [it], size }, () => { this.getBackFile({ files: [it], size }, () => {
...@@ -460,26 +460,33 @@ export default { ...@@ -460,26 +460,33 @@ export default {
z_index = z_index =
dom.style.zIndex === "" || !dom.style.zIndex ? 0 : dom.style.zIndex; dom.style.zIndex === "" || !dom.style.zIndex ? 0 : dom.style.zIndex;
} }
let gw = Number(this.gridWH.w);
let gh = Number(this.gridWH.h);
let imgW = this.imgList[this.selectIndex].w;
let imgH = this.imgList[this.selectIndex].h;
// 计算容器和图片的宽高比
const containerRatio = gw / gh;
const imageRatio = imgW / imgH;
switch (type) { switch (type) {
case "cover": case "cover":
if (this.imgList[this.selectIndex].w > this.imgList[this.selectIndex].h) { if (imageRatio >= containerRatio) {
// 宽度铺满，高度自适应 // 宽度铺满，高度自适应
let r = Number(this.gridWH.w) / this.imgList[this.selectIndex].w let r = gw / imgW;
this.$set(this.imgList[this.selectIndex], "w", Number(this.gridWH.w)); this.$set(this.imgList[this.selectIndex], "w", gw);
this.$set(this.imgList[this.selectIndex], "h", this.imgList[this.selectIndex].h * r); this.$set(this.imgList[this.selectIndex], "h", imgH * r);
}else if(this.imgList[this.selectIndex].w < this.imgList[this.selectIndex].h) { } else {
// // 高度铺满，宽度自适应 // // 高度铺满，宽度自适应
let r = Number(this.gridWH.h) / this.imgList[this.selectIndex].h let r = gh / imgH;
this.$set(this.imgList[this.selectIndex], "h", Number(this.gridWH.h)); console.log("比例", r);
this.$set(this.imgList[this.selectIndex], "w", this.imgList[this.selectIndex].w * r);
}else{ this.$set(this.imgList[this.selectIndex], "h", gh);
let r = Number(this.gridWH.w) / this.imgList[this.selectIndex].w this.$set(this.imgList[this.selectIndex], "w", imgW * r);
this.$set(this.imgList[this.selectIndex], "w", Number(this.gridWH.w));
this.$set(this.imgList[this.selectIndex], "h", this.imgList[this.selectIndex].h * r);
} }
this.$set(this.imgList[this.selectIndex], "x", Number(w)); this.$set(this.imgList[this.selectIndex], "x", Number(w));
this.$set(this.imgList[this.selectIndex], "y", Number(h)); this.$set(this.imgList[this.selectIndex], "y", Number(h));
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList))); this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
break; break;
case "center": case "center":
...@@ -557,8 +564,7 @@ export default { ...@@ -557,8 +564,7 @@ export default {
} }
this.getCutArea(); this.getCutArea();
}, },
resizing() { resizing() {},
},
rotating(data, item) { rotating(data, item) {
this.$set(item, "r", data.angle); this.$set(item, "r", data.angle);
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList))); this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
...@@ -680,7 +686,7 @@ export default { ...@@ -680,7 +686,7 @@ export default {
x, x,
y, y,
h: height_px, h: height_px,
r: 0 r: 0,
}); });
that.selectIndex = that.imgList.length - 1; that.selectIndex = that.imgList.length - 1;
that.showImgSetting = true; that.showImgSetting = true;
...@@ -714,7 +720,7 @@ export default { ...@@ -714,7 +720,7 @@ export default {
x: w, x: w,
y: (bw * (2 / 3) * rate) / 2, y: (bw * (2 / 3) * rate) / 2,
h: bw * (2 / 3) * rate, h: bw * (2 / 3) * rate,
r: 0 r: 0,
}); });
console.log(570, that.imgList); console.log(570, that.imgList);
that.selectIndex = that.imgList.length - 1; that.selectIndex = that.imgList.length - 1;
...@@ -740,7 +746,7 @@ export default { ...@@ -740,7 +746,7 @@ export default {
image.onload = function() { image.onload = function() {
resolve({ resolve({
width: image.width, width: image.width,
height: image.height height: image.height,
}); });
}; };
image.onerror = function() { image.onerror = function() {
...@@ -819,14 +825,14 @@ export default { ...@@ -819,14 +825,14 @@ export default {
const outputPath = path.join(outputDir, outputFileName); const outputPath = path.join(outputDir, outputFileName);
const params = { const params = {
inputPath: el.productionFile, inputPath: el.productionFile,
outputPath: outputPath outputPath: outputPath,
}; };
const res = await this.$api.post("/processImage", params); const res = await this.$api.post("/processImage", params);
fs.unlinkSync(el.productionFile); fs.unlinkSync(el.productionFile);
return { return {
fileName: outputFileName, fileName: outputFileName,
productionFile: res.msg[0]?.outputPath, productionFile: res.msg[0]?.outputPath,
designId: el.designId designId: el.designId,
}; };
} catch (error) { } catch (error) {
console.error(`处理失败: ${el.productionFile}`, error); console.error(`处理失败: ${el.productionFile}`, error);
...@@ -888,7 +894,7 @@ export default { ...@@ -888,7 +894,7 @@ export default {
let res = await this.$api.post("/downloadBySubOrderNumber", { let res = await this.$api.post("/downloadBySubOrderNumber", {
ids: [this.detail.id], ids: [this.detail.id],
device: this.$store.state.desktopDevice, device: this.$store.state.desktopDevice,
type: this.factoryType type: this.factoryType,
}); });
if (res.data.length === 0) return this.$message.warning("未找到素材图！"); if (res.data.length === 0) return this.$message.warning("未找到素材图！");
let imgList = []; let imgList = [];
...@@ -1015,7 +1021,7 @@ export default { ...@@ -1015,7 +1021,7 @@ export default {
} catch (error) { } catch (error) {
console.log(error); console.log(error);
} }
} },
}, },
mounted() { mounted() {
this.imgHeight = window.screen.height + "px"; this.imgHeight = window.screen.height + "px";
...@@ -1091,7 +1097,7 @@ export default { ...@@ -1091,7 +1097,7 @@ export default {
beforeDestroy() { beforeDestroy() {
// 销毁组件时移除事件监听器 // 销毁组件时移除事件监听器
document.removeEventListener("click", this.handleClick); document.removeEventListener("click", this.handleClick);
} },
}; };
</script> </script>
...@@ -1133,18 +1139,16 @@ export default { ...@@ -1133,18 +1139,16 @@ export default {
v-if="selectImgList.length" v-if="selectImgList.length"
style="margin: 5px;" style="margin: 5px;"
@click="downloadImg" @click="downloadImg"
>下载原素材 >下载原素材
</el-button </el-button>
>
<el-button <el-button
type="primary" type="primary"
size="small" size="small"
v-if="selectImgList.length" v-if="selectImgList.length"
style="margin: 5px;" style="margin: 5px;"
@click="cutImgFn" @click="cutImgFn"
>裁切 >裁切
</el-button </el-button>
>
</div> </div>
</template> </template>
<template #mainContent> <template #mainContent>
...@@ -1478,7 +1482,7 @@ export default { ...@@ -1478,7 +1482,7 @@ export default {
" "
> >
<b style="color: green" v-if="hasSize" <b style="color: green" v-if="hasSize"
>该生产单无需拖动设计，直接打印</b >该生产单无需拖动设计，直接打印</b
> >
<b style="color: red" v-else>该生产单需要拖动设计打印</b> <b style="color: red" v-else>该生产单需要拖动设计打印</b>
</div> </div>
...@@ -1877,7 +1881,7 @@ img { ...@@ -1877,7 +1881,7 @@ img {
.boxShaow { .boxShaow {
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2), 0 0 15px rgba(0, 0, 0, 0.14), box-shadow: 0 0 10px rgba(0, 0, 0, 0.2), 0 0 15px rgba(0, 0, 0, 0.14),
0 0 20px rgba(0, 0, 0, 0.12); 0 0 20px rgba(0, 0, 0, 0.12);
position: relative; position: relative;
.left-bg-color { .left-bg-color {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment