实训调整
This commit is contained in:
fan
parent
4904e30450
commit
e42537a8e4
@ -3,10 +3,14 @@
|
||||
<div v-quickMenuDrag class="reminder-drag" :style="{bottom: offsetBottom + 'px'}">
|
||||
<div ref="drapBox" class="reminder-box">
|
||||
<div class="tip-title">
|
||||
<div>
|
||||
<i v-show="isShrink" class="icon el-icon-minus" @click="shrink" />
|
||||
<i v-show="!isShrink" class="icon el-icon-plus" @click="shrink" />
|
||||
<p v-if="isShrink" style="color: #fff;">
|
||||
<span>{{ lessonName }}</span>
|
||||
<i v-show="!isShrink && !trainingSwitch && trainingDetail" class="icon el-icon-video-play" @click="handlerStart" />
|
||||
<i v-show="!isShrink && trainingSwitch" class="icon el-icon-switch-button" @click="handlerEnd" />
|
||||
</div>
|
||||
<p style="color: #fff;">
|
||||
<span>{{ courseModel.name }}</span>
|
||||
</p>
|
||||
</div>
|
||||
<div v-if="isShrink" class="reminder-box-content">
|
||||
@ -18,17 +22,30 @@
|
||||
<span class="list-label">{{ $t('display.training.trainingName') }}</span>
|
||||
<span class="list-elem">{{ courseModel.name }}</span>
|
||||
</p>
|
||||
<p class="list-item">
|
||||
<span class="list-label">{{ $t('display.training.bestTime') }}</span>
|
||||
<span class="list-elem">{{ courseModel.minDuration }} {{ $t('display.seconds') }} </span>
|
||||
<p v-if="demoMode === TrainingMode.TEST" class="list-item">
|
||||
<span class="list-label">{{ $t('display.lesson.score') }}</span>
|
||||
<span class="list-elem">{{ trainingScore }}</span>
|
||||
</p>
|
||||
<p class="list-item">
|
||||
<span class="list-label">{{ $t('display.training.maximumTime') }}</span>
|
||||
<span class="list-elem">{{ courseModel.maxDuration }} {{ $t('display.seconds') }} </span>
|
||||
<span class="list-label">实训模式：</span>
|
||||
<span class="list-elem">
|
||||
<el-radio-group v-model="demoMode" :disabled="trainingSwitch" class="mode" size="small" @change="changeMode">
|
||||
<el-radio :label="TrainingMode.TEACH" border>{{ $t('display.lesson.teachingMode') }}</el-radio>
|
||||
<el-radio :label="TrainingMode.PRACTICE" border>{{ $t('display.lesson.practiceMode') }}</el-radio>
|
||||
<el-radio :label="TrainingMode.TEST" border>{{ $t('display.lesson.testMode') }}</el-radio>
|
||||
</el-radio-group>
|
||||
</span>
|
||||
</p>
|
||||
<p class="list-item">
|
||||
<span class="list-label" style="vertical-align: top;"> {{ $t('display.training.trainingInstructions') }}</span>
|
||||
<span class="list-elem elem-span">{{ courseModel.remarks }}</span>
|
||||
<span class="list-elem elem-span">{{ courseModel.description }}</span>
|
||||
</p>
|
||||
<p class="list-item">
|
||||
<span class="list-label">操作按钮：</span>
|
||||
<span class="list-elem">
|
||||
<el-button v-if="!trainingSwitch && trainingDetail" size="small" type="success" @click="handlerStart">开始</el-button>
|
||||
<el-button v-if="trainingSwitch" size="small" type="danger" @click="handlerEnd">结束</el-button>
|
||||
</span>
|
||||
</p>
|
||||
</el-scrollbar>
|
||||
</div>
|
||||
@ -43,12 +60,14 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { mapGetters } from 'vuex';
|
||||
import { getPublishLessonDetail } from '@/api/jmap/lesson';
|
||||
import { launchFullscreen } from '@/utils/screen';
|
||||
import { ScriptMode } from '@/scripts/ConstDic';
|
||||
import { clearSimulation } from '@/api/simulation';
|
||||
import { startTraining, endTraining } from '@/api/jmap/training';
|
||||
|
||||
export default {
|
||||
name: 'TipTrainingDetail',
|
||||
components: {
|
||||
},
|
||||
props: {
|
||||
offsetBottom: {
|
||||
type: Number,
|
||||
@ -57,29 +76,30 @@ export default {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
training: {
|
||||
id: '',
|
||||
name: '',
|
||||
remarks: ''
|
||||
},
|
||||
isShrink: true,
|
||||
lessonName: '',
|
||||
courseModel: {
|
||||
id: '',
|
||||
name: '',
|
||||
maxDuration: '',
|
||||
minDuration: '',
|
||||
remarks: '',
|
||||
updateTime: ''
|
||||
description: ''
|
||||
},
|
||||
showSumbit: false,
|
||||
lessonIndex: 0
|
||||
demoMode: ScriptMode.TEACH,
|
||||
TrainingMode: ScriptMode
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters('trainingList', [
|
||||
'trainingList'
|
||||
])
|
||||
trainingSwitch() {
|
||||
return this.$store.state.trainingNew.trainingSwitch;
|
||||
},
|
||||
trainingScore() {
|
||||
return this.$store.state.trainingNew.trainingScore;
|
||||
},
|
||||
trainingDetail() {
|
||||
return this.$store.state.trainingNew.trainingDetail;
|
||||
},
|
||||
group() {
|
||||
return this.$route.query.group;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.trainingNew.trainingDetail': function (val) {
|
||||
@ -93,37 +113,16 @@ export default {
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
this.loadInitData(this.$route.query);
|
||||
this.loadInitData();
|
||||
},
|
||||
methods: {
|
||||
loadInitData(obj) {
|
||||
loadInitData() {
|
||||
this.showSumbit = false;
|
||||
this.lessonName = '';
|
||||
this.courseModel = {
|
||||
id: '',
|
||||
name: '',
|
||||
maxDuration: '',
|
||||
minDuration: '',
|
||||
remarks: '',
|
||||
updateTime: ''
|
||||
description: ''
|
||||
};
|
||||
|
||||
if (parseInt(obj.lessonId)) {
|
||||
getPublishLessonDetail({ id: obj.lessonId }).then(response => {
|
||||
this.lessonName = response.data.name;
|
||||
}).catch(error => {
|
||||
this.$message.error(this.$t('display.training.getCourseInformationFail') + ':' + error.message);
|
||||
});
|
||||
}
|
||||
},
|
||||
jump(obj) {
|
||||
const query = {
|
||||
group: this.$route.query.group,
|
||||
trainingId: this.$route.query.trainingId,
|
||||
lessonId: this.$route.query.lessonId
|
||||
};
|
||||
this.$router.push({ path: `/display/${this.$route.params.mode}`, query: query });
|
||||
launchFullscreen();
|
||||
},
|
||||
shrink() {
|
||||
// const height = this.$refs.dragBody.offsetHeight + 40;
|
||||
@ -144,6 +143,33 @@ export default {
|
||||
// this.$refs.drapBox.style.height = height + 'px';
|
||||
// this.$refs.drapBox.style.top = top;
|
||||
}
|
||||
},
|
||||
changeMode(val) {
|
||||
this.demoMode = val;
|
||||
this.$store.dispatch('trainingNew/changeTeachMode', this.demoMode);
|
||||
},
|
||||
handlerStart() {
|
||||
startTraining(this.group, {mode: this.teachMode}).then(() => {
|
||||
this.$store.dispatch('trainingNew/trainingStart');
|
||||
this.$store.dispatch('trainingNew/setTrainingScore', '');
|
||||
}).catch(() => {
|
||||
this.$message.error('开始实训失败！');
|
||||
});
|
||||
},
|
||||
handlerEnd() {
|
||||
endTraining(this.group).then((resp) => {
|
||||
this.$store.dispatch('trainingNew/trainingEnd');
|
||||
this.$store.dispatch('socket/clearTrainingStepTip');
|
||||
this.$store.dispatch('trainingNew/clearStepOrder');
|
||||
this.$store.dispatch('trainingNew/setTrainingScore', resp.data);
|
||||
}).catch(() => {
|
||||
this.$message.error('结束实训失败！');
|
||||
});
|
||||
},
|
||||
back() {
|
||||
if (this.group) {
|
||||
clearSimulation(this.group);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
@ -4,6 +4,7 @@
|
||||
<training-jlmap refs="trainingJlmap" />
|
||||
<training-tip ref="trainingTip" />
|
||||
<training-position-tip ref="trainingPositionTip" />
|
||||
<!-- <training-menu ref="trainingMenu" :offset-bottom="offsetBottom" />-->
|
||||
<div class="trainBack">
|
||||
<el-button-group>
|
||||
<el-button v-if="!trainingSwitch && trainingDetail" type="success" @click="handlerStart">开始</el-button>
|
||||
@ -20,13 +21,15 @@ import MenuDemon from './demonMenu.vue';
|
||||
import TrainingTip from './trainingTip';
|
||||
import TrainingPositionTip from './trainingPositionTip';
|
||||
import TrainingJlmap from './trainingJlmap';
|
||||
import TrainingMenu from './trainingMenu';
|
||||
export default {
|
||||
name: 'TrainingDesign',
|
||||
components: {
|
||||
MenuDemon,
|
||||
TrainingTip,
|
||||
TrainingJlmap,
|
||||
TrainingPositionTip
|
||||
TrainingPositionTip,
|
||||
TrainingMenu
|
||||
},
|
||||
props: {
|
||||
widthLeft: {
|
||||
@ -40,7 +43,8 @@ export default {
|
||||
trainingObj: null,
|
||||
starting: false,
|
||||
selected: null,
|
||||
menus: null
|
||||
menus: null,
|
||||
offsetBottom: 50
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user