dev/dcp-web-gate/src_old/views/Register.vue

<template>
  <div style="height: 100px;background-color: #fff;" class="registerBox">
    <div class="header1">
      <div class="header2">
        <div class="logo">
          <img
              :src="$i18n.locale=='zh'?require('@/assets/img/home/LOGO2020-12-22.png'):require('@/assets/img/home/LOGO2020-12-22.png')"
              alt
              :style="$i18n.locale=='zh'?'width: 336px;':'width:336px;transform:translateY(1px)'"
              @click="toView(0,'home')"
          />
        </div>
      </div>
    </div>
    <div
        style="width: 1200px;height: 700px;background-color: #fff;margin: auto;margin-top: 30px;position: relative;"
    >
      <div style="line-height: 100px;padding-left: 30px;color: #999;">
        {{ $t('common.userRegistration') }}

        <span
            style="float: right;margin-right: 20px;color:#2c558a ;text-decoration:underline;"
            class="cursor"
            @click="toBack"
        >
          {{ $t('common.alreadyAccounted') }}
        </span>
        <span style="float: right;margin-right: 20px;color:#2c558a;" class="cursor" @click="locale('en')">EN </span>
        <span style="float: right;margin-right: 20px;color:#2c558a;" class="cursor"
              @click="locale('zh')">{{ $t('common.CN') }} </span>
      </div>
      <div style="width: 400px;position: absolute;left: 50%;top: 50%;transform: translate(-50%,-50%);">
        <div class="register">
          <td @click="active(1)" :style="$i18n.locale=='en'?'font-size:14px':''" :class="num==1?'active':''"
              class="cursor">{{ $t('common.MobileNumberRegistration') }}
          </td>
          <td @click="active(2)" :style="$i18n.locale=='en'?'font-size:14px':''" :class="num==2?'active':''"
              class="cursor">{{ $t('common.Emailregistration') }}
          </td>
        </div>
        <!-- 手机号注册 -->
        <el-form
            ref="ruleForm"
            :model="ruleForm"
            :rules="rules"
            label-width="0px"
            style="margin: auto; width: 400px;margin-top: 23px;"
            v-if="num==1"
            class="login2"
        >
          <el-form-item style="position: relative;" prop="tel">
            <GlobalRoaming ref='GlobalRoaming' :size="{width:'398px'}" v-model="ruleForm.tel"
                           @getAreaCode="getPassAreaCode"></GlobalRoaming>
          </el-form-item>
          <el-form-item style="position: relative;" prop="vervification">
            <el-input :placeholder="$t('common.SMSverificationcode')" v-model="ruleForm.vervification"
                      class="indent"></el-input>
            <i
                class="fa fa-commenting"
                aria-hidden="true"
                style="position: absolute;left: 10px;top: 12px;font-size: 20px;color: #666;"
            ></i>
            <span style="position: absolute;right: 17px;top: 4px;">
              <span
                  v-show="show"
                  @click="getTelCode(ruleForm)"
                  style="margin-left: 40px;"
                  class="getCode cursor"
              >{{ $t('common.Sendverificationcode') }}</span>
              <span
                  v-show="!show"
                  class="count"
                  style="margin-left: 20px;color: #999;"
              >{{ $i18n.locale == 'en' ? 'Resend it after' + '（' + count + 's' + '）' : count + '秒后发送' }}</span>
            </span>
          </el-form-item>
          <el-form-item style="position: relative;" prop="possWord1">
            <el-input
                :placeholder="$i18n.locale=='en'?'Set new password of 8 to 20 digits':'设置8至20位登录密码'"
                v-model="ruleForm.possWord1" show-password class="indent">
            </el-input>
            <i
                class="fa fa-lock"
                aria-hidden="true"
                style="position: absolute;left: 10px;top: 14px;font-size: 20px;color: #666;"
            ></i>
          </el-form-item>
          <el-form-item style="position: relative;" prop="possWord2">
            <el-input
                :placeholder="$i18n.locale=='en'?'Please Enter new login Password again':'请再次输入登录密码'"
                v-model="ruleForm.possWord2" show-password class="indent">
            </el-input>
            <i
                class="fa fa-lock"
                aria-hidden="true"
                style="position: absolute;left: 10px;top: 14px;font-size: 20px;color: #666;"
            ></i>
          </el-form-item>
          <el-form-item>
            <el-checkbox-group v-model="ruleForm.resource">
              <el-checkbox :label="$i18n.locale=='en'?'Read and agree':'已阅读并同意'" name="type"></el-checkbox>
            </el-checkbox-group>
            <span style="float: left;color: #0c27ff;" class="cursor"
                  @click="getAboutMenu('用户协议')">《{{
                $i18n.locale == 'en' ? 'Platform User Agreement' : '平台用户协议'
              }}》</span>
            {{ $t('common.and') }}
            <span style="color:#0c27ff;" class="cursor"
                  @click="getAboutMenu('隐私政策')">《{{ $i18n.locale == 'en' ? 'Privacy Policy' : '隐私政策' }}》</span>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="onSubmitByTel(ruleForm)" style="width: 100%;">
              {{ $i18n.locale == 'en' ? 'Register now' : '立即注册' }}
            </el-button>
          </el-form-item>
        </el-form>
        <!-- 邮箱注册  -->
        <el-form
            ref="emailForm"
            :model="emailForm"
            :rules="rules"
            label-width="0px"
            style="margin: auto; width: 400px;margin-top: 23px;"
            v-else
            class="login2"
        >
          <el-form-item style="position: relative;">
            <el-input :placeholder="$i18n.locale=='en'?'Please enter email address':'请输入邮箱号'" v-model="emailForm.email"
                      class="indent"></el-input>
            <i
                class="el-icon-user-solid"
                style="position: absolute;left: 10px;top: 12px;font-size: 20px;color: #666;"
            ></i>
          </el-form-item>
          <el-form-item style="position: relative;">
            <el-input :placeholder="$i18n.locale=='en'?'Email verification code':'邮件验证码'"
                      v-model="emailForm.vervification" class="indent"></el-input>
            <i
                class="fa fa-commenting"
                aria-hidden="true"
                style="position: absolute;left: 10px;top: 12px;font-size: 20px;color: #666;"
            ></i>
            <span style="position: absolute;right: 17px;top: 4px;">
              <span
                  v-show="show"
                  @click="getMailCode(emailForm)"
                  style="margin-left: 40px;"
                  class="getCode cursor"
              >{{ $t('common.Sendverificationcode') }}</span>
              <span
                  v-show="!show"
                  class="count"
                  style="margin-left: 20px;color: #999;"
              >{{ $i18n.locale == 'en' ? 'Resend it after' + '（' + count + 's' + '）' : count + '秒后发送' }}</span>
            </span>
          </el-form-item>
          <el-form-item style="position: relative;" prop="possWord1">
            <el-input :placeholder="$i18n.locale=='en'?'Set new password of 8 to 20 digits':'设置8至20位登录密码'"
                      v-model="emailForm.possWord1" show-password class="indent"></el-input>
            <i
                class="fa fa-lock"
                aria-hidden="true"
                style="position: absolute;left: 10px;top: 14px;font-size: 20px;color: #666;"
            ></i>
          </el-form-item>
          <el-form-item style="position: relative;" prop="possWord2">
            <el-input
                :placeholder="$i18n.locale=='en'?'Please Enter new login Password again':'请再次输入登录密码'"
                v-model="emailForm.possWord2" show-password class="indent">
            </el-input>
            <i
                class="fa fa-lock"
                aria-hidden="true"
                style="position: absolute;left: 10px;top: 14px;font-size: 20px;color: #666;"
            ></i>
          </el-form-item>
          <el-form-item>
            <el-checkbox-group v-model="emailForm.resource">
              <el-checkbox :label="$i18n.locale=='en'?'Read and agree':'已阅读并同意'" name="type"></el-checkbox>
            </el-checkbox-group>
            <span style="float: left;color: #0c27ff;" class="cursor"
                  @click="getAboutMenu('用户协议')">《{{
                $i18n.locale == 'en' ? 'Platform User Agreement' : '平台用户协议'
              }}》</span>
            {{ $t('common.and') }}
            <span style="color:#0c27ff;" class="cursor"
                  @click="getAboutMenu('隐私政策')">《{{ $i18n.locale == 'en' ? 'Privacy Policy' : '隐私政策' }}》</span>
          </el-form-item>
          <el-form-item>
            <el-button type="primary" @click="onSubmitByMail(emailForm)" style="width: 100%;">
              {{ $i18n.locale == 'en' ? 'Register now' : '立即注册' }}
            </el-button>
          </el-form-item>
        </el-form>
      </div>
    </div>
    <div>
      <el-dialog
          :title="$i18n.locale=='en'?'Registration Agreement':'平台用户协议和隐私政策'"
          :visible.sync="dialogVisible"
          width="60%"
          :before-close="handleClose"
      >
        <el-dialog width="60%"
                   :title="  $i18n.locale=='en'?'《User Agreement of Global Energy Interconnection Development and Cooperation Platform》':'《全球能源互联网发展合作平台用户协议》' "
                   :visible.sync="innerVisible1" append-to-body>
          <iframe v-if="$i18n.locale=='zh'" width="100%" id="embed" name="main" ref="embed1" height="600px"
                  :src="srcPdf3" frameborder="0"></iframe>
          <iframe v-if="$i18n.locale=='en'" width="100%" id="embed" name="main" ref="embed1" height="600px"
                  :src="srcPdf4" frameborder="0"></iframe>

        </el-dialog>
        <el-dialog
            width="60%"
            :title=" $i18n.locale=='en'?'《Privacy Policy of Global Energy Interconnection Development and Cooperation Platform》':'《全球能源互联网发展合作平台隐私政策》' "
            :visible.sync="innerVisible2"
            append-to-body
        >
          <iframe v-if="$i18n.locale=='zh'" width="100%" id="embed" name="main" ref="embed2" height="600px"
                  :src="srcPdf" frameborder="0"></iframe>
          <iframe v-if="$i18n.locale=='en'" width="100%" id="embed" name="main" ref="embed2" height="600px"
                  :src="srcPdf2" frameborder="0"></iframe>
        </el-dialog>
        <div style="width: 70%;margin: auto;word-break: keep-all;"
             v-html="$i18n.locale=='zh'?'<p>【审慎阅读】</p> <p>您在申请注册流程中点击同意前，应当认真阅读以下协议。请您务必审慎阅读、充分理解协议中相关条款内容，其中包括：</p><p>1. 与您约定免除或限制责任的条款；</p><p>2. 与您约定法律适用和管辖的条款；</p><p>3. 其他以粗体下划线标识的重要条款。</p><p>如您对协议有任何疑问，可向平台客服咨询。</p><p>【特别提示】</p><p>当您按照注册页面提示填写信息、阅读并同意协议且完成全部注册程序后，即表示您已充分阅读、理解并接受协议的全部内容。如您因平台服务与全球能源互联网发展合作平台发生争议的，适用《全球能源互联网发展合作平台用户协议》和《全球能源互联网发展合作平台隐私政策》处理。如您在使用平台服务过程中与其他用户发生争议的，  依您与其他用户达成的协议处理。</p>  <p>阅读协议的过程中，如果您不同意相关协议或其中任何条款约定，您应立即停止注册程序。</p>':'<p>【Read carefully】</p> <p>You should carefully read the following agreement before you click agree in the registration process. Please read carefully and fully understand the relevant clauses in the agreement, including:</p><p>1. Agreement with you on terms of exemption or limitation of liability;</p><p>2. Agree with you on the terms of application of law and jurisdiction;</p><p>3. Other important terms marked with bold underline.</p><p>If you have any questions about the agreement, you can consult the platform customer service.</p><p>【Special Note】</p><p>When you follow the instructions on the registration page to fill in the information, read and agree to the agreement, and complete all the registration procedures, it means that you have fully read, understood and accepted all the contents of the agreement. If you have a dispute with the Global Energy Interconnection Development and Cooperation Platform due to platform services, the 《User Agreement of Global Energy Interconnection Development and Cooperation Platform》 and the 《Privacy Policy of Global Energy Interconnection Development and Cooperation Platform》 shall apply. If you have a dispute with other users during the use of platform services, it will be handled inaccordance with the agreement reached between you and other users.</p>  <p>In the process of reading the agreement, if you do not agree to the relevant agreement or any of itsterms, you should immediately stop the registration process.</p>'"></div>
        <div style="width: 70%;margin: auto;">
          <p>
            1.
            <span
                style="color: #0c27ff;"
                class="cursor"
                @click="getAboutMenu('用户协议')"
            >《{{
                $i18n.locale == 'en' ? 'User Agreement of Global Energy Interconnection Development and Cooperation Platform' : '全球能源互联网发展合作平台用户协议'
              }}》</span>
          </p>
          <p>
            2.
            <span
                style="color: #0c27ff;"
                class="cursor"
                @click="getAboutMenu('隐私政策')"
            >《{{
                $i18n.locale == 'en' ? 'Privacy Policy of Global Energy Interconnection Development and Cooperation Platform' : '全球能源互联网发展合作平台隐私政策'
              }}》</span>
          </p>
        </div>
        <div style="width: 70%;margin: auto;margin-top: 50px; text-align: center">
          <span slot="footer" class="dialog-footer">
            <el-button type="primary" @click="dialogVisible = false; ruleForm.resource = true;emailForm.resource = true"
                       style="width: 200px;">{{ $i18n.locale == 'en' ? 'Agree and continue' : '同意并继续' }}</el-button>
          </span>
        </div>
      </el-dialog>
    </div>
  </div>
