廖井涛
2025-11-24 46964bace341e98f238a0a3fd29f6adc643312c7
north-glass-erp/northglass-erp/src/components/sd/order/OrderProcessCollect.vue
@@ -4,6 +4,7 @@
import {useI18n} from "vue-i18n"
import request from "@/utils/request"
import {ElMessage} from "element-plus"
import {copyTableCellValue} from "@/hook/copyTableCellValue";
const { t } = useI18n()
const xGrid = ref()
const gridOptions = reactive({
@@ -20,8 +21,8 @@
  printConfig: {},
  importConfig: {},
  exportConfig: {},
  scrollY:{ enabled: true,gt:13 },//开启虚拟滚动
  scrollX:{ enabled: true,gt:15 },//开启虚拟滚动
  // scrollY:{ enabled: true,gt:13 },//开启虚拟滚动
  // scrollX:{ enabled: true,gt:15 },//开启虚拟滚动
  filterConfig: {   //筛选配置项
    // remote: true
  },
@@ -38,14 +39,32 @@
  columns:[
  ],
  mergeCells:[],
  toolbarConfig: {
    slots:{
      buttons: "title"
    },
    zoom: true,
    /*custom: true*/
    custom: true
  },
  spanMethod ({ row, rowIndex,column, columnIndex}) {
    const field = column.field
    if (xGrid.value.isFilter() ) {
      return { rowspan: 1, colspan: 1 }
    }
    if(mergeCells.value!==undefined){
      if(mergeCells.value[field] !== undefined && mergeCells.value[field][rowIndex+"_"+field] !== undefined){
        return mergeCells.value[field][rowIndex+"_"+field]
      }
    }
    return { rowspan: 1, colspan: 1 }
  },
  cellClassName ({ row, column,columnIndex})  {
    if (columnIndex>10 && row.thisQuantity*1 === row.reportWorkQuantity[column.title]*1){
        return 'row-green'
    if(column.field === undefined){
      return null
    }
    if (column?.field.indexOf('reportWorkQuantity.')>-1 && row.thisQuantity*1 === row.reportWorkQuantity[column.title]*1){
      return 'row-green'
    }
    return null
  },
@@ -66,27 +85,25 @@
const list = ref([])
let props = defineProps({
  orderId:null
  orderId:null,
  row: {},
  processId:null//用于后端数据返回,结果筛选
})
const columns = [
  {field: 'order_number',fixed:"left", width: 90,title: t('order.OrderNum'),showOverflow:"ellipsis"},
  // {type:'expand',fixed:"left",slots: { content:'content' },width: 50},
  {field: 'product_name', width: 150, title: t('order.product'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
  {field: 'glass_child',width: 130, title: t('reportingWorks.glassChild') ,filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
  {field: 'order_type', width: 120,title: t('order.orderType'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
  {field: 'process_id',width: 110, title: t('processCard.processId'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
  {field: 'technology_number', width: 90,title:  t('processCard.technologyNumber'),showOverflow:"ellipsis"},
  {field: 'child_width', width: 90,title:  t('order.width'),showOverflow:"ellipsis"},
  {field: 'child_height', width: 90,title:  t('order.height'),showOverflow:"ellipsis"},
  {field: 'quantity', width: 90,title: t('order.quantity')},
  {field: 'glassQuantity', width: 90,title: t('order.glassQuantity')},
  {field: 'gross_area', width: 90,title: t('order.area')},
  {field: 'shippedQuantity',width: 120, title: t('delivery.deliveryQuantity')},
  {field: 'inventory',width: 120, title: t('productStock.inventoryQuantity')},
  {field: 'inventoryArea',width: 120, title: t('report.inventoryArea')},
  {field: 'technology_number', width: 90,title:  t('processCard.technologyNumber'),showOverflow:"ellipsis",filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
  {field: 'quantity',slots: { default: 'show'}, width: 90,title: t('order.quantity')},
  {field: 'thisQuantity', width: 90,title: t('order.glassQuantity')},
  {field: 'gross_area',slots: { default: 'show'}, width: 90,title: t('order.area')},
  {field: 'inventory',slots: { default: 'show'},width: 120, title: t('report.inventoryNum')},
  {field: 'inventoryArea',slots: { default: 'show'},width: 120, title: t('report.StorageArea')},
  {field: 'broken_num',width: 90, title: t('reportingWorks.quantityBroken')},
]
let column = [0,1,3,6,7,8,10,11,12,13]
//let column = [0,2,3,5,7,8,9]
let column = ['product_name','order_type','process_id','quantity','gross_area','inventory','inventoryArea']
onMounted(()=>{
@@ -96,7 +113,9 @@
watch(()=>props.orderId,(newValue)=>{
  getWorkOrder()
})
const show = (row,column ) =>{
  return row[column.field+'Show']
}
let mergeCells = ref()
const getWorkOrder = () => {
@@ -107,23 +126,36 @@
      gridOptions.columns.forEach(item =>{
        item.filterMethod = filterChanged
      })
      list.value = ['quantity','inventory','inventoryArea','gross_area','shippedQuantity','glassQuantity']
      list.value = ['quantity','thisQuantity','inventory','inventoryArea','gross_area','glassQuantity','broken_num']
      const processList = {
        title:t('report.workingProcedure'),
        field:'process',
        children:[]
      }
      res.data.title.forEach((item,index) =>{
        list.value.push('reportWorkQuantity.'+item.process)
        let column = {slots: { default: 'quantitySum'},
          width: 90,
          title: item.process,
          field:'reportWorkQuantity.'+item.process}
        gridOptions.columns.push(column)
        processList.children.push(column)
      })
      gridOptions.columns.push(processList)
      res.data.data.forEach(item => {
        item.reportWorkQuantity=JSON.parse(item.reportWorkQuantity)
        item.reportWorkQuantityCount=JSON.parse(item.reportWorkQuantityCount)
        item.reportWorkQuantityShow=JSON.parse(item.reportWorkQuantityShow)
         item.reportWorkQuantityShow=JSON.parse(item.reportWorkQuantityShow)
      })
      await xGrid.value.loadData(res.data.data)
      await xGrid.value.setMergeCells(res.data.mergeCells)
      console.log(res.data.data)
      if (props.processId!=null && props.processId!=""){
        const processIdData = res.data.data.filter(item => item.process_id === props.processId)
        await xGrid.value.loadData(processIdData)
      }else {
        await xGrid.value.loadData(res.data.data)
      }
      mergeCells.value = res.data.mergeCells
      gridOptions.loading = false
@@ -135,29 +167,34 @@
const filterChange = () =>{
  if(xGrid.value.isFilter()){
    xGrid.value.clearMergeCells()
    xGrid.value.clearMergeFooterItems()
  }else{
    xGrid.value.setMergeCells(mergeCells.value)
    xGrid.value.updateFooter()
  }
}
const footSum =(list, field) => {
  if(xGrid.value.isFilter()){
    return
  }
  let count = 0
  list.forEach(item => {
    if(field.indexOf('.')>-1){
      let  array = field.split('.')
      count += Number(item[array[0]][array[1]]) || 0
      //判断是否为筛选状态和非订单合并状态
      if(xGrid.value.isFilter() ){
        count += Number(item[array[0]+'Show'][array[1]]) || 0
      }else{
        count += Number(item[array[0]][array[1]]) || 0
      }
    }else {
      count += Number(item[field])  || 0
      if(xGrid.value.isFilter() ) {
        count += Number(item[field+'Show']) || Number(item[field])   || 0
      } else {
        count += Number(item[field])  || 0
      }
    }
  })
  return count.toFixed(2)
  return count.toFixed(2).replace(/\.?0+$/, '');
}
const quantitySum = ( row,column )=>{
@@ -173,6 +210,17 @@
      +')' )
  //return
}
const gridEvents = {
  cellDblclick ({row,column}) {
    copyTableCellValue(row,column)
  }
}
let showTitle = ref(false)
const changeZoom = ()=> {
  showTitle.value = !showTitle.value
}
</script>
<template>
@@ -183,7 +231,9 @@
        size="mini"
        class="mytable-scrollbar"
        ref="xGrid"
        @zoom="changeZoom"
        v-bind="gridOptions"
        v-on="gridEvents"
    >
      <template #num1_filter="{ column, $panel }">
        <div>
@@ -200,6 +250,20 @@
      <template #quantitySum="{ row,column }">
        <span>{{ quantitySum(row,column) }} </span>
      </template>
      <template #show="{ row,column }">
        <span>{{ show(row,column) }} </span>
      </template>
      <template #title>
        <span style="font-weight: bold" v-show="showTitle">
          {{ row.orderId }}
          {{ row.project?'--':'' }}
          {{row.project}}
          {{ row.batch?'--':'' }}
          {{row.batch}}
        </span>
      </template>
    </vxe-grid>
  </div>
@@ -209,5 +273,12 @@
::v-deep(.vxe-grid .vxe-body--column.row-green) {
  background-color: #D5EAFF;
}
.vxe-grid {
  /* 禁用浏览器默认选中 */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transform: translateZ(0);
}
</style>