You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
452 lines
14 KiB
452 lines
14 KiB
<template>
|
|
<nav class="site-navbar" :class="'site-navbar--' + navbarLayoutType">
|
|
<div class="site-navbar__header">
|
|
<!-- @click="$router.push({ name: 'home' })"-->
|
|
<h1 class="site-navbar__brand">
|
|
<el-menu
|
|
class="site-navbar__menu"
|
|
mode="horizontal">
|
|
<el-menu-item class="site-navbar__switch" index="0" @click="sidebarFold = !sidebarFold">
|
|
<icon-svg name="zhedie"></icon-svg>
|
|
</el-menu-item>
|
|
<!-- <el-menu-item class="site-navbar__switch menu-toggle-btn" index="0-1" @click="toggleMenuMode" :title="menuModeTitle">-->
|
|
<!-- <i class="el-icon-refresh"></i>-->
|
|
<!-- </el-menu-item>-->
|
|
</el-menu>
|
|
<!-- brand-gradient-text-->
|
|
<a class="site-navbar__brand-lg brand-gradient-text" href="javascript:;" v-if="store.state.common.effectsEnabled==='Y'">{{ pageLanguage.XjSysManage }}</a>
|
|
|
|
<a class="site-navbar__brand-lg " href="javascript:;" v-if="store.state.common.effectsEnabled==='N'">{{ pageLanguage.XjSysManage }}</a>
|
|
<a class="site-navbar__brand-mini" href="javascript:;">{{ pageLanguage.abbreviation }}</a>
|
|
</h1>
|
|
|
|
</div>
|
|
|
|
<div class="site-navbar__body clearfix">
|
|
|
|
<el-menu
|
|
class="site-navbar__menu site-navbar__menu--right"
|
|
mode="horizontal">
|
|
<el-menu-item class="site-navbar__avatar" index="1">
|
|
<span class="el-dropdown-link" @click="userSetting">
|
|
<icon-svg name="editTable" style="width: 25px;height: 25px;margin-top: 5px"></icon-svg>
|
|
</span>
|
|
</el-menu-item>
|
|
<!-- <el-menu-item v-if="isAuth('review:show')" class="site-navbar__avatar" index="1">-->
|
|
<!-- <span class="el-dropdown-link">-->
|
|
<!-- <router-link :to="{path:'purchaseorder-procurementReview',query:{'': ''}}">-->
|
|
<!-- 工具待审核-->
|
|
<!-- </router-link>-->
|
|
<!-- <el-badge isAuth :value="pending.pendingReview" class="item" style="margin-top: 10px"/>-->
|
|
<!-- </span>-->
|
|
<!-- </el-menu-item>-->
|
|
<el-menu-item class="site-navbar__avatar" index="2">
|
|
<span style=" color: #909399;" @click="helpFileList()">
|
|
{{ $t('main.help') }}
|
|
<!-- <icon-svg name="help" style="width: 25px;height: 25px;margin-top: 5px"></icon-svg>-->
|
|
</span>
|
|
</el-menu-item>
|
|
<el-submenu index="3">
|
|
<template slot="title">{{ pageLanguage.setting }}</template>
|
|
<el-submenu index="2-1">
|
|
<template slot="title">{{ pageLanguage.languageSetting }}</template>
|
|
<el-menu-item index="2-1-1" :key="index" :value="item.languageCode" v-for="(item,index) in languageList "
|
|
@click.native="switch_the_language(item.languageCode)">{{ item.languageName }}
|
|
</el-menu-item>
|
|
</el-submenu>
|
|
<el-submenu index="2-2">
|
|
<template slot="title">{{ pageLanguage.userSetting }}</template>
|
|
<el-menu-item index="2-2-1" @click.native="updatePasswordHandle()">{{ pageLanguage.updatePassword }}
|
|
</el-menu-item>
|
|
<el-menu-item index="2-2-2" @click.native="updateLanguageHandle()">{{ pageLanguage.updateDefaultLanguage }}
|
|
</el-menu-item>
|
|
</el-submenu>
|
|
<el-menu-item index="2-3" @click="$router.push({ name: 'theme' })">{{ pageLanguage.cssSetting }}</el-menu-item>
|
|
<!-- <el-menu-item index="2-4" @click="printList()">{{ pageLanguage.printSetting }}</el-menu-item>-->
|
|
</el-submenu>
|
|
<el-menu-item class="site-navbar__avatar" index="4">
|
|
<el-dropdown :show-timeout="0" placement="bottom">
|
|
<span class="el-dropdown-link">
|
|
<img src="~@/assets/img/avatar.png" :alt="userName">{{ userName }}
|
|
</span>
|
|
<el-dropdown-menu slot="dropdown">
|
|
<el-dropdown-item @click.native="logoutHandle()">{{ $t('main.logout') }}</el-dropdown-item>
|
|
</el-dropdown-menu>
|
|
</el-dropdown>
|
|
</el-menu-item>
|
|
</el-menu>
|
|
|
|
</div>
|
|
<!-- 弹窗, 修改密码 -->
|
|
<update-password v-if="updatePassowrdVisible" ref="updatePassowrd"></update-password>
|
|
<!-- 弹窗, 修改默认语言 -->
|
|
<update-language v-if="updateLanguageVisible" ref="updateLanguage"></update-language>
|
|
<!-- 文件列表 -->
|
|
<FileListView ref="fileListView" v-if="helpFileVisible"></FileListView>
|
|
<!-- 打印机列表 -->
|
|
<UserPrintList ref="userPrintList" v-if="printListVisible"></UserPrintList>
|
|
|
|
<!-- 动态列 -->
|
|
<column v-if="visible" ref="column" @refreshData="getTableUserColumn" v-drag></column>
|
|
</nav>
|
|
</template>
|
|
|
|
<script>
|
|
import UpdatePassword from './main-navbar-update-password'
|
|
import UpdateLanguage from './main-navbar-update-language'
|
|
import {clearLoginInfo} from '@/utils'
|
|
import FileListView from './modules/common/file-list-view'
|
|
import UserPrintList from './modules/common/user-print-list'
|
|
import column from "./modules/common/column";
|
|
import {
|
|
searchFunctionButtonList,
|
|
saveButtonList,
|
|
} from "@/api/sysLanguage.js"
|
|
|
|
import {
|
|
getReviewToolCount
|
|
|
|
} from '@/api/purchaseorder/procurementReview.js'
|
|
import store from '../store'
|
|
|
|
export default {
|
|
inject: ['refresh'],
|
|
data() {
|
|
return {
|
|
visible: false,
|
|
updatePassowrdVisible: false,
|
|
updateLanguageVisible: false,
|
|
helpFileVisible: false,
|
|
printListVisible: false,
|
|
message: this.$t('language.name'),
|
|
languageList: [],
|
|
pageLanguage: {
|
|
XjSysManage: this.$t('main.appName'),
|
|
abbreviation: this.$t('main.abbreviation'),
|
|
setting: this.$t('main.setting'),
|
|
languageSetting: this.$t('main.languageSetting'),
|
|
userSetting: this.$t('main.userSetting'),
|
|
updatePassword: this.$t('main.updatePassword'),
|
|
updateDefaultLanguage: this.$t('main.updateDefaultLanguage'),
|
|
cssSetting: this.$t('main.cssSetting'),
|
|
printSetting: this.$t('main.cssSetting'),
|
|
},
|
|
// 导出 end
|
|
pageLanguageList: [
|
|
{
|
|
functionId: "systemInformation",
|
|
languageValue: 'CCLQMS管理系统',
|
|
objectId: 'XjSysManage',
|
|
objectType: "label",
|
|
tableId: "systemInformation"
|
|
},
|
|
{
|
|
functionId: "systemInformation",
|
|
languageValue: '首页',
|
|
objectId: 'homePage',
|
|
objectType: "label",
|
|
tableId: "systemInformation"
|
|
},
|
|
{
|
|
functionId: "systemInformation",
|
|
languageValue: '旭捷',
|
|
objectId: 'abbreviation',
|
|
objectType: "label",
|
|
tableId: "systemInformation"
|
|
},
|
|
{
|
|
functionId: "systemInformation",
|
|
languageValue: '设置',
|
|
objectId: 'setting',
|
|
objectType: "label",
|
|
tableId: "systemInformation"
|
|
},
|
|
{
|
|
functionId: "systemInformation",
|
|
languageValue: '语言设置',
|
|
objectId: 'languageSetting',
|
|
objectType: "label",
|
|
tableId: "systemInformation"
|
|
},
|
|
{
|
|
functionId: "systemInformation",
|
|
languageValue: '用户设置',
|
|
objectId: 'userSetting',
|
|
objectType: "label",
|
|
tableId: "systemInformation"
|
|
},
|
|
{
|
|
functionId: "systemInformation",
|
|
languageValue: '修改密码',
|
|
objectId: 'updatePassword',
|
|
objectType: "label",
|
|
tableId: "systemInformation"
|
|
},
|
|
{
|
|
functionId: "systemInformation",
|
|
languageValue: '修改用户语言',
|
|
objectId: 'updateDefaultLanguage',
|
|
objectType: "label",
|
|
tableId: "systemInformation"
|
|
},
|
|
{
|
|
functionId: "systemInformation",
|
|
languageValue: '主题设置',
|
|
objectId: 'cssSetting',
|
|
objectType: "label",
|
|
tableId: "systemInformation"
|
|
},
|
|
{
|
|
functionId: "systemInformation",
|
|
languageValue: '打印设置',
|
|
objectId: 'printSetting',
|
|
objectType: "label",
|
|
tableId: "systemInformation"
|
|
}
|
|
],
|
|
pending: {
|
|
pendingReview: 0,
|
|
pendingSum: 0,
|
|
},
|
|
queryToolReview: {
|
|
site: this.$store.state.user.site,
|
|
userId: this.$store.state.user.name,
|
|
strUserId: this.$store.state.user.id,
|
|
},
|
|
toolReviewTimer: null,
|
|
}
|
|
},
|
|
watch: {
|
|
pending: {
|
|
deep: true,
|
|
handler: function (newV, oldV) {
|
|
this.pending.pendingSum = this.pending.pendingReview
|
|
}
|
|
},
|
|
},
|
|
components: {
|
|
UpdatePassword,
|
|
UpdateLanguage,
|
|
FileListView,
|
|
UserPrintList,
|
|
column,
|
|
},
|
|
computed: {
|
|
store () {
|
|
return store
|
|
},
|
|
navbarLayoutType: {
|
|
get() {
|
|
return this.$store.state.common.navbarLayoutType
|
|
}
|
|
},
|
|
sidebarFold: {
|
|
get() {
|
|
return this.$store.state.common.sidebarFold
|
|
},
|
|
set(val) {
|
|
this.$store.commit('common/updateSidebarFold', val)
|
|
}
|
|
},
|
|
mainTabs: {
|
|
get() {
|
|
return this.$store.state.common.mainTabs
|
|
},
|
|
set(val) {
|
|
this.$store.commit('common/updateMainTabs', val)
|
|
}
|
|
},
|
|
userName: {
|
|
get() {
|
|
return this.$store.state.user.userDisplay
|
|
}
|
|
},
|
|
useHoverMenu: {
|
|
get() {
|
|
return this.$store.state.common.useHoverMenu
|
|
},
|
|
set(val) {
|
|
this.$store.commit('common/updateUseHoverMenu', val)
|
|
}
|
|
},
|
|
menuModeIcon() {
|
|
return this.useHoverMenu ? 'zhedie' : 'zhedie'
|
|
},
|
|
menuModeTitle() {
|
|
return this.useHoverMenu ? this.$t('main.menuMode.toClassic') : this.$t('main.menuMode.toHover')
|
|
}
|
|
},
|
|
activated() {
|
|
|
|
},
|
|
mounted() {
|
|
this.toolReviewTimer = setInterval(this.getReviewToolCount, 1000 * 60);
|
|
},
|
|
beforeDestroy() {
|
|
clearInterval(this.toolReviewTimer);
|
|
},
|
|
methods: {
|
|
// 打开页面设置
|
|
userSetting() {
|
|
this.visible = true;
|
|
let queryTable = {
|
|
userId: this.$store.state.user.name,
|
|
functionId: this.$route.meta.menuId,
|
|
languageCode: this.$i18n.locale,
|
|
tableId: '',
|
|
}
|
|
this.$nextTick(() => {
|
|
this.$refs.column.init(queryTable);
|
|
})
|
|
},
|
|
getTableUserColumn() {
|
|
this.$nextTick(() => {
|
|
this.refresh()
|
|
})
|
|
},
|
|
// 获取待审核的是工具申请单数量
|
|
getReviewToolCount() {
|
|
getReviewToolCount(this.queryToolReview).then(({data}) => {
|
|
if (data.code == 0) {
|
|
this.pending.pendingReview = data.data
|
|
}
|
|
})
|
|
},
|
|
// 打印机列表
|
|
printList() {
|
|
this.printListVisible = true;
|
|
this.$nextTick(() => {
|
|
this.$refs.userPrintList.init()
|
|
})
|
|
},
|
|
// 帮助文档列表
|
|
helpFileList() {
|
|
let fileMappingDto = {
|
|
fileId: '',
|
|
fileType: '功能帮助文档',
|
|
orderRef1: this.$route.meta.menuId,
|
|
orderRef2: '',
|
|
orderRef3: '',
|
|
}
|
|
this.helpFileVisible = true;
|
|
this.$nextTick(() => {
|
|
this.$refs.fileListView.init(fileMappingDto)
|
|
})
|
|
},
|
|
// 获取多语言列表
|
|
getLanguageList() {
|
|
this.languageList = [
|
|
{ languageCode: 'cn', languageName: this.$t('main.languageName.cn') },
|
|
{ languageCode: 'en', languageName: this.$t('main.languageName.en') }
|
|
]
|
|
},
|
|
// 获取页面多语言数据
|
|
getFunctionButtonList() {
|
|
let queryButton = {
|
|
functionId: 'systemInformation',
|
|
tableId: 'systemInformation',
|
|
languageCode: this.$i18n.locale,
|
|
objectType: 'label'
|
|
}
|
|
searchFunctionButtonList(queryButton).then(({data}) => {
|
|
if (data.code === 0) {
|
|
this.pageLanguage = data.data
|
|
}
|
|
})
|
|
},
|
|
// 注3：增加语言切换函数
|
|
switch_the_language(val) {
|
|
localStorage.setItem('locale', val)
|
|
location.reload()
|
|
},
|
|
// 修改密码
|
|
updatePasswordHandle() {
|
|
this.updatePassowrdVisible = true
|
|
this.$nextTick(() => {
|
|
this.$refs.updatePassowrd.init()
|
|
})
|
|
},
|
|
// 修改用户默认语言
|
|
updateLanguageHandle() {
|
|
this.updateLanguageVisible = true
|
|
this.$nextTick(() => {
|
|
this.$refs.updateLanguage.init()
|
|
})
|
|
},
|
|
// 退出
|
|
logoutHandle() {
|
|
this.$confirm(this.$t('main.logoutDialog.message'), this.$t('main.common.tip'), {
|
|
confirmButtonText: this.$t('main.common.confirm'),
|
|
cancelButtonText: this.$t('main.common.cancel'),
|
|
type: 'warning'
|
|
}).then(() => {
|
|
this.$http({
|
|
url: this.$http.adornUrl('/sys/logout'),
|
|
method: 'post',
|
|
data: this.$http.adornData()
|
|
}).then(({data}) => {
|
|
if (data && data.code === 0) {
|
|
clearLoginInfo()
|
|
this.$router.push({name: 'login'})
|
|
}
|
|
})
|
|
}).catch(() => {
|
|
})
|
|
},
|
|
// 切换菜单模式
|
|
toggleMenuMode() {
|
|
this.useHoverMenu = !this.useHoverMenu
|
|
this.$message.success(this.useHoverMenu ? this.$t('main.menuMode.switchedHover') : this.$t('main.menuMode.switchedClassic'))
|
|
}
|
|
},
|
|
created() {
|
|
this.getLanguageList()
|
|
// this.getFunctionButtonList()
|
|
this.getReviewToolCount()
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss">
|
|
.icon-svg {
|
|
width: 2em;
|
|
}
|
|
|
|
.el-menu--collapse .el-menu .el-submenu, .el-menu--popup, .el-menu-item {
|
|
min-width: 50px !important;
|
|
}
|
|
|
|
.site-navbar__brand-lg, .site-navbar__brand-mini {
|
|
margin: 0 5px;
|
|
color: #fff;
|
|
margin-left: -45px;
|
|
}
|
|
|
|
.el-menu--horizontal > .el-menu-item {
|
|
color: #3b4249;
|
|
}
|
|
|
|
/* 菜单切换按钮悬停显示效果 */
|
|
.menu-toggle-btn {
|
|
opacity: 0;
|
|
visibility: hidden;
|
|
transition: all 0.3s ease;
|
|
transform: translateX(-10px);
|
|
}
|
|
|
|
.site-navbar__menu:hover .menu-toggle-btn,
|
|
.menu-toggle-btn:hover {
|
|
opacity: 1;
|
|
visibility: visible;
|
|
transform: translateX(0);
|
|
}
|
|
|
|
/* 为了更好的用户体验，也可以在整个导航栏悬停时显示 */
|
|
.site-navbar__brand:hover .menu-toggle-btn {
|
|
opacity: 1;
|
|
visibility: visible;
|
|
transform: translateX(0);
|
|
}
|
|
|
|
</style>
|
|
|