joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

实训平台教学 代码调整

Browse Source
This commit is contained in:
joylink_cuiweidong 2020-04-14 14:51:14 +08:00
parent c8a500c5dd
commit ba666eb334
4 changed files with 90 additions and 50 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
src/views/newMap/displayNew/LeftSlider.vue
View File

@ -10,7 +10,7 @@
<span v-else class="el-icon-arrow-left" @click="handleSliderShow(false)">{{ $t('display.lesson.fold') }}</span> <span v-else class="el-icon-arrow-left" @click="handleSliderShow(false)">{{ $t('display.lesson.fold') }}</span>
</div> </div>
<div class="slider-tree"> <div class="slider-tree">
<el-scrollbar wrap-class="scrollbar-wrapper"> <el-scrollbar wrap-class="scrollbar-wrapper" style="background: #fff;">
<el-tree <el-tree
ref="tree" ref="tree"
style="margin-top: 10px" style="margin-top: 10px"
@ -42,6 +42,12 @@ import { launchFullscreen } from '@/utils/screen';
import { UrlConfig } from '@/scripts/ConstDic'; import { UrlConfig } from '@/scripts/ConstDic';
export default { export default {
name: 'LeftSlider', name: 'LeftSlider',
props:{
offsetBottom:{
type: Number,
required: true
}
},
data() { data() {
return { return {
show: true, show: true,
@ -55,6 +61,9 @@ export default {
}, },
mounted() { mounted() {
this.initLoadPage(); this.initLoadPage();
// this.$nextTick(() => {
// document.querySelector('.left-slider').style.height = document.querySelector('.left-slider').offsetHeight - this.offsetBottom + 'px';
// });
}, },
methods: { methods: {
initLoadPage() { initLoadPage() {
@ -70,10 +79,10 @@ export default {
this.$emit('overallTranslation', flag); this.$emit('overallTranslation', flag);
const slider = document.getElementById('leftSlider'); const slider = document.getElementById('leftSlider');
if (flag) { if (flag) {
slider.setAttribute('style', 'transform: translateX(0)'); slider.style.transform = 'translateX(0)';
this.show = false; this.show = false;
} else { } else {
slider.setAttribute('style', ''); slider.style.transform = '';
this.show = true; this.show = true;
} }
}, },
@ -83,9 +92,9 @@ export default {
this.disabled = true; this.disabled = true;
trainingNotifyNew({ trainingId: obj.id }).then(resp => { trainingNotifyNew({ trainingId: obj.id }).then(resp => {
const query = { const query = {
group: resp.data, trainingId: obj.id, lessonId: this.$route.query.lessonId, mapId: this.$route.query.mapId group: resp.data, trainingId: obj.id, lessonId: this.$route.query.lessonId, mapId: this.$route.query.mapId, lineCode:this.$route.query.lineCode
}; };
this.$router.push({ path: `${UrlConfig.displayNew}/teach`, query: query }); this.$router.replace({ path: `${UrlConfig.displayNew}/teach`, query: query });
launchFullscreen(); launchFullscreen();
}).catch(error => { }).catch(error => {
this.$messageBox(`${this.$t('tip.createSimulationFaild')} : ${error.message}`); this.$messageBox(`${this.$t('tip.createSimulationFaild')} : ${error.message}`);
@ -123,7 +132,11 @@ export default {
position: absolute; position: absolute;
left: 400px; left: 400px;
top: 50%; top: 50%;
color: #fff; background: #fff;
color: #000;
border-radius: 3px;
box-shadow: 3px 1px 5px #000;
padding: 3px;
} }
.tip-title { .tip-title {
width: 100%; width: 100%;

8
src/views/newMap/displayNew/index.vue
View File

@ -67,7 +67,7 @@
</div> </div>
<!-- <Jl3d-Simulation v-show="simulationShow" ref="Jl3dSimulation" :panel-show="simulationShow" @showpanel="showpanel" /> --> <!-- <Jl3d-Simulation v-show="simulationShow" ref="Jl3dSimulation" :panel-show="simulationShow" @showpanel="showpanel" /> -->
<left-slider v-if="isShowLeftSlider" @overallTranslation="overallTranslation" /> <left-slider v-if="isShowLeftSlider" :offset-bottom="offsetBottom" @overallTranslation="overallTranslation" />
<Jl3d-Device v-if="deviceShow" ref="Jl3dDevice" :panel-show="deviceShow" @showdevice="showdevice" /> <Jl3d-Device v-if="deviceShow" ref="Jl3dDevice" :panel-show="deviceShow" @showdevice="showdevice" />
<Jl3d-Drive v-show="drivingShow" ref="Jl3dDrive" :panel-show="drivingShow" @showdriving="showdriving" /> <Jl3d-Drive v-show="drivingShow" ref="Jl3dDrive" :panel-show="drivingShow" @showdriving="showdriving" />
@ -584,12 +584,12 @@ export default {
}); });
}, },
overallTranslation(flag) { overallTranslation(flag) {
const panel = document.getElementById('panel'); const panel = document.getElementById('leftSlider');
this.$refs.lessonMenu.handelGroupButtonTranslate(flag); this.$refs.lessonMenu.handelGroupButtonTranslate(flag);
if (flag) { if (flag) {
panel.setAttribute('style', 'transform: translateX(400px)'); panel.style.transform = 'translateX(400px)';
} else { } else {
panel.setAttribute('style', ''); panel.style.transform = '';
} }
}, },
switchStationMode(val) { switchStationMode(val) {

23
src/views/newMap/displayNew/menuLesson.vue
View File

@ -16,7 +16,7 @@
</div> </div>
<div id="teachGroupButton" class="display-draft" :style="{bottom: offsetBottom + 'px'}"> <div id="teachGroupButton" class="display-draft" :style="{bottom: offsetBottom + 'px'}">
<el-button-group> <el-button-group>
<el-button type="success" :disabled="isDisable" :loading="startLoading" @click="start">{{ $t('display.startBtn') }}</el-button> <el-button type="success" class="start" :disabled="isDisable" :loading="startLoading" @click="start">{{ $t('display.startBtn') }}</el-button>
<el-button type="danger" class="end" :disabled="!isDisable" @click="end">{{ $t('display.endBtn') }}</el-button> <el-button type="danger" class="end" :disabled="!isDisable" @click="end">{{ $t('display.endBtn') }}</el-button>
<el-button type="primary" :disabled="backDisable" class="back" @click="back">{{ $t('display.backBtn') }}</el-button> <el-button type="primary" :disabled="backDisable" class="back" @click="back">{{ $t('display.backBtn') }}</el-button>
</el-button-group> </el-button-group>
@ -111,6 +111,13 @@ export default {
this.isDisable = false; this.isDisable = false;
}, },
'$store.state.map.mapViewLoadedCount': function (val) {
this.$store.dispatch('training/end', null);
this.$store.dispatch('training/reset');
this.$store.dispatch('training/emitTipFresh');
this.$store.dispatch('menuOperation/setButtonOperation', null);
this.isDisable = false;
},
'$store.state.training.operateErrMsg': function (val) { '$store.state.training.operateErrMsg': function (val) {
this.tipInfo({ color: val.color, message: val.errMsg }); this.tipInfo({ color: val.color, message: val.errMsg });
} }
@ -216,12 +223,12 @@ export default {
} }
}, },
handelGroupButtonTranslate(flag) { handelGroupButtonTranslate(flag) {
const buttons = document.getElementById('teachGroupButton'); // const buttons = document.getElementById('teachGroupButton');
if (flag) { // if (flag) {
buttons.setAttribute('style', 'transform: translateX(-400px)'); // buttons.style.transform = 'translateX(-400px)';
} else { // } else {
buttons.setAttribute('style', ''); // buttons.style.transform = 'translateX(0px)';
} // }
}, },
switchStationMode(val) { switchStationMode(val) {
this.$emit('switchStationMode', val); this.$emit('switchStationMode', val);
@ -297,6 +304,8 @@ export default {
z-index: 100000; z-index: 100000;
} }
.start,.end{z-index:2}
/deep/ .el-button { /deep/ .el-button {
font-weight: bold; font-weight: bold;
} }

22
src/views/newMap/displayNew/tipTrainingDetail.vue
View File

@ -2,6 +2,8 @@
<!-- v-drag 拖拽 调整宽高 --> <!-- v-drag 拖拽 调整宽高 -->
<div v-quickMenuDrag class="reminder-drag"> <div v-quickMenuDrag class="reminder-drag">
<div ref="drapBox" class="reminder-box" :style="{bottom: offsetBottom + 'px'}"> <div ref="drapBox" class="reminder-box" :style="{bottom: offsetBottom + 'px'}">
<div class="zhezhao" />
<div class="reminder-box-content">
<div class="tip-title"> <div class="tip-title">
<i v-show="isShrink" class="icon el-icon-minus" @click="shrink" /> <i v-show="isShrink" class="icon el-icon-minus" @click="shrink" />
<i v-show="!isShrink" class="icon el-icon-plus" @click="shrink" /> <i v-show="!isShrink" class="icon el-icon-plus" @click="shrink" />
@ -37,6 +39,7 @@
</div> </div>
</div> </div>
</div> </div>
</div>
</template> </template>
<script> <script>
@ -163,6 +166,21 @@ export default {
display:inline-block;width:77%;line-height:26px;margin-top:-4px; display:inline-block;width:77%;line-height:26px;margin-top:-4px;
} }
.zhezhao{
width: 100%;
height: 100%;
filter: blur(8px);
background: rgba(255,255,255,0.9);
}
.reminder-box-content{
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
z-index: 2;
background: rgba(255,255,255,0.8);
}
.reminder-box { .reminder-box {
position: absolute; position: absolute;
float: left; float: left;
@ -170,7 +188,7 @@ export default {
bottom: 15px; bottom: 15px;
width: 500px; width: 500px;
height: 300px; height: 300px;
background-color: #fff; background: transparent;
border-radius: 5px; border-radius: 5px;
overflow: hidden; overflow: hidden;
z-index: 10; z-index: 10;
@ -183,7 +201,7 @@ export default {
display: flex; display: flex;
align-items: center; align-items: center;
flex-direction: row-reverse; flex-direction: row-reverse;
background-color: #409EFF; background-color: rgba(64, 158, 255,0.8);
border-radius: 5px 5px 0 0; border-radius: 5px 5px 0 0;
justify-content: space-between; justify-content: space-between;
padding: 0 10px; padding: 0 10px;