552 lines
16 KiB
Vue
552 lines
16 KiB
Vue
<template>
|
|
<div class="navbar">
|
|
<hamburger id="hamburger-container" :is-active="sidebar.opened" class="hamburger-container"
|
|
@toggleClick="toggleSideBar"/>
|
|
|
|
<breadcrumb id="breadcrumb-container" class="breadcrumb-container" v-if="!topNav"/>
|
|
<top-nav id="topmenu-container" class="topmenu-container" v-if="topNav"/>
|
|
<div class="right-menu">
|
|
<template v-if="device!=='mobile'">
|
|
|
|
<div class="inv-hos-title">
|
|
<span
|
|
style="margin: 10px;color: #2d8cf0;font-size: 14px;">部门 : {{ deptName }}</span>
|
|
<span
|
|
style="margin-right: 18px;margin-left:8px;color: #2d8cf0;font-size: 14px;">仓库 : {{ inv }}</span>
|
|
<span style="font-weight: 500;color:rgb(51 48 48); font-size: 14px;">用户 : {{ this.companyName }}</span>
|
|
<span
|
|
style="font-weight: 500;color:rgb(51 48 48); font-size: 14px; margin-right: 20px">({{
|
|
this.userName
|
|
}})</span>
|
|
</div>
|
|
<search id="header-search" class="right-menu-item"/>
|
|
<screenfull id="screenfull" class="right-menu-item hover-effect"/>
|
|
<el-tooltip content="布局大小" effect="dark" placement="bottom">
|
|
<size-select id="size-select" class="right-menu-item hover-effect"/>
|
|
</el-tooltip>
|
|
</template>
|
|
<el-dropdown class="avatar-container right-menu-item hover-effect" trigger="click">
|
|
<div class="avatar-wrapper">
|
|
<img :src="avatar" class="user-avatar">
|
|
<i class="el-icon-caret-bottom"/>
|
|
</div>
|
|
<el-dropdown-menu slot="dropdown">
|
|
<!-- <router-link to="/user/profile">-->
|
|
<!-- <el-dropdown-item>个人中心</el-dropdown-item>-->
|
|
<!-- </router-link>-->
|
|
<el-dropdown-item @click.native="setting = true">
|
|
<span>布局设置</span>
|
|
</el-dropdown-item>
|
|
<el-dropdown-item divided @click.native="changeInv">
|
|
<span>切换仓库</span>
|
|
</el-dropdown-item>
|
|
<el-dropdown-item divided @click.native="modifyPassword">
|
|
<span>修改密码</span>
|
|
</el-dropdown-item>
|
|
<el-dropdown-item divided @click.native="logout">
|
|
<span>退出登录</span>
|
|
</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</el-dropdown>
|
|
</div>
|
|
|
|
|
|
<el-dialog
|
|
title="请选择当前部门与仓库"
|
|
:visible.sync="selInvVisible"
|
|
:close-on-click-modal="false"
|
|
:close-on-press-escape="false"
|
|
width="35%"
|
|
v-if="selInvVisible"
|
|
>
|
|
<el-form :model="userInfo" label-width="100px" :rules="formRules" ref="dataForm">
|
|
<el-row :gutter="20">
|
|
<el-col :span="20">
|
|
<el-form-item prop="locDeptCode" label="当前部门:">
|
|
<el-select v-model="userInfo.locDeptCode" placeholder="请选择当前部门" clearable
|
|
style="width: 90%"
|
|
@change="deptChange">
|
|
<el-option
|
|
v-for="item in deptList"
|
|
:key="item.name"
|
|
:label="item.name"
|
|
:value="item.code">
|
|
<span style="float: left">{{ item.name }}</span>
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row :gutter="20">
|
|
<el-col :span="20">
|
|
<el-form-item prop="locInvCode" label="当前仓库:">
|
|
<el-select v-model="userInfo.locInvCode" placeholder="请选择当前仓库" clearable
|
|
style="width: 90%"
|
|
>
|
|
<el-option
|
|
v-for="item in invList"
|
|
:key="item.name"
|
|
:label="item.name"
|
|
:value="item.code">
|
|
<span style="float: left">{{ item.name }}</span>
|
|
</el-option>
|
|
</el-select>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<div style="margin-top: 8px ; color: #F71616; font-size: 12px">
|
|
<span>提示：进入系统请先选择您当前所在部门与仓库 </span>
|
|
</div>
|
|
<div style='text-align: center; margin-bottom: 10px;margin-top: 18px ;'>
|
|
<el-button type="primary" @click="submitInv">提交</el-button>
|
|
<el-button type="primary" @click="closeDialog">取消</el-button>
|
|
</div>
|
|
</el-form>
|
|
</el-dialog>
|
|
|
|
|
|
<el-dialog
|
|
title="修改密码"
|
|
:visible.sync="isVisible"
|
|
:close-on-click-modal="false"
|
|
:close-on-press-escape="false"
|
|
width="35%"
|
|
v-if="isVisible"
|
|
>
|
|
<el-form :model="inputQuery" label-width="100px" :rules="formRules" ref="dataForm">
|
|
<el-row :gutter="20">
|
|
<el-col :span="20">
|
|
<el-form-item prop="userName" label="用户账号:">
|
|
<el-input
|
|
size="small"
|
|
placeholder="请输入登录用户账号"
|
|
v-model="inputQuery.userName"
|
|
@input="change()"
|
|
:disabled="true"
|
|
></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row :gutter="20">
|
|
<el-col :span="20">
|
|
<el-form-item prop="passWord" label="当前密码:">
|
|
<el-input
|
|
size="small"
|
|
placeholder="请输入当前密码"
|
|
type="password"
|
|
v-model="inputQuery.passWord"
|
|
@input="change()"
|
|
></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
<el-row :gutter="20">
|
|
<el-col :span="20">
|
|
<el-form-item prop="newPassword" label="新密码:">
|
|
<el-input
|
|
size="small"
|
|
placeholder="请输入新密码"
|
|
type="password"
|
|
v-model="inputQuery.newPassword"
|
|
@input="change()"
|
|
></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
<el-row :gutter="20">
|
|
<el-col :span="20">
|
|
<el-form-item prop="confirmPassword" label="确认密码:">
|
|
<el-input
|
|
size="small"
|
|
placeholder="请输入确认密码"
|
|
type="password"
|
|
v-model="inputQuery.confirmPassword"
|
|
@input="change()"
|
|
></el-input>
|
|
</el-form-item>
|
|
</el-col>
|
|
</el-row>
|
|
|
|
|
|
<div style='text-align: center; margin-bottom: 10px;margin-top: 18px ;'>
|
|
<el-button type="primary" @click="onSubmit">修改密码</el-button>
|
|
<el-button @click="closeDialog">取消</el-button>
|
|
</div>
|
|
</el-form>
|
|
</el-dialog>
|
|
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
import {mapGetters} from 'vuex'
|
|
import Breadcrumb from '@/components/Breadcrumb'
|
|
import TopNav from '@/components/TopNav'
|
|
import Hamburger from '@/components/Hamburger'
|
|
import Screenfull from '@/components/Screenfull'
|
|
import SizeSelect from '@/components/SizeSelect'
|
|
import Search from '@/components/HeaderSearch'
|
|
import RuoYiGit from '@/components/RuoYi/Git'
|
|
import RuoYiDoc from '@/components/RuoYi/Doc'
|
|
import store from "@/store";
|
|
import {filterAllByUser} from "@/api/system/invWarehouse";
|
|
import {filterSubByInv, findByDeptUser} from "@/api/system/invSubWarehouse";
|
|
import {updateInv, modifyPasswd,filterByUser} from "@/api/auth/authAdmin";
|
|
import {isRelogin} from "@/utils/request";
|
|
import router from "@/router";
|
|
|
|
export default {
|
|
data() {
|
|
// let validatePass2 = (rule, value, callback) => {
|
|
// if (value === "") {
|
|
// callback(new Error("请再次输入密码"));
|
|
// } else if (value !== this.inputQuery.password) {
|
|
// callback(new Error("两次输入密码不一致!"));
|
|
// } else {
|
|
// callback();
|
|
// }
|
|
// };
|
|
return {
|
|
inv: store.getters.locInvName,
|
|
deptName: store.getters.locDeptName,
|
|
selInvVisible: false,
|
|
isVisible: false,
|
|
userInfo: {},
|
|
inputQuery: {
|
|
passWord: "",
|
|
newPassword: "",
|
|
confirmPassword: "",
|
|
userName: "",
|
|
locInvCode: "",
|
|
|
|
},
|
|
deptList: [],
|
|
invList: [],
|
|
formRules: {
|
|
locDeptCode: [
|
|
{required: true, message: "请选择当前部门", trigger: "blur"}
|
|
],
|
|
locInvCode: [
|
|
{required: true, message: "请选择当前仓库", trigger: "blur"}
|
|
],
|
|
password: [{required: true, message: "请输入密码", trigger: "blur"}],
|
|
newPassword: [{required: true, message: "请输入密码", trigger: "blur"}],
|
|
confirmPassword: [
|
|
{required: true, message: "请确认密码", trigger: "blur"},
|
|
// {validator: validatePass2, trigger: "blur"},
|
|
],
|
|
},
|
|
rules: {
|
|
password: [{required: true, message: "请输入密码", trigger: "blur"}],
|
|
confirmPassword: [
|
|
{required: true, message: "请确认密码", trigger: "blur"},
|
|
// {validator: validatePass2, trigger: "blur"},
|
|
],
|
|
|
|
},
|
|
};
|
|
},
|
|
components: {
|
|
Breadcrumb,
|
|
TopNav,
|
|
Hamburger,
|
|
Screenfull,
|
|
SizeSelect,
|
|
Search,
|
|
RuoYiGit,
|
|
RuoYiDoc
|
|
},
|
|
computed: {
|
|
...mapGetters([
|
|
'sidebar',
|
|
'avatar',
|
|
'device'
|
|
]),
|
|
setting: {
|
|
get() {
|
|
return this.$store.state.settings.showSettings
|
|
},
|
|
set(val) {
|
|
this.$store.dispatch('settings/changeSetting', {
|
|
key: 'showSettings',
|
|
value: val
|
|
})
|
|
}
|
|
},
|
|
topNav: {
|
|
get() {
|
|
return this.$store.state.settings.topNav
|
|
}
|
|
}
|
|
},
|
|
methods: {
|
|
onSubmit() {
|
|
if (this.inputQuery.newPassword != this.inputQuery.confirmPassword) {
|
|
this.$message.error("新密码与确认密码不一致！！！！");
|
|
return
|
|
}
|
|
if (this.inputQuery.passWord == this.inputQuery.newPassword) {
|
|
this.$message.error("旧密码与新密码不能相同！！！！");
|
|
return
|
|
}
|
|
this.$refs["dataForm"].validate((valid) => {
|
|
if (valid) {
|
|
this.loading = true;
|
|
modifyPasswd(this.inputQuery).then((response) => {
|
|
if (response.code === 20000) {
|
|
this.loading = false;
|
|
this.$confirm('密码重置成功，请点击确定重新登录', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
}).then(() => {
|
|
this.$store.dispatch('LogOut').then(() => {
|
|
location.href = process.env.VUE_APP_CONTEXT_PATH;
|
|
})
|
|
}).catch(() => {
|
|
});
|
|
} else {
|
|
this.$message.error(response.message);
|
|
}
|
|
});
|
|
} else {
|
|
return false;
|
|
}
|
|
});
|
|
},
|
|
|
|
toggleSideBar() {
|
|
this.$store.dispatch('app/toggleSideBar')
|
|
},
|
|
async logout() {
|
|
this.$confirm('确定注销并退出系统吗？', '提示', {
|
|
confirmButtonText: '确定',
|
|
cancelButtonText: '取消',
|
|
type: 'warning'
|
|
}).then(() => {
|
|
this.$store.dispatch('LogOut').then(() => {
|
|
location.href = process.env.VUE_APP_CONTEXT_PATH;
|
|
})
|
|
}).catch(() => {
|
|
});
|
|
},
|
|
|
|
changeInv() {
|
|
this.selInvVisible = true;
|
|
},
|
|
modifyPassword() {
|
|
this.isVisible = true;
|
|
},
|
|
|
|
getDeptList() {
|
|
this.deptList = [];
|
|
filterAllByUser()
|
|
.then((response) => {
|
|
this.deptList = response.data || [];
|
|
this.getInvList();
|
|
})
|
|
.catch(() => {
|
|
});
|
|
},
|
|
// getInputQuery() {
|
|
// this.inputQuery = [];
|
|
// filterByUser()
|
|
// .then((response) => {
|
|
// this.inputQuery = response.data || [];
|
|
// // this.getInvList();
|
|
// })
|
|
// .catch(() => {
|
|
// });
|
|
// },
|
|
|
|
deptChange() {
|
|
this.getInvList();
|
|
this.userInfo.locInvCode = "";
|
|
},
|
|
|
|
getInvList() {
|
|
this.invList = [];
|
|
let query = {
|
|
deptCode: this.userInfo.locDeptCode
|
|
};
|
|
findByDeptUser(query)
|
|
.then((response) => {
|
|
this.invList = response.data || [];
|
|
if (this.invList != null && this.invList.length == 1) {
|
|
this.userInfo.locInvCode = this.invList[0].code;
|
|
}
|
|
})
|
|
.catch(() => {
|
|
this.selInvVisible = true;
|
|
});
|
|
},
|
|
|
|
submitInv() {
|
|
this.$refs["dataForm"].validate(valid => {
|
|
if (valid) {
|
|
if (this.$isBlank(this.userInfo.locInvCode)) {
|
|
this.$message.error("当前仓库不能为空！");
|
|
return;
|
|
}
|
|
if (this.userInfo.customerId == 110) {
|
|
if (this.$isBlank(this.userInfo.locSubInvCode)) {
|
|
this.$message.error("当前分库不能为空！");
|
|
return;
|
|
}
|
|
}
|
|
updateInv(this.userInfo).then((res) => {
|
|
if (res.code == 20000) {
|
|
this.$message.success("设置成功!");
|
|
this.selInvVisible = false;
|
|
store.dispatch('GetInfo').then(() => {
|
|
this.inv = store.getters.locInvName
|
|
});
|
|
} else {
|
|
this.$message.error(res.message);
|
|
}
|
|
}).catch(() => {
|
|
this.selInvVisible = false;
|
|
});
|
|
}
|
|
});
|
|
},
|
|
|
|
closeDialog() {
|
|
this.selInvVisible = false;
|
|
this.isVisible = false;
|
|
|
|
this.getDeptList()
|
|
this.resetForm();
|
|
},
|
|
// 刷新表单
|
|
resetForm() {
|
|
if (this.$refs["dataForm"]) {
|
|
// 清空验证信息表单
|
|
this.$refs["dataForm"].clearValidate();
|
|
// 刷新表单
|
|
this.$refs["dataForm"].resetFields();
|
|
this.getList();
|
|
}
|
|
},
|
|
|
|
},
|
|
created() {
|
|
this.userName = this.$store.getters.name;
|
|
this.companyName = this.$store.getters.companyName;
|
|
this.userInfo = {
|
|
id: store.getters.adminId,
|
|
locInvCode: store.getters.locInvCode,
|
|
locDeptCode: store.getters.locDeptCode,
|
|
};
|
|
this.inputQuery = {
|
|
userName: this.userName,
|
|
id: this.userInfo.id,
|
|
|
|
};
|
|
// this.getInputQuery();
|
|
this.getDeptList();
|
|
//this.getInvList()
|
|
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.navbar {
|
|
height: 50px;
|
|
overflow: hidden;
|
|
position: relative;
|
|
background: #fff;
|
|
box-shadow: 0 1px 4px rgba(0, 21, 41, .08);
|
|
|
|
.hamburger-container {
|
|
line-height: 46px;
|
|
height: 100%;
|
|
float: left;
|
|
cursor: pointer;
|
|
transition: background .3s;
|
|
-webkit-tap-highlight-color: transparent;
|
|
|
|
&:hover {
|
|
background: rgba(0, 0, 0, .025)
|
|
}
|
|
}
|
|
|
|
.breadcrumb-container {
|
|
float: left;
|
|
}
|
|
|
|
.topmenu-container {
|
|
position: absolute;
|
|
left: 50px;
|
|
}
|
|
|
|
.errLog-container {
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
}
|
|
|
|
.right-menu {
|
|
float: right;
|
|
height: 100%;
|
|
line-height: 50px;
|
|
|
|
&:focus {
|
|
outline: none;
|
|
}
|
|
|
|
.right-menu-item {
|
|
display: inline-block;
|
|
padding: 0 8px;
|
|
height: 100%;
|
|
font-size: 18px;
|
|
color: #5a5e66;
|
|
vertical-align: text-bottom;
|
|
|
|
&.hover-effect {
|
|
cursor: pointer;
|
|
transition: background .3s;
|
|
|
|
&:hover {
|
|
background: rgba(0, 0, 0, .025)
|
|
}
|
|
}
|
|
}
|
|
|
|
.inv-hos-title {
|
|
display: inline-block;
|
|
height: 100%;
|
|
font-size: 18px;
|
|
color: #5a5e66;
|
|
vertical-align: text-bottom;
|
|
}
|
|
|
|
.avatar-container {
|
|
margin-right: 30px;
|
|
|
|
.avatar-wrapper {
|
|
margin-top: 5px;
|
|
position: relative;
|
|
|
|
.user-avatar {
|
|
cursor: pointer;
|
|
width: 20px;
|
|
height: 20px;
|
|
border-radius: 3px;
|
|
}
|
|
|
|
.el-icon-caret-bottom {
|
|
cursor: pointer;
|
|
position: absolute;
|
|
right: -20px;
|
|
top: 25px;
|
|
font-size: 12px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|