工作中用到了lodop套打功能 包括一些打印功能都能在lodop实现,VUE项目中适用
<template>
<!-- meatcq 肉品合格证 -->
<div>
<el-form :inline="true" class="demo-form-inline demo-form-left demo-form-province">
<el-form-item label="产品检疫合格证编号:">
<el-input size="small" v-model="butcherCertNumber" placeholder="请输入动物证号"></el-input>
</el-form-item>
<el-form-item label="货主:">
<el-input size="small" v-model="owner" placeholder="请输入货主"></el-input>
</el-form-item>
<el-form-item>
<el-button type="primary" size="small" @click="handleCurrentChange(1)">查询</el-button>
</el-form-item>
<el-form-item>
<el-button type="warning" size="small" @click="clearHandle()">重置</el-button>
</el-form-item>
<el-form-item>
<el-button type="success" size="small" @click="handlePrintSetting()">打印设置</el-button>
</el-form-item>
</el-form>
<el-table :data="tableData" v-loading="loading" border style="width: 100%" align="center">
<el-table-column fixed label="序号" min-width="75" align="center">
<template slot-scope="scope">
<span>{{scope.$index+1+(pageNum-1)*pageSize}}</span>
</template>
</el-table-column>
<el-table-column prop="butcherName" label="屠宰厂" min-width="80" align="center"></el-table-column>
<el-table-column prop="owner" label="货主姓名" min-width="80" align="center"></el-table-column>
<el-table-column prop="signDate" label="日期" min-width="100" align="center">
<template slot-scope="scope">
<mz-date-view :date="scope.row.signDate"></mz-date-view>
</template>
</el-table-column>
<el-table-column prop="carrierMan" label="购货人员" min-width="80" align="center"></el-table-column>
<el-table-column prop="quantity" label="销售数量(头或公斤)" min-width="120" align="center"></el-table-column>
<el-table-column prop="butcherCertNumber" label="产品检疫合格证编号" min-width="120" align="center"></el-table-column>
<el-table-column prop="isPrint" label="是否打印合格证" min-width="120" align="center">
<template slot-scope="scope">
<!--0未打印,1已打印-->
<span>{{(scope.row.isPrint===1)?'已打印':'未打印'}}</span>
</template>
</el-table-column>
<el-table-column prop="certCount" label="合格证份数" min-width="80" align="center"></el-table-column>
<el-table-column fixed="right" label="操作" min-width="120" align="center">
<template slot-scope="scope">
<el-button v-if="(scope.row.isPrint==1)"
size="small"
type="success"
plain
@click="handleEdit(scope.row)"
>查看合格证</el-button>
<el-button v-if="(scope.row.isPrint != 1)"
size="small"
type="primary"
plain
@click="handlePrintForm(scope.row)"
>打印合格证</el-button>
</template>
</el-table-column>
</el-table>
<div class="block-pagination" style="text-align: center;">
<el-pagination
@current-change="handleCurrentChange"
@size-change="handleSizeChange"
:current-page="pageNum"
:page-sizes="[10, 20, 100, 400]"
:page-size="pageSize"
layout="total, sizes, prev, pager, next, jumper"
style="text-align: right;"
:total="total"
></el-pagination>
</div>
<el-dialog v-if="dialogFormVisible" :visible.sync="dialogFormVisible" title="查看合格证" width="80%" >
<MeatcqView :quaButcherCertsId="this.quaButcherCertsId" :pageNum="pageNum" @handleCurrentChange="handleCurrentChange"></MeatcqView>
</el-dialog>
<el-dialog :model="formInline" :visible.sync="showAlertPrint" title="打印设置" height="200px" width="50%">
<div v-if="imageVisible" class="dialog-body" style="margin-left: 5px; margin-top: 5px; height:200px">
<el-row>
<el-col :span="8">生产单位:</el-col>
<el-col :span="16" style="border-right:1px solid #ccc">
<el-input size="small" v-model="formInline.factoryButcherName" placeholder="生产单位" maxlength="32"></el-input>
</el-col>
</el-row>
<el-row>
<el-col :span="8">定点代码:</el-col>
<el-col :span="16" style="border-right:1px solid #ccc">
<el-input size="small" v-model="formInline.factoryButcherPointCode" placeholder="定点代码" maxlength="32"></el-input>
</el-col>
</el-row>
<el-row style="border-bottom:1px solid #ccc">
<el-col :span="8">企业等级(星级):</el-col>
<el-col :span="16" style="border-right:1px solid #ccc">
<el-input size="small" v-model="formInline.factoryButcherRank" placeholder="企业等级" maxlength="8"></el-input>
</el-col>
</el-row>
<div style="padding:10px;text-align:center;">
<el-button type="primary" @click="submitPrintSetting" size="small">保存</el-button>
</div>
</div>
</el-dialog>
<el-dialog :model="printForm" :visible.sync="showPrintForm" title="打印肉品合格证" height="500px" width="70%">
<div v-if="imageVisible" class="dialog-body" style="margin-left: 5px; margin-top: 5px; height:500px">
<el-form :model="printForm" :inline-message="true" status-icon ref="printForm" label-width="100px" class="demo-dynamic" :rules="rules">
<el-row>
<el-col :span="4">产品名称:</el-col>
<el-col :span="8" style="text-align: left;">
<el-form-item prop="productionName">
<el-input size="small" v-model="printForm.productionName" style="margin-left: -30%;" placeholder="产品名称" maxlength="32"></el-input>
</el-form-item>
</el-col>
<el-col :span="4">产品数量/重量:</el-col>
<el-col :span="8" style="border-right:1px solid #ccc;text-align: left;">
<el-form-item prop="productionQuantity">
<el-input size="small" v-model="printForm.productionQuantity" style="margin-left: -30%;" placeholder="产品数量/重量" maxlength="32"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="4">生产单位:</el-col>
<el-col :span="20" style="border-right:1px solid #ccc;">
<el-input size="small" v-model="printForm.factoryButcherName" style="margin-left: -76%;" placeholder="生产单位" disabled maxlength="32"></el-input>
</el-col>
</el-row>
<el-row>
<el-col :span="4">定点代码:</el-col>
<el-col :span="8">
<el-input size="small" v-model="printForm.factoryButcherPointCode" style="margin-left: -40%;" placeholder="定点代码" disabled maxlength="32"></el-input>
</el-col>
<el-col :span="4">生产日期:</el-col>
<el-col :span="8" style="border-right:1px solid #ccc;text-align: left;">
<!-- <el-form-item prop="productionDate"> -->
<!-- <el-date-picker size="small" v-model="printForm.productionDate" @change='production' style="margin-left: -30%;width:150px" type="date" placeholder="生产日期"></el-date-picker> -->
<div style="margin-left:10%"><mz-date-view :date="printForm.productionDate"></mz-date-view></div>
<!-- </el-form-item> -->
</el-col>
</el-row>
<el-row>
<el-col :span="4">企业等级(星级):</el-col>
<el-col :span="8">
<el-input size="small" v-model="printForm.factoryButcherRank" style="margin-left: -40%;" placeholder="企业等级(星级)" disabled maxlength="8"></el-input>
</el-col>
<el-col :span="4">购货方:</el-col>
<el-col :span="8" style="border-right:1px solid #ccc;text-align: left;">
<el-form-item prop="productionBuyer">
<el-input size="small" v-model="printForm.productionBuyer" style="margin-left: -30%;" placeholder="购货方" maxlength="32"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="4">肉品编码:</el-col>
<el-col :span="20" style="border-right:1px solid #ccc;text-align: left;">
<el-form-item prop="productionCode">
<el-input size="small" v-model="printForm.productionCode" placeholder="肉品编码" maxlength="32"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row style="border-bottom:1px solid #ccc">
<el-col :span="4">检验员(签章):</el-col>
<el-col :span="20" style="border-right:1px solid #ccc;text-align: left;">
<el-form-item prop="inspectorName">
<el-input size="small" v-model="printForm.inspectorName" placeholder="检验员(签章)" maxlength="32"></el-input>
</el-form-item>
</el-col>
</el-row>
<br/>
<br/>
<el-row>
<el-col :span="4" style="border: none">打印份数:</el-col>
<el-col :span="8" style="border: none">
<el-input size="small" v-model="printForm.quantity" placeholder="打印份数" maxlength="10"></el-input>
</el-col>
<el-col :span="4" style="border: none">开始编号:</el-col>
<el-col :span="8" style="border: none;text-align: left;">
<el-form-item prop="startNumber">
<el-input size="small" v-model="printForm.startNumber" placeholder="开始编号" maxlength="32"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<br/>
<br/>
<div style="padding:10px;text-align:center;">
<el-button type="primary" @click="submitPrintForm('printForm')" size="small">开始打印</el-button>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
import mzdateView from "../../public/mz-date-view.vue";
import mzdatepicker from "../../public/mz-date-picker.vue";
import MeatcqView from "./meatcqView"
import { getLodop } from "../../public/LodopFuncs.js";
export default {
name: "entercheck",
components: {MeatcqView, "mz-date-view": mzdateView, "mz-date-picker": mzdatepicker },
inject: ["reload"],
data() {
return {
loading: false,
quaButcherCertsId: null,
butcherCertNumber: null,
factoryButcherId: JSON.parse(window.sessionStorage.getItem('factoryIdList')).factoryId,
owner: null,
pageSize: 10,
pageNum: 1,
total: 0,
tableData: [],
// todo
formInline: {
factoryButcherName: '',
factoryButcherRank: '',
factoryButcherPointCode:''
},
dialogFormVisible: false,
showAlertPrint: false,
showPrintForm: false,
imageVisible: true,
printForm: {
quantity:1,
productionBuyer:'',
inspectorName:'',
productionDate:new Date()
},
date_value:'',
rules:{
productionName: [
{ required: true, message: '请输入产品名称', trigger: 'blur' }
],
productionQuantity:[
{ required: true, message: '请输入产品数量/重量', trigger: 'blur' }
],
// productionDate:[
// { required: true, message: '请输入生产日期', trigger: 'blur' }
// ],
// productionBuyer:[
// { required: true, message: '请输入购货方', trigger: 'blur' }
// ],
productionCode:[
{ required: true, message: '请输入肉品编码', trigger: 'blur' }
],
inspectorName:[
{ required: true, message: '请输入检验员签章', trigger: 'blur' }
],
startNumber:[
{ required: true, message: '请输入开始编号', trigger: 'blur' }
]
}
};
},
created() {
this.handleCurrentChange(1);
this.getPrintSetting();
this.date_value = (this.printForm.productionDate).getFullYear() + '-' + ((this.printForm.productionDate).getMonth() + 1) + '-' + (this.printForm.productionDate).getDate();
},
methods: {
// production(val){
// let date = val;
// this.date_value = date.getFullYear() + '-' + (date.getMonth() + 1) + '-' + date.getDate();
// },
//重置
clearHandle() {
this.factoryButcherId = null;
this.butcherCertNumber = null;
this.owner = null;
this.handleCurrentChange(this.pageNum);
},
handleSizeChange(val){
this.pageSize = val;
this.handleCurrentChange(this.pageNum);
},
handleCurrentChange(currentPage) {
this.pageNum=currentPage
this.loading = true
const params = {
pageNum: currentPage,
pageSize: this.pageSize,
factoryButcherId: this.factoryButcherId,
butcherCertNumber: this.butcherCertNumber,
owner: this.owner
}
this.$apiFetch.get('web.butcherManage.factory.queryMeatQua', params).then((data) => {
this.tableData = data.list
this.total = data.list.length
this.loading = false
}).catch((err) => {
console.log(err)
})
},
getPrintSetting() {
this.$apiFetch.get('web.butcherManage.factory.get.qualityCertPrintConfig', {factoryButcherId: this.factoryButcherId}).then((data) => {
console.log(data,'qualityCertPrintConfig');
//todo
this.formInline.factoryButcherName = data.factoryButcherName
this.formInline.factoryButcherRank = data.factoryButcherRank
this.formInline.factoryButcherPointCode = data.factoryButcherPointCode
}).catch((err) => {
console.log(err)
})
},
handleEdit(row) {
this.dialogFormVisible = true;
this.quaButcherCertsId = row.quaButcherCertsId;
// this.handleCurrentChange(1);
},
handlePrintForm(row) {
console.log(row,'row');
this.printForm.factoryButcherName = this.formInline.factoryButcherName;
this.printForm.factoryButcherPointCode = this.formInline.factoryButcherPointCode;
this.printForm.factoryButcherRank = this.formInline.factoryButcherRank;
if(this.printForm.factoryButcherName!=''&&this.printForm.factoryButcherPointCode!='' &&this.printForm.factoryButcherRank!=''){
this.showPrintForm = true;
// this.printForm.carrierMan = row.carrierMan;
// this.printForm.productionBuyer = row.carrierMan;
// this.printForm.inspectorName = row.inspectorName;
this.printForm.inspectorId = row.inspectorId;
this.quaButcherCertsId = row.quaButcherCertsId;
}else {
this.$message({
showClose: true,
message: '请填写打印设置',
type: 'warning'
});
}
},
handlePrintSetting() {
this.showAlertPrint = true;
// this.formInline.factoryButcherName = this.qualityCertPrintConfig.factoryButcherName;
// this.formInline.factoryButcherPointCode = this.qualityCertPrintConfig.factoryButcherPointCode;
// this.formInline.factoryButcherRank = this.qualityCertPrintConfig.factoryButcherRank;
},
//保存打印设置
submitPrintSetting() {
const params = {
factoryButcherId: this.factoryButcherId,
factoryButcherPointCode: this.formInline.factoryButcherPointCode,
factoryButcherRank: this.formInline.factoryButcherRank,
factoryButcherName:this.formInline.factoryButcherName
}
this.$apiFetch.post('web.butcherManage.factory.savePrint', {
qualityCertPrintConfig: JSON.stringify(params)
}).then((data) => {
console.log(data,'data');
this.showAlertPrint = false
this.reload();
this.$message({
message: '打印设置保存成功',
type: 'success'
});
}).catch((error) => {
console.log(error);
});
},
submitPrintForm(formNames) {
this.$refs[formNames].validate(valid => {
if (valid) {
const params = {
startNumber: this.printForm.startNumber,
quantity: this.printForm.quantity,
factoryButcherId: this.factoryButcherId,
factoryButcherName: this.printForm.factoryButcherName,
factoryButcherPointCode: this.printForm.factoryButcherPointCode,
factoryButcherRank: this.printForm.factoryButcherRank,
productionName: this.printForm.productionName,
productionQuantity: this.printForm.productionQuantity,
productionDate: this.printForm.productionDate,
productionCode: this.printForm.productionCode,
productionBuyer: this.printForm.productionBuyer,
inspectorId: this.printForm.inspectorId,
inspectorName: this.printForm.inspectorName,
quaButcherCertsId:this.quaButcherCertsId
}
console.log(params,'params');
this.$apiFetch.post('web.butcherManage.factory.startPrint', {
meatQualityCertDto: JSON.stringify(params)
}).then((data) => {
console.log(data)
this.$message({
message: '恭喜你,提交保存成功',
type: 'success'
});
}).catch((error) => {
console.log(error);
});
LODOP=getLodop();
LODOP.PRINT_INIT("合格证打印");
LODOP.SET_PRINT_MODE("TRYLINKPRINTER_NOALERT",true);//这个语句设置网络共享打印机连接不通时是否提示一下
// LODOP.SET_PRINT_MODE("POS_BASEON_PAPER",true);
if (LODOP.SET_PRINTER_INDEX(0))//这里指定第0号打印机打印
// LODOP.SET_PRINT_PAGESIZE(2,"2100","2970","A4");
LODOP.PRINT_INITA(14,11,800,600,"套打的模板");
LODOP.SET_PRINT_PAGESIZE(1,"2100","2970","");//设置纸张高度
LODOP.ADD_PRINT_TEXT(85,120,195,20,this.printForm.productionName); //产品名称
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(120,130,194,20,this.printForm.productionQuantity); //产品数量
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(150,120,195,20,this.date_value); //生产日期
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(180,120,195,20,this.printForm.productionCode); //肉品编码
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(210,120,194,20,this.printForm.productionBuyer); //购货方
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(245,130,195,20,this.printForm.inspectorName); //检验员签章
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(85,450,195,20,this.printForm.productionName); //产品名称
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(120,450,194,20,this.printForm.factoryButcherName); //生产单位
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(150,450,195,20,this.printForm.factoryButcherPointCode); //定点代码
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(180,460,195,20,this.printForm.factoryButcherRank); //企业等级
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(220,450,194,20,this.printForm.productionCode); //肉品编码
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(250,450,195,20,this.printForm.inspectorName); //检验员签章
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(85,640,195,20,this.printForm.productionQuantity); //产品数量
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(150,630,195,20,this.date_value); //生产日期
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.ADD_PRINT_TEXT(180,630,195,20,this.printForm.productionBuyer); //购货方
LODOP.SET_PRINT_STYLEA(0,"FontSize",14);//字体大小
LODOP.SET_PRINT_COPIES(this.printForm.quantity);//设置打印三份
// LODOP.ADD_PRINT_HTM(0, 0, "100%","100%", document.getElementById('AnimalApplyPrint').innerHTML);
LODOP.PRINT()
this.showPrintForm = false;
this.reload();
}else {
this.$message({
message: '请完善信息',
type: 'warning'
});
}
})
},
}
};
</script>
<style lang="less" scoped>
.el-col {
text-align: center;
border: 1px solid #ccc;
border-bottom: none;
border-right: none;
height: 40px;
line-height: 40px;
}
</style>