模板修改中文修改
This commit is contained in:
Cc
parent
573c35c881
commit
ab81562fdd
|
|
@ -53,6 +53,7 @@
|
|||
"jsencrypt": "^3.2.0",
|
||||
"lodash": "^4.17.21",
|
||||
"mockjs": "^1.1.0",
|
||||
"node-ssh": "^13.2.0",
|
||||
"nprogress": "^0.2.0",
|
||||
"qrcode": "^1.5.4",
|
||||
"qs": "^6.10.1",
|
||||
|
|
|
|||
Binary file not shown.
|
Before Width: | Height: | Size: 460 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 175 KiB After Width: | Height: | Size: 116 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 105 KiB |
|
|
@ -96,47 +96,47 @@
|
|||
@current-change="handleCurrentChange"
|
||||
@size-change="handleSizeChange"
|
||||
></el-pagination>
|
||||
|
||||
<el-dialog
|
||||
v-model="dialogFormVisible"
|
||||
:title="title"
|
||||
width="50%"
|
||||
@close="close"
|
||||
>
|
||||
<el-tabs>
|
||||
<el-tab-pane label="基本信息" v-if="dialogFormVisible">
|
||||
<info :data="data.basicInfo" keyName="basicInfo"></info>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="客户信息" name="second">
|
||||
<info :data="data.customerInfo" keyName="customerInfo"></info>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="财务信息" name="third">
|
||||
<info :data="data.financialInfo" keyName="financialInfo"></info>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="物流信息" name="fourth">暂无物流信息</el-tab-pane>
|
||||
</el-tabs>
|
||||
<div class="dialog-footer"></div>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-model="dialogqrcodeVisible"
|
||||
title="二维码信息"
|
||||
width="50%"
|
||||
@close="close"
|
||||
>
|
||||
<qcode v-if="dialogqrcodeVisible" :url="codeUrl" :id="codeId"></qcode>
|
||||
|
||||
<el-descriptions :column="3" border>
|
||||
<el-descriptions-item
|
||||
:label="item.attributeName"
|
||||
v-for="(item, index) in qrinfoData"
|
||||
>
|
||||
{{ item.attributeValue }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
<div class="dialog-footer"></div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
|
||||
<el-dialog
|
||||
v-model="dialogFormVisible"
|
||||
:title="title"
|
||||
width="50%"
|
||||
@close="close"
|
||||
>
|
||||
<el-tabs>
|
||||
<el-tab-pane label="基本信息" v-if="dialogFormVisible">
|
||||
<info :data="data.basicInfo" keyName="basicInfo"></info>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="客户信息" name="second">
|
||||
<info :data="data.customerInfo" keyName="customerInfo"></info>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="财务信息" name="third">
|
||||
<info :data="data.financialInfo" keyName="financialInfo"></info>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="物流信息" name="fourth">暂无物流信息</el-tab-pane>
|
||||
</el-tabs>
|
||||
<div class="dialog-footer"></div>
|
||||
</el-dialog>
|
||||
<el-dialog
|
||||
v-model="dialogqrcodeVisible"
|
||||
title="二维码信息"
|
||||
width="50%"
|
||||
@close="close"
|
||||
>
|
||||
<qcode :url="codeUrl"></qcode>
|
||||
|
||||
<el-descriptions :column="3" border>
|
||||
<el-descriptions-item
|
||||
:label="item.attributeName"
|
||||
v-for="(item, index) in qrinfoData"
|
||||
>
|
||||
{{ item.attributeValue }}
|
||||
</el-descriptions-item>
|
||||
</el-descriptions>
|
||||
|
||||
<div class="dialog-footer"></div>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
|
@ -159,6 +159,7 @@ export default {
|
|||
|
||||
layout: 'total, sizes, prev, pager, next, jumper',
|
||||
total: 0,
|
||||
codeId: '',
|
||||
background: true,
|
||||
listLoading: true,
|
||||
dialogFormVisible: false,
|
||||
|
|
@ -226,6 +227,7 @@ export default {
|
|||
this.listLoading = false;
|
||||
}, 500);
|
||||
},
|
||||
close() {},
|
||||
getFormatData(time) {
|
||||
return getDate(time);
|
||||
},
|
||||
|
|
@ -236,6 +238,7 @@ export default {
|
|||
let code = 'C0200053'; // row.materialCode
|
||||
productAttribute(code).then(res => {
|
||||
this.dialogqrcodeVisible = true;
|
||||
this.codeId = row.billNo;
|
||||
this.codeUrl = 'http://sm.lidinghb.com?materialCode=' + code;
|
||||
this.qrinfoData = res.data;
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,48 +1,21 @@
|
|||
<template>
|
||||
<el-button
|
||||
type="primary"
|
||||
style="display: block; margin-left: 40px"
|
||||
ref="printButton"
|
||||
v-print="'#printCanvas'"
|
||||
>
|
||||
打印
|
||||
</el-button>
|
||||
<div>
|
||||
<el-button
|
||||
type="primary"
|
||||
style="display: block; margin-left: 40px"
|
||||
ref="printButton"
|
||||
v-print="'#printCanvas'"
|
||||
>
|
||||
打印
|
||||
</el-button>
|
||||
|
||||
<div id="printCanvas" class="container">
|
||||
<img src="@/assets/mb.jpg" />
|
||||
<div class="equipment">HS CODE 8421219990</div>
|
||||
<div class="date">2023-02-17</div>
|
||||
<img :src="qcodeImg" class="qrcodeimg" ass />
|
||||
<!--
|
||||
<div class="containerTable">
|
||||
<div class="flexCss">
|
||||
<div class="flexleft">
|
||||
<p>Li Ding</p>
|
||||
<p>Environmenta</p>
|
||||
</div>
|
||||
<div>
|
||||
<p>力鼎清道夫</p>
|
||||
<p>LD Household Sewage Treatment Plant (STP)</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="item">出厂日期(Date):</div>
|
||||
<div class="item">
|
||||
产地(Place of production): 江苏 南通 Nantong City, China
|
||||
</div>
|
||||
<div class="item">设备编码(Equipment code):</div>
|
||||
<div class="footer">
|
||||
<div class="footerLeft">
|
||||
<p>江苏力鼎环保装备有限公司</p>
|
||||
<p class="smallsize">
|
||||
Jiangsu LiDing Environmental Protection Equipment Co., Ltd.
|
||||
</p>
|
||||
<p>E-mail:liding@lidinghb.com Tel: +86 4006-828-666</p>
|
||||
</div>
|
||||
<div></div>
|
||||
</div>
|
||||
<div id="printCanvas" class="container">
|
||||
<img src="@/assets/mb.png" />
|
||||
|
||||
<div class="date">{{ currentDate }}</div>
|
||||
<img :src="qcodeImg" class="qrcodeimg" ass />
|
||||
<div class="qrcodeSn">{{ sn }}</div>
|
||||
</div>
|
||||
-->
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
|
|
@ -53,64 +26,27 @@ const canvasref = ref(null);
|
|||
|
||||
const qcodeImg = ref();
|
||||
|
||||
const props = defineProps(['url']);
|
||||
const props = defineProps(['url', 'id']);
|
||||
console.log(props.url);
|
||||
|
||||
const sn = ref(props.id);
|
||||
const printButton = ref(null);
|
||||
const printObj = ref({
|
||||
id: 'printMe', // 这里是要打印元素的ID
|
||||
// url:'https://www.baidu.com/',
|
||||
popTitle: '打印表单', // 打印的标题
|
||||
// extraCss: "https://cdn.bootcdn.net/ajax/libs/animate.css/4.1.1/animate.compat.css, https://cdn.bootcdn.net/ajax/libs/hover.css/2.3.1/css/hover-min.css", // 打印可引入外部的一个 css 文件
|
||||
// extraHead: '<meta http-equiv="Content-Language"content="zh-cn"/>', // 打印头部文字
|
||||
// preview: true, // 是否启动预览模式，默认是false
|
||||
previewTitle: '打印客户账单', // 打印预览的标题
|
||||
previewPrintBtnLabel: '预览结束，开始打印', // 打印预览的标题下方的按钮文本，点击可进入打印
|
||||
zIndex: 20003, // 预览窗口的z-index，默认是20002，最好比默认值更高
|
||||
previewBeforeOpenCallback() {
|
||||
console.log('正在加载预览窗口！');
|
||||
}, // 预览窗口打开之前的callback
|
||||
previewOpenCallback() {
|
||||
console.log('已经加载完预览窗口，预览打开了！');
|
||||
}, // 预览窗口打开时的callback
|
||||
beforeOpenCallback(vue) {
|
||||
vue.printLoading = true;
|
||||
console.log('开始打印之前！');
|
||||
}, // 开始打印之前的callback
|
||||
openCallback(vue) {
|
||||
vue.printLoading = false;
|
||||
console.log('监听到了打印窗户弹起了！');
|
||||
}, // 调用打印时的callback
|
||||
closeCallback() {
|
||||
console.log('关闭了打印工具！');
|
||||
}, // 关闭打印的callback(点击弹窗的取消和打印按钮都会触发)
|
||||
clickMounted() {
|
||||
console.log('点击v-print绑定的按钮了！');
|
||||
},
|
||||
});
|
||||
|
||||
function printCanvas() {
|
||||
debugger;
|
||||
|
||||
const img = canvasref.value.toDataURL('image/png');
|
||||
|
||||
// 创建一个新的Image对象
|
||||
const printImage = new Image();
|
||||
|
||||
// 等待图片加载完成后再进行打印
|
||||
printImage.onload = () => {};
|
||||
|
||||
// 设置图片源为canvas转换的DataURL
|
||||
printImage.src = img;
|
||||
const currentDate = ref('');
|
||||
function getCurrentDate() {
|
||||
const date = new Date();
|
||||
const year = date.getFullYear();
|
||||
const month = String(date.getMonth() + 1).padStart(2, '0');
|
||||
const day = String(date.getDate()).padStart(2, '0');
|
||||
currentDate.value = `${year}-${month}-${day}`;
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
QRCode.toDataURL(props.url, (error, url) => {
|
||||
debugger;
|
||||
if (url) {
|
||||
qcodeImg.value = url;
|
||||
}
|
||||
if (error) console.error(error);
|
||||
});
|
||||
getCurrentDate(); // 获取当前日期
|
||||
});
|
||||
</script>
|
||||
<style second>
|
||||
|
|
@ -122,11 +58,18 @@ onMounted(() => {
|
|||
width: 100%;
|
||||
}
|
||||
.qrcodeimg {
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
width: 110px;
|
||||
height: 110px;
|
||||
position: absolute;
|
||||
bottom: 49px;
|
||||
right: 49px;
|
||||
bottom: 73px;
|
||||
right: 50px;
|
||||
}
|
||||
.qrcodeSn {
|
||||
position: absolute;
|
||||
bottom: 54px;
|
||||
right: 59px;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
}
|
||||
.equipment {
|
||||
position: absolute;
|
||||
|
|
@ -146,39 +89,6 @@ onMounted(() => {
|
|||
color: #000;
|
||||
}
|
||||
}
|
||||
.containerTable {
|
||||
width: 500px;
|
||||
border: 1px solid #000;
|
||||
background: #ccc;
|
||||
color: #000;
|
||||
position: relative;
|
||||
.item {
|
||||
border-top: 1px solid #000;
|
||||
padding-left: 10px;
|
||||
height: 50px;
|
||||
line-height: 50px;
|
||||
}
|
||||
|
||||
.flexCss {
|
||||
text-align: center;
|
||||
display: flex;
|
||||
.flexleft {
|
||||
width: 30%;
|
||||
border-right: 1px solid #000;
|
||||
}
|
||||
}
|
||||
.footer {
|
||||
border-top: 1px solid #000;
|
||||
display: flex;
|
||||
.footerLeft {
|
||||
width: 70%;
|
||||
text-align: center;
|
||||
.smallsize {
|
||||
font-size: 12px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style scoped>
|
||||
@media print {
|
||||
|
|
@ -226,11 +136,20 @@ onMounted(() => {
|
|||
}
|
||||
|
||||
.qrcodeimg {
|
||||
width: 8mm;
|
||||
height: 8mm;
|
||||
width: 12mm;
|
||||
height: 12mm;
|
||||
position: absolute;
|
||||
bottom: 14px;
|
||||
bottom: 20px;
|
||||
right: 3mm;
|
||||
}
|
||||
|
||||
.qrcodeSn {
|
||||
position: absolute;
|
||||
bottom: 13px;
|
||||
right: 4mm;
|
||||
font-size: 4pt;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.containerTable {
|
||||
|
|
|
|||
|
|
@ -95,17 +95,17 @@
|
|||
</div>
|
||||
<div class="site-bottom-base">
|
||||
<div class="record-right-base">
|
||||
<text class="h1-head-base">远程控制</text>
|
||||
<text class="h1-head-base">指令汇总</text>
|
||||
</div>
|
||||
<div class="list-right-base">
|
||||
<el-tabs v-model="activeDataName" @tab-click="handleDataClick">
|
||||
<el-tab-pane label="可读" name="data-first">
|
||||
<el-tab-pane label="全部指令" name="data-first">
|
||||
<readable-index
|
||||
ref="readable"
|
||||
:deviceCode="queryForm.deviceCode"
|
||||
></readable-index>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="只写" name="data-second">
|
||||
<el-tab-pane label="下发控制" name="data-second">
|
||||
<only-index
|
||||
ref="only"
|
||||
:deviceCode="queryForm.deviceCode"
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
<el-table-column label="操作" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-button
|
||||
v-if="row.readWrite == '只写' && isBtnPerm('/deviceSensor/write')"
|
||||
v-if="row.readWrite == '读写' && isBtnPerm('/deviceSensor/write')"
|
||||
type="text"
|
||||
@click="distribute(row)"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -23,15 +23,7 @@
|
|||
</el-table-column>
|
||||
<el-table-column prop="unit" label="单位" align="center"></el-table-column>
|
||||
<el-table-column label="操作" align="center">
|
||||
<template #default="{ row }">
|
||||
<el-button
|
||||
v-if="row.readWrite == '读写' && isBtnPerm('/deviceSensor/write')"
|
||||
type="text"
|
||||
@click="distribute(row)"
|
||||
>
|
||||
下发指令
|
||||
</el-button>
|
||||
</template>
|
||||
<template #default="{ row }"></template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
|
|
|
|||
Loading…
Reference in New Issue