<template>
  <div class="screen-common-component" style="padding: 8px 25px">
    <ScreenComHeader :module-id="moduleId" title="第n周不良10" />
    <dv-scroll-ranking-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 { top10UnqualifiedProduct } from "@/api/screens";
const bigScreenData: any = inject("bigScreenData");
const config = ref({});

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

onMounted(async () => {
  let res: any = await top10UnqualifiedProduct();
  config.value = {
    rowNum: 2,
    fontSize: bigScreenData.value.fontSize * 2,
    data: res?.data ?? [],
  };
});
</script>
