Skip to content

E
electron-printer
Commit c896ce68 by zhuzhequan
Options

版本更新

parent b1226def
Showing with 1451 additions and 807 deletions
dev-update.yml deleted 100644 → 0
provider: generic
updaterCacheDirName: dev-updater
url: "https://console.jomalls.com/production/"
\ No newline at end of file
package-lock.json deleted 100644 → 0
This source diff could not be displayed because it is too large. You can view the blob instead.
package.json
......@@ -2,14 +2,14 @@
"name": "JomallProductionAssistant",
"productName": "JomallProductionAssistant",
"description": "",
"version": "0.1.0",
"version": "1.0.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"electron:build": "vue-cli-service electron:build",
"electron:serve": "nodemon --watch src/backend --exec vue-cli-service electron:serve",
"electron:serve": "nodemon --watch src/server --exec vue-cli-service electron:serve",
"postinstall": "electron-builder install-app-deps",
"postuninstall": "electron-builder install-app-deps",
"electron:generate-icons": "electron-icon-builder --input=./src/assets/logo.jpg --output=build --flatten"
......@@ -21,13 +21,18 @@
"axios": "^0.19.2",
"compressing": "^1.10.1",
"core-js": "^3.6.4",
"electron": "^6.1.1",
"electron-builder": "^24.13.3",
"electron-icon-builder": "^2.0.1",
"electron-log": "^5.1.7",
"electron-store": "^4.0.0",
"electron-updater": "^6.2.1",
"element-ui": "^2.13.0",
"express": "^4.17.1",
"html2canvas": "^1.4.1",
"lodash-id": "^0.14.0",
"log4js": "^6.9.1",
"moment": "^2.30.1",
"morgan": "^1.10.0",
"multiparty": "^4.2.3",
"nodemon": "^3.1.4",
......@@ -47,7 +52,6 @@
"@vue/cli-service": "^4.2.0",
"@vue/eslint-config-prettier": "^6.0.0",
"babel-eslint": "^10.0.3",
"electron": "^6.0.0",
"eslint": "^6.7.2",
"eslint-plugin-prettier": "^3.1.1",
"eslint-plugin-vue": "^6.1.2",
......
package.json.bak deleted 100644 → 0
{
"name": "vue-node-lowdb",
"version": "0.1.0",
"private": true,
"scripts": {
"serve": "vue-cli-service serve",
"build": "vue-cli-service build",
"lint": "vue-cli-service lint",
"electron:build": "vue-cli-service electron:build",
"electron:serve": "vue-cli-service electron:serve",
"postinstall": "electron-builder install-app-deps",
"postuninstall": "electron-builder install-app-deps"
},
"main": "background_simple.js",
"dependencies": {
"@vue/composition-api": "^0.3.4",
"axios": "^0.19.2",
"core-js": "^3.6.4",
"element-ui": "^2.13.0",
"express": "^4.17.1",
"lodash-id": "^0.14.0",
"lowdb": "^1.0.0",
"morgan": "^1.10.0",
"normalize.css": "^8.0.1",
"vue": "^2.6.11",
"vue-router": "^3.1.5",
"vuex": "^3.1.2"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^4.2.0",
"@vue/cli-plugin-eslint": "^4.2.0",
"@vue/cli-plugin-router": "^4.2.0",
"@vue/cli-plugin-vuex": "^4.2.0",
"@vue/cli-service": "^4.2.0",
"@vue/eslint-config-prettier": "^6.0.0",
"babel-eslint": "^10.0.3",
"electron": "^6.0.0",
"eslint": "^6.7.2",
"eslint-plugin-prettier": "^3.1.1",
"eslint-plugin-vue": "^6.1.2",
"node-sass": "^4.13.1",
"prettier": "^1.19.1",
"pug": "^2.0.4",
"pug-html-loader": "^1.1.5",
"pug-plain-loader": "^1.0.0",
"sass-loader": "^8.0.2",
"vue-cli-plugin-electron-builder": "^1.4.6",
"vue-template-compiler": "^2.6.11"
}
}
src/App.vue
......@@ -4,7 +4,6 @@
</div>
</template>
<script>
import { ipcRenderer } from "electron";
export default {
data() {
......@@ -13,23 +12,8 @@ export default {
};
},
mounted() {
ipcRenderer.on("update-available", (event, data) => {
console.log("检查到有新版本", data);
});
ipcRenderer.on("update", (event, data) => {
console.log("下載進度", data);
});
ipcRenderer.on("update-not-available", (event, data) => {
console.log("检查到沒有新版本", data);
});
ipcRenderer.on("downloaded", (event, data) => {
console.log(data,'data');
this.update_info = null;
let res = confirm("新版本已下载，是否立即安装？");
if (res) {
ipcRenderer.send("install");
}
});
},
methods: {}
};
......
src/background.js
"use strict";
import { ipcMain } from "electron";
import { app, protocol, BrowserWindow, screen } from "electron";
import { app, protocol, BrowserWindow, screen, globalShortcut } from "electron";
import { createProtocol } from "vue-cli-plugin-electron-builder/lib";
import { createServer } from "@/server/index.js";
const checkUpdate = require("./update.js")
import * as path from "path";
import { autoUpdater } from "electron-updater";
Object.defineProperty(app, "isPackaged", {
get() {
return true;
}
});
createServer();
const isDevelopment = process.env.NODE_ENV !== "production";
......@@ -16,10 +20,10 @@ protocol.registerSchemesAsPrivileged([
]);
const winURL =
process.env.NODE_ENV === "development"
? "http://localhost:8090"
? "http://localhost:8050"
: `file://${__dirname}/index.html`;
function createWindow() {
async function createWindow() {
win = new BrowserWindow({
width: 1500,
height: 1000,
......@@ -29,9 +33,6 @@ function createWindow() {
nodeIntegration: true
}
});
win.webContents.on('did-finish-load', () => {
checkUpdate(win, ipcMain)
})
let displays = screen.getAllDisplays();
......@@ -54,9 +55,9 @@ function createWindow() {
// preload: path.join(__dirname, "./preloadOther.js")
}
});
console.log(winURL + "#" + `/design-detail`);
//指定副屏幕打开的网页
otherWindow.loadURL(winURL + "#" + `/design-detail`);
await otherWindow.loadURL(winURL + "#" + `/design-detail`);
otherWindow.on("closed", () => {
//这一段放外面的话，如果你电脑没双屏会报错。
otherWindow = null;
......@@ -69,35 +70,93 @@ function createWindow() {
// 把获取的打印机列表发送给渲染进程
win.webContents.send("printName", printers);
});
ipcMain.on("win-subScreen", (data, v) => {
if (otherWindow) otherWindow.webContents.send("getProductionNoInfo", v);
});
if (process.env.WEBPACK_DEV_SERVER_URL) {
win.loadURL(process.env.WEBPACK_DEV_SERVER_URL);
await win.loadURL(process.env.WEBPACK_DEV_SERVER_URL);
if (!process.env.IS_TEST) win.webContents.openDevTools();
} else {
createProtocol("app");
win.loadURL("app://./index.html");
await win.loadURL("app://./index.html");
}
ipcMain.on("send-card", (event, obj) => {
win.webContents.send("sendWebsockt", obj);
});
win.on("closed", () => {
win.removeAllListeners();
win = null;
otherWindow = null;
});
// 自动更新逻辑开始
autoUpdater.autoDownload = false
autoUpdater.autoInstallOnAppQuit = false; // 应用退出后自动安装
autoUpdater.on("download-progress", progress => {
// 下载进度监听
if (win.isDestroyed()) return;
win.webContents.send("update", {
speed: Math.ceil(progress.bytesPerSecond / 1000), // 网速
percent: Math.ceil(progress.percent) // 百分比
});
});
autoUpdater.on("error", err => {
// 下载失败监听
if (win.isDestroyed()) return;
win.webContents.send("update-error",err);
});
autoUpdater.on("update-downloaded", info => {
// 下载完成监听
if (win.isDestroyed()) return;
console.log(info, "info");
win.webContents.send("downloaded", info);
});
ipcMain.on("install", () => {
// 退出安装
autoUpdater.quitAndInstall();
});
ipcMain.on("toUpdateApp", (data, item) => {
// 去手动下载更新
if (win.isDestroyed()) return;
autoUpdater.setFeedURL({
provider: "generic",
url: item.url
});
autoUpdater.checkForUpdates().then(res=>{
console.log(res);
autoUpdater.downloadUpdate()
})
});
}
app.on("activate", () => {
app.on("activate", async () => {
if (win === null) {
createWindow();
await createWindow();
}
});
app.on("ready", async () => {
createWindow();
await createWindow();
globalShortcut.register("F5", () => {
return false;
});
globalShortcut.register("CommandOrControl+R", () => {
return false;
});
});
app.on("will-quit", () => {
globalShortcut.unregister("F5");
globalShortcut.unregister("CommandOrControl+R");
});
if (isDevelopment) {
......
src/router/index.js
......@@ -41,6 +41,7 @@ const router = new VueRouter({
routes
});
router.beforeEach((to, from, next) => {
console.log(to, from);
let user = Vue.prototype.$dataStore.get("user");
if (to.path.includes("design-detail")) {
return next();
......@@ -48,7 +49,6 @@ router.beforeEach((to, from, next) => {
if (to.name === "login") {
if (user) {
console.log(1);
return next({ path: "/design" });
} else {
return next();
......
src/server/entity/function.js
......@@ -4,13 +4,16 @@ import {
writeProfileXml
} from "@/server/utils";
var request = require("request");
const compressing = require("compressing");
var uuid = require("uuid");
const uuid = require("uuid");
const path = require("path");
const fs = require("fs");
const os = require("os");
import axios from "axios";
var multiparty = require("multiparty");
axios.defaults.timeout = 12600000;
const multiparty = require("multiparty");
export default {
getPodProductionInfo: async (req, res) => {
const token = req.headers["jwt-token"];
......@@ -25,6 +28,9 @@ export default {
console.log(data);
if (data.code === 200 && data.data && data.data.length > 0) {
let f = data.data.find(el => !el.productionFile);
if (f) {
return res.json({ code: 500, msg: "存在地址错误的素材图" });
}
data.data.forEach(el => {
if (!el.productionFile.includes("http")) {
el.productionFile = el.productionFile.replace(
......@@ -34,10 +40,6 @@ export default {
el.productionFile = `https://${company}/upload/erp${el.productionFile}`;
}
});
if (f) {
return res.json({ code: 500, msg: "存在地址错误的素材图" });
}
downloadImage(data.data)
.then(data => {
res.json({ code: 200, data });
......@@ -46,7 +48,7 @@ export default {
res.json({ code: 500, msg: err });
});
} else {
res.json({ code: 200, msg: "未找到素材图", data: [] });
res.json({ code: 500, msg: data.message, data: [] });
}
} catch (err) {
console.log(err);
......@@ -234,6 +236,51 @@ export default {
.catch(err => {
res.send({ code: 500, msg: err });
});
},
checkUpdate: async (req, res) => {
// const company = "http://10.168.31.188:8096";
const company = "https://admin.jomalls.com";
try {
let q = `${company}/api/manage/rest/app/checkUpdate?version=${req.query.version}&businessType=production_assistant`;
let { data } = await axios.get(q);
if (data.data) {
q = `${company}/api/manage/rest/app/getLatest?businessType=production_assistant`;
let r = await axios.get(q);
res.send(r.data);
} else {
res.send(data);
}
} catch (err) {
console.log(err);
res.json({ code: 500, msg: err });
}
},
incrementalUpdates: async (req, res) => {
try {
let from = path.join(process.cwd(), "./resources/app/css.zip");
let dirName = path.join(process.cwd(), "./resources/app/");
let stream = fs.createWriteStream(from);
const company = req.headers["company"];
req.body.url = "https://" + company + req.body.url;
console.log(req.body.url, "下载zip地址");
request(req.body.url)
.pipe(stream)
.on("close", function() {
compressing.zip
.uncompress(from, dirName, { zipFileNameEncoding: "gbk" })
.then(() => {
fs.unlinkSync(from);
res.json({ code: 200, msg: "更新成功" });
}).catch(err => {
res.json({ code: 500, msg: err.message });
});
});
} catch (err) {
res.json({ code: 500, msg: err.message });
}
}
};
src/server/index.js
import express from "express";
import router from "./routes/index.js";
import {logMiddleWare} from './utils/log'
const PORT = 3000;
export const createServer = () => {
const webApp = express();
//webApp.use(logger("./logs"));
webApp.use( logMiddleWare());
webApp.use(express.json());
webApp.use(express.urlencoded({ extended: false }));
webApp.use("/", router);
// catch 404
webApp.use((req, res) => {
res.status(404).send("Sorry! 404 Error.");
......
src/server/routes/index.js
......@@ -5,6 +5,7 @@ import fn from "../entity/function.js";
let router = express.Router();
// 执行打印命令
router.post("/toPrint", fn.toPrint);
// 登录接口
......@@ -25,6 +26,10 @@ router.post("/getPodProductionInfo", fn.getPodProductionInfo);
router.post("/completeDelivery", fn.completeDelivery);
// 根据生产单号查询详情
router.post("/findByPodProductionNo", fn.findByPodProductionNo);
// 查询版本更新
router.get("/checkUpdate", fn.checkUpdate);
// 增量更新
router.post("/incrementalUpdates", fn.incrementalUpdates);
export { router as default };
src/server/utils/log.js 0 → 100644
const log4js = require("log4js");
const moment = require("moment");
const fs = require("fs");
const path = require("path");
function returnLogFilePath() {
const today = moment(new Date()).format("YYYY-MM-DD");
const low_path = process.cwd();
const dir = path.join(low_path, `/logs/${today}`);
console.log(dir);
if (!fs.existsSync(dir)) {
fs.mkdirSync(dir);
}
return path.join(dir, "api.log");
}
//日志对象
const logger = (name) => {
const logFilePath = returnLogFilePath();
log4js.configure({
appenders: {
out: { type: "console" }, //在控制台输出日志
cheese: {
type: "file",
filename: logFilePath,
maxLogSize: 1024 * 1000 * 10 //10M
}
},
categories: {
//需要在控制台输出日志时：appenders: ['cheese', 'out']
default: { appenders: ["cheese"], level: log4js.levels.DEBUG }
}
});
return log4js.getLogger(name);
};
//添加日志
const addFormatLog = function(req, res, data) {
const now = new Date();
const resTime = now - req._startTime;
const token = req.headers["jwt-token"]
const company = req.headers["company"]
const {
ip,
headers,
method,
url,
body,
httpVersion,
res: { statusCode, _headers }
} = req;
let logInfo = {
ip,
host: headers.host,
resTime,
method,
url,
token,
company,
body,
httpVersion,
statusCode,
contentLength: _headers["content-length"],
userAgent: headers["user-agent"],
data: data[0]
};
// ${JSON.stringify(logInfo)}
logger("log").info(`
时间：${moment(new Date()).format("YYYY-MM-DD HH:mm:ss")}
ip : ${logInfo.ip}
host : ${logInfo.host}
响应时间 : ${logInfo.resTime / 1000} s
method ：${logInfo.method}
url ：${logInfo.url}
客户 ：${logInfo.company || ''}
token ：${logInfo.token || ''}
body ：${JSON.stringify(logInfo.body)}
状态码 ：${logInfo.statusCode}
data ：${JSON.stringify(logInfo.data)}
`
);
};
//日志中间件
export const logMiddleWare = () => {
return function(req, res, next) {
req._startTime = new Date();
const oldSend = res.send;
res.send = function() {
oldSend.apply(res, arguments);
if (typeof [...arguments][0] === "object") {
res.once("finish", () => addFormatLog(req, res, arguments));
}
};
return next();
};
};
src/update.js
// 实现自动更新逻辑
const { autoUpdater } = require("electron-updater");
const { join } = require("path");
let mainWin = null;
const checkUpdate = (win, ipcMain) => {
function downloadProgress(win, progress) {
if (win.isDestroyed()) {
return;
}
console.log("正在下载中");
win.webContents.send("update", {
speed: Math.ceil(progress.bytesPerSecond / 1000), // 网速
percent: Math.ceil(progress.percent) // 百分比
});
autoUpdater.removeListener("update-downloaded", progress =>
downloadProgress(win, progress)
);
}
function updateAvailable(win, info) {
if (win.isDestroyed()) {
return;
}
// 检查到有新版本
win.webContents.send("update-available", info);
autoUpdater.removeListener("update-available", info => updateAvailable(win, info));
}
function downloadError(win, err) {
if (win.isDestroyed()) {
return;
}
console.log(111);
// 自动升级遇到错误
console.log("自动升级遇到错误", err);
win.webContents.send("update-error", err);
autoUpdater.removeListener("error", err => downloadError(win, err));
}
function updateNotAvailable(win, info) {
if (win.isDestroyed()) {
return;
}
console.log("检查到无新版本", info);
win.webContents.send("update-not-available", info);
autoUpdater.removeListener("error", err => downloadError(win, err));
}
function updateDownloaded(win, info) {
if (win.isDestroyed()) {
return;
}
console.log(info, "info");
win.webContents.send("downloaded", info);
}
const checkUpdate = (win, ipcMain, data) => {
if (win.isDestroyed()) {
return;
}
autoUpdater.autoDownload = true; // 自动下载
autoUpdater.autoInstallOnAppQuit = true; // 应用退出后自动安装
autoUpdater.autoInstallOnAppQuit = false; // 应用退出后自动安装
// autoUpdater.forceDevUpdateConfig = true;
// autoUpdater.updateConfigPath = join(__dirname, "../dev-update.yml");
// autoUpdater.updateConfigPath = url + "latest.yml";
mainWin = win;
// 检测是否有更新包并通知
autoUpdater.checkForUpdatesAndNotify().catch();
// 监听渲染进程的 install 事件，触发退出应用并安装
ipcMain.on("install", () => autoUpdater.quitAndInstall());
autoUpdater.on("download-progress", (prog) => {
win.webContents.send("update", {
speed: Math.ceil(prog.bytesPerSecond / 1000), // 网速
percent: Math.ceil(prog.percent) // 百分比
});
autoUpdater.setFeedURL({
provider: "generic",
url: data.url
});
autoUpdater.on('update-available', (info) => {
// 检查到有新版本
win.webContents.send("update-available", info);
console.log('检查到有新版本',info);
})
autoUpdater.on('error', (err) => {
// 自动升级遇到错误
win.webContents.send("update-error", err);
// 执行原有升级逻辑
})
autoUpdater.on('update-not-available', (info) => {
console.log('检查到无新版本',info);
win.webContents.send("update-not-available", info);
// 检查到无新版本
// 提醒用户当前版本已经是最新版，无需更新
})
autoUpdater.on("update-downloaded", (info) => {
console.log(info, "info");
win.webContents.send("downloaded", info);
// 下载完成后强制用户安装，不推荐
// autoUpdater.quitAndInstall();
ipcMain.on("install", () => {
autoUpdater.quitAndInstall();
});
// 检测是否有更新包并通知
autoUpdater
.checkForUpdatesAndNotify({
title: data.title,
body: data.content
})
.catch();
// 监听渲染进程的 install 事件，触发退出应用并安装
autoUpdater.on("download-progress", progress =>
downloadProgress(win, progress)
);
autoUpdater.on("update-available", info => updateAvailable(win, info));
autoUpdater.on("error", err => downloadError(win, err));
autoUpdater.on("update-not-available", info => updateNotAvailable(win, info));
autoUpdater.on("update-downloaded", info => updateDownloaded(win, info));
};
......
src/utils/axios.js
import axios from "axios";
import Vue from "vue";
import { Loading } from "element-ui";
import router from "../router/index";
// create an axios instance
const service = axios.create({
baseURL: "http://localhost:3000", // url = base url + request url
......
src/views/design/head/index.vue
......@@ -3,9 +3,11 @@ import bus from "@/bus";
import PrintDialog from "./printDialog.vue";
import { ipcRenderer } from "electron";
import { grid } from "../data";
import pkg from "../../../../package.json";
import update from "@/views/design/update";
import UpdateDialog from "@/views/design/updateDialog.vue";
export default {
components: { PrintDialog },
components: { PrintDialog,UpdateDialog },
props: {
user: {
default: {
......@@ -21,6 +23,7 @@ export default {
data() {
return {
selectGridIndex: 0,
pkg,
actionIndex: -1,
isAutoFinish: false,
showPrintDialog: false,
......@@ -63,7 +66,9 @@ export default {
if (host.includes("console")) {
host = host.replace(".jomalls.com", ".joshine.cn");
}
let avatar = this.user.avatar.includes("http") ? this.user.avatar : `https://${host}/erpimg/${this.user.avatar}`;
let avatar = this.user.avatar.includes("http")
? this.user.avatar
: `https://${host}/erpimg/${this.user.avatar}`;
console.log(avatar);
return avatar;
}
......@@ -74,6 +79,7 @@ export default {
}
},
mounted() {
console.log(pkg, "pkg");
this.$nextTick(() => {
this.$refs.searchRef.focus();
});
......@@ -84,7 +90,6 @@ export default {
} else {
this.$dataStore.set("setting", this.setting);
}
},
watch: {
setting: {
......@@ -96,6 +101,17 @@ export default {
}
},
methods: {
checkUpdate() {
const Update = new update();
Update.checkUpdate().then(data => {
if (data) {
// 有新版本更新
this.$refs.updateDialog.open(data);
}else{
this.$message.warning('已是最新版本')
}
});
},
dropdownCommand(v) {
switch (v) {
case "logout":
......@@ -103,25 +119,27 @@ export default {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(() => {
this.$dataStore.delete("user");
this.$router.push("/");
}).catch(() => {
});
})
.then(() => {
this.$dataStore.delete("user");
this.$router.push("/");
})
.catch(() => {
});
break;
case "company":
this.$confirm("是否切换系统?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(() => {
this.$dataStore.delete("company");
this.$dataStore.delete("user");
this.$router.push("/");
}).catch(() => {
});
})
.then(() => {
this.$dataStore.delete("company");
this.$dataStore.delete("user");
this.$router.push("/");
})
.catch(() => {
});
break;
case "clear":
// this.$confirm("是否清除缓存?", "提示", {
......@@ -149,20 +167,17 @@ export default {
if (!this.detail || Object.keys(this.detail).length <= 1) {
return this.$message.warning("请扫描生产单号");
}
this.$confirm(
`确定生产完成？`,
"提示",
{
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}
).then(async () => {
this.$confirm(`确定生产完成？`, "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "warning"
}).then(async () => {
await this.setData(this.detail);
});
},
async downloadImage() {
if (!this.detail || Object.keys(this.detail).length === 0) return this.$message.warning("请扫描生产单号");
if (!this.detail || Object.keys(this.detail).length === 0)
return this.$message.warning("请扫描生产单号");
let params = {
productionNo: this.detail.podProductionNo,
imgList: this.imgList
......@@ -172,21 +187,32 @@ export default {
this.$message.success(res.msg);
},
async getDataInfo() {
if (this.detail && Object.keys(this.detail).length > 0 && this.isAutoFinish) {
if (
this.detail &&
Object.keys(this.detail).length > 0 &&
this.isAutoFinish
) {
await this.setData(this.detail);
}
if (this.productionNo === "") return this.$message.warning("请录入生产单号");
if (this.productionNo === "")
return this.$message.warning("请录入生产单号");
try {
//查找生产单号信息传给第二个显示器
const findByPodProductionNo = await this.$api.post("/findByPodProductionNo", {
podProductionNo: this.productionNo,
status: "IN_PRODUCTION"
});
const findByPodProductionNo = await this.$api.post(
"/findByPodProductionNo",
{
podProductionNo: this.productionNo,
status: "IN_PRODUCTION"
}
);
this.detail = findByPodProductionNo.data;
ipcRenderer.send("win-subScreen", findByPodProductionNo.data);
// 根据生产单号查找 素材图片 下载到本地 然后返回本地地址去显示
let res = await this.$api.post("/getPodProductionInfo", { productionNo: this.productionNo });
if (res.data.length === 0) return this.$message.warning("未找到素材图！");
let res = await this.$api.post("/getPodProductionInfo", {
productionNo: this.productionNo
});
if (res.data.length === 0)
return this.$message.warning("未找到素材图！");
let arr = [];
res.data.forEach(el => {
arr.push(el);
......@@ -210,7 +236,6 @@ export default {
this.productionNo = "";
this.$refs.searchRef.focus();
}
},
changeActionIndex(t) {
let index = this.actionIndex;
......@@ -263,10 +288,12 @@ export default {
command(i) {
this.selectGridIndex = i;
this.setting.gridValue = i;
this.$store.commit("updateSystemSetting", { field: "gridValue", value: this.grid[i] });
this.$store.commit("updateSystemSetting", {
field: "gridValue",
value: this.grid[i]
});
bus.$emit("busEmit", { type: "grid", value: this.grid[i] });
}
}
};
</script>
......@@ -282,8 +309,6 @@ export default {
.left-btn {
display: flex;
}
</style>
<template>
<div>
......@@ -294,9 +319,12 @@ export default {
<!-- </el-tooltip>-->
<el-dropdown trigger="click" @command="command" :hide-on-click="false">
<el-button style="height: 100%;margin-right: 0px" size="small">{{ grid[selectGridIndex].label }}</el-button>
<el-button style="height: 100%;margin-right: 0px" size="small">{{
grid[selectGridIndex].label
}}
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item :command="i" v-for="(it,i) in grid" :key="i">
<el-dropdown-item :command="i" v-for="(it, i) in grid" :key="i">
{{ it.label }}
</el-dropdown-item>
</el-dropdown-menu>
......@@ -307,7 +335,13 @@ export default {
<!-- </el-button>-->
<!-- </el-tooltip>-->
<el-tooltip content="图片">
<el-upload accept=".png" action="" :show-file-list="false" multiple :before-upload="uploadImage">
<el-upload
accept=".png"
action=""
:show-file-list="false"
multiple
:before-upload="uploadImage"
>
<el-button style="height: 100%;margin:0 8px" size="small">
<i class="el-icon-picture" style="font-size: 15px;"></i>
</el-button>
......@@ -333,7 +367,8 @@ export default {
v-model="selectBgColor"
@change="setBg"
color-format="hex"
:predefine="predefineColors">
:predefine="predefineColors"
>
</el-color-picker>
</el-tooltip>
......@@ -342,35 +377,76 @@ export default {
:offset="-120"
trigger="click"
placement="bottom"
>
<div class="setting-form">
<el-form :model="setting" label-position="left" label-width="80px" size="small">
<el-form
:model="setting"
label-position="left"
label-width="80px"
size="small"
>
<el-form-item prop="setting" label="网格显示">
<el-select @change="(e)=>settingChange('gridShow',e)" clearable v-model="setting.gridShow">
<el-select
@change="e => settingChange('gridShow', e)"
clearable
v-model="setting.gridShow"
>
<el-option :value="1" label="未缩放的网格"></el-option>
<el-option :value="0" label="无"></el-option>
</el-select>
</el-form-item>
<el-form-item prop="gridSpacing" label="单位">
<el-select @change="(e)=>settingChange('unit',e)" clearable v-model="setting.unit">
<el-select
@change="e => settingChange('unit', e)"
clearable
v-model="setting.unit"
>
<el-option value="mm" label="mm"></el-option>
<el-option value="inch" label="inch"></el-option>
</el-select>
</el-form-item>
<el-form-item prop="gridSpacing" label="网格间隔">
<el-select @change="(e)=>settingChange('gridSpacing',e)" clearable v-model="setting.gridSpacing">
<el-option v-if="setting.unit==='mm'" :value="20" :label="`20 ${setting.unit}`"></el-option>
<el-option v-if="setting.unit==='mm'" :value="10" :label="`10 ${setting.unit}`"></el-option>
<el-option v-if="setting.unit==='inch'" :value="1" :label="`1 ${setting.unit}`"></el-option>
<el-option v-if="setting.unit==='inch'" :value="0.5" :label="`0.5 ${setting.unit}`"></el-option>
<el-select
@change="e => settingChange('gridSpacing', e)"
clearable
v-model="setting.gridSpacing"
>
<el-option
v-if="setting.unit === 'mm'"
:value="20"
:label="`20 ${setting.unit}`"
></el-option>
<el-option
v-if="setting.unit === 'mm'"
:value="10"
:label="`10 ${setting.unit}`"
></el-option>
<el-option
v-if="setting.unit === 'inch'"
:value="1"
:label="`1 ${setting.unit}`"
></el-option>
<el-option
v-if="setting.unit === 'inch'"
:value="0.5"
:label="`0.5 ${setting.unit}`"
></el-option>
</el-select>
</el-form-item>
<el-form-item prop="language" label="语言设置">
<el-select @change="(e)=>settingChange('language',e)" clearable v-model="setting.language">
<el-select
@change="e => settingChange('language', e)"
clearable
v-model="setting.language"
>
<el-option value="cn" label="中文"></el-option>
</el-select>
</el-form-item>
<el-form-item prop="language" label="版本号">
<b>{{ pkg.version || "" }}</b>
<el-button @click="checkUpdate" style="margin-left: 15px" type="text">检查更新</el-button>
</el-form-item>
<!-- <el-form-item label="自动打印模式">-->
<!-- <el-switch @change="(e)=>settingChange('autoPrint',e)" v-model="setting.autoPrint"></el-switch>-->
<!-- </el-form-item>-->
......@@ -385,7 +461,11 @@ export default {
</div>
<el-tooltip slot="reference" content="设置">
<el-button style="margin-right: 8px" size="small">
<img style="width: 15px;height: 15px" src="@/static/icon/shezhi.png" alt="">
<img
style="width: 15px;height: 15px"
src="@/static/icon/shezhi.png"
alt=""
/>
</el-button>
</el-tooltip>
</el-popover>
......@@ -397,17 +477,40 @@ export default {
<!-- </el-tooltip>-->
</div>
<div class="center-input">
<el-input @keyup.enter.native="getDataInfo" style="width: 40%;" size="medium" placeholder="请扫描生产单号"
ref="searchRef" v-model="productionNo"></el-input>
<el-button @click="getDataInfo" size="medium" style="margin-left: 10px" type="primary">查询</el-button>
<el-input
@keyup.enter.native="getDataInfo"
style="width: 40%;"
size="medium"
placeholder="请扫描生产单号"
ref="searchRef"
v-model="productionNo"
></el-input>
<el-button
@click="getDataInfo"
size="medium"
style="margin-left: 10px"
type="primary"
>查询
</el-button
>
<div class="sure-btn">
<el-button @click="sureData" size="medium" style="margin-left: 10px;width: 100%;" type="success">生产完成
<el-button
@click="sureData"
size="medium"
style="margin-left: 10px;width: 100%;"
type="success"
>生产完成
</el-button>
<div class="check">
<el-checkbox v-model="isAutoFinish">自动完成上一单</el-checkbox>
</div>
</div>
<el-button @click="downloadImage" size="medium" style="margin-left: 15px" type="primary">下载素材
<el-button
@click="downloadImage"
size="medium"
style="margin-left: 15px"
type="primary"
>下载素材
</el-button>
</div>
<div class="right-user">
......@@ -423,8 +526,8 @@ export default {
</el-dropdown>
</div>
</div>
<!-- <print-dialog :byPlatenSize="grid[selectGridIndex].value" @close="showPrintDialog=false"-->
<!-- :visible="showPrintDialog"></print-dialog>-->
<update-dialog ref="updateDialog" />
</div>
</template>
......@@ -514,5 +617,4 @@ export default {
z-index: 2;
color: white;
}
</style>
\ No newline at end of file
</style>
src/views/design/head/printDialog.vue
......@@ -7,7 +7,7 @@ import html2canvas from "html2canvas";
export default {
data() {
return {
dialogShow: false,
dialogShow: true,
axios,
fieldDescription,
printerList: [],
......@@ -324,7 +324,7 @@ export default {
".png",
""
)}.xml`}" -I "${"Input\\" +
imgFileName}" -A "Output\\${imgFileName.replace(
imgFileName}" -A "Output\\${imgFileName.replace(
".png",
""
)}.arxp" -S ${size} -L ${position} -D ${r} -W ${whitePrint}`;
......@@ -364,510 +364,517 @@ export default {
<template>
<div class="print-div">
<el-form
label-width="170px"
label-position="left"
size="mini"
:model="printSetting"
>
<el-form-item label-width="55px" label="打印机">
<div class="flex-row">
<el-select v-model="printer" clearable>
<el-option
v-for="(it, i) in printerList"
:key="i"
:label="it.name"
:value="it.name"
></el-option>
</el-select>
<el-button
title="刷新"
@click="getPrinter"
style="margin-left: 10px"
icon="el-icon-refresh"
></el-button>
</div>
</el-form-item>
<el-form-item label-width="50px" label="预设">
<div class="flex-row">
<el-select
@change="printSettingChange"
filterable
v-model="printSettingVal"
clearable
>
<el-option
v-for="(it, i) in printSettingList"
:key="i"
:value="i"
:label="it.label"
></el-option>
</el-select>
<div style="margin-left: 15px;display: flex" class="save-btn">
<el-popover
placement="bottom"
width="200"
v-model="showPopover"
trigger="manual"
<div :class="dialogShow ? 'open-expand' : 'close-expand'">
<slot></slot>
</div>
<div v-show="dialogShow" class="print-content">
<el-form
label-width="170px"
label-position="left"
size="mini"
:model="printSetting"
>
<el-form-item label-width="55px" label="打印机">
<div class="flex-row">
<el-select v-model="printer" clearable>
<el-option
v-for="(it, i) in printerList"
:key="i"
:label="it.name"
:value="it.name"
></el-option>
</el-select>
<el-button
title="刷新"
@click="getPrinter"
style="margin-left: 10px"
icon="el-icon-refresh"
></el-button>
</div>
</el-form-item>
<el-form-item label-width="50px" label="预设">
<div class="flex-row">
<el-select
@change="printSettingChange"
filterable
v-model="printSettingVal"
clearable
>
<el-button
style="margin-right: 10px"
@click="openPopover"
slot="reference"
type="primary"
<el-option
v-for="(it, i) in printSettingList"
:key="i"
:value="i"
:label="it.label"
></el-option>
</el-select>
<div style="margin-left: 15px;display: flex" class="save-btn">
<el-popover
placement="bottom"
width="200"
v-model="showPopover"
trigger="manual"
>
<el-button
style="margin-right: 10px"
@click="openPopover"
slot="reference"
type="primary"
>保存预设
</el-button>
<div class="save-setting">
<el-input
size="large"
maxlength="10"
v-model="settingName"
placeholder="预设名称："
></el-input>
<div class="save-footer">
<el-button size="medium" @click="showPopover = false"
>取消</el-button
>
<el-button
@click="saveSetting"
:disabled="settingName === ''"
size="medium"
type="primary"
</el-button>
<div class="save-setting">
<el-input
size="large"
maxlength="10"
v-model="settingName"
placeholder="预设名称："
></el-input>
<div class="save-footer">
<el-button size="medium" @click="showPopover = false"
>取消
</el-button>
<el-button
@click="saveSetting"
:disabled="settingName === ''"
size="medium"
type="primary"
>保存
</el-button>
</el-button>
</div>
</div>
</div>
</el-popover>
</el-popover>
<el-button
:disabled="printSettingVal === 0"
@click="delSetting"
type="danger"
>删除</el-button
>
</div>
</div>
</el-form-item>
<div class="detail-setting">
<div class="setting-left">
<div class="left-block-item">
<b class="setting-title">基本设置</b>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byInk'] || ''"></div>
</template>
<el-form-item label="油墨选择">
<el-select v-model="printSetting.byInk" clearable>
<el-option
:label="it.label"
:value="i"
:key="i"
v-for="(it, i) in printInkList"
></el-option>
</el-select>
</el-form-item>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bEcoMode'] || ''"></div>
</template>
<el-form-item v-if="printSetting.byInk === 2" label="模式">
<el-select v-model="printSetting.bEcoMode" clearable>
<el-option label="通常" :value="false"></el-option>
<el-option label="白色油墨削减" :value="true"></el-option>
</el-select>
</el-form-item>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bMaterialBlack'] || ''"></div>
</template>
<div v-if="printSetting.byInk === 2">
<el-form-item label="利用底材的黑色">
<el-switch v-model="printSetting.bMaterialBlack"></el-switch>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bMultiple'] || ''"></div>
</template>
<div v-if="printSetting.byInk !== 1">
<el-form-item label="彩色的复合路径打印">
<el-switch v-model="printSetting.bMultiple"></el-switch>
</el-form-item>
</div>
</el-tooltip>
<el-button
:disabled="printSettingVal === 0"
@click="delSetting"
type="danger"
>删除
</el-button>
</div>
</div>
<div
class="left-block-item"
v-if="[0, 3].includes(printSetting.byInk)"
>
<b class="setting-title">彩色油墨设置</b>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byInkVolume'] || ''"></div>
</template>
<div>
<el-form-item label="油墨量">
<div class="flex-row">
<el-slider
:step="1"
:min="1"
:max="10"
v-model="printSetting.byInkVolume"
></el-slider>
<span>{{ printSetting.byInkVolume }}</span>
</div>
</el-form-item>
<div class="detail-setting">
<div class="setting-left">
<div class="left-block-item">
<b class="setting-title">基本设置</b>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byInk'] || ''"></div>
</template>
<el-form-item label="油墨选择">
<el-select v-model="printSetting.byInk" clearable>
<el-option
:label="it.label"
:value="i"
:key="i"
v-for="(it, i) in printInkList"
></el-option>
</el-select>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byDoublePrint'] || ''"></div>
</template>
<div>
<el-form-item label="2次打印">
<div class="flex-row">
<el-slider
:step="1"
:min="0"
:max="3"
v-model="printSetting.byDoublePrint"
></el-slider>
<span>{{ printSetting.byDoublePrint }}</span>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bEcoMode'] || ''"></div>
</template>
<el-form-item v-if="printSetting.byInk === 2" label="模式">
<el-select v-model="printSetting.bEcoMode" clearable>
<el-option label="通常" :value="false"></el-option>
<el-option label="白色油墨削减" :value="true"></el-option>
</el-select>
</el-form-item>
</div>
</el-tooltip>
</div>
<div
class="left-block-item"
v-if="[1, 2].includes(printSetting.byInk)"
>
<b class="setting-title">白色油墨设置</b>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byHighlight'] || ''"></div>
</template>
<div>
<el-form-item label="高光">
<div class="flex-row">
<el-slider
:step="1"
:min="1"
:max="9"
v-model="printSetting.byHighlight"
></el-slider>
<span>{{ printSetting.byHighlight }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byMask'] || ''"></div>
</template>
<div>
<el-form-item label="遮光">
<div class="flex-row">
<el-slider
:step="1"
:min="1"
:max="5"
v-model="printSetting.byMask"
></el-slider>
<span>{{ printSetting.byMask }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bFastMode'] || ''"></div>
</template>
<div v-if="[2].includes(printSetting.byInk)">
<el-form-item label="白色高速打印">
<el-switch v-model="printSetting.bFastMode"></el-switch>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bDivide'] || ''"></div>
</template>
<div>
<el-form-item label="白色分次打印">
<el-switch v-model="printSetting.bDivide"></el-switch>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bPause'] || ''"></div>
</template>
<div v-if="[2].includes(printSetting.byInk)">
<el-form-item label="白色/彩色个别打印">
<el-switch v-model="printSetting.bPause"></el-switch>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bTransColor'] || ''"></div>
</template>
<div>
<el-form-item label="透明色">
<el-switch v-model="printSetting.bTransColor"></el-switch>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byChoke'] || ''"></div>
</template>
<div v-if="[2].includes(printSetting.byInk)">
<el-form-item label="白色油墨的削减范围">
<div class="flex-row">
<el-slider
:step="1"
:min="0"
:max="10"
v-model="printSetting.byChoke"
></el-slider>
<span>{{ printSetting.byChoke }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byMinWhite'] || ''"></div>
</template>
<div v-if="[2].includes(printSetting.byInk)">
<el-form-item label="最小白色油墨量">
<div class="flex-column">
<el-select v-model="printSetting.minWhiteInkType">
<el-option label="通常" :value="0"></el-option>
<el-option label="特殊" :value="1"></el-option>
</el-select>
<div class="slider flex-row">
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bMaterialBlack'] || ''"></div>
</template>
<div v-if="printSetting.byInk === 2">
<el-form-item label="利用底材的黑色">
<el-switch
v-model="printSetting.bMaterialBlack"
></el-switch>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bMultiple'] || ''"></div>
</template>
<div v-if="printSetting.byInk !== 1">
<el-form-item label="彩色的复合路径打印">
<el-switch v-model="printSetting.bMultiple"></el-switch>
</el-form-item>
</div>
</el-tooltip>
</div>
<div
class="left-block-item"
v-if="[0, 3].includes(printSetting.byInk)"
>
<b class="setting-title">彩色油墨设置</b>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byInkVolume'] || ''"></div>
</template>
<div>
<el-form-item label="油墨量">
<div class="flex-row">
<el-slider
:step="1"
:min="1"
:max="printSetting.minWhiteInkType === 1 ? 6 : 3"
v-model="printSetting.byMinWhite"
:max="10"
v-model="printSetting.byInkVolume"
></el-slider>
<span>{{ printSetting.byMinWhite }}</span>
<span>{{ printSetting.byInkVolume }}</span>
</div>
</div>
</el-form-item>
</div>
</el-tooltip>
</div>
<div v-show="detailShow" class="left-block-item">
<b class="setting-title">画质设置</b>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bySaturation'] || ''"></div>
</template>
<div>
<el-form-item label="饱和度">
<div class="flex-row">
<el-slider
:step="1"
:min="0"
:max="40"
v-model="printSetting.bySaturation"
></el-slider>
<span>{{ printSetting.bySaturation }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byBrightness'] || ''"></div>
</template>
<div>
<el-form-item label="亮度">
<div class="flex-row">
<el-slider
:step="1"
:min="0"
:max="40"
v-model="printSetting.byBrightness"
></el-slider>
<span>{{ printSetting.byBrightness }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byContrast'] || ''"></div>
</template>
<div>
<el-form-item label="对比度">
<div class="flex-row">
<el-slider
:step="1"
:min="0"
:max="40"
v-model="printSetting.byContrast"
></el-slider>
<span>{{ printSetting.byContrast }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bUniPrint'] || ''"></div>
</template>
<div v-if="[1].includes(printSetting.byInk)">
<el-form-item label="单向打印">
<el-switch v-model="printSetting.bUniPrint"></el-switch>
</el-form-item>
</div>
</el-tooltip>
</div>
<div
v-if="detailShow && ![1].includes(printSetting.byInk)"
class="left-block-item"
>
<b class="setting-title">彩色平衡</b>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['iCyanBalance'] || ''"></div>
</template>
<div v-if="![3].includes(printSetting.byInk)">
<el-form-item label="青色">
<div class="flex-row">
<el-slider
:step="1"
:min="-5"
:max="5"
v-model="printSetting.iCyanBalance"
></el-slider>
<span>{{ printSetting.iCyanBalance }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['iMagentaBalance'] || ''"></div>
</template>
<div v-if="![3].includes(printSetting.byInk)">
<el-form-item label="红色">
<div class="flex-row">
<el-slider
:step="1"
:min="-5"
:max="5"
v-model="printSetting.iMagentaBalance"
></el-slider>
<span>{{ printSetting.iMagentaBalance }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['iYellowBalance'] || ''"></div>
</template>
<div v-if="![3].includes(printSetting.byInk)">
<el-form-item label="黄色">
<div class="flex-row">
<el-slider
:step="1"
:min="-5"
:max="5"
v-model="printSetting.iYellowBalance"
></el-slider>
<span>{{ printSetting.iYellowBalance }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['iBlackBalance'] || ''"></div>
</template>
<div>
<el-form-item label="黑色">
<div class="flex-row">
<el-slider
:step="1"
:min="-5"
:max="5"
v-model="printSetting.iBlackBalance"
></el-slider>
<span>{{ printSetting.iBlackBalance }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bUniPrint'] || ''"></div>
</template>
<div>
<el-form-item label="单向打印">
<el-switch v-model="printSetting.bUniPrint"></el-switch>
</el-form-item>
</div>
</el-tooltip>
</div>
<el-button size="small" @click="setDetailShow"
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byDoublePrint'] || ''"></div>
</template>
<div>
<el-form-item label="2次打印">
<div class="flex-row">
<el-slider
:step="1"
:min="0"
:max="3"
v-model="printSetting.byDoublePrint"
></el-slider>
<span>{{ printSetting.byDoublePrint }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
</div>
<div
class="left-block-item"
v-if="[1, 2].includes(printSetting.byInk)"
>
<b class="setting-title">白色油墨设置</b>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byHighlight'] || ''"></div>
</template>
<div>
<el-form-item label="高光">
<div class="flex-row">
<el-slider
:step="1"
:min="1"
:max="9"
v-model="printSetting.byHighlight"
></el-slider>
<span>{{ printSetting.byHighlight }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byMask'] || ''"></div>
</template>
<div>
<el-form-item label="遮光">
<div class="flex-row">
<el-slider
:step="1"
:min="1"
:max="5"
v-model="printSetting.byMask"
></el-slider>
<span>{{ printSetting.byMask }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bFastMode'] || ''"></div>
</template>
<div v-if="[2].includes(printSetting.byInk)">
<el-form-item label="白色高速打印">
<el-switch v-model="printSetting.bFastMode"></el-switch>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bDivide'] || ''"></div>
</template>
<div>
<el-form-item label="白色分次打印">
<el-switch v-model="printSetting.bDivide"></el-switch>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bPause'] || ''"></div>
</template>
<div v-if="[2].includes(printSetting.byInk)">
<el-form-item label="白色/彩色个别打印">
<el-switch v-model="printSetting.bPause"></el-switch>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bTransColor'] || ''"></div>
</template>
<div>
<el-form-item label="透明色">
<el-switch v-model="printSetting.bTransColor"></el-switch>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byChoke'] || ''"></div>
</template>
<div v-if="[2].includes(printSetting.byInk)">
<el-form-item label="白色油墨的削减范围">
<div class="flex-row">
<el-slider
:step="1"
:min="0"
:max="10"
v-model="printSetting.byChoke"
></el-slider>
<span>{{ printSetting.byChoke }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byMinWhite'] || ''"></div>
</template>
<div v-if="[2].includes(printSetting.byInk)">
<el-form-item label="最小白色油墨量">
<div class="flex-column">
<el-select v-model="printSetting.minWhiteInkType">
<el-option label="通常" :value="0"></el-option>
<el-option label="特殊" :value="1"></el-option>
</el-select>
<div class="slider flex-row">
<el-slider
:step="1"
:min="1"
:max="printSetting.minWhiteInkType === 1 ? 6 : 3"
v-model="printSetting.byMinWhite"
></el-slider>
<span>{{ printSetting.byMinWhite }}</span>
</div>
</div>
</el-form-item>
</div>
</el-tooltip>
</div>
<div v-show="detailShow" class="left-block-item">
<b class="setting-title">画质设置</b>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bySaturation'] || ''"></div>
</template>
<div>
<el-form-item label="饱和度">
<div class="flex-row">
<el-slider
:step="1"
:min="0"
:max="40"
v-model="printSetting.bySaturation"
></el-slider>
<span>{{ printSetting.bySaturation }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byBrightness'] || ''"></div>
</template>
<div>
<el-form-item label="亮度">
<div class="flex-row">
<el-slider
:step="1"
:min="0"
:max="40"
v-model="printSetting.byBrightness"
></el-slider>
<span>{{ printSetting.byBrightness }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['byContrast'] || ''"></div>
</template>
<div>
<el-form-item label="对比度">
<div class="flex-row">
<el-slider
:step="1"
:min="0"
:max="40"
v-model="printSetting.byContrast"
></el-slider>
<span>{{ printSetting.byContrast }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bUniPrint'] || ''"></div>
</template>
<div v-if="[1].includes(printSetting.byInk)">
<el-form-item label="单向打印">
<el-switch v-model="printSetting.bUniPrint"></el-switch>
</el-form-item>
</div>
</el-tooltip>
</div>
<div
v-if="detailShow && ![1].includes(printSetting.byInk)"
class="left-block-item"
>
<b class="setting-title">彩色平衡</b>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['iCyanBalance'] || ''"></div>
</template>
<div v-if="![3].includes(printSetting.byInk)">
<el-form-item label="青色">
<div class="flex-row">
<el-slider
:step="1"
:min="-5"
:max="5"
v-model="printSetting.iCyanBalance"
></el-slider>
<span>{{ printSetting.iCyanBalance }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['iMagentaBalance'] || ''"></div>
</template>
<div v-if="![3].includes(printSetting.byInk)">
<el-form-item label="红色">
<div class="flex-row">
<el-slider
:step="1"
:min="-5"
:max="5"
v-model="printSetting.iMagentaBalance"
></el-slider>
<span>{{ printSetting.iMagentaBalance }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['iYellowBalance'] || ''"></div>
</template>
<div v-if="![3].includes(printSetting.byInk)">
<el-form-item label="黄色">
<div class="flex-row">
<el-slider
:step="1"
:min="-5"
:max="5"
v-model="printSetting.iYellowBalance"
></el-slider>
<span>{{ printSetting.iYellowBalance }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['iBlackBalance'] || ''"></div>
</template>
<div>
<el-form-item label="黑色">
<div class="flex-row">
<el-slider
:step="1"
:min="-5"
:max="5"
v-model="printSetting.iBlackBalance"
></el-slider>
<span>{{ printSetting.iBlackBalance }}</span>
</div>
</el-form-item>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['bUniPrint'] || ''"></div>
</template>
<div>
<el-form-item label="单向打印">
<el-switch v-model="printSetting.bUniPrint"></el-switch>
</el-form-item>
</div>
</el-tooltip>
</div>
<el-button size="small" @click="setDetailShow"
>{{ detailShow ? "关闭详细设置" : "打开详细设置" }}...
</el-button>
</div>
</div>
</el-form>
<div class="bottom-info flex-row">
<div class="info">
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['printTime'] || ''"></div>
</template>
<div class="info-item">
<span>打印时间</span>
<b>×{{ defaultTime }}</b>
</el-button>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['whiteInk'] || ''"></div>
</template>
<div class="info-item">
<span>白色油墨量</span>
<b>{{ inkNum }}%</b>
</div>
</el-tooltip>
</div>
<div class="btn">
<el-input
size="small"
style="width: 100px;"
oninput="value=value.replace(/[^\-?\d]/g,'')"
v-model="printSetting.printNum"
></el-input>
<span>张</span>
</div>
</el-form>
<div class="bottom-info flex-row">
<div class="info">
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['printTime'] || ''"></div>
</template>
<div class="info-item">
<span>打印时间</span>
<b>×{{ defaultTime }}</b>
</div>
</el-tooltip>
<el-tooltip placement="left" popper-class="my-popper">
<template slot="content">
<div v-html="fieldDescription['whiteInk'] || ''"></div>
</template>
<div class="info-item">
<span>白色油墨量</span>
<b>{{ inkNum }}%</b>
</div>
</el-tooltip>
</div>
<div class="btn">
<el-input
size="small"
style="width: 100px;"
oninput="value=value.replace(/[^\-?\d]/g,'')"
v-model="printSetting.printNum"
></el-input>
<span>张</span>
</div>
</div>
<el-button
@click="getPrintCmd"
type="primary"
style="width: 100%;height: 50px"
>打印
</el-button>
</div>
<el-button
@click="getPrintCmd"
type="primary"
style="width: 100%;height: 50px"
>打印</el-button
>
</div>
</template>
......@@ -877,15 +884,18 @@ export default {
align-items: center;
display: flex;
align-items: center;
span {
margin-left: 10px;
}
.el-slider {
flex: 1;
flex-shrink: 0;
margin: 0 10px;
}
}
.el-form {
height: 84%;
display: flex;
......@@ -893,6 +903,7 @@ export default {
padding-top: 15px;
border-top: 1px solid #ececec;
}
.detail-setting {
border-top: 2px solid transparent;
display: flex;
......@@ -902,6 +913,7 @@ export default {
flex-shrink: 0;
overflow: auto;
}
.left-block-item {
.setting-title {
font-weight: bold;
......@@ -914,6 +926,7 @@ export default {
left: -15px;
}
}
.setting-right {
box-sizing: border-box;
padding: 20px;
......@@ -921,17 +934,20 @@ export default {
height: 100%;
color: #333;
}
.setting-left {
width: 100%;
box-sizing: border-box;
padding: 15px 30px;
background-color: white;
}
.fixed-top {
position: absolute;
word-break: break-all;
max-width: 44%;
}
.bottom-info {
padding: 15px 0;
margin-top: 20px;
......@@ -939,38 +955,97 @@ export default {
justify-content: space-between;
border-top: 1px solid #ececec;
}
.info {
width: 62%;
display: flex;
justify-content: space-between;
}
.info-item {
span {
margin-right: 5px;
}
}
.save-setting {
display: flex;
flex-direction: column;
}
.save-footer {
display: flex;
justify-content: space-between;
margin-top: 15px;
}
.print-div {
background: #ececec;
border-left: 1px solid gray;
padding: 10px;
position: fixed;
box-sizing: border-box;
right: 0;
z-index: 4;
bottom: 0;
height: calc(100% - 51px);
width: 430px;
.print-content {
background: #ececec;
border-left: 1px solid gray;
height: 100%;
padding: 10px;
display: flex;
width: 430px;
flex-direction: column;
}
}
.close-expand {
position: fixed;
right: 0;
cursor: pointer;
top: 50%;
width: 20px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
height: 40px;
display: flex;
align-items: center;
background-color: blueviolet;
color: white;
justify-content: center;
i{
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
}
.open-expand {
position: absolute;
left: -20px;
cursor: pointer;
top: 50%;
width: 20px;
border-top-left-radius: 5px;
border-bottom-left-radius: 5px;
height: 40px;
display: flex;
align-items: center;
background-color: blueviolet;
color: white;
justify-content: center;
i{
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
}
</style>
<style>
.my-popper {
......
src/views/design/index.vue
<script>
import PHead from './head/index.vue'
import PMain from './main/index.vue'
import PHead from "./head/index.vue";
import PMain from "./main/index.vue";
import update from "./update";
import UpdateDialog from "@/views/design/updateDialog.vue";
export default {
components: {PHead, PMain},
components: { PHead, PMain, UpdateDialog },
data() {
return {
user: {},
company:{}
}
company: {}
};
},
mounted() {
this.user = this.$dataStore.get('user')
this.company = this.$dataStore.get('company')
console.log(this.$dataStore)
this.user = this.$dataStore.get("user");
this.company = this.$dataStore.get("company");
const Update = new update();
Update.checkUpdate().then(data => {
if (data) {
// 有新版本更新
this.$refs.updateDialog.open(data);
}
});
}
}
};
</script>
<template>
<div class="page">
<p-head :company="company" :user="user" />
<p-main/>
<p-main />
<update-dialog ref="updateDialog" />
</div>
</template>
......
src/views/design/main/index.vue
......@@ -20,7 +20,12 @@ export default {
computed: {
gridWH() {
if (!this.systemSetting || !this.grid || !this.grid[this.systemSetting.gridValue]) return { w: 0, h: 0, v: 1 };
if (
!this.systemSetting ||
!this.grid ||
!this.grid[this.systemSetting.gridValue]
)
return { w: 0, h: 0, v: 1 };
return {
w: this.grid[this.systemSetting.gridValue].w,
v: this.grid[this.systemSetting.gridValue].value,
......@@ -30,7 +35,10 @@ export default {
gridSpacing() {
if (!this.systemSetting) return { w: 0, h: 0 };
if (this.systemSetting.unit === "mm") {
return { w: this.systemSetting.gridSpacing + "px", h: this.systemSetting.gridSpacing + "px" };
return {
w: this.systemSetting.gridSpacing + "px",
h: this.systemSetting.gridSpacing + "px"
};
} else if (this.systemSetting.unit === "inch") {
console.log(this.systemSetting.gridValue);
let w = this.grid[this.systemSetting.gridValue].w;
......@@ -39,10 +47,9 @@ export default {
let h = this.grid[this.systemSetting.gridValue].h;
return {
w: this.systemSetting.gridSpacing * ((w - row + 1) / row) + "px",
h: this.systemSetting.gridSpacing * ((h) / col) + "px"
h: this.systemSetting.gridSpacing * (h / col) + "px"
};
}
},
computedGridSize() {
const getter = this.systemSetting;
......@@ -54,18 +61,16 @@ export default {
if (this.selectIndex < 0) {
this.showImgSetting = false;
return null;
}
let item = this.imgList[this.selectIndex];
if (item) {
item = JSON.parse(JSON.stringify(item));
item.x = Number(item.x) - Number(item.w);
item.y = Number(item.y) + (Number(item.h) / 2);
item.y = Number(item.y) + Number(item.h) / 2;
return JSON.parse(JSON.stringify(this.imgList[this.selectIndex]));
}
this.showImgSetting = false;
return null;
}
},
data() {
......@@ -78,6 +83,7 @@ export default {
bus: 0,
grid,
showImgSetting: false,
printDialogShow: true,
parentHeight: 0,
width: 0,
selectIndex: -1,
......@@ -101,8 +107,11 @@ export default {
let dom = document.getElementsByClassName("drr");
this.imgList.forEach((el, i) => {
let dom_i = document.getElementsByClassName("drr")[i];
dom_i.style.zIndex = dom_i.style.zIndex === "" || !dom_i.style.zIndex ? 0 : dom_i.style.zIndex;
dom[i].addEventListener("click", (e) => {
dom_i.style.zIndex =
dom_i.style.zIndex === "" || !dom_i.style.zIndex
? 0
: dom_i.style.zIndex;
dom[i].addEventListener("click", e => {
this.selectIndex = i;
this.selectItem(i);
});
......@@ -125,6 +134,9 @@ export default {
}
},
methods: {
changePrintDialogShow() {
this.printDialogShow = !this.printDialogShow;
},
async drop(e) {
let that = this;
e.stopPropagation();
......@@ -164,30 +176,44 @@ export default {
this.imgList = JSON.parse(JSON.stringify(this.imgHistoryList[i]));
this.imgHistoryIndex = this.imgHistoryIndex + 1;
}
}
if (this.selectIndex >= 0) {
if (e.keyCode === 38) {
//上
this.$set(this.imgList[this.selectIndex], "y", Number(this.imgList[this.selectIndex].y) - 1);
this.$set(
this.imgList[this.selectIndex],
"y",
Number(this.imgList[this.selectIndex].y) - 1
);
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
}
if (e.keyCode === 40) {
//下
this.$set(this.imgList[this.selectIndex], "y", Number(this.imgList[this.selectIndex].y) + 1);
this.$set(
this.imgList[this.selectIndex],
"y",
Number(this.imgList[this.selectIndex].y) + 1
);
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
}
if (e.keyCode === 37) {
//左
this.$set(this.imgList[this.selectIndex], "x", Number(this.imgList[this.selectIndex].x) - 1);
this.$set(
this.imgList[this.selectIndex],
"x",
Number(this.imgList[this.selectIndex].x) - 1
);
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
}
if (e.keyCode === 39) {
//右
this.$set(this.imgList[this.selectIndex], "x", Number(this.imgList[this.selectIndex].x) + 1);
this.$set(
this.imgList[this.selectIndex],
"x",
Number(this.imgList[this.selectIndex].x) + 1
);
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
}
}
if (e.keyCode === 8) {
if (this.selectIndex >= 0) {
......@@ -197,7 +223,6 @@ export default {
} else {
this.selectIndex = -1;
}
}
}
},
......@@ -233,7 +258,6 @@ export default {
return mm1.width;
},
selectImg(it, i) {
// this.selectImgIndexList.push(i)
// this.selectImgIndexList = Array.from(new Set(this.selectImgIndexList))
this.getBackFile([it], file => {
......@@ -248,7 +272,8 @@ export default {
let w = document.getElementById("line").clientWidth / 2;
let h = document.getElementById("line").clientHeight / 2;
let dom = document.getElementsByClassName("drr")[this.selectIndex];
let z_index = dom.style.zIndex === "" || !dom.style.zIndex ? 0 : dom.style.zIndex;
let z_index =
dom.style.zIndex === "" || !dom.style.zIndex ? 0 : dom.style.zIndex;
switch (type) {
case "center":
this.$set(this.imgList[this.selectIndex], "x", Number(w));
......@@ -264,16 +289,23 @@ export default {
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
break;
case "add_index":
dom.style.zIndex = Number(z_index) + 1;
console.log(dom.style.zIndex);
this.$set(this.imgList[this.selectIndex], "zIndex", this.imgList[this.selectIndex].zIndex + 1);
this.$set(
this.imgList[this.selectIndex],
"zIndex",
this.imgList[this.selectIndex].zIndex + 1
);
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
break;
case "reduce_index":
dom.style.zIndex = Number(z_index) - 1;
console.log(dom.style.zIndex);
this.$set(this.imgList[this.selectIndex], "zIndex", this.imgList[this.selectIndex].zIndex - 1);
this.$set(
this.imgList[this.selectIndex],
"zIndex",
this.imgList[this.selectIndex].zIndex - 1
);
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
break;
default:
......@@ -299,12 +331,9 @@ export default {
close() {
this.showImgSetting = false;
},
onDragDebounce(left, top, item, index) {
},
onDragDebounce(left, top, item, index) {},
dragStop(data, item) {
this.$set(item, "y", data.y);
this.$set(item, "x", data.x);
// console.log(left, top)
......@@ -340,23 +369,24 @@ export default {
// this.$store.commit('changeActionList', this.actionList)
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
},
resizing(index) {
},
resizing(index) {},
rotating(data, item) {
console.log(data);
this.$set(item, "r", data.angle.toFixed(2));
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
},
outsideClick(e) {
if (!(e.target.className.includes("drr") || e.target.className.includes("sucaitu-img"))) {
if (
!(
e.target.className.includes("drr") ||
e.target.className.includes("sucaitu-img")
)
) {
this.selectIndex = -1;
this.close();
}
},
selectItem(index) {
let dom = document.getElementsByClassName("drr");
for (let i = 0; i < dom.length; i++) {
if (index !== i) {
......@@ -432,7 +462,6 @@ export default {
});
});
}
},
addFile(file, callback) {
let that = this;
......@@ -503,15 +532,17 @@ export default {
let newB = parseInt("0x" + color.substr(5, 2));
//图片加载后进行处理
img.onload = function() {
let width = img.width, height = img.height, canvas = document.createElement("canvas"),
let width = img.width,
height = img.height,
canvas = document.createElement("canvas"),
ctx = canvas.getContext("2d");
canvas.width = width;
canvas.height = height;
// 将源图片复制到画布上
ctx.drawImage(img, 0, 0, width, height);
// 获取画布的像素信息
let imageData = ctx.getImageData(0, 0, width, height), data = imageData.data;
let imageData = ctx.getImageData(0, 0, width, height),
data = imageData.data;
// 对像素集合中的单个像素进行循环，每个像素是由4个通道组成，所以要注意
let i = 0;
while (i < data.length) {
......@@ -546,7 +577,7 @@ export default {
mounted() {
this.imgHeight = window.screen.height + "px";
this.systemSetting = this.$dataStore.get("setting");
bus.$on("busEmit", (v) => {
bus.$on("busEmit", v => {
let { type, value } = v;
switch (type) {
case "grid":
......@@ -557,7 +588,7 @@ export default {
this.indexChange(value);
break;
case "bg":
this.changeImageColor(value, (res) => {
this.changeImageColor(value, res => {
this.img = res;
});
break;
......@@ -580,7 +611,9 @@ export default {
this.selectImgList = value;
this.selectImgIndex = 0;
this.getBackFile([value[0]], file => {
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
this.imgHistoryList.push(
JSON.parse(JSON.stringify(this.imgList))
);
});
// this.addFile([value[0].file])
}
......@@ -593,10 +626,7 @@ export default {
document.addEventListener("keyup", this.keyup);
this.$nextTick(() => {
this.listenUpload();
});
}
};
</script>
......@@ -605,18 +635,23 @@ export default {
<div class="page-main">
<div @click="outsideClick" class="main-bg">
<div class="container">
<div class="select-img" v-if="selectImgList.length>1">
<div @click="selectImg(it,i)" v-for="(it,i) in selectImgList"
:key="i"
class="img-item">
<div class="select-img" v-if="selectImgList.length > 1">
<div
@click="selectImg(it, i)"
v-for="(it, i) in selectImgList"
:key="i"
class="img-item"
>
<img style="width: 100px;height: auto;" :src="it.productionFile" />
<span>{{ it.designId }}</span>
</div>
</div>
<div :style="{height:imgHeight}" id="img">
<div :style="{ height: imgHeight }" id="img">
<div id="line">
<div class="sucaitu"
:style="{width:gridWH.w+'px',height:gridWH.h+'px'}">
<div
class="sucaitu"
:style="{ width: gridWH.w + 'px', height: gridWH.h + 'px' }"
>
<vue-drag-resize-rotate
:w="item.w"
class-name="my-drag-resize-rotate"
......@@ -625,49 +660,87 @@ export default {
:x="item.x"
:z="item.zIndex"
:aspectRatio="true"
:isActive="index===selectIndex"
:isActive="index === selectIndex"
:y="item.y"
v-for="(item,index) in imgList"
v-for="(item, index) in imgList"
:key="index"
:draggable="true"
:resizable="true"
:rotatable="true"
@dragstop="(a)=>dragStop(a,item)"
@resizestop="(a)=>resizeStop(a,item)"
@rotatestop="(a)=>rotating(a,item)"
@dragstop="a => dragStop(a, item)"
@resizestop="a => resizeStop(a, item)"
@rotatestop="a => rotating(a, item)"
:angle="item.r"
>
<div ref="sucaitu-img"
:class="{'active': index === selectIndex}"
:style="{zIndex: item.zIndex}"
class="sucaitu-img img element">
<img crossOrigin="anonymous" :src="item.url" alt="" class="sucaitu-img">
<i @click="delImg(index)" v-if="index===selectIndex" class=" close el-icon-close"></i>
<div v-if="index===selectIndex" class="control-point control-rotator"></div>
<div
ref="sucaitu-img"
:class="{ active: index === selectIndex }"
:style="{ zIndex: item.zIndex }"
class="sucaitu-img img element"
>
<img
crossOrigin="anonymous"
:src="item.url"
alt=""
class="sucaitu-img"
/>
<i
@click="delImg(index)"
v-if="index === selectIndex"
class=" close el-icon-close"
></i>
<div
v-if="index === selectIndex"
class="control-point control-rotator"
></div>
</div>
</vue-drag-resize-rotate>
</div>
<div v-if="systemSetting.gridShow===1"
:style="{width:gridWH.w+'px',height:gridWH.h+'px'}"
class="grid">
<div :style="{height:gridSpacing.h,lineHeight:gridSpacing.h}" class="grid-row" v-for="it in 100"
:key="it">
<div :style="{width:gridSpacing.w,height:gridSpacing.h}"
class="grid-col" v-for="it in 100" :key="it">
</div>
<div
v-if="systemSetting.gridShow === 1"
:style="{ width: gridWH.w + 'px', height: gridWH.h + 'px' }"
class="grid"
>
<div
:style="{ height: gridSpacing.h, lineHeight: gridSpacing.h }"
class="grid-row"
v-for="it in 100"
:key="it"
>
<div
:style="{ width: gridSpacing.w, height: gridSpacing.h }"
class="grid-col"
v-for="it in 100"
:key="it"
></div>
</div>
</div>
</div>
<img class="template-img" draggable="false" :src="img" alt="">
<img class="template-img" draggable="false" :src="img" alt="" />
</div>
<print-dialog :imgList="imgList" :byPlatenSize="gridWH.v" />
<print-dialog
:visible="printDialogShow"
:imgList="imgList"
:byPlatenSize="gridWH.v"
>
<i
@click="changePrintDialogShow"
:class="
!printDialogShow ? 'el-icon-arrow-left' : 'el-icon-arrow-right'
"
></i>
</print-dialog>
</div>
</div>
<img-setting @ev="ev" @change="formChange" :item="returnItem" @close="close"
:visible="showImgSetting"></img-setting>
<img-setting
@ev="ev"
@change="formChange"
:item="returnItem"
@close="close"
:visible="showImgSetting"
>
</img-setting>
</div>
</template>
......@@ -678,19 +751,23 @@ export default {
overflow: hidden;
box-sizing: border-box;
}
.main-bg {
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
#line {
position: absolute;
z-index: 2;
}
.grid {
border: 1px solid gray;
overflow: hidden;
.grid-row {
.grid-col {
display: inline-block;
......@@ -700,28 +777,33 @@ export default {
}
}
}
.grid-row {
width: 100%;
overflow: hidden;
height: 10px;
line-height: 10px;
white-space: nowrap;
&:nth-of-type(1) {
.grid-col {
border-top: none !important;
}
}
&:nth-last-of-type(1) {
.grid-col {
border-bottom: none !important;
}
}
.grid-col {
&:nth-of-type(1) {
border-left: none !important;
}
}
}
#img {
position: absolute;
z-index: 1;
......@@ -731,12 +813,14 @@ export default {
align-items: center;
justify-content: center;
width: auto;
img {
pointer-events: none;
width: auto;
height: 100%;
}
}
.container {
display: flex;
width: 100%;
......@@ -745,6 +829,7 @@ export default {
align-items: center;
position: relative;
}
.sucaitu {
position: absolute;
z-index: 0;
......@@ -753,10 +838,12 @@ export default {
//justify-content: center;
//align-items: center;
height: 100%;
img {
width: 100%;
height: 100%;
}
.close {
position: absolute;
top: -11px;
......@@ -772,6 +859,7 @@ export default {
align-items: center;
justify-content: center;
}
.img {
height: fit-content;
width: 100%;
......@@ -780,6 +868,7 @@ export default {
border: 1px dashed transparent;
}
}
.select-img {
border-color: #409eff;
width: 120px;
......@@ -794,17 +883,22 @@ export default {
bottom: 0;
border-right: 1px solid #ececec;
}
img {
user-select: none;
user-drag: none;
}
::v-deep .active, .active {
::v-deep .active,
.active {
border-color: #66b1ff !important;
}
.select-img-index {
box-sizing: border-box;
border-color: #409eff !important;
}
.img-item {
padding: 5px;
display: flex;
......@@ -814,15 +908,16 @@ img {
flex-direction: column;
align-items: center;
justify-content: center;
span {
margin: 5px 0;
color: white;
}
}
.sucaitu-img {
position: relative;
}
</style>
<style>
.el-upload {
......@@ -841,7 +936,8 @@ img {
border-color: transparent;
}
.handle-rot::before, .handle-rot::after {
.handle-rot::before,
.handle-rot::after {
display: none;
}
</style>
\ No newline at end of file
</style>
src/views/design/update.js 0 → 100644
import pkg from "../../../package.json";
import axios from "../../utils/axios";
export default class Update {
version;
constructor() {
this.version = pkg.version;
}
async checkUpdate() {
return new Promise((resolve, reject) => {
try {
axios
.get(`/checkUpdate?version=${this.version}`)
.then(res => {
resolve(res.data);
})
.catch(err => {
reject(err);
});
} catch (err) {
reject(err);
}
});
}
}
src/views/design/updateDialog.vue 0 → 100644
<script>
import { ipcRenderer } from "electron";
export default {
data() {
return {
visible: false,
downloaded: false,
percent: 0,
loading: false,
speed: 0,
item: {}
};
},
created() {
let that = this;
ipcRenderer.on("update", (event, data) => {
console.log("下載進度", data);
if (!that.loading) that.loading = true;
that.percent = data.percent;
that.speed = data.speed;
});
ipcRenderer.on("update-error", (event, data) => {
console.log(data);
that.$message.error(`安装包下载失败`);
that.loading = false;
});
ipcRenderer.on("downloaded", () => {
that.loading = false;
that.download();
});
},
methods: {
download() {
this.$confirm("新版本已下载，是否立即安装？", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
showCancelButton: this.item.forcedUpdate === 0,
showClose: this.item.forcedUpdate === 0,
type: "success"
})
.then(() => {
ipcRenderer.send("install");
this.visible = false;
})
.catch(() => {});
},
incrementalUpdates() {
this.$confirm("新版本已下载，是否刷新页面", "提示", {
confirmButtonText: "确定",
showCancelButton: this.item.forcedUpdate === 0,
showClose: this.item.forcedUpdate === 0,
cancelButtonText: "取消",
type: "success"
})
.then(() => {
window.location.reload();
})
.catch(() => {});
},
async toUpdate(type) {
if (type === 1) {
this.visible = false;
if (this.loading) return;
} else {
this.loading = true;
}
if (!this.item.fileList || this.item.fileList.length === 0) {
return this.$message.warning("缺少更新文件");
}
console.log("开始下载");
if (this.item.fullUpdate) {
// 全量更新
const domain = "https://" + this.$dataStore.get("company").domain;
this.item.url =
domain + this.item.fileList[0].versionPath.replace("/data", "");
console.log(this.item.url);
ipcRenderer.send("toUpdateApp", this.item);
} else {
try {
this.loading = false;
await this.$api.post("/incrementalUpdates", {
url: this.item.fileList[0].fileUrl.replace("/data", "")
});
this.incrementalUpdates();
} catch (e) {
// this.$message.warning("更新失败");
}
}
},
open(data) {
this.item = data;
this.visible = true;
}
}
};
</script>
<template>
<el-dialog
:show-close="item.forcedUpdate === 0"
destroy-on-close
:close-on-press-escape="false"
:close-on-click-modal="false"
width="500px"
:title="item.title"
:visible.sync="visible"
>
<pre>{{ item.content }}</pre>
<!-- <el-progress :text-inside="true" :stroke-width="26" :percentage="percent"></el-progress>-->
<template slot="footer">
<el-button
@click="visible = false"
v-if="item.forcedUpdate === 0"
size="small"
>关闭
</el-button>
<!-- <el-button @click="toUpdate(1)" size="small" type="warning"-->
<!-- >后台更新-->
<!-- </el-button-->
<!-- >-->
<el-button
@click="toUpdate(2)"
size="small"
type="primary"
:loading="loading"
>
{{ loading ? `正在下载中（${percent}%）` : "确定更新" }}
</el-button>
</template>
</el-dialog>
</template>
<style scoped lang="less"></style>
src/views/login/index.vue
......@@ -4,7 +4,7 @@ export default {
data() {
return {
rules: {
company: [{ validator: this.validatePass, required: true, trigger: "blur" }],
company: [{ message: "请选择客户名称", required: true, trigger: "change" }],
loginName: [{ message: "请输入用户名", required: true, trigger: "blur" }],
password: [{ message: "请输入密码", required: true, trigger: "blur" }]
},
......@@ -59,7 +59,7 @@ export default {
...this.form
}, {
headers: {
"company": this.form.company + ".jomalls.com"
"company": this.form.company
}
}).then((res) => {
if (res.code === 200) {
......@@ -93,9 +93,7 @@ export default {
this.$refs.formRef.validate(async valid => {
if (valid) {
let f = JSON.parse(JSON.stringify(this.form));
if (f.company.split(".").length === 1) {
f.company = f.company + ".jomalls.com";
}
if (!f.deviceId) {
f.deviceId = this.$dataStore.get("deviceId" + this.form.loginName);
}
......@@ -142,7 +140,7 @@ export default {
return;
}
console.log(this.userList, v);
this.form.company = this.userList[v].company.split(".")[0];
this.form.company = this.userList[v].company;
this.form.loginName = this.userList[v].loginName;
this.form.password = this.userList[v].password;
this.form.deviceId = this.userList[v].deviceId;
......@@ -170,15 +168,20 @@ export default {
</el-select>
</el-form-item>
<el-form-item v-if="!company" prop="company">
<el-input placeholder="客户（例如demo）" prefix-icon="el-icon-monitor" v-model="form.company"
clearable></el-input>
<!-- <el-select filterable style="width: 100%;" placeholder="系统" v-model="form.company"-->
<!-- clearable>-->
<!-- <template slot="prefix">-->
<!-- <i class="el-icon-monitor"></i>-->
<!-- </template>-->
<!-- <el-option v-for="(it,i) in companyList" :key="i" :label="it.companyName" :value="it.domain"></el-option>-->
<!-- <el-select prefix-icon="el-icon-monitor" v-model="form.company">-->
<!-- <el-option v-for="(it,i) in companyList" :key="i" :label="it.companyName" :value="it.domain.replace('.jomalls.com','')"></el-option>-->
<!-- </el-select>-->
<!--&lt;!&ndash; <el-input placeholder="客户（例如demo）" prefix-icon="el-icon-monitor" v-model="form.company"&ndash;&gt;-->
<!--&lt;!&ndash; clearable>&ndash;&gt;-->
<!--&lt;!&ndash; </el-input>&ndash;&gt;-->
<el-select filterable style="width: 100%;" placeholder="系统" v-model="form.company"
clearable>
<template slot="prefix">
<i class="el-icon-monitor"></i>
</template>
<el-option v-for="(it,i) in companyList" :key="i" :label="it.companyName" :value="it.domain"></el-option>
</el-select>
</el-form-item>
<el-form-item prop="loginName">
......@@ -188,10 +191,10 @@ export default {
<el-input placeholder="密码" show-password prefix-icon="el-icon-lock" type="password" v-model="form.password"
clearable></el-input>
</el-form-item>
<!-- <el-form-item v-if="len===0" prop="授权信息">-->
<!-- <el-input placeholder="授权信息" prefix-icon="el-icon-lock" v-model="form.auth"-->
<!-- clearable></el-input>-->
<!-- </el-form-item>-->
<!-- <el-form-item v-if="len===0" prop="授权信息">-->
<!-- <el-input placeholder="授权信息" prefix-icon="el-icon-lock" v-model="form.auth"-->
<!-- clearable></el-input>-->
<!-- </el-form-item>-->
<div class="check">
<el-checkbox v-model="remember">记住账号</el-checkbox>
</div>
......
vue.config.js
......@@ -6,6 +6,7 @@ module.exports = {
outputDir: process.env.NODE_ENV === "production" ? "dist" : "devdist",
// eslint-loader 是否在保存的时候检查
lintOnSave: false,
/** vue3.0内置了webpack所有东西，
* webpack配置,see https://github.com/vuejs/vue-cli/blob/dev/docs/webpack.md
**/
......@@ -67,7 +68,7 @@ module.exports = {
devServer: {
open: false, // 编译完成是否打开网页
host: "0.0.0.0", // 指定使用地址，默认localhost,0.0.0.0代表可以被外界访问
port: 8090, // 访问端口
port: 8050, // 访问端口
https: false, // 编译失败时刷新页面
hot: true, // 开启热加载
hotOnly: false,
......@@ -94,12 +95,17 @@ module.exports = {
* 第三方插件配置
*/
pluginOptions: {
electronBuilder:{
electronBuilder: {
builderOptions: {
"extraResources": [
asar: false,
extraResources: [
{
from: "./print/",
to: "../print"
},
{
"from": "./print/",
"to": "../print"
from: "./logs/",
to: "../logs"
}
]
}
......
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