修改旋转逻辑，增加辅助旋转功能

于杰

103 分钟以前 69a25cd577d5639f2869bcf80f498b373e80137e

 north-glass-erp/northglass-erp/src/components/mm/PrintPackingList.vue

New file
@@ -0,0 +1,152 @@
<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 QRCode from "qrcode";
import companyInfo from "@/stores/sd/companyInfo";
import userInfo from "@/stores/userInfo"
//语言获取
const company = companyInfo()
const {t} = useI18n()
let router = useRouter()
let produceList = ref([])
let list = ref()
const details = ref([])
const user=userInfo()


const data = ref({
  printList: []
})

let props = defineProps({
  printList: null,
})

const {currentRoute} = useRouter()
const route = currentRoute.value


data.value.printList = JSON.parse(props.printList)

onMounted(() => {
  selectPrint()
    }
)
const selectPrint = () => {
  request.post(`/finishedGoodsInventory/getSelectPrint`, data.value).then((res) => {
    if (res.code == 200) {
      produceList.value = deepClone(res.data.data)
    } else {
      ElMessage.warning(res.msg)
      router.push("/login")
    }
  })
}

</script>

<template>
<div>
  <div style="width: 100%;height: 100%" v-for="(item,id) in produceList"  :key="id">
    <div  style="height: 100%;width: 100%;">
      <table>
        <thead>
        <tr>
          <td colspan="5" style="text-align: center;font-weight: bolder">
            <div>金华福喜天成玻璃有限公司</div>
          </td>
        </tr>
        <tr style="width: 100%;" v-for="(itemFlow,index) in item.detail" :key="index">
          <td colspan="5">
            <div>客户名称:&nbsp;&nbsp;&nbsp;{{itemFlow.customer_name}}</div>
            <div>项目名称:&nbsp;&nbsp;&nbsp;{{itemFlow.project}}</div>
            <div>订单号:&nbsp;&nbsp;&nbsp;{{itemFlow.order_id}} &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; 箱号:&nbsp;&nbsp;&nbsp;{{itemFlow.remarks}}</div>
          </td>
        </tr>
        <tr>
          <td style="width: 170px;">编号</td>
          <td style="width: 70px;">宽</td>
          <td style="width: 70px;">高</td>
          <td style="width: 70px;">数量</td>
          <td style="width: 70px;">面积</td>
        </tr>
        </thead>
        <tbody>
        <tr v-for="(itemDatile,index) in item.detailList" :key="index">
          <td>{{ itemDatile.building_number }}</td>
          <td>{{ itemDatile.width }}</td>
          <td>{{ itemDatile.height }}</td>
          <td>{{ itemDatile.quantity }}</td>
          <td>{{ itemDatile.area }}</td>
        </tr>
        <tr style="width: 100%;" v-for="(itemFlows,index) in item.detail" :key="index">
          <td>合计</td>
          <td></td>
          <td></td>
          <td>{{itemFlows.quantity}}</td>
          <td>{{itemFlows.area}}</td>
        </tr>
        </tbody>
      </table>
    </div>
  </div>
</div>

</template>

<style scoped>
* {
  margin: 0;
  padding: 0;
}

#contentTable{
  width: 100%;
  height: 100%;
}

#record{
  font-size: 20px;
  text-align: left;
  display: flex;
  flex-wrap: wrap
}

table{
  border-collapse: collapse;
  width: 100%;
}
tr,td,th{
  border: 1px solid black;
}

th,.no-change-row {
  white-space: nowrap;
}

@media print {
  @page {
    size: auto;  /* auto is the initial value */
    margin: 4mm 5mm 0mm 5mm  /* this affects the margin in the printer settings */

  }

  table {
    page-break-before: always;
    page-break-inside: auto;
  }

  thead {
    display: table-header-group;
    page-break-inside: avoid;
  }

}

</style>