Skip to content

E
electron-printer
Commit 6d7e3d33 by linjinhong
Options

feat:添加惠立彩图片判断

parent 6df3273f
Showing with 320 additions and 252 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"}
"apiApiHost": "https://factory.jomalls.com/api", \ No newline at end of file
"fileApiUrl": "https://factory.jomalls.com/upload/factory",
"visionUrl": "https://console.jomalls.com",
"configPath": "D:\\work\\electron-printer\\config\\env.json"
}
src/api/index.js
const { getHostApi } = require("@/server/utils/store"); const { getHostApi } = require("@/server/utils/store");
import { Loading } from "element-ui"; import { Loading } from "element-ui";
const { pathMap } = require("@/config/index.js");
import { downloadImage, downloadOtherImage } from "@/server/utils"; import { downloadImage, downloadOtherImage } from "@/server/utils";
import axios from "../utils/axios"; import axios from "../utils/axios";
...@@ -77,14 +78,6 @@ const downloadDesignImagesBaseApi = (urlPath, params) => { ...@@ -77,14 +78,6 @@ const downloadDesignImagesBaseApi = (urlPath, params) => {
return axios.post(urlPath, requestData, { baseURL: env, skipLoading: true }); return axios.post(urlPath, requestData, { baseURL: env, skipLoading: true });
}; };
// 接口路径映射表（集中管理，便于维护）
const API_PATH_MAP = {
CN: "factory/podJomallOrderProductCn/downloadDesignImages",
US: "factory/podJomallOrderProductUs/downloadDesignImages",
GC: "factory/podJomallOrder/downloadByProduction",
USHLC: "factory/podJomallOrderProductUs/downloadCompatibleDesignImages",
CNHLC: "factory/podJomallOrderProductCn/downloadCompatibleDesignImages",
};
/** /**
* 根据子订单号下载素材 * 根据子订单号下载素材
...@@ -103,7 +96,7 @@ export async function downloadBySubOrderNumberApi(params) { ...@@ -103,7 +96,7 @@ export async function downloadBySubOrderNumberApi(params) {
} }
// 4. 发送请求获取下载链接 // 4. 发送请求获取下载链接
const { data, message } = await downloadDesignImagesBaseApi( const { data, message } = await downloadDesignImagesBaseApi(
API_PATH_MAP[targetType], pathMap["downloadBySubOrderNumber"][targetType],
params, params,
); );
// 建议明确获取响应data（根据实际axios响应结构调整） // 建议明确获取响应data（根据实际axios响应结构调整）
...@@ -141,51 +134,6 @@ export async function downloadBySubOrderNumberApi(params) { ...@@ -141,51 +134,6 @@ export async function downloadBySubOrderNumberApi(params) {
} }
} }
/**
* 渲染进程调用主进程下载方法（Electron 6.x 兼容）
* @param {number} device - 设备类型 2/3
* @param {array} files - 下载文件列表
* @returns {Promise} 下载结果
*/
// function callMainProcessDownload(device, files) {
// // 生成唯一 requestId，用于匹配请求和响应（避免多请求冲突）
// const requestId = `download_${Date.now()}_${Math.random()
// .toString(36)
// .substr(2, 9)}`;
// return new Promise((resolve, reject) => {
// // 1. 监听主进程的响应（一次性监听，避免内存泄漏）
// const responseHandler = (event, result) => {
// // 只处理当前 requestId 的响应
// if (result.requestId !== requestId) return;
// // 移除监听（关键：避免重复监听）
// ipcRenderer.removeListener("download-image-response", responseHandler);
// // 处理结果
// if (result.success) {
// resolve(result);
// } else {
// reject(new Error(result.message));
// }
// };
// ipcRenderer.on("download-image-response", responseHandler);
// // 2. 向主进程发送下载请求
// ipcRenderer.send("download-image-request", {
// requestId,
// device,
// files,
// });
// // 3. 超时处理（避免一直等待）
// setTimeout(() => {
// ipcRenderer.removeListener("download-image-response", responseHandler);
// reject(new Error("调用主进程下载方法超时"));
// }, 120000); // 2分钟超时
// });
// }
// ===================== 订单完成相关 ===================== // ===================== 订单完成相关 =====================
/** /**
* 通用完成订单接口 * 通用完成订单接口
......
src/background.js
...@@ -243,8 +243,8 @@ async function createWindow() { ...@@ -243,8 +243,8 @@ async function createWindow() {
} }
try { try {
let configObj = JSON.parse(data); let configObj = JSON.parse(data);
configObj.apiApiHost = `https://${newDomain}/api`; configObj.apiApiHost = `http://${newDomain}/api`;
configObj.fileApiUrl = `https://${newDomain}/upload/factory`; configObj.fileApiUrl = `http://${newDomain}/upload/factory`;
configObj.configPath = configPath; configObj.configPath = configPath;
const newData = JSON.stringify(configObj); // 使用2个空格缩进 const newData = JSON.stringify(configObj); // 使用2个空格缩进
......
src/config/index.js
...@@ -16,6 +16,10 @@ export const pathMap = { ...@@ -16,6 +16,10 @@ export const pathMap = {
US: "factory/podJomallOrderProductUs/completeDelivery", US: "factory/podJomallOrderProductUs/completeDelivery",
GC: "factory/podJomallOrderProduct/completeDelivery", GC: "factory/podJomallOrderProduct/completeDelivery",
}, },
processTransparentBackground: {
CN: "api/factory/podJomallOrderProductCn/processTransparentBackground",
US: "api/factory/podJomallOrderProductUs/processTransparentBackground",
},
}; };
export function autoRegisterRouter(router, funcKey, handler) { export function autoRegisterRouter(router, funcKey, handler) {
......
src/server/entity/function.js
...@@ -9,6 +9,7 @@ const { ...@@ -9,6 +9,7 @@ const {
cropImageTransparentEdges, cropImageTransparentEdges,
cropTransparentEdges, cropTransparentEdges,
processImages, processImages,
cropToPrintArea,
} = require("../utils/setImage"); } = require("../utils/setImage");
import axios from "axios"; import axios from "axios";
import { returnLogFilePath } from "../utils/log"; import { returnLogFilePath } from "../utils/log";
...@@ -28,6 +29,9 @@ const { ...@@ -28,6 +29,9 @@ const {
getHostApi, getHostApi,
getDesktopDevice, getDesktopDevice,
} = require("@/server/utils/store"); } = require("@/server/utils/store");
const { pathMap } = require("@/config/index.js");
//获取当前驱动版本 //获取当前驱动版本
function getCurrentVersion() { function getCurrentVersion() {
const version = getVersion(); const version = getVersion();
...@@ -143,18 +147,14 @@ export default { ...@@ -143,18 +147,14 @@ export default {
const params = req.body; const params = req.body;
const token = req.headers["jwt-token"]; const token = req.headers["jwt-token"];
const urlMap = { const downloadBySubOrderNumber = pathMap["downloadBySubOrderNumber"];
CN: "factory/podJomallOrderProductCn/downloadDesignImages",
US: "factory/podJomallOrderProductUs/downloadDesignImages",
GC: "factory/podJomallOrder/downloadByProduction",
USHLC: "factory/podJomallOrderProductUs/downloadCompatibleDesignImages",
CNHLC: "factory/podJomallOrderProductCn/downloadCompatibleDesignImages",
};
try { try {
let url = urlMap[params.orderType]; let url = downloadBySubOrderNumber[params.orderType];
if (params.device == 3) { if (params.device == 3) {
url = params.orderType == "CN" ? urlMap["CNHLC"] : urlMap["USHLC"]; url =
params.orderType == "CN"
? downloadBySubOrderNumber["CNHLC"]
: downloadBySubOrderNumber["USHLC"];
} }
const { data } = await axios.post(`${env}/${url}`, [...params.ids], { const { data } = await axios.post(`${env}/${url}`, [...params.ids], {
headers: { "jwt-token": token }, headers: { "jwt-token": token },
...@@ -480,6 +480,17 @@ export default { ...@@ -480,6 +480,17 @@ export default {
res.json({ code: 500, msg: err.message }); 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) => { cleanDirectorySync: async (req, res) => {
const desktopDevice = getCurrentDesktopDevice(); const desktopDevice = getCurrentDesktopDevice();
...@@ -573,4 +584,23 @@ export default { ...@@ -573,4 +584,23 @@ export default {
res.json({ code: 500, msg: error }); res.json({ code: 500, msg: error });
} }
}, },
processTransparentBackground: async (req, res) => {
env = getHostApi().apiApiHost;
const token = req.headers["jwt-token"];
const params = req.body;
const processTransparentBackground =
pathMap["processTransparentBackground"];
let url = processTransparentBackground[params.orderType];
let postData = { url: "", subOrderNumber: "" };
try {
let { data } = await axios.post(`${env}/${url}`, postData, {
headers: { "jwt-token": token },
});
res.send(data);
} catch (err) {
console.log(err);
res.json({ code: 500, msg: err });
}
},
}; };
src/server/routes/index.js
...@@ -39,6 +39,8 @@ router.post("/imageTransparentEdges", fn.imageTransparentEdges); ...@@ -39,6 +39,8 @@ router.post("/imageTransparentEdges", fn.imageTransparentEdges);
router.post("/imageListTransparentEdges", fn.imageListTransparentEdges); router.post("/imageListTransparentEdges", fn.imageListTransparentEdges);
// 处理图片并输出结果 // 处理图片并输出结果
router.post("/processImage", fn.processImage); router.post("/processImage", fn.processImage);
// 处理图片并输出结果
router.post("/cropToPrintArea", fn.cropToPrintAreaApi);
// 删除图片 // 删除图片
router.post("/cleanDirectorySync", fn.cleanDirectorySync); router.post("/cleanDirectorySync", fn.cleanDirectorySync);
...@@ -56,4 +58,10 @@ router.post("/copySingleImageFn", fn.copySingleImageFn); ...@@ -56,4 +58,10 @@ router.post("/copySingleImageFn", fn.copySingleImageFn);
// 根据生产单号查询详情 // 根据生产单号查询详情
autoRegisterRouter(router, "findByPodProductionNo", fn.findByPodProductionNo); autoRegisterRouter(router, "findByPodProductionNo", fn.findByPodProductionNo);
autoRegisterRouter(
router,
"processTransparentBackground",
fn.processTransparentBackground,
);
export { router as default }; export { router as default };
src/server/utils/setImage.js
...@@ -422,112 +422,187 @@ function applyPadding(bounds, padding, imgWidth, imgHeight) { ...@@ -422,112 +422,187 @@ function applyPadding(bounds, padding, imgWidth, imgHeight) {
async function checkImageOutsideGrid() { async function checkImageOutsideGrid() {
try { try {
// ===================== 第一步：获取 DOM 几何信息（核心！）===================== // ===================== 第一步：获取 DOM 几何信息（核心！）=====================
// 1. 网格 DOM 信息（位置+尺寸，基于视口的绝对位置）
const lineDom = document.getElementById("line"); const lineDom = document.getElementById("line");
if (!lineDom) throw new Error("未找到网格元素（id=line）"); if (!lineDom) {
const lineRect = lineDom.getBoundingClientRect(); // 网格的位置+尺寸 console.log("未找到网格元素（id=line）");
return false;
}
const lineRect = lineDom.getBoundingClientRect();
const grid = { const grid = {
left: lineRect.left, // 网格左边界（视口坐标） left: lineRect.left,
top: lineRect.top, // 网格上边界（视口坐标） top: lineRect.top,
right: lineRect.right, // 网格右边界 right: lineRect.right,
bottom: lineRect.bottom, // 网格下边界 bottom: lineRect.bottom,
width: lineRect.width, // 网格宽度 width: lineRect.width,
height: lineRect.height, // 网格高度 height: lineRect.height,
}; };
if (grid.width === 0 || grid.height === 0) if (grid.width === 0 || grid.height === 0) return false;
throw new Error("网格尺寸为0，请确认网格已渲染");
// 2. 图片 DOM 信息（位置+尺寸+原始尺寸）
const imgDom = document.getElementById("imgBox"); const imgDom = document.getElementById("imgBox");
if (!imgDom || !imgDom.complete) if (!imgDom) {
throw new Error("图片未加载完成或未找到imgBox元素"); console.log("图片未加载完成或未找到imgBox元素");
const imgRect = imgDom.getBoundingClientRect(); // 图片的位置+尺寸（视口坐标） return false;
}
// ✅ 修复 1：确保图片加载完成（最关键！）
await new Promise((resolve) => {
if (imgDom.complete) resolve();
else imgDom.onload = resolve;
});
const imgRect = imgDom.getBoundingClientRect();
// ✅ 修复 2：正确获取图片原始尺寸（必须等 onload 之后）
const naturalWidth = imgDom.naturalWidth;
const naturalHeight = imgDom.naturalHeight;
if (naturalWidth === 0 || naturalHeight === 0) {
console.log("图片原始尺寸为0");
return false;
}
const imgDisplayInfo = { const imgDisplayInfo = {
left: imgRect.left, // 图片左边界（视口坐标） left: imgRect.left,
top: imgRect.top, // 图片上边界（视口坐标） top: imgRect.top,
width: imgRect.width, // 图片显示宽度（页面渲染尺寸） width: imgRect.width,
height: imgRect.height, // 图片显示高度（页面渲染尺寸） height: imgRect.height,
naturalWidth: imgDom.naturalWidth, // 图片原始宽度 naturalWidth,
naturalHeight: imgDom.naturalHeight, // 图片原始高度 naturalHeight,
}; };
if (imgDisplayInfo.width === 0 || imgDisplayInfo.height === 0)
throw new Error("图片显示尺寸为0"); const isImageBiggerThanGrid =
imgDisplayInfo.width > grid.width || imgDisplayInfo.height > grid.height;
// 如果图片不大于网格，直接返回false，不执行sharp和像素检测
if (!isImageBiggerThanGrid) {
console.log("图片尺寸小于/等于网格，无需检测越界");
return false;
}
// ===================== 第二步：Sharp 读取图片原始像素 ===================== // ===================== 第二步：Sharp 读取图片原始像素 =====================
// 1. 处理图片 URL（Electron 中兼容本地/远程图片）
let imgSource = imgDom.src; let imgSource = imgDom.src;
// 本地图片：转换为绝对路径（sharp 支持本地路径）
if (imgSource.startsWith("file://")) { if (imgSource.startsWith("file://")) {
imgSource = new URL(imgSource).pathname; imgSource = new URL(imgSource).pathname;
// Windows 路径兼容
if (process.platform === "win32") { if (process.platform === "win32") {
imgSource = imgSource.slice(1); // 去掉开头的 / imgSource = imgSource.slice(1);
} }
} }
// 2. Sharp 读取图片并获取原始像素（RGBA 格式）
const sharpImg = sharp(imgSource); const sharpImg = sharp(imgSource);
const imgMetadata = await sharpImg.metadata(); // 获取图片元信息 const imgMetadata = await sharpImg.metadata();
const { data: pixels } = await sharpImg const { data: pixels } = await sharpImg
.raw() // 转为原始像素 Buffer（RGBA，每个像素4字节） .raw()
.toBuffer({ resolveWithObject: true }); // 返回像素 Buffer + 信息 .toBuffer({ resolveWithObject: true });
// ===================== 第三步：坐标映射 + 像素检测 ===================== // ===================== 第三步：坐标映射 + 像素检测 =====================
// 1. 计算缩放比例：原始像素 → 页面显示坐标 const scaleX = imgDisplayInfo.width / naturalWidth;
const scaleX = imgDisplayInfo.width / imgDisplayInfo.naturalWidth; // 水平缩放比 const scaleY = imgDisplayInfo.height / naturalHeight;
const scaleY = imgDisplayInfo.height / imgDisplayInfo.naturalHeight; // 垂直缩放比
// 2. 遍历像素检测（步长=1，测试阶段；正式可改为2/4优化性能）
let hasOutsideValidPixel = false; let hasOutsideValidPixel = false;
const alphaThreshold = 1; // 有效像素阈值（Alpha > 1 即为有效） const alphaThreshold = 1;
const imgNaturalWidth = imgMetadata.width; const imgNaturalWidth = imgMetadata.width;
const imgNaturalHeight = imgMetadata.height; const imgNaturalHeight = imgMetadata.height;
for (let y = 0; y < imgNaturalHeight; y++) { for (let y = 0; y < imgNaturalHeight; y++) {
if (hasOutsideValidPixel) break; // 找到有效像素后终止遍历 if (hasOutsideValidPixel) break;
for (let x = 0; x < imgNaturalWidth; x++) { for (let x = 0; x < imgNaturalWidth; x++) {
// a. 原始像素 → 页面显示坐标（图片在视口中的绝对位置）
const imgDisplayX = imgDisplayInfo.left + x * scaleX; const imgDisplayX = imgDisplayInfo.left + x * scaleX;
const imgDisplayY = imgDisplayInfo.top + y * scaleY; const imgDisplayY = imgDisplayInfo.top + y * scaleY;
// b. 判断当前像素是否超出网格边界 // ✅ 修复 3：防止 NaN 导致误判
if (isNaN(imgDisplayX) || isNaN(imgDisplayY)) continue;
const isOutside = const isOutside =
imgDisplayX < grid.left || // 超出网格左边界 imgDisplayX < grid.left ||
imgDisplayX > grid.right || // 超出网格右边界 imgDisplayX > grid.right ||
imgDisplayY < grid.top || // 超出网格上边界 imgDisplayY < grid.top ||
imgDisplayY > grid.bottom; // 超出网格下边界 imgDisplayY > grid.bottom;
if (isOutside) { if (isOutside) {
// c. 获取当前像素的 Alpha 值（RGBA 的第4个字节）
const pixelIndex = (y * imgNaturalWidth + x) * 4; const pixelIndex = (y * imgNaturalWidth + x) * 4;
const alpha = pixels[pixelIndex + 3]; // Alpha 通道（0-255） const alpha = pixels[pixelIndex + 3];
// d. 检测有效像素
if (alpha > alphaThreshold) { if (alpha > alphaThreshold) {
hasOutsideValidPixel = true; hasOutsideValidPixel = true;
console.log( console.log(`找到超出网格的有效像素：(${x},${y})`);
`找到超出网格的有效像素：原始坐标(${x},${y}) → 页面坐标(${imgDisplayX.toFixed( break;
2,
)},${imgDisplayY.toFixed(2)}) → Alpha=${alpha}`,
);
break; // 终止内层循环
} }
} }
} }
} }
// ===================== 第四步：返回结果 ===================== console.log("检测结果：", hasOutsideValidPixel ? "超出网格" : "正常");
console.log(
"检测结果：",
hasOutsideValidPixel ? "超出网格有有效像素" : "超出网格无有效像素",
);
return hasOutsideValidPixel; return hasOutsideValidPixel;
} catch (error) { } catch (error) {
console.error("图片超出网格检测失败：", error); console.error("检测失败：", error);
alert(`检测失败：${error.message}`);
return false; return false;
} }
} }
const FIXED_MASK_RATIO = {
left: 0.341,
top: 0.308,
width: 0.443,
height: 0.443,
};
async function cropToPrintArea(inputPath, outputPath, data) {
if (!data) return false;
const { canvasWidth, canvasHeight, rect_info } = data;
// 正确比例（你裁剪必须用这个）
let RATIO = { ...FIXED_MASK_RATIO };
if (rect_info) {
RATIO = {
left: rect_info.leftDistance / canvasWidth,
top: rect_info.topDistance / canvasHeight,
width: rect_info.rectWidth / canvasWidth,
height: rect_info.rectHeight / canvasHeight,
};
}
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);
// 3. 执行裁剪
await sharp(inputPath)
.extract({
left: cropLeft,
top: cropTop,
width: cropWidth,
height: cropHeight,
})
.toFile(outputPath);
// 4. ✅ 返回你要的结构
const results = [
{
file: path.basename(inputPath),
...{
status: "cropped",
outputPath: outputPath,
originalSize: { width, height },
newSize: { width: cropWidth, height: cropHeight },
cropArea: {
x: cropLeft,
y: cropTop,
width: cropWidth,
height: cropHeight,
},
},
},
];
fs.unlinkSync(inputPath);
return results;
} catch (error) {
throw new Error("图片裁剪失败: " + error.message);
}
}
// 分区边界检测实现 // 分区边界检测实现
...@@ -537,4 +612,5 @@ module.exports = { ...@@ -537,4 +612,5 @@ module.exports = {
processImages, processImages,
cropImage, cropImage,
checkImageOutsideGrid, checkImageOutsideGrid,
cropToPrintArea,
}; };
src/utils/index.js
...@@ -244,7 +244,7 @@ export function extractValue(str) { ...@@ -244,7 +244,7 @@ export function extractValue(str) {
if (str.includes("_B_")) return "B"; if (str.includes("_B_")) return "B";
} }
export function mmToPxFn(mm) { export function newMmToPxFn(mm) {
const px = (Number(mm) / 25.4) * 42; const px = (Number(mm) / 25.4) * 42;
return Number(px.toFixed(1)); return Number(px.toFixed(1));
} }
src/views/design/head/index.vue
...@@ -72,6 +72,7 @@ export default { ...@@ -72,6 +72,7 @@ export default {
pkg, pkg,
actionIndex: -1, actionIndex: -1,
isAutoFinish: false, isAutoFinish: false,
isForcedProduction: false,
cacheVisible: false, cacheVisible: false,
showPrintDialog: false, showPrintDialog: false,
productionNo: "", productionNo: "",
...@@ -105,6 +106,7 @@ export default { ...@@ -105,6 +106,7 @@ export default {
"#c7158577", "#c7158577",
], ],
faceType: "A", faceType: "A",
dialogVisible: false,
}; };
}, },
computed: { computed: {
...@@ -398,33 +400,7 @@ export default { ...@@ -398,33 +400,7 @@ export default {
// async函数本身返回Promise，直接return即可，无需手动resolve // async函数本身返回Promise，直接return即可，无需手动resolve
return imageList; return imageList;
}, },
// async canvasToImage(canvasList) {
// return new Promise(async (resolve, reject) => {
// let imageList = [];
// try {
// for (let canvasItem of canvasList) {
// const canvas = document.createElement("canvas");
// canvas.className = "createCanvas";
// canvas.width = canvasItem.canvasWidth;
// canvas.height = canvasItem.canvasHeight;
// let list = [];
// for (let listItem of canvasItem.list) {
// list.push(this.drawImage(canvas, listItem));
// }
// await Promise.all(list);
// let base = canvas.toDataURL("image/png", 1);
// // console.log("base", base);
// canvas.remove();
// imageList.push(base);
// }
// resolve(imageList);
// } catch (e) {
// // console.log(e);
// reject(e);
// }
// });
// },
base64ToFile(base64, fileName) { base64ToFile(base64, fileName) {
let arr = base64.split(","); let arr = base64.split(",");
let bstr = atob(arr[1]); let bstr = atob(arr[1]);
...@@ -448,7 +424,14 @@ export default { ...@@ -448,7 +424,14 @@ export default {
async hasDesignImagesCanvasJsonList(designImagesCanvasJsonList, bool) { async hasDesignImagesCanvasJsonList(designImagesCanvasJsonList, bool) {
let imageResList = []; let imageResList = [];
designImagesCanvasJsonList = JSON.parse(designImagesCanvasJsonList);
const isCustom = !designImagesCanvasJsonList[0].images || false;
const {
canvasWidth,
canvasHeight,
rect_info,
} = designImagesCanvasJsonList;
const params = { canvasWidth, canvasHeight, rect_info };
//当adjustable有值时 直接赋值宽高 //当adjustable有值时 直接赋值宽高
// if ( // if (
// !this.checked && // !this.checked &&
...@@ -517,7 +500,8 @@ export default { ...@@ -517,7 +500,8 @@ export default {
imageResList = this.detail?.saveImgList || []; imageResList = this.detail?.saveImgList || [];
console.log("imageResList", imageResList); console.log("imageResList", imageResList);
} }
if (isCustom && this.desktopDevice !== 3)
imageResList = await this.cutImgFn(imageResList, true, params);
if (this.checked) { if (this.checked) {
imageResList = await this.cutImgFn(imageResList); imageResList = await this.cutImgFn(imageResList);
imageResList.forEach((el) => { imageResList.forEach((el) => {
...@@ -574,6 +558,7 @@ export default { ...@@ -574,6 +558,7 @@ export default {
let obj = { let obj = {
type: "sendFile", type: "sendFile",
value: [...newImgList], value: [...newImgList],
productMark: this.detail.productMark,
}; };
if ( if (
...@@ -631,6 +616,10 @@ export default { ...@@ -631,6 +616,10 @@ export default {
}); });
} }
} }
// if (this.desktopDevice == 3 && !this.isForcedProduction) {
// }
//判断生产单号是否为空 //判断生产单号是否为空
if (this.productionNo === "") if (this.productionNo === "")
return this.$message.warning("请录入生产单号"); return this.$message.warning("请录入生产单号");
...@@ -845,7 +834,7 @@ export default { ...@@ -845,7 +834,7 @@ export default {
this.$store.commit("setGrid"); this.$store.commit("setGrid");
this.command(0); this.command(0);
}, },
async cutImgFn(arr) { async cutImgFn(arr, type, data) {
if (!arr.length) return arr; if (!arr.length) return arr;
console.log(arr); console.log(arr);
...@@ -859,8 +848,11 @@ export default { ...@@ -859,8 +848,11 @@ export default {
const params = { const params = {
inputPath: el.productionFile, inputPath: el.productionFile,
outputPath: outputPath, outputPath: outputPath,
data,
}; };
const res = await this.$api.post("/processImage", params); let res;
if (!type) res = await this.$api.post("/processImage", params);
else res = await this.$api.post("/cropToPrintArea", params);
return { return {
fileName: outputFileName, fileName: outputFileName,
...@@ -1117,13 +1109,6 @@ export default { ...@@ -1117,13 +1109,6 @@ export default {
</div> </div>
</div> </div>
<div class="center-input"> <div class="center-input">
<!-- <el-button
@click="clearArray"
size="medium"
style="margin-right: 10px"
type="primary"
>清空本地数据
</el-button> -->
<el-input <el-input
@keyup.enter.native="getDataInfo" @keyup.enter.native="getDataInfo"
style="width: 40%;" style="width: 40%;"
...@@ -1151,6 +1136,11 @@ export default { ...@@ -1151,6 +1136,11 @@ export default {
<div style="margin-left: 10px;"> <div style="margin-left: 10px;">
<el-checkbox v-model="isAutoFinish">自动完成上一单</el-checkbox> <el-checkbox v-model="isAutoFinish">自动完成上一单</el-checkbox>
</div> </div>
<div style="margin-left: 10px;" v-if="desktopDevice == 3">
<el-checkbox v-model="isForcedProduction" style="color: red;"
>自动强制生产</el-checkbox
>
</div>
<div style="margin-left: 10px;" v-show="desktopDevice != 3"> <div style="margin-left: 10px;" v-show="desktopDevice != 3">
<el-checkbox v-model="checked">自动裁切</el-checkbox> <el-checkbox v-model="checked">自动裁切</el-checkbox>
</div> </div>
...@@ -1208,6 +1198,23 @@ export default { ...@@ -1208,6 +1198,23 @@ export default {
<el-button @click="clearCache" type="primary">清除</el-button> <el-button @click="clearCache" type="primary">清除</el-button>
</template> </template>
</el-dialog> </el-dialog>
<el-dialog
title="警告：无法直接生产"
:visible.sync="dialogVisible"
width="30%"
>
<div>
素材效果已经超出台版范围，无法直接打印。请更换打印设
备，或者进行强制生产
</div>
<div>注:“自动强制生产”会让每次生产都强制生产</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button>强制生产</el-button>
<el-button type="primary">自动强制生产</el-button>
</span>
</el-dialog>
</div> </div>
</template> </template>
......
src/views/design/main/index.vue
...@@ -4,7 +4,7 @@ const { ipcRenderer } = require("electron"); ...@@ -4,7 +4,7 @@ const { ipcRenderer } = require("electron");
import ImgSetting from "./imgSetting.vue"; import ImgSetting from "./imgSetting.vue";
import bus from "@/bus"; import bus from "@/bus";
import PrintDialog from "@/views/design/head/printDialog.vue"; import PrintDialog from "@/views/design/head/printDialog.vue";
import { mmToPx, mmToPxFn, extractValue } from "@/utils"; import { mmToPx, newMmToPxFn, extractValue } from "@/utils";
const { checkImageOutsideGrid } = require("../../../server/utils/setImage"); const { checkImageOutsideGrid } = require("../../../server/utils/setImage");
const { pathMap } = require("@/config/index.js"); const { pathMap } = require("@/config/index.js");
...@@ -145,6 +145,7 @@ export default { ...@@ -145,6 +145,7 @@ export default {
return JSON.parse(JSON.stringify(this.imgList[this.selectIndex])); return JSON.parse(JSON.stringify(this.imgList[this.selectIndex]));
} }
this.showImgSetting = false; this.showImgSetting = false;
return null; return null;
}, },
...@@ -180,7 +181,7 @@ export default { ...@@ -180,7 +181,7 @@ export default {
actionList: [], actionList: [],
checkList: [], checkList: [],
oldImgList: [], oldImgList: [],
hasSize: false,
parentWidth: 0, parentWidth: 0,
backColor: "#77797a", backColor: "#77797a",
gridBg: "#ffffff", gridBg: "#ffffff",
...@@ -224,36 +225,38 @@ export default { ...@@ -224,36 +225,38 @@ export default {
expandStatus: {}, expandStatus: {},
detectResult: null, // 检测结果 detectResult: null, // 检测结果
imgNaturalSize: { width: 0, height: 0 }, // 图片原始尺寸 imgNaturalSize: { width: 0, height: 0 }, // 图片原始尺寸
productMark: "",
isMove: false,
isOver: false,
}; };
}, },
watch: { watch: {
imgList: { imgList: {
async handler(newValue) { async handler() {
// console.log(223, newValue); this.isMove = false;
// console.log(223, this.returnItem); // const image = document.getElementById("imgBox");
// console.log(234, image);
const image = document.getElementById("imgBox");
// if (newValue.length && image) {
if (newValue.length && image) { // this.$nextTick(() => {
// this.$nextTick(() => { // let dom = document.getElementsByClassName("drr");
// let dom = document.getElementsByClassName("drr"); // console.log(228, dom);
// console.log(228, dom); // this.imgList.forEach((el, i) => {
// this.imgList.forEach((el, i) => { // let dom_i = document.getElementsByClassName("drr")[i];
// let dom_i = document.getElementsByClassName("drr")[i]; // dom_i.style.zIndex =
// dom_i.style.zIndex = // dom_i.style.zIndex === "" || !dom_i.style.zIndex
// dom_i.style.zIndex === "" || !dom_i.style.zIndex // ? 0
// ? 0 // : dom_i.style.zIndex;
// : dom_i.style.zIndex; // dom[i].addEventListener("click", () => {
// dom[i].addEventListener("click", () => { // if (this.newDesktopDevice == 3) {
// if (this.newDesktopDevice == 3) { // return;
// return; // }
// } // this.selectIndex = i;
// this.selectIndex = i; // this.selectItem(i);
// this.selectItem(i); // });
// }); // });
// }); // });
// });
}
this.$store.commit("changeImgList", this.imgList); this.$store.commit("changeImgList", this.imgList);
}, },
deep: true, deep: true,
...@@ -270,7 +273,7 @@ export default { ...@@ -270,7 +273,7 @@ export default {
this.showImgSetting = false; this.showImgSetting = false;
} }
}, },
desktopDevice(newValue) { desktopDevice() {
this.newDesktopDevice = getDesktopDevice(); this.newDesktopDevice = getDesktopDevice();
this.detail = {}; this.detail = {};
...@@ -665,6 +668,7 @@ export default { ...@@ -665,6 +668,7 @@ export default {
this.showImgSetting = false; this.showImgSetting = false;
}, },
dragStop(data, item) { dragStop(data, item) {
this.isMove = true;
console.log("dragStop"); console.log("dragStop");
this.$set(item, "y", data.y); this.$set(item, "y", data.y);
this.$set(item, "x", data.x); this.$set(item, "x", data.x);
...@@ -672,6 +676,7 @@ export default { ...@@ -672,6 +676,7 @@ export default {
this.getCutArea(); this.getCutArea();
}, },
resizeStop(data, item) { resizeStop(data, item) {
this.isMove = true;
console.log("resizeStop"); console.log("resizeStop");
if (this.selectIndex < 0 && this.imgList.length) this.selectIndex = 0; if (this.selectIndex < 0 && this.imgList.length) this.selectIndex = 0;
...@@ -688,6 +693,7 @@ export default { ...@@ -688,6 +693,7 @@ export default {
}, },
resizing() {}, resizing() {},
rotating(data, item) { rotating(data, item) {
this.isMove = true;
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)));
}, },
...@@ -766,8 +772,8 @@ export default { ...@@ -766,8 +772,8 @@ export default {
return img?.productionFile; return img?.productionFile;
}, },
getBackFile({ files, size }, callback) { getBackFile({ files, size }, callback) {
console.log(333333333); console.log("productMark", this.detail);
const isCp = this.productMark == "custom_part" ? true : false;
let that = this; let that = this;
let bw = document.getElementById("line"); let bw = document.getElementById("line");
let bh = bw.clientHeight; let bh = bw.clientHeight;
...@@ -793,8 +799,14 @@ export default { ...@@ -793,8 +799,14 @@ export default {
y = h; y = h;
rate = height_px / width_px; rate = height_px / width_px;
} else { } else {
width_px = mmToPxFn(size.width); if (isCp) {
height_px = mmToPxFn(size.height); width_px = newMmToPxFn(size.width);
height_px = newMmToPxFn(size.height);
} else {
width_px = mmToPx(size.width);
height_px = mmToPx(size.height);
}
x = w; x = w;
y = height_px / 2; y = height_px / 2;
rate = height_px / width_px; rate = height_px / width_px;
...@@ -835,14 +847,11 @@ export default { ...@@ -835,14 +847,11 @@ export default {
that.selectIndex = that.imgList.length - 1; that.selectIndex = that.imgList.length - 1;
that.showImgSetting = true; that.showImgSetting = true;
if (this.newDesktopDevice != 3) { if (this.newDesktopDevice != 3) {
that.ev("x_center"); // that.ev("cover");
// if (size && !files[i].isCut) { isCp ? that.ev("x_center") : that.ev("cover");
// console.log(7898, this.detail); this.$nextTick(async () => {
this.isOver = await checkImageOutsideGrid();
// this.detail.isCustom ? that.ev("center") : that.ev("cover"); });
// } else {
// that.ev("x_center");
// }
} }
if (i === files.length - 1) { if (i === files.length - 1) {
callback && callback(); callback && callback();
...@@ -1267,10 +1276,7 @@ export default { ...@@ -1267,10 +1276,7 @@ export default {
// 自动保留 Value 内部的所有 key，美化缩进 // 自动保留 Value 内部的所有 key，美化缩进
return JSON.stringify(data, null, 2); return JSON.stringify(data, null, 2);
}, },
async checkOutsidePixel() {
const bool = await checkImageOutsideGrid();
console.log(bool);
},
onImageLoad(e) { onImageLoad(e) {
this.imgNaturalSize.width = e.target.naturalWidth; this.imgNaturalSize.width = e.target.naturalWidth;
this.imgNaturalSize.height = e.target.naturalHeight; this.imgNaturalSize.height = e.target.naturalHeight;
...@@ -1280,10 +1286,9 @@ export default { ...@@ -1280,10 +1286,9 @@ export default {
mounted() { mounted() {
this.imgHeight = window.screen.height + "px"; this.imgHeight = window.screen.height + "px";
this.systemSetting = this.$dataStore.get("setting"); this.systemSetting = this.$dataStore.get("setting");
// console.log(1297, this.newDesktopDevice);
bus.$on("busEmit", (v) => { bus.$on("busEmit", (v) => {
let { type, value, size } = v; let { type, value, size, productMark } = v;
switch (type) { switch (type) {
case "completeMessage": case "completeMessage":
...@@ -1309,21 +1314,7 @@ export default { ...@@ -1309,21 +1314,7 @@ export default {
height: this.detail.mssHeight, height: this.detail.mssHeight,
}; };
} }
console.log(1296, this.detail);
// if (this.selectImgIndex != -1 && this.selectImgList.length) {
// this.getBackFile(
// {
// files: [this.selectImgList[this.selectImgIndex]],
// size: this.detail.designImageSize || null,
// },
// () => {
// this.imgHistoryList.push(
// JSON.parse(JSON.stringify(this.imgList)),
// );
// },
// );
// }
break; break;
case "index": case "index":
this.indexChange(value); this.indexChange(value);
...@@ -1343,12 +1334,12 @@ export default { ...@@ -1343,12 +1334,12 @@ export default {
}); });
break; break;
case "sendFile": case "sendFile":
this.hasSize = !!size;
this.detail.designImageSize = size; this.detail.designImageSize = size;
this.imgList = []; this.imgList = [];
this.selectImgList = []; this.selectImgList = [];
this.selectIndex = -1; this.selectIndex = -1;
this.productMark = productMark;
if (value.length > 0) { if (value.length > 0) {
this.selectImgList = value; this.selectImgList = value;
...@@ -1830,29 +1821,37 @@ export default { ...@@ -1830,29 +1821,37 @@ export default {
class="print-tip" class="print-tip"
:style="{ left: isView ? '' : '22%' }" :style="{ left: isView ? '' : '22%' }"
v-if=" v-if="
detail && detail?.custom_part == 'custom_part' &&
detail.mssWidth && selectImgList.length &&
detail.mssHeight && isOver &&
!isMove &&
!selectImgList.some((el) => el.isCut)
"
>
<b style="color:green">该单无需拖动设计，直接打印</b>
</div>
<div
class="print-tip"
:style="{ left: isView ? '' : '22%' }"
v-if="
detail?.custom_part == 'custom_part' &&
selectImgList.length && selectImgList.length &&
newDesktopDevice == 3 !isOver
" "
> >
<b <b style="color:red"
:style="{ >素材效果已经超出台版范围，请更换更大台版或和客户协调沟通</b
color: selectImgList.some((el) => el.isCut) ? 'red' : 'green', >
}" </div>
v-if="hasSize" <div
>{{ class="print-tip"
selectImgList.some((el) => el.isCut) :style="{ left: isView ? '' : '22%' }"
? "该生产单被裁切需拖动设计打印" v-if="newDesktopDevice == 3 && !isOver"
: "该生产单无需拖动设计，直接打印" >
}}</b <b style="color:red"
>该生产单素材已经被强制调整适配台版大小，请关注</b
> >
<b style="color: red" v-else>该生产单需要拖动设计打印</b>
</div> </div>
<!-- <div class="print-tip" v-else>
<b style="color: red">该生产单需要拖动设计打印</b>
</div> -->
</div> </div>
<img <img
......
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