|
|
@@ -1,368 +1,365 @@
|
|
|
<template>
|
|
|
- <div
|
|
|
- :style="styleLayoutMainGroup"
|
|
|
- :class="{grayMode: grayActive}"
|
|
|
- class="ibps-layout-header-aside-group hidden-print"
|
|
|
- >
|
|
|
-
|
|
|
- <!-- <iframe
|
|
|
- style="display: none;"
|
|
|
- id="iframeContain"
|
|
|
- name="iframeContain"
|
|
|
- seamless
|
|
|
- scrolling="yes"
|
|
|
- src="https://www.szjyxt.com/#/fileView?url=https%3A%2F%2Fwww.szjyxt.com%2Fibps%2Fplatform%2Fv3%2Ffile%2Fdownload%3FattachmentId%3D925044155762081792&isEdit=true&fileType=docx&title=GDYR-CX01-A0%20%E4%BF%9D%E8%AF%81%E5%85%AC%E6%AD%A3%E6%80%A7%E7%AE%A1%E7%90%86%E7%A8%8B%E5%BA%8F&user=%5Bobject%20Object%5D&mode=view&editUrl=https%3A%2F%2Fwww.szjyxt.com%2Fibps%2Fplatform%2Fv3%2Ffile%2FeditCallback%3FfileName%3DGDYR-CX01-A0%20%E4%BF%9D%E8%AF%81%E5%85%AC%E6%AD%A3%E6%80%A7%E7%AE%A1%E7%90%86%E7%A8%8B%E5%BA%8F%26fileType%3Ddocx&key="
|
|
|
- >
|
|
|
- </iframe> -->
|
|
|
+ <div
|
|
|
+ :style="styleLayoutMainGroup"
|
|
|
+ :class="{ grayMode: grayActive }"
|
|
|
+ class="ibps-layout-header-aside-group hidden-print"
|
|
|
+ >
|
|
|
+ <!-- <iframe
|
|
|
+ style="display: none;"
|
|
|
+ id="iframeContain"
|
|
|
+ name="iframeContain"
|
|
|
+ seamless
|
|
|
+ scrolling="yes"
|
|
|
+ src="https://www.szjyxt.com/#/fileView?url=https%3A%2F%2Fwww.szjyxt.com%2Fibps%2Fplatform%2Fv3%2Ffile%2Fdownload%3FattachmentId%3D925044155762081792&isEdit=true&fileType=docx&title=GDYR-CX01-A0%20%E4%BF%9D%E8%AF%81%E5%85%AC%E6%AD%A3%E6%80%A7%E7%AE%A1%E7%90%86%E7%A8%8B%E5%BA%8F&user=%5Bobject%20Object%5D&mode=view&editUrl=https%3A%2F%2Fwww.szjyxt.com%2Fibps%2Fplatform%2Fv3%2Ffile%2FeditCallback%3FfileName%3DGDYR-CX01-A0%20%E4%BF%9D%E8%AF%81%E5%85%AC%E6%AD%A3%E6%80%A7%E7%AE%A1%E7%90%86%E7%A8%8B%E5%BA%8F%26fileType%3Ddocx&key="
|
|
|
+ >
|
|
|
+ </iframe> -->
|
|
|
|
|
|
- <!-- 半透明遮罩 -->
|
|
|
- <div class="ibps-layout-header-aside-mask" />
|
|
|
- <!-- websocket -->
|
|
|
- <!-- <ibps-notify-monitor /> -->
|
|
|
- <!-- 主体内容 -->
|
|
|
- <div class="ibps-layout-header-aside-content" flex="dir:top">
|
|
|
+ <!-- 半透明遮罩 -->
|
|
|
+ <div class="ibps-layout-header-aside-mask" />
|
|
|
+ <!-- websocket -->
|
|
|
+ <!-- <ibps-notify-monitor /> -->
|
|
|
+ <!-- 主体内容 -->
|
|
|
+ <div class="ibps-layout-header-aside-content" flex="dir:top">
|
|
|
+ <panle />
|
|
|
+ <!-- 顶栏 -->
|
|
|
+ <div
|
|
|
+ :style="{opacity: searchActive ? 0.5 : 1}"
|
|
|
+ class="ibps-theme-header"
|
|
|
+ style="box-shadow: 1px 4px 6px rgba(0, 0, 0, 0.12), 0 0 5px rgba(155, 155, 0, 0.04);margin-bottom: 5px;"
|
|
|
+ flex-box="0"
|
|
|
+ flex
|
|
|
+ >
|
|
|
+ <!-- <div
|
|
|
+ :class="{'logo-group': true, 'logo-transition': asideTransition, 'ibps-pt-5': system.logoType === 'image', 'ibps-pl-0': system.logoType === 'image'}"
|
|
|
+ :style="{width: asideCollapse ? asideWidthCollapse : asideWidth}"
|
|
|
+ flex-box="0"
|
|
|
+ >
|
|
|
+ <el-dropdown
|
|
|
+ v-if="subsystemList && subsystemList.length > 1"
|
|
|
+ trigger="click"
|
|
|
+ placement="bottom-start"
|
|
|
+ @command="command => handleSubsystemClick(command)"
|
|
|
+ >
|
|
|
+ <ibps-logo
|
|
|
+ :system="system"
|
|
|
+ :aside-collapse="asideCollapse"
|
|
|
+ :subsystem-list="subsystemList"
|
|
|
+ :logo-icon-all="logoIconAll"
|
|
|
+ :logo-icon-only="logoIconOnly"
|
|
|
+ />
|
|
|
+ <el-dropdown-menu slot="dropdown" style="width: 180px;">
|
|
|
+ <el-dropdown-item
|
|
|
+ v-for="(item, index) in subsystemList"
|
|
|
+ :key="index"
|
|
|
+ :disabled="item.id === system.id"
|
|
|
+ :command="item"
|
|
|
+ >
|
|
|
+ <ibps-icon :name="item.logo || 'logo'" :title="item.name"/>{{ item.name }}
|
|
|
+ </el-dropdown-item>
|
|
|
+ </el-dropdown-menu>
|
|
|
+ </el-dropdown>
|
|
|
|
|
|
- <panle/>
|
|
|
- <!-- 顶栏 -->
|
|
|
- <div
|
|
|
- :style="{
|
|
|
- opacity: searchActive ? 0.5 : 1
|
|
|
- }"
|
|
|
- class="ibps-theme-header"
|
|
|
- style=" box-shadow: 1px 4px 6px rgba(0, 0, 0, .12), 0 0 5px rgba(155,155, 0, .04);margin-bottom: 5px;"
|
|
|
- flex-box="0"
|
|
|
- flex
|
|
|
- >
|
|
|
- <!-- <div
|
|
|
- :class="{'logo-group': true,
|
|
|
- 'logo-transition': asideTransition,
|
|
|
- 'ibps-pt-5':system.logoType ==='image',
|
|
|
- 'ibps-pl-0':system.logoType ==='image'
|
|
|
- }"
|
|
|
- :style="{width: asideCollapse ? asideWidthCollapse : asideWidth}"
|
|
|
- flex-box="0"
|
|
|
- >
|
|
|
- <el-dropdown
|
|
|
- v-if="subsystemList && subsystemList.length >1"
|
|
|
- trigger="click"
|
|
|
- placement="bottom-start"
|
|
|
- @command="command => handleSubsystemClick(command)"
|
|
|
- >
|
|
|
- <ibps-logo
|
|
|
- :system="system"
|
|
|
- :aside-collapse="asideCollapse"
|
|
|
- :subsystem-list="subsystemList"
|
|
|
- :logo-icon-all="logoIconAll"
|
|
|
- :logo-icon-only="logoIconOnly"
|
|
|
- />
|
|
|
- <el-dropdown-menu slot="dropdown" style="width:180px;">
|
|
|
- <el-dropdown-item
|
|
|
- v-for="(item,index) in subsystemList"
|
|
|
- :key="index"
|
|
|
- :disabled="item.id===system.id"
|
|
|
- :command="item"
|
|
|
- >
|
|
|
- <ibps-icon :name="item.logo||'logo'" :title="item.name" /> {{ item.name }}
|
|
|
- </el-dropdown-item>
|
|
|
- </el-dropdown-menu>
|
|
|
- </el-dropdown>
|
|
|
+ <ibps-logo
|
|
|
+ v-else
|
|
|
+ :system="system"
|
|
|
+ :aside-collapse="asideCollapse"
|
|
|
+ :subsystem-list="subsystemList"
|
|
|
+ :logo-icon-all="logoIconAll"
|
|
|
+ :logo-icon-only="logoIconOnly"
|
|
|
+ />
|
|
|
+ </div>
|
|
|
+ <div
|
|
|
+ class="toggle-aside-btn"
|
|
|
+ flex-box="0"
|
|
|
+ @click="handleToggleAside"
|
|
|
+ >
|
|
|
+ <ibps-icon :name="asideCollapse ? 'indent' : 'outdent'" />
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <ibps-menu-header flex-box="1" @pageChange="pageChange" />
|
|
|
|
|
|
- <ibps-logo
|
|
|
- v-else
|
|
|
- :system="system"
|
|
|
- :aside-collapse="asideCollapse"
|
|
|
- :subsystem-list="subsystemList"
|
|
|
- :logo-icon-all="logoIconAll"
|
|
|
- :logo-icon-only="logoIconOnly"
|
|
|
- />
|
|
|
- </div> -->
|
|
|
- <!-- <div class="toggle-aside-btn" flex-box="0" @click="handleToggleAside">
|
|
|
- <ibps-icon :name="asideCollapse ?'indent':'outdent'" />
|
|
|
- </div> -->
|
|
|
- <ibps-menu-header
|
|
|
- flex-box="1"
|
|
|
- @pageChange ="pageChange"
|
|
|
- />
|
|
|
- <!-- 顶栏右侧 -->
|
|
|
- <div class="ibps-header-right" flex-box="0">
|
|
|
- <!-- 如果你只想在开发环境显示这个按钮请添加 v-if="$nodeEnv === 'development'" -->
|
|
|
- <!-- <ibps-header-search @click="handleSearchClick" /> --> <!-- 全局搜索放大镜 -->
|
|
|
- <!-- <ibps-header-error-log v-if="$nodeEnv === 'development'" />
|
|
|
- <ibps-header-base-url v-if="$nodeEnv === 'development'" /> --><!-- 日志与异常 -->
|
|
|
+ <!-- 顶栏右侧 -->
|
|
|
+ <div class="ibps-header-right" flex-box="0">
|
|
|
+ <!-- 如果你只想在开发环境显示这个按钮请添加 v-if="$nodeEnv === 'development'" -->
|
|
|
+ <!-- 全局搜索放大镜、日志、环境切换、全屏 -->
|
|
|
+ <!-- <ibps-header-search @click="handleSearchClick" />
|
|
|
+ <ibps-header-error-log v-if="$nodeEnv === 'development'" />
|
|
|
+ <ibps-header-base-url v-if="$nodeEnv === 'development'" />
|
|
|
|
|
|
- <!-- <ibps-header-download /> -->
|
|
|
- <!-- <ibps-header-locking />
|
|
|
- <ibps-header-theme />
|
|
|
- <ibps-header-language />
|
|
|
- <ibps-header-size /> -->
|
|
|
- <!-- <ibps-header-fullscreen /> -->
|
|
|
- <!-- <ibps-header-tenant /> -->
|
|
|
+ <ibps-header-download />
|
|
|
+ <ibps-header-locking />
|
|
|
+ <ibps-header-theme />
|
|
|
+ <ibps-header-language />
|
|
|
+ <ibps-header-size />
|
|
|
+ <ibps-header-fullscreen />
|
|
|
+ <ibps-header-tenant /> -->
|
|
|
|
|
|
- <span style="font-size: 12px; cursor: pointer;" @click="goToMain()">首页</span>
|
|
|
- <span style="margin: 0 10px; ">|</span>
|
|
|
- <ibps-header-message /><!-- 消息中心 -->
|
|
|
- <span style="margin: 0 10px; ">|</span>
|
|
|
- <ibps-header-user />
|
|
|
- <span style="margin-left: 10px;">|</span>
|
|
|
- <ibps-header-setting />
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!-- 下面 主体 -->
|
|
|
- <div class="ibps-theme-container" flex-box="1" flex>
|
|
|
- <!-- 主体 侧边栏 -->
|
|
|
- <div
|
|
|
- v-if="sysName !='首页'"
|
|
|
- ref="aside"
|
|
|
- flex-box="0"
|
|
|
- :class="{'ibps-theme-container-aside': true, 'ibps-theme-container-transition': asideTransition}"
|
|
|
- :style="{
|
|
|
- width: asideCollapse ? asideWidthCollapse : asideWidth,
|
|
|
- opacity: searchActive ? 0.5 : 1
|
|
|
- }"
|
|
|
- >
|
|
|
- <!-- 侧部顶头栏-->
|
|
|
- <div class="layout-border-left">
|
|
|
- <div class="toggle-aside-btn" style="float: right; width: 25%;" @click="handleToggleAside">
|
|
|
- <ibps-icon :name="asideCollapse ?'indent':'outdent'" />
|
|
|
- </div>
|
|
|
- <div style="width: 74%;" class="toggle-aside-btn layout-border-left-name">
|
|
|
- <span>{{getSystemName[0].name}}</span>
|
|
|
+ <span style="font-size: 12px; cursor: pointer;" @click="goToMain()">首页</span>
|
|
|
+ <span style="margin: 0 10px;">|</span>
|
|
|
+ <ibps-header-message />
|
|
|
+ <!-- 消息中心 -->
|
|
|
+ <span style="margin: 0 10px;">|</span>
|
|
|
+ <ibps-header-user />
|
|
|
+ <span style="margin-left: 10px;">|</span>
|
|
|
+ <ibps-header-setting />
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ <!-- 下面 主体 -->
|
|
|
+ <div class="ibps-theme-container" flex-box="1" flex>
|
|
|
+ <!-- 主体 侧边栏 -->
|
|
|
+ <div
|
|
|
+ v-if="sysName != '首页'"
|
|
|
+ ref="aside"
|
|
|
+ flex-box="0"
|
|
|
+ :class="{'ibps-theme-container-aside': true, 'ibps-theme-container-transition': asideTransition}"
|
|
|
+ :style="{width: asideCollapse ? asideWidthCollapse : asideWidth, opacity: searchActive ? 0.5 : 1}"
|
|
|
+ >
|
|
|
+ <!-- 侧部顶头栏-->
|
|
|
+ <div class="layout-border-left">
|
|
|
+ <div
|
|
|
+ class="toggle-aside-btn"
|
|
|
+ style="float: right; width: 25%;"
|
|
|
+ @click="handleToggleAside"
|
|
|
+ >
|
|
|
+ <ibps-icon :name="asideCollapse ? 'indent' : 'outdent'" />
|
|
|
+ </div>
|
|
|
+ <div style="width: 74%;" class="toggle-aside-btn layout-border-left-name">
|
|
|
+ <span>{{ getSystemName[0].name }}</span>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <ibps-menu-side style="margin-top: 52px;" />
|
|
|
+ </div>
|
|
|
|
|
|
- <ibps-menu-side style="margin-top: 52px;"/>
|
|
|
- </div>
|
|
|
+ <!-- 主体 -->
|
|
|
+ <div class="ibps-theme-container-main" flex-box="1" flex>
|
|
|
+ <!-- 搜索 -->
|
|
|
+ <transition name="fade-scale">
|
|
|
+ <div
|
|
|
+ v-show="searchActive"
|
|
|
+ class="ibps-theme-container-main-layer"
|
|
|
+ flex
|
|
|
+ >
|
|
|
+ <ibps-panel-search ref="panelSearch" @close="searchPanelClose"/>
|
|
|
+ </div>
|
|
|
+ </transition>
|
|
|
+ <!-- 内容 -->
|
|
|
+ <transition name="fade-scale">
|
|
|
+ <div
|
|
|
+ v-show="!searchActive"
|
|
|
+ class="ibps-theme-container-main-layer"
|
|
|
+ flex="dir:top"
|
|
|
+ >
|
|
|
+ <!-- tab -->
|
|
|
+ <!-- <div class="ibps-theme-container-main-header" flex-box="0">
|
|
|
+ <ibps-tabs />
|
|
|
+ </div> -->
|
|
|
|
|
|
- <!-- 主体 -->
|
|
|
- <div class="ibps-theme-container-main" flex-box="1" flex>
|
|
|
- <!-- 搜索 -->
|
|
|
- <transition name="fade-scale">
|
|
|
- <div v-show="searchActive" class="ibps-theme-container-main-layer" flex>
|
|
|
- <ibps-panel-search
|
|
|
- ref="panelSearch"
|
|
|
- @close="searchPanelClose"
|
|
|
- />
|
|
|
+ <!-- 页面 -->
|
|
|
+ <div class="ibps-theme-container-main-body" flex-box="1">
|
|
|
+ <transition :name="transitionActive ? 'fade-transverse' : ''">
|
|
|
+ <!-- <keep-alive :include="keepAlive"> -->
|
|
|
+ <router-view :key="routerViewKey" />
|
|
|
+ <!-- </keep-alive> -->
|
|
|
+ </transition>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </transition>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
- </transition>
|
|
|
- <!-- 内容 -->
|
|
|
- <transition name="fade-scale">
|
|
|
- <div v-show="!searchActive" class="ibps-theme-container-main-layer" flex="dir:top">
|
|
|
- <!-- tab -->
|
|
|
- <!-- <div class="ibps-theme-container-main-header" flex-box="0">
|
|
|
- <ibps-tabs />
|
|
|
- </div> -->
|
|
|
- <!-- 页面 -->
|
|
|
- <div class="ibps-theme-container-main-body" flex-box="1">
|
|
|
- <transition :name="transitionActive ? 'fade-transverse' : ''">
|
|
|
- <!-- <keep-alive :include="keepAlive"> -->
|
|
|
- <router-view :key="routerViewKey" />
|
|
|
- <!-- </keep-alive> -->
|
|
|
- </transition>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </transition>
|
|
|
</div>
|
|
|
- </div>
|
|
|
+ <FloatBall></FloatBall>
|
|
|
</div>
|
|
|
- <FloatBall></FloatBall>
|
|
|
- </div>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import IbpsLogo from './components/logo'
|
|
|
-import IbpsMenuSide from './components/menu-side/index.js'
|
|
|
-import IbpsMenuHeader from './components/menu-header/index.js'
|
|
|
-import IbpsTabs from './components/tabs'
|
|
|
-import IbpsHeaderSearch from './components/header-search'
|
|
|
-import FloatBall from './components/components/float-ball';
|
|
|
-import IbpsHeaderFullscreen from './components/header-fullscreen'
|
|
|
-// import IbpsHeaderLocking from './components/header-locking'
|
|
|
-// import IbpsHeaderLanguage from './components/header-language'
|
|
|
-// import IbpsHeaderSize from './components/header-size'
|
|
|
-// import IbpsHeaderTheme from './components/header-theme'
|
|
|
-// import IbpsHeaderToolbar from './components/header-toolbar'
|
|
|
-
|
|
|
-// import IbpsHeaderTenant from './components/header-tenant'
|
|
|
-import IbpsHeaderSetting from './components/header-setting'
|
|
|
-import IbpsHeaderMessage from './components/header-message'
|
|
|
-import panle from '@/components/jbd-panel'
|
|
|
-import IbpsHeaderUser from './components/header-user'
|
|
|
-import IbpsHeaderErrorLog from './components/header-error-log'
|
|
|
-import IbpsHeaderBaseUrl from './components/header-base-url'
|
|
|
-// import IbpsHeaderDownload from './components/header-download'
|
|
|
-// import IbpsNotifyMonitor from '@/business/platform/socket/notify-monitor'
|
|
|
-import { mapState, mapGetters, mapActions } from 'vuex'
|
|
|
-import mixinSearch from './mixins/search'
|
|
|
-import mixinLock from './mixins/lock'
|
|
|
+ import IbpsLogo from './components/logo'
|
|
|
+ import IbpsMenuSide from './components/menu-side/index.js'
|
|
|
+ import IbpsMenuHeader from './components/menu-header/index.js'
|
|
|
+ import IbpsTabs from './components/tabs'
|
|
|
+ import IbpsHeaderSearch from './components/header-search'
|
|
|
+ import FloatBall from './components/components/float-ball'
|
|
|
+ import IbpsHeaderFullscreen from './components/header-fullscreen'
|
|
|
+ // import IbpsHeaderLocking from './components/header-locking'
|
|
|
+ // import IbpsHeaderLanguage from './components/header-language'
|
|
|
+ // import IbpsHeaderSize from './components/header-size'
|
|
|
+ // import IbpsHeaderTheme from './components/header-theme'
|
|
|
+ // import IbpsHeaderToolbar from './components/header-toolbar'
|
|
|
|
|
|
-import setting from '@/setting.js'
|
|
|
-export default {
|
|
|
- name: 'ibps-layout-header-aside',
|
|
|
- components: {
|
|
|
- IbpsLogo,
|
|
|
- IbpsMenuSide,
|
|
|
- IbpsMenuHeader,
|
|
|
- IbpsTabs,
|
|
|
- IbpsHeaderSearch,
|
|
|
- FloatBall,
|
|
|
- panle,
|
|
|
- IbpsHeaderFullscreen,
|
|
|
- // IbpsHeaderLocking,
|
|
|
- // IbpsHeaderLanguage,
|
|
|
- // IbpsHeaderSize,
|
|
|
- // IbpsHeaderTheme,
|
|
|
- // IbpsHeaderToolbar,
|
|
|
- // IbpsHeaderTenant,
|
|
|
- IbpsHeaderSetting,
|
|
|
- IbpsHeaderMessage,
|
|
|
- IbpsHeaderUser,
|
|
|
- IbpsHeaderErrorLog,
|
|
|
- IbpsHeaderBaseUrl
|
|
|
- // IbpsHeaderDownload,
|
|
|
- // IbpsNotifyMonitor
|
|
|
- },
|
|
|
- mixins: [
|
|
|
- mixinSearch,
|
|
|
- mixinLock
|
|
|
- ],
|
|
|
- data() {
|
|
|
- return {
|
|
|
- // [侧边栏宽度] 正常状态
|
|
|
- asideWidth: '200px',
|
|
|
- // [侧边栏宽度] 折叠状态
|
|
|
- asideWidthCollapse: '65px',
|
|
|
- }
|
|
|
- },
|
|
|
- /* watch:{
|
|
|
- getSystemName(value){
|
|
|
- this.sysName = ''
|
|
|
- },
|
|
|
- }, */
|
|
|
- mounted() {
|
|
|
- /* window.performance.navigation.type == 1 && */
|
|
|
- if (this.$route.name == 'dashboard') {
|
|
|
- this.sysName='首页'
|
|
|
- }
|
|
|
- },
|
|
|
- computed: {
|
|
|
+ // import IbpsHeaderTenant from './components/header-tenant'
|
|
|
+ import IbpsHeaderSetting from './components/header-setting'
|
|
|
+ import IbpsHeaderMessage from './components/header-message'
|
|
|
+ import panle from '@/components/jbd-panel'
|
|
|
+ import IbpsHeaderUser from './components/header-user'
|
|
|
+ import IbpsHeaderErrorLog from './components/header-error-log'
|
|
|
+ import IbpsHeaderBaseUrl from './components/header-base-url'
|
|
|
+ // import IbpsHeaderDownload from './components/header-download'
|
|
|
+ // import IbpsNotifyMonitor from '@/business/platform/socket/notify-monitor'
|
|
|
+ import { mapState, mapGetters, mapActions } from 'vuex'
|
|
|
+ import mixinSearch from './mixins/search'
|
|
|
+ import mixinLock from './mixins/lock'
|
|
|
|
|
|
- ...mapState('ibps', {
|
|
|
- //sysName:state=>state.menu.sysName,
|
|
|
- keepAlive: state => state.page.keepAlive,
|
|
|
- grayActive: state => state.gray.active,
|
|
|
- transitionActive: state => state.transition.active,
|
|
|
- asideCollapse: state => state.menu.asideCollapse,
|
|
|
- asideTransition: state => state.menu.asideTransition,
|
|
|
- system: state => state.system.system,
|
|
|
- subsystemList: state => state.system.subsystemList
|
|
|
- }),
|
|
|
- ...mapGetters('ibps', {
|
|
|
- themeActiveSetting: 'theme/activeSetting'
|
|
|
- }),
|
|
|
- getSystemName() {
|
|
|
- let this_ = this
|
|
|
- return this.header().filter(function (name){ return name.id == this_.activeHeader()})
|
|
|
- },
|
|
|
- /**
|
|
|
- * @description 用来实现带参路由的缓存
|
|
|
- */
|
|
|
- sysName(){
|
|
|
- if (this.$route.name == 'dashboard') {
|
|
|
- return '首页'
|
|
|
- }else{
|
|
|
- return ''
|
|
|
- }
|
|
|
- },
|
|
|
- routerViewKey() {
|
|
|
- // 默认情况下 key 类似 __transition-n-/foo
|
|
|
- // 这里的字符串操作是为了最终 key 的格式和原来相同 类似 __transition-n-__stamp-time-/foo
|
|
|
- const stamp = this.$route.meta[`__stamp-${this.$route.path}`] || ''
|
|
|
- return `${stamp ? `__stamp-${stamp}-` : ''}${this.$route.path}`
|
|
|
- },
|
|
|
- /**
|
|
|
- /**
|
|
|
- * @description 最外层容器的背景图片样式
|
|
|
- */
|
|
|
- styleLayoutMainGroup() {
|
|
|
- return {
|
|
|
- ...this.themeActiveSetting.backgroundImage ? {
|
|
|
- backgroundImage: `url('${this.$baseUrl}${this.themeActiveSetting.backgroundImage}')`
|
|
|
- } : {}
|
|
|
- }
|
|
|
- },
|
|
|
- logoIconAll() {
|
|
|
- return `${this.$baseUrl}images/theme/${this.themeActiveSetting.name}/all.png`
|
|
|
- },
|
|
|
- logoIconOnly() {
|
|
|
- return `${this.$baseUrl}images/theme/${this.themeActiveSetting.name}/only.png`
|
|
|
- }
|
|
|
- },
|
|
|
- methods: {
|
|
|
- ...mapActions('ibps/menu', [
|
|
|
- 'asideCollapseToggle'
|
|
|
- ]),
|
|
|
- ...mapState('ibps/menu', [
|
|
|
- 'activeHeader',
|
|
|
- 'header',
|
|
|
- 'activeName'
|
|
|
- ]),
|
|
|
- /* 跳转首页*/
|
|
|
- goToMain(){
|
|
|
- //this.sysName = "首页"
|
|
|
- this.$router.push({
|
|
|
- name:'dashboard'
|
|
|
- })
|
|
|
- },
|
|
|
- pageChange(){
|
|
|
- this.sysName = ''
|
|
|
- },
|
|
|
- /**
|
|
|
- * 接收点击切换侧边栏的按钮
|
|
|
- */
|
|
|
- handleToggleAside() {
|
|
|
- this.asideCollapseToggle()
|
|
|
- },
|
|
|
- handleSubsystemClick(system) {
|
|
|
- this.$store.dispatch('ibps/system/set', system)
|
|
|
- window.location.href = this.$baseUrl
|
|
|
- // location.reload() // 为了重新实例化vue-router对象 避免bug
|
|
|
+ import setting from '@/setting.js'
|
|
|
+ export default {
|
|
|
+ name: 'ibps-layout-header-aside',
|
|
|
+ components: {
|
|
|
+ IbpsLogo,
|
|
|
+ IbpsMenuSide,
|
|
|
+ IbpsMenuHeader,
|
|
|
+ IbpsTabs,
|
|
|
+ IbpsHeaderSearch,
|
|
|
+ FloatBall,
|
|
|
+ panle,
|
|
|
+ IbpsHeaderFullscreen,
|
|
|
+ // IbpsHeaderLocking,
|
|
|
+ // IbpsHeaderLanguage,
|
|
|
+ // IbpsHeaderSize,
|
|
|
+ // IbpsHeaderTheme,
|
|
|
+ // IbpsHeaderToolbar,
|
|
|
+ // IbpsHeaderTenant,
|
|
|
+ IbpsHeaderSetting,
|
|
|
+ IbpsHeaderMessage,
|
|
|
+ IbpsHeaderUser,
|
|
|
+ IbpsHeaderErrorLog,
|
|
|
+ IbpsHeaderBaseUrl
|
|
|
+ // IbpsHeaderDownload,
|
|
|
+ // IbpsNotifyMonitor
|
|
|
+ },
|
|
|
+ mixins: [mixinSearch, mixinLock],
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ // [侧边栏宽度] 正常状态
|
|
|
+ asideWidth: '200px',
|
|
|
+ // [侧边栏宽度] 折叠状态
|
|
|
+ asideWidthCollapse: '65px'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // watch: {
|
|
|
+ // getSystemName(value) {
|
|
|
+ // this.sysName = ''
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ mounted() {
|
|
|
+ // window.performance.navigation.type == 1
|
|
|
+ if (this.$route.name == 'dashboard') {
|
|
|
+ this.sysName = '首页'
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState('ibps', {
|
|
|
+ // sysName:state=>state.menu.sysName,
|
|
|
+ keepAlive: state => state.page.keepAlive,
|
|
|
+ grayActive: state => state.gray.active,
|
|
|
+ transitionActive: state => state.transition.active,
|
|
|
+ asideCollapse: state => state.menu.asideCollapse,
|
|
|
+ asideTransition: state => state.menu.asideTransition,
|
|
|
+ system: state => state.system.system,
|
|
|
+ subsystemList: state => state.system.subsystemList
|
|
|
+ }),
|
|
|
+ ...mapGetters('ibps', {
|
|
|
+ themeActiveSetting: 'theme/activeSetting'
|
|
|
+ }),
|
|
|
+ getSystemName() {
|
|
|
+ return this.header().filter(name => { return name.id == this.activeHeader() })
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * @description 用来实现带参路由的缓存
|
|
|
+ */
|
|
|
+ sysName: {
|
|
|
+ get() {
|
|
|
+ if (this.$route.name == 'dashboard') {
|
|
|
+ return '首页'
|
|
|
+ } else {
|
|
|
+ return ''
|
|
|
+ }
|
|
|
+ },
|
|
|
+ set() {
|
|
|
+ if (this.$route.name == 'dashboard') {
|
|
|
+ return '首页'
|
|
|
+ } else {
|
|
|
+ return ''
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ routerViewKey() {
|
|
|
+ // 默认情况下 key 类似 __transition-n-/foo
|
|
|
+ // 这里的字符串操作是为了最终 key 的格式和原来相同 类似 __transition-n-__stamp-time-/foo
|
|
|
+ const stamp = this.$route.meta[`__stamp-${this.$route.path}`] || ''
|
|
|
+ return `${stamp ? `__stamp-${stamp}-` : ''}${this.$route.path}`
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * @description 最外层容器的背景图片样式
|
|
|
+ */
|
|
|
+ styleLayoutMainGroup() {
|
|
|
+ return { ...(this.themeActiveSetting.backgroundImage ? {backgroundImage: `url('${this.$baseUrl}${this.themeActiveSetting.backgroundImage}')`} : {})}
|
|
|
+ },
|
|
|
+ logoIconAll() {
|
|
|
+ return `${this.$baseUrl}images/theme/${this.themeActiveSetting.name}/all.png`
|
|
|
+ },
|
|
|
+ logoIconOnly() {
|
|
|
+ return `${this.$baseUrl}images/theme/${this.themeActiveSetting.name}/only.png`
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ ...mapActions('ibps/menu', ['asideCollapseToggle']),
|
|
|
+ ...mapState('ibps/menu', ['activeHeader', 'header', 'activeName']),
|
|
|
+ /* 跳转首页*/
|
|
|
+ goToMain() {
|
|
|
+ // this.sysName = "首页"
|
|
|
+ this.$router.push({
|
|
|
+ name: 'dashboard'
|
|
|
+ })
|
|
|
+ },
|
|
|
+ pageChange() {
|
|
|
+ this.sysName = ''
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 接收点击切换侧边栏的按钮
|
|
|
+ */
|
|
|
+ handleToggleAside() {
|
|
|
+ this.asideCollapseToggle()
|
|
|
+ },
|
|
|
+ handleSubsystemClick(system) {
|
|
|
+ this.$store.dispatch('ibps/system/set', system)
|
|
|
+ window.location.href = this.$baseUrl
|
|
|
+ // location.reload() // 为了重新实例化vue-router对象 避免bug
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
-}
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
|
-// 注册主题
|
|
|
-@import '~@/assets/styles/theme/register.scss';
|
|
|
-.jbd-sys-title{
|
|
|
- background: linear-gradient(to top,#a73a3a,#f35858);
|
|
|
- height: 40px;
|
|
|
- line-height: 40px;
|
|
|
- font-size: 18px;
|
|
|
- color: #FFF;
|
|
|
- text-align: center;
|
|
|
-}
|
|
|
-.jbd-sys-title-cont{
|
|
|
- height: 40px;
|
|
|
- line-height: 40px;
|
|
|
- font-weight: bold;
|
|
|
- font-size: 14px;
|
|
|
-}
|
|
|
-.jbd-sys-title-contact{
|
|
|
- line-height: 20px;
|
|
|
- margin-right: 40px;
|
|
|
- font-size: 14px;
|
|
|
-}
|
|
|
-.layout-border-left{
|
|
|
- float: left;
|
|
|
- box-shadow: 0px 2px 4px #E78C45, 0 0 5px rgba(155,155, 0, .04);
|
|
|
- width: 100%;
|
|
|
- height: 50px;
|
|
|
- line-height: 50px;
|
|
|
- .layout-border-left-name{
|
|
|
- float: left;
|
|
|
- font-size: 18px;
|
|
|
- font-weight: bold;
|
|
|
- }
|
|
|
-}
|
|
|
+ // 注册主题
|
|
|
+ @import '~@/assets/styles/theme/register.scss';
|
|
|
+ .jbd-sys-title {
|
|
|
+ background: linear-gradient(to top, rgb(51, 150, 209), #7dbfdf);
|
|
|
+ // background: rgb(51, 150, 209);
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ font-size: 18px;
|
|
|
+ color: #fff;
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ .jbd-sys-title-cont {
|
|
|
+ height: 40px;
|
|
|
+ line-height: 40px;
|
|
|
+ font-weight: bold;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ .jbd-sys-title-contact {
|
|
|
+ line-height: 20px;
|
|
|
+ margin-right: 40px;
|
|
|
+ font-size: 14px;
|
|
|
+ }
|
|
|
+ .layout-border-left {
|
|
|
+ float: left;
|
|
|
+ box-shadow: 0px 2px 4px #e78c45, 0 0 5px rgba(155, 155, 0, 0.04);
|
|
|
+ width: 100%;
|
|
|
+ height: 50px;
|
|
|
+ line-height: 50px;
|
|
|
+ .layout-border-left-name {
|
|
|
+ float: left;
|
|
|
+ font-size: 18px;
|
|
|
+ font-weight: bold;
|
|
|
+ }
|
|
|
+ }
|
|
|
</style>
|
liujiayin