</template>

<script>
import axios from "axios";
import {registerByTel, updatePrsonnelInfo, sendTelCode} from "@/api/user";
import {getToken} from '@/api/token.js';
import GlobalRoaming from "@/components/GlobalRoaming";
import PlatformRegistered from "@/components/PlatformRegistered";
import LegalNotices from "@/components/LegalNotices";
import {getUserInfoByTel} from "@/api/login";
import {getHelpColumnTree} from '@/api/operation/help/helpCenterEntity';


export default {
  name: "Register",
  components: {GlobalRoaming, PlatformRegistered, LegalNotices},
  data() {
    return {
      num: "1",
      show: true,
      count: "",
      timer: null,
      service: '',
      srcPdf: null,
      srcPdf2: null,
      srcPdf3: null,
      srcPdf4: null,
      phoneNum: '',
      select: '0086',
      dialogVisible: false,
      innerVisible1: false,
      innerVisible2: false,
      codeFromTel: "", //获取的验证码信息
      personnelInfo: '',
      lang: window.localStorage.getItem('locale'),
      ruleForm: {
        tel: "", //手机号
        vervification: "", //验证码
        possWord1: "", //密码
        possWord2: "", //确认密码
        resource: "", // 是否确认用户服务协议
      },
      emailForm: {
        email: "", // 邮箱
        vervification: "", // 验证码
        possWord1: "", // 密码
        possWord2: "", // 确认密码
        resource: "", // 是否确认用户服务协议
      },
      aboutMenu: [],

    };
  },
  mounted() {

    // document.all.iframeid.src = '/api/file/pub/def/Scheme3ofonlineexhibitionhall.pdf';

    let locale = window.localStorage.getItem("locale");
    if (!locale) {
      window.localStorage.setItem("locale", "en");
    }
    this.getAboutId();
    document.title = this.$t('common.GEIDcpTitleSeptember');
    this.$i18n.locale = locale;
    this.getInitData();
    setTimeout((res) => {
      this.dialogVisible = true;
    }, 1000);
    //this.testMethod(); //测试方法
    this.srcPdf = '/api/file/pub/def/PrivacyPolicy_CN.pdf';
    this.srcPdf2 = '/api/file/pub/def/PrivacyPolicy_EN.pdf';
    this.srcPdf3 = '/api/file/pub/def/UserAgreement_CN.pdf';
    this.srcPdf4 = '/api/file/pub/def/UserAgreement_EN.pdf';

    // document.all.iframeid.src = this.srcPdf?this.srcPdf:'';
  },
  computed: {
    rules() {
      return {
        tel: [],
        vervification: [],
        possWord1: [
          {
            min: 8,
            max: 20,
            // pattern:/^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_]+$)(?![a-z0-9]+$)(?![a-z\W_]+$)(?![0-9\W_]+$)[a-zA-Z0-9\W_]{8,20}$/,
            pattern: /^[a-z]{4,10}$/,
            message: this.$i18n.locale == 'en' ? 'Please input 8 to 20 digits password, at least 3 items of upper and lower case letters, numbers and special symbols' : '请输入8到20位密码，大小写字母，数字，特殊符号至少三项',
            trigger: "blur",
          },
        ],
        possWord2: [
          {
            min: 8,
            max: 20,
            pattern: /^[a-z]{4,10}$/,
            message: this.$i18n.locale == 'en' ? 'Please input 8 to 20 digits password, at least 3 items of upper and lower case letters, numbers and special symbols' : '请输入8到20位密码，大小写字母，数字，特殊符号至少三项',
            trigger: "blur",
          },
        ],
        aboutMenu: [],
      }
    }


  },

  methods: {
    getPassAreaCode(code) {
      this.select = code;
    },
    locale(lang) {
      this.$i18n.locale = lang;
      let locale = window.localStorage.getItem("locale");
      if (locale) {
        window.localStorage.setItem("locale", lang);
      } else {
        window.localStorage["locale"] = lang;
      }
    },
    getInitData() {
      let locale = window.localStorage.getItem('locale')
      if (!locale) {
        window.localStorage.setItem('locale', 'zh')
      }
      this.getAboutId();
      this.$i18n.locale = locale
      if (this.$Cookies.get('token') && this.$i18n.locale == 'zh') {
        return this.i = 2
      } else if (this.$i18n.locale == 'en' && this.$Cookies.get('token')) {
        return this.i = 3
      } else {
        return this.i = 1
      }
    },
    locale(lang) {
      this.$i18n.locale = lang
      let locale = window.localStorage.getItem('locale')
      if (locale) {
        window.localStorage.setItem('locale', lang)
      } else {
        window.localStorage['locale'] = lang;
      }
    },
    handleCommand(command) {
      if (command.value == 'loginOut') {
        this.loginOut()
      } else {
        this.toView(0, command.value, command.json)
      }
    },
    // 退出登录
    loginOut() {
      this.$confirm(this.$t('common.Thisoperationwilllogout') + '?', this.$t('common.Tips'), {
        confirmButtonText: this.$t('common.OK'),
        cancelButtonText: this.$t('common.cancel'),
        type: 'warning'
      }).then(() => {
        // 退出的逻辑代码
        this.$store
            .dispatch("user/LOGOUT")
            .then(() => {
              // location.href = "/";
              this.$router.push({
                path: "/login",
              });
            })
            .catch((error) => {
              location.href = "/";
            });
        window.sessionStorage.removeItem("token");
        this.getInitData();
      })
          .catch(() => {
            this.$message({
              type: "info",
              message: this.$t('common.Cancelled'),
            });
          });
    },
    toView(num, router, json) {
      console.log(num, router)
      this.$router.push({name: router, query: {key: json}});
      this.$store.commit("modify", router);
      window.localStorage.setItem("router", router);
      if (num == 1) {
        let i = {
          label: "用户中心",
          value: "userCenterView",
        };
        if (this.$Cookies.get('token')) {
          return (this.i = 2);
        } else if (this.$i18n.locale == "en") {
          return (this.i = 3);
        } else {
          return (this.i = 1);
        }
        this.$nextTick(() => {
          Bus.$emit("title", i);
        });
      }
    },

    // 搜索地区发生变化
    countryChange(item) {
      console.log(item);
    },
    // toView(router, json) {
    //   this.$router.push({ name: router, params: json });
    // },
    toBack() {
      this.$router.push({
        name: "login",
      });
    },
    handleClose(done) {
      this.dialogVisible = false;
    },
    active(num) {
      //清空数据
      Object.assign(this.$data, this.$options.data());
      this.num = num;
      this.getAboutId();
    },
    onSubmit() {
      console.log(this.select);
    },
    // 发送手机验证码
    getTelCode(ruleForm) {
      if (ruleForm.tel == "") {
        this.$message.warning(this.$t('common.Mobilephonenumbercannotbeempty') + "！");
        return;
      }
      this.phoneNum = this.select.concat(ruleForm.tel);
      //验证手机号合法性
      const regPhone = /^([0-9]*)$/;
      if (!regPhone.test(ruleForm.tel)) {
        this.$message.warning(this.$t('common.Pleaseenteravalidmobilephonenumber') + "！");
        return;
      }

      //获取验证码信息
      this.getCheckCode(this.phoneNum, "TX");
      //倒计时
      const TIME_COUNT = 60;
      if (!this.timer) {
        this.count = TIME_COUNT;
        this.show = false;
        this.timer = setInterval(() => {
          if (this.count > 0 && this.count <= TIME_COUNT) {
            this.count--;
          } else {
            this.show = true;
            clearInterval(this.timer);
            this.timer = null;
          }
        }, 1000);
      }
    },
    //手机号注册
    async onSubmitByTel(ruleForm) {
      if (ruleForm.tel == "") {
        this.$message.warning(this.$t('common.Mobilephonenumbercannotbeempty') + "！");
        return;
      }
      //验证手机号合法性
      const regPhone = /^([0-9]*)$/;
      if (!regPhone.test(ruleForm.tel)) {
        this.$message.warning(this.$t('common.Pleaseenteravalidmobilephonenumber') + "！");//请输入合法的手机号
        return;
      }
      if (ruleForm.vervification == "") {
        this.$message.warning(this.$t('common.Verificationcodecannotbeempty') + "！");//验证码不能为空
        return;
      }
      if (ruleForm.possWord1 == "" || ruleForm.possWord2 == "") {
        this.$message.warning(this.$t('common.Passwordcannotbeempty') + "！");//密码不能为空
        return;
      }
      // 验证密码合法性
      const regpassword = /^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_]+$)(?![a-z0-9]+$)(?![a-z\W_]+$)(?![0-9\W_]+$)[a-zA-Z0-9\W_]{8,20}$/;
      if (!regpassword.test(ruleForm.possWord1)) {
        this.$message.warning(this.$t('common.Pleaseinputdigitspassword'));//输入8到20位密码，大小写字母，数字，特殊符号至少三项
        return;
      }

      if (ruleForm.possWord1 != ruleForm.possWord2) {
        this.$message.warning(this.$t('common.Thetwopasswordsarenotthesame') + "！");//两次输入的密码不一致
        return;
      }
      if (!ruleForm.resource) {
        this.$message.warning(this.$t('common.Pleasereadandagreetotheuserservice') + "！");//注册前请阅读并同意《用户服务协议》
        return;
      }
      this.phoneNum = this.select.concat(ruleForm.tel);
      let umsUser = {};
      umsUser.userPreferredMobile = this.phoneNum;

      umsUser.userPassword = ruleForm.possWord1;
      // let isRegister= true;
      // //注册之前，先判断用户是否注册过
      // await  getUserInfoByTel(this.phoneNum).then(result=>{
      //   if(result.data){
      //     isRegister = false;
      //   }
      // }).catch((error) => {
      // })
      // if(isRegister == false) {
      //   return this.$message({
      //     message: this.$t('common.Mobilephonebeen')+"！",
      //     type: 'error'
      //   });
      // }else{
      //
      // }
      await registerByTel(JSON.stringify(umsUser), this.ruleForm.vervification, this.lang).then((result) => {
        this.$message({
          message: this.$t('common.loginwassuccessful') + "！",
          type: 'success'
        });
        this.personnelInfo = result.data;
        //获取注册信息，存入人员信息
        this.updateInfo();
      }).catch((error) => {
        this.msg(error.msg, "error");
      })
    },

    // 发送邮箱验证码
    getMailCode(emailForm) {
      //验证手机号合法性
      const regEmail = /^[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*@[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*\.[a-z]{2,}$/;
      if (!regEmail.test(emailForm.email)) {
        this.$message.warning(this.$t('common.Pleaseenterthecorrectemailnumber') + "！");//请输入正确的邮箱号
        return;
      }
      //获取验证码信息
      this.getCheckCode(emailForm.email, "YJ");
      //倒计时
      const TIME_COUNT = 60;
      if (!this.timer) {
        this.count = TIME_COUNT;
        this.show = false;
        this.timer = setInterval(() => {
          if (this.count > 0 && this.count <= TIME_COUNT) {
            this.count--;
          } else {
            this.show = true;
            clearInterval(this.timer);
            this.timer = null;
          }
        }, 1000);
      }
    },
    msg: function (msg, type) {
      if (msg == 'error') {
        msg = this.$t('common.ThesystemisbusyPleasetryagainlater') + "！"//系统繁忙，请稍后再试
      }
      return this.$message({
        message: msg,
        type: type
      })
    },
    getCheckCode: function (number, service) {
      sendTelCode(number, service, this.lang).then(result => {
	      this.msg(result.msg, "success");
				// this.msg(this.$t('common.Verificationcodehasbeensent') + "！", "success");//验证码已发送，请查收
      }).catch((error) => {
	      this.msg(error.msg, "error");
        // this.msg(this.$t('common.FailedVerification'), "error");
      })
    },
    //邮箱注册
    async onSubmitByMail(emailForm) {
      if (emailForm.email == "") {
        this.$message.warning(this.$t('common.Emailnumbercannotbeempty') + "！");//邮箱号不能为空
        return;
      }
      //验证邮箱号合法性
      const regEmail = /^[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*@[a-zA-Z0-9]+([-_.][a-zA-Z0-9]+)*\.[a-z]{2,}$/;
      if (!regEmail.test(emailForm.email)) {
        this.$message.warning(this.$t('common.Pleaseenterthecorrectemailnumber') + "！");//请输入正确的邮箱号
        return;
      }
      if (emailForm.vervification == "") {
        this.$message.warning(this.$t('common.Verificationcodecannotbeempty') + "！");//验证码不能为空
        return;
      }

      // 验证密码合法性
      const regpassword = /^(?![a-zA-Z]+$)(?![A-Z0-9]+$)(?![A-Z\W_]+$)(?![a-z0-9]+$)(?![a-z\W_]+$)(?![0-9\W_]+$)[a-zA-Z0-9\W_]{8,20}$/;
      if (!regpassword.test(emailForm.possWord1)) {
        this.$message.warning(this.$t('common.Pleaseinputdigitspassword'));//输入8到20位密码，大小写字母，数字，特殊符号至少三项
        return
      }

      if (emailForm.possWord1 == "" || emailForm.possWord2 == "") {
        this.$message.warning(this.$t('common.Passwordcannotbeempty') + "！");//密码不能为空
        return;
      }
      if (emailForm.possWord1 != emailForm.possWord2) {
        this.$message.warning(this.$t('common.Thetwopasswordsarenotthesame') + "！");//两次输入的密码不一致
        return;
      }
      if (!emailForm.resource) {
        this.$message.warning(this.$t('common.Pleasereadandagreetotheuserservice') + "！");//注册前请阅读并同意《用户服务协议》
        return;
      }
      let umsUser = {};
      umsUser.userEmail = emailForm.email;
      umsUser.userPassword = emailForm.possWord1;
      // let isRegisterByEmail = true;
      // //注册之前，先判断用户是否注册过
      // await getUserInfoByTel(emailForm.email).then(result => {
      //   if (result.data) {
      //     isRegisterByEmail = false;
      //   }
      // }).catch((error) => {
      // })
      // if (isRegisterByEmail == false) {
      //   return this.$message({
      //     message: this.$t('common.Emailbeen') + "！",
      //     type: 'error'
      //   });
      // } else {
      //
      // }
      await registerByTel(JSON.stringify(umsUser), this.emailForm.vervification, this.lang).then((result) => {
        this.msg(this.$t('common.loginwassuccessful'), "success");//注册成功
        this.personnelInfo = result.data;
        //获取注册信息，存入人员信息
        this.updateInfo();
      }).catch((error) => {
        this.msg(error.msg, "error");
        // this.msg(this.$t('common.loginwasfailed'), "error");
      })

    },
    updateInfo: function () {
      updatePrsonnelInfo(JSON.stringify(this.personnelInfo), this.lang).then((result) => {
        this.$router.push({
          name: "login",
        });
        // this.$message(result.msg);
      }).catch((error) => {

      })
    },
    //次方法用于测试
    testMethod() {
      axios
          .get("./userRegisterAndLogin/sendCode/", {
            params: {
              telNum: 666,
            },
          })
          .then((res) => {
            console.log(res);
          })
          .catch((error) => {
            console.log(error);
            alert("网络错误，不能访问");
          });
    },
    //用户注册、隐私协议数据连接处理
    getAboutMenu(type) {
      this.aboutMenu.forEach(item => {
        if (item.name == type) {
          this.toViewAbout('helpCenter', item.id);
        }
      })
    },
    //获取用户注册、隐私协议id信息
    getAboutId() {
      var language = "ZH"
      getHelpColumnTree(language).then((result) => {
        this.aboutMenu = [];
        let menuHelp = result.data;
        for (let i = 0; i <= menuHelp.length - 1; i++) {
          if (menuHelp[i].name == "关于我们" || menuHelp[i].name == "About Us") {
            this.aboutMenu = menuHelp[i].children;
          }
          console.log('this.aboutMenu')
          console.log(this.aboutMenu)
        }
      })
    },
    //跳转帮助中心
    toViewAbout(router, id) {
      this.$store.commit('modify', router);
      window.localStorage.setItem('router', router);
      const {href} = this.$router.resolve({
        name: router,
        query: {
          key: id
        }
      });
      window.open(href, '_blank');
    },
  },
};
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.header1 {
  width: 100%;
  height: 120px;
  margin: auto;
  background: #2c558a;
  /* border-bottom: 2px solid #c2c2c2; */
}

.header2 {
  width: 1200px;
  height: 120px;
  margin: auto;
  position: relative;
  border-bottom: 1px solid #fff;
  /* background: skyblue; */
}

.language {
  line-height: 50px;
  color: #ccc;
  font-weight: 400;
  font-size: 12px;
}

.el-form-item__error {
  height: 36px;
}

.jurisdiction >>> p {
  word-break: break-all;
}

.logo {
  position: absolute;
  top: 30px;
  left: 421px;
  width: 240px;
  height: 55px;
  /* background-image: url(@/assets/logo.png); */
}

.title {
  position: absolute;
  top: 40px;
  left: 450px;
  font-size: 30px;
  font-weight: 700;
  color: #fff;
}

.register td {
  height: 78px;
  line-height: 78px;
  font-size: 20px;
  width: 50%;
  display: inline-block;
  color: #999;
  text-align: center;
}

.register td:nth-of-type(2) {

  width: 48.5%;

}

.register .active {
  background: #199ed8;
  color: #fff;
}

.login2 >>> .is-error {
  margin-bottom: 36px !important;
}

.login1 >>> .el-input__inner {
  height: 48px;
}

.login1 >>> .el-button,
.login2 >>> .el-button {
  height: 48px;
}

.login2 >>> .el-input__inner {
  /* text-indent: 30px; */
  height: 48px;
  background: #fff !important;
  border: 1px solid #dcdfe6 !important;
}

.login2 .login2_item >>> .el-input__inner {
}

.login2 >>> .el-select {
  width: 154px;
  height: 48px;
  margin: -10px -21px;
}

.getCode {
  color: #0c27ff;
}

.indent >>> .el-input__inner {
  text-indent: 25px;
}

.login2 .el-checkbox-group {
  float: left;
}

.registerBox >>> .el-dialog__header {
  text-align: center;
}
</style>