<template>
  <div class="screen-common-component">
    <ScreenComHeader
      :module-id="moduleId"
      align="start"
      title="生产计划完成情况"
    />
    <dv-scroll-board
      :config="config"
      style="width: 100%; height: calc(100% - 32px)"
    />
  </div>
</template>

<script lang="ts" setup>
import ScreenComHeader from "@/views/screens/configs/screenComHeader.vue";
import { productionPlan } from "@/api/screens";
import { useDictionaryStore } from "@/store";

const config = ref({});
const dictS = useDictionaryStore();

const props = defineProps({
  moduleId: {
    type: String,
    required: true,
  },
});

onMounted(async () => {
  let res = await productionPlan();
  if (res.data.length > 0) {
    let dicts = {
      orderName: "订单名称",
      orderNum: "订单数量",
      orderState: "订单状态",
      materialName: "物料名称",
      projectCode: "项目编号",
    };

    let bigData: any[] = [];
    res.data.forEach((item: any) => {
      let row = [
        item.orderName,
        item.orderNum,
        dictS.getLableByValue("plan_order_state", item.orderState),
        item.materialName,
        item.projectCode,
      ];
      bigData.push(row);
    });

    config.value = {
      header: Object.values(dicts),
      data: bigData,
      index: true,
      // columnWidth: [50],
      align: ["left"],
      carousel: "page",
    };
  }
});
</script>
