<template>
  <div class="LeftAreaContainer">
    <ContentTop
      title="人均体育场地面积排行"
      :topOptionsProps="cityActiveOptionProps"
      :type="2"
    />
    <div class="rank-list" style="margin-top: 21px;">
      <rank-list :listHeight="474" :tableTitle="tableTitle" />
    </div>
  </div>
</template>
          
          <script>
import ContentTop from "@/components/contentTop";
import rankList from "@/components/rankList";
export default {
  components: {
    ContentTop,
    rankList,
  },
  data() {
    return {
      // 市级协会赛事活动排名 top下拉
      cityActiveOptionProps: {
        selects: [
          {
            name: "cityTopSelect",
            options: [{ value: 1, label: "红榜" }],
          },
        ],
      },
      tableTitle: [
        {
          title: "排名",
          width: "80",
        },
        {
          title: "场地名称",
          val: "first",
          width: "100",
        },
        {
          title: "人均场地面积 (㎡)",
          val: "second",
          width: "140",
        },
        {
          title: "较去年",
          val: "three",
          width: "120",
        },
      ],
    };
  },
};
</script>
          
          <style lang="scss" scoped>
@import "../../../assets/scss/index.scss";
.LeftAreaContainer {
}
</style>
          