153 lines
3.8 KiB
Vue
153 lines
3.8 KiB
Vue
<!-- -->
|
||
<template>
|
||
<div>
|
||
|
||
</div><div class='formBorderMid'>
|
||
<div class='mainTitle'>WCS 设备控制系统</div>
|
||
<div>您的管理员已经禁止直接登陆，请使用主程序跳转</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
// import 《组件名称》 from '《组件路径》 ';
|
||
|
||
|
||
import {ElMessage, ElMessageBox} from "element-plus";
|
||
import userApi from "@/axios/user";
|
||
import router from "@/router";
|
||
|
||
export default {
|
||
// import 引入的组件需要注入到对象中才能使用
|
||
components: {},
|
||
props: [],
|
||
emits: [],
|
||
data() {
|
||
// 这里存放数据
|
||
return {
|
||
loginUser: {
|
||
userId: '',
|
||
userPassword: ''
|
||
},
|
||
loading: false
|
||
}
|
||
},
|
||
// 计算属性 类似于 data 概念
|
||
computed: {},
|
||
// 监控 data 中的数据变化
|
||
watch: {},
|
||
// 方法集合
|
||
methods: {
|
||
// 登陆按钮
|
||
onSubmit(userName) {
|
||
this.loading = true
|
||
userApi.login(this.loginUser).then((response) => {
|
||
const data = response.data
|
||
if(data.code !== 0) {
|
||
// 服务器返回失败
|
||
ElMessageBox.alert(`登陆失败，信息：${data.msg}`, '登陆失败', {
|
||
confirmButtonText: '确定'
|
||
}).catch(()=>{ })
|
||
} else {
|
||
// 登陆成功
|
||
ElMessage({
|
||
message: '登陆成功',
|
||
type: 'success',
|
||
})
|
||
const returnData = data['returnData']
|
||
window.sessionStorage.setItem("userName", returnData.userName)
|
||
window.sessionStorage.setItem("token", returnData.token)
|
||
let userInfo = { userId: this.loginUser.userId, userName: userName}
|
||
this.$store.commit('setUserInfo', userInfo)
|
||
this.loadMenu(returnData.menu) // 加载菜单
|
||
router.push({name: 'wcs'})
|
||
}
|
||
this.loading = false
|
||
}).catch((err) => {
|
||
ElMessageBox.alert(`请求登陆失败，异常信息：${err}`, '登陆失败', {
|
||
type: 'warning',
|
||
confirmButtonText: '确定'
|
||
}).catch(()=>{ })
|
||
this.loading = false
|
||
})
|
||
},
|
||
// 加载菜单
|
||
loadMenu(menu) {
|
||
if(menu === undefined || menu.length < 1) {
|
||
return
|
||
}
|
||
this.$store.commit('setMenuData', menu)
|
||
let menuList = []
|
||
menu.forEach((menuItem, index) => {
|
||
const minor = menuItem.minor
|
||
if(minor === undefined || minor.length < 1) {
|
||
return
|
||
}
|
||
minor.forEach((minorItem, index) => {
|
||
menuList.push(minorItem)
|
||
})
|
||
})
|
||
this.$store.commit('setMenuList', menuList)
|
||
window.sessionStorage.setItem("menuList", JSON.stringify(menuList))
|
||
}
|
||
},
|
||
// 组合式 API
|
||
setup() {
|
||
},
|
||
// 创建之前
|
||
beforeCreate() {
|
||
},
|
||
// 创建完成(可以访问 this 实例)
|
||
created() {
|
||
this.$store.commit('resetMenuData');
|
||
this.$store.commit('resetTabs');
|
||
|
||
// 检测url，用于从其他页面直接跳转
|
||
const url = window.location.href
|
||
if (url.includes("?")) {
|
||
const info = url.split("?")[1];
|
||
const userNameInfo = info.split("=");
|
||
if (userNameInfo.length < 1) {
|
||
return;
|
||
}
|
||
const userName = userNameInfo[1];
|
||
this.loginUser.userPassword = 'user';
|
||
this.loginUser.userId = 'user';
|
||
this.onSubmit(userName);
|
||
}
|
||
},
|
||
// 生命周期 - 挂载之前
|
||
beforeMount() {
|
||
},
|
||
// 生命周期 - 挂载完成（可以访问 DOM 元素）
|
||
mounted() {
|
||
},
|
||
// 更新之前
|
||
beforeUpdate() {
|
||
},
|
||
// 更新之后
|
||
updated() {
|
||
},
|
||
// 销毁之前
|
||
beforeUnmount() {
|
||
},
|
||
// 销毁完成
|
||
unmounted() {
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style lang="scss" scoped>
|
||
.formBorderMid {
|
||
border: #6b778c50 1px solid;
|
||
border-radius: 15px;
|
||
margin: 250px auto auto auto;
|
||
padding: 30px;
|
||
width: 500px;
|
||
}
|
||
.mainTitle {
|
||
font-size: 25px;
|
||
margin: auto auto 45px auto;
|
||
text-align: center;
|
||
}
|
||
|
||
</style> |