ehs_tanghHe
/
tanghe-report
5
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update login page

Browse Source
木子李·De 3 years ago
parent 15b8360a88
commit 081c2a9d9a
4 changed files with 117 additions and 118 deletions
Show Stats Download Patch File Download Diff File

13
report-ui/src/api/login.js
Unescape Escape View File

@ -1,9 +1,8 @@
import request from './axios' import request from './axios'
export function login (data) { export function login (data) {
console.log(data)
return request({ return request({
url: '/login', url: 'accessUser/login',
method: 'post', method: 'post',
data data
}) })
@ -11,7 +10,7 @@ export function login (data) {
export function logout () { export function logout () {
return request({ return request({
url: '/accessUser/logout', url: 'accessUser/logout',
method: 'post' method: 'post'
}) })
} }
@ -22,11 +21,3 @@ export const reqUpdatePassword = data => request({
method: 'post', method: 'post',
data: data data: data
}) })
export function queryForCodeSelect (params = {}) {
return request({
url: '/auth-service/dict/queryForCodeSelect',
method: 'post',
data: params
})
}

76
report-ui/src/mixins/access.js
Unescape Escape View File

@ -1,62 +1,44 @@
import { setItem, getItem } from '@/utils/storage'; import { setItem, getItem } from '@/utils/storage';
export default { export default {
data() { data () {
return { return {
} }
}, },
computed: { computed: {
username: function(){ operator: function () {
var username = getItem('username') var operator = getItem('loginName')
return username return operator
}, },
getUser: function(){ getUser: function () {
// var user = getItem('user'); // var user = getItem('user');
var user =JSON.parse(localStorage.getItem('user')) var user = JSON.parse(localStorage.getItem('user'))
if(user != null ){ if (user != null) {
return user; return user;
}else{ } else {
return {}; return {};
} }
}, },
isAdmin() { opAuthorities () {
if (this.getUser == null) {
return false
}
return this.getUser.userId === 1
},
opLoginName() {
return this.getUser == null ? '' : this.getUser.userName
},
opNikeName() {
return this.getUser == null ? '' : this.getUser.nikeName
},
opUserType() {
return this.getUser == null ? '' : this.getUser.userType
},
opAuthorities() {
return this.getUser == null ? [] : this.getUser.authorityWithOrgIds return this.getUser == null ? [] : this.getUser.authorityWithOrgIds
} }
}, },
created() { created () {
}, },
mounted() { mounted () {
}, },
destroyed() { destroyed () {
}, },
methods: { methods: {
hasPermission(permissionStr, orgIds) { hasPermission (permissionStr, orgIds) {
//判断用户权限列表是否为空 //判断用户权限列表是否为空
if (this.opAuthorities == null) { if (this.opAuthorities == null) {
return false return false
} }
if(this.isAdmin){ if (permissionStr && permissionStr.indexOf('|') !== -1) {
return true;
}
if(permissionStr && permissionStr.indexOf('|') !== -1) {
let flag = false let flag = false
let arr = permissionStr.split('|') let arr = permissionStr.split('|')
for(let i=0; i< arr.length; i++) { for (let i = 0; i < arr.length; i++) {
let a = arr[i].replace(/(^\s*)|(\s*$)/g, ""); let a = arr[i].replace(/(^\s*)|(\s*$)/g, "");
if (this.opAuthorities.hasOwnProperty(a)) { if (this.opAuthorities.hasOwnProperty(a)) {
flag = true flag = true
@ -69,7 +51,7 @@ export default {
return false return false
} }
//如果当前验证，不包含项目级别验证，直接返回 //如果当前验证，不包含项目级别验证，直接返回
if (typeof(orgIds) == 'undefined' || orgIds == null) { if (typeof (orgIds) == 'undefined' || orgIds == null) {
return true return true
} }
//验证登录用户是否有某个项目的有操作权限 //验证登录用户是否有某个项目的有操作权限
@ -78,10 +60,10 @@ export default {
if (typeof orgIds == 'number') { if (typeof orgIds == 'number') {
if (orgIdsHasPermission.indexOf(orgIds) > -1) { if (orgIdsHasPermission.indexOf(orgIds) > -1) {
return true return true
}else{ } else {
return false return false
} }
}else{ } else {
var result = false var result = false
for (var i in orgIdsHasPermission) { for (var i in orgIdsHasPermission) {
var flag = orgIds.indexOf(orgIdsHasPermission[i]) > -1 var flag = orgIds.indexOf(orgIdsHasPermission[i]) > -1
@ -92,27 +74,5 @@ export default {
return result return result
} }
}, },
//从所有字典中，取某个字典的列表
getDict(dictname){
var basecode = JSON.parse(localStorage.getItem('queryForCodeSelect'));
var dictList = basecode[dictname]
return dictList;
},
//从某个字典的列表，获取某个字典对象
getDictCode(dictname, codeValue , value='value'){
//如果 codeValue传过来的是字符串 all 则字典数组返回
var dictList = this.getDict(dictname);
for (var i = 0; i < dictList.length; i++) {
var codeItem = dictList[i]
if(codeItem[value] == codeValue){
return codeItem;
}
if(codeValue =='all'){
return dictList
}
}
return {};
},
} }
} }

32
report-ui/src/views/layout/components/Navbar.vue
Unescape Escape View File

@ -1,17 +1,23 @@
<template> <template>
<div> <div>
<el-menu class="navbar" mode="horizontal"> <el-menu class="navbar"
<hamburger :toggle-click="toggleSideBar" :is-active="sidebar.opened" class="hamburger-container" /> mode="horizontal">
<hamburger :toggle-click="toggleSideBar"
:is-active="sidebar.opened"
class="hamburger-container" />
<breadcrumb /> <breadcrumb />
<el-dropdown class="avatar-container" trigger="click"> <el-dropdown class="avatar-container"
trigger="click">
<div class="avatar-wrapper"> <div class="avatar-wrapper">
<i class="icon iconfont iconyonghu user" /> <i class="icon iconfont iconyonghu user" />
<span class="user-name">{{ username }}</span> <span class="user-name">{{ operator }}</span>
<i class="el-icon-caret-bottom" /> <i class="el-icon-caret-bottom" />
</div> </div>
<el-dropdown-menu slot="dropdown" class="user-dropdown"> <el-dropdown-menu slot="dropdown"
class="user-dropdown">
<el-dropdown-item divided> <el-dropdown-item divided>
<span style="display:block;" @click="logout">注销登录</span> <span style="display:block;"
@click="logout">注销登录</span>
</el-dropdown-item> </el-dropdown-item>
</el-dropdown-menu> </el-dropdown-menu>
</el-dropdown> </el-dropdown>
@ -28,7 +34,7 @@ import { aesEncrypt } from '@/utils/aes'
import { reqUpdatePassword } from '@/api/login' import { reqUpdatePassword } from '@/api/login'
export default { export default {
data() { data () {
// 确认密码 // 确认密码
var validatePass3 = (rule, value, callback) => { var validatePass3 = (rule, value, callback) => {
if (value === '') { if (value === '') {
@ -80,12 +86,12 @@ export default {
computed: { computed: {
...mapGetters(['sidebar']), ...mapGetters(['sidebar']),
}, },
created() {}, created () { },
methods: { methods: {
toggleSideBar() { toggleSideBar () {
this.$store.dispatch('ToggleSideBar') this.$store.dispatch('ToggleSideBar')
}, },
logout() { logout () {
this.$confirm('确定要退出吗', '温馨提示', { this.$confirm('确定要退出吗', '温馨提示', {
confirmButtonText: '确定', confirmButtonText: '确定',
cancelButtonText: '取消', cancelButtonText: '取消',
@ -98,14 +104,14 @@ export default {
}) })
}, },
// 修改密码 // 修改密码
updatePassword() { updatePassword () {
this.wordVisible = true this.wordVisible = true
this.$nextTick(() => { this.$nextTick(() => {
this.$refs.form && this.$refs.form.resetFields() this.$refs.form && this.$refs.form.resetFields()
}) })
}, },
// 发送请求 确认修改 // 发送请求 确认修改
confrimUpdate() { confrimUpdate () {
this.$refs.form.validate((valid) => { this.$refs.form.validate((valid) => {
if (valid) { if (valid) {
const { oldPassword, password, confirmPassword } = this.form const { oldPassword, password, confirmPassword } = this.form
@ -129,7 +135,7 @@ export default {
} }
}) })
}, },
helpCenter() { helpCenter () {
let helpCategory = JSON.parse(localStorage.getItem('helpCategory')) let helpCategory = JSON.parse(localStorage.getItem('helpCategory'))
this.$router.push({ this.$router.push({
path: '/helpCenList/list', path: '/helpCenList/list',

106
report-ui/src/views/login.vue
Unescape Escape View File

@ -8,11 +8,20 @@
<div class="login_container"> <div class="login_container">
<!-- 顶部logo --> <!-- 顶部logo -->
<div class="login_title"> <div class="login_title">
<img src="@/assets/images/home-logo.png" alt="logo" /> <img src="@/assets/images/home-logo.png"
alt="logo" />
</div> </div>
<div class="login_contant"> <div class="login_contant">
<img src="@/assets/images/login.png" alt="image" class="login_img" /> <img src="@/assets/images/login.png"
<el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login_form" autocomplete="on" label-position="left" @keyup.enter.native="handleLogin"> alt="image"
class="login_img" />
<el-form ref="loginForm"
:model="loginForm"
:rules="loginRules"
class="login_form"
autocomplete="on"
label-position="left"
@keyup.enter.native="handleLogin">
<div class="title_container"> <div class="title_container">
<h3 class="title"> <h3 class="title">
HELLO, HELLO,
@ -27,17 +36,42 @@
<b /> <b />
<div> <div>
<p>用户名</p> <p>用户名</p>
<el-form-item prop="username"> <el-form-item prop="loginName">
<el-input ref="username" v-model="loginForm.username" placeholder="用户名" name="username" type="text" tabindex="1" autocomplete="on" @focus="setTop('0')" @change="getPsw" /> <el-input ref="loginName"
v-model="loginForm.loginName"
placeholder="用户名"
name="loginName"
type="text"
tabindex="1"
autocomplete="on"
@focus="setTop('0')"
@change="getPsw" />
</el-form-item> </el-form-item>
</div> </div>
<div> <div>
<p>密码</p> <p>密码</p>
<input name="password" type="password" autocomplete="off" class="take" /> <input name="password"
<el-tooltip v-model="capsTooltip" content="Caps lock is On" placement="right" manual> type="password"
autocomplete="off"
class="take" />
<el-tooltip v-model="capsTooltip"
content="Caps lock is On"
placement="right"
manual>
<el-form-item prop="password"> <el-form-item prop="password">
<el-input :key="passwordType" ref="password" v-model="loginForm.password" :type="passwordType" placeholder="用户密码" name="password" tabindex="2" autocomplete="on" @blur="capsTooltip = false" @focus="setTop('50')" @keyup.native="checkCapslock" /> <el-input :key="passwordType"
<span class="show_pwd" @click="showPwd"> ref="password"
v-model="loginForm.password"
:type="passwordType"
placeholder="用户密码"
name="password"
tabindex="2"
autocomplete="on"
@blur="capsTooltip = false"
@focus="setTop('50')"
@keyup.native="checkCapslock" />
<span class="show_pwd"
@click="showPwd">
<i class="el-icon-view" /> <i class="el-icon-view" />
</span> </span>
</el-form-item> </el-form-item>
@ -46,15 +80,23 @@
</div> </div>
<div class="control"> <div class="control">
<div class="remember"> <div class="remember">
<input v-model="rememberPsw" type="checkbox" /> <input v-model="rememberPsw"
type="checkbox" />
<p>记住密码</p> <p>记住密码</p>
</div> </div>
</div> </div>
<el-button :loading="loading" type="primary" class="login_btn" @click.native.prevent="handleLogin">登录</el-button> <el-button :loading="loading"
type="primary"
class="login_btn"
@click.native.prevent="handleLogin">登录</el-button>
</el-form> </el-form>
</div> </div>
<!-- 验证码 --> <!-- 验证码 -->
<Verify v-if="needCaptcha" ref="verify" :captcha-type="'blockPuzzle'" :img-size="{ width: '400px', height: '200px' }" @success="verifylogin" /> <Verify v-if="needCaptcha"
ref="verify"
:captcha-type="'blockPuzzle'"
:img-size="{ width: '400px', height: '200px' }"
@success="verifylogin" />
</div> </div>
</template> </template>
@ -70,17 +112,17 @@ export default {
components: { components: {
Verify, Verify,
}, },
data() { data () {
return { return {
activeTop: '-50%', // 色条滑块控制 activeTop: '-50%', // 色条滑块控制
rememberPsw: false, // 记住密码选择框 rememberPsw: false, // 记住密码选择框
loginForm: { loginForm: {
username: 'admin', loginName: 'admin',
password: '123456', password: '123456',
verifyCode: '', verifyCode: '',
}, // 登录表单 }, // 登录表单
loginRules: { loginRules: {
username: [{ required: true, message: '用户名必填', trigger: 'blur' }], loginName: [{ required: true, message: '用户名必填', trigger: 'blur' }],
password: [ password: [
{ required: true, message: '用户密码必填', trigger: 'blur' }, { required: true, message: '用户密码必填', trigger: 'blur' },
], ],
@ -106,31 +148,31 @@ export default {
immediate: true, immediate: true,
}, },
}, },
mounted() { mounted () {
// 获取焦点 // 获取焦点
if (this.loginForm.username === '') { if (this.loginForm.loginName === '') {
this.$refs.username.focus() this.$refs.loginName.focus()
} else if (this.loginForm.password === '') { } else if (this.loginForm.password === '') {
this.$refs.password.focus() this.$refs.password.focus()
} }
}, },
methods: { methods: {
// 获取存储的密码并解密 // 获取存储的密码并解密
getPsw() { getPsw () {
const cookVal = cookies.get(`u_${this.loginForm.username}`) const cookVal = cookies.get(`u_${this.loginForm.loginName}`)
this.loginForm.password = cookVal && Decrypt(cookVal) this.loginForm.password = cookVal && Decrypt(cookVal)
}, },
// 滑动条块的top控制 // 滑动条块的top控制
setTop(val) { setTop (val) {
this.activeTop = val this.activeTop = val
}, },
// 检测大写锁定键是否开启 // 检测大写锁定键是否开启
checkCapslock(e) { checkCapslock (e) {
const { key } = e const { key } = e
this.capsTooltip = key && key.length === 1 && key >= 'A' && key <= 'Z' this.capsTooltip = key && key.length === 1 && key >= 'A' && key <= 'Z'
}, },
// 查看密码 // 查看密码
showPwd() { showPwd () {
if (this.passwordType === 'password') { if (this.passwordType === 'password') {
this.passwordType = '' this.passwordType = ''
} else { } else {
@ -141,7 +183,7 @@ export default {
}) })
}, },
// 滑动验证码 // 滑动验证码
useVerify() { useVerify () {
this.$refs.loginForm.validate((valid) => { this.$refs.loginForm.validate((valid) => {
if (valid) { if (valid) {
this.$refs.verify.show() this.$refs.verify.show()
@ -151,14 +193,14 @@ export default {
}) })
}, },
// 验证成功的回调 // 验证成功的回调
verifylogin(params) { verifylogin (params) {
this.loginForm.verifyCode = params.captchaVerification this.loginForm.verifyCode = params.captchaVerification
if (this.loginForm.verifyCode) { if (this.loginForm.verifyCode) {
this.loginApi() this.loginApi()
} }
}, },
// 登录操作 // 登录操作
handleLogin() { handleLogin () {
this.$refs.loginForm.validate((valid) => { this.$refs.loginForm.validate((valid) => {
if (valid) { if (valid) {
this.loading = true this.loading = true
@ -173,9 +215,9 @@ export default {
} }
}) })
}, },
async loginApi() { async loginApi () {
let obj = { let obj = {
username: this.loginForm.username, loginName: this.loginForm.loginName,
password: transPsw(this.loginForm.password), password: transPsw(this.loginForm.password),
verifyCode: '', verifyCode: '',
} }
@ -184,11 +226,11 @@ export default {
this.loading = false this.loading = false
if (code != '200') return if (code != '200') return
setItem('token', data.token) setItem('token', data.token)
setItem('username', data.username) setItem('loginName', data.loginName)
// 选中记住密码时 把密码存到cookie里,时效15天 // 选中记住密码时 把密码存到cookie里,时效15天
this.rememberPsw && this.rememberPsw &&
cookies.set( cookies.set(
`u_${this.loginForm.username}`, `u_${this.loginForm.loginName}`,
Encrypt(this.loginForm.password), Encrypt(this.loginForm.password),
{ expires: 15 } { expires: 15 }
) )
@ -202,7 +244,7 @@ export default {
}) })
} }
}, },
getOtherQuery(query) { getOtherQuery (query) {
return Object.keys(query).reduce((acc, cur) => { return Object.keys(query).reduce((acc, cur) => {
if (cur !== 'redirect') { if (cur !== 'redirect') {
acc[cur] = query[cur] acc[cur] = query[cur]
@ -381,7 +423,7 @@ export default {
height: 14px; height: 14px;
} }
& > input:checked::before { & > input:checked::before {
content: '\2713'; content: "\2713";
background-color: #f5ab1b; background-color: #f5ab1b;
position: absolute; position: absolute;
top: 0; top: 0;

Write Preview
Loading…
Cancel
Save