<template>
  <div>
    <van-list
      v-model="loading"
      :finished="finished"
      :immediate-check="false"
      finished-text="没有更多了"
      @load="onLoad"
    >
      <van-cell v-for="(item, index) in dataList" :key="index" class="cell">
        <!-- <a :href="item.URL_COMP"> -->
        <div @click="goNewHome(item)">
          <div class="custom-title">{{ item.TITLE }}</div>
          <div class="custom-time">{{ item.PUBLISHED_TIME_FORMATED }}</div>
        </div>
      </van-cell>
    </van-list>
  </div>
</template>

<script>
import Vue from "vue";
import { List, PullRefresh, Cell } from "vant";
Vue.use(List)
  .use(PullRefresh)
  .use(Cell);
import { dockAuth, doGetByChannel } from "@/api/column";
export default {
  name: "Column",
  data() {
    return {
      getList: {
        channelId: "",
        currentPage: 1,
        number: 10,
        token: "",
      },
      dataList: [],
      loading: true,
      finished: false,
      refreshing: false,
    };
  },
  async created() {
    await dockAuth().then((res) => {
      this.getList.token = res.data.data;
    });
    this.getList.channelId = this.$route.query.columnId;
    console.log(this.$route);
    await this.init();
  },
  mounted() {
    if (window.android !== undefined) {
      window.android.changeTitle(this.filetColumn(this.$route.query.columnId));
    } else if (window.webkit) {
      window.webkit &&
        window.webkit.messageHandlers.changeTitle.postMessage(
          this.filetColumn(this.$route.query.columnId)
        );
    }
  },

  methods: {
    filetColumn(columnId) {
      switch (columnId) {
        case "8882678f335e4f838f7f55e6eb13c44f":
          return "图片新闻";
        case "255d3dd56aeb448fa1524d5363d5f850":
          return "镇江要闻";
        case "6884533d937f493faa1553d371629bb1":
          return "深度报道";
        case "76b115156e6b42509f0c1994b4fc1c4a":
          return "区县动态";
        case "d34942e593b943cb97758a9df231bcc1":
          return "部门讯息";
        case "ea6487bf681045af9df8136608b70b4c":
          return "公告公示";
        case "8d430964d5084d66b66f2c02912b1d1d":
          return "视频新闻";
        case "c8ba4274cba14f46ad485b95a0d86a16":
          return "电子报刊";
        case "2c9c7b0ef8484a3ab397f69ee2146e22":
          return "新闻发布会";
        case "7b9d7c6178504bfa954fb9ba244bb8ab":
          return "政务专栏";
        default:
          return "镇合意";
      }
    },
    init() {
      doGetByChannel(this.getList).then((res) => {
        this.dataList = res.data.data.page.list;
        this.loading = false;
      });
    },
    async onLoad() {
      this.loading = true;
      this.getList.currentPage++;
      await doGetByChannel(this.getList).then((res) => {
        this.loading = false;
        if (res.data.data.page.list.length <= 9) {
          this.finished = true;
        }
        this.dataList = res.data.data.page.list;
      });
    },
    goNewHome(val) {
      if (val.TITLE == "疫情防控专栏" ||
        val.TITLE == "镇江市政府网站年度工作报表" ||
        val.TITLE == "扫黑除恶镇江在行动") {
          const url ="http://www.zhenjiang.gov.cn/" + val.URL_COMP;
          window.location.assign(url)
      }else {
          const url = val.URL_COMP;
          window.location.assign(url)
      }
    },
  },
};
</script>

<style lang="stylus" scoped>
.van-list {
  font-size: 32px;
  background-color #fff
  height 100vh;
  overflow auto
  .cell {
    padding: 40px;
    box-sizing border-box
    border-bottom 1px solid #C0C0C0
    a {
      display block
    }
    .custom-time {
      color #808080
      text-align right
      margin-top 20px
    }
  }
}
.van-pull-refresh {
  height calc(100vh) !important
  overflow auto !important
}
.custom-title {
  font-size 32px
  font-weight bold
}
</style>
