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

Merge branch 'test' of https://git.code.tencent.com/lian-cbtc/jl-client into test

Browse Source
This commit is contained in:
fan 2021-03-18 11:21:17 +08:00
commit 700928ed22
4 changed files with 241 additions and 114 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

228
src/views/demo/index.vue
View File

@ -1,9 +1,32 @@
<template> <template>
<div> <div v-loading="loading" class="demoContainer">
<div v-for="(el, i) in trainingList" :key="i" > <div class="demoPage">
<el-button @click="doClick(el)">{{el.title}}</el-button> <div class="demoTop">
</div> <div class="demoTopTitle">教学系统</div>
<iframe class="dialog" :style="{display:show?'block': 'none'}" :src="src" width="100%" height="100%"/> </div>
<div class="demoBottom">
<div class="demoBottomL">
<div class="demoMenuList">
<div class="eachDemoMenu">教学计划</div>
<div class="eachDemoMenu">公告</div>
<div class="eachDemoMenu">评分标准</div>
<div class="eachDemoMenu active">课件</div>
<div class="eachDemoMenu">讨论区</div>
</div>
</div>
<div class="demoBottomC">
<div class="demoBottomCT">课件 > 现地工作站视频 > 教学视频</div>
<div class="video_container" />
</div>
<div class="demoBottomR">
<div class="demoBottomRT">实训列表</div>
<div v-for="(el, i) in trainingList" :key="i" class="traingList">
<div class="eachTraining" @click="doClick(el)">{{ el.title }}</div>
</div>
</div>
</div>
</div>
<iframe class="dialog" :style="{display:show?'block': 'none'}" :src="src" width="100%" height="100%" />
</div> </div>
</template> </template>
@ -13,54 +36,65 @@ import { getToken } from '@/utils/auth';
export default { export default {
data() { data() {
return { return {
src: '', // src: `http://localhost:9527/cbtc/trainingPlatform`,
show: false, src:'',
trainingList: [ // demoTraining/teach?lessonId=101&mapId=49&lineCode=02&prdType=01&noPreLogout=true&trainingId=4994993&token=${getToken()}
{ show: false,
title: '全站取消联锁自动触发', loading:false,
id: '4994993' trainingList: [
}, {
{ title: '区段设置限速(TA1006E)',
title: '2222', id: '4994993'
id: 1 },
}, {
{ title: '道岔封锁(W0103)',
title: '33333', id: '4993549'
id: 1 },
} {
] title: '进路选排(S0916-S0901)',
id: '4991607'
}
]
}; };
}, },
mounted() { mounted() {
window.addEventListener('message', (e) => { window.addEventListener('message', (e) => {
// console.log(e, e.data) //e.data为传递过来的数据 const result = e.data;
// console.log(e.origin) //e.origin为调用 postMessage 时消息发送方窗口的 origin（域名、协议和端口） if (result.type == 'DEMO_MAP_LOADED') {
// console.log(e.source) //e.source为对发送消息的窗口对象的引用，可以使用此来在具有不同origin的两个窗口之间建立双向通信 this.loading = false;
this.src = ''; } else {
this.show = false; this.show = false;
this.$nextTick(_ => { this.src = 'http://localhost:9527/cbtc/trainingPlatform';
const result = e.data; this.$nextTick(_ => {
if (result.type == 'DEMO_RESULT' && result.hasOwnProperty('score')) { if (result.type == 'DEMO_RESULT' && result.hasOwnProperty('score')) {
this.$confirm(`得分：${result.score}分`, "结果", { this.$confirm(`得分：${result.score}分`, '结果', {
confirmButtonText: "确定", confirmButtonText: '确定',
type:'warning', type:'warning',
showCancelButton: false, showCancelButton: false,
center: true center: true
}).then(_ => { }).then(_ => {
}).catch(_ => { }).catch(_ => {
}); });
} }
}) });
}) }
}, // console.log(e, e.data) //e.data为传递过来的数据
destroyed() { // console.log(e.origin) //e.origin为调用 postMessage 时消息发送方窗口的 origin（域名、协议和端口）
window.removeEventListener('message'); // console.log(e.source) //e.source为对发送消息的窗口对象的引用，可以使用此来在具有不同origin的两个窗口之间建立双向通信
}, });
},
destroyed() {
window.removeEventListener('message');
},
methods: { methods: {
doClick(el) { doClick(el) {
this.show = true; // &noPreLogout=true
this.src = `http://localhost:9527/cbtc/demoTraining/teach?lessonId=101&mapId=49&lineCode=02&prdType=01&noPreLogout=true&trainingId=${el.id}&token=${getToken()}`; this.src = `http://localhost:9527/cbtc/demoTraining/teach?lessonId=101&mapId=49&lineCode=02&prdType=01&trainingId=${el.id}&token=${getToken()}`;
} this.loading = true;
setTimeout(()=>{
this.show = true;
}, 300);
}
} }
}; };
@ -73,5 +107,99 @@ export default {
right: 0; right: 0;
left: 0; left: 0;
bottom: 0; bottom: 0;
border: none;
width:100%;
height:100%;
} }
.demoContainer{
width:100%;
height: 100%;
}
.eachTraining{
cursor: pointer;
&:hover{
text-decoration: underline;
}
margin-top:10px;
margin-left: 8px;
font-size: 15px;
}
.traingList{
}
.demoPage{
width: 100%;
height: 100%;
}
.demoTop{
position:absolute;
width: 100%;
height: 60px;
left:0;
top:0;
border-bottom: 1px #ccc solid;
}
.demoBottom{
padding-top: 60px;
width: 100%;
height: 100%;
display: flex;
flex-direction: row;
}
.demoBottomL{
width: 200px;
border-right: 1px #ccc solid;
padding: 30px 10px;
background: #f2f2f2;
}
.demoBottomC{
flex: 1;
padding: 20px;
}
.demoBottomRT{
font-size:16px;
}
.demoBottomR{
width: 300px;
border-left: 1px #ccc solid;
padding: 15px;
}
.demoBottomCT{
font-size: 15px;
}
.video_container{
width: 600px;
height: 400px;
border: 1px #ccc solid;
margin-top: 80px;
margin-left: 50%;
transform: translateX(-50%);
}
.demoMenuList{
background:#fff;
box-shadow: 1px 3px 5px #dedede;
}
.eachDemoMenu{
padding-left: 20px;
font-size: 15px;
padding-top: 10px;
cursor: pointer;
padding-bottom: 10px;
border-bottom: 1px #f5f5f5 solid;
color:#000;
&.active{
background:#64a3f5;
color:#fff;
}
}
.demoTopTitle{
font-size: 22px;
font-weight: bold;
padding: 15px 10px 15px 30px
}
</style>
<style lang="scss">
.demoContainer .el-loading-mask{
background-color:rgba(255,255,255,1);
}
</style> </style>

