廖井涛
8 小时以前 f7a2fcdda7f1120498c5c5f75c5a99955fc54b43
north-glass-erp/northglass-erp/src/components/sd/order/PrintSheet4.vue
@@ -1,4 +1,5 @@
<script setup>
/*生产加工单竖版*/
import request from "@/utils/request"
import {computed, onMounted, ref} from "vue"
import PrintFoot from "@/components/sd/order/PrintFoot.vue"
@@ -6,14 +7,18 @@
import deepClone from "@/utils/deepClone";
import {ElMessage} from "element-plus";
import useUserInfoStore from "@/stores/userInfo";
import {Bottom, Burger, Food} from "@element-plus/icons-vue";
const company = companyInfo()
const userStore = useUserInfoStore()
const username = userStore.user.userName
let dialogVisible = ref(false)
let props = defineProps({
  orderId:null
  orderId:null,
})
let productId=ref({
})
let data = ref({
  order:{
@@ -21,27 +26,63 @@
  },
  orderProductDetail:[]
})
let productIdData = ref({
})
const selectedValues = ref([])
const grossNum = ref({
  quantity: 0,
  grossArea: 0,
  perimeter: 0
  perimeter: 0,
  weight:0
})
const getData = () => {
  request.get(`/order/printOrderProductDetail/${props.orderId}`).then(res => {
    console.log(res.data)
  request.get(`/order/printOrderProductDetail/${props.orderId}/${selectedValues.value}`).then(res => {
    data.value= res.data
    productIdData.value=data.value.orderProductDetail
    data.value.orderProductDetail.forEach(item => {
      grossNum.value.quantity += getQuantity(item.productDetail)
      grossNum.value.grossArea += getArea(item.productDetail)
      grossNum.value.perimeter += getPerimeter(item.productDetail)
      grossNum.value.weight += getWeight(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.quantity = parseFloat(grossNum.value.quantity.toFixed(2))
    grossNum.value.grossArea = parseFloat(grossNum.value.grossArea.toFixed(2))
    grossNum.value.perimeter = parseFloat(grossNum.value.perimeter.toFixed(3))
    grossNum.value.weight = parseFloat(grossNum.value.weight.toFixed(2))
  })
}
const handleChange = () => {
  request.get(`/order/printOrderProductDetail/${props.orderId}/${selectedValues.value}`).then(res => {
    grossNum.value.quantity=0
    grossNum.value.grossArea=0
    grossNum.value.perimeter=0
    grossNum.value.weight=0
    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)
      grossNum.value.weight += getWeight(item.productDetail)
      stringToJson(item.productDetail)
    })
    grossNum.value.quantity = parseFloat(grossNum.value.quantity.toFixed(2))
    grossNum.value.grossArea = parseFloat(grossNum.value.grossArea.toFixed(2))
    grossNum.value.perimeter = parseFloat(grossNum.value.perimeter.toFixed(3))
    grossNum.value.weight = parseFloat(grossNum.value.weight.toFixed(2))
  })
}
const handleDoubleClick = () => {
  dialogVisible.value=true
}
onMounted(() => {
@@ -59,7 +100,7 @@
  productList.forEach(item => {
    quantity += item.quantity
  })
  return parseFloat(quantity.toFixed(3))
  return parseFloat(quantity.toFixed(2))
}
@@ -68,7 +109,7 @@
  productList.forEach(item => {
    area += item.grossArea
  })
  return parseFloat(area.toFixed(3))
  return parseFloat(area.toFixed(2))
}
@@ -79,6 +120,15 @@
  })
  return parseFloat(perimeter.toFixed(3))
}
const getWeight = (productList) => {
  let weight = 0
  productList.forEach(item => {
    weight += item.weight*item.quantity
  })
  return parseFloat(weight.toFixed(2))
}
const printSheet = () => {
}
@@ -93,11 +143,12 @@
<template>
  <div id="sheet">
    <table border="1" >
  <div id="sheet" @dblclick="handleDoubleClick" >
    <table style="border-style: none;" >
      <thead>
      <tr class="title-s">
        <th colspan="13">
        <th colspan="9">
          <h1>
            {{ company.companyName }}
          </h1>
