1+X新增注册

.config.dev.js

 module.exports = {
   domain: 'dev.ezijing.com',
-  url: 'https://login2.ezijing.com/api',
+  url: 'https://login.ezijing.com/api',
   isEnableToIphoneDebugger: false,
   webpack: {
     externals: {

src/api/account.js

@@ -28,3 +28,15 @@ export function sendCode(data, options) {
 export function resetPassword(data, options) {
   return httpRequest.post('/api/usercenter/user/update-pwd', data, options)
 }
+// xlms注册
+export function xlmsRegister(data) {
+  return httpRequest.post('/api/xlms/user/register', data, { headers: { tenant: 'x1' } })
+}
+// 获取学校
+export function getSchool() {
+  return httpRequest.get('/api/xlms/user/school-list', { headers: { tenant: 'x1' } })
+}
+// 修改用户信息
+export function updateUser(data) {
+  return httpRequest.post('/api/usercenter/user/update-user', data)
+}

src/pages/xlearn/components/layout.vue

@@ -8,7 +8,7 @@
     <section class="main">
       <div class="bg"></div>
       <div class="inner">
-        <div class="main-hd hidden-xs-only">
+        <div class="main-hd hidden-xs-only" v-if="show">
           <h1 class="login-title">{{ subTitle }}</h1>
         </div>
         <div class="main-bd">
@@ -31,6 +31,7 @@ export default {
     return {
       title: '金融产品数字化营销职业技能等级证书',
       subTitle: '',
+      show: true,
       url: webConf.others.xlearn.url
     }
   }
@@ -57,7 +58,7 @@ export default {
     position: relative;
     display: flex;
     max-width: 700px;
-    margin: -200px auto 0;
+    margin: -200px auto 100px;
     background-color: #fff;
     box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.3);
   }

src/pages/xlearn/login.vue

 <template>
-  <router-view @success="handleSuccess"></router-view>
+  <div>
+    <router-view @success="handleSuccess"></router-view>
+    <p class="back" @click="$router.push('../register')">注册</p>
+  </div>
 </template>
 
 <script>
@@ -20,3 +23,11 @@ export default {
   }
 }
 </script>
+<style lang="scss" scoped>
+.back {
+  margin-top: 10px;
+  color: #007bad;
+  text-align: right;
+  cursor: pointer;
+}
+</style>

src/pages/xlearn/register.vue

+<template>
+  <div class="register">
+    <div class="register-form" v-if="!isUpdate">
+      <h1 class="title">注册</h1>
+      <el-form
+        :model="ruleForm"
+        :rules="rules"
+        ref="form"
+        label-position="top"
+        hide-required-asterisk
+        @submit.native.prevent
+      >
+        <el-form-item prop="role" style="text-align: center">
+          <el-radio-group v-model="ruleForm.role">
+            <el-radio label="1">我是学生</el-radio>
+            <el-radio label="2">我是老师</el-radio>
+          </el-radio-group>
+        </el-form-item>
+        <el-form-item prop="school">
+          <el-select v-model="ruleForm.school" placeholder="选择学校" style="width: 100%">
+            <el-option v-for="item in schoolList" :key="item.id" :label="item.name" :value="item.id"></el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item prop="college">
+          <el-input v-model="ruleForm.college" placeholder="学院名称"></el-input>
+        </el-form-item>
+        <el-form-item prop="major">
+          <el-input v-model="ruleForm.major" placeholder="专业名称"></el-input>
+        </el-form-item>
+        <el-form-item label="请选择证书等级" prop="grade">
+          <el-checkbox-group v-model="ruleForm.grade">
+            <el-checkbox label="初级"></el-checkbox>
+            <el-checkbox label="中级"></el-checkbox>
+            <el-checkbox label="高级"></el-checkbox>
+          </el-checkbox-group>
+        </el-form-item>
+        <el-form-item prop="real_name">
+          <el-input v-model="ruleForm.real_name" placeholder="真实姓名"></el-input>
+        </el-form-item>
+        <el-form-item prop="id_number">
+          <el-input v-model="ruleForm.id_number" placeholder="身份证号码" maxlength="18"></el-input>
+        </el-form-item>
+        <el-form-item prop="email">
+          <el-input v-model="ruleForm.email" placeholder="常用邮箱"></el-input>
+        </el-form-item>
+        <el-form-item prop="mobile">
+          <el-input v-model="ruleForm.mobile" placeholder="手机号" maxlength="11"></el-input>
+        </el-form-item>
+        <el-form-item prop="code">
+          <el-input v-model="ruleForm.code" placeholder="验证码" maxlength="4">
+            <countdown
+              slot="suffix"
+              size="mini"
+              :disabled="disabledSend"
+              @start="sendCodeRequest"
+              ref="countdown"
+            ></countdown>
+          </el-input>
+        </el-form-item>
+        <el-button type="primary" class="submit-button" :loading="loading" @click="handleSubmit">注册</el-button>
+      </el-form>
+    </div>
+
+    <div class="register-form" v-else>
+      <h1 class="title">设置用户名和密码</h1>
+      <el-form
+        size="medium"
+        :model="ruleForm"
+        :rules="rules"
+        ref="updateForm"
+        label-position="top"
+        hide-required-asterisk
+        @submit.native.prevent
+      >
+        <el-form-item label="设置用户名" prop="username">
+          <el-input v-model="ruleForm.username" placeholder="6-20个字符" maxlength="20"></el-input>
+        </el-form-item>
+        <el-form-item label="密码" prop="password">
+          <el-input type="password" v-model="ruleForm.password" placeholder="密码" maxlength="20"></el-input>
+        </el-form-item>
+        <el-button type="primary" class="submit-button" :loading="loading" @click="handleUpdate">完成</el-button>
+      </el-form>
+    </div>
+    <p class="back" @click="$router.push('login')">直接登录</p>
+  </div>
+</template>
+
+<script>
+import * as api from '@/api/account'
+import countdown from '@/components/countdown.vue'
+
+export default {
+  name: 'Register',
+  components: { countdown },
+  data() {
+    return {
+      title: '用户注册',
+      ruleForm: {
+        role: '1',
+        school: '',
+        college: '',
+        major: '',
+        grade: [],
+        real_name: '',
+        id_number: '',
+        email: '',
+        mobile: '',
+        code: '',
+        username: '',
+        password: ''
+      },
+      rules: {
+        school: [{ required: true, message: '请选择学校', trigger: 'change' }],
+        college: [{ required: true, message: '请输入学院名称', trigger: 'blur' }],
+        major: [{ required: true, message: '请输入专业名称', trigger: 'blur' }],
+        grade: [{ required: true, message: '请选择证书等级', trigger: 'change' }],
+        real_name: [{ required: true, message: '请输入真实姓名', trigger: 'blur' }],
+        id_number: [{ required: true, message: '请输入身份证号码', trigger: 'blur' }],
+        email: [{ required: true, type: 'email', message: '请输入邮箱', trigger: 'blur' }],
+        mobile: [{ required: true, message: '请输入手机号', trigger: 'blur' }],
+        code: [{ required: true, message: '请输入验证码', trigger: 'blur' }],
+        username: [
+          { required: true, message: '请输入用户名', trigger: 'blur' },
+          { min: 6, max: 20, message: '长度为6-20个字符', trigger: 'blur' }
+        ],
+        password: [
+          { required: true, message: '请输入登录密码', trigger: 'blur' },
+          { min: 6, max: 20, message: '长度为6-20个字符', trigger: 'blur' }
+        ]
+      },
+      schoolList: [],
+      loading: false,
+      isUpdate: false
+    }
+  },
+  computed: {
+    disabledSend() {
+      const value = this.ruleForm.mobile
+      return !(/^1[3-9]\d{9}$/.test(value) || /@/.test(value))
+    }
+  },
+  methods: {
+    // 提交
+    handleSubmit() {
+      this.$refs.form.validate().then(this.handleRequest)
+    },
+    // 接口请求
+    handleRequest() {
+      this.loading = true
+      const params = Object.assign({}, this.ruleForm)
+      params.grade = this.ruleForm.grade.join(',')
+      api
+        .xlmsRegister(params)
+        .then(response => {
+          if (response.code === 0) {
+            this.$message({ message: '注册成功', type: 'success' })
+            this.isUpdate = true
+          } else {
+            this.$message.error(response.msg)
+          }
+        })
+        .finally(() => {
+          this.loading = false
+        })
+    },
+    // 验证码
+    sendCodeRequest() {
+      api
+        .sendCode({ account: this.ruleForm.mobile })
+        .then(response => {
+          console.log(response)
+          if (response.code === 0) {
+            this.$message({ type: 'success', message: '验证码已发送' })
+          } else {
+            // 停止计时
+            this.$refs.countdown.stop()
+            this.$message({ type: 'error', message: response.msg })
+          }
+        })
+        .catch(this.$refs.countdown.stop)
+    },
+    getSchool() {
+      api.getSchool().then(response => {
+        this.schoolList = response
+      })
+    },
+    handleUpdate() {
+      this.$refs.updateForm.validate().then(this.updateUser)
+    },
+    updateUser() {
+      const params = {
+        username: this.ruleForm.username,
+        password: this.ruleForm.password
+      }
+      api.updateUser(params).then(response => {
+        if (response.code === 0) {
+          const { url } = webConf.others.xlearn
+          window.location.href = url
+        } else {
+          this.$message.error(response.msg)
+        }
+      })
+    }
+  },
+  created() {
+    this.$parent.show = false
+  },
+  beforeMount() {
+    this.getSchool()
+  },
+  destroyed() {
+    this.$parent.show = true
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.register {
+  padding: 0 100px;
+}
+::v-deep .register-form .el-form-item--medium .el-form-item__label {
+  line-height: 1;
+}
+.title {
+  margin-bottom: 20px;
+  text-align: center;
+}
+.back {
+  margin-top: 10px;
+  color: #007bad;
+  line-height: 52px;
+  cursor: pointer;
+}
+</style>

src/router/routes.js

@@ -277,6 +277,11 @@ export default [
         path: 'password',
         component: () => import(/* webpackChunkName: "xlearn" */ '../pages/xlearn/password.vue'),
         children: [{ path: '', component: password }]
+      },
+      {
+        path: 'register',
+        component: () => import(/* webpackChunkName: "xlearn" */ '../pages/xlearn/register.vue'),
+        children: [{ path: '', component: register }]
       }
     ]
   },