fix: 完成生产数据分析页面

spring

6 天以前 8a3bfdab689684fe5ee19b2f69842e450fc7c60a

 src/views/productionManagement/productionOrder/index.vue

@@ -50,6 +50,7 @@
                :tableData="tableData"
                :page="page"
                :tableLoading="tableLoading"
                :row-class-name="tableRowClassName"
                @pagination="pagination">
        <template #completionStatus="{ row }">
          <el-progress
@@ -163,6 +164,12 @@
      width: 120,
    },
    {
      label: "交付日期",
      prop: "deliveryDate",
      formatData: val => (val ? dayjs(val).format("YYYY-MM-DD") : ""),
      width: 120,
    },
    {
      dataType: "action",
      label: "操作",
      align: "center",
@@ -228,6 +235,21 @@
    if (p < 50) return "#e6a23c";
    if (p < 80) return "#409eff";
    return "#67c23a";
  };

  // 添加表行类名方法
  const tableRowClassName = ({ row }) => {
    const diff = row.deliveryDaysDiff;

    if (diff === 15) {
      return 'yellow';
    } else if (diff === 10) {
      return 'pink';
    } else if (diff === 2) {
      return 'purple';
    } else if (diff < 2) {
      return 'red';
    }
  };

  // 绑定工艺路线弹框
@@ -388,4 +410,21 @@
<style scoped lang="scss">
.search_form{
  align-items: start;
}</style>
}

::v-deep .yellow {
  background-color: #FAF0DE;
}

::v-deep .pink {
  background-color: #FAE1DE;
}

::v-deep .red {
  background-color: #f80202;
}

::v-deep .purple{
  background-color: #F4DEFA;
}
</style>