<template>
  <div class="register">
    <div class="registerCon">
      <el-row>
        <el-col :span="8" class="title">
          <div class="titcon">
            <img src="../assets/logo1.png" alt width="100px" />
            <h1>欢迎访问危化品企业监管平台！</h1>
            <h2>Wellcom to The Hazardous Chemicals Supervision System.</h2>
          </div>
        </el-col>
        <el-col :span="16" class="pageCon">
          <div class="serForm">
            <h3>查询企业注册信息</h3>
            <el-form :inline="true" :model="searchData">
              <el-form-item label>
                <el-input v-model="searchData.orgCode" placeholder="请输入统一社会信用代码"></el-input>
              </el-form-item>
              <el-form-item>
                <el-button type="primary" @click="searchFun()">
                  <i class="el-icon-search"></i> 搜索
                </el-button>
              </el-form-item>
              <div class="tips">
                <font v-if="status === '0'" class="colorM">
                  <i class="iconfont iconzhengchang"></i> 正常
                </font>
                <font v-else-if="status == 2" class="colorP">
                  <i class="iconfont iconsuoding"></i> 已锁定
                </font>
                <font v-else-if="status == 1" class="colorR">
                  <i class="iconfont iconicon_huabanfuben"></i> 已删除
                </font>
                <font v-else-if="status == 3" class="colorP">
                  <i class="iconfont iconshenhe"></i> 审核中
                </font>
                <font v-else-if="status == 4" class="colorR">
                  <i class="iconfont iconweitongguo"></i> 审核未通过<br /><em class="remark">审核备注信息:{{tipMark}}</em><br><a class="alink" @click="$router.push('/register')"> 重新注册 </a>
                </font>
                <div class="colorR" v-else>{{tiptxt}}</div>
                <a class="alink" @click="$router.push('/login')"> 返回登录页 </a>
                <br />
              </div>
            </el-form>
          </div>
        </el-col>
      </el-row>
    </div>
    <div class="bckg">
      <img src="../assets/bg.jpeg" alt />
    </div>
  </div>
</template>
<script lang="ts">
import { Component, Vue, Provide, Watch } from "vue-property-decorator";
import METHOD from "@/utils/methods";
@Component({
  components: {}
})
export default class Register extends Vue {
  @Provide() searchData: any = { orgCode: "" };
  @Provide() status: string = "";
  @Provide() tiptxt: string = "";
  @Provide() tipMark: string = "";
  searchFun() {
    let that = this;
    if (that.searchData.orgCode) {
      METHOD.axiosGet(
        that,
        `/reg/queryRegCheckStatus/${that.searchData.orgCode}`,
        function(res: any) {
          /**
           * 审核状态，0.正常 1.删除 2.锁定 3.审核中 4审核未通过
           */
          if (res.code == 0 && res.data) {
            that.status = res.data.accountStatus;
            if( res.data.accountStatus == 4 ){
              sessionStorage.setItem('enterCheckInfo', JSON.stringify(res.data) )
            }
            that.tipMark = res.data.remarks;
          } else {
            that.status = "";
            that.tiptxt = res.msg;
          }
        }
      );
    } else {
      that.$message.warning("请填写统一社会信用代码");
    }
  }

  created() {}
}
</script>
<style lang="scss">
@import "@/utils/public.scss";
.registerCon {
  width: 90%;
  margin: 0 auto;
  height: 80vh;
  position: relative;
  top: 10vh;
  box-sizing: content-box;
  position: relative;
  z-index: 1;
  .el-row {
    width: 100%;
    height: 100%;
    overflow: hidden;
    .el-col {
      height: 100%;
      overflow: hidden;
    }
  }
  .title {
    background: $theme-color;
    opacity: 0.8;
    padding: 0 10px;
    color: white;
    text-align: center;
    display: flex;
    align-items: center;
    h1 {
      font-weight: normal;
      font-family: "黑体";
    }
    h2 {
      font-weight: normal;
      font-family: Helvetica, sans-serif;
    }
  }
  .pageCon {
    background: white;
    h3 {
      font-size: 1rem;
      text-align: center;
      font-weight: normal;
      margin: 10px;
    }
  }
}
.bckg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  img {
    width: 100%;
    height: 100vh;
    filter: blur(20px);
    -webkit-filter: blur(4px);
  }
}
.serForm {
  padding: 15px;
  .el-form-item:nth-child(1) {
    width: calc(100% - 110px);
    .el-form-item__content {
      width: 100%;
    }
    .el-input {
      width: 100%;
    }
  }
}
.tips {
  text-align: center;
  padding: 20px 0;
  font-size: 2em;
  .remark{
    font-size: 16px;
    color: gray;
    font-style: normal;
  }
  .alink{
    font-size: 16px;
    text-decoration: underline;
    color: blue;
    cursor: pointer;
  }
}
</style>
