| | |
| | | <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 {ElMessage} from "element-plus" |
| | | import {onMounted, ref} from "vue" |
| | | // import {useRouter} from 'vue-router' |
| | | // import {changeFilterEvent, filterChanged} from "@/hook" |
| | | // import {useI18n} from 'vue-i18n' |
| | | // import deepClone from "@/utils/deepClone"; |
| | | import companyInfo from "@/lang/companyInfo" |
| | | |
| | | const company = companyInfo() |
| | | //语言获取 |
| | | const {t} = useI18n() |
| | |
| | | let dataList = ref([]) |
| | | let list = ref([]) |
| | | let lastList=ref([]) |
| | | |
| | | let filterData = ref({}) |
| | | |
| | | const data = ref({ |
| | | printList: [] |
| | | }) |
| | | |
| | | |
| | | // const {currentRoute} = useRouter() |
| | | // const route = currentRoute.value |
| | | // data.value.printList = JSON.parse(route.query.printList) |
| | |
| | | let props = defineProps({ |
| | | printFlowCardId: null, |
| | | printLayer: null, |
| | | printGlassId: null, |
| | | }) |
| | | |
| | | onMounted(async () => { |
| | | console.log(props.printFlowCardId,props.printLayer) |
| | | const response = await request.post('/unLoadGlass/downGlassInfo/downGlassLabelPrint',{ |
| | | flowCardId:props.printFlowCardId, |
| | | layer:props.printLayer |
| | | }); |
| | | const response = await request.post('/unLoadGlass/downGlassInfo/downGlassLabelPrint', { |
| | | flowCardId: props.printFlowCardId, |
| | | layer: props.printLayer, |
| | | glassId: props.printGlassId |
| | | }); |
| | | if (response.code == 200) { |
| | | console.log("lastList.value",response.data) |
| | | lastList.value=response.data; |
| | | |
| | | } else { |
| | | ElMessage.error(response.message); |
| | | } |
| | | |
| | | } |
| | | |
| | | ) |
| | | |
| | | |
| | | // // 打印方法 |
| | | // const printFlowCard = () => { |
| | | // // 需要打印的局部区域赋予"print-wrap"的id |
| | |
| | | // let doc = document; |
| | | // let body = doc.body || doc.getElementsByTagName("body")[0]; |
| | | // let printId = "print-" + Date.now(); |
| | | |
| | | // // 创建无副作用的打印容器(因不确定页面的打印元素有无其它样式) |
| | | // let content = doc.createElement("div"); |
| | | // content.id = printId; |
| | | |
| | | // // 样式控制与打印无关的元素隐藏 |
| | | // let style = doc.createElement("style"); |
| | | // style.innerHTML = |
| | |
| | | // }, 20); |
| | | // } |
| | | </script> |
| | | |
| | | <template> |
| | | <!-- <el-button id="printButton" @click="printFlowCard();">打印</el-button> --> |
| | | <div id="printFlowCard" > |
| | | <template v-for="(item,id) in lastList"> |
| | | <template v-for="(item,index) in lastList"> |
| | | <div id="entirety" > |
| | | <div style="position: absolute;font-weight: bold;margin-left: 5px;" v-if="item.tempering_layout_id!=null">{{ item.tempering_layout_id }}/{{ item.tempering_feed_sequence }}</div> |
| | | <div class="row1"> |
| | | <div style="position: absolute;font-weight: bold;margin-left: 5px;" v-if="item.tempering_layout_id!=null">{{ item.tempering_layout_id }}/{{ item.tempering_feed_sequence }}</div> |
| | | <span>{{ item.customer_name }}</span> |
| | | <span>{{ item.order_id }}</span> |
| | | <span v-if="item.process.includes('夹胶')">胶片</span> |
| | | <span v-else-if="item.process.includes('中空')">中空</span> |
| | | <span v-else-if="item.process.includes('百叶')">百叶</span> |
| | | <span v-else></span> |
| | | <div style="position: absolute;font-weight: bold;margin-left: 210px;margin-top: -26px;" >{{ index+1 }}</div> |
| | | </div> |
| | | <div class="row2"> |
| | | <span>{{ item.project }}</span> |
| | |
| | | <span>{{ item.processing_note }}</span> |
| | | </div> |
| | | </div> |
| | | <div style="width: 20px" v-if="id%2===0"></div> |
| | | <div style="width: 20px" v-if="index%2===0"></div> |
| | | <div class="print-page" v-else></div> |
| | | </template> |
| | | </div> |
| | | |
| | | </template> |
| | | |
| | | <style scoped> |
| | | * { |
| | | margin: 0; |
| | | padding: 0; |
| | | } |
| | | |
| | | #printButton { |
| | | /*margin-top: -20px;*/ |
| | | width: 100px; |
| | | } |
| | | |
| | | #printFlowCard { |
| | | display: flex; |
| | | justify-content: left; |
| | | flex-wrap: wrap; |
| | | width: 500px; |
| | | } |
| | | |
| | | #entirety{ |
| | | text-align: center; |
| | | width: 48%; |
| | | height: 160px; |
| | | width: 46%; |
| | | height: 170px; |
| | | border: black 1px; |
| | | word-wrap: break-word; |
| | | margin-left: 10px; |
| | | } |
| | | |
| | | .row1 { |
| | | font-size: 12pt; |
| | | font-weight: bold; |
| | |
| | | .row1 span { |
| | | font-size: 12pt; |
| | | } |
| | | |
| | | .row2 { |
| | | font-size: 14pt; |
| | | font-weight: bold; |
| | |
| | | font-size: 12pt; |
| | | font-weight: bold; |
| | | } |
| | | |
| | | .row3 { |
| | | margin-top: -5px; |
| | | height: 35px; |
| | |
| | | font-weight: bolder; |
| | | line-height: 35px; |
| | | } |
| | | |
| | | .row5 { |
| | | height: 50px; |
| | | font-weight: bold; |
| | | font-size: 12pt; |
| | | margin-left: 20px; |
| | | /* margin-left: 20px; */ |
| | | } |
| | | .row5 span { |
| | | font-size: 12pt; |
| | | } |
| | | |
| | | .row6 { |
| | | height: 15px; |
| | | font-weight: bold; |
| | | font-size: 8pt; |
| | | } |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | @media print { |
| | | .print-page { |
| | | page-break-after: always; /* 添加分页符,在每个print-page div之后分页 */ |
| | | } |
| | | div { |
| | | page-break-inside: avoid; |
| | | } |
| | | @page { |
| | | size: auto; /* auto is the initial value */ |
| | | margin: 2mm 2mm 2mm 2mm; /* this affects the margin in the printer settings */ |
| | | |
| | | } |
| | | } |
| | | |
| | | </style> |