| | |
| | | }, |
| | | |
| | | |
| | | columns:[ |
| | | |
| | | ], |
| | | mergeCells:[], |
| | | toolbarConfig: { |
| | | slots:{ |
| | | buttons: "title", |
| | | tools: 'type' |
| | | }, |
| | | zoom: true, |
| | | // custom: true |
| | | }, |
| | |
| | | const list = ref([]) |
| | | |
| | | let props = defineProps({ |
| | | orderId:null |
| | | orderId:null, |
| | | row: {} |
| | | }) |
| | | const columns = [ |
| | | {field: 'order_number',fixed:"left", width: 90,title: t('order.OrderNum'),showOverflow:"ellipsis"}, |
| | | {field: 'order_number',fixed:"left", width: 90,title: t('order.OrderNum'),showOverflow:"ellipsis",filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
| | | // {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: 'technology_number', width: 90,title: t('processCard.technologyNumber'),showOverflow:"ellipsis",filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
| | | {field: 'child_width', width: 90,title: t('order.width'),showOverflow:"ellipsis",filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
| | | {field: 'child_height', width: 90,title: t('order.height'),showOverflow:"ellipsis",filters:[{ data: '' }],slots: { filter: 'num1_filter' }}, |
| | | {field: 'quantity',slots: { default: 'show'}, 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: 'grossArea',slots: { default: 'show'}, width: 90,title: t('order.area')}, |
| | | {field: 'shippedQuantity',slots: { default: 'show'},width: 120, title: t('delivery.deliveryQuantity')}, |
| | | {field: 'inventory',slots: { default: 'show'},width: 120, title: t('productStock.inventoryQuantity')}, |
| | | {field: 'inventoryArea',slots: { default: 'show'},width: 120, title: t('report.inventoryArea')}, |
| | | {field: 'broken_num',width: 90, title: t('reportingWorks.quantityBroken')}, |
| | | ] |
| | | let column = [0,1,3,8,10,11,12,13] |
| | | |
| | | let orderType = ref(1) |
| | | |
| | | onMounted(()=>{ |
| | | getWorkOrder() |
| | |
| | | getWorkOrder() |
| | | }) |
| | | |
| | | let title = ref([]) |
| | | const changeProcessType = (type) => { |
| | | switch (orderType.value) { |
| | | case 1 :{ |
| | | xGrid.value.loadData(data.value) |
| | | xGrid.value.setMergeCells(mergeCells.value) |
| | | xGrid.value.updateFooter() |
| | | break |
| | | } |
| | | case 2 :{ |
| | | xGrid.value.loadData(data.value) |
| | | xGrid.value.clearMergeCells() |
| | | xGrid.value.clearMergeFooterItems() |
| | | xGrid.value.updateFooter() |
| | | |
| | | break |
| | | } |
| | | case 3:{ |
| | | xGrid.value.clearMergeCells() |
| | | xGrid.value.clearMergeFooterItems() |
| | | xGrid.value.updateFooter() |
| | | const lastProcess = title.value[title.value.length-1].process |
| | | const filter = data.value.filter(item => { |
| | | const lastFinish = parseInt(item['reportWorkQuantityShow'][lastProcess]) |
| | | const allFinish = item.glassQuantity*1 |
| | | return allFinish>lastFinish |
| | | }) |
| | | // console.log(filter) |
| | | xGrid.value.loadData(filter) |
| | | break |
| | | } |
| | | } |
| | | } |
| | | |
| | | |
| | | |
| | | let mergeCells = ref() |
| | | const data = ref([]) |
| | | const getWorkOrder = () => { |
| | | gridOptions.loading = true |
| | | request.post(`/report/processCardProgress/${props.orderId}`,column).then(async (res) => { |
| | |
| | | item.filterMethod = filterChanged |
| | | }) |
| | | list.value = ['quantity','inventory','inventoryArea','gross_area','shippedQuantity','glassQuantity'] |
| | | title.value = res.data.title |
| | | res.data.title.forEach((item,index) =>{ |
| | | list.value.push('reportWorkQuantity.'+item.process) |
| | | let column = {slots: { default: 'quantitySum'}, |
| | |
| | | item.reportWorkQuantityCount=JSON.parse(item.reportWorkQuantityCount) |
| | | item.reportWorkQuantityShow=JSON.parse(item.reportWorkQuantityShow) |
| | | }) |
| | | |
| | | orderType.value = 1 |
| | | await xGrid.value.loadData(res.data.data) |
| | | await xGrid.value.setMergeCells(res.data.mergeCells) |
| | | mergeCells.value = res.data.mergeCells |
| | | data.value = res.data.data |
| | | gridOptions.loading = false |
| | | xGrid.value.commitProxy('reset_custom') |
| | | |
| | |
| | | } |
| | | |
| | | const filterChange = () =>{ |
| | | if(xGrid.value.isFilter()){ |
| | | xGrid.value.clearMergeCells() |
| | | xGrid.value.clearMergeFooterItems() |
| | | }else{ |
| | | xGrid.value.setMergeCells(mergeCells.value) |
| | | xGrid.value.updateFooter() |
| | | if(orderType.value === 1) { |
| | | 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() || orderType.value!==1){ |
| | | |
| | | count += Number(item[array[0]+'Show'][array[1]]) || 0 |
| | | }else{ |
| | | count += Number(item[array[0]][array[1]]) || 0 |
| | | } |
| | | |
| | | }else { |
| | | count += Number(item[field]) || 0 |
| | | } |
| | | }) |
| | | return count.toFixed(2) |
| | | return count.toFixed(2).replace(/\.?0+$/, ''); |
| | | } |
| | | |
| | | const quantitySum = ( row,column )=>{ |
| | | const reportWorkQuantityCount = row.reportWorkQuantityCount[column.title] || '' |
| | | const reportWorkQuantityShow = row.reportWorkQuantityShow[column.title] || '' |
| | | if(reportWorkQuantityShow===reportWorkQuantityCount){ |
| | | if(reportWorkQuantityShow === reportWorkQuantityCount ){ |
| | | return reportWorkQuantityShow |
| | | } |
| | | |
| | |
| | | +'(' |
| | | +reportWorkQuantityCount |
| | | +')' ) |
| | | //return |
| | | } |
| | | //切换模式单片显示 |
| | | const show = (row,column ) =>{ |
| | | return row[column.field+'Show'] |
| | | } |
| | | |
| | | let showTitle = ref(false) |
| | | const changeZoom = ()=> { |
| | | showTitle.value = !showTitle.value |
| | | } |
| | | </script> |
| | | |
| | |
| | | <div style="width: 100%;height: 100%"> |
| | | <vxe-grid |
| | | @filter-change ='filterChange' |
| | | @zoom="changeZoom" |
| | | height="100%" |
| | | size="mini" |
| | | class="mytable-scrollbar" |
| | |
| | | <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> |
| | | |
| | | <template #type> |
| | | <vxe-select @change="changeProcessType" v-model="orderType" > |
| | | <vxe-option :value="1" :label="t('order.merge')"></vxe-option> |
| | | <vxe-option :value="2" :label="t('order.layer')"></vxe-option> |
| | | <vxe-option :value="3" :label="t('order.notFinish')"></vxe-option> |
| | | </vxe-select> |
| | | </template> |
| | | </vxe-grid> |
| | | </div> |
| | | </template> |