<template>
  <div id="newsList">
    <list-detail :menuList="menu" :info="info" :backColor="backColor" :Color="Color" :newsList="newsList"></list-detail>
  </div>
</template>

<script>
import { mapActions, mapState } from 'vuex';
import listDetail from '@/components/newsList.vue';
export default {
  name: 'newsList',
  props: {},
  components: {
    listDetail,
  },
  data: () => ({
    info: {
      src: require('@/assets/logo.png'),
      phone: '0431-12345678',
      banner: require('@/assets/banner.png'),
      address: '办公地址：长春市经济技术开发区金川街151号吉林省高等学校毕业生就业指导中心2楼一站式办公大厅',
      email: '邮编：130012',
      gongjiao: '公交线路：乘坐120路、227路、20路、260路、80路、130路、281路、154路、190路、125路公交北方市场下车，北方市场南门南行200米。',
      mobile: '业务咨询电话：0431-84657570 0431-84657571;',
      date: '办公时间：周一至周五，法定假日不对外办公。',
      footTitle: '吉ICP备09006292号-1 Copyright 2013 版权所有 吉林省高等学校毕业生就业指导中心 All Rights Reserved',
    },
    backColor: '#0457c7',
    Color: '#0457c7',
    newsList: [
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
      {
        pic: require('@/assets/news.png'),
        title: '我省成功举办“创业有我•就在吉林',
        date: '2019-12-03',
        content: '我省成功举办“创业有我•就在吉林我省成功举办“创业有我•就在吉林',
      },
    ],
    menu: [],
    sideMenu: [],
  }),
  created() {
    this.loadMenu(); //获取菜单信息
  },
  computed: {},
  methods: {
    ...mapActions(['getMenu', 'getColumn']),
    //菜单
    async loadMenu() {
      let menu = sessionStorage.getItem('menu');
      if (menu) {
        this.$set(this, `menu`, JSON.parse(menu));
        this.finishedMenu();
        return;
      } else this.toGetMenu();
    },
    async toGetMenu() {
      let result = await this.getMenu({ type: `list` });
      if (result.errcode === 0) {
        sessionStorage.setItem('menu', JSON.stringify(result.data));
        this.$set(this, `menu`, result.data);
        this.finishedMenu();
      }
    },
    async finishedMenu() {
      let menus = JSON.parse(JSON.stringify(this.menu));
      for (const item of menus) {
        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;
        }
      }
      this.$set(this, `menu`, menus);
    },
    async completeMenu(item) {
      let result = await this.getColumn({
        type: `list`,
        data: { parent_id: item.id },
      });
      if (result.errcode === 0) {
        let columns = result.data;
        for (const col of columns) {
          if (col.type === 'content') {
            col.path = `/info/detail?id=${col.content_id}`;
          } else if (col.type !== 'url') {
            col.path = `/info/list/${col.id}`;
          }
        }
        return columns;
      }
    },
  },
};
</script>

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