339 lines
14 KiB
Vue
339 lines
14 KiB
Vue
<template>
|
||
<div v-loading="loading" class="joylink-card">
|
||
<div class="card-title">
|
||
<span><b>{{ $t('demonstration.simulationName') + courseModel.name }}</b></span>
|
||
</div>
|
||
<div class="simulation-detail">
|
||
<p class="list-item">
|
||
<span class="list-label">{{ $t('demonstration.productDescription') }}</span>
|
||
<span class="list-elem">{{ courseModel.remarks }}</span>
|
||
</p>
|
||
<p class="list-item">
|
||
<span class="list-label">{{ $t('global.permissionList') }}</span>
|
||
</p>
|
||
<limit-list :ref="`limit`" :course-model="courseModel" @initLoadPage="refresh" />
|
||
</div>
|
||
<div class="btn-buy">
|
||
<el-button v-if="!isLocal" type="success" :disabled="disabled" @click="buy">{{ $t('global.buy') }}</el-button>
|
||
<el-button v-if="hasPermssion && !isComprehensive && !isLocal" type="primary" :disabled="disabled" @click="distribute">{{ $t('global.distributePermission') }}</el-button>
|
||
<el-button v-show="isStartDemon" :disabled="disabled" type="primary" @click="start">{{ $t('demonstration.startSimulation') }}</el-button>
|
||
</div>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
import { getPublishMapInfo } from '@/api/jmap/map';
|
||
import { getGoodsTryUse } from '@/api/management/goods';
|
||
import { PermissionType, UrlConfig } from '@/scripts/ConstDic';
|
||
import { launchFullscreen } from '@/utils/screen';
|
||
import { } from '@/scripts/ConstDic';
|
||
import { simulationNotify, schedulingNotify, createSimulationNew } from '@/api/simulation';
|
||
import LimitList from '@/views/components/limits/index';
|
||
import { getSubSystemDetail } from '@/api/trainingPlatform';
|
||
import { getSessionStorage } from '@/utils/auth';
|
||
import localStore from 'storejs';
|
||
|
||
export default {
|
||
name: 'ExamDetailList',
|
||
components: {
|
||
LimitList
|
||
},
|
||
data() {
|
||
return {
|
||
tryTime: 0,
|
||
goodsId: '',
|
||
tryUser: 0,
|
||
loading: true,
|
||
disabled: false,
|
||
currentLessonId: '',
|
||
currentPrdType: '',
|
||
productList: [],
|
||
courseModel: {
|
||
id: '',
|
||
name: '',
|
||
mapId: '',
|
||
lineCode: '',
|
||
remarks: '',
|
||
prdType: '',
|
||
pmsList: []
|
||
},
|
||
lineCode:'',
|
||
drawWay: false // 是否新版地图
|
||
};
|
||
},
|
||
computed: {
|
||
hasPermssion() {
|
||
let isShow = false;
|
||
if (this.courseModel.pmsList && this.courseModel.pmsList.length) {
|
||
let count = 0;
|
||
this.courseModel.pmsList.forEach(element => {
|
||
count += element.remains;
|
||
});
|
||
if (count > 0) {
|
||
isShow = true;
|
||
}
|
||
}
|
||
return isShow;
|
||
},
|
||
isLocal() { // 是否为本地项目
|
||
return process.env.VUE_APP_PRO === 'local';
|
||
},
|
||
isComprehensive() {
|
||
return this.courseModel.prdType === '03';
|
||
},
|
||
isStartDemon() {
|
||
return this.hasPermssion || this.tryTime > 0;
|
||
},
|
||
mapId() {
|
||
return this.$route.query.mapId;
|
||
}
|
||
},
|
||
watch: {
|
||
'$route': function (val, oldval) {
|
||
this.loadInitData();
|
||
}
|
||
},
|
||
async mounted() {
|
||
this.loadInitData();
|
||
},
|
||
methods: {
|
||
async loadInitData() {
|
||
this.loading = true;
|
||
try {
|
||
let res;
|
||
try {
|
||
res = await getPublishMapInfo(this.mapId);
|
||
} catch (error) {
|
||
if (error.code == 30001) {
|
||
const url = localStore.get('orignalTrainingPlatformRoute' + this.$store.state.user.id);
|
||
localStore.remove();
|
||
if (url) {
|
||
this.$router.push(url);
|
||
}
|
||
}
|
||
}
|
||
const resp = await getSubSystemDetail(this.$route.params.subSystem);
|
||
this.tryUser = 0;
|
||
this.loading = false;
|
||
this.drawWay = res.data.drawWay;
|
||
const remarksList = {'01':'ATS现地工作站原理级仿真系统，实现车站值班员培训功能。', '02':'ATS行调工作站原理级仿真系统，实现行车调度员培训功能。', '03':'各岗位应急综合演练', '04':'桌面版模拟驾驶系统，实现列车驾驶员培训功能。', '05':'派班工作站主要是供车辆段/停车场派班员进行派班操作，可以自动生成派班计划，极大的简化了派班计划管理的复杂性。', '06': '综合监控工作站原理级仿真系统，实现电调、环调及车站值班员培训功能。', '07':'大屏仿真系统，可显示全线全站场实时状况，便于教学及观摩使用。'};
|
||
this.courseModel = {
|
||
id: resp.data.id,
|
||
name: resp.data.name,
|
||
mapId: this.mapId,
|
||
lineCode: res.data.lineCode,
|
||
remarks: remarksList[resp.data.prdType],
|
||
prdType: resp.data.prdType,
|
||
pmsList: resp.data.permissionList || [],
|
||
PermissionType: PermissionType.SIMULATION
|
||
};
|
||
this.currentPrdType = resp.data.prdType;
|
||
if (!this.courseModel.pmsList) {
|
||
this.tryUser = 1;
|
||
const paras = {
|
||
mapId: this.mapId,
|
||
prdType: this.courseModel.prdType,
|
||
permissionType: PermissionType.SIMULATION
|
||
};
|
||
|
||
try {
|
||
const resr = await getGoodsTryUse(paras);
|
||
if (resr.data.tryTime <= 0) {
|
||
this.tryTime = 0;
|
||
} else {
|
||
this.tryTime = resr.data.tryTime;
|
||
this.goodsId = resr.data.goodsId;
|
||
}
|
||
} catch (error) {
|
||
this.tryTime = 0;
|
||
}
|
||
}
|
||
} catch (error) {
|
||
// this.loading = false;
|
||
this.$message.error(this.$t('error.refreshFailed'));
|
||
}
|
||
},
|
||
refresh() {
|
||
this.loadInitData();
|
||
},
|
||
async enterIntegratedSimulation() {
|
||
const data = { mapId: this.courseModel.mapId, prdType: this.currentPrdType };
|
||
createSimulationNew(data).then(resp => {
|
||
const query = { lineCode: this.courseModel.lineCode, group: resp.data, mapId: this.courseModel.mapId, drawWay: true };
|
||
this.$router.push({ path: `/jointTrainingNew`, query: query });
|
||
launchFullscreen();
|
||
}).catch(error => {
|
||
this.$messageBox(this.$t('error.createSimulationFailed') + error.message);
|
||
this.disabled = false;
|
||
});
|
||
},
|
||
async enterISCS() {
|
||
try {
|
||
this.disabled = true;
|
||
const data = { mapId: this.courseModel.mapId, prdType: this.currentPrdType };
|
||
let res = {};
|
||
if (!this.drawWay) {
|
||
res = await simulationNotify(data);
|
||
} else {
|
||
res = await createSimulationNew(data);
|
||
}
|
||
if (res && res.code == 200) {
|
||
const query = { group: res.data };
|
||
this.$router.push({ path: `/displayIscs/system`, query: query });
|
||
}
|
||
} catch (error) {
|
||
this.disabled = false;
|
||
}
|
||
},
|
||
async enterScreen() {
|
||
const data = { mapId: this.courseModel.mapId, prdType: this.currentPrdType };
|
||
createSimulationNew(data).then(resp => {
|
||
const query = { lineCode: this.courseModel.lineCode, group: resp.data, prdType: this.courseModel.prdType, mapId: this.courseModel.mapId, goodsId: this.goodsId, try: this.tryUser };
|
||
this.$router.push({ path: `/displayBigScreen/${this.courseModel.mapId}`, query: query });
|
||
}).catch(error => {
|
||
this.$messageBox(this.$t('error.createSimulationFailed') + error.message);
|
||
this.disabled = false;
|
||
});
|
||
},
|
||
async start() {
|
||
if (this.courseModel.prdType == '05') {
|
||
this.jumpScheduling();
|
||
} else if (this.courseModel.prdType == '03') {
|
||
this.enterIntegratedSimulation();
|
||
} else if (this.courseModel.prdType == '06') {
|
||
this.enterISCS();
|
||
} else if (this.courseModel.prdType == '07') {
|
||
this.enterScreen();
|
||
} else {
|
||
if (this.courseModel.pmsList && this.courseModel.pmsList.length) {
|
||
this.jump();
|
||
} else {
|
||
if (this.tryTime <= 1) {
|
||
this.$confirm(this.$t('tip.noPermissionHint'), this.$t('global.tips'), {
|
||
confirmButtonText: this.$t('global.confirm'),
|
||
cancelButtonText: this.$t('global.cancel'),
|
||
type: 'warning'
|
||
}).then(() => {
|
||
this.buy();
|
||
}).catch(() => { });
|
||
} else {
|
||
this.jump();
|
||
}
|
||
}
|
||
}
|
||
},
|
||
jumpScheduling() {
|
||
this.disabled = true;
|
||
setTimeout(() => {
|
||
const data = { mapId: this.courseModel.mapId, prdType: this.currentPrdType };
|
||
try {
|
||
if (this.drawWay) {
|
||
createSimulationNew(data).then(resp => {
|
||
const query = { lineCode: this.courseModel.lineCode, group: resp.data, prdType: this.courseModel.prdType, mapId: this.courseModel.mapId, goodsId: this.goodsId, try: this.tryUser };
|
||
this.$router.push({ path: `${UrlConfig.displayNew}/demon`, query: query });
|
||
launchFullscreen();
|
||
});
|
||
} else {
|
||
schedulingNotify(data).then(resp => {
|
||
const query = { lineCode: this.courseModel.lineCode, group: resp.data, prdType: this.courseModel.prdType, mapId: this.courseModel.mapId, goodsId: this.goodsId, try: this.tryUser };
|
||
this.$router.push({ path: `${UrlConfig.display}/demon`, query: query });
|
||
launchFullscreen();
|
||
});
|
||
}
|
||
} catch (e) {
|
||
this.$messageBox(this.$t('error.createSimulationFailed') + e.message);
|
||
this.disabled = false;
|
||
}
|
||
}, 100);
|
||
},
|
||
jump() {
|
||
this.disabled = true;
|
||
setTimeout(() => {
|
||
if (!this.drawWay) {
|
||
const data = { mapId: this.courseModel.mapId, prdType: this.currentPrdType };
|
||
simulationNotify(data).then(resp => {
|
||
const query = { lineCode: this.courseModel.lineCode, group: resp.data, prdType: this.courseModel.prdType, mapId: this.courseModel.mapId, goodsId: this.goodsId, try: this.tryUser, project: getSessionStorage('project') };
|
||
this.$router.push({ path: `${UrlConfig.display}/demon`, query: query });
|
||
launchFullscreen();
|
||
}).catch(error => {
|
||
this.$messageBox(this.$t('error.createSimulationFailed') + error.message);
|
||
this.disabled = false;
|
||
});
|
||
} else {
|
||
const data = { mapId: this.courseModel.mapId, prdType: this.currentPrdType };
|
||
createSimulationNew(data).then(resp => {
|
||
const query = { lineCode: this.courseModel.lineCode, group: resp.data, prdType: this.courseModel.prdType, mapId: this.courseModel.mapId, goodsId: this.goodsId, try: this.tryUser, project: getSessionStorage('project') };
|
||
this.$router.push({ path: `${UrlConfig.displayNew}/demon`, query: query });
|
||
launchFullscreen();
|
||
}).catch(error => {
|
||
this.$messageBox(this.$t('error.createSimulationFailed') + error.message);
|
||
this.disabled = false;
|
||
});
|
||
}
|
||
}, 100);
|
||
},
|
||
buy() {
|
||
// this.disabled = true;
|
||
// setTimeout(() => {
|
||
// this.$router.push({
|
||
// path: `${UrlConfig.trainingPlatform.pay}/${this.courseModel.id}`,
|
||
// query: { permissionType: PermissionType.SIMULATION, prdType: this.courseModel.prdType, mapId: this.courseModel.mapId, subSystem: this.$route.params.subSystem }
|
||
// });
|
||
// }, 100);
|
||
this.$messageBox(this.$t('global.buyingTips'));
|
||
},
|
||
distribute() {
|
||
this.disabled = true;
|
||
if (this.$refs) {
|
||
this.$refs[`limit`].distribute(this.courseModel);
|
||
}
|
||
this.disabled = false;
|
||
}
|
||
}
|
||
};
|
||
</script>
|
||
|
||
<style rel="stylesheet/scss" lang="scss" scoped>
|
||
.joylink-card{
|
||
height: 100%;
|
||
overflow: hidden;
|
||
.card-title{
|
||
height: 47px;
|
||
line-height: 47px;
|
||
text-align: center;
|
||
border-bottom: 1px solid #d6d6d6;
|
||
}
|
||
}
|
||
.simulation-detail {
|
||
padding: 50px;
|
||
padding-bottom: 0;
|
||
height: calc(100% - 107px);
|
||
overflow: auto;
|
||
}
|
||
|
||
.list-item {
|
||
font-size: 14px;
|
||
margin-bottom: 20px;
|
||
padding: 0px;
|
||
}
|
||
|
||
.list-label {
|
||
display: -moz-inline-box;
|
||
display: inline-block;
|
||
text-align: left;
|
||
}
|
||
|
||
.list-elem {
|
||
color: #808080 !important;
|
||
}
|
||
|
||
.btn-buy {
|
||
text-align: center;
|
||
padding: 10px 0;
|
||
}
|
||
|
||
.el-tabs--border-card>.el-tabs__header .el-tabs__item {
|
||
font-weight: bold !important;
|
||
}
|
||
</style>
|