web-website/src/views/supermaket/supermarket.vue

<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"
      @fabu="fabu"
    ></supermarket-detail>
  </div>
</template>

<script>
import supermarketDetail from '@/components/supermaket/supermarket.vue';
import { createNamespacedHelpers, mapGetters, mapState } from 'vuex';
const { mapActions: mapSite } = createNamespacedHelpers('site');
const { mapActions: user } = createNamespacedHelpers('user');
const { mapActions: marketproduct } = createNamespacedHelpers('marketproduct');
// 获取学校
import { school } from '@/util/school';
export default {
  name: 'supermarket',
  props: {},
  components: {
    supermarketDetail,
  },
  data: () => ({
    // 站点信息
    info: {},
    nativeList: [
      {
        name: '高校院所',
      },
      {
        name: '科研院所',
      },
      {
        name: '科技企业',
      },
      {
        name: '机构团体',
      },
      {
        name: '研发服务',
      },
      {
        name: '科技需求',
      },
      {
        name: '创新产品',
      },
      {
        name: '咨询服务',
      },
      {
        name: '创新人才',
      },
    ],
    display: 'first',
    // 高校院所
    schoolList: school,
    schoolTotal: 76,
    // 科研院所
    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万元人民币',
      // },
    ],
    // 技术型
    jishuList: [],
    // 技术型分页
    jishuTotal: 0,
    // 产品型
    chanpinList: [],
    // 产品型分页
    chanpinTotal: 0,
    // 服务供求，研发服务
    serviceList: [
      {
        title: '标题',
        type: '服务供求',
        yen: '1000元/台',
        date: '2019-12-26',
      },
      {
        title: '八条数据',
        type: '服务供求',
        yen: '1000元/台',
        date: '2019-12-26',
      },
    ],
    // 服务分页
    serveTotal: 0,
    // 交易展示
    tableData: [],
    companyTotal: 1,
    // 机构团体
    mechanismList: [
      {
        pic: require('@/assets/fabu.jpg'),
        title: '标题',
        city: '吉林长春',
        guimo: '562人',
        dengji: '国家级',
        lingyu: '重点研究领域',
        jianjie: '简介',
      },
    ],
    mechanismTotal: 1,
  }),
  async created() {
    await this.search();
    await this.searchList();
  },
  computed: {
    ...mapState(['user']),
  },
  methods: {
    ...mapSite(['showInfo']),
    ...user({ userQuery: 'query' }),
    ...marketproduct({ productquery: 'query' }),
    // 查询站点信息
    async search() {
      let res = await this.showInfo();
      let object = JSON.parse(JSON.stringify(res.data));
      if (object) {
        this.$set(this, `info`, res.data);
      }
    },
    // 查询列表
    async searchList({ ...info }) {
      let res = await this.userQuery({ role: 5, ...info });
      // 科技需求
      res = await this.productquery({ type: 0, ...info });
      if (this.$checkRes(res)) {
        this.$set(this, `jishuList`, res.data);
        this.$set(this, `jishuTotal`, res.total);
      }
      // 创新产品
      res = await this.productquery({ type: 1, ...info });
      if (this.$checkRes(res)) {
        this.$set(this, `chanpinList`, res.data);
        this.$set(this, `chanpinTotal`, res.total);
      }
      // 研发服务+咨询服务
      res = await this.productquery({ type: 2, ...info });
      if (this.$checkRes(res)) {
        this.$set(this, `serviceList`, res.data);
        this.$set(this, `serveTotal`, res.total);
      }
    },
    // 发布
    fabu() {},
    // 跳转
    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>