<!-- 
    filename: ChipRate.vue
    author: liubin
    date: 2024-04-29 08:50:54
    description: 芯片良率
-->

<template>
  <div class="chip-rate">
    <ChipRateItem
      :period="period"
      :cities="['成都', '邯郸', '株洲', '瑞昌']"
      :color="1"
    />
    <ChipRateItem
      :period="period"
      :cities="['佳木斯', '凯盛光伏', '蚌埠兴科']"
      :color="2"
    />
  </div>
</template>

<script>
import ChipRateItemVue from "./sub/chip/ChipRateItem.vue";
export default {
  name: "ChipRate",
  components: { ChipRateItem: ChipRateItemVue },
  props: {
    period: {
      type: String,
      default: "日",
    },
  },
  data() {
    return {};
  },
  computed: {},
  methods: {},
};
</script>

<style scoped lang="scss">
.chip-rate {
  flex: 1;
  display: flex;
  gap: 5px;
  position: relative;

  &:after {
    content: "";
    position: absolute;
    left: 50%;
    top: 0;
    width: 3px;
    height: 100%;
    transform: translateX(-50%);
    background: linear-gradient(to bottom, transparent, #00f2ff, transparent);
  }
}
</style>
