<template>
  <div class="signUp">
    <div class="content">
      <div class="">
        <div
          class="lastBtn"
          v-show="
            this.status == 1 ||
            this.status == 2 ||
            this.status == 3 ||
            this.status == 4 ||
            this.status == 5
          "
        >
          <el-button @click="lasStep()">上一步 </el-button>
        </div>

        <div class="signUp_titile">营地报名</div>
      </div>

      <div>
        <Breadcrumb :statusNum="status"> </Breadcrumb>
      </div>
    </div>
    <Confirm v-if="type == 'examInfo'" @getstatus="statuss"></Confirm>
    <Invitation
      v-else-if="type == 'invitation'"
      @getstatus="statuss"
      :invitation_code="invitation_code"
    ></Invitation>
    <ReferInfo v-else-if="type == 'referInfo'" @getstatus="statuss"></ReferInfo>
    <Pass
      v-else-if="type == 'check'"
      @is_next="is_nextevent"
      @getstatus="statuss"
    ></Pass>
    <Paying v-else-if="type == 'pay'" @getstatus="statuss"></Paying>
    <Success v-else-if="type == 'success'" @getstatus="statuss"></Success>

    <el-dialog
      style="font-size: 26px"
      class="info"
      title="营地声明"
      :visible.sync="dialogVisible"
      width="520px"
      center
    >
      <div>
        近日，营地工作组收到部分中学师生反映有机构及个人以高出营地费用的价格出售营地活动名额。
        对此，营地工作组严正声明如下：营地工作组从未授权任何单位、媒体、机构或个人举办营利性商业讲座、培训班、训练营或其他形式的营地招生活动。工作组对有违规操作行为的机构或个人保留追究法律责任的权利。
      </div>
      <div>
        希望广大师生以营地招生简章为准，不要轻信有关宣传，以免自身利益受损。如遇类似上述情况，可发送邮件至campcenter@163.com反映核实。特此声明！
      </div>

      <div class="btn">
        <el-button @click="dialogVisible = false">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
/* eslint-disable */
import Breadcrumb from "c/breadcrumb";
import Confirm from "c/index/SignUp/confirm";
import Invitation from "c/index/SignUp/invitation";
import ReferInfo from "c/index/SignUp/referInfo";
import Pass from "c/index/SignUp/pass";
import Paying from "c/index/SignUp/paying";
import Success from "c/index/SignUp/success";
import { signUpInit, signBack } from "r/index/signUp";

