Skip to content

E
energyai_vue
Commit 4570a0ad authored by xiexingan's avatar xiexingan
Browse files
Options

菜单调整

parent ce7b8490
Show whitespace changes
Inline Side-by-side
Showing with 257 additions and 374 deletions
src/layout/header-aside/layout.vue
View file @ 4570a0ad
<template>
<div
class="d2-layout-header-aside-group"
:style="styleLayoutMainGroup"
:class="{ grayMode: grayActive }"
>
<div class="d2-layout-header-aside-group" :style="styleLayoutMainGroup" :class="{ grayMode: grayActive }">
<!-- 半透明遮罩 -->
<div class="d2-layout-header-aside-mask"></div>
<!-- 主体内容 -->
<div class="d2-layout-header-aside-content" flex="dir:top">
<!-- 顶栏 -->
<div class="d2-theme-header" flex-box="0" flex>
<div class="logo-group" flex-box="0">
<img class="img-logo-all" src="./imgs/logo2x.png" />
<div class="logo-group" :style="{width: asideWidth}" flex-box="0">
<img src="./imgs/logo2x.png">
</div>
<d2-menu-header class="menu-header" flex-box="1" />
<div style='width:100%;'>
<div flex-box="1"></div>
<!-- 顶栏右侧 -->
<div>
<div class="d2-header-right">
<div class="time-container">
<!-- 当前时间 -->
<div class="current-time">{{ time | formatDate }}</div>
<div class="current-date">{{ time | formatDate2 }}</div>
</div>
<div class="subway-container">
<div class="subway-info">
<span :class="station.length < 6 ? 'lineFeed' : ''">{{
station
}}</span>
<!-- <div class="out-img">
</div> -->
<span :class="station.length < 6 ? 'lineFeed' : ''">{{station }}</span>
</div>
<div class="user-img"><img src="./imgs/subway.png" /></div>
</div>
<d2-header-theme />
<!-- 主题 -->
<el-badge
class="msg-img"
:value="countNum == 0 ? '' : countNum > 99 ? '99+' : countNum"
type="danger"
>
<el-badge class="msg-img" :value="countNum == 0 ? '' : countNum > 99 ? '99+' : countNum" type="danger">
<div title="报警中心" style="cursor: pointer" @click="toAlarms">
<img src="./imgs/msg.png" />
</div>
</el-badge>
<d2-header-user />
<div
title="退出"
class="msg-img"
style="cursor: pointer;"
@click="logOff"
>
<div title="退出" class="msg-img" style="cursor: pointer;" @click="logOff">
<img src="./imgs/out.png" />
</div>
<!-- <div class="subway-container" @click="logOff">
<div class="user-img"><img src="./imgs/user.png" /></div>
<div class="subway-info">
<d2-header-user class="subway-title" />
<div class="out-img">
<img src="./imgs/out.png" />
<span>退出</span>
</div>
</div>
</div> -->
</div>
<!-- <div width="95%" style="float:right;margin-right:6%">
<font color="#C5CBD2" size="2">
{{
station
? "欢迎访问" + station + "轨道交通综合安防平台！"
: "请先登录"
}}
</font>
</div> -->
</div>
</div>
<!-- 下面 主体 -->
<div class="d2-theme-container" flex-box="1" flex>
<!-- 主体 侧边栏 -->
<!-- <div
flex-box="0"
ref="aside"
class="d2-theme-container-aside"
:style="{
width: asideCollapse ? asideWidthCollapse : asideWidth,
<div flex-box="0" ref="aside" class="d2-theme-container-aside" :style="{
width:asideWidth,
opacity: this.searchActive ? 0.5 : 1
}"
>
}">
<d2-menu-side />
</div>-->
</div>
<!-- 主体 -->
<div class="d2-theme-container-main" flex-box="1" flex>
<!-- 内容 -->
<transition name="fade-scale">
<div class="d2-theme-container-main-layer" flex="dir:top">
<sys v-if="$route.matched[0].name == 'sys'"></sys>
<monitor v-if="$route.matched[0].name == 'monitor'"></monitor>
<access v-if="$route.matched[0].name == 'access'"></access>
<police v-if="$route.matched[0].name == 'police'"></police>
<inspect v-if="$route.matched[0].name == 'inspect'"></inspect>
<patrol v-if="$route.matched[0].name == 'patrol'"></patrol>
<eme v-if="$route.matched[0].name == 'em'"></eme>
<eq v-if="$route.matched[0].name == 'eq'"></eq>
<plan v-if="$route.matched[0].name == 'plan'"></plan>
<linkage v-if="$route.matched[0].name == 'linkage'"></linkage>
<alarms v-if="$route.matched[0].name == 'alarms'"></alarms>
<!-- 线路级 -->
<rEme v-if="$route.matched[0].name == 'routes-em'"></rEme>
<rSys v-if="$route.matched[0].name == 'routes-sys'"></rSys>
<rPlan v-if="$route.matched[0].name == 'routes-plan'"></rPlan>
<rEq v-if="$route.matched[0].name == 'routes-eq'"></rEq>
<rAna v-if="$route.matched[0].name == 'routes-analysis'"></rAna>
<!-- 页面 -->
<div
class="d2-theme-container-main-body"
flex-box="1"
style="background-color: white"
>
<div class="d2-theme-container-main-body" flex-box="1" style="background-color: white">
<!-- <bim></bim> -->
<keep-alive :include="keepAlive">
<router-view />
......@@ -125,18 +61,6 @@
</transition>
</div>
</div>
<!-- <el-button @click="drawer = true" type="primary" >
点我打开
</el-button>
<el-drawer
title="我是标题"
direction="btt"
:visible.sync="drawer"
:with-header="false">
<span>我来啦!</span>
</el-drawer> -->
<div style="z-index:9999!important;user-select:none;" class="mfooter">
Copyright (C) 2009-2010. XXXXX信息工程有限公司 蜀ICP备1202XXXX号-1
电话：86-028-689XXXX 传真：86-028-6893XXXX
......@@ -148,7 +72,6 @@
<script>
import { mapState, mapGetters, mapActions } from 'vuex'
import mixinSearch from './mixins/search'
import util from '@/libs/util.js'
export default {
name: 'd2-layout-header-aside',
......@@ -157,32 +80,20 @@ export default {
'd2-menu-side': () => import('./components/menu-side'),
'd2-menu-header': () => import('./components/menu-header'),
'd2-header-theme': () => import('./components/header-theme'),
'd2-header-user': () => import('./components/header-user'),
sys: () => import('../../pages/sys/index.vue'),
// monitor: () => import('../../pages/monitor/index.vue'),
// access: () => import('../../pages/access/index.vue'),
// police: () => import('../../pages/police/index.vue'),
// inspect: () => import('../../pages/inspect/index.vue'),
// patrol: () => import('../../pages/patrol/index.vue'),
// eme: () => import('../../pages/em/index.vue'),
// eq: () => import('../../pages/eq/index.vue'),
// plan: () => import('../../pages/plan/index.vue'),
// linkage: () => import('../../pages/linkage/index.vue'),
// alarms: () => import('../../pages/alarms/index.vue'),
bim: () => import('./components/bim'),
'd2-header-user': () => import('./components/header-user')
},
data() {
return {
drawer: false,
// [侧边栏宽度] 正常状态
asideWidth: '220px',
asideWidth: '256px',
// [侧边栏宽度] 折叠状态
asideWidthCollapse: '65px',
time: new Date(),
timer: null,
logTimeout: null,
countNum: 0,
station: '',
station: ''
}
},
mounted() {
......@@ -191,7 +102,7 @@ export default {
this.countNum = this.size
},
filters: {
formatDate: function(value) {
formatDate: function (value) {
let date = new Date(value)
let h = date.getHours()
h = h < 10 ? '0' + h : h
......@@ -201,7 +112,7 @@ export default {
s = s < 10 ? '0' + s : s
return ` ${h}:${m}:${s}`
},
formatDate2: function(value) {
formatDate2: function (value) {
let date = new Date(value)
let y = date.getFullYear()
let MM = date.getMonth() + 1
......@@ -213,7 +124,7 @@ export default {
let getWeek = '星期' + weeks[week]
// return `${y}/${MM}/${d} ${getWeek} `
return `${MM}/${d} ${getWeek} `
},
}
},
computed: {
......@@ -221,12 +132,12 @@ export default {
keepAlive: (state) => state.page.keepAlive,
grayActive: (state) => state.gray.active,
transitionActive: (state) => state.transition.active,
asideCollapse: (state) => state.menu.asideCollapse,
asideCollapse: (state) => state.menu.asideCollapse
}),
...mapState('d2admin/menu', ['header']),
...mapState('d2admin/toast', ['size']),
...mapGetters('d2admin', {
themeActiveSetting: 'theme/activeSetting',
themeActiveSetting: 'theme/activeSetting'
}),
/**
* @description 最外层容器的背景图片样式
......@@ -239,14 +150,22 @@ export default {
// }
// : {})
}
},
}
},
watch: {
size(val) {
this.countNum = val
},
}
},
methods: {
...mapActions('d2admin/menu', ['asideCollapseToggle']),
/**
* 接收点击切换侧边栏的按钮
*/
handleToggleAside() {
console.log(111111)
this.asideCollapseToggle()
},
...mapActions('d2admin/account', ['logout']),
/**
* @description 登出
......@@ -254,7 +173,7 @@ export default {
logOff() {
this.logout({
vm: this,
confirm: true,
confirm: true
})
},
getDate() {
......@@ -279,8 +198,8 @@ export default {
if (!this.station || this.station == 'undefined') {
setTimeout(this.getStation, 3000)
}
},
},
}
}
}
</script>
......@@ -368,46 +287,13 @@ export default {
height: 90px;
}
// 头部右侧
.d2-header-right {
// height: 90px !important;
// line-height: 90px !important;
}
//container
.d2-theme-container {
transform: translateY(60px);
}
// 菜单样式
// .theme-tx1 .d2-theme-header .el-menu .el-menu-item {
// border-bottom: 4px solid rgba(255, 255, 255, 0) !important;
// color: rgba(255, 255, 255, 0.75) !important;
// }
// .theme-tx1 .d2-theme-header .el-menu .el-menu-item:focus {
// color: rgba(255, 255, 255, 1) !important;
// border-bottom: 4px solid #35aff8 !important;
// background: rgba(255, 255, 255, 0.1) !important;
// box-shadow: #35aff8 0 0 10px inset !important;
// }
// .theme-tx1 .d2-theme-header .el-menu .el-menu-item.is-active {
// color: rgba(255, 255, 255, 1) !important;
// border-bottom: 4px solid #35aff8 !important;
// background: rgba(255, 255, 255, 0.1) !important;
// box-shadow: #35aff8 0 0 10px inset !important;
// }
// .theme-tx1 .d2-theme-header .el-menu .el-menu-item:hover {
// color: rgba(255, 255, 255, 1) !important;
// border-bottom: 4px solid #35aff8 !important;
// background: rgba(255, 255, 255, 0.1) !important;
// box-shadow: #35aff8 0 0 10px inset !important;
// }
// 注册主题
@import '~@/assets/style/theme/register.scss';
@import "~@/assets/style/theme/register.scss";
// 左上角logo
.d2-layout-header-aside-group
.d2-layout-header-aside-content
......@@ -428,8 +314,5 @@ export default {
font-size: 12px;
font-weight: 400;
color: rgba(255, 255, 255, 0.75);
// background: #2d3a4b;
/*position: fixed;*/
/*top: 0;*/
}
</style>
src/pages/ol/demo/index.vue
View file @ 4570a0ad
......@@ -652,7 +652,7 @@ export default {
this.treeData &&
this.treeData.length > 0
) {
this.defaultExpandedKeys = [data.nodes[0].id]
// this.defaultExpandedKeys = [data.nodes[0].id]
}
this.initStation(this.checkedData.sId)
})
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment