增加邮箱注册

src/api/model/user.js

@@ -51,6 +51,20 @@ export default {
 			return await http.post(this.url, params);
 		},
 	},
+	register:{
+		url: `${config.API_URL}/user.register`,
+		name: "邮箱注册用户",
+		post: async function (params) {
+			return await http.post(this.url, params);
+		},
+	},
+	active:{
+		url: `${config.API_URL}/email.active.account`,
+		name: "邮箱注册用户激活",
+		post: async function (params) {
+			return await http.post(this.url, params);
+		},
+	},
 	resetPass:{
 		url: `${config.API_URL}/user.reset.pwd`,
 		name: "重置个人密码",

src/layout/index.vue

@@ -55,8 +55,8 @@
 		<header class="adminui-header">
 			<div class="adminui-header-left">
 				<div class="logo-bar">
-<!--					<img class="logo" src="https://dm-auto.oss-cn-shanghai.aliyuncs.com/xw_cloud/image/login_logo.png">-->
+					<img class="logo" src="https://dm-auto.oss-cn-shanghai.aliyuncs.com/xw_cloud/image/login_logo.png">
-					<span>{{ $CONFIG.APP_NAME }}</span>
+<!--					<span>{{ $CONFIG.APP_NAME }}</span>-->
 				</div>
 				<Topbar v-if="!ismobile"></Topbar>
 			</div>

src/router/systemRouter.js

@@ -23,6 +23,13 @@ const routes = [
 			title: "注册"
 		}
 	},
