<!--
 * @Author: wally
 * @email: 18603454788@163.com
 * @Date: 2021-01-14 17:29:47
 * @LastEditors: wally
 * @LastEditTime: 2021-01-18 11:40:41
-->
<!--
 * @Author: wally
 * @email: 18603454788@163.com
 * @Date: 2021-01-14 17:29:47
 * @LastEditors: wally
 * @LastEditTime: 2021-01-14 17:55:47
-->
<template>
  <div style="padding: 0 25px">
    <div style="padding-bottom: 80px; position: relative">
      <div class="words-content">
        <div style="text-align: center; padding-bottom: 40px">
          <img src="https://www.sxwikionline.com/gateway/wiki/uploads/upload/20210317/fba99c12bb4c4aef8b7b2a9a584a7145.png" alt="" />
        </div>
        <div class="con-con">
          <p style="text-indent: 2em">
            山西创时代企业孵化器有限公司2017年12月成立，主要从事科技型中小企业服务。 位于太原高新区高新置业大厦A座。
          </p>
          <p style="text-indent: 2em">
            公司租用高新置业配套楼3000多平米场地，配备1000兆宽带，拥有高科创时代和高科众创时代两个公共服务平台，现有服务人员15名，
            专业涉及企业管理、机电、公路、环保、农学、财务、法律等方面。
          </p>
          <p style="text-indent: 2em">
            面向科技型、成长型、创新型中小微企业，通过提供科技信息、创业信息服务、创新创投服务等综合性、全链条的专业服务，提高中小微企业成功率和成长速度。
            服务特色主要有：免费的创业信息服务、及时的创业政策解读、专业的创业导师指导、多样的创客交流活动、高效的线上服务平台、优质的合作服务资源。
          </p>
          <p style="text-indent: 2em">
            自成立以来，累计举办10余次创业培训活动，内容涉及到高新技术企业申报、知识产权申报、税收筹划、科技厅项目申报、创新券辅导等，累计为50多家次企业提供免费的信息服务。
          </p>
          <p style="text-indent: 2em">
            2018年2月聘请专家学者、企业家等6人担任创业导师，累计为10多位创业者、中小企业提供服务。与知识产权服务机构合作，
            累计为10多家企业提供专利申报、软件著作权申请、商标设计及注册等服务。至2018年3月底与5家机构签订战略合作协议并与多家机构达成合作意向，更好的为中小微企业服务。
          </p>
        </div>
        <div style="text-align: center; padding-bottom: 40px">
          <img src="https://www.sxwikionline.com/gateway/wiki/uploads/upload/20210317/ce395331ef204be8b0d570222224f3f4.png" alt="" />
        </div>
        <img
          style="width: 100%; margin-bottom: 40px"
          src="https://www.sxwikionline.com/gateway/wiki/uploads/upload/20210317/dfd10e80c7024b50b08faef64705a8ea.png"
        />
      </div>
      <!-- <a-button class="btn" type="primary">申请加入</a-button> -->
      <add-model :value="1" class="btn" style="height: 32px" />
    </div>
    <div>
      <div style="text-align: center; padding-bottom: 40px">
        <img src="https://www.sxwikionline.com/gateway/wiki/uploads/upload/20210317/64d5cdec92ca41c7b06712a906c9c466.png" alt="" />
      </div>
      <div class="d-flex flex-wrap" style="padding: 0 25px 80px 25px; position: relative">
        <div :class="(index + 1) % 4 === 0 ? 'mr0' : ''" :key="index" class="ent-box" v-for="(item, index) in lists">
          <div :style="{ background: colorList[index] }" class="ent-img-box">
            <img :src="item.logoUrl" class="ent-img" />
          </div>
          <p class="ent-title">
            <span style="border-bottom: 2px solid #007cc1; padding-bottom: 4px">{{ item.name }}</span>
          </p>
          <p class="ent-des">{{ item.description }}</p>
          <p class="ent-man">
            <span class="ent-lf">联系人：{{ item.man }}</span>
            <span class="ent-rh">联系电话：{{ item.tel }}</span>
          </p>
        </div>
        <!-- <a-button class="btn" style="bottom: 20px" type="primary">入驻企业注册</a-button> -->
        <settled-model class="btn" style="bottom: 20px" :type-num="placeType" />
      </div>
    </div>
  </div>
