Skip to content

S
so-manage-ui
Commit a54c7392 authored by 张俊's avatar 张俊
Browse files
Options

登录菜单调整

parent 5f3e72c7
Hide whitespace changes
Inline Side-by-side
Showing with 215 additions and 190 deletions
src/components/login-by-account.vue
View file @ a54c7392
<template> <template>
<div class="login-by-account"> <div class="login-by-account">
<el-form ref="loginForm" label-position="top" :model="loginForm" :rules="steploginFormRules"> <el-form
<el-form-item label="账号" prop="userid"> ref="loginForm"
label-position="top"
:model="loginForm"
:rules="steploginFormRules"
>
<el-form-item label="账号" prop="userid">
<el-input
v-model="loginForm.userid"
autofocus="autofocus"
placeholder="请输入账号"
@keyup.enter.native="loginAction()"
/>
</el-form-item>
<el-form-item label="密码" prop="password">
<el-input
:type="hidePassword ? 'password' : 'text'"
v-model="loginForm.password"
placeholder="请输入密码"
@keyup.enter.native="loginAction()"
>
<span
slot="suffix"
:title="hidePassword ? '显示密码' : '隐藏密码'"
:class="hidePassword ? 'hide-password' : 'show-password'"
@click="hidePassword = !hidePassword"
style="cursor: pointer"
></span>
</el-input>
</el-form-item>
<el-form-item label="验证码" prop="yzm">
<div class="msg-code">
<el-input <el-input
v-model="loginForm.userid" v-model="loginForm.yzm"
autofocus="autofocus" placeholder="请输入验证码"
placeholder="请输入账号"
@keyup.enter.native="loginAction()" @keyup.enter.native="loginAction()"
/> />
</el-form-item> <img
<el-form-item label="密码" prop="password"> class="yzm_img"
<el-input title="看不清？换一张"
:type="hidePassword ? 'password' : 'text'" :src="imgSrc"
v-model="loginForm.password" @click="getImg()"
placeholder="请输入密码" />
@keyup.enter.native="loginAction()" </div>
> </el-form-item>
<span <el-form-item>
slot="suffix" <el-checkbox v-model="rememberPassword">记住密码</el-checkbox>
:title="hidePassword ? '显示密码' : '隐藏密码'" </el-form-item>
:class="hidePassword ? 'hide-password' : 'show-password'" <el-form-item>
@click="hidePassword = !hidePassword" <el-button type="primary" @click="loginAction()" style="width: 100%">
style="cursor:pointer;" 登 录
></span> </el-button>
</el-input> </el-form-item>
</el-form-item> </el-form>
<el-form-item label="验证码" prop="yzm"> </div>
<div class="msg-code"> </template>
<el-input
v-model="loginForm.yzm"
placeholder="请输入验证码"
@keyup.enter.native="loginAction()"
/>
<img class="yzm_img" title="看不清？换一张" :src="imgSrc" @click="getImg()" />
</div>
</el-form-item>
<el-form-item>
<el-checkbox v-model="rememberPassword">记住密码</el-checkbox>
</el-form-item>
<el-form-item>
<el-button type="primary" @click="loginAction()" style="width:100%;">
登 录
</el-button>
</el-form-item>
</el-form>
</div>
</template>
<script>
import CryptoJS from "crypto-js";
import { getCookie, clearCookie, setCookie } from "@/services/cookie.js";
import menu from '../router/function'
import {generateRoutes} from '../router/index'
export default {
name: "LoginByAccount", // 账号密码登录
data() {
return {
loginForm: {
userid: "",
password: "",
yzm: "",
},
steploginFormRules: {
userid: [{ required: true, message: "请输入账号", trigger: "blur" }],
password: [{ required: true, message: "请输入密码", trigger: "blur" }],
yzm: [
{ required: true, message: "请输入验证码", trigger: "blur" },
],
},
imgId:'',
imgSrc:'',
identifyCode: "",
hidePassword: true,
rememberPassword: false,
};
},
methods: {
loginAction() {
if (this.rememberPassword) {
let userinfo = encodeURI(
encodeURI(`${this.loginForm.userid},${this.loginForm.password}`)
);
setCookie("userinfo", userinfo);
} else {
clearCookie("userinfo");
}
<script>
this.$refs.loginForm.validate((valid) => { import CryptoJS from "crypto-js";
if (valid) { import { getCookie, clearCookie, setCookie } from "@/services/cookie.js";
this.$axios import menu from "../router/function";
.get(`/apaas/system/v5/user/verifyCaptcha?id=${this.imgId}&value=${this.loginForm.yzm}`) import { generateRoutes } from "../router/index";
.then((res) => {
if (res.data.code == 200) { export default {
this.login(); name: "LoginByAccount", // 账号密码登录
} else { data() {
this.$message.error(res.data.data); return {
} loginForm: {
}); userid: "",
password: "",
} yzm: "",
}); },
steploginFormRules: {
userid: [{ required: true, message: "请输入账号", trigger: "blur" }],
password: [{ required: true, message: "请输入密码", trigger: "blur" }],
yzm: [{ required: true, message: "请输入验证码", trigger: "blur" }],
}, },
login(){ imgId: "",
this.$axios imgSrc: "",
identifyCode: "",
hidePassword: true,
rememberPassword: false,
};
},
methods: {
loginAction() {
if (this.rememberPassword) {
let userinfo = encodeURI(
encodeURI(`${this.loginForm.userid},${this.loginForm.password}`)
);
setCookie("userinfo", userinfo);
} else {
clearCookie("userinfo");
}
this.$refs.loginForm.validate((valid) => {
if (valid) {
this.$axios
.get(
`/apaas/system/v5/user/verifyCaptcha?id=${this.imgId}&value=${this.loginForm.yzm}`
)
.then((res) => {
if (res.data.code == 200) {
this.login();
} else {
this.$message.error(res.data.data);
}
});
}
});
},
login() {
this.$axios
.post(`/apaas/system/v5/user/login`, { .post(`/apaas/system/v5/user/login`, {
system_account: this.loginForm.userid, system_account: this.loginForm.userid,
password: CryptoJS.AES.encrypt(this.loginForm.password,"swuE9cmCZQwrkYRV").toString(), password: CryptoJS.AES.encrypt(
}).then(({ data }) => { this.loginForm.password,
if (data.code == 200) { "swuE9cmCZQwrkYRV"
this.getUser(); ).toString(),
} else { })
this.getImg(true); .then(({ data }) => {
this.$message({ if (data.code == 200) {
message: data.errMsg, this.getUser();
type: "error", } else {
}); this.getImg(true);
} this.$message({
}) message: data.errMsg,
.catch((error) => { type: "error",
console.log(error); });
}); }
}, })
getUser() { .catch((error) => {
this.$axios.get(`/apaas/system/v5/user/getUserInfo`).then((res) => { console.log(error);
if (res.data.code == 200) { });
this.$store.commit("setUserInfo", res.data.data); },
// if (res.data.data.userType == 1) { getUserInfo() {
//超管 return this.$axios.get(`/apaas/system/v5/user/getUserInfo`);
this.$store.commit("setMenu", menu.adminMenu); },
getMenu() {
return this.$axios.get(`/apaas/system/v5/menu/user/tree`);
},
getUser() {
Promise.all([this.getUserInfo(), this.getMenu()]).then((res) => {
if (res[0].data.code == 200 && res[1].data.code == 200) {
let data = res[1].data.data[0].children || [];
this.$store.commit("setUserInfo", res[0].data.data);
// if (res.data.data.userType == 1) {
//超管
this.$store.commit("setMenu", data);
menu.menuToRouter(menu.adminMenu) menu.menuToRouter(data);
this.$store.commit('setRoute',menu.adminMenu) this.$store.commit("setRoute", data);
//存储菜单对象信息 //存储菜单对象信息
let menuObj = {} let menuObj = {};
this.getMenuObj(menu.adminMenu,'',menuObj) this.getMenuObj(data, "", menuObj);
this.$store.commit('setMenuObj',menuObj) this.$store.commit("setMenuObj", menuObj);
// } // }
generateRoutes() generateRoutes();
// this.$router.push("/"); // this.$router.push("/");
//跳转到工作台页面 //跳转到工作台页面
window.location.href = '/apaas/portal/ui/#/' window.location.href = "/apaas/portal/ui/#/";
}
});
},
getMenuObj(menu,parentRowPath,menuObj){
menu.forEach((e,idx) => {
e.rowPath = parentRowPath + '.' + idx
menuObj[e.path] = e
if(e.children&&e.children.length){
this.getMenuObj(e.children,e.rowPath,menuObj)
}
});
},
getImg(clearInput = false) {
this.$axios.get(`/apaas/system/v5/user/getCaptcha??width=240&height=32`).then((res) => {
if (res.data.code == 200) {
this.imgId = res.data.data.id;
this.imgSrc = res.data.data.captcha;
}
});
if (clearInput) {
this.loginForm.yzm = "";
} }
}, });
}, },
created() { getMenuObj(menu, parentRowPath, menuObj) {
this.getImg(); menu.forEach((e, idx) => {
if (getCookie("userinfo")) { e.rowPath = parentRowPath + "." + idx;
let userinfo = decodeURI(decodeURI(getCookie("userinfo"))).split(","); menuObj[e.path] = e;
if (e.children && e.children.length) {
this.loginForm.userid = userinfo[0]; this.getMenuObj(e.children, e.rowPath, menuObj);
this.loginForm.password = userinfo[1]; }
this.checked = true; });
},
this.rememberPassword = true getImg(clearInput = false) {
} else { this.$axios
this.checked = false; .get(`/apaas/system/v5/user/getCaptcha??width=240&height=32`)
.then((res) => {
if (res.data.code == 200) {
this.imgId = res.data.data.id;
this.imgSrc = res.data.data.captcha;
}
});
if (clearInput) {
this.loginForm.yzm = "";
} }
}, },
}; },
</script> created() {
this.getImg();
<style lang="scss" scoped> if (getCookie("userinfo")) {
.msg-code { let userinfo = decodeURI(decodeURI(getCookie("userinfo"))).split(",");
display: flex;
justify-content: space-between; this.loginForm.userid = userinfo[0];
align-items: center; this.loginForm.password = userinfo[1];
this.checked = true;
> .bg-identify {
margin-left: 6px; this.rememberPassword = true;
flex-shrink: 0; } else {
this.checked = false;
} }
},
};
</script>
<style lang="scss" scoped>
.msg-code {
display: flex;
justify-content: space-between;
align-items: center;
> .bg-identify {
margin-left: 6px;
flex-shrink: 0;
} }
</style> }
</style>
\ No newline at end of file
src/main.js
View file @ a54c7392
...@@ -43,6 +43,11 @@ function getUser() { ...@@ -43,6 +43,11 @@ function getUser() {
return axios.get(`/apaas/system/v5/user/getUserInfo`) return axios.get(`/apaas/system/v5/user/getUserInfo`)
} }
//获取用户菜单信息
function getMenu() {
return axios.get(`/apaas/system/v5/menu/user/tree`)
}
//处理菜单成为对象 //处理菜单成为对象
function getMenuObj(menu,parentRowPath,menuObj){ function getMenuObj(menu,parentRowPath,menuObj){
menu.forEach((e,idx) => { menu.forEach((e,idx) => {
...@@ -55,22 +60,22 @@ function getMenuObj(menu,parentRowPath,menuObj){ ...@@ -55,22 +60,22 @@ function getMenuObj(menu,parentRowPath,menuObj){
} }
Promise.all([getUser()]).then(res => { Promise.all([getUser(),getMenu()]).then(res => {
console.log(res); console.log(res);
if (res[0].data.code == 200) { if (res[0].data.code == 200&&res[1].data.code == 200) {
//已登录则记录菜单和用户信息 //已登录则记录菜单和用户信息
let data = res[1].data.data[0].children||[]
store.commit('setUserInfo', res[0].data.data) store.commit('setUserInfo', res[0].data.data)
// if (res[0].data.data.userType == 1) {//超管 // if (res[0].data.data.userType == 1) {//超管
store.commit('setMenu', menu.adminMenu) store.commit('setMenu', data)
menu.menuToRouter(menu.adminMenu) menu.menuToRouter(data)
console.log(menu); console.log(menu);
store.commit('setRoute',menu.adminMenu) store.commit('setRoute',data)
//存储菜单对象信息 //存储菜单对象信息
let menuObj = {} let menuObj = {}
getMenuObj(menu.adminMenu,'',menuObj) getMenuObj(data,'',menuObj)
store.commit('setMenuObj',menuObj) store.commit('setMenuObj',menuObj)
console.log(menuObj); console.log(menuObj);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment