check-work/src/components/Introduce/PartnerShip.vue

<!--
  Copyright (c) 2020.
  author: song
  email: 15235360226@163.com
  -->

<template>
  <div v-if="partners && partners.length > 0">
    <div :key="index" class="mb-4" v-for="(item,index) in partners">
      <p
        class="font-bold-24 title-color"
      >{{ item.typeOfTech===0 ? '高校' : item.typeOfTech===1 ? '院所' : '企业' }}</p>
      <div
        class="d-flex flex-wrap"
        v-if="item.backendSearchList && item.backendSearchList.length > 0"
      >
        <div
          :class="(i+1)%4===0? 'logo-box1' : ''"
          :key="i"
          @click="openProfile(list.name,list.description)"
          class="logo-box d-flex flex-column align-center white mb-8"
          v-for="(list,i) in item.backendSearchList"
        >
          <img :src="list.logoUrl" class="logo-pic my-2" />
          <div class="font-16 title-color">{{ list.name }}</div>
        </div>
      </div>
    </div>
    <company-profile :show-profile="showProfile" @closeProfile="closeProfile" v-if="showProfile" />
  </div>
</template>

<script>
import { mapState, mapMutations, mapActions } from 'vuex';
import CompanyProfile from './CompanyProfile.vue';
export default {
  name: 'PartnerShip',
  components: { CompanyProfile },
  props: {
    title: {
      type: String,
      default: '',
    },
    typeOfPlatform: {
      type: String,
      default: '',
    },
  },

  data() {
    return { showProfile: false };
  },

  computed: mapState('home', ['partners', 'profile']),

  async created() {
    this.setPartners([]);
    const { title, typeOfPlatform } = this;
    const params = {
      param: {
        pageNum: 1,
        // pageSize: -1,
        type: title === '合作伙伴' ? 1 : 2,
        typeOfPlatform: typeOfPlatform === '关于我们' ? 2 : 1,
      },
    };
    await this.getFrontSearchCompany(params);
  },

  methods: {
    ...mapMutations('home', ['setPartners', 'setProfile']),
    ...mapActions('home', ['getFrontSearchCompany']),

    // 介绍
    openProfile(title, description) {
      this.setProfile(null);
      const profile = {
        title,
        description,
      };
      this.setProfile(profile);
      this.showProfile = true;
    },

    closeProfile() {
      this.showProfile = false;
    },
  },
};
</script>

<style lang="stylus" scoped>
@import './PartnerShip.styl';
</style>