rt-sim-training-client/src/views/planMonitor/newEditTool/menuTool.vue

171 lines
4.8 KiB
Vue
Raw Normal View History

2020-08-14 18:30:04 +08:00
<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: this.$t('planMonitor.server1'),
operate: '',
src: logo_,
click: this.undeveloped
},
{
title: this.$t('planMonitor.server2'),
operate: '',
src: '',
click: this.undeveloped
},
{
title: this.$t('planMonitor.frontMachine1'),
operate: '',
src: '',
click: this.undeveloped
},
{
title: this.$t('planMonitor.frontMachine2'),
operate: '',
src: '',
click: this.undeveloped
},
{
title: this.$t('planMonitor.mainDispatcher'),
operate: '',
src: '',
click: this.undeveloped
},
{
title: this.$t('planMonitor.dispatcher1'),
operate: '',
src: '',
click: this.undeveloped
},
{
title: this.$t('planMonitor.dispatcher2'),
operate: '',
src: '',
click: this.undeveloped
},
{
title: this.$t('planMonitor.dispatcher3'),
operate: '',
src: '',
click: this.undeveloped
},
{
title: this.$t('planMonitor.bigScreen'),
operate: '',
src: '',
click: this.undeveloped
},
{
title: this.$t('planMonitor.maintenanceWorkstation'),
operate: '',
src: '',
click: this.undeveloped
},
{
title: this.$t('planMonitor.runGraphShowManualStation'),
operate: '',
src: '',
click: this.undeveloped
},
{
title: this.$t('planMonitor.jumpStop'),
operate: '',
src: '',
click: this.undeveloped
},
{
title: this.$t('planMonitor.detainTrain'),
operate: '',
src: '',
click: this.undeveloped
},
{
title: this.$t('planMonitor.trainAlarm'),
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">
@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>