yudao-init/src/views/copilot/efficiency/components/StdRate.vue

<!-- 
    filename: StdRate.vue
    author: liubin
    date: 2024-04-29 08:50:43
    description: 标准组件良率
-->

<template>
  <div class="std-rate">
    <div class="span-2">
      <StdRateItem :city="cities[5]" />
    </div>
    <div
      v-for="item in cities.filter((val, index) => index != 5)"
      :key="item.name"
    >
      <StdRateItem :city="item" />
    </div>
  </div>
</template>

<script>
import StdRateItem from "./sub/std/StdRateItem.vue";
export default {
  name: "StdRate",
  components: { StdRateItem },
  props: {},
  data() {
    return {
      cities: [
        { name: "瑞昌", target: 100, total: 200, thisYear: 20 },
        { name: "邯郸", target: 200, total: 300, thisYear: 20 },
        { name: "株洲", target: 300, total: 400, thisYear: 20 },
        { name: "佳木斯", target: 400, total: 500, thisYear: 20 },
        { name: "成都", target: 500, total: 600, thisYear: 20 },
        { name: "凯盛光伏", target: 400, total: 500, thisYear: 20 },
        { name: "蚌埠", target: 500, total: 600, thisYear: 20 },
      ],
    };
  },
  computed: {},
  methods: {},
};
</script>

<style scoped lang="scss">
.std-rate {
  display: grid;
  gap: 8px;
  grid-template-columns: repeat(2, 1fr);
  grid-template-rows: repeat(4, 1fr);
}

.span-2 {
  grid-column: span 2;
}
</style>