机器开机率、人员技能比饼图优化

yangfeng

2023-12-11 14101bd42ce17dfb9d951d0738abe9d303fb3fe5

 src/views/cockpitPage/components/StatisticalBox.vue

@@ -2,14 +2,17 @@
  <div class="statistical-box">
    <div v-for="item in allList" class="all-bg">
      <div class="box">
        <div class="commom-title">{{ item.title }}</div>
        <div class="commom-title">{{ item.label }}</div>
        <div
          v-if="item.label == '物料不足/待排程'"
          class="commom-value redColor"
        >
          {{ item.value }}/{{ item.value1 }}
        </div>
        <div
          v-else
          class="commom-value"
          :class="
            item.title == '延期交付' || item.title == '物料不足'
              ? 'redColor'
              : ''
          "
          :class="item.label == '延期交付' ? 'redColor' : ''"
        >
          {{ item.value }}
        </div>
@@ -21,18 +24,40 @@
<script>
export default {
  components: {},
  props: {},
  data() {
    return {
      allList: [
        { title: "开机台数", value: 200 },
        { title: "总产量", value: 1200 },
        { title: "生产工单数", value: 200 },
        { title: "延期交付", value: 20 },
        { title: "物料不足", value: 10 },
        { title: "计划达成率", value: 2 },
  props: {
    allList: {
      type: Array,
      default: () => [
        {
          value: 200,
          label: "开机台数",
        },
        {
          value: 1200,
          label: "总产量",
        },
        {
          value: 200,
          label: "生产工单数",
        },
        {
          value: 20,
          label: "延期交付",
        },
        {
          value: 10,
          value1: 0,
          label: "物料不足/待排程 ",
        },
        {
          value: 2,
          label: "计划达成率",
        },
      ],
    };
    },
  },
  data() {
    return {};
  },
  mounted() {},
  watch: {},