rt-sim-training-client/src/views/map/runplan/index.vue
2019-07-26 13:32:43 +08:00

67 lines
1.9 KiB
Vue

<template>
<div class="main">
<div class="list" :style="{width: widthLeft+'px'}">
<chart-list ref="list" :height="height"></chart-list>
</div>
<drap-left :widthLeft="widthLeft" @drapWidth="drapWidth"></drap-left>
<transition>
<router-view style="float: right;" :style="{width: width+'px'}"></router-view>
</transition>
</div>
</template>
<script>
import WindowResizeHandler from '@/mixin/WindowResizeHandler';
import DrapLeft from '@/views/components/drapLeft/index';
import ChartList from './manage/list';
export default {
name: 'runPlan',
mixins: [WindowResizeHandler],
components: {
DrapLeft,
ChartList,
},
data() {
return {
width: 0,
height: 0,
widthLeft: 320,
}
},
watch: {
widthLeft(val) {
this.setRunPlanResize(val);
}
},
methods: {
drapWidth(width) {
this.widthLeft = Number(width);
},
setRunPlanResize(LeftWidth) {
if (this.$refs) {
this.width = this._clientWidth - LeftWidth;
this.height = this._clientHeight - 150;
this.$store.dispatch('runPlan/resize', { width: this.width, height: this.height + 90 });
} else {
setTimeout(() => { this.setRunPlanResize(LeftWidth); }, 300)
}
},
resizeHandler() {
this.setRunPlanResize(this.widthLeft);
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.main {
width: 100%;
height: 100%;
.list {
float: left;
}
}
</style>