</template>
<script>
import AddModel from './components/AddModel.vue';

export default {
  name: 'Space',
  components: { AddModel },
  data() {
    return {
      lists: [
        {
          description: '系统创新中心介绍系统创新中心介绍系统创新中心介绍系统创新中心介绍系统创新中心介绍系统创新中心介绍...',
          name: '测试公司1',
          logoUrl: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2816433753,267880517&fm=26&gp=0.jpg',
          man: '张三',
          tel: '15000000000',
        },
        {
          description: '系统创新中心介绍系统创新中心介绍系统创新中心介绍系统创新中心介绍系统创新中心介绍系统创新中心介绍...',
          name: '测试公司1',
          logoUrl: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2816433753,267880517&fm=26&gp=0.jpg',
          man: '张三',
          tel: '15000000000',
        },
        {
          description: '系统创新中心介绍系统创新中心介绍系统创新中心介绍系统创新中心介绍系统创新中心介绍系统创新中心介绍...',
          name: '测试公司1',
          logoUrl: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2816433753,267880517&fm=26&gp=0.jpg',
          man: '张三',
          tel: '15000000000',
        },
        {
          description: '系统创新中心介绍系统创新中心介绍系统创新中心介绍系统创新中心介绍系统创新中心介绍系统创新中心介绍...',
          name: '测试公司1',
          logoUrl: 'https://ss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=2816433753,267880517&fm=26&gp=0.jpg',
          man: '张三',
          tel: '15000000000',
        },
      ],
      colorList: ['rgba(19, 172, 196, 0.3)', 'rgba(19,96,196,0.3)', 'rgba(162,19,196,0.3)', 'rgba(19,196,72,0.3)'],
    };
  },
  methods: {
    jumpUrl(index) {
      if (index === 0) {
        this.$router.push('/Hatch/Incubator');
      } else {
        this.$router.push('/Hatch/Fictitious');
      }
    },
  },
};
</script>

<style lang="stylus" scoped>
.introduce-title {
  font-size: 24px !important;
  color: #007CC1 !important;
  margin-bottom: 20px;
  margin-top: 0 !important;
}

.words-title {
  font-size: 22px;
  font-weight: bold;
  color: rgba(0, 0, 0, 0.85);
  text-align: center;
  margin-bottom: 40px;
}

.con-con {
  margin-bottom: 40px;
}

.btn {
  position: absolute;
  right: 25px;
}

.top-bg {
  padding: 40px 25px 100px 25px !important;
  position: relative;
}

.words-title {
  font-size: 22px;
  font-weight: bold;
  color: rgba(0, 0, 0, 0.85);
  text-align: center;
  margin-bottom: 40px;
}

.con-con {
  margin-bottom: 40px;
}

.btn {
  position: absolute;
  right: 25px;
}

.ent-box {
  width: 22%;
  margin-right: 4%;
  min-height: 300px;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}

.ent-img-box {
  height: 140px;
  // background: ;
  text-align: center;
  line-height: 140px;
}

.ent-img {
  height: 100px;
  width: 100px;
  border-radius: 50%;
}

.ent-title {
  text-align: center;
  margin-top: 14px;
  font-size: 16px;
  color: rgba(0, 0, 0, 0.65);
}

.ent-des {
  padding: 0 8px;
  font-size: 15px;
  color: rgba(0, 0, 0, 0.65);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.ent-man {
  overflow: hidden;
  color: rgba(0, 0, 0, 0.45);
  font-size: 12px;
  padding: 0 8px;
}

.ent-lf {
  float: left;
}

.ent-rh {
  float: right;
}

@media only screen and (max-width: 1600px) {
  .ent-rh {
    float: left;
  }
}
</style>
