| New file |
| | |
| | | <script setup> |
| | | import request from "@/utils/request" |
| | | import {ElDatePicker, ElMessage} from "element-plus" |
| | | import {nextTick, onMounted, onUnmounted, reactive, ref, watch} from "vue" |
| | | import {Search} from "@element-plus/icons-vue" |
| | | import {useRouter} from 'vue-router' |
| | | import {changeFilterEvent, filterChanged} from "@/hook" |
| | | import {useI18n} from 'vue-i18n' |
| | | import deepClone from "@/utils/deepClone"; |
| | | import companyInfo from "@/stores/sd/companyInfo" |
| | | |
| | | const company = companyInfo() |
| | | //语言获取 |
| | | const {t} = useI18n() |
| | | let router = useRouter() |
| | | let produceList = ref([]) |
| | | let labelList = ref([]) |
| | | let titleList = ref([]) |
| | | let dataList = ref([]) |
| | | let list = ref([]) |
| | | let lastList = ref([]) |
| | | |
| | | let filterData = ref({}) |
| | | |
| | | const data = ref({ |
| | | printList: [] |
| | | }) |
| | | |
| | | let props = defineProps({ |
| | | list:null,//勾选的数据 |
| | | faceOrientation:null,//内外面 |
| | | type:null,//标签模板 |
| | | lableType:null,//标签类型 |
| | | switch:null//判断是否为新打印 |
| | | }) |
| | | |
| | | const {currentRoute} = useRouter() |
| | | const route = currentRoute.value |
| | | let type = props.type |
| | | let faceOrientation = props.faceOrientation |
| | | if (type.indexOf("英文")>-1 && faceOrientation==="此面为室内面"){ |
| | | faceOrientation='INSIDE' |
| | | } |
| | | else if (type.indexOf("英文")>-1 && faceOrientation==="此面为室外面"){ |
| | | faceOrientation='OUTSIDE' |
| | | } |
| | | let lableType = props.lableType |
| | | data.value.printList = JSON.parse(props.list) |
| | | let switchType = props.switch |
| | | onMounted(() => { |
| | | request.post(`/processCard/getSelectPrintCustomLabel/${type}/${lableType}`, data.value).then((res) => { |
| | | if (res.code == 200) { |
| | | |
| | | produceList.value = deepClone(res.data.title) |
| | | list.value = deepClone(res.data.data) |
| | | const data = produceList.value[0].value |
| | | dataList = JSON.parse(`[${data}]`); |
| | | if (switchType===true){ |
| | | labelList = props.titleList |
| | | }else { |
| | | labelList = dataList[0] |
| | | } |
| | | for (let i = 0; i < list.value.length; i++) { |
| | | let count = list.value[i].data.length |
| | | for (let j = 0; j < count; j++) { |
| | | for (let k = 0; k < list.value[i].data[j].quantity; k++) { |
| | | lastList.value.push(list.value[i].data[j]) |
| | | } |
| | | } |
| | | } |
| | | } else { |
| | | ElMessage.warning(res.msg) |
| | | } |
| | | }) |
| | | |
| | | } |
| | | ) |
| | | |
| | | //修改相同产品名称标签 |
| | | const updateProductName = (event, index,id) => { |
| | | // 创建映射对象 |
| | | const propertyMapping = {}; |
| | | labelList.forEach(item => { |
| | | propertyMapping[item.name] = item.title; |
| | | }); |
| | | // 输入的值 |
| | | const newValue = event.target.innerText; |
| | | const parts = newValue.split(':'); |
| | | const result = parts[1]; // 获取冒号后的部分 |
| | | |
| | | // 获取映射中所有的键 |
| | | const keys = Object.keys(propertyMapping); |
| | | |
| | | // 根据 index 获取对应的属性名 |
| | | const propertyName = keys[index]; |
| | | |
| | | // 如果映射中没有该 index,直接返回 |
| | | if (!propertyName) { |
| | | console.warn('Unsupported index:', index); |
| | | return; |
| | | } |
| | | |
| | | // 遍历 lastList 并更新对应的属性 |
| | | lastList.value.forEach(obj => { |
| | | // 获取前缀和 orderId |
| | | const prefix = lastList.value[index].processId.substring(0, 11); |
| | | const orderId = obj.orderId; |
| | | const glassNumber=lastList.value[index].glassNumber |
| | | // 根据 propertyName 更新属性 |
| | | if (propertyName === 'productAbbreviation' && prefix === obj.processId.substring(0, 11)) { |
| | | obj.productAbbreviation = result; |
| | | } |
| | | |
| | | if (propertyName === 'project' && orderId === obj.orderId) { |
| | | obj.project = result; |
| | | } |
| | | if (propertyName === 'productName' && prefix === obj.processId.substring(0, 11)){ |
| | | obj.productName = result; |
| | | } |
| | | if (propertyName === 'customerName' && orderId === obj.orderId){ |
| | | obj.customerName = result; |
| | | } |
| | | }); |
| | | } |
| | | |
| | | </script> |
| | | |
| | | <template> |
| | | <div id="print" :class="company.printLabel.className.semi.printFlowCardName()"> |
| | | <div v-for="(item1,id) in lastList" :class="company.printLabel.className.semi.entiretyName()"> |
| | | <div class="row4">{{ faceOrientation }}</div> |
| | | <div v-for="(item,id) in labelList" :class="company.printLabel.className.semi.contentRowName()"> |
| | | <div contenteditable="true" v-if="item1[item.name] != null && item1[item.name] !== ''" class="row1" @input="updateProductName($event, id,index)">{{ item.title }}:{{ item1[item.name] }}</div> |
| | | <!-- <div v-if="item1[item.name] != null && item1[item.name] !== ''" class="row2">{{ item1[item.name] }}</div>--> |
| | | </div> |
| | | <div v-html="company.printLabel.customSemi(item1)"></div> |
| | | <div v-if="(id + 1) % 2 === 0" class="pagebreak"></div> |
| | | </div> |
| | | </div> |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | </template> |
| | | |
| | | <style scoped> |
| | | * { |
| | | margin: 0; |
| | | padding: 0; |
| | | } |
| | | |
| | | body{ |
| | | overflow: hidden; |
| | | font-family: Arial; |
| | | |
| | | } |
| | | |
| | | #printButton { |
| | | margin-top: -20px; |
| | | width: 100px; |
| | | } |
| | | |
| | | |
| | | |
| | | /*半*/ |
| | | .printFlowCard_semi { |
| | | flex-wrap: wrap; |
| | | font-size: 10px; |
| | | display: flex; |
| | | justify-content:space-between; |
| | | } |
| | | |
| | | |
| | | |
| | | /*半*/ |
| | | .entirety_semi { |
| | | width: 45%; |
| | | display: flex; |
| | | text-align: center; |
| | | flex-direction:column; |
| | | margin: 8px; |
| | | |
| | | } |
| | | |
| | | .row3{ |
| | | text-align: center; |
| | | } |
| | | |
| | | .contentRow{ |
| | | display: flex; |
| | | text-align: center; |
| | | } |
| | | |
| | | label{ |
| | | font-weight: bolder; |
| | | } |
| | | |
| | | .contentRow .row1{ |
| | | width: 100%; |
| | | } |
| | | |
| | | .entirety_semi .row4{ |
| | | text-align: right; |
| | | } |
| | | |
| | | .contentRow .row1,.contentRow .row2{ |
| | | text-align: left; |
| | | } |
| | | |
| | | |
| | | |
| | | @media print { |
| | | @page { |
| | | size: auto; /* auto is the initial value */ |
| | | margin: 13mm 5mm 0mm 7mm; /* this affects the margin in the printer settings */ |
| | | } |
| | | div { |
| | | page-break-inside: avoid; |
| | | } |
| | | |
| | | |
| | | |
| | | .pagebreak { |
| | | page-break-after: always; |
| | | } |
| | | |
| | | } |
| | | |
| | | .printFlowCard_semi1 { |
| | | flex-wrap: wrap; |
| | | font-size: 8pt; |
| | | display: flex; |
| | | } |
| | | |
| | | |
| | | /*成*/ |
| | | .entirety_semi1 { |
| | | width: 50%; |
| | | display: flex; |
| | | text-align: center; |
| | | flex-direction: column; |
| | | margin-left: -10px; |
| | | height: 80px; |
| | | |
| | | } |
| | | |
| | | .contentRow1 { |
| | | font-weight: bolder; |
| | | display: flex; |
| | | text-align: center; |
| | | width: 100%; |
| | | } |
| | | |
| | | .contentRow1 .row1 { |
| | | width: 30%; |
| | | font-weight: bolder; |
| | | } |
| | | |
| | | .entirety_finished1 .row4 { |
| | | font-weight: bolder; |
| | | text-align: right; |
| | | margin-right: 10px; |
| | | } |
| | | |
| | | .contentRow1 .row1, .contentRow1 .row2 { |
| | | text-align: left; |
| | | font-weight: bolder; |
| | | } |
| | | |
| | | </style> |