钣金统计表-标红数据

zhanghl

2025-04-17 f25793562bea171eb5bae30bfd107495100b3707

钣金统计表-标红数据

 src/views/mainPlan/plateProcessStat/index.vue

@@ -166,16 +166,19 @@
    title: '工序总工时',
    field: 'processTotalTime',
    width: 100,

  },
  {
    title: '计划开工日',
    field: 'processPlanStartDay',
    field: 'processPlanStartDaytxt',
    width: 200,
    type:'html'
  },
  {
    title: '计划完工日',
    field: 'processPlanEndDay',
    field: 'processPlanEndDaytxt',
    width: 200,
    type:'html'
  },
  {
    title: '订单完工日',
@@ -190,7 +193,13 @@
function getList() {
  loading.value = true;
  listPlateStat(queryParams.value).then(response => {
    aps_plate_process_statList.value = response.rows;
    const listValue = response.rows;
    listValue.forEach(listItem => {
      listItem[`processPlanStartDaytxt`]= listItem.warning? `<font color="red">${listItem.processPlanStartDay}</font>`  :listItem.processPlanStartDay;
      listItem[`processPlanEndDaytxt`]= listItem.warning? `<font color="red">${listItem.processPlanEndDay}</font>`  :listItem.processPlanEndDay;
    });
    aps_plate_process_statList.value =listValue
    debugger;
    total.value = response.total;
    loading.value = false;
  });
@@ -232,6 +241,7 @@

/** 重置按钮操作 */
function resetQuery() {
  queryParams.value.workOrderNo ='';
  proxy.resetForm("queryRef");
  handleQuery();
}
@@ -301,6 +311,39 @@
    ...queryParams.value
  }, `aps_plate_process_stat_${new Date().getTime()}.xlsx`)
}

const headerCellClassName = ({ column }) => {
  if (column.field === 'name') {
    return 'col-blue'
  }
  return null
}
const rowClassName = ({ rowIndex }) => {
  if ([2, 3, 5].includes(rowIndex)) {
    return 'row-green'
  }
  return null
}
const cellClassName = ({ row, column }) => {
  if (column.field === 'processPlanStartDay'||column.field === 'processPlanEndDay') {
    if (row.warning) {
      return 'col-orange'
    }
  }
  return null
}
getList();
</script>
<style lang="scss" scoped>
::v-deep(.mytable-style.vxe-table .vxe-body--row.row-green) {
  background-color: #187;
  color: #fff;
}
::v-deep(.mytable-style.vxe-table .vxe-header--column.col-blue) {
  background-color: #2db7f5;
  color: #fff;
}
::v-deep(.mytable-style.vxe-table .vxe-body--column.col-red) {
  background-color: red;
  color: #fff;
}
</style>