guoyuji
2024-04-26 684399b665ef8c25c43faff0fdc821a0b72b39ba
north-glass-erp/northglass-erp/src/views/pp/reportingWorks/AddReportingWork.vue
@@ -1,24 +1,118 @@
<script setup>
import {reactive} from "vue";
import {useRouter} from  'vue-router'
let router=useRouter()
const getTableRow = (row,type) =>{
  switch (type) {
    case 'edit' :{
      //alert('我接收到子组件传送的编辑信息')
      router.push({path: '/main/processCard/PrintFlowCard', query: { id: row.id }})
      break
    }
    case 'delete':{
      alert('我接收到子组件传送的删除信息')
      break
    }
    case  'setType':{
      alert('我接收到子组件传送的排版状态')
      break
    }
import {computed, nextTick, onMounted, reactive, ref, toRefs} from "vue";
import {useRouter,useRoute} from 'vue-router'
import request from "@/utils/request";
import {ElMessage} from "element-plus";
import {changeFilterEvent, filterChanged} from "@/hook"
import {indexOf} from "xe-utils";
import {addListener, toolbarButtonClickEvent} from "@/hook/mouseMove";
import userInfo from "@/stores/userInfo"
import { useI18n } from 'vue-i18n'
//语言获取
const { t } = useI18n()
let brokenVisible = ref(false)
const xGrid = ref()
const brokenGrid =ref()
const router = useRouter()
const route = useRoute()
const user=userInfo()
//定义表头数据
const titleUploadData = ref({
  reportingWorkId: null,
  //流程卡号
  processId: null,
  //销售单号
  orderId: '',
  reviewedState:0,
  //生产单号
  productionId: '',
  //设备类型
  deviceName: '',
  //班组名称
  teamsGroupsName: '',
  //生产日期
  reportingWorkTime: '',
  //报工工序
  thisProcess: '',
  //上工序
  previousProcess: '',
  //下工序
  nextProcess: '',
  //备注
  notes: '',
  //本工序完工数
  thisCompletedQuantity: '',
  //本工序报废数
  thisWornQuantity: '',
  //班次
  classes: '',
  //责任工序
  responsibleProcess: '',
  order: {
    //客户编号
    customerId: '',
    //客户名称
    customerName: '',
    //项目名称
    project: '',
  },
  flowCard: {
    //可报工数量
    quantity: ''
  },
})
let detail = ref([])
//定义接收加载表头下拉数据
const titleSelectJson = ref({
  deviceType: [],
  teamsType: [],
  processType: [],
  thisProcessType: [],
  mateProcessType: [],
  historyDevice:[],
  historyTeams:[],
  historyProcess:[],
  breakageType:[],
  breakageReason:[]
})
let inputDisabled = ref(false)
onMounted(() =>{
  if(route.query.processId !== undefined && route.query.processId!=='' && route.query.processId!=null ){
    titleUploadData.value.processId = route.query.processId
  }
}
   //route.query.reportingWorkId = 'BG2403150004'
  //判断是否传入报工编号
  if(route.query.reportingWorkId !== '' && route.query.reportingWorkId!=null){
    request.post(`reportingWork/selectUpdateReportingWork/${route.query.reportingWorkId}`).then(res=>{
      if(res.code === '200'){
        titleUploadData.value = res.data.reportingWork
        titleSelectJson.value = res.data.basic
        xGrid.value.reloadData(res.data.reportingWorkDetails)
        let button =  {
          code: 'update',
          name: '修改',
          status: 'primary',
        }
        if(route.query.reviewStatus === "1"){
          button.name='审核'
          titleUploadData.value.qualityInspector=user.user.userName
        }
        gridOptions.toolbarConfig.buttons.push(button)
      }
      getQuantity()
      inputDisabled.value = true
    })
  }
})
const data = [{id:1,num:2},{id:1,num:3},{id:2,num:2},{id:1,num:2}];
//表尾求和
const sumNum = (list, field) => {
@@ -29,30 +123,43 @@
  return count.toFixed(2)
}
const form = reactive({
  lckh: 'NG23120801A01/1'
})
//子组件接收参数
const optionVal = ref('')
//班次
const classesVal = ref('早班')
const classesOption = [
  {
    value: '早班',
    label: '早班',
  },
  {
    value: '晚班',
    label: '晚班',
  },
]
const gridOptions = reactive({
  border:  "full",//表格加边框
  border: "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe:true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true,height: 50},//鼠标移动或选择高亮
  stripe: true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true, height: 30},//鼠标移动或选择高亮
  id: 'CustomerList',
  showFooter: true,//显示脚
  printConfig: {},
  importConfig: {},
  exportConfig: {},
  scrollY:{ enabled: true },//开启虚拟滚动
  showOverflow:true,
  scrollY: {enabled: true},//开启虚拟滚动
  showOverflow: true,
  columnConfig: {
    resizable: true,
    useKey: true
  },
  filterConfig: {   //筛选配置项
    remote: true
                    // remote: true
  },
  customConfig: {
    storage: true
@@ -62,164 +169,127 @@
    mode: 'row',
    showStatus: true
  },//表头参数
  columns:[
  //  {type:'expand',fixed:"left",slots: { content:'content' },width: 50},
    {field: 'serialNumber',width:90, title: '序号',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true, },
    {field: 'singlePieceName',width:120, title: '单片名称', sortable: true,showOverflow:"ellipsis" ,filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
    {field: 'marking',width:90, title: '标记', sortable: true,filters:[{ data: '' }],slots: { filter: 'num1_filter' }},
    {field: 'pieces',width:100, title: '片标记',filters:[{ data: '' }],slots: { filter: 'num1_filter' }, sortable: true},
    {field: 'processCardNumber',width:110, title: '流程卡数量', sortable: true,showOverflow:"ellipsis"},
    {field: 'width',width:70, title: '宽', sortable: true},
    {field: 'height',width:70, title: '高', sortable: true},
    {field: 'shape',width:70, title: '形状', sortable: true,showOverflow:"ellipsis"},
    {field: 'upCompletedQuantity',width:120, title: '上工完工数量', sortable: true},
    {field: 'completedQuantity',width:100, title: '完工数量', sortable: true},
    {field: 'numberBroken',width:100, title: '次破数量', sortable: true},
    {field: 'availableUse',width:80, title: '可利用', sortable: true},
    {field: 'returnProcess',width:100, title: '退回工序', sortable: true},
    {field: 'reasonType',width:100, title: '次破类型', sortable: true},
    {field: 'reasonDamage',width:100, title: '次破原因', sortable: true},
    {field: 'responsibilityDevice',width:100, title: '责任设备', sortable: true},
    {field: 'responsibilityProcess',width:100, title: '责任工序', sortable: true},
    {field: 'responsibilityTeams',width:100, title: '责任班组', sortable: true},
    {field: 'responsibilityPersonnel',width:100, title: '责任人员', sortable: true},
    {field: 'completed', width:90,title: '已完工', sortable: true},
    {field: 'onceBroken', width:90,title: '已次破', sortable: true}
  columns: [
    //  {type:'expand',fixed:"left",slots: { content:'content' },width: 50},
    {
      field: 'order_number',
      title: t('order.OrderNum'),
      filters: [{data: ''}],
      slots: {filter: 'num1_filter'},
      filterMethod: filterChanged
    },
    {
      field: 'glass_child',
      title: t('reportingWorks.glassChild'),
      showOverflow: "ellipsis",
      filters: [{data: ''}],
      slots: {filter: 'num1_filter'},
      filterMethod: filterChanged
    },
    {
      field: 'technology_number',
      title: t('processCard.technologyNumber'),
      filters: [{data: ''}],
      slots: {filter: 'num1_filter'},
      filterMethod: filterChanged
    },
    {
      field: 'glass_address',
      title: t('reportingWorks.glassAddress'),
      filters: [{data: ''}],
      slots: {filter: 'num1_filter'},
      filterMethod: filterChanged
    },
    {
      field: 'quantity_card',
      title: t('reportingWorks.numberProcessCards'),
      filters: [{data: ''}],
      slots: {filter: 'num1_filter'},
      showOverflow: "ellipsis",
      filterMethod: filterChanged
    },
    {
      field: 'child_width',
      title: t('order.width'),
      filters: [{data: ''}],
      slots: {filter: 'num1_filter'},
      filterMethod: filterChanged
    },
    {
      field: 'child_height',
      title: t('order.height'),
      filters: [{data: ''}],
      slots: {filter: 'num1_filter'},
      filterMethod: filterChanged
    },
    {
      field: 'shape',
      title: t('order.shape'),
      filters: [{data: ''}],
      slots: {filter: 'num1_filter'},
      showOverflow: "ellipsis",
      filterMethod: filterChanged
    },
    {field: 'quantity', title: t('reportingWorks.reportableQuantityOk'),},
    {
      field: 'completedQuantity', title: t('reportingWorks.completedQuantity'),width: 120,
      editRender: {
        name: 'input',
        attrs: {placeholder: ''}
      },
  ],//表头按钮
    },
    {
      field: 'breakageQuantity',  title: t('reportingWorks.quantityBroken'),
    },
    {field: 'completed', width: 90, title:t('reportingWorks.completed'),},
    {field: 'onceBroken', width: 90, title: t('reportingWorks.onceBroken'),},
  toolbarConfig: {
  ],
//表单验证
  editRules: {
    completedQuantity: [
      {
        validator ({ row }) {
          const regex = /^[0-9]\d*$/
          const brokenNum =
              (row.breakageQuantity === undefined || row.breakageQuantity===null) ? 0 : row.breakageQuantity
          if (row.completedQuantity && !regex.test(row.completedQuantity)) {
            return new Error('请输入整数,并且大于等于0')
          }else if((row.completedQuantity*1+brokenNum*1)>row.quantity*1){
            return new Error((`${row.completedQuantity}+${brokenNum}>${row.quantity}`))
          }
          if(titleUploadData.value.reportingWorkId!=null  && row.completedQuantity<row.minQuantity){
            return new Error(`请输入大于等于${row.minQuantity}的数字`)
          }
        }
      }
    ]
  },
  toolbarConfig: {//表头按钮
    buttons: [
      { code: 'empty', name: '清空报工数量'  },
      { code: 'sameCompletion', name: '完工相同'  },
      { code: 'sameDamage', name: '次破相同'  },
      { code: 'sameOneCompletion', name: '完工一列相同'  },
      { code: 'sameOneDamage', name: '次破一列相同'  },
      {code: 'print_lck', name: '保存',status:'primary' ,icon:'vxe-icon-save'},
      {code: 'print_lck', name: '保存并审核',status:'primary' ,icon:'vxe-icon-save'},
      // {code: 'empty', name: '清空报工数量'},
      // {code: 'sameCompletion', name: '完工相同'},
      // {code: 'sameDamage', name: '次破相同'},
      // {code: 'sameOneCompletion', name: '完工一列相同'},
      // {code: 'sameOneDamage', name: '次破一列相同'},
      {code: 'saveReportingWork', name: t('basicData.save'), status: 'primary', icon: 'vxe-icon-save',disabled:true},
      {code: 'saveReportingWorkReview', name: t('reportingWorks.saveAndReview'), status: 'primary', icon: 'vxe-icon-save',disabled:true},
    ],
    import: false,
    export: true,
    print: true,
    // import: false,
    // export: true,
    // print: true,
    zoom: true,
    custom: true
  },
  data:  [
    {
      serialNumber:'1',
      singlePieceName: '6mm白玻平钢(外)',
      marking: '1',
      pieces: '(外)',
      processCardNumber: '11',
      width: '575',
      height:"2241",
      shape: '普形',
      upCompletedQuantity: '11',
      completedQuantity: '1',
      numberBroken:'',
      availableUse:'',
      returnProcess:'',
      reasonType: '机器',
      reasonDamage:'气泡超标',
      available:'',
      reworkProcess:'',
      responsibilityProcess:'中空',
      responsibilityTeams:'中空一班',
      responsibilityPersonnel:'',
      responsibilityDevice:'中空3#线',
      completed:'',
      onceBroken:'',
    },
    {
      serialNumber:'1',
      singlePieceName: '6mm白玻平钢(内)',
      marking: '2',
      pieces: '(内)',
      processCardNumber: '11',
      width: '575',
      height:"2241",
      shape: '普形',
      upCompletedQuantity: '11',
      completedQuantity: '1',
      numberBroken:'',
      availableUse:'',
      returnProcess:'',
      reasonType: '机器',
      reasonDamage:'气泡超标',
      available:'',
      reworkProcess:'',
      responsibilityProcess:'中空',
      responsibilityTeams:'中空一班',
      responsibilityPersonnel:'',
      responsibilityDevice:'中空3#线',
      completed:'',
      onceBroken:'',
    },
    {
      serialNumber:'2',
      singlePieceName: '8mm白玻平钢(外)',
      marking: '1',
      pieces: '(外)',
      processCardNumber: '11',
      width: '575',
      height:"2241",
      shape: '普形',
      upCompletedQuantity: '11',
      completedQuantity: '1',
      numberBroken:'',
      availableUse:'',
      returnProcess:'',
      reasonType: '机器',
      reasonDamage:'气泡超标',
      available:'',
      reworkProcess:'',
      responsibilityProcess:'中空',
      responsibilityTeams:'中空一班',
      responsibilityPersonnel:'',
      responsibilityDevice:'中空3#线',
      completed:'',
      onceBroken:'',
    },
    {
      serialNumber:'2',
      singlePieceName: '8mm白玻平钢(内)',
      marking: '2',
      pieces: '(内)',
      processCardNumber: '11',
      width: '575',
      height:"2241",
      shape: '普形',
      upCompletedQuantity: '11',
      completedQuantity: '1',
      numberBroken:'',
      availableUse:'',
      returnProcess:'',
      reasonType: '机器',
      reasonDamage:'气泡超标',
      available:'',
      reworkProcess:'',
      responsibilityProcess:'中空',
      responsibilityTeams:'中空一班',
      responsibilityPersonnel:'',
      responsibilityDevice:'中空3#线',
      completed:'',
      onceBroken:'',
    },
  ],//table body实际数据
  //脚部求和
  footerMethod ({ columns, data }) {//页脚函数
    let footList=['processCardNumber','upCompletedQuantity','completedQuantity','numberBroken','']
    return[
  footerMethod({columns, data}) {//页脚函数
    let footList = ['', '', '', '', '']
    return [
      columns.map((column, columnIndex) => {
        if (columnIndex === 0) {
          return '合计:'
        }
        if (footList.includes(column.field)) {
          return sumNum(data, column.field)
          return t('basicData.total')
        }
        return ''
      })
@@ -228,168 +298,1014 @@
})
let brokenRow = ref({
  glass_child:'',
  order_number:'',
  technology_number:''
})
const gridEvents = {
  async toolbarButtonClick({code}) {
    const $grid = xGrid.value
    if ($grid) {
      switch (code) {
        case 'saveReportingWork':  {
          const errMap = await $grid.validate(true)
          if (errMap) {
            ElMessage.error(`校验不通过!`)
            return
          }
          saveReportingWork(0,'save')
          break
        }
        case 'saveReportingWorkReview':  {
          const errMap = await $grid.validate(true)
          if (errMap) {
            ElMessage.error(`校验不通过!`)
            return
          }
          saveReportingWork(1,'save')
          break
        }
        case 'update':  {
          getQuantity()
          const errMap = await $grid.validate(true)
          if (errMap) {
            ElMessage.error(`校验不通过!`)
            return
          }
          saveReportingWork(0,'update')
          break
        }
      }
    }
  },
  cellDblclick (params) {//表格内容双击打开产品界面
    const { row } = params
    brokenRow.value = row
    if(brokenRow.value.damageDetails=== undefined){
      brokenRow.value.damageDetails=[]
    }
    //brokenGrid.value.reloadData(brokenRow.damageDetail)
    //改变brokenVisible的值触发openedBrokenTable()方法
    brokenVisible.value = true
  }
}
const brokenGridOptions = reactive({
  border: "full",//表格加边框
  keepSource: true,//保持源数据
  align: 'center',//文字居中
  stripe: true,//斑马纹
  rowConfig: {isCurrent: true, isHover: true, height: 30},//鼠标移动或选择高亮
  id: 'CustomerList',
  //showFooter: true,//显示脚
  printConfig: {},
  importConfig: {},
  exportConfig: {},
  //scrollY: {enabled: true},//开启虚拟滚动
  showOverflow: true,
  columnConfig: {
    resizable: true,
    useKey: true
  },
  filterConfig: {   //筛选配置项
    // remote: true
  },
  customConfig: {
    storage: true
  },
  editConfig: {
    trigger: 'click',
    mode: 'row',
    showStatus: true
  },//表头参数
  columns: [
    {type: 'seq',fixed:"left", title: t('basicData.Number'), width: 80 },
    // {
    //   field: 'order_number',
    //   title: '序号'
    // },
    {
      field: 'breakageQuantity',
      title: t('reportingWorks.quantityBroken'),
      editRender: {name: 'input', attrs: {placeholder: ''}}
    },
    {field: 'available',
      title: t('reportingWorks.available'),
      slots: {default: 'available'}
    },
    {field: 'returnProcess', title: t('reportingWorks.returnProcess'),
      editRender: {},
      slots: {default: 'returnProcess_default', edit: 'returnProcess'}
    },
    {
      field: 'breakageType', title: t('reportingWorks.breakageType'),
      editRender: {},
      slots: {default: 'breakageType_default', edit: 'breakageType'}
    },
    {
      field: 'breakageReason', title: t('reportingWorks.breakageReason'),
      editRender: {},
      slots: {default: 'breakageReason_default', edit: 'breakageReason'}
    },
    {
      field: 'responsibleProcess', title: t('reportingWorks.responsibleProcess'),
      editRender: {},
      slots: {default: 'responsibleProcess_default', edit: 'responsibleProcess'}
    },
    {
      field: 'responsibleEquipment',
      title: t('reportingWorks.responsibleEquipment'),
      editRender: {},
      slots: {default: 'reportingDeviceSort_default', edit: 'reportingDeviceSort'}
      // editRender: {name: 'input', attrs: {placeholder: ''}}
    },
    {
      field: 'responsibleTeam',  title: t('reportingWorks.responsibleTeam'),
      editRender: {},
      slots: {default: 'responsibleTeam_default', edit: 'responsibleTeam'}
    },
    {
      field: 'responsiblePersonnel',
      title: t('reportingWorks.responsiblePersonnel'),
      editRender: {name: 'input', attrs: {placeholder: ''}}
    },
  ],
//表单验证
  editRules: {
    breakageQuantity: [
      {
        validator ({ cellValue }) {
          const regex = /^[1-9]\d*$/
          if (!regex.test(cellValue)) {
            return new Error('输入大于0的整数')
          }
        }
      }
    ],
    returnProcess:[
      {
        validator ({ row }) {
          const regex = /^\s*$/i
          if(row.available===true && (regex.test(row.returnProcess)==='' || row.returnProcess===null)){
            return new Error('可利用已选择,请选择返回工序')
          }
        }
      }
    ],
    breakageType: [
      { required: true, message: '请选择次破类型' }
    ],
    breakageReason: [
      { required: true, message: '请选择次破原因' }
    ],
    responsibleProcess: [
      { required: true, message: '请选择责任工序' }
    ],
    responsibleEquipment: [
      { required: true, message: '请选择责任设备' }
    ],
    responsibleTeam: [
      { required: true, message: '责任班组' }
    ],
  },
  toolbarConfig: {//表头按钮
    buttons: [
      {code: 'addRow', name: t('reportingWorks.increase'), status: 'primary', icon: 'vxe-icon-square-plus'},
      {code: 'removeRow', name: t('basicData.delete'), status: 'primary', icon: 'vxe-icon-delete'},
    ],
    // import: false,
    // export: true,
    // print: true,
    zoom: true,
    custom: true
  },
})
const brokenGridEvents = {
  toolbarButtonClick({code}) {
    const $grid = brokenGrid.value
    if ($grid) {
      switch (code) {
        case 'addRow':  {
          $grid.insertAt({})
          break
        }
        case 'removeRow':  {
          let result = toolbarButtonClickEvent()
          if(result){
            $grid.remove(result.row)
          }
          break
        }
      }
    }
  }
}
const openedBrokenTable = () => {
  addListener(brokenGrid.value,brokenGridOptions)
  let damage =ref(brokenRow.value.damageDetails)
  brokenGrid.value.reloadData(damage.value)
}
const checkClose = async (done) => {
  if(brokenGrid.value.getTableData().fullData.length===0){
    brokenRow.value.breakageQuantity=null
    brokenRow.value.completedQuantity = brokenRow.value.quantity
    brokenRow.value.damageDetails=[]
    done()
    return true
  }
  const errMap = await brokenGrid.value.validate(true)
  if (errMap) {
    ElMessage.error(`校验不通过!`)
    return false
  }
  let breakageQuantityCount = 0
  brokenRow.value.breakageQuantity=0
  brokenGrid.value.getTableData().fullData.forEach((row) =>{
    breakageQuantityCount+=row.breakageQuantity*1
  })
  let reportingWorkNum = isNaN(brokenRow.value.completedQuantity*1)?0:brokenRow.value.completedQuantity*1
  if((breakageQuantityCount>brokenRow.value.quantity*1) ){
    ElMessage.warning(`损耗数:'${breakageQuantityCount}'
                               不能大于${brokenRow.value.quantity*1}`)
    return false
  }
  brokenRow.value.completedQuantity = brokenRow.value.quantity-breakageQuantityCount
  breakageQuantityCount = breakageQuantityCount === 0 ? null : breakageQuantityCount
  brokenRow.value.breakageQuantity = breakageQuantityCount
  brokenRow.value.damageDetails=brokenGrid.value.getTableData().fullData
  // xGrid.value.getTableData().fullData.forEach(
  //
  // )
  const equalByOrderNum = xGrid.value.getTableData().fullData.filter((row) =>{
    return row.order_number === brokenRow.value.order_number
  })
  const maxQuantity =  Math.max(...equalByOrderNum.map(item =>item.breakageQuantity || 0))
  equalByOrderNum.forEach((row) =>{
    row.completedQuantity= brokenRow.value.quantity*1-maxQuantity
  })
  getQuantity()
  done()
}
//第一次加载数据
request.post(`/reportingWork/selectProcess`).then((res) => {
  if (res.code == 200) {
    titleSelectJson.value.processType = res.data.process;
  } else {
    ElMessage.warning(res.msg)
  }
})
function checkSameNumForId(data, targetId) {
  // 初始化一个对象来存储遇到的id及其对应的num值
  const idNums = {};
  let firstNum = null;
  for (const item of data) {
    if (item.order_number === targetId) {
      // 如果找到了目标id,检查num是否与第一个遇到的num相同
      if (firstNum === null) {
        // 如果是第一个遇到的,记录num值
        firstNum = item.completedQuantity;
      } else if (item.completedQuantity !== firstNum) {
        // 如果num值与第一个遇到的num不同,返回false
        return false;
      }
    }
  }
  // 如果遍历完数组后没有返回false,那么所有具有目标id的对象都具有相同的num值
  return true;
}
const saveReportingWork = (state,saveType) => {
  if(xGrid.value.getTableData().fullData.length===0){
    ElMessage.warning(`请选择流程卡数据`)
    return
  }
  const device = titleUploadData.value.deviceName
  if(device === null || device === undefined || device === ''){
    ElMessage.error('请选择报工设备!')
    return
  }
  const teamsGroupsName = titleUploadData.value.teamsGroupsName
  if(teamsGroupsName === null || teamsGroupsName === undefined || teamsGroupsName === ''){
    ElMessage.error('请选择报工设备!')
    return
  }
  const seenIds = {}
  const uniqueByOrderNum = xGrid.value.getTableData().fullData.filter(item => {
    // 检查item的id是否已经在seenIds中
    if (!seenIds[item.order_number]) {
      // 如果不在,添加它并返回true以保留这个对象
      seenIds[item.order_number] = true;
      return true;
    }
    // 如果已经在seenIds中,返回false以过滤掉这个对象
    return false;
  });
  const notFinishList = xGrid.value.getTableData().fullData.filter(item =>{
    return item.saveFlag === false
  })
  for(let item of uniqueByOrderNum){
    if(!checkSameNumForId(notFinishList,item.order_number)){
      ElMessage.error(`请检查订单序号: ${item.order_number} 报工数量是否相同!`)
      return false
    }
  }
  titleUploadData.value.creator = user.user.userName
  titleUploadData.value.creatorId = user.user.userId
  const requestDetailData = xGrid.value.getTableData().fullData.filter((row) => {
    const a = (row.completedQuantity !== undefined && row.completedQuantity !== null && row.completedQuantity !== '' && row.completedQuantity*1!==0)
    const b = (row.breakageQuantity !== undefined && row.breakageQuantity !== null && row.breakageQuantity !== '' && row.breakageQuantity*1!==0)
    return (a || b)
  })
  if(requestDetailData.length === 0){
    ElMessage.warning('请填写至少一条损耗数和完工数大于0')
    return false
  }
  const requestData = {
    title:titleUploadData.value,
    detail:xGrid.value.getTableData().fullData,
    type:state//审核状态
  }
  gridOptions.toolbarConfig.buttons[0].disabled=true
  gridOptions.toolbarConfig.buttons[1].disabled=true
  //判断保存还是修改
  if(saveType==='save'){
    saveReportingWorkRequest(requestData)
  }else{
    updateReportingWorkRequest(requestData)
  }
}
const saveReportingWorkRequest = (requestData) =>{
  request.post(`/reportingWork/saveReportingWork`,requestData).then(res =>{
    if (res.code == 200){
      ElMessage.success("报工成功")
      router.push({path:'/main/reportingWorks/AddReportingWork',query:{processId:titleUploadData.value.processId,random:Math.random()}})
    }else{
      const errorObj = JSON.parse(res.msg)
      const msg = "序号:"+errorObj.orderNumber+'\n'
          +'小片顺序:'+errorObj.technologyNumber+'\n'
          +"实际可报工数量:"+errorObj.processNum+'<'+
          "报工数量:"+errorObj.sumNum+'\n'
          +"请刷新界面重新报工"
      ElMessage.error(msg)
    }
  }).catch(err =>{
    ElMessage.error(err.message)
  }).finally(()=>{
    gridOptions.toolbarConfig.buttons[0].disabled=false
    gridOptions.toolbarConfig.buttons[1].disabled=false
  })
}
//更新报工数据
const updateReportingWorkRequest = (requestData) =>{
  let reviewState = 'update'
  if(route.query.reviewStatus==="1"){
    reviewState = 'review'
  }
  request.post(`/reportingWork/updateReportingWork/${reviewState}`,requestData).then(res =>{
    if (res.code == 200){
      ElMessage.success("报工修改成功")
      router.push({path:'/main/reportingWorks/AddReportingWork',
        query:{
          processId:titleUploadData.value.processId,
          random:Math.random()}
      })
    }
  })
}
//查询责任设备
const computedDevice = computed((responsibleProcess) => {
  return function (responsibleProcess){
    return titleSelectJson.value.historyDevice.filter((item) => {
      return item.basic_category === responsibleProcess
    })
  }
})
// 查询责任班组
const computedResponsibleTeam = computed((responsibleProcess) => {
  return function (responsibleProcess){
    return titleSelectJson.value.historyTeams.filter((item) => {
      return item.process === responsibleProcess
    })
  }
})
//判断是否点击可利用 显示返回工序
const computedReturnProcess =  computed((available) => {
  return function (available){
    if(available){
      return titleSelectJson.value.historyProcess
    }
  }
})
let loadingFlag = ref(false)
let disabledFlag = ref(true)
const reviewReportingWork = () => {
  const processId = titleUploadData.value.processId
  if (processId.indexOf("/") < 0) {
    ElMessage.warning("请输入正确格式流程卡")
    return
  }
  let indexOfChar = processId.indexOf("/")
  let leftString = processId.slice(0, indexOfChar)
  if (leftString.length !== 14) {
    ElMessage.warning("请输入正确位数的流程卡")
    return
  }
//工序
  let process = titleUploadData.value.thisProcess
  if (process === "" || process == null) {
    ElMessage.warning("请选择工序")
    return
  }
  if(titleUploadData.value.previousProcess===''){
    ElMessage.warning("第一道工序不需要审核")
    return
  }
  const reportWork = {
    process: titleUploadData.value.previousProcess,
    processId:processId
  }
  loadingFlag.value= true
  request.post("/reportingWork/reviewReportingWork",reportWork).then((res) =>{
    if(res.code === '200'){
      ElMessage.success("审核成功")
      router.push({path:'/main/reportingWorks/AddReportingWork',
        query:{
          processId:titleUploadData.value.processId,
          random:Math.random()
        }
      })
    }
  }).finally(
      loadingFlag.value= false
  )
}
//下拉款选择工序时查询
const getWork = () => {
  let processId = titleUploadData.value.processId
  let parts = processId.split('/');
  if (processId.indexOf("/") < 0 ||parts[1].trim() == '') {
    ElMessage.warning("请输入正确格式流程卡")
    return
  }
  let indexOfChar = processId.indexOf("/")
  let leftString = processId.slice(0, indexOfChar)
  if (leftString.length != 14) {
    ElMessage.warning("请输入正确位数的流程卡")
    return
  }
//工序
  let process = titleUploadData.value.thisProcess
  if (process == "" || process == null) {
    ElMessage.warning("请选择工序")
    return
  }
  if (titleSelectJson.value.thisProcessType.indexOf(process) == -1 && process != "切割" && titleSelectJson.value.thisProcessType != "") {
    ElMessage.warning("此工序不属于该流程卡")
    return
  }
  //匹配“/”前后字符串
  const regex =  /([^\/]+)\/([^\/]+)/;
  //查找匹配的字符串
  const result = processId.match(regex);
  //流程卡号
  let processIdStr = result[1];
  //层号
  let technologyStr = result[2];
  request.post(`/reportingWork/addSelectLastWork/${processIdStr}/${technologyStr}/${process}`).then((res) => {
    if (res.code == 200) {
      if(res.data.data==null){
        ElMessage.error("未查询到此流程卡数据")
        return
      }
      //表头赋值
      titleUploadData.value = res.data.data
      titleUploadData.value.processId = processId
      //设备下拉框
      titleSelectJson.value.deviceType = res.data.device
      //班组下拉框
      titleSelectJson.value.teamsType = res.data.teams
      //当前流程卡工序
      titleSelectJson.value.thisProcessType = res.data.thisProcess
      //历史班组
      titleSelectJson.value.historyTeams= res.data.historyTeams
      //历史设备
      titleSelectJson.value.historyDevice = res.data.historyDevice
      //历史工序
      titleSelectJson.value.historyProcess =  res.data.historyProcess
      //次破类型
      titleSelectJson.value.breakageType =  res.data.breakageType
      //次破原因
      titleSelectJson.value.breakageReason =  res.data.breakageReason
      if(titleUploadData.value.reviewedState==1){
        gridOptions.toolbarConfig.buttons[0].disabled=false
        gridOptions.toolbarConfig.buttons[1].disabled=false
        disabledFlag.value=true
      }else {
        gridOptions.toolbarConfig.buttons[0].disabled=true
        gridOptions.toolbarConfig.buttons[1].disabled=true
        disabledFlag.value=false
      }
      //判断早晚班
      titleUploadData.value.classes=t('reportingWorks.early')
      titleUploadData.value.reportingWorkTime = formatCurrentTime()
      //绑定下方表格
      detail.value = res.data.Detail
      xGrid.value.reloadData(detail.value)
    } else {
      ElMessage.warning(res.msg)
    }
  })
}
//判断完工次破数量是否满足条件
const verifyNum = () => {
  const $grid = xGrid.value
  const table = $grid.getTableData().fullData
  let sum = 0;
  let sumBreak = 0;
  table.forEach((item) => {
    if (item.completedQuantity == null || item.completedQuantity == "") {
      item.completedQuantity = 0;
    }
    if (item.breakageQuantity == null || item.breakageQuantity == "") {
      item.breakageQuantity = 0;
    }
    if (item.quantity < item.completedQuantity) {
      ElMessage.success("序号" + item.order_number + "的数量不能大于上工序数量")
    } else if (item.breakageQuantity * 1 + item.completedQuantity * 1 > item.quantity * 1) {
      ElMessage.success("请输入序号" + item.order_number + "正确的完工或次破数量")
    }
    sum = item.completedQuantity * 1 + sum * 1
    sumBreak = item.breakageQuantity * 1 + sumBreak * 1
  })
  titleUploadData.value.thisCompletedQuantity = sum
  titleUploadData.value.thisWornQuantity = sumBreak
}
//获取当前时间
function formatCurrentTime() {
  let dateObj = new Date(); // 创建一个表示当前时间的Date对象
  let year = dateObj.getFullYear(); // 年份
  let month = (dateObj.getMonth() + 1).toString().padStart(2, '0'); // 月份(注意需要加上1)
  let day = dateObj.getDate().toString().padStart(2, '0'); // 天数
  let hours = dateObj.getHours().toString().padStart(2, '0'); // 小时
  let minutes = dateObj.getMinutes().toString().padStart(2, '0'); // 分钟
  let seconds = dateObj.getSeconds().toString().padStart(2, '0'); // 秒数
  if(parseInt(hours)>=17 && parseInt(hours)<8)titleUploadData.value.classes='晚班'
  return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; // 返回格式化后的时间字符串
}
const editClosedEvent = ({ row, column }) => {
  if (column.property==='completedQuantity') {
    xGrid.value.getTableData().fullData.forEach((item, index) =>{
      if(item.order_number===row.order_number){
        item.completedQuantity=row.completedQuantity
      }
    })
    getQuantity()
  }
}
const  getQuantity = () => {
  titleUploadData.value.thisCompletedQuantity = 0
  titleUploadData.value.thisWornQuantity = 0
  const arr = xGrid.value.getTableData().fullData
  const returnArr =  arr.filter((obj, index, self) =>
      self.findIndex((t) => t.order_number === obj.order_number) === index
  )
  let sumBreak = 0
  let sumQuantity = 0
  returnArr.forEach((item)=>{
    sumQuantity+=Number(item.completedQuantity*1)
  })
  arr.forEach((item)=>{
    sumBreak+=Number(item.breakageQuantity) || 0
  })
  titleUploadData.value.thisCompletedQuantity = sumQuantity
  titleUploadData.value.thisWornQuantity = sumBreak
}
const changeTable=()=>{
  const $grid = xGrid.value
  this.$grid.commitProxy('data', yourData)
}
</script>
<template>
<div>
  <div id="head">
    <el-input placeholder="流程卡号" v-model="form.lckh" style="width: 200px"/>
    &nbsp;
  <div style="height: 100%;width: 100%">
    <div id="head" style="height: 5%;width: 100%;margin-bottom: 5px">
      <el-input :disabled="inputDisabled" v-if="titleUploadData.reportingWorkId" v-model="titleUploadData.reportingWorkId" placeholder="报工编号" style="width: 200px" />
      <el-input :disabled="inputDisabled" v-model="titleUploadData.processId" placeholder="流程卡号" style="width: 200px" @keyup.enter.native="getWork();getQuantity()"/>
      &nbsp;
      <el-select :disabled="inputDisabled" v-model="titleUploadData.thisProcess" clearable placeholder="请选择工序" style="width: 120px"
                 @change="getWork();getQuantity()">
        <el-option
            v-for="item in titleSelectJson['processType']"
            :key="item.id"
            :label="item.basic_name"
            :value="item.basic_name"
        />
      </el-select>
      &nbsp;
      <el-button :disabled="disabledFlag" :loading="loadingFlag" @click="reviewReportingWork" type="primary">{{$t('reportingWorks.passAudit')}}
      </el-button>
<!--      <el-button type="primary">审核不通过</el-button>-->
      &nbsp;
      <label>{{$t('reportingWorks.processCardArea')}}:</label>
    </div>
    <div style="background-color: white;margin-bottom: 5px;height: 17%;width: 100%">
      <el-row>
        <el-col :span="2">
          <el-text>{{$t('order.orderId')}}:</el-text>
        </el-col>
        <el-col :span="3">
          <el-text>{{ titleUploadData.orderId }}</el-text>
        </el-col>
        <el-col :span="2">
          <el-text>{{$t('workOrder.productionId')}}:</el-text>
        </el-col>
        <el-col :span="3">
          <el-text>{{ titleUploadData.productionId }}</el-text>
        </el-col>
        <el-col :span="2">
          <el-text>{{$t('processCard.customerId')}}:</el-text>
        </el-col>
        <el-col :span="2">
          <el-text>{{ titleUploadData.order.customerId }}</el-text>
        </el-col>
        <el-col :span="2">
          <el-text>{{$t('processCard.customerName')}}:</el-text>
        </el-col>
        <el-col :span="3">
          <el-text class="customClass"></el-text>
        </el-col>
        <el-col :span="2">
          <el-text>{{$t('order.project')}}:</el-text>
        </el-col>
        <el-col :span="3">
          <el-text wrap-text="false">{{ titleUploadData.order.project }}</el-text>
        </el-col>
    <select class="processesSt">
      <option>报工工序</option>
      <option value="切割">切割</option>
      <option value="磨边">磨边</option>
      <option value="钢化">钢化</option>
    </select>
    &nbsp;
    <el-button type="primary">审核通过</el-button>
    <el-button type="primary">审核不通过</el-button>
    &nbsp;
    <label>流程卡面积:xxx平方米</label>
  </div>
  <div>
    <table id="titleTable" style="border: 1px solid black;">
      <tr>
        <td>销售单号</td>
        <td>NG23120801</td>
        <td>生产订单号</td>
        <td>NG23120801A</td>
        <td>客户编码</td>
        <td>123213</td>
        <td>客户名称</td>
        <td>xxxx</td>
        <td>项目名称</td>
        <td>xxxxxxx</td>
      </tr>
      <tr>
        <td>报工设备</td>
        <td>中空一线</td>
        <td>上工序</td>
        <td>钢化</td>
        <td>可报工数量</td>
        <td>12</td>
        <td>本工序完工</td>
        <td>11</td>
        <td>本工序次破</td>
        <td>1</td>
      </tr>
      <tr>
        <td>报工班组</td>
        <td>中空一班</td>
        <td>班次</td>
        <td>早班</td>
        <td>下工序</td>
        <td>包装</td>
        <td>报工时间</td>
        <td><input class="chaxun" id="bgsj" maxlength="255"  type="datetime-local" name="bgsj"></td>
        <td>备注</td>
        <td>1</td>
      </tr>
      <tr>
        <td>单片次破</td>
        <td>
          <el-select v-model="value" placeholder="允许" >
      </el-row>
      <el-row>
        <el-col :span="2">
          <el-text>{{$t('reportingWorks.deviceType')}}:</el-text>
        </el-col>
        <el-col :span="3">
          <el-select @change="getQuantity" v-model="titleUploadData.deviceName" clearable :placeholder="$t('reportingWorks.pleaseDevice')">
            <el-option
              v-for="item in options"
              :key="item.value"
              :label="item.label"
              :value="item.value">
            </el-option>
                v-for="item in titleSelectJson['deviceType']"
                :key="item.id"
                :label="item.basicName"
                :value="item.basicName"
            />
          </el-select>
        </td>
        </el-col>
        <el-col :span="2">
          <el-text>{{$t('reportingWorks.previousProcess')}}:</el-text>
        </el-col>
        <el-col :span="3">
        <td></td>
        <td></td>
        <td></td>
          <el-text>{{ titleUploadData.previousProcess }}</el-text>
        </el-col>
        <el-col :span="2">
          <el-text>{{$t('reportingWorks.numberReported')}}:</el-text>
        </el-col>
        <el-col :span="2">
          <el-text>{{ titleUploadData.previousProcessQuantity }}</el-text>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
        <td></td>
      </tr>
    </table>
  </div>
  <div class="main-div-customer">
    <vxe-grid
        max-height="100%"
        min-height="100px"
        @filter-change="filterChanged"
        class="mytable-scrollbar"
        ref="xGrid"
        v-bind="gridOptions"
        size="small"
        </el-col>
        <el-col :span="2">
          <el-text>{{$t('reportingWorks.thisCompletedQuantity')}}:</el-text>
        </el-col>
        <el-col :span="3">
          <el-text>{{ titleUploadData.thisCompletedQuantity }}</el-text>
        </el-col>
        <el-col :span="2">
          <el-text>{{$t('reportingWorks.thisWornQuantity')}}:</el-text>
        </el-col>
        <el-col :span="3">
          <el-text>{{ titleUploadData.thisWornQuantity }}</el-text>
        </el-col>
    >
      <!--      @toolbar-button-click="toolbarButtonClickEvent"-->
      <!--      下拉显示所有信息插槽-->
      <template #content="{ row }">
        <ul class="expand-wrapper">
          <li  v-for="(item,index) in gridOptions.columns" v-show="item.field!=undefined ">
            <span style="font-weight: bold">{{item.title+':  '}}</span>
            <span>{{ row[item.field] }}</span>
          </li>
        </ul>
      </template>
      </el-row>
      <el-row>
        <el-col :span="2">
          <el-text>{{$t('reportingWorks.teamsType')}}:</el-text>
        </el-col>
        <el-col :span="3">
          <el-select  v-model="titleUploadData.teamsGroupsName" clearable :placeholder="$t('reportingWorks.selectTeam')">
            <el-option
                v-for="item in titleSelectJson['teamsType']"
                :key="item.id"
                :label="item.basicName"
                :value="item.basicName"
            />
          </el-select>
        </el-col>
        <el-col :span="2">
          <el-text>{{$t('reportingWorks.classes')}}:</el-text>
        </el-col>
        <el-col :span="3">
          <el-select v-model="titleUploadData.classes" class="processesSt" :placeholder="$t('reportingWorks.selectClasses')">
            <el-option
                v-for="item in classesOption"
                :key="item.value"
                :label="item.label"
                :value="item.value"
            />
          </el-select>
        </el-col>
        <el-col :span="2">
          <el-text>{{$t('reportingWorks.nextProcess')}}:</el-text>
        </el-col>
        <el-col :span="2">
          <el-text>{{ titleUploadData.nextProcess }}</el-text>
      <!--左边固定显示的插槽-->
      <template #button_slot="{ row }">
        <el-button @click="getTableRow(row,'edit')" link type="primary" size="small">打印</el-button>
        <el-button @click="getTableRow(row,'setType')" link type="primary" size="small">排版</el-button>
        <el-button @click="getTableRow(row,'delete')" link type="primary" size="small">删除</el-button>
      </template>
        </el-col>
        <el-col :span="2">
          <el-text>{{$t('reportingWorks.reportingWorkTime')}}:</el-text>
        </el-col>
        <el-col :span="3">
          <el-date-picker
              v-model="titleUploadData.reportingWorkTime"
              format="YYYY-MM-DD HH:mm:ss"
              value-format="YYYY-MM-DD HH:mm:ss"
              placeholder=""
              style="width: 100%"
              type="datetime"
          />
        </el-col>
        <el-col :span="2">
          <el-text>{{$t('basicData.remarks')}}:</el-text>
        </el-col>
        <el-col :span="3">
          <el-input v-model="titleUploadData.notes" placeholder="" />
        </el-col>
      <template #num1_filter="{ column, $panel }">
        <div>
          <div v-for="(option, index) in column.filters" :key="index">
            <input type="type" v-model="option.data" @input="changeFilterEvent($event, option, $panel)"/>
      </el-row>
    </div>
    <div class="main-div-customer" style="width: 100%;height: 70%">
      <vxe-grid
          ref="xGrid"
          class="mytable-scrollbar"
          max-height="100%"
          height="400px"
          size="small"
          v-bind="gridOptions"
          v-on="gridEvents"
          @edit-closed="editClosedEvent"
      >
        <template #num1_filter="{ column, $panel }">
          <div>
            <div v-for="(option, index) in column.filters" :key="index">
              <input v-model="option.data" type="type" @input="changeFilterEvent($event, option, $panel)"/>
            </div>
          </div>
        </div>
      </template>
        </template>
    </vxe-grid>
      </vxe-grid>
      <el-dialog
          @opened="openedBrokenTable"
          :before-close="checkClose"
          v-model="brokenVisible"
          :close-on-click-modal="false"
          :close-on-press-escape="false"
          :title="$t('reportingWorks.damageList')+':'
          +brokenRow.glass_child+'.'+brokenRow.order_number+'.'+brokenRow.technology_number"
          style="width: 80%;height:75% ">
        <vxe-grid
            height="400px"
            ref="brokenGrid"
            class="mytable-scrollbar"
            v-bind="brokenGridOptions"
            v-on="brokenGridEvents">
          <!--        返回工序-->
          <template #returnProcess="{ row }">
            <vxe-select v-model="row.returnProcess"
                        filterable
                        clearable
                        placeholder="" >
              <vxe-option v-for="item in computedReturnProcess(row.available)"
                          :key="item.basic_category"
                          :label="item.basic_category"
                          :value="item.basic_category"/>
            </vxe-select>
          </template>
          <template #returnProcess_default="{ row }">
            <span>{{ row.returnProcess }}</span>
          </template>
          <!--        责任工序-->
          <template #responsibleProcess="{ row }">
            <vxe-select v-model="row.responsibleProcess"
                        filterable
                        clearable
                        placeholder="" >
              <vxe-option v-for="item in titleSelectJson.historyProcess"
                          :key="item.basic_category"
                          :label="item.basic_category"
                          :value="item.basic_category"/>
            </vxe-select>
          </template>
          <template #responsibleProcess_default="{ row }">
            <span>{{ row.responsibleProcess }}</span>
          </template>
          <!--     刺破类型breakageType   -->
          <template #breakageType="{ row }">
            <vxe-select v-model="row.breakageType "
                        filterable
                        clearable
                        placeholder="">
              <vxe-option v-for="item in titleSelectJson.breakageType" :key="item.id" :label="item.basic_name" :value="item.basic_name"/>
            </vxe-select>
          </template>
          <template #breakageType_default="{ row }">
            <span>{{ row.breakageType }}</span>
          </template>
          <!--次破原因-->
          <template #breakageReason="{ row }">
            <vxe-select v-model="row.breakageReason "
                        filterable
                        clearable
                        placeholder="">
              <vxe-option v-for="item in titleSelectJson.breakageReason" :key="item.id" :label="item.basic_name" :value="item.basic_name"/>
            </vxe-select>
          </template>
          <template #breakageReason_default="{ row }">
            <span>{{ row.breakageReason }}</span>
          </template>
          <!--     责任设备    -->
          <template #reportingDeviceSort="{ row }">
            <vxe-select v-model="row.responsibleEquipment"
                        filterable
                        clearable
                        placeholder="">
              <vxe-option v-for="item in computedDevice(row.responsibleProcess)" :key="item.id" :label="item.basic_name" :value="item.basic_name"/>
            </vxe-select>
          </template>
          <template #reportingDeviceSort_default="{ row }">
            <span>{{ row.responsibleEquipment }}</span>
          </template>
          <!--     责任设备    -->
          <template #responsibleTeam="{ row }">
            <vxe-select v-model="row.responsibleTeam"
                        filterable
                        clearable
                        placeholder="">
              <vxe-option v-for="item in computedResponsibleTeam(row.responsibleProcess)" :key="item.id" :label="item.basic_name" :value="item.basic_name"/>
            </vxe-select>
          </template>
          <template #responsibleTeam_default="{ row }">
            <span>{{ row.responsibleTeam }}</span>
          </template>
          <!--   可利用       -->
          <template #available="{ row }">
            <el-checkbox v-model="row.available" />
          </template>
        </vxe-grid>
      </el-dialog>
    </div>
  </div>
</div>
</template>
<style scoped>
.processCard{
.processCard {
  width: 140px;
}
.processesSt{
.processesSt {
  height: 33px;
  width: 80px;
  width: 120px;
  background-color: #409eff;
  color: white;
  border: none;
  border-radius: 5px;
}
#titleTable tr,#titleTable td{
#titleTable tr, #titleTable td {
  border: 1px solid #000;
}
#titleTable{
#titleTable {
  border-collapse: collapse;
  text-align: center;
  width: 100%;
  height: 100%;
}
#titleTable td{
#titleTable td {
  width: 100px;
  height: 30px;
}
#titleTable td:nth-child(1){
#titleTable td:nth-child(1) {
  width: 100px;
  height: 30px;
}
#titleTable td:nth-child(2){
#titleTable td:nth-child(2) {
  width: 100px;
}
.chaxun{
  background-color:#D5EAFF;
.chaxun {
  background-color: #D5EAFF;
  border: none;
}
.customClass {
  white-space: nowrap; /* 不换行 */
}
.el-text {
}
.el-col .el-select {
  width: 100%;
  height: 100%;
}
.el-col {
  text-align: center;
  border: #181818 1px solid;
}
.vxe-grid {
  /* 禁用浏览器默认选中 */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
</style>