| New file |
| | |
| | | <script setup> |
| | | import request from "@/utils/request" |
| | | import {computed, onMounted, ref} from "vue" |
| | | import PrintFoot from "@/components/sd/order/PrintFoot.vue" |
| | | import companyInfo from "@/stores/sd/companyInfo" |
| | | const company = companyInfo() |
| | | |
| | | |
| | | |
| | | let props = defineProps({ |
| | | orderId:null |
| | | }) |
| | | let data = ref({ |
| | | order:{ |
| | | processingNote:'' |
| | | }, |
| | | orderProductDetail:[] |
| | | }) |
| | | const grossNum = ref({ |
| | | quantity: 0, |
| | | grossArea: 0, |
| | | perimeter: 0 |
| | | }) |
| | | const getData = () => { |
| | | request.get(`/order/printOrderProductDetail/${props.orderId}`).then(res => { |
| | | data.value= res.data |
| | | data.value.orderProductDetail.forEach(item => { |
| | | grossNum.value.quantity += getQuantity(item.productDetail) |
| | | grossNum.value.grossArea += getArea(item.productDetail) |
| | | grossNum.value.perimeter += getPerimeter(item.productDetail) |
| | | stringToJson(item.productDetail) |
| | | }) |
| | | |
| | | grossNum.value.quantity = parseFloat(grossNum.value.quantity.toFixed(3)) |
| | | grossNum.value.grossArea = parseFloat(grossNum.value.grossArea.toFixed(3)) |
| | | grossNum.value.perimeter = parseFloat(grossNum.value.perimeter.toFixed(3)) |
| | | |
| | | }) |
| | | } |
| | | |
| | | onMounted(() => { |
| | | getData() |
| | | }) |
| | | |
| | | const stringToJson = (productList) => { |
| | | productList.forEach(item => { |
| | | item.otherColumns = JSON.parse(item.otherColumns) |
| | | }) |
| | | } |
| | | |
| | | const getQuantity = (productList) => { |
| | | let quantity = 0 |
| | | productList.forEach(item => { |
| | | quantity += item.quantity |
| | | }) |
| | | return parseFloat(quantity.toFixed(3)) |
| | | |
| | | } |
| | | |
| | | const getArea = (productList) => { |
| | | let area = 0 |
| | | productList.forEach(item => { |
| | | area += item.grossArea |
| | | }) |
| | | return parseFloat(area.toFixed(3)) |
| | | |
| | | } |
| | | |
| | | const getPerimeter = (productList) => { |
| | | let perimeter = 0 |
| | | productList.forEach(item => { |
| | | perimeter += item.perimeter |
| | | }) |
| | | return parseFloat(perimeter.toFixed(3)) |
| | | } |
| | | |
| | | const printSheet = () => { |
| | | } |
| | | |
| | | |
| | | |
| | | |
| | | defineExpose({ |
| | | printSheet |
| | | }); |
| | | </script> |
| | | |
| | | |
| | | <template> |
| | | <div id="sheet"> |
| | | <table > |
| | | <tr class="title-s"> |
| | | <th colspan="15"> |
| | | <img src="../../../assets/northGlass.ico" alt="" style="float: left;max-width: 60px;max-height: 60px"> |
| | | <h1> |
| | | {{company.companyName}} |
| | | </h1> |
| | | </th> |
| | | </tr> |
| | | |
| | | <tr class="title-s"> |
| | | <th colspan="5">地址:{{company.address}}</th> |
| | | <th colspan="5">电话:{{ company.telephone }}</th> |
| | | <th colspan="5">传真:{{ company.fax }}</th> |
| | | </tr> |
| | | <!-- <tr class="title-s">--> |
| | | <!-- <th colspan="13">--> |
| | | <!-- <hr>--> |
| | | <!-- <hr class="hr-border">--> |
| | | <!-- </th>--> |
| | | <!-- </tr>--> |
| | | |
| | | <tr class="title-s"> |
| | | <th colspan="15"> |
| | | <h3>玻璃加工单</h3> |
| | | </th> |
| | | |
| | | </tr> |
| | | |
| | | <tr> |
| | | <th class="title-1">客户名称</th> |
| | | <th colspan="7">{{data.order.customerName}}</th> |
| | | <th class="title-1">工程名称</th> |
| | | <th colspan="6">{{data.order.project}}</th> |
| | | </tr> |
| | | <tr> |
| | | <th class="title-1">生产单号</th> |
| | | <th colspan="2">{{data.order.orderId}}</th> |
| | | <th class="title-1">下单日期</th> |
| | | <th colspan="2">{{data.order.createTime}}</th> |
| | | <th class="title-1">订单类型</th> |
| | | <th colspan="4">{{data.order.orderType}}</th> |
| | | <th class="title-1">跟单员</th> |
| | | <th colspan="3">{{data.order.salesman}}</th> |
| | | </tr> |
| | | <tr> |
| | | <th>磨边</th> |
| | | <th colspan="2">{{data.order.otherRemarks}}</th> |
| | | <th>完工日期</th> |
| | | <th colspan="2">{{data.order.deliveryDate}}</th> |
| | | <th>商标</th> |
| | | <th colspan="4">{{data.order.icon}}</th> |
| | | <th>包装</th> |
| | | <th colspan="5">{{data.order.packType}}</th> |
| | | </tr> |
| | | |
| | | |
| | | |
| | | |
| | | <tr> |
| | | <th>序号</th> |
| | | <th class="title-1">{{company.columnName}}</th> |
| | | <th>彩釉图号</th> |
| | | <th>编号</th> |
| | | <th>规格(宽W*高H)</th> |
| | | <th>片数</th> |
| | | <th>面积</th> |
| | | <th>延米</th> |
| | | <th>楼号</th> |
| | | <th>加工要求</th> |
| | | <th>备注</th> |
| | | <th>备注1</th> |
| | | <th>备注2</th> |
| | | <th>备注3</th> |
| | | <th>备注4</th> |
| | | </tr> |
| | | <tbody v-for="(item,index) in data.orderProductDetail" :key="index"> |
| | | <tr> |
| | | <td class="no-change-row">品 种</td> |
| | | <td colspan="10">{{item.productName}}</td> |
| | | <td class="no-change-row">产品描述</td> |
| | | <td colspan="3"></td> |
| | | </tr> |
| | | <tr v-for="(item1,index1) in item.productDetail" :key="index1"> |
| | | <td>{{item1.orderNumber}}</td> |
| | | <td>{{ item1.otherColumns?.S02}}</td> |
| | | <td>{{ item1.otherColumns?.S03}}</td> |
| | | <td class="notChangeRow">{{ item1.otherColumns?.S01}}</td> |
| | | <td>{{item1.width +'*'+item1.height}}</td> |
| | | <td>{{item1.quantity}}</td> |
| | | <td>{{item1.grossArea}}</td> |
| | | <td>{{item1.perimeter}}</td> |
| | | <td>{{item1.buildingNumber}}</td> |
| | | <td>{{item1.processingNote}}</td> |
| | | <td>{{item1.remarks}}</td> |
| | | |
| | | <td> |
| | | {{ ((item1.otherColumns?.S04)?item1.otherColumns.S04:'')}} |
| | | </td> |
| | | <td>{{((item1.otherColumns?.S05)?item1.otherColumns.S05:'')}}</td> |
| | | <td>{{((item1.otherColumns?.S06)?item1.otherColumns.S06:'')}}</td> |
| | | <td>{{((item1.otherColumns?.S07)?item1.otherColumns.S07:'')}}</td> |
| | | </tr> |
| | | |
| | | <tr> |
| | | <td colspan="5">小计</td> |
| | | <td>{{getQuantity(item.productDetail)}}</td> |
| | | <td>{{getArea(item.productDetail)}}</td> |
| | | <td>{{getPerimeter(item.productDetail)}}</td> |
| | | <td colspan="7"></td> |
| | | </tr> |
| | | |
| | | |
| | | </tbody> |
| | | <tr> |
| | | <td colspan="5">总计</td> |
| | | <td>{{grossNum.quantity}}</td> |
| | | <td>{{grossNum.grossArea}}</td> |
| | | <td>{{grossNum.perimeter}}</td> |
| | | <td colspan="7"></td> |
| | | </tr> |
| | | <tr> |
| | | <td colspan="15" style="white-space: pre-wrap;text-align:left "> |
| | | <template v-for="(item,index) in data.order.processingNote.split('\n')"> |
| | | {{item}} |
| | | <br> |
| | | </template> |
| | | <!-- <el-input--> |
| | | <!-- v-model="data.order.processingNote"--> |
| | | <!-- :rows="2"--> |
| | | <!-- type="textarea"--> |
| | | <!-- placeholder=""--> |
| | | <!-- readonly--> |
| | | <!-- autosize--> |
| | | <!-- resize="none"--> |
| | | |
| | | <!-- />--> |
| | | </td> |
| | | </tr> |
| | | </table> |
| | | <print-foot :order='data.order' /> |
| | | </div> |
| | | </template> |
| | | |
| | | <style scoped> |
| | | #sheet{ |
| | | text-align: center; |
| | | } |
| | | h1,h3{ |
| | | left:0; |
| | | right:0; |
| | | top:0; |
| | | bottom:0; |
| | | margin:auto; |
| | | } |
| | | h1{ |
| | | font-size: 1.5rem; |
| | | } |
| | | h3{ |
| | | font-size: 1.2rem; |
| | | font-weight: bolder; |
| | | } |
| | | |
| | | |
| | | table{ |
| | | border-collapse: collapse; |
| | | width: 100%; |
| | | text-align: center; |
| | | } |
| | | tr,td,th{ |
| | | border: 1px solid black; |
| | | } |
| | | |
| | | th,.no-change-row { |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | .title-1{ |
| | | width: 76px; |
| | | } |
| | | .title-s,.title-s th{ |
| | | border:0 |
| | | } |
| | | |
| | | .hr-border{ |
| | | height: 2px; |
| | | width: 100%; |
| | | background-color: black; |
| | | color: black; |
| | | } |
| | | .notChangeRow{ |
| | | white-space: nowrap; |
| | | } |
| | | |
| | | |
| | | </style> |