用户填写信息表单
CTP
2 years ago
parent
31afd84da4
commit
1564eb6eb9
@ -1,56 +1,65 @@
|
|||||||
import router from './router'
|
import router from "./router";
|
||||||
import store from './store'
|
import store from "./store";
|
||||||
import { Message } from 'element-ui'
|
import { Message } from "element-ui";
|
||||||
import NProgress from 'nprogress'
|
import NProgress from "nprogress";
|
||||||
import 'nprogress/nprogress.css'
|
import "nprogress/nprogress.css";
|
||||||
import { getToken } from '@/utils/auth'
|
import { getToken } from "@/utils/auth";
|
||||||
import { isRelogin } from '@/utils/request'
|
import { isRelogin } from "@/utils/request";
|
||||||
|
|
||||||
NProgress.configure({ showSpinner: false })
|
NProgress.configure({ showSpinner: false });
|
||||||
|
|
||||||
const whiteList = ['/login', '/auth-redirect', '/bind', '/register']
|
const whiteList = [
|
||||||
|
"/login",
|
||||||
|
"/auth-redirect",
|
||||||
|
"/bind",
|
||||||
|
"/register",
|
||||||
|
"/userInformation",
|
||||||
|
];
|
||||||
|
|
||||||
router.beforeEach((to, from, next) => {
|
router.beforeEach((to, from, next) => {
|
||||||
NProgress.start()
|
NProgress.start();
|
||||||
if (getToken()) {
|
if (getToken()) {
|
||||||
to.meta.title && store.dispatch('settings/setTitle', to.meta.title)
|
to.meta.title && store.dispatch("settings/setTitle", to.meta.title);
|
||||||
/* has token*/
|
/* has token*/
|
||||||
if (to.path === '/login') {
|
if (to.path === "/login") {
|
||||||
next({ path: '/' })
|
next({ path: "/" });
|
||||||
NProgress.done()
|
NProgress.done();
|
||||||
} else {
|
} else {
|
||||||
if (store.getters.roles.length === 0) {
|
if (store.getters.roles.length === 0) {
|
||||||
isRelogin.show = true
|
isRelogin.show = true;
|
||||||
// 判断当前用户是否已拉取完user_info信息
|
// 判断当前用户是否已拉取完user_info信息
|
||||||
store.dispatch('GetInfo').then(() => {
|
store
|
||||||
isRelogin.show = false
|
.dispatch("GetInfo")
|
||||||
store.dispatch('GenerateRoutes').then(accessRoutes => {
|
.then(() => {
|
||||||
// 根据roles权限生成可访问的路由表
|
isRelogin.show = false;
|
||||||
router.addRoutes(accessRoutes) // 动态添加可访问路由表
|
store.dispatch("GenerateRoutes").then((accessRoutes) => {
|
||||||
next({ ...to, replace: true }) // hack方法 确保addRoutes已完成
|
// 根据roles权限生成可访问的路由表
|
||||||
})
|
router.addRoutes(accessRoutes); // 动态添加可访问路由表
|
||||||
}).catch(err => {
|
next({ ...to, replace: true }); // hack方法 确保addRoutes已完成
|
||||||
store.dispatch('LogOut').then(() => {
|
});
|
||||||
Message.error(err)
|
|
||||||
next({ path: '/' })
|
|
||||||
})
|
|
||||||
})
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
store.dispatch("LogOut").then(() => {
|
||||||
|
Message.error(err);
|
||||||
|
next({ path: "/" });
|
||||||
|
});
|
||||||
|
});
|
||||||
} else {
|
} else {
|
||||||
next()
|
next();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
// 没有token
|
// 没有token
|
||||||
if (whiteList.indexOf(to.path) !== -1) {
|
if (whiteList.indexOf(to.path) !== -1) {
|
||||||
// 在免登录白名单，直接进入
|
// 在免登录白名单，直接进入
|
||||||
next()
|
next();
|
||||||
} else {
|
} else {
|
||||||
next(`/login?redirect=${to.fullPath}`) // 否则全部重定向到登录页
|
next(`/login?redirect=${to.fullPath}`); // 否则全部重定向到登录页
|
||||||
NProgress.done()
|
NProgress.done();
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
|
|
||||||
router.afterEach(() => {
|
router.afterEach(() => {
|
||||||
NProgress.done()
|
NProgress.done();
|
||||||
})
|
});
|
||||||
|
|||||||
@ -0,0 +1,224 @@
|
|||||||
|
<template>
|
||||||
|
<!-- 用户信息填写 -->
|
||||||
|
<el-card class="userInformation">
|
||||||
|
<el-form
|
||||||
|
label-width="135px"
|
||||||
|
:model="userForm"
|
||||||
|
:rules="rulesUserForm"
|
||||||
|
ref="userForm"
|
||||||
|
class="userForm"
|
||||||
|
label-position="right"
|
||||||
|
>
|
||||||
|
<h4 style="text-align: center">新用户注册表</h4>
|
||||||
|
<el-form-item label="手机号码(唯一)" prop="mobile">
|
||||||
|
<el-input
|
||||||
|
placeholder="请输入手机号码"
|
||||||
|
v-model="userForm.mobile"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="企业名称(唯一)" prop="companyName">
|
||||||
|
<el-input
|
||||||
|
placeholder="请输入企业名称"
|
||||||
|
v-model="userForm.companyName"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="社会信用号(唯一)" prop="creditNum">
|
||||||
|
<el-input
|
||||||
|
placeholder="请输入企业社会信用号"
|
||||||
|
v-model="userForm.creditNum"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="企业类型" prop="bussinessStatus">
|
||||||
|
<el-select
|
||||||
|
v-model="userForm.bussinessStatus"
|
||||||
|
placeholder="请选择企业类型"
|
||||||
|
>
|
||||||
|
<el-option label="生产企业" value="1"></el-option>
|
||||||
|
<el-option label="流通企业" value="2"></el-option>
|
||||||
|
<el-option label="医疗机构" value="3"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="法人名称" prop="legalPerson">
|
||||||
|
<el-input
|
||||||
|
placeholder="请输入法人名称"
|
||||||
|
v-model="userForm.legalPerson"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="法人身份证号(唯一) " prop="legalldCard">
|
||||||
|
<el-input
|
||||||
|
placeholder="请输入法人身份证号"
|
||||||
|
v-model="userForm.legalldCard"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="注册地址" prop="registerAddress">
|
||||||
|
<el-input
|
||||||
|
placeholder="请输入注册地址"
|
||||||
|
v-model="userForm.registerAddress"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="联系方式" prop="contactWay">
|
||||||
|
<el-input
|
||||||
|
placeholder="请输入联系方式"
|
||||||
|
v-model="userForm.contactWay"
|
||||||
|
></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item label="邮箱" prop="email">
|
||||||
|
<el-input placeholder="请输入邮箱" v-model="userForm.email"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<!-- <el-form-item label="注册状态" prop="checkStatus">
|
||||||
|
<el-select disabled v-model="userForm.checkStatus">
|
||||||
|
<el-option label="未审核" value="0"></el-option>
|
||||||
|
<el-option label="已审核" value="1"></el-option>
|
||||||
|
<el-option label="未通过" value="2"></el-option>
|
||||||
|
</el-select>
|
||||||
|
</el-form-item> -->
|
||||||
|
<el-form-item label="备注" prop="comments">
|
||||||
|
<el-input v-model="userForm.comments"></el-input>
|
||||||
|
</el-form-item>
|
||||||
|
<el-form-item>
|
||||||
|
<el-button
|
||||||
|
type="primary"
|
||||||
|
class="bntNext"
|
||||||
|
@click="submitUserForm('userForm')"
|
||||||
|
>提交</el-button
|
||||||
|
>
|
||||||
|
</el-form-item>
|
||||||
|
</el-form>
|
||||||
|
<div class="audit">
|
||||||
|
<el-form> </el-form>
|
||||||
|
</div>
|
||||||
|
</el-card>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "userInformation",
|
||||||
|
data() {
|
||||||
|
//限制输入正确的手机号码格式
|
||||||
|
const validatePhone = (rule, value, callback) => {
|
||||||
|
if (/^1[3-9]\d{9}$/.test(value) === false) {
|
||||||
|
callback(new Error("请输入正确的手机号码"));
|
||||||
|
} else {
|
||||||
|
// 校验通过
|
||||||
|
callback();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
//限制输入正确的邮箱
|
||||||
|
const validateEmail = (rule, value, callback) => {
|
||||||
|
if (
|
||||||
|
/^([a-zA-Z0-9]+[_|_|.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|_|.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/.test(
|
||||||
|
value
|
||||||
|
) === false
|
||||||
|
) {
|
||||||
|
callback(new Error("请输入正确的邮箱地址"));
|
||||||
|
} else {
|
||||||
|
// 校验通过
|
||||||
|
callback();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
//限制统一信用号
|
||||||
|
const validatePatt = (rule, value, callback) => {
|
||||||
|
if (
|
||||||
|
/^([0-9A-HJ-NPQRTUWXY]{2}\d{6}[0-9A-HJ-NPQRTUWXY]{10}|[1-9]\d{14})$/.test(
|
||||||
|
value
|
||||||
|
) === false
|
||||||
|
) {
|
||||||
|
callback(new Error("请输入有效的的社会统一信用号"));
|
||||||
|
} else {
|
||||||
|
// 校验通过
|
||||||
|
callback();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
//限制身份证号码
|
||||||
|
const validateIdentity = (rule, value, callback) => {
|
||||||
|
if (/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(value) === false) {
|
||||||
|
callback(new Error("请输入正确的身份证号码"));
|
||||||
|
} else {
|
||||||
|
// 校验通过
|
||||||
|
callback();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
return {
|
||||||
|
userForm: {
|
||||||
|
mobile: null, //手机号码
|
||||||
|
companyName: null, //企业名称
|
||||||
|
creditNum: null, //社会信用号
|
||||||
|
bussinessStatus: null, //企业类型
|
||||||
|
legalPerson: null, //法人名称
|
||||||
|
legalldCard: null, //法人身份证号
|
||||||
|
registerAddress: null, //注册地址
|
||||||
|
contactWay: null, //练习方式
|
||||||
|
email: null, //邮箱
|
||||||
|
//checkStatus: null, //注册状态
|
||||||
|
comments: null, //备注
|
||||||
|
},
|
||||||
|
rulesUserForm: {
|
||||||
|
mobile: [
|
||||||
|
{ required: true, message: "请输入手机号码", trigger: "blur" },
|
||||||
|
{ validator: validatePhone, trigger: "blur" },
|
||||||
|
],
|
||||||
|
companyName: [
|
||||||
|
{ required: true, message: "请输入企业名称", trigger: "blur" },
|
||||||
|
],
|
||||||
|
creditNum: [
|
||||||
|
{ required: true, message: "请输入社会信用号", trigger: "blur" },
|
||||||
|
{ validator: validatePatt, trigger: "blur" },
|
||||||
|
],
|
||||||
|
bussinessStatus: [
|
||||||
|
{ required: true, message: "请选择企业类型", trigger: "change" },
|
||||||
|
],
|
||||||
|
legalPerson: [
|
||||||
|
{ required: true, message: "请输入法人名称", trigger: "blur" },
|
||||||
|
],
|
||||||
|
legalldCard: [
|
||||||
|
{ required: true, message: "请输入法人身份证号", trigger: "blur" },
|
||||||
|
{ validator: validateIdentity, trigger: "blur" },
|
||||||
|
],
|
||||||
|
registerAddress: [
|
||||||
|
{ required: true, message: "请输入注册地址", trigger: "blur" },
|
||||||
|
],
|
||||||
|
contactWay: [
|
||||||
|
{ required: true, message: "请输入联系方式", trigger: "blur" },
|
||||||
|
{ validator: validatePhone, trigger: "blur" },
|
||||||
|
],
|
||||||
|
email: [
|
||||||
|
{ required: true, message: "请输入邮箱", trigger: "blur" },
|
||||||
|
{ validator: validateEmail, trigger: "blur" },
|
||||||
|
],
|
||||||
|
checkStatus: [
|
||||||
|
{ required: true, message: "注册状态", trigger: "change" },
|
||||||
|
],
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
//用户信息填写 表单
|
||||||
|
submitUserForm(userForm) {
|
||||||
|
console.log("222");
|
||||||
|
this.$refs[userForm].validate((valid) => {
|
||||||
|
if (valid) {
|
||||||
|
const data = this.userForm;
|
||||||
|
this.$message.error("提交成功,请等待审核");
|
||||||
|
registerSave(data).then((response) => {
|
||||||
|
if (response.code === 20000) {
|
||||||
|
this.$message.error("提交成功,请等待审核");
|
||||||
|
} else {
|
||||||
|
this.$message.error(response.message);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style rel="stylesheet/scss" lang="scss">
|
||||||
|
.userInformation {
|
||||||
|
.userForm {
|
||||||
|
margin: 100px 0 0 100px;
|
||||||
|
width: 335px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue