<template>
  <div class="to-review">
    <div class="logo-bg">
      <img v-if="false" src="../../../public/images/logo_white_sm.png" alt="">
    </div>
    <el-card class="box-card">
      <div slot="header" class="clearfix steps">
        <el-steps :active="3" align-center finish-status="success">
          <el-step title="注册账号" ></el-step>
          <el-step title="填写主体信息" ></el-step>
          <el-step title="填写店铺信息" ></el-step>
          <el-step title="提交入驻审核" ></el-step>
        </el-steps>
      </div>
      <div class="main">
        <div class="fuck">
          <p>
            <img src="../../../public/images/entry/reviewSuccess.png" alt="">
          </p>
          <p>资料已提交，工作人员审核中。。。</p>
          <p style="margin-top: 10px;">感谢您使用云仓！</p>
          <p>您的资料已经提交审核，审核周期为1-3个工作日，请您耐心等待审核结果。</p>
          <p>如果您有其它的问题，可以拔打我们的服务电话与我们联系！</p>
<!--          <p>服务电话：4000-188-199</p>-->
        </div>
      </div>
    </el-card>
  </div>
</template>

<script>
  import { getInfo } from '@/api/module/entry';
  export default {
    name: "ReviewSuccess",
    data() {
      return {}
    },
    created() {
      getInfo().then(res=> {
        if (res.code == 1 && res.data.user) {
          if (res.data.user.state == 1) {
            this.$router.push({path: '/index'});
          }
          if (res.data.user.state == 2) {
            this.$router.push({path: '/reviewing'})
          }
          if (res.data.user.state == 3) {
            this.$router.push({path: '/reviewFail'});
          }
        }
      });
    },
    mounted() {
      /** 禁止 浏览器 后退 */
      history.pushState(null,null,document.URL);
      window.addEventListener('popstate', function () {
        history.pushState(null, null, document.URL);
      })
    }
  }
</script>

<style lang="scss" type="text/stylus" scoped>
.to-review {
  font-size : 16px;
  width: 100%;
  height: 100%;
  overflow: hidden;
  .logo-bg {
    height: 60px;
    background: #1890ff;
    img {
      height: 44px;
      margin: 8px 0 8px 20px;
    }
  }
  .box-card {
    width: 80%;
    margin: 30px auto 30px;
    height: calc(100% - 120px);
  }
  .steps {
    height: 70px;
    width: 60%;
    margin: 40px auto 0;
  }
  .steps >>> .el-step__title {
    font-size: 16px;
    line-height: 18px;
    padding-top: 20px;
    color: #333;
  }

  .el-step >>> .el-step__head.is-process {
    color: #1890ff;
    border-color: #1890ff;

    .el-step__icon.is-text {
      background-color: #1890ff;

      .el-step__icon-inner {
        color: #fff;
      }
    }
  }

  .el-step >>> .el-step__title.is-process {
    color: #000;
    font-weight : 400;
  }

  .el-step >>> .el-step__head.is-success {
    color: #1890ff;
    border-color: #1890ff;

    .el-step__line {
      background-color: #1890ff;
    }
  }

  .el-step >>> .el-step__title.is-success {
    color: #000;
  }

  .main {
    width: 100%;
    height: calc(66% - 120px);
    display:table;
    .fuck {
      display:table-cell;
      vertical-align:middle;
      p {
        text-align : center;
      }
      p:nth-child(2) {
        font-size: 24px;
        font-weight : bold;
        padding: 10px 0;
      }
    }
  }
}
</style>