export default {
  name: "signUp",
  components: {
    Breadcrumb,
    Confirm,
    Invitation,
    ReferInfo,
    Pass,
    Paying,
    Success,
  },
  data() {
    return {
      type: "examInfo",
      status: "", //进度
      doubt_code: window.localStorage.getItem(
        "doubt_code" + this.$store.state.indexIdentity
      ),
      doubt_info: window.localStorage.getItem(
        "doubt_info" + this.$store.state.indexIdentity
      ),
      doubt_check: window.localStorage.getItem(
        "doubt_check" + this.$store.state.indexIdentity
      ),
      status_val: "",
      getExamine: "",
      isNexts: "",
      signBackStatus: "",
      invitation_code: "", //邀请码
      dialogVisible: false, //营地声明弹窗
    };
  },
  created() {
    this.type = this.$route.params.type;
    let camp_statement = window.localStorage.getItem('camp_statement'+ this.$store.state.indexIdentity);
    if(!camp_statement){
      this.dialogVisible = true; //营地声明弹窗
      window.localStorage.setItem('camp_statement'+ this.$store.state.indexIdentity, '1');
    }
    this.statuss();
    // this.signUpInit();

  },

  watch: {
    $route: {
      handler(val) {
        // console.log(val, "routeval");
        const that = this;
        if (val.path.indexOf("signUp") != -1) {
          that.type = val.params.type;
        }
      },
      deep: true,
    },
    status(val) {
      // console.log(val, "status");
    },
  },
  methods: {
    // 上一步回退
    lasStep() {
      signBack({}).then((res) => {
        console.log(res, "signBack");
        if (res.data.code != 200) {
          return this.$message.error(res.data.message);
        }
        console.log(res.data.status, "signBack.status");
        this.signBackStatus = res.data.status;
        this.signUpInit(this.signBackStatus);
        this.$message.success(res.data.message);
      });
    },
    is_nextevent(val) {
      this.isNexts = val;
      // console.log(val, "isNexts");
      //  this.signUpInit(  this.isNexts );
      this.signUpInit(this.status_val);
    },
    // 点击下一步，触发父组件方法
    statuss(val) {
      // console.log(val, "statuss");
      this.status_val = val;
      this.signUpInit(this.status_val);
    },
    // status=4,跳到审核页面；status=3时，根据doubt_check做判断
    signUpInit(status_val) {
      // console.log(111111);
      // console.log(status_val, "11111");
      // console.log(isNexts, "2222");
      signUpInit({}).then((res) => {
        // console.log(res, "signUpInit");
        if (res.data.code != 200) {
          // if (res.data.code == 400001) {
          //   this.status = 6;
          //   this.type = "success";
          // }
          return this.$message.error(res.data.message);
        }
        this.status = res.data.status;
        // console.log(this.status, "11111");
        // 点击下一步传值给status,更新
        if (status_val != null) {
          this.status = status_val;
        } else {
          this.status = res.data.status;
          // console.log(this.status, "11111");
        }
        // doubt_code，doubt_info，doubt_check。0为不填写，1为填写
        if (this.status == 0) {
          this.type = "examInfo";
        } else if (this.status == 1) {
          //  是否填写邀请码
          if (this.doubt_code == 0) {
            this.type = "referInfo";
            this.status = 2;
          } else {
            this.type = "invitation";
            this.status = 1;
          }
        } else if (this.status == 2) {
          // console.log(this.doubt_info, "doubt_info");
          // 是否填写个人资料
          if (this.doubt_info == 0) {
            this.type = "check";
            this.status = 3;
          } else {
            this.type = "referInfo";
            this.status = 2;
          }
        } else if (this.status == 3) {
          // 是否审核个人资料
          if (this.doubt_check == 0) {
            this.type = "pay";
            this.status = 4;
          } else {
            this.type = "check";
            this.status = 3;
          }
        } else if (this.status == 4) {
          this.type = "check";
          this.status = 3;
          // console.log(this.status, "this.status ");
          // console.log(this.isNexts ,'this.isNexts ')
          if (this.isNexts == 1) {
            // console.log(11111);
            if (res.data.examine_status == 1) {
              console.log(333);
              this.type = "pay";
              this.status = 4;
            } else if (res.data.examine_status == 2) {
              this.type = "referInfo";
              this.status = 2;
              // return this.$message.error(res.data.examine_reason);
            }
          }
        } else if (this.status == 5) {
          this.type = "pay";
        } else if (this.status == 6) {
          this.type = "success";
        }
        this.$emit("getStatus", this.type);
        // this.getExamine = res.data.examine_status;
        // console.log(res.data.examine_status, "res.data.examine_status");
        this.invitation_code = res.data.invitation_code; //填写的邀请码回显需要
        //订单支付金额
        let code = this.$store.state.indexIdentity;
        window.localStorage.setItem("has_amount" + code, res.data.has_amount);
        window.localStorage.setItem("campsite_id" + code, res.data.campsite_id);
        window.localStorage.setItem("order_no" + code, res.data.order_no);
        window.localStorage.setItem(
          "examine_status" + code,
          res.data.examine_status
        ); //返回错误原因
        window.localStorage.setItem(
          "examine_reason" + code,
          res.data.examine_reason
        ); //资料审核状态
        // window.localStorage.setItem("achievement_path", res.data.achievement_path); //上传的图片
        const aPath = res.data.achievement_path;
        if (aPath) {
          let arr = aPath.split(",");
          let fileList = [];
          fileList = arr.map((item) => {
            let obj = {
              url: item,
            };
            return obj;
          });
          // let code = this.$store.state.indexIdentity;
          window.localStorage.setItem(
            "sign_up_file_" +
              window.localStorage.getItem("phone" + code) +
              code,
            JSON.stringify(fileList)
          ); //上传的图片
        }
      });
    },
  },
};
</script>

<style lang="scss" >
@import "a/scss/lastBtn";
.flex {
  display: flex;
}

.btn {
  text-align: center;
  // padding-bottom: 224px;
  .el-button {
    width: 120px;
    height: 35px;
    background: var(--color);
    border-radius: 4px;
    border-color: var(--color);
    opacity: 0.8;
    line-height: 35px;
    text-align: center;
    color: #fff;
    font-size: 16px;
    padding: 0;
    margin: 30px 0 0 0;
  }
}
.signUp {
  /*background: #ffffff;*/
  /*width: 856px;*/
  .signUp_titile {
    font-size: 24px;
    font-weight: 500;
    color: #1b1419;
    line-height: 24px;
    margin-bottom: 40px;
    text-align: center;
  }
  .content {
    padding: 50px 55px;
  }
}
// 声明

.info {
  .el-dialog__header {
    padding: 30px 20px 0 20px;
    .el-dialog__title {
      font-size: 24px;
    }
  }
  div {
    font-size: 17px;
    line-height: 30px;
  }
}
</style>
