60.ZBL指令生成，可下载
1 <template> 2 <div> 3 <el-card style="height:80px;font-size: 30px;">OBA RM LABEL 列印指令生成</el-card> 4 <el-card> 5 <el-form :inline="true" style="align-items: center;display: flex;"> 6 <el-form-item label="开始序号【年份+日期+0000】"> 7 <el-input placeholder="请输入序号八位如：23080000" type="number" v-model="startValue" @input="handleInput1"></el-input> 8 </el-form-item> 9 <el-form-item label="打印数量"> 10 <el-input placeholder="请输入打印数量,1~1000" type="number" v-model="endValue" @input="handleInput2"></el-input> 11 </el-form-item> 12 <el-form-item> 13 <el-button type="primary" @click="printLabel">生成</el-button> 14 <el-button type="success" @click="clear">清空</el-button> 15 <el-button type="success" @click="download">下载</el-button> 16 </el-form-item> 17 </el-form> 18 </el-card> 19 <el-card> 20 <el-input type="textarea" placeholder="指令生成" rows="15" :readonly="true" v-model="textareaZBLS"></el-input> 21 </el-card> 22 </div> 23 </template> 24 25 <script setup lang="ts"> 26 import { ref } from 'vue'; 27 import { ElMessage } from 'element-plus'; 28 29 const startValue = ref<number | undefined>() 30 const endValue = ref<number | undefined>() 31 const zbl = ref('') 32 const textareaZBLS = ref() 33 const zbls = ref<string[]>([]) 34 zbl.value = '^XA^FO158,170^A@N,35,33,MYRIAD_SET_BOLD_.FNT^FDRM0' + 23080000 + '^FS ^FO185,35^BXN,8,400,,,^FDRM0' + 23080000 + '^FS^PQ1^XZ' 35 36 const printLabel = () => { 37 console.log('我点击了打印按钮') 38 zbls.value = [] 39 textareaZBLS.value = '' 40 // console.log(startValue.value) 41 // console.log(endValue.value) 42 if (endValue.value && startValue.value) { 43 if (startValue.value < 10000000 || startValue.value >= 100000000) { 44 ElMessage({ 45 type: 'error', 46 message: '开始序号需要八位数，10000000~100000000之间！！！' 47 }); 48 return 49 } 50 if (endValue.value < 1 || endValue.value > 1000) { 51 ElMessage({ 52 type: 'error', 53 message: '打印数量必须1~1000！！！' 54 }); 55 return 56 } 57 for (let i = 0; i < endValue.value; i++) { 58 startValue.value++ 59 // console.log(startValue.value) 60 zbl.value = '^XA^FO158,170^A@N,35,33,MYRIAD_SET_BOLD_.FNT^FDRM0' + startValue.value + '^FS ^FO185,35^BXN,8,400,,,^FDRM0' + startValue.value + '^FS^PQ1^XZ' 61 // console.log(zbl.value) 62 zbls.value.push(zbl.value) 63 } 64 65 const content = zbls.value.join('\n'); // 使用换行符连接数组元素 66 textareaZBLS.value = content //生成的指令再页面中显示 67 68 // console.log(zbls.value) 69 } else { 70 ElMessage({ 71 type: 'error', 72 message: '开始序号和打印数量必需填写！！！' 73 }); 74 } 75 } 76 77 //清空指令 78 const clear = () => { 79 textareaZBLS.value = '' 80 startValue.value = undefined 81 } 82 83 //下载指令 84 const download = () => { 85 const content = zbls.value.join('\n'); 86 const element = document.createElement('a'); 87 const file = new Blob([content], { type: 'text/plain' }); 88 element.href = URL.createObjectURL(file); 89 element.download = 'output.txt'; 90 document.body.appendChild(element); 91 element.click(); 92 document.body.removeChild(element); 93 } 94 //输入监听 95 const handleInput1=(e:any)=>{ 96 // console.log(e.length) 97 if(e.length>8){ 98 startValue.value=e.slice(0,8); 99 } 100 // console.log(startValue.value) 101 } 102 const handleInput2=(e:any)=>{ 103 // console.log(e.length) 104 if(e.length>4){ 105 endValue.value=e.slice(0,4); 106 } 107 // console.log(startValue.value) 108 } 109 </script>
效果如下：
