Commit 2175e9a0 authored by 黄媛媛's avatar 黄媛媛

打印改版

parent ada6ffd1
......@@ -52,7 +52,7 @@
height: 360px;
border: 1px solid #000;
padding: 10px;
}
</style>
<template>
......@@ -73,10 +73,14 @@
<el-option label="不限" :value="0" ></el-option>
<el-option :label="item.StockInNum" :value="item.StockInId" v-for="(item,index2) in options" :key="index2"></el-option>
</el-select>
<div style=" float: right;">
<el-radio v-model="radio" label="2" @change="btnradio">小图</el-radio>
<el-radio v-model="radio" label="1" @change="btnradio">大图</el-radio>
</div>
</div>
<div v-if="dataList.length==0" style="width:100%;text-align: center;margin:30px 0">暂无打印标签</div>
<div style="margin-top:10px" v-for="(i,j) in dataList" :key="j" v-if="dataList.length>0" v-loading="fullscreenLoading">
<div style="margin-top:10px" v-for="(i,j) in dataList" :key="j" v-if="dataList.length>0 && radio==1" v-loading="fullscreenLoading" >
<div style="margin:20px 0;font-size:16px;color:rgb(64, 158, 255)">
<span > 商品名称:{{i.GoodsName}}</span>
</div>
......@@ -91,15 +95,11 @@
<img :src="domainManager().DomainUrl+item.QRImage" alt="" style="width:100%">
</el-col>
<el-col :span="12" style='font-size:12px;'>
<!-- <div style='margin-top:20px'>
<span class="print_item_c_r_s">入库人</span>
<span>{{item.EmName}}</span>
<div style='margin-top:20px'>
<span class="print_item_c_r_s">序号</span>
<span>{{item.xuhao}}</span>
</div>
<div style='margin-top:5px'>
<span class="print_item_c_r_s">入库时间:</span>
<span>{{item.CreateDate}}</span>
</div> -->
<div style='margin-top:20px'>
<span class="print_item_c_r_s">仓库名称:</span>
<span>{{item.WareHouseName}}</span>
</div>
......@@ -107,10 +107,6 @@
<span class="print_item_c_r_s">商品规格:</span>
<span v-for="(x,y) in item.SpecificationList" :key="y">{{x}} <span v-if="item.SpecificationList.length !== y+1"> , </span></span>
</div>
<!-- <div style='margin-top:5px'>
<span class="print_item_c_r_s">成本价格:</span>
<span>{{item.CostMoney}}</span>
</div> -->
</el-col>
</el-row>
</div>
......@@ -126,6 +122,38 @@
</el-row>
</div>
<div style="margin-top:10px" v-for="(i,j) in dataList" :key="j" v-if="dataList.length>0 && radio==2" v-loading="fullscreenLoading" >
<div style="margin:20px 0;font-size:16px;color:rgb(64, 158, 255)">
<span > 商品名称:{{i.GoodsName}}</span>
</div>
<el-row :gutter="30">
<el-col :span="3" v-for="(item,index) in i.list" :key="index" >
<div :class="item.Ischeck ==true? 'print_item2':'print_item'" @click="gocheke(j,index)">
<!-- <div style=" width:100%; height:20px;text-overflow: ellipsis; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;">{{item.GoodsName}}</div>
<div>
<img :src="domainManager().DomainUrl+item.TQRImage" alt="" style="width:100%">
</div> -->
<el-row :gutter="10">
<el-col :span="12">
<img :src="domainManager().DomainUrl+item.QRImage" alt="" style="width:100%">
</el-col>
<el-col :span="12" style='font-size:12px;'>
<div style='margin-top:5px'>
<span>序号:</span>
<span>{{item.xuhao}}</span>
</div>
<div style='margin-top:5px; width:100%; height:32px;text-overflow: ellipsis; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;'>
<span>{{item.GoodsName}}</span>
</div>
</el-col>
</el-row>
</div>
</el-col>
</el-row>
</div>
<div class="xuanzhong" id = 'xuanzhong' style="display:none" >
<!-- <div v-for="(item,index) in checkList" :key="index" class="xuanzhong_item" :id = "item.page" > -->
<div v-for="(item,index) in checkList" :key="index" :id = "item.page" style=" width: 283px; height: 283px;padding: 10px;display: flex;flex-direction: column; justify-content: space-around;">
......@@ -136,7 +164,10 @@
<div style=' width:100%; display: flex;flex-direction: row;align-items: center;margin-top:10px'>
<img :src="domainManager().DomainUrl+item.QRImage" alt="" style="width:180px;height: 180px">
<div style="display: flex;flex-direction: column;font-size:11px;width:150px">
<div style='margin-top:3px'>
<span style=" display: inline-block; width: 62px;">序号:</span>
<span>{{item.xuhao}}</span>
</div>
<div style='margin-top:3px'>
<span style=" display: inline-block; width: 62px;">仓库名称:</span>
<span>{{item.WareHouseName}}</span>
......@@ -161,6 +192,30 @@
</div>
</div>
<div class="xuanzhong" id = 'xuanzhong' style="display:none" >
<!-- <div v-for="(item,index) in checkList" :key="index" class="xuanzhong_item" :id = "item.page" > -->
<div v-for="(item,index) in checkList" :key="index" :id = "item.xpage" style=" width: 125px; height: 100px;display: flex;flex-direction: column; justify-content: space-around;">
<!-- <div style=" width:100%; height:20px;text-overflow: ellipsis; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;font-size:12px">
{{item.GoodsName}}
</div> -->
<div style=' width:140%; display: flex;flex-direction: row;align-items: center'>
<img :src="domainManager().DomainUrl+item.QRImage" alt="" style="width:110px;height: 110px">
<div style="display: flex;flex-direction: column;font-size:11px;width:78px;font-size:10px;;height: 90px; overflow: hidden;">
<div style='margin-top:5px'>
<span style=" display: inline-block">序号:</span>
<span>{{item.xuhao}}</span>
</div>
<div style='margin-top:3px'>
<span>{{item.GoodsName}}</span>
</div>
</div>
</div>
</div>
</div>
</div>
......@@ -187,6 +242,7 @@ export default {
stagingData:[],//商品名字搜索使用
xzCreateDate:'',
GoodsNames:'',
radio: '2',
};
},
created() {
......@@ -236,7 +292,13 @@ export default {
})
this.stagingData = this.dataList
this.CreateDatelist = this.groupArr(data,'GoodsName')
this.dataList = this.CreateDatelist
this.dataList = this.CreateDatelist;
this.dataList.forEach(x=>{
x.list.forEach((j,index)=>{
j.xuhao = index+1+'/'+x.list.length
})
})
} else {
this.Error(res.data.message);
}
......@@ -259,6 +321,7 @@ export default {
this.checkList = data
this.checkList.forEach((x,i)=>{
x.page = 'page'+(i+1)
x.xpage = 'xpage'+(i+1)
});
console.log(this.checkList)
......@@ -279,6 +342,7 @@ export default {
this.checkList = data;
this.checkList.forEach((x,i)=>{
x.page = 'page'+(i+1)
x.xpage = 'xpage'+(i+1)
})
}else{
......@@ -293,6 +357,14 @@ export default {
console.log(this.checkList)
this.$forceUpdate()
},
btnradio(){
this.checkList=[];
this.dataList.forEach((x,i)=>{
x.list.forEach((j)=>{
j.Ischeck = false;
})
})
},
batchprint(n){//批量打印
// debugger;
......@@ -302,12 +374,25 @@ export default {
// http://www.c-lodop.com/LodopDemo.html 官网地址
 let page = 'page'+n
 let page
if(this.radio==1){
 page = 'page'+n
}else if(this.radio==2){
  page='xpage'+n
}
 
let LODOP = getLodop()//调用getLodop获取LODOP对象
LODOP.PRINT_INIT(page)
LODOP.NewPage();
var strFormHtml="<body>"+document.getElementById(page).innerHTML+"</body>";
LODOP.ADD_PRINT_HTM(20,15,300,300,strFormHtml);
if(this.radio==1){
LODOP.ADD_PRINT_HTM(20,15,300,300,strFormHtml);
}else if(this.radio==2){
LODOP.ADD_PRINT_HTM(0,0,125,110,strFormHtml);
}
// LODOP.PREVIEW()//预览打印
// LODOP.PRINT_DESIGN()//进入打印设计
// LODOP.PRINT()//直接打印打印
......@@ -323,7 +408,6 @@ export default {
num++;//循环打印
console.log(num)
if(conunt>=num){
console.log(2)
setTimeout(()=>{
that.batchprint(num)
},200)
......
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