<template>
  <div class="app-container" :style="{height:height+'px'}">
    <van-nav-bar
      title="注册"
      left-arrow
      fixed
      placeholder
      @click-left="onClickLeft"
    />
    <div class="title">
      <p class="title_one">PROPERTY RIGHT</p>
      <p class="title_two">TRANSACTION</p>
      <p class="title_three">农村产权交易平台</p>
    </div>
    <div class="text_box">
      <p>请选择要注册的类型</p>
      <div class="img_box">
        <van-image src="../../../static/images/register_icon2.png" width="18%" @click="goUserRegister()" style="margin-right: 20%" />
        <van-image src="../../../static/images/register_icon1.png" width="18%" @click="goCompanyRegister()" />
      </div>
      <div class="type_box">
        <van-row style="margin-bottom: 0.2rem">
          <van-col span="6">个人用户 :</van-col>
          <van-col span="18">参与农村产权交易的自然人</van-col>
        </van-row>
        <van-row>
          <van-col span="6">单位用户 :</van-col>
          <van-col span="18">主要是参与农村产权交易的机关 单位、社会组织、农业企业、家 庭农场、合作社等</van-col>
        </van-row>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "notice",
  data() {
    return {
      height:0
    };
  },
  created() {
    this.height = document.body.clientHeight
  },
  methods: {
    goUserRegister(){
      window.location = 'userRegister'
    },
    goCompanyRegister(){
      window.location = 'companyRegister'
    }
  },
};
</script>

<style scoped lang="scss">
.app-container {
  background: url("../../../static/images/index/registerBg.png") no-repeat;
  background-size: 100% 100%;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.title{
  padding-top: 20%;
  width: 88%;
  margin: 0 auto;
}
.title_one{
  color: #666666;
  font-size: 0.5rem;
}
.title_two{
  color: #007e72;
  font-size: 0.8rem;
}
.title_three{
  color: #FFF;
  font-size: 0.9rem;
}
.text_box{
  background: #ffffff;
  background-image: linear-gradient(#fff, #c1c1c1);
  width: 100%;
  height: 100%;
  border-radius: 1.5rem;
  padding: 0.5rem 0.4rem 0;
  margin-top: 0.6rem;
  overflow: hidden;
}
.text_box p{
  text-align: center;
  color: #007E72;
  font-size: 0.5rem;
  margin-top: 1rem;
}
  .img_box{
    text-align: center;
    margin-top: 1rem;
  }
  .type_box{
    padding: 0 10%;
    color: #007E72;
    font-size: 0.3rem;
    margin-top: 1rem;
  }
</style>
