<template>
  <!-- 供应商面板 -->
  <div class="container">
    <supplierList class="common-width"></supplierList>
    <!-- 供应商注册统计 -->
    <supplierCount class="common-width" type="supplier" />
    <!-- 供应商状态统计 -->
    <supplierStatus class="common-width" />
    <!-- 供应商资料预审统计 -->
    <supplier-common
      class="common-width"
      name="供应商资料预审统计"
      :fetchdata="getPreReview"
      :legendDefault="['资料预审个数','预审通过率']"
    />
    <!-- 供应商录库评审统计 -->
    <supplier-common
      class="common-width"
      name="供应商录库评审统计"
      :fetchdata="getInputReview"
      :legendDefault="['录库评审个数','录库评审通过率']"
    />
    <!-- 评价统计 -->
    <supplierEvaluation class="common-width" />
    <!-- 供应商年度考核统计 -->
    <supplierAssessment class="common-width" />
    <!-- 设备注册数量统计 -->
    <supplierCount class="common-width" type="device" />
    <!-- 设备注册排行榜 -->
    <layoutChartVerticalBar class="common-width" type="register" />
  </div>
</template>

<script>
import supplierList from "./components/supplierList.vue";
import supplierCount from "./components/supplierCount.vue";
import supplierStatus from "./components/supplierStatus.vue";
import SupplierCommon from "./components/supplierCommon.vue";
import supplierEvaluation from "./components/supplierEvaluation.vue";
import supplierAssessment from "./components/supplierAssessment.vue";
import layoutChartVerticalBar from "./components/layoutChartVerticalBar.vue";
import { getPreReview, getInputReview } from "@/api/cockpit/cockpit";
export default {
  name: "supplierPanel",
  components: {
    supplierList,
    supplierCount,
    supplierStatus,
    SupplierCommon,
    supplierEvaluation,
    supplierAssessment,
    layoutChartVerticalBar,
  },
  methods: {
    getPreReview: getPreReview,
    getInputReview: getInputReview,
  },
};
</script>

<style lang="scss" scoped>
.container {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  overflow-x: hidden;
  .common-width {
    width: 33%;
  }
}
</style>