Skip to content

E
electron-printer
Commit 3409f5ee by zhuzhequan
Options

处理胡总提出的问题

parent be4f635b
Showing with 72 additions and 67 deletions
config/env.json
{ {
"apiApiHost":"https://factory.jomalls.com/api", "apiApiHost":"https://factory.jomalls.com/api",
"fileApiUrl":"https://factory.jomalls.com/upload/factory", "fileApiUrl":"https://factory.jomalls.com/upload/factory",
"visionUrl":"https://console.jomalls.com" "visionUrl":"https://console.jomalls.com"
} }
src/components/PicScrollbarBox.vue
...@@ -13,7 +13,7 @@ ...@@ -13,7 +13,7 @@
>裁切</el-button >裁切</el-button
> --> > -->
</div> </div>
<el-scrollbar class="scrollbarBox"> <div class="scrollbarBox">
<slot v-if="$slots.mainContent" name="mainContent"></slot> <slot v-if="$slots.mainContent" name="mainContent"></slot>
<!-- <el-checkbox-group <!-- <el-checkbox-group
v-if="imglist.length" v-if="imglist.length"
...@@ -35,7 +35,7 @@ ...@@ -35,7 +35,7 @@
</el-checkbox></el-checkbox-group </el-checkbox></el-checkbox-group
> --> > -->
<el-empty v-else :description="emptyTitle"></el-empty> <el-empty v-else :description="emptyTitle"></el-empty>
</el-scrollbar> </div>
</div> </div>
</template> </template>
<script> <script>
...@@ -63,6 +63,12 @@ export default { ...@@ -63,6 +63,12 @@ export default {
}; };
</script> </script>
<style lang="less" scoped> <style lang="less" scoped>
.scrollbarBox{
overflow-x: auto;
overflow-y: hidden;
width: 100%;
white-space: nowrap;
}
.title { .title {
padding: 10px; padding: 10px;
font-size: 20px; font-size: 20px;
...@@ -70,9 +76,13 @@ export default { ...@@ -70,9 +76,13 @@ export default {
} }
.el-scrollbar { .el-scrollbar {
overflow-y: hidden; overflow-y: hidden;
:v-deep.el-scrollbar__wrap { //::v-deep .el-scrollbar__wrap {
margin-bottom: 0 !important; // margin-bottom: 0 !important;
} //}
//::v-deep .el-scrollbar__view {
// display: flex;
// flex-wrap: nowrap;
//}
} }
::v-deep.el-empty { ::v-deep.el-empty {
padding-top: 0; padding-top: 0;
......
src/views/design/head/printDialog.vue
...@@ -375,12 +375,12 @@ export default { ...@@ -375,12 +375,12 @@ export default {
w = this.numberToStr4(w); w = this.numberToStr4(w);
h = this.numberToStr4(h); h = this.numberToStr4(h);
console.log("print", w, h); console.log("print", w, h);
//
if (w > 4200 || h > 4700) { // if (w > 4200 || h > 4700) {
return this.$message.warning( // return this.$message.warning(
"打印图片素材宽度不能超过410mm,长度不能超过450mm" // "打印图片素材宽度不能超过410mm,长度不能超过450mm"
); // );
} // }
r = Number(r).toFixed(0); r = Number(r).toFixed(0);
const imgFileName = this.imgList[0].fileName; const imgFileName = this.imgList[0].fileName;
let position = ""; // 位置 let position = ""; // 位置
......
src/views/design/main/index.vue
...@@ -360,8 +360,9 @@ export default { ...@@ -360,8 +360,9 @@ export default {
}, },
selectImg(it, i) { selectImg(it, i) {
if (this.isView) { if (this.isView) {
return; this.isView = false
} }
// this.selectImgIndexList.push(i) // this.selectImgIndexList.push(i)
let item = this.imgList.find((img) => img.fileName === it.fileName); let item = this.imgList.find((img) => img.fileName === it.fileName);
if (item) return; if (item) return;
...@@ -373,10 +374,11 @@ export default { ...@@ -373,10 +374,11 @@ export default {
height: this.detail.mssHeight, height: this.detail.mssHeight,
}; };
} }
// this.selectImgIndexList = Array.from(new Set(this.selectImgIndexList)) this.getBackFile({files:[it],size:this.detail.adjustable}, (file) => {
this.getBackFile({ files: [it], size }, (file) => {
this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList))); this.imgHistoryList.push(JSON.parse(JSON.stringify(this.imgList)));
}); })
// this.selectImgIndexList = Array.from(new Set(this.selectImgIndexList))
// this.getBackFile({ files: [it], size });
}, },
ev(type) { ev(type) {
if (this.selectIndex < 0 && this.imgList.length) { if (this.selectIndex < 0 && this.imgList.length) {
...@@ -546,14 +548,14 @@ export default { ...@@ -546,14 +548,14 @@ export default {
let that = this; let that = this;
let bw = document.getElementById("line"); let bw = document.getElementById("line");
bw = bw.clientWidth; bw = bw.clientWidth;
this.isView =false
// bw = Number(bw.replace("px", "")); // bw = Number(bw.replsace("px", ""));
for (let i = 0; i < files.length; i++) { for (let i = 0; i < files.length; i++) {
files[i].url = files[i].productionFile || files[i].url; files[i].url = files[i].productionFile || files[i].url;
that.$nextTick(async () => { that.$nextTick(async () => {
let w = bw / 2; let w = bw / 2;
let width_px, height_px, rate, x, y; let width_px, height_px, rate, x, y;
if (size) { if (size && !files[i].isCut) {
width_px = that.WHproportion * mmToPx(size.width); width_px = that.WHproportion * mmToPx(size.width);
height_px = that.WHproportion * mmToPx(size.height); height_px = that.WHproportion * mmToPx(size.height);
x = w * that.WHproportion; x = w * that.WHproportion;
...@@ -564,8 +566,8 @@ export default { ...@@ -564,8 +566,8 @@ export default {
rate = data.height / data.width; rate = data.height / data.width;
width_px = bw * (2 / 3); width_px = bw * (2 / 3);
x = w; x = w;
y = height_px / 2;
height_px = width_px * rate; height_px = width_px * rate;
y = height_px / 2;
} }
that.imgList = []; that.imgList = [];
...@@ -585,6 +587,9 @@ export default { ...@@ -585,6 +587,9 @@ export default {
that.$nextTick(() => { that.$nextTick(() => {
that.ev("center"); that.ev("center");
}); });
setTimeout(()=>{
that.ev("center");
},10000)
if (i === files.length - 1) { if (i === files.length - 1) {
callback && callback(); callback && callback();
} }
...@@ -696,22 +701,13 @@ export default { ...@@ -696,22 +701,13 @@ export default {
// 图片导出为 png 格式 // 图片导出为 png 格式
let imgType = "png"; let imgType = "png";
let imgData = canvas.toDataURL(imgType); let imgData = canvas.toDataURL(imgType);
callback && callback(imgData); callback && callback(imgData);
}; };
return img; return img;
}, },
async cutImgFn() { async cutImgFn() {
if (!this.checkList?.length) return; this.checkList = JSON.parse(JSON.stringify(this.selectImgList))
if (this.detail.mssHeight && this.detail.mssWidth) {
return this.$confirm(`该生产单为直接打印单不可进行裁切！`, "提示", {
confirmButtonText: "确定",
showCancelButton: false,
type: "warning",
});
}
try { try {
const processQueue = await Promise.all( const processQueue = await Promise.all(
this.checkList.map(async (el) => { this.checkList.map(async (el) => {
...@@ -742,6 +738,8 @@ export default { ...@@ -742,6 +738,8 @@ export default {
this.selectImgList.forEach((el) => { this.selectImgList.forEach((el) => {
if (newMap.has(el.designId)) { if (newMap.has(el.designId)) {
el.fileName = newMap.get(el.designId).fileName; el.fileName = newMap.get(el.designId).fileName;
el.url = newMap.get(el.designId).productionFile;
el.isCut = true
el.productionFile = newMap.get(el.designId).productionFile; el.productionFile = newMap.get(el.designId).productionFile;
} }
}); });
...@@ -758,8 +756,7 @@ export default { ...@@ -758,8 +756,7 @@ export default {
} }
this.checkList = []; this.checkList = [];
this.getBackFile({files:[this.selectImgList[0]]})
this.selectImg(this.selectImgList[0]);
} catch (error) { } catch (error) {
console.error("错误", error); console.error("错误", error);
} }
...@@ -774,8 +771,8 @@ export default { ...@@ -774,8 +771,8 @@ export default {
// 确保点击的元素在包含 container 类名的元素内 // 确保点击的元素在包含 container 类名的元素内
if (currentElement.closest(".container")) { if (currentElement.closest(".container")) {
// 如果点击的元素不是 boxShaow，执行方法 // 如果点击的元素不是 boxShaow，执行方法
if (!currentElement.closest(".boxShaow") && !this.isView) { if (!currentElement.closest(".boxShaow")) {
this.isView = true; this.isView = !this.isView;
console.log(723, this.isView); console.log(723, this.isView);
} }
} }
...@@ -991,6 +988,7 @@ export default { ...@@ -991,6 +988,7 @@ export default {
> >
<img width="150px" :src="img.url" /> <img width="150px" :src="img.url" />
</div> </div>
</div> </div>
</template> </template>
</PicScrollbarBox> </PicScrollbarBox>
...@@ -1005,25 +1003,10 @@ export default { ...@@ -1005,25 +1003,10 @@ export default {
> >
</template> </template>
<template #mainContent> <template #mainContent>
<el-checkbox-group <div v-for="(img,i) in selectImgList" class="img-item" @click.stop.prevent="selectImg(img)">
v-if="selectImgList.length" <img :key="i" style="width:100%" :src="img.productionFile" />
v-model="checkList" <!-- <span>{{ img.designId }}</span> -->
style="display: flex;flex-wrap:nowrap;width: 100%;" </div>
>
<el-checkbox
v-for="img in selectImgList"
:key="img.designId"
:class="{
imgchecked: checkList.includes(img),
}"
:label="img"
>
<div class="img-item" @click.stop.prevent="selectImg(img)">
<img style="width:100%" :src="img.productionFile" />
<!-- <span>{{ img.designId }}</span> -->
</div>
</el-checkbox></el-checkbox-group
>
</template> </template>
</PicScrollbarBox> </PicScrollbarBox>
<!-- <div> <!-- <div>
...@@ -1161,7 +1144,7 @@ export default { ...@@ -1161,7 +1144,7 @@ export default {
class="main-bg" class="main-bg"
:style="{ 'background-color': !isView ? '#77797a' : '#fff' }" :style="{ 'background-color': !isView ? '#77797a' : '#fff' }"
> >
<div class="container"> <div class="container">
<div style="width: 100%;height: 100%; "> <div style="width: 100%;height: 100%; ">
<div v-if="isView" id="img"> <div v-if="isView" id="img">
<div <div
...@@ -1190,6 +1173,7 @@ export default { ...@@ -1190,6 +1173,7 @@ export default {
:angle="item.r / WHproportion" :angle="item.r / WHproportion"
style="pointer-events: auto;cursor: default" style="pointer-events: auto;cursor: default"
> >
<div <div
ref="sucaitu-img" ref="sucaitu-img"
:style="{ zIndex: item.zIndex }" :style="{ zIndex: item.zIndex }"
...@@ -1345,7 +1329,7 @@ export default { ...@@ -1345,7 +1329,7 @@ export default {
position: absolute; position: absolute;
bottom: 16px; bottom: 16px;
font-size: 24px; font-size: 24px;
left: 20%; left: 25%;
} }
.page-main { .page-main {
display: flex; display: flex;
...@@ -1369,7 +1353,6 @@ export default { ...@@ -1369,7 +1353,6 @@ export default {
// z-index: 2; // z-index: 2;
left: 5%; left: 5%;
top: 50%; top: 50%;
transform: translate(0, -50%); transform: translate(0, -50%);
background-color: #f0f2f6; background-color: #f0f2f6;
} }
...@@ -1426,6 +1409,7 @@ export default { ...@@ -1426,6 +1409,7 @@ export default {
justify-content: center; justify-content: center;
// width: auto; // width: auto;
position: absolute; position: absolute;
z-index: 2;
left: 5%; left: 5%;
img { img {
pointer-events: none; pointer-events: none;
...@@ -1509,15 +1493,21 @@ img { ...@@ -1509,15 +1493,21 @@ img {
.img-item { .img-item {
// height: 150px; // height: 150px;
width: 200px; width: 200px;
max-height: 200px;
overflow: hidden;
padding: 5px; padding: 5px;
display: flex; box-sizing: border-box;
background: #ececec;
display: inline-block;
cursor: pointer; cursor: pointer;
// margin-bottom: 20px; // margin-bottom: 20px;
border: 2px dashed transparent; margin-right: 5px;
flex-direction: column;
align-items: center;
justify-content: center;
box-sizing: border-box; box-sizing: border-box;
img{
width: 100%;
height: auto;
}
span { span {
font-size: 14px; font-size: 14px;
// margin: 5px 0; // margin: 5px 0;
...@@ -1623,7 +1613,7 @@ img { ...@@ -1623,7 +1613,7 @@ img {
display: flex; display: flex;
flex: 50%; flex: 50%;
font-size: 12px; font-size: 12px;
margin-bottom: 10px; margin-bottom: 6px;
.item-label { .item-label {
flex: 1; flex: 1;
text-align: right; text-align: right;
...@@ -1668,11 +1658,16 @@ img { ...@@ -1668,11 +1658,16 @@ img {
.active::before { .active::before {
display: none; display: none;
} }
::v-deep .drr:hover:before { //::v-deep .drr:hover:before {
outline: none; // outline: none;
} //}
} }
// ::v-deep.el-table thead { // ::v-deep.el-table thead {
// color: black; // color: black;
// } // }
.fixed-border{
position: fixed;
z-index: 69;
}
</style> </style>
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