@@ -105,82 +156,141 @@
      </tr>
      <tr class="title-s">
        <th colspan="2"></th>
        <th colspan="5">
          <h3>生成任务单(成品)</h3>
        <th colspan="2" style="width: 30%;text-align: left;"><span>总重量:{{ grossNum.weight }}</span></th>
        <th colspan="5" style="width: 40%;">
          <h3 >生产任务单({{data.order.orderType}})</h3>
        </th>
        <th colspan="2" style="text-align: left;font-weight: bold;">订单编号:<span>{{ data.order.orderId }}</span></th>
        <th colspan="2" style="width: 30%;">订单编号:<span>{{ data.order.orderId }}</span>
          <span v-if="company.companyName==='常州市吉利玻璃有限公司'&& data.order.batch!==''">(原{{ data.order.batch }})</span>
        </th>
      </tr>
      <tr>
        <th style="text-align: left;border:none;font-weight: bold;" colspan="4">
        <th style="text-align: left;border:none;font-weight: bold;font-size: 17px;" colspan="4">
          客户名称:<span>{{ data.order.customerName }}</span></th>
        <th style="text-align: left;border:none;font-weight: bold;" colspan="3">
        <th style="text-align: left;border:none;font-weight: bold;font-size: 17px;" v-if="data.order.batch!==''" colspan="3">
          项目名称:<span>{{ data.order.project }}({{data.order.batch}})</span></th>
        <th style="text-align: left;border:none;font-weight: bold;font-size: 17px;" v-else colspan="3">
          项目名称:<span>{{ data.order.project }}</span></th>
        <th style="text-align: left;border:none;font-weight: bold;" colspan="2">
        <th style="text-align: left;border:none;font-weight: bold;font-size: 17px;" colspan="2">
          发货日期:<span>{{ data.order.deliveryDate }}</span></th>
      </tr>
      <tr>
        <th style="text-align: left;border:none;font-weight: bold;" colspan="7">
        <th style="text-align: left;border:none;font-weight: bold;font-size: 17px;" colspan="7">
          送货地址:<span>{{ data.order.deliveryAddress }}</span></th>
        <th style="text-align: left;border:none;font-weight: bold;" colspan="2">
          联系电话:<span>{{ data.order.contactNumber }}</span></th>
        <th style="text-align: left;border:none;font-weight: bold;font-size: 17px;" colspan="2">
          联系电话:<span><input class="contactNumber" type="text" v-model="data.order.contactNumber"/></span></th>
      </tr>
      <tr>
        <th style="width: 6%;font-weight: bold;">序</th>
        <th style="width: 20%;font-weight: bold;">楼层编号</th>
        <th style="width: 20%;font-weight: bold;" colspan="2">宽X高</th>
        <th style="width: 10%;font-weight: bold;">数量</th>
        <th style="width: 10%;font-weight: bold;">面积</th>
        <th style="width: 12%;font-weight: bold;" colspan="2">加工要求</th>
      </tr>
      </thead>
      <template v-for="(item, index) in data.orderProductDetail" :key="index" >
        <tr>
          <td style="font-size: 15px;font-weight: bold;text-align: left" colspan="8">产品名称:<span>{{item.productName}}</span></td>
        </tr>
      <tr style="border-style: none">
        <td colspan="9" style="border-style: none">
          <table style="border-style: none;width: 100%;height: 100%">
            <template v-for="(item, index) in data.orderProductDetail" :key="index" >
              <thead>
              <tr v-if="index===0">
                <th style="width: 6%;font-weight: bold;">序</th>
                <th style="width: 15%;font-weight: bold;" >楼层编号</th>
                <th style="width: 20%;font-weight: bold;" colspan="3">宽X高</th>
                <th style="width: 8%;font-weight: bold;">数量</th>
                <th style="width: 8%;font-weight: bold;">周长</th>
                <th style="width: 12%;font-weight: bold;">面积</th>
                <th style="width: 22%;font-weight: bold;" colspan="2">加工要求/备注</th>
              </tr>
        <tr class="day-in" v-for="(items, index1) in item.productDetail" :key="index1">
          <td>{{items.orderNumber}}</td>
          <td>{{items.buildingNumber}}</td>
          <td colspan="2" style="font-size: 15px;font-weight: bold;" v-if="items.otherColumns?.S02">{{items.otherColumns?.S02}}</td>
          <td colspan="2" style="font-size: 15px;font-weight: bold;" v-else>{{items.width}}x{{items.height}}</td>
          <td>{{items.quantity}}</td>
          <td>{{items.grossArea}}</td>
          <td colspan="2">{{items.processingNote}}</td>
        </tr>
        <tr class="day-in" >
          <td style="font-size: 15px;font-weight: bold;" colspan="4">小计:</td>
          <td>{{getQuantity(item.productDetail)}}</td>
          <td>{{getArea(item.productDetail)}}</td>
          <td colspan="2"></td>
        </tr>
      </template>
      <tr class="day-in">
        <td style="font-size: 15px;font-weight: bold;" colspan="4">合计:</td>
        <td>{{grossNum.quantity}}</td>
        <td>{{grossNum.grossArea}}</td>
        <td colspan="2"></td>
      </tr>
      <tr class="day-in">
        <td style="text-align: left;border-width: 0 0 0 0; border-style: solid; border-color: #d3dce6" colspan="9">
          <template v-for="(item,index) in data.order.processingNote.split('\n')">
            {{item}}
            <br>
          </template>
              </thead>
              <tr style="border-style: none">
                <td style="font-size: 15px;font-weight: bold;text-align: left" colspan="9">
                  产品名称:<span>{{item.productName}}</span>
                </td>
              </tr>
              <tr class="day-in" v-for="(items, index1) in item.productDetail" :key="index1">
                <td>{{items.orderNumber}}</td>
                <td>{{items.buildingNumber}}</td>
                <td colspan="3" style="font-size: 20px;font-weight: bold;" v-if="items.otherColumns?.S02&&company.companyName!='上海北玻玻璃技术工业有限公司'">{{items.otherColumns?.S02}}</td>
                <td colspan="3" style="font-size: 17px;white-space:nowrap;font-weight: bold;" v-else-if="items.differentSize===1 && items.bendRadius==null">
                  <template v-for="(orderGlassDetail, index1) in items.orderGlassDetails" >
                   ({{orderGlassDetail.childWidth}}x{{orderGlassDetail.childHeight}})
                  </template>
                </td>
                <td colspan="3" style="font-size: 20px;font-weight: bold;" v-else>{{items.width}}x{{items.height}}</td>
                <td style="font-size: 20px;font-weight: bold;">{{items.quantity}}</td>
                <td style="font-size: 20px;font-weight: bold;">{{items.perimeter}}</td>
                <td style="font-size: 20px;font-weight: bold;">{{items.grossArea.toFixed(2)}}</td>
                <td colspan="2">{{items.processingNote}}
                  {{items.remarks==null?'':'/'}}
                  {{items.remarks}}</td>
              </tr>
              <tr class="day-in" >
                <td style="font-size: 15px;font-weight: bold;" colspan="5">小计:</td>
                <td style="font-size: 20px;font-weight: bold;">{{getQuantity(item.productDetail)}}</td>
                <td style="font-size: 20px;font-weight: bold;">{{getPerimeter(item.productDetail)}}</td>
                <td style="font-size: 20px;font-weight: bold;">{{getArea(item.productDetail)}}</td>
                <td colspan="2"></td>
              </tr>
            </template>
            <tr class="day-in">
              <td style="font-size: 15px;font-weight: bold;" colspan="5">合计:</td>
              <td style="font-size: 20px;font-weight: bold;">{{grossNum.quantity}}</td>
              <td style="font-size: 20px;font-weight: bold;">{{grossNum.perimeter}}</td>
              <td style="font-size: 20px;font-weight: bold;">{{grossNum.grossArea}}</td>
              <td colspan="2"></td>
            </tr>
            <tr class="day-in">
              <td style="text-align: left;border-width: 0 0 0 0; border-style: solid; border-color: #d3dce6" colspan="9">
                <template v-for="(item,index) in data.order.processingNote.split('\n')">
                  {{item}}
                  <br>
                </template>
              </td>
            </tr>
            <tfoot style="border: 0">
            <!--      <el-row :gutter="24">
                    <el-col :span="4"><div style="font-size: 12px" class="bottom">制单员:{{data.order.creator}}<span style="font-size: 10px"></span></div></el-col>
                    <el-col :span="6"><div style="font-size: 12px" class="bottom">制单日期:{{data.order.createTime}}<span style="font-size: 10px"></span></div></el-col>
                    <el-col :span="4"><div style="font-size: 12px" class="bottom">审核员:{{data.order.verifier}}</div></el-col>
                    <el-col :span="6"><div style="font-size: 12px" class="bottom">审核日期:{{data.order.updateTime}}</div></el-col>
                    <el-col :span="4"><div style="font-size: 12px" class="bottom">打印人:{{username}}</div></el-col>
                  </el-row>-->
            <tr class="day-in" style="border: 0;">
              <td colspan="9" style="border: 0;">
                <div style="display:flex;">
                  <div style="width: 15%">制单员:{{ data.order.creator }}</div>
                  <div style="width: 25%">制单日期:{{ data.order.createTime }}</div>
                  <div style="width: 15%">审核员:{{ data.order.verifier }}</div>
                  <div style="width: 25%">审核日期:{{ data.order.updateTime }}</div>
                  <div style="width: 15%">打印人:{{ username }}</div>
                </div>
              </td>
            </tr>
            </tfoot>
          </table>
        </td>
      </tr>
    </table>
    <el-row :gutter="24">
      <el-col :span="4"><div style="font-size: 12px" class="bottom">制单员:{{data.order.creator}}<span style="font-size: 10px"></span></div></el-col>
      <el-col :span="6"><div style="font-size: 12px" class="bottom">制单日期:{{data.order.createTime}}<span style="font-size: 10px"></span></div></el-col>
      <el-col :span="4"><div style="font-size: 12px" class="bottom">审核员:{{data.order.verifier}}</div></el-col>
      <el-col :span="6"><div style="font-size: 12px" class="bottom">审核日期:{{data.order.updateTime}}</div></el-col>
      <el-col :span="4"><div style="font-size: 12px" class="bottom">打印人:{{username}}</div></el-col>
    </el-row>
    </table>
    <el-dialog v-model="dialogVisible" style="width: 40%;height: 20%;margin-top: 10%" >
      <el-select v-model="selectedValues" style="width: 100%" @change="handleChange" multiple  placeholder="请选择">
        <el-option
            v-for="item in productIdData"
            :key="item"
            :label='item.productId+"   "+item.productName'
            :value="item.productId">
        </el-option>
      </el-select>
    </el-dialog>
  </div>
@@ -230,10 +340,33 @@
  background-color: black;
  color: black;
}
table {
  border-collapse: collapse;
  width: 100%;
}
td > table {
  margin: 0;
  padding: 0;
}
.day-in{
  height: 30px;
}
.contactNumber{
  width: 125px;
  height:20px;
  border: none;
  box-shadow: none;
  font-size: 17px;
}
@media print {
  thead { display: table-header-group; }
  @page {
    margin: 5mm 5mm 10mm 5mm;
  }
}
</style>