<script lang="jsx">
import InfoGroup from "@/components/InfoGroup/index.vue";
import { formatStake } from "@/utils/road";

export default {
  name: "TempWeatherClusterPopupContent",
  props: {
    data: {
      type: Object,
      required: true,
    },
  },
  render() {
    const { data } = this;
    if (!data) {
      return null;
    }
    const { point_count, maxStake, minStake } = data;
    const arr = [
      {
        label: "桩号",
        content: `${formatStake(minStake)}~${formatStake(maxStake)}`,
      },
    ];
    const title = `${formatStake(minStake)}~${formatStake(
      maxStake
    )}范围有${point_count}个气象监测点`;
    return <InfoGroup cols={1} title={title} data={arr} />;
  },
};
</script>
