<template>
  <div id="supermarket">
    <supermarket-detail
      :info="info"
      :nativeList="nativeList"
      @onsave="nativeClick"
      :display="display"
      :jishuList="jishuList"
      :jishuTotal="jishuTotal"
      :chanpinList="chanpinList"
      :chanpinTotal="chanpinTotal"
      :serviceList="serviceList"
      :serveTotal="serveTotal"
      :fabuList="chanpinList"
      :tableData="tableData"
      :schoolList="schoolList"
      :scientificList="scientificList"
      :schoolTotal="schoolTotal"
      :scientificTotal="scientificTotal"
      :companyList="companyList"
      :companyTotal="companyTotal"
      :mechanismList="mechanismList"
      :mechanismTotal="mechanismTotal"
    ></supermarket-detail>
  </div>
</template>

<script>
import supermarketDetail from '@/components/supermaket/supermarket.vue';
import { createNamespacedHelpers, mapGetters } from 'vuex';
const { mapActions: mapSite } = createNamespacedHelpers('site');
const { mapActions: mapProduct } = createNamespacedHelpers('enterpriseproject');
export default {
  name: 'supermarket',
  props: {},
  components: {
    supermarketDetail,
  },
  data: () => ({
    info: {},
    nativeList: [
      {
        name: '高校院所',
      },
      {
        name: '科研院所',
      },
      {
        name: '科技企业',
      },
      {
        name: '机构团体',
      },
      {
        name: '研发服务',
      },
      {
        name: '技术成果',
      },
      {
        name: '创新产品',
      },
      {
        name: '咨询服务',
      },
      {
        name: '创新人才',
      },
    ],
    display: 'first',
    // 技术型
    jishuList: [],
    // 技术型分页
    jishuTotal: 1,
    // 产品型
    chanpinList: [],
    // 产品型分页
    chanpinTotal: 1,
    // 服务供求，研发服务
    serviceList: [
      {
        title: '标题',
        type: '服务供求',
        yen: '1000元/台',
        date: '2019-12-26',
      },
      {
        title: '八条数据',
        type: '服务供求',
        yen: '1000元/台',
        date: '2019-12-26',
      },
    ],
    // 服务分页
    serveTotal: 1,
    tableData: [
      {
        market: '系统管理员',
        make: '硅藻土联盟',
        product: '纳米融金',
        deal: '交易完成',
      },
      {
        market: '四条数据',
        make: '硅藻土联盟',
        product: '纳米融金',
        deal: '交易完成',
      },
    ],
    // 高校院所
    schoolList: [
      {
        pic: require('@/assets/fabu.jpg'),
        title: '长春工业大学',
        com: 'www.baidu.com',
        type: '二级本科',
        address: '吉林省长春市力旺广场B座16楼',
      },
    ],
    schoolTotal: 1,
    // 科研院所
    scientificList: [
      {
        pic: require('@/assets/fabu.jpg'),
        title: '科研院所',
        com: 'www.baidu.com',
        type: '二级本科',
        address: '吉林省长春市力旺广场B座16楼',
      },
    ],
    scientificTotal: 1,
    // 科技企业
    companyList: [
      {
        title: '长春市福瑞科技有限公司',
        city: '吉林省 长春市',
        address: '吉林省长春市朝阳区力旺广场B座16楼1608',
        content:
          '长春市福瑞科技有限公司办公室地址位于中国汽车和“新中国电影的摇篮--长春，长春 怡众名城第20幢3单元505室（住所期限至2043年8月19日止），于2013年08月22日在长春市工商行政管理局高新技术产业开发区分局注册成立，注册资本为100万元人民币',
      },
    ],
    companyTotal: 1,
    // 机构团体
    mechanismList: [
      {
        pic: require('@/assets/fabu.jpg'),
        title: '标题',
        city: '吉林长春',
        guimo: '562人',
        dengji: '国家级',
        lingyu: '重点研究领域',
        jianjie: '简介',
      },
    ],
    mechanismTotal: 1,
  }),
  created() {
    this.searchSite();
    this.searchInfo();
  },
  computed: {},
  methods: {
    ...mapSite(['showInfo']),
    ...mapProduct({ ProductQuery: 'query', ProductFetch: 'fetch', ProductDelete: 'delete' }),
    // 查询站点信息
    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 searchInfo({ skip = 0, limit = 8, ...info } = {}) {
      const res = await this.ProductQuery({ skip, limit, ...info });
      for (const val of res.data) {
        if (val.totaltype === '0') {
          var arr = res.data.filter(item => item.totaltype === '0');
          this.$set(this, `jishuList`, arr);
          this.$set(this, `jishuTotal`, arr.length);
        } else if (val.totaltype === '1') {
          var arrs = res.data.filter(item => item.totaltype === '1');
          this.$set(this, `chanpinList`, arrs);
          this.$set(this, `chanpinTotal`, arrs.length);
        } else if (val.totaltype === '2') {
          var arrss = res.data.filter(item => item.totaltype === '2');
          this.$set(this, `serviceList`, arrss);
          this.$set(this, `serveTotal`, arrss.length);
        }
      }
    },
    async nativeClick({ name }) {
      if (name === '高校院所') {
        this.display = 'second';
      } else if (name === '科研院所') {
        this.display = 'thirth';
      } else if (name === '科技企业') {
        this.display = 'fourth';
      } else if (name === '机构团体') {
        this.display = 'fivth';
      } else if (name === '研发服务') {
        this.display = 'sixth';
      } else if (name === '技术成果') {
        this.display = 'seventh';
      } else if (name === '创新产品') {
        this.display = 'eighth';
      } else if (name === '咨询服务') {
        this.display = 'nineth';
      } else {
        this.$router.push({ path: '/personnel/personnel' });
      }
    },
  },
};
</script>

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