+	{
+		path: "/activate",
+		component: () => import(/* webpackChunkName: "activate" */ '@/views/login/activate'),
+		meta: {
+			title: "邮箱激活"
+		}
+	},
 	{
 		path: "/reset_password",
 		component: () => import(/* webpackChunkName: "resetPassword" */ '@/views/login/resetPassword'),

src/utils/request.js

@@ -42,7 +42,7 @@ axios.interceptors.response.use(
 		if (api_code === 401) {
 			if (!MessageBox_401_show) {
 				MessageBox_401_show = true;
-				ElMessageBox.confirm("当前用户已被登出或无权限访问当前资源，请尝试重新登录后再操作。","无权限访问",{
+				ElMessageBox.confirm(response.data.message,"无权限访问",{
 					type: "error",
 					closeOnClickModal: false,
 					center: true,

src/views/login/activate.vue

@@ -0,0 +1,66 @@
+<template>
+	<div></div>
+</template>
+
+<script>
+export default {
+	name: "activate",
+	data(){
+		return{
+
+		}
+	},
+	created() {
+		let token = this.$route.query.token;
+		this.$TOOL.cookie.set("TOKEN", token)
+	},
+	mounted() {
+		setTimeout(()=>{
+			this.getActivation();
+		},200)
+	},
+	methods:{
+		async getActivation() {
+			const user = await this.$API.user.active.post();
+			if(user.code == 200){
+				this.$TOOL.cookie.set("TOKEN", user.data.token)
+				this.$TOOL.data.set("USER_INFO", user.data.user)
+				if(user.data.user.avatar!=''){
+					this.$store.commit("SET_LOGIN_AVATAR", user.data.user.avatar);
+				}
+				this.$store.commit("SET_LOGIN_NAME", user.data.user.name);
+			}else{
+				return false
+			}
+
+			//获取菜单
+			const menu = await this.$API.system.menu.myMenus.get();
+			if (menu.code == 200) {
+				if (menu.data.menu.length == 0) {
+					this.islogin = false
+					await this.$alert("当前用户无任何菜单权限，请联系系统管理员", "无权限访问", {
+						type: 'error',
+						center: true
+					})
+					return false
+				}
+				this.$TOOL.data.set("MENU", menu.data.menu)
+				this.$TOOL.data.set("PERMISSIONS", menu.data.permissions)
+				this.$TOOL.data.set("DASHBOARDGRID", menu.data.dashboardGrid)
+			} else {
+				this.islogin = false
+				this.$message.warning(menu.message)
+				return false
+			}
+
+			this.$router.replace({
+				path: '/'
+			})
+		}
+	}
+}
+</script>
+
+<style scoped lang="scss">
+
+</style>

src/views/login/userRegister.vue

@@ -1,59 +1,56 @@
 <template>
 	<common-page title="注册">
 		<el-steps :active="stepActive" simple finish-status="success">
-		    <el-step title="创建账户" />
 		    <el-step title="填写信息" />
+			<el-step title="创建账户" />
 		    <el-step title="注册完成" />
 		</el-steps>
 		<el-form v-if="stepActive==0" ref="stepForm_0" :model="form" :rules="rules" label-position="top">
+			<el-form-item label="公司名称" prop="company_name">
+				<el-input v-model="form.company_name" placeholder="请输入公司名称"></el-input>
+			</el-form-item>
+			<el-form-item label="客户名称" prop="customer">
+				<el-input v-model="form.customer" placeholder="请输入客户名称"></el-input>
+			</el-form-item>
+		</el-form>
+		<el-form v-if="stepActive==1" ref="stepForm_1" :model="form" :rules="rules" label-position="top">
 			<el-form-item label="电子邮箱" prop="email">
 				<el-input v-model="form.email" placeholder="请输入邮箱地址"></el-input>
 			</el-form-item>
+			<el-form-item label="登录账号" prop="login_name">
+				<el-input v-model="form.login_name" placeholder="请输入账号"></el-input>
+			</el-form-item>
+			<el-form-item label="用户名" prop="name">
+				<el-input v-model="form.name" placeholder="请输入用户名"></el-input>
+			</el-form-item>
 			<el-form-item label="手机号" prop="mobile">
 				<el-input v-model="form.mobile" placeholder="请输入手机号"></el-input>
 			</el-form-item>
 			<el-form-item label="验证码" prop="verify_code">
 				<el-row justify="space-between" style="width: 100%">
-					<el-col :span="17">
+					<el-col :span="16">
-						<el-form-item>
 						<el-input v-model="form.verify_code" placeholder="请输入验证码"></el-input>
-						</el-form-item>
 					</el-col>
-					<el-col :span="7" align="right">
+					<el-col :span="8" align="right">
 						<el-button @click="getYzm" type="primary" :disabled="disabled">获取验证码 <span v-if="disabled"> ({{ time }})</span></el-button>
 					</el-col>
 				</el-row>
 			</el-form-item>
 		</el-form>
-		<el-form v-if="stepActive==1" ref="stepForm_1" :model="form" :rules="rules" label-position="top">
-			<el-form-item label="公司名称" prop="userName">
-				<el-input v-model="form.userName" placeholder="请输入真实姓名"></el-input>
-			</el-form-item>
-			<el-form-item label="客户名称" prop="email">
-				<el-input v-model="form.email" placeholder="请输入邮箱地址"></el-input>
-			</el-form-item>
-		</el-form>
 		<div v-if="stepActive==2">
-			<el-result icon="success" title="账号注册成功" sub-title="可以使用登录账号以及手机号登录系统">
+			<el-result icon="success" title="账号注册成功" sub-title="">
 				<template #extra>
-					<p class="activation" @click="goLogin">激活邮箱</p>
+					<p class="activation" @click="goActivation">激活邮箱</p>
 				</template>
 			</el-result>
 		</div>
 		<el-form style="text-align: center;">
 			<div class="btnBox">
-				<el-button class="btn" v-if="stepActive<2" type="primary" @click="next" style="width: 100%;">下一步</el-button>
 				<el-button class="btn" v-if="stepActive>0 && stepActive<2" @click="pre" style="width: 100%;">上一步</el-button>
-				<el-button class="btn" v-if="stepActive==2" type="primary" @click="save" style="width: 100%;">完成</el-button>
+				<el-button class="btn" v-if="stepActive<2" type="primary" @click="next" style="width: 100%;">下一步</el-button>
+				<el-button class="btn" v-if="stepActive==2" type="primary" @click="goLogin" style="width: 100%;">完成</el-button>
 			</div>
 		</el-form>
-		<el-dialog v-model="showAgree" title="平台服务协议" :width="800" destroy-on-close>
-			平台服务协议
-			<template #footer>
-				<el-button @click="showAgree=false">取消</el-button>
-				<el-button type="primary" @click="showAgree=false;form.agree=true;">我已阅读并同意</el-button>
-			</template>
-		</el-dialog>
 	</common-page>
 </template>
 
@@ -72,48 +69,37 @@
 				time:60,
 
 				stepActive: 0,
-				showAgree: false,
 				form: {
-					email: "",
+					email: "2678188150@qq.com",
-					mobile:"",
+					mobile:"17610119150",
-					verify_code:"",
+					verify_code:"143087",
-
+					company_name:"中国移动管理有限公司",
-					user: "",
+					customer: "中国移动",
-					agree: false,
+					login_name:"admin",
-					userName: "",
+					name:"ykxiao",
-					userType: "1",
-					open: []
 				},
 				rules: {
 					email: [
 						{ required: true, message: '请输入邮箱地址'}
 					],
+					login_name:[
+						{ required: true, message: '请输入登录账号'}
+					],
+					name:[
+						{ required: true, message: '请输入用户名'}
+					],
 					mobile: [
 						{ required: true, message: '请输入手机号'}
 					],
 					verify_code: [
 						{ required: true, message: '请输入验证码'}
 					],
-
+					company_name: [
-					agree: [
+						{ required: true, message: '请输入公司名称'}
-						{validator: (rule, value, callback) => {
-							if (!value) {
-								callback(new Error('请阅读并同意协议'));
-							}else{
-								callback();
-							}
-						}}
 					],
-					userName: [
+					customer: [
-						{ required: true, message: '请输入真实姓名'}
+						{ required: true, message: '请输入客户名称'}
 					],
-
-					userType: [
-						{ required: true, message: '请选择账户类型'}
-					],
-					open: [
-						{ required: true, message: '请选择开通类别'}
-					]
 				}
 			}
 		},
@@ -121,14 +107,42 @@
 
 		},
 		methods: {
-			getYzm(){
+			async getYzm() {
-
+				const validate = await this.$refs.stepForm_0.validateField("mobile").catch(() => {});
+				if (!validate) {
+					return false
+				}
+				const res = await this.$API.user.verifyCode.post({mobile: this.form.mobile});
+				if (res.code === 200) {
+					this.$message.success('短信已发送至手机号码');
+					this.disabled = true
+					this.time = 60
+					const t = setInterval(() => {
+						this.time -= 1
+						if (this.time < 1) {
+							clearInterval(t)
+							this.disabled = false
+							this.time = 0
+						}
+					}, 1000);
+				}
 			},
 			pre(){
 				this.stepActive -= 1
 			},
-			next(){
+			async next() {
-				const formName = `stepForm_${this.stepActive}`
+				const formName = `stepForm_${this.stepActive}`;
+				if (this.stepActive == 1) {
+					const res = await this.$API.user.register.post(this.form);
+					if (res.code == 200) {
+						this.$message.success('注册成功，请查看邮箱激活账户');
+						this.nextPre(formName);
+					}
+				} else {
+					this.nextPre(formName);
+				}
+			},
+			nextPre(formName){
 				this.$refs[formName].validate((valid) => {
 					if (valid) {
 						this.stepActive += 1
@@ -147,6 +161,11 @@
 					}
 				})
 			},
+			goActivation(){
+				this.$router.push({
+					path: '/activate'
+				})
+			},
 			goLogin(){
 				this.$router.push({
 					path: '/login'
@@ -159,6 +178,7 @@
 <style scoped lang="scss">
 	.activation{
 		color: var(--el-color-primary);
+		cursor: pointer;
 	}
 	.btnBox{
 		display: flex;align-items: center;