93
src/views/newMap/displayNew/demoTraining/index.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="demo" v-loading="loading"> <div class="demo">
<lesson-training v-if="hasGroup"/> <lesson-training v-if="hasGroup" />
</div> </div>
</template> </template>
<script> <script>
@ -10,58 +10,57 @@ import { trainingNotifyNew } from '@/api/simulation';
import { EventBus } from '@/scripts/event-bus'; import { EventBus } from '@/scripts/event-bus';
export default { export default {
components: { components: {
LessonTraining LessonTraining
}, },
data() { data() {
return { return {
loading: false, loading: false,
result: { result: {
} }
}; };
}, },
computed: { computed: {
hasGroup() { hasGroup() {
return this.$route.query.group; return this.$route.query.group;
}, }
}, },
watch: { watch: {
'$route': function() { '$route': function() {
this.loading = false; },
} '$store.state.map.mapViewLoadedCount': function (val) {
}, window.parent.postMessage(Object.assign({}, {type: 'DEMO_MAP_LOADED'}), 'http://localhost:9527/cbtc/demo');
}
},
async mounted() { async mounted() {
await this.createSimulation(); await this.createSimulation();
}, },
methods: { methods: {
async createSimulation() { async createSimulation() {
const lineCode = this.$route.query.lineCode; const lineCode = this.$route.query.lineCode;
const mapId = this.$route.query.mapId; const mapId = this.$route.query.mapId;
const prdType = this.$route.query.prdType; const prdType = this.$route.query.prdType;
const trainingId = this.$route.query.trainingId; const trainingId = this.$route.query.trainingId;
const lessonId = this.$route.query.lessonId; const lessonId = this.$route.query.lessonId;
const mode = this.$route.params.mode; const mode = this.$route.params.mode;
const goodsId = ''; const goodsId = '';
this.loading = true; const resp = await trainingNotifyNew({trainingId});
const resp = await trainingNotifyNew({trainingId}); if (resp && resp.code == 200) {
if (resp && resp.code == 200) { const query = { lineCode, group: resp.data, prdType, mapId, lessonId, trainingId, goodsId, from: 'kzfmooc', project: 'login', try: '0'};
const query = { lineCode, group: resp.data, prdType, mapId, lessonId, trainingId, goodsId, from: 'kzfmooc', project: 'login', try: '0'}; this.$store.dispatch('training/setPrdType', prdType);
this.$store.dispatch('training/setPrdType', prdType); this.$router.replace({ path: `/demoTraining/${mode}`, query: query });
this.$router.replace({ path: `/demoTraining/${mode}`, query: query }); EventBus.$on('demoResult', e => this.exitSimulation(e) );
EventBus.$on('demoResult', e => this.exitSimulation(e) ); } else if (resp.code == 10003) {
} else if (resp.code == 10003) { this.$messageBox(this.$t('error.createSimulationFailed') + '：您的仿真权限不足！');
this.loading = false; } else {
this.$messageBox(this.$t('error.createSimulationFailed') + '：您的仿真权限不足！'); this.$messageBox(this.$t('error.createSimulationFailed') + resp.error.message);
} else { }
this.loading = false; },
this.$messageBox(this.$t('error.createSimulationFailed') + error.message); exitSimulation(result = {}) {
}; window.parent.postMessage(Object.assign(result, {type: 'DEMO_RESULT'}), 'http://localhost:9527/cbtc/demo');
}, }
exitSimulation(result={}) { }
window.parent.postMessage(Object.assign(result, {type: 'DEMO_RESULT'}), 'http://localhost:9527/cbtc/demo')
}
}
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>

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

@ -4,11 +4,11 @@
<transition name="el-zoom-in-bottom"> <transition name="el-zoom-in-bottom">
<map-system-draft ref="mapCanvas" @back="back" /> <map-system-draft ref="mapCanvas" @back="back" />
</transition> </transition>
<menu-demon v-if="isDemon" ref="menuDemon" :offset="offset" :offset-bottom="offsetBottom" :data-error="dataError" :text-status-height="textStatusHeight" @start="start" @end="end"/> <menu-demon v-if="isDemon" ref="menuDemon" :offset="offset" :offset-bottom="offsetBottom" :data-error="dataError" :text-status-height="textStatusHeight" @start="start" @end="end" />
<menu-lesson v-if="isLesson" ref="lessonMenu" :offset="offset" :data-error="dataError" :offset-bottom="offsetBottom" :tip-bottom="tipBottom"/> <menu-lesson v-if="isLesson" ref="lessonMenu" :offset="offset" :data-error="dataError" :offset-bottom="offsetBottom" :tip-bottom="tipBottom" />
<menu-exam v-if="isExam" ref="menuExam" :offset="offset" :data-error="dataError" :offset-bottom="offsetBottom"/> <menu-exam v-if="isExam" ref="menuExam" :offset="offset" :data-error="dataError" :offset-bottom="offsetBottom" />
<menu-script v-if="isScript" ref="menuScript" :offset-bottom="offsetBottom" :offset="offset" :text-status-height="textStatusHeight" :data-error="dataError" @start="start" @end="end"/> <menu-script v-if="isScript" ref="menuScript" :offset-bottom="offsetBottom" :offset="offset" :text-status-height="textStatusHeight" :data-error="dataError" @start="start" @end="end" />
<menu-dispather-contest v-if="isContest" ref="menuDispatherContest" :offset="offset" :offset-bottom="offsetBottom" :data-error="dataError" :text-status-height="textStatusHeight" @start="start" @end="end"/> <menu-dispather-contest v-if="isContest" ref="menuDispatherContest" :offset="offset" :offset-bottom="offsetBottom" :data-error="dataError" :text-status-height="textStatusHeight" @start="start" @end="end" />
</template> </template>
<menu-train-list v-if="isDemon||isContest||isScript" /> <menu-train-list v-if="isDemon||isContest||isScript" />
<menu-system-time ref="menuSystemTime" :offset="offset" :group="group" /> <menu-system-time ref="menuSystemTime" :offset="offset" :group="group" />
@ -98,8 +98,8 @@ export default {
} }
}); });
}, },
// 此处代码似乎没什么用，之前从menuSchema复制过来的 // 此处代码似乎没什么用，之前从menuSchema复制过来的
'$store.state.training.prdType':function(val) { '$store.state.training.prdType':function(val) {
if (val == '01') { this.switchModeInner('01'); } else { this.switchModeInner('02'); } if (val == '01') { this.switchModeInner('01'); } else { this.switchModeInner('02'); }
}, },
'$store.state.config.menuBarLoadedCount': function (val) { // menuBar加载完成 '$store.state.config.menuBarLoadedCount': function (val) { // menuBar加载完成
@ -217,8 +217,8 @@ export default {
this.dataError = resp.data.dataError; this.dataError = resp.data.dataError;
} }
}, },
// 通过showMode切换显示效果 // 通过showMode切换显示效果
switchModeInner(swch) { switchModeInner(swch) {
let showMode = '03'; let showMode = '03';
if (swch == '01') { if (swch == '01') {
showMode = '03'; showMode = '03';
@ -238,7 +238,7 @@ export default {
}); });
if (swch == '01') { if (swch == '01') {
this.$jlmap.updateShowStation(list, this.$store.state.training.centerStationCode); // 显示全部元素 this.$jlmap.updateShowStation(list, this.$store.state.training.centerStationCode); // 显示全部元素
} else { } else {
this.$jlmap.updateShowStation(list, ''); // 显示全部元素 this.$jlmap.updateShowStation(list, ''); // 显示全部元素
} }

14
src/views/newMap/jlmapNew/index.vue
View File

@ -176,12 +176,12 @@ export default {
if (deviceModel.centralized) { if (deviceModel.centralized) {
stationModel = deviceModel; stationModel = deviceModel;
} else { } else {
this.$store.state.map.map.stationList.forEach(it => { this.$store.state.map.map.stationList.forEach(it => {
(it.chargeStationCodeList||[]).forEach(code => { (it.chargeStationCodeList || []).forEach(code => {
if (code === deviceModel.code) { if (code === deviceModel.code) {
stationModel = it; stationModel = it;
} }
}); });
}); });
} }
@ -237,7 +237,7 @@ export default {
this.previewOrMapDraw = true; this.previewOrMapDraw = true;
} }
const prdType = this.$store.state.training.prdType; const prdType = this.$store.state.training.prdType;
const showMode = { '01': '03', '02': '02'}[prdType]||''; const showMode = { '01': '03', '02': '02'}[prdType] || '';
Vue.prototype.$theme = new Theme(); Vue.prototype.$theme = new Theme();
Vue.prototype.$jlmap = new Jlmap({ Vue.prototype.$jlmap = new Jlmap({