| | |
| | | <template>
|
| | | <div class="navbar">
|
| | | <hamburger id="hamburger-container" :is-active="appStore.sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
|
| | | <breadcrumb v-if="!settingsStore.topNav" id="breadcrumb-container" class="breadcrumb-container" />
|
| | | <top-nav v-if="settingsStore.topNav" id="topmenu-container" class="topmenu-container" />
|
| | | <div>
|
| | | <hamburger id="hamburger-container" :is-active="appStore.sidebar.opened" class="hamburger-container" @toggleClick="toggleSideBar" />
|
| | | <breadcrumb v-if="!settingsStore.topNav" id="breadcrumb-container" class="breadcrumb-container" />
|
| | | </div>
|
| | | <!-- <top-nav v-if="settingsStore.topNav" id="topmenu-container" class="topmenu-container" />-->
|
| | | <div class="center-menu">
|
| | | <span class="label">{{userStore.currentFactoryName}}</span>
|
| | | <el-dropdown @command="handleFactoryChange" class="right-menu-item hover-effect" trigger="click">
|
| | | <div class="avatar-wrapper">
|
| | | <el-icon><Switch /></el-icon>
|
| | | </div>
|
| | | <template #dropdown>
|
| | | <el-dropdown-menu >
|
| | | <el-dropdown-item
|
| | | v-for="item in factoryList"
|
| | | :key="item.deptId"
|
| | | :command="item"
|
| | | >
|
| | | {{ item.deptName }}
|
| | | </el-dropdown-item>
|
| | | </el-dropdown-menu>
|
| | | </template>
|
| | | </el-dropdown>
|
| | |
|
| | | </div>
|
| | | <div class="right-menu">
|
| | | <template v-if="appStore.device !== 'mobile'">
|
| | | <header-search id="header-search" class="right-menu-item" />
|
| | |
|
| | | <el-tooltip content="源码地址" effect="dark" placement="bottom">
|
| | | <ruo-yi-git id="ruoyi-git" class="right-menu-item hover-effect" />
|
| | | </el-tooltip>
|
| | |
|
| | | <el-tooltip content="文档地址" effect="dark" placement="bottom">
|
| | | <ruo-yi-doc id="ruoyi-doc" class="right-menu-item hover-effect" />
|
| | | </el-tooltip>
|
| | |
|
| | | <screenfull id="screenfull" class="right-menu-item hover-effect" />
|
| | |
|
| | | <el-tooltip content="主题模式" effect="dark" placement="bottom">
|
| | | <div class="right-menu-item hover-effect theme-switch-wrapper" @click="toggleTheme">
|
| | | <svg-icon v-if="settingsStore.isDark" icon-class="sunny" />
|
| | | <svg-icon v-if="!settingsStore.isDark" icon-class="moon" />
|
| | | </div>
|
| | | </el-tooltip>
|
| | |
|
| | | <el-tooltip content="布局大小" effect="dark" placement="bottom">
|
| | | <size-select id="size-select" class="right-menu-item hover-effect" />
|
| | | </el-tooltip>
|
| | | </template>
|
| | | <div class="avatar-container">
|
| | | <el-dropdown @command="handleCommand" class="right-menu-item hover-effect" trigger="click">
|
| | | <div class="avatar-wrapper">
|
| | |
| | | import useAppStore from '@/store/modules/app'
|
| | | import useUserStore from '@/store/modules/user'
|
| | | import useSettingsStore from '@/store/modules/settings'
|
| | | import { userLoginFacotryList } from "@/api/system/user.js"
|
| | | import Cookies from "js-cookie";
|
| | | import { decrypt } from "@/utils/jsencrypt"
|
| | |
|
| | | const appStore = useAppStore()
|
| | | const userStore = useUserStore()
|
| | | const settingsStore = useSettingsStore()
|
| | |
|
| | | const factoryList = ref([])
|
| | | function toggleSideBar() {
|
| | | appStore.toggleSideBar()
|
| | | }
|
| | |
| | | function toggleTheme() {
|
| | | settingsStore.toggleTheme()
|
| | | }
|
| | |
|
| | | function getUserLoginFacotryList() {
|
| | | if(userStore.id){
|
| | | userLoginFacotryList({userId:userStore.id}).then(res => {
|
| | | console.log('res', res)
|
| | | factoryList.value = res.data
|
| | | })
|
| | | }else {
|
| | | factoryList.value = []
|
| | | }
|
| | | }
|
| | |
|
| | | function handleFactoryChange(command) {
|
| | | console.log('command', command)
|
| | | handleLogin(command.deptId);
|
| | | }
|
| | |
|
| | | function handleLogin(currentFatoryId){
|
| | | const loginForm = {
|
| | | username: Cookies.get("username"),
|
| | | password: Cookies.get("password") === undefined ? null : decrypt(Cookies.get("password")),
|
| | | currentFatoryId: currentFatoryId
|
| | | }
|
| | | userStore.loginCheckFactory(loginForm).then(res => {
|
| | | const query = route.query
|
| | | const otherQueryParams = Object.keys(query).reduce((acc, cur) => {
|
| | | if (cur !== "redirect") {
|
| | | acc[cur] = query[cur]
|
| | | }
|
| | | return acc
|
| | | }, {})
|
| | | router.push({ path: redirect.value || "/", query: otherQueryParams })
|
| | | }).catch(() => {
|
| | | })
|
| | | }
|
| | |
|
| | | getUserLoginFacotryList();
|
| | | </script>
|
| | |
|
| | | <style lang='scss' scoped>
|
| | |
| | | position: relative;
|
| | | background: var(--navbar-bg);
|
| | | box-shadow: 0 1px 4px rgba(0, 21, 41, 0.08);
|
| | | .center-menu {
|
| | | line-height: 50px;
|
| | | position: absolute;
|
| | | left: 50%;
|
| | | transform: translateX(-50%);
|
| | | .label {
|
| | | font-weight: bold;
|
| | | font-size: 18px;
|
| | | color: #333333;
|
| | | }
|
| | | }
|
| | |
|
| | | .hamburger-container {
|
| | | line-height: 46px;
|
| | |
| | |
|
| | | svg {
|
| | | transition: transform 0.3s;
|
| | | |
| | |
|
| | | &:hover {
|
| | | transform: scale(1.15);
|
| | | }
|
| | |
| | | cursor: pointer;
|
| | | width: 40px;
|
| | | height: 40px;
|
| | | border-radius: 10px;
|
| | | border-radius: 50px;
|
| | | }
|
| | |
|
| | | i {
|
| | | cursor: pointer;
|
| | | position: absolute;
|
| | | right: -20px;
|
| | | top: 25px;
|
| | | top: 14px;
|
| | | font-size: 12px;
|
| | | }
|
| | | }
|