171 lines
4.5 KiB
Vue
171 lines
4.5 KiB
Vue
|
<template>
|
||
|
|
<div id="PlanMenuTool">
|
||
|
|
<div class="nav">
|
||
|
|
<div v-for="(item,index) in tools" :key="index" class="tool">
|
||
|
|
<img :src="item.src" :alt="item.title">
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
<script>
|
||
|
|
import { prefixIntrger } from '@/utils/date';
|
||
|
|
import logo_ from '@/assets/logo_.png';
|
||
|
|
|
||
|
|
export default {
|
||
|
|
name: 'PlanMenuTool',
|
||
|
|
data() {
|
||
|
|
return {
|
||
|
|
tools: [
|
||
|
|
{
|
||
|
|
title: '服务器1',
|
||
|
|
operate: '',
|
||
|
|
src: logo_,
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '服务器2',
|
||
|
|
operate: '',
|
||
|
|
src: '',
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '前置机1',
|
||
|
|
operate: '',
|
||
|
|
src: '',
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '前置机2',
|
||
|
|
operate: '',
|
||
|
|
src: '',
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '主调',
|
||
|
|
operate: '',
|
||
|
|
src: '',
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '调度台1',
|
||
|
|
operate: '',
|
||
|
|
src: '',
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '调度台2',
|
||
|
|
operate: '',
|
||
|
|
src: '',
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '调度台3',
|
||
|
|
operate: '',
|
||
|
|
src: '',
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '大屏',
|
||
|
|
operate: '',
|
||
|
|
src: '',
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '维护工作站',
|
||
|
|
operate: '',
|
||
|
|
src: '',
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '运行图显示人工站',
|
||
|
|
operate: '',
|
||
|
|
src: '',
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '跳停',
|
||
|
|
operate: '',
|
||
|
|
src: '',
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '扣车',
|
||
|
|
operate: '',
|
||
|
|
src: '',
|
||
|
|
click: this.undeveloped
|
||
|
|
},
|
||
|
|
{
|
||
|
|
title: '列车报警',
|
||
|
|
operate: '',
|
||
|
|
src: logo_,
|
||
|
|
click: this.undeveloped
|
||
|
|
}
|
||
|
|
]
|
||
|
|
};
|
||
|
|
},
|
||
|
|
computed: {
|
||
|
|
isShowSystemTime() {
|
||
|
|
return this.$route.params.mode == 'demon' || this.$route.params.mode === 'dp' || !this.$route.params.mode;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
watch: {
|
||
|
|
'$store.state.training.initTime': function (initTime) {
|
||
|
|
const date = new Date(initTime);
|
||
|
|
this.time = `${prefixIntrger(date.getHours(), 2)}:${prefixIntrger(date.getMinutes(), 2)}${prefixIntrger(date.getSeconds(), 2)}`;
|
||
|
|
}
|
||
|
|
},
|
||
|
|
mounted() {
|
||
|
|
this.initTools();
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
initTools() {
|
||
|
|
this.tools = [];
|
||
|
|
}
|
||
|
|
}
|
||
|
|
};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style scoped rel="stylesheet/scss" lang="scss" scoped>
|
||
|
|
@import "src/styles/mixin.scss";
|
||
|
|
$top: 48px;
|
||
|
|
$width: 25px;
|
||
|
|
$height: 25px;
|
||
|
|
|
||
|
|
#PlanMenuTool {
|
||
|
|
z-index: 5;
|
||
|
|
position: absolute;
|
||
|
|
width: 100%;
|
||
|
|
top: $top;
|
||
|
|
}
|
||
|
|
|
||
|
|
.nav {
|
||
|
|
display: block;
|
||
|
|
color: #0000;
|
||
|
|
background: #EBEADB;
|
||
|
|
border: 1px solid #B6BCCC !important;
|
||
|
|
border-bottom: 2px solid #B6BCCC !important;
|
||
|
|
list-style: none;
|
||
|
|
height: $height;
|
||
|
|
line-height: $height;
|
||
|
|
}
|
||
|
|
|
||
|
|
.tool {
|
||
|
|
padding-left: 10px;
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
cursor: pointer;
|
||
|
|
position: relative;
|
||
|
|
float: left;
|
||
|
|
margin: 1px;
|
||
|
|
width: $width;
|
||
|
|
|
||
|
|
img {
|
||
|
|
display: block;
|
||
|
|
text-align: center;
|
||
|
|
padding-top: 2px;
|
||
|
|
height: $height - 5;
|
||
|
|
width: $width - 5;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|