提交浏览发货信息

廖井涛

4 天以前 4955996ab044bc275ac78da3543b9d9f5ad7f8d9

 north-glass-erp/northglass-erp/src/components/sd/order/OrderDetail.vue

@@ -3,6 +3,10 @@
import {changeFilterEvent, filterChanged} from "@/hook"
import {useI18n} from "vue-i18n"
import request from "@/utils/request"
import footSum from "@/hook/footSum";
import {addListener,destroyAreaBox} from "@/hook/mouseMoveHomePage";
import {copyTableCellValue, copyTableCellValueShow} from "@/hook/copyTableCellValue";
import {multiply,multiplyAuto,divideAuto} from '@/utils/decimal'
const { t } = useI18n()
const xGrid = ref()
const gridOptions = reactive({
@@ -12,12 +16,10 @@
  align: 'center',//文字居中
  stripe:true,//斑马纹
  showOverflow:true,
  showFooter: true,//显示脚
  rowConfig: {isCurrent: true, isHover: true,height: 30},//鼠标移动或选择高亮
  virtualScroll: true, // 开启虚拟滚动功能
  id: 'OrderList',
  printConfig: {},
  importConfig: {},
  exportConfig: {},
  id: 'OrderDetail',
  scrollY:{ enabled: true,gt:13 },//开启虚拟滚动
  //scrollX:{ enabled: true,gt:15 },//开启虚拟滚动

@@ -29,23 +31,30 @@
  customConfig: {
    storage: true
  },

  mouseConfig:{selected: true},//鼠标选中
  keyboardConfig:{
    isArrow: true
  },

  columns:[
    {type: 'seq', title: t('basicData.Number'), width: 80 },
    // {field: 'buildingNumber',width:120,  title: '楼号',editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter'}, sortable: true,filterMethod:filterChanged},
    {field: 'orderNumber', title: t('basicData.Number'), width: 80 },
    {field: 'buildingNumber',width:120,  title: t('order.buildingNumber'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter'}, sortable: true,filterMethod:filterChanged},
    {field: 'productId',width:140,  title: t('order.productId'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'productName',width:300,  title: t('order.product'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    //{field: 'price',width:140,  title: t('order.price'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'otherColumns.S01',width:140,  title: t('reportingWorks.glassNumber'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    //{field: 'grossAmount',width:160,  title: t('order.grossAmount'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'width',width:120,  title: t('order.width') ,editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'height',width:140,  title: t('order.height'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'quantity',width:140,  title: t('order.quantity'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'deliveryNum',width:140,  title: t('delivery.deliveryQuantity'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'deliveryArea',width:140,  title: t('report.shippedArea'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'processingNote',width:200,  title: t('order.processingNote'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'price',width:140,  title: t('order.price'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'area',width:150,  title: t('order.trueArea'),filters:[{ data: '' }],slots: { filter: 'num1_filter'}, sortable: true,filterMethod:filterChanged},
    {field: 'grossArea',width:160,  title: t('order.trueGrossArea'),filters:[{ data: '' }],slots: { filter: 'num1_filter'}, sortable: true,filterMethod:filterChanged},
    {field: 'computeArea',width:180,  title: t('order.computeArea'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'computeGrossArea',width:200,  title: t('order.computeGrossArea'),filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'processingNote',width:200,  title: t('order.processingNote'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'perimeter',width:200,  title: t('order.perimeter'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'remarks',width:140,  title: t('basicData.remarks'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},
    {field: 'shape',width:120,
      title: t('order.shape'),
@@ -56,21 +65,100 @@
    {field: 'edgingType',width:160,  title: t('order.edgingType'),editRender: { name: 'input'},filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true,filterMethod:filterChanged},

  ],
  toolbarConfig: {
    slots:{
      buttons: "title"
    },
    zoom: true,
    custom: true
  },

  footerMethod ({ columns, data }) {//页脚函数
    return[
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return t('basicData.total')
        }
        const List = ["quantity",'grossArea','area','computeGrossArea','computeArea','perimeter','deliveryNum','deliveryArea']
        if (List.includes(column.field)) {
          return footSum(data, column.field)
        }
        return ''
      })
    ]
  }
})

let props = defineProps({
  orderId:null
  orderId:null,
  row: {}
})
onMounted(()=>{
  request.post(`/order/getOrderDetailById/${props.orderId}`).then(res=>{
    xGrid.value.reloadData(res.data)
  })

const gridEvents = {
  cellDblclick ({row,column}) {
    copyTableCellValue(row,column)
  }
}
onMounted(async ()=>{
  await getColumns()
  await getDetail()
  addListener(xGrid.value,gridOptions)
})
watch(()=>props.orderId,(newValue)=>{
  request.post(`/order/getOrderDetailById/${props.orderId}`).then(res=>{
      xGrid.value.reloadData(res.data)
  })
  getDetail()
})

const getColumns = async () => {
  await request.post(`/basicOtherMoney/findAllByState`).then(res=>{
    res.data.forEach(item => {
      let column = {
        field: `otherColumns.${item.column}`,
        width:100,
        title: item.alias,
        editRender: {
          name: 'input',
        }
      }
      //columns.push(column)
      gridOptions.columns.push(column)

    })
  })
}

const getDetail = async ()=> {
  await request.post(`/order/getOrderDetailById/${props.orderId}`).then(res=>{
    res.data.forEach(item => {
      item.deliveryArea = multiply(item.deliveryNum,item.computeArea)
      item.otherColumns = JSON.parse(item.otherColumns)
    })
    xGrid.value.reloadData(res.data)
  })
}

const handleKeyDown = (evnt) =>{
  if(evnt.$event.keyCode === 38 ){
    let nextRowIndex = xGrid.value.getRowIndex(xGrid.value.getCurrentRecord()) - 1;
    if (nextRowIndex < xGrid.value.getTableData().fullData.length && nextRowIndex>=0) {
      xGrid.value.setCurrentRow(xGrid.value.getTableData().fullData[nextRowIndex]);
    }

  }
  if(evnt.$event.keyCode === 40 ){

    let nextRowIndex = xGrid.value.getRowIndex(xGrid.value.getCurrentRecord()) + 1;
    if (nextRowIndex < xGrid.value.getTableData().fullData.length) {
      xGrid.value.setCurrentRow(xGrid.value.getTableData().fullData[nextRowIndex]);
    }

  }
}

let showTitle = ref(false)
const changeZoom = ()=> {
  showTitle.value = !showTitle.value
}

</script>

<template>
@@ -81,19 +169,33 @@
        class="mytable-scrollbar"
        ref="xGrid"
        v-bind="gridOptions"
        @zoom="changeZoom"
        @keydown="handleKeyDown"
        v-on="gridEvents"
    >
      <template #num1_filter="{ column, $panel }">
        <div>
          <div v-for="(option, index) in column.filters" :key="index">
            <input type="text"
                   v-model="option.data"
                   @keyup.enter.native="$panel.confirmFilter()"
                   @input="changeFilterEvent($event, option, $panel)"/>
          </div>
        </div>
      </template>

      <template #default_shape="{ row }">
        <span>{{ row.shape==='1'?'普形':row.shape==='2'?'异形':null }}</span>
        <span>{{ row.shape==='1'?$t('order.universalShape'):row.shape==='2'?$t('order.alien'):null }}</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>
@@ -101,5 +203,12 @@
</template>

<style scoped>

.vxe-grid {
  /* 禁用浏览器默认选中 */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  transform: translateZ(0);
}
</style>