<template>
  <div id="list">
    <listDetail
      :title="title"
      :topinfo="site"
      :menulist="menu"
      :bannerinfo="master.bannerinfo"
      :noticelist="list"
      :footinfo="site"
      :totalRow="totalRow"
      @search="search"
    ></listDetail>
  </div>
</template>

<script>
import listDetail from '@publics/src/views/master/notice/list.vue';
import { mapActions, mapState } from 'vuex';
import { masterInfo } from '@/config/master-info';

export default {
  name: 'list',
  props: {},
  components: {
    listDetail,
  },
  async created() {
    await this.getSite();
    await this.getMenu();
    this.masterData();
    await this.search();
  },
  data: () => ({
    site: {},
    master: { ...masterInfo },
    menu: [],
    list: [],
    totalRow: 0,
  }),
  computed: {
    parent_id() {
      return this.$route.params.parent_id;
    },
    news_type() {
      return this.$route.query.news_type;
    },
    title() {
      return this.$route.query.title;
    },
  },
  watch: {
    parent_id: 'search',
  },
  methods: {
    ...mapActions(['newsOperation', 'siteOperation', 'moduleOperation', 'columnOperation', 'menuOperation']),
    //获取站点信息
    async getSite() {
      let site = sessionStorage.getItem('site');
      if (!site) {
        let result = await this.siteOperation({ type: 'search', data: { site: this.$site } });
        if (`${result.errcode}` === `0`) {
          sessionStorage.setItem('site', JSON.stringify(result.data));
          this.$set(this, `site`, result.data);
        }
      } else {
        this.$set(this, `site`, JSON.parse(site));
      }
    },
    //获取菜单
    async getMenu() {
      //获取菜单
      let result = await this.menuOperation({ type: 'list', data: { site: this.$site } });
      if (`${result.errcode}` === '0') {
        //获取菜单的栏目
        let allMenu = result.data;
        for (let item of allMenu) {
          if (item.type === 'content') {
            item.path = `/info/detail?id=${item.content_id}`;
          } else if (item.type !== 'url') {
            let res = await this.completeMenu(item);
            item.children = res;
          }
        }
        sessionStorage.setItem('menu', JSON.stringify(allMenu));
        this.$set(this, `menu`, allMenu);
      }
    },
    //将菜单完善至栏目级别
    async completeMenu(item) {
      let res = await this.columnOperation({ type: 'list', data: { parent_id: item.id, site: item.site } });
      if (`${res.errcode}` === '0') {
        //组合path:res.data内容都为栏目.所以,点击这些栏目显示的列表应该是信息列表,需要用栏目的id作为查询信息的parten_id查出不同栏目的信息
        for (const col of res.data) {
          if (col.type === 'content') col.path = `/info/detail?id=${col.content_id}`;
          else if (col.type !== 'url') col.path = `/info/list/${col.id}`;
        }
        return res.data;
      }
    },
    //主站信息组合
    masterData() {
      this.$set(this.master, `bannerinfo`, { banner: this.site.banner });
    },
    //查询新闻信息
    async search(page) {
      let skip = 0;
      if (page) {
        skip = (page - 1) * 8;
      }
      let newData = { skip: skip, limit: 8, ...this.searchInfo, parent_id: this.parent_id, news_type: this.news_type };
      let result = await this.newsOperation({ type: 'list', data: { ...newData } });
      if (`${result.errcode}` === '0') {
        //给this=>vue的实例下在中的list属性，赋予result。data的值
        this.$set(this, 'list', result.data);
        this.$set(this, `totalRow`, result.total);
        window.location.hash = '#list_top';
      } else {
        this.$message.error(result.errmsg ? result.errmsg : 'error');
      }
    },
  },
};
</script>

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