rt-sim-training-client/src/views/system/iscsDraw/index.vue

92 lines
2.0 KiB
Vue

<template>
<transition name="el-zoom-in-center">
<div class="mapPaint">
<div class="map-view">
<iscs-plate ref="iscsPlate" />
</div>
<div class="map-draft">
<iscs-operate v-if="iscsMode==='fas'" ref="iscsOperate" @iscsChange="iscsChange" />
<iscs-bas-operate v-else-if="iscsMode==='bas'" ref="iscsBasOperate" @iscsChange="iscsChange" />
<iscs-psd-operate v-else-if="iscsMode==='psd'" ref="iscsPsdOperate" @iscsChange="iscsChange" />
</div>
</div>
</transition>
</template>
<script>
import IscsPlate from '@/views/iscsSystem/index';
import IscsOperate from './iscsOperate/index';
import IscsBasOperate from './iscsBasOperate/index';
import IscsPsdOperate from './iscsPsdOperate/index';
export default {
name: 'IscsView',
components: {
IscsPlate,
IscsOperate,
IscsBasOperate,
IscsPsdOperate
},
data() {
return {
size: {
width: this.$store.state.app.width - 521,
height: this.$store.state.app.height - 60
}
};
},
computed:{
iscsMode() {
return this.$route.params.mode;
}
},
watch: {
$route(val) {
}
},
created() {
},
mounted() {
this.$refs.iscsPlate.show();
this.$refs.iscsPlate.drawIscsInit();
},
beforeDestroy() {
},
methods: {
iscsChange() {
this.$refs.iscsPlate.drawIscsInit();
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.map-draft{
height:100%;
/deep/{
.v-modal{
opacity: 0;
}
}
}
.map-view {
float: left;
width: 60%;
}
.mapPaint{
height: 100%;
overflow: hidden;
}
.map-draft {
float: right;
width: 520px;
// /deep/ .el-scrollbar__view {
// width: 510px !important;
// height: calc(100% - 40px);
// }
}
</style>