<!--
  @description:注册身份选择
  @Modifier:王俊楠
  @routerPath:/register/registerIdentity
  @date:2020/11/11-14:27
-->
<template>
  <div class="registerRules">
    <div class="registerIdentity_main">
      <div class="registerIdentity_content clearfix">
        <div v-for="(item, index) in identityModuleList" :key="index" class="registerIdentity_block">
          <div class="registerIdentity_btn" @click="selectIndtity(item)">
            <dl>
              <dd :class="'iconfont '+item.icon" />
              <dt>{{ item.typename }}</dt>
            </dl>
          </div>
        </div>
      </div>
    </div>
    <div class="no_wrap">
      <el-button size="default" @click="resver">
        返 回
      </el-button>
    </div>
  </div>
</template>

<script>
export default {
  name: 'RegisterIdentity',
  props: {
    // 注册身份信息
    registerData: {
      type: Object,
      default: function() {
        return {
          typename: '', // 注册身份名称
          typecode: '' // 注册类型编码
        }
      }
    }
  },
  data() {
    return {
      // 注册类型
      identityModuleList: [
        { typename: '招标人/采购人', typecode: '03', icon: 'icon-caigoudanwei' },
        { typename: '代理机构', typecode: '02', icon: 'icon-dailijigou' },
        { typename: '供应商/投标人', typecode: '01', icon: 'icon-gongyingshangtoubiaoren' },
        { typename: '专家', typecode: '', icon: 'icon-zhuanjia', path: '/expert/register' }
      ]
    }
  },
  methods: {
    // 注册身份选择
    selectIndtity(item) {
      if (item.path) {
        this.$router.push(item.path)
      } else {
        // 注册身份信息传给父级组件
        this.registerData.typename = item.typename// 名称
        this.registerData.typecode = item.typecode// 编码
        this.$emit('stepPage', 'next', {}) // 步骤条切换方法 next 下一步
      }
    },
    // 返回首页login
    resver() {
      this.$store.dispatch('backHomepage')
    }
  }
}
</script>
<style lang="less" scoped>
  @import url("~@/assets/style/common/public.less");
  .registerRules {
    width: 100%;
    .no_wrap {
      width: 100%;
      text-align: center;
    }
    .registerIdentity_main{
      padding: 24px;
      min-height: 225px;
      .registerIdentity_content{
        text-align: center;
        .registerIdentity_block{
          display: inline-block;
          margin-left: 25px;
          margin-right: 25px;
          .registerIdentity_btn{
            display: table-cell;
            vertical-align: middle;
            text-align: center;
            background: #F0F2F5;
            width: 160px;
            height: 160px;
            cursor: pointer;
            color:@hyacinthine;
            animation:5s;
            dl{
              margin: 0 auto;
              width: 160px;
              dd{
                font-size: 40px;
              }
            }
            &:hover{
              background: @hyacinthine;
              color: @white;
            }
          }
        }
      }
    }
  }
</style>
