Skip to content

E
electron-printer
Commit e654a4f1 by linjinhong
Options

fix:修改逻辑

parent 6dfcf308
Showing with 101 additions and 191 deletions
config/env.json
{"apiApiHost":"http://172.16.19.100:8060/api","fileApiUrl":"http://172.16.19.100:8060/upload/factory","visionUrl":"http://console.jomalls.com","configPath":"D:\\work\\electron-printer\\config\\env.json"}
\ No newline at end of file
{
"apiApiHost": "http://172.16.19.100:8060/api",
"fileApiUrl": "http://172.16.19.100:8060/upload/factory",
"visionUrl": "http://console.jomalls.com",
"configPath": "D:\\work\\electron-printer\\config\\env.json"
}
src/config/index.js
......@@ -17,8 +17,8 @@ export const pathMap = {
GC: "factory/podJomallOrderProduct/completeDelivery",
},
processTransparentBackground: {
CN: "api/factory/podJomallOrderProductCn/processTransparentBackground",
US: "api/factory/podJomallOrderProductUs/processTransparentBackground",
CN: "factory/podJomallOrderProductCn/processTransparentBackground",
US: "factory/podJomallOrderProductUs/processTransparentBackground",
},
};
......
src/server/entity/function.js
......@@ -9,7 +9,6 @@ const {
cropImageTransparentEdges,
cropTransparentEdges,
processImages,
cropToPrintArea,
} = require("../utils/setImage");
import axios from "axios";
import { returnLogFilePath } from "../utils/log";
......@@ -165,7 +164,6 @@ export default {
if (data.code !== 200) {
return res.json(data);
}
console.log("downloadBySubOrderNumber", data);
// 转义中文
if (data.message) {
......@@ -175,7 +173,6 @@ export default {
let files = data.data || [data.message];
files = files.map((el) => ({ url: `${fileEnv}${el}` }));
console.log(175, files);
const downloadFunc =
params.device === 2 ? downloadOtherImage : downloadImage;
......@@ -483,17 +480,7 @@ export default {
res.json({ code: 500, msg: err.message });
}
},
//输入图片路径或目录
cropToPrintAreaApi: async (req, res) => {
const { inputPath, outputPath, data: params } = req.body;
try {
const data = await cropToPrintArea(inputPath, outputPath, params);
res.json({ code: 200, msg: data });
} catch (err) {
res.json({ code: 500, msg: err.message });
}
},
//删除图片
cleanDirectorySync: async (req, res) => {
const desktopDevice = getCurrentDesktopDevice();
......@@ -590,17 +577,30 @@ export default {
processTransparentBackground: async (req, res) => {
env = getHostApi().apiApiHost;
const token = req.headers["jwt-token"];
const params = req.body;
const { imgUrl, subOrderNumber, orderType } = req.body;
const processTransparentBackground =
pathMap["processTransparentBackground"];
let url = processTransparentBackground[params.orderType];
let postData = { url: "", subOrderNumber: "" };
let url = processTransparentBackground[orderType];
let postData = { url: imgUrl, subOrderNumber };
try {
let { data } = await axios.post(`${env}/${url}`, postData, {
let { data } = await axios.get(`${env}/${url}`, {
params: postData,
headers: { "jwt-token": token },
});
res.send(data);
console.log("processTransparentBackground", data);
if (data.message) {
data.message = encodeURIComponent(data.message);
}
let files = data.data || [data.message];
files = files.map((el) => ({ url: `${fileEnv}${el}` }));
console.log("processTransparentBackground,files", files);
const result = await downloadImage(files);
res.json({ code: 200, data: result });
} catch (err) {
console.log(err);
res.json({ code: 500, msg: err });
......
src/server/routes/index.js
......@@ -39,8 +39,7 @@ router.post("/imageTransparentEdges", fn.imageTransparentEdges);
router.post("/imageListTransparentEdges", fn.imageListTransparentEdges);
// 处理图片并输出结果
router.post("/processImage", fn.processImage);
// 处理图片并输出结果
router.post("/cropToPrintArea", fn.cropToPrintAreaApi);
// 删除图片
router.post("/cleanDirectorySync", fn.cleanDirectorySync);
......
src/server/utils/setImage.js
......@@ -562,93 +562,10 @@ async function checkImageOutsideGrid() {
}
}
const FIXED_MASK_RATIO = {
left: 0.341,
top: 0.308,
width: 0.443,
height: 0.443,
};
async function cropToPrintArea(inputPath, outputPath, data) {
let RATIO;
if (!data) return false;
// -------- 你原来的解构（我修正 drawImage 来源）--------
const { canvasWidth, canvasHeight, rect_info, drawImage } = data;
const [dx, dy, imgRenderW, imgRenderH] = drawImage;
// -------- 【关键】你原来的逻辑：有 rect_info 就覆盖比例 --------
if (rect_info) {
RATIO = {
left: rect_info.leftDistance / canvasWidth, // ✅ 转成比例
top: rect_info.topDistance / canvasHeight, // ✅ 转成比例
width: rect_info.rectWidth / canvasWidth, // ✅ 比例
height: rect_info.rectHeight / canvasHeight, // ✅ 比例
};
}
console.log("✅ 正确比例：", RATIO);
try {
// 1. 获取图片宽高
const meta = await sharp(inputPath).metadata();
const width = meta.width;
const height = meta.height;
// 2. 按比例计算（你原来的写法，完全不变）
const cropLeft = Math.round(width * RATIO.left);
const cropTop = Math.round(height * RATIO.top);
const cropWidth = Math.round(width * RATIO.width);
const cropHeight = Math.round(height * RATIO.height);
// 安全边界
const safeLeft = Math.max(0, cropLeft);
const safeTop = Math.max(0, cropTop);
const safeWidth = Math.min(cropWidth, width - safeLeft);
const safeHeight = Math.min(cropHeight, height - safeTop);
// 3. 执行裁剪（你原来的逻辑不变）
await sharp(inputPath)
.extract({
left: safeLeft,
top: safeTop,
width: safeWidth,
height: safeHeight,
})
.toFile(outputPath);
// 4. 返回你要的结构（完全不变）
const results = [
{
file: path.basename(inputPath),
status: "cropped",
outputPath: outputPath,
originalSize: { width, height },
newSize: { width: safeWidth, height: safeHeight },
cropArea: {
x: safeLeft,
y: safeTop,
width: safeWidth,
height: safeHeight,
},
},
];
fs.unlinkSync(inputPath);
return results;
} catch (error) {
throw new Error("图片裁剪失败: " + error.message);
}
}
// 分区边界检测实现
module.exports = {
cropTransparentEdges,
cropImageTransparentEdges,
processImages,
cropImage,
checkImageOutsideGrid,
cropToPrintArea,
};
src/server/utils/store.js
......@@ -197,6 +197,10 @@ module.exports = {
store.set("desktoBoard", version);
},
getBoard: () => store.get("desktoBoard") || 3,
setIsOver: (value) => {
store.set("isOver", value);
},
getIsOver: () => store.get("isOver") || false,
setLocation: (version, locationKey) => {
if (!locationKey) return;
......
src/utils/index.js
......@@ -244,6 +244,37 @@ export function extractValue(str) {
if (str.includes("_B_")) return "B";
}
export function getImgTitle(imageResList) {
return imageResList
.map((el, index) => {
el.designId = el.designId || index;
el.title = extractValue(el.designId);
return el;
})
.sort((a, b) => {
const titleA = a.title;
const titleB = b.title;
// 检查是否为空值（null、undefined、空字符串）
const isEmptyA = titleA === null || titleA === undefined || titleA === "";
const isEmptyB = titleB === null || titleB === undefined || titleB === "";
// 处理空值情况（空值排在最后）
if (isEmptyA && isEmptyB) return 0; // 两个都为空，保持原顺序
if (isEmptyA) return 1; // A为空，B不为空，A排在后面
if (isEmptyB) return -1; // B为空，A不为空，B排在后面
// 处理非空值比较（不区分大小写）
const valueA = typeof titleA === "string" ? titleA.toUpperCase() : titleA;
const valueB = typeof titleB === "string" ? titleB.toUpperCase() : titleB;
// 升序比较（A-Z）
if (valueA < valueB) return -1;
if (valueA > valueB) return 1;
return 0;
});
}
export function newMmToPxFn(mm) {
const px = (Number(mm) / 25.4) * 42;
return Number(px.toFixed(1));
......
src/views/design/main/index.vue
......@@ -229,13 +229,12 @@ export default {
isMove: false,
isOver: false,
dialogVisible: false,
isForcedProduction: false,
};
},
watch: {
imgList: {
async handler() {
this.isMove = false;
this.$store.commit("changeImgList", this.imgList);
},
deep: true,
......@@ -375,14 +374,6 @@ export default {
},
immediate: true,
},
// isOver: {
// handler(newValue) {
// this.dialogVisible = true;
// // if (newValue && this.newDesktopDevice == 3) {
// // this.dialogVisible = true;
// // }
// },
// },
},
methods: {
// 重构为可手动触发的方法
......@@ -655,17 +646,12 @@ export default {
this.showImgSetting = false;
},
dragStop(data, item) {
this.isMove = true;
console.log("dragStop");
this.$set(item, "y", data.y);
this.$set(item, "x", data.x);
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
this.getCutArea();
},
resizeStop(data, item) {
this.isMove = true;
console.log("resizeStop");
if (this.selectIndex < 0 && this.imgList.length) this.selectIndex = 0;
this.$set(item, "y", data.y);
this.$set(item, "w", data.w);
......@@ -680,13 +666,10 @@ export default {
},
resizing() {},
rotating(data, item) {
this.isMove = true;
this.$set(item, "r", data.angle);
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
},
outsideClick(e) {
console.log(e);
if (
!(
e.target.className.includes("drr") ||
......@@ -758,34 +741,24 @@ export default {
);
return img?.productionFile;
},
getBackFile({ files, size }, callback, urlList) {
console.log("productMark", this.detail);
getBackFile({ files, size }, callback, imgType) {
const isCp = this.productMark == "custom_part" ? true : false;
let that = this;
let bw = document.getElementById("line");
let bh = bw.clientHeight;
bw = bw.clientWidth;
this.isView = false;
// bw = Number(bw.replsace("px", ""));
this.isMove = false;
for (let i = 0; i < files.length; i++) {
files[i].url = files[i]?.productionFile || files[i].url;
that.$nextTick(async () => {
let w = bw / 2;
// let h = bh / 2;
let h = bh / 2;
let width_px, height_px, rate, x, y;
let data = await that.getImageSize(files[i].url);
if (size && !files[i].isCut) {
console.log("size", size);
console.log("data", data);
// if (this.newDesktopDevice == 3) {
// const scale = bh / data.height;
// width_px = data.width * scale;
// height_px = data.height * scale;
// x = (bw - data.w) / 2;
// y = h;
// rate = height_px / width_px;
// } else {
const isCut = files[i].isCut;
if (size && !isCut) {
if (isCp) {
width_px =
this.newDesktopDevice == 3
......@@ -804,10 +777,17 @@ export default {
y = height_px / 2;
rate = height_px / width_px;
// }
if (this.newDesktopDevice == 3 && imgType) {
const scale = bh / data.height;
width_px = data.width * scale;
height_px = data.height * scale;
x = (bw - data.w) / 2;
y = h;
rate = height_px / width_px;
}
} else {
rate = data.height / data.width;
console.log("data", data);
console.log("rate", rate);
if (rate > 1) {
height_px = bh * (7.5 / 10);
......@@ -834,40 +814,28 @@ export default {
h: height_px,
r: 0,
});
console.log(that.imgList);
that.selectIndex = that.imgList.length - 1;
that.showImgSetting = true;
// if (this.newDesktopDevice != 3) {
// that.ev("cover");
isCp ? that.ev("x_center") : that.ev("cover");
// }
isCp
? imgType == true
? that.ev("cover")
: that.ev("x_center")
: that.ev("cover");
if (isCut) that.ev("cover");
this.$nextTick(async () => {
const {
isImageBiggerThanGrid,
hasOutsideValidPixel,
} = await checkImageOutsideGrid();
this.isOver = hasOutsideValidPixel;
console.log("urlList", urlList);
console.log("orderType", this.orderType);
if (urlList.length == 1) {
if (isImageBiggerThanGrid && !hasOutsideValidPixel) {
let res = await this.$api.post(
pathMap["processTransparentBackground"][this.orderType],
{
url: urlList[0],
subOrderNumber: this.detail.factorySubOrderNumber,
orderType: this.orderType,
},
);
console.log("processTransparentBackground", res);
}
}
// if (this.isOver) this.$dataStore.set("isOver", this.isOver);
if (isImageBiggerThanGrid && hasOutsideValidPixel) {
this.isOver = hasOutsideValidPixel;
} else if (!isImageBiggerThanGrid) {
this.isOver = isImageBiggerThanGrid;
}
});
if (i === files.length - 1) {
callback && callback();
}
......@@ -993,13 +961,10 @@ export default {
}
this.checkList = JSON.parse(JSON.stringify(this.selectImgList));
try {
// console.log("checkList", this.checkList);
const processQueue = await Promise.all(
this.checkList.map(async (el) => {
try {
const outputDir = path.dirname(el.productionFile);
// console.log(outputDir);
const outputFileName = `${uuid.v4()}.png`;
const outputPath = path.join(outputDir, outputFileName);
......@@ -1123,7 +1088,7 @@ export default {
this.getCutArea();
},
getCutArea() {
// 语法：inset(<top> <right> <bottom> <left>)
this.isMove = true;
if (!this.drrDom) return;
let gradient = "none";
......@@ -1312,7 +1277,7 @@ export default {
this.systemSetting = this.$dataStore.get("setting");
bus.$on("busEmit", (v) => {
let { type, value, size, productMark, urls } = v;
let { type, value, size, productMark, urls, imgeType } = v;
switch (type) {
case "completeMessage":
......@@ -1363,7 +1328,7 @@ export default {
this.imgList = [];
this.selectImgList = [];
this.selectIndex = -1;
this.productMark = productMark;
this.productMark = productMark || this.productMark;
if (value.length > 0) {
this.selectImgList = value;
......@@ -1379,9 +1344,9 @@ export default {
this.selectImgIndex = 0;
}
console.log("designImageSize", this.detail.designImageSize);
if (this.selectImgIndex != -1) {
console.log("urls", urls);
this.getBackFile(
{
files: [value[this.selectImgIndex]],
......@@ -1393,6 +1358,7 @@ export default {
);
},
urls,
imgeType,
);
}
}
......@@ -1801,16 +1767,7 @@ export default {
></div>
</div>
</vue-drag-resize-rotate>
<!-- <div style="position: relative;">
<button @click="checkOutsidePixel" class="detect-btn">
检测超出区域是否有像素
</button>
<div class="result" v-if="detectResult !== null">
检测结果：{{ detectResult ? "有" : "无" }}
</div>
</div> -->
<!-- 隐藏的Canvas（用于像素检测） -->
<canvas ref="pixelCanvas" style="display: none"></canvas>
</div>
......@@ -1846,7 +1803,7 @@ export default {
class="print-tip"
:style="{ left: isView ? '' : '22%' }"
v-if="
detail?.custom_part == 'custom_part' &&
productMark == 'custom_part' &&
selectImgList.length &&
!isOver &&
!isMove &&
......@@ -1857,11 +1814,9 @@ export default {
</div>
<div
class="print-tip"
:style="{ left: isView ? '' : '22%' }"
:style="{ left: isView ? '' : '6%' }"
v-if="
detail?.custom_part == 'custom_part' &&
selectImgList.length &&
isOver
productMark == 'custom_part' && selectImgList.length && isOver
"
>
<b style="color:red"
......@@ -1996,7 +1951,7 @@ export default {
<style lang="less" scoped>
.print-tip {
position: absolute;
bottom: 16px;
bottom: 60px;
font-size: 24px;
left: 25%;
}
......
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