<template>
  <div id="detail">
    <policy-detail
      :info="info"
      :zongheList="zongheList"
      :contentList="contentList"
      :total="total"
      :columnName="columnName"
      :liebiaoList="liebiaoList"
      @clickLists="submit"
    ></policy-detail>
  </div>
</template>

<script>
import policyDetail from '@/components/policy/policy.vue';
import { createNamespacedHelpers, mapGetters } from 'vuex';
const { mapActions: mapSite } = createNamespacedHelpers('site');
const { mapActions: mappolicyColumn } = createNamespacedHelpers('policyColumn');
const { mapActions: mappolicyNews } = createNamespacedHelpers('policyNews');
export default {
  name: 'detail',
  props: {},

  components: {
    policyDetail,
  },
  data: () => ({
    liebiaoList: [],
    info: {},
    zongheList: {},
    contentList: [],
    total: 1,
    leftId: '',
    columnName: '',
  }),
  created() {
    this.searchSite();
    this.policyColumn();
  },
  computed: {},
  methods: {
    ...mapSite(['showInfo']),
    ...mappolicyColumn({ policyColumns: 'query', policyfetch: 'fetch' }),
    ...mappolicyNews({ policyNew: 'query' }),
    // 查询站点信息
    async searchSite() {
      let res = await this.showInfo();
      let object = JSON.parse(JSON.stringify(res.data));
      if (object) {
        this.$set(this, `info`, res.data);
      } else {
        this.$message.error(res.errmsg ? res.errmsg : 'error');
      }
    },
    async policyColumn({ ...info } = {}) {
      const res = await this.policyColumns({ ...info });
      if (this.$checkRes(res)) {
        this.$set(this, `liebiaoList`, res.data);
      }
    },
    submit({ id }) {
      this.$set(this, `leftId`, id);
      this.searchRight();
    },
    async searchRight({ skip = 0, limit = 10, column_id } = {}) {
      const res = await this.policyNew({ skip, limit, column_id: this.leftId });
      for (const val of res.data) {
        const result = await this.policyfetch(val.column_id);
        val.column_name = result.data.name;
      }
      this.$set(this, `contentList`, res.data);
      this.$set(this, `total`, res.data.length);
      for (const val of res.data) {
        this.$set(this, `columnName`, val.column_name);
      }
    },
  },
};
</script>

<style lang="scss" scoped></style>
