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

Merge remote-tracking branch 'origin/test_dispaly' into test

Browse Source 
# Conflicts:
#	src/views/newMap/displayNew/demonMenu.vue
#	src/views/newMap/displayNew/dispatherContest/index.vue
#	src/views/newMap/displayNew/index.vue
#	src/views/newMap/displayNew/menuSchema.vue
#	src/views/newMap/jointTrainingNew/index.vue
This commit is contained in:
fan 2023-01-13 13:10:52 +08:00
commit 3054160b14
82 changed files with 36 additions and 21604 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
src/jmapNew/theme/datie_02/menus/menuButtonCtc.vue
View File

@ -129,7 +129,7 @@ import { mapGetters } from 'vuex';
import NoticeInfo from '@/jmapNew/theme/components/menus/childDialog/noticeInfo'; import NoticeInfo from '@/jmapNew/theme/components/menus/childDialog/noticeInfo';
import { MouseEvent, DeviceMenu } from '@/scripts/ConstDic'; import { MouseEvent, DeviceMenu } from '@/scripts/ConstDic';
import { EventBus } from '@/scripts/event-bus'; import { EventBus } from '@/scripts/event-bus';
import {UserOperationType} from "../../../../scripts/ConstDic"; import {UserOperationType} from '../../../../scripts/ConstDic';
export default { export default {
name: 'MapButtonMenu', name: 'MapButtonMenu',
@ -502,7 +502,8 @@ export default {
} }
} }
} else { } else {
const signal = this.$store.dispatch('map/getDeviceByCode')[model.signalCode || model.code]; // const signal = this.$store.dispatch('map/getDeviceByCode')[model.signalCode || model.code];
const signal = this.$store.getters['map/getDeviceByCode'](model.signalCode || model.code);
if (signal.routeLock) { return; } if (signal.routeLock) { return; }
} }
this.$store.dispatch('trainingNew/next', operate).then(({valid}) => { this.$store.dispatch('trainingNew/next', operate).then(({valid}) => {

9
src/jmapNew/theme/datie_02/menus/menuDialog/trainFixedPathPane.vue
View File

@ -193,12 +193,12 @@ export default {
stationCode: stationCode stationCode: stationCode
} }
}; };
this.$store.dispatch('trainingNew/next', operate).then(({valid, resp}) => { this.$store.dispatch('trainingNew/next', operate).then(({valid, response}) => {
if (valid) { if (valid) {
this.stationCode = stationCode; this.stationCode = stationCode;
this.trainFixedPathList = resp.data.data; this.trainFixedPathList = response.data.data;
this.dialogShow = true; this.dialogShow = true;
this.title = title + ' 版本:' + resp.data.version; this.title = title + ' 版本:' + response.data.version;
this.$nextTick(() => { this.$store.dispatch('training/emitTipFresh'); }); this.$nextTick(() => { this.$store.dispatch('training/emitTipFresh'); });
} }
}).catch(e => { }).catch(e => {
@ -246,7 +246,7 @@ export default {
}; };
this.$store.dispatch('trainingNew/next', operate).then(({valid}) => { this.$store.dispatch('trainingNew/next', operate).then(({valid}) => {
if (valid) { if (valid) {
sendCommandNew(this.$route.query.group, menuOperate.CTC.getStationTrainFixedPath.cmdType, { stationCode: this.stationCode }).then(resp => { sendCommandNew(this.$route.query.group, menuOperate.CTC.getStationTrainFixedPath.cmdType.value, { stationCode: this.stationCode }).then(resp => {
const title = '固定径路信息'; const title = '固定径路信息';
this.trainFixedPathList = resp.data.data; this.trainFixedPathList = resp.data.data;
this.title = title + ' 版本 :' + resp.data.version; this.title = title + ' 版本 :' + resp.data.version;
@ -260,7 +260,6 @@ export default {
}, },
cancel() { cancel() {
const operate = { const operate = {
over: true,
userOperationType: UserOperationType.LEFTCLICK, userOperationType: UserOperationType.LEFTCLICK,
operation: OperationEvent.Command.cancel.menu.operation operation: OperationEvent.Command.cancel.menu.operation
}; };

62
src/router/index.js
View File

@ -48,17 +48,10 @@ const Display = () => import('@/views/newMap/display/index');
// const TrainingPreview = () => import('@/views/designPlatform/trainingPreview'); // const TrainingPreview = () => import('@/views/designPlatform/trainingPreview');
const TrainingDesign = () => import('@/views/organization/trainingDesign/index'); const TrainingDesign = () => import('@/views/organization/trainingDesign/index');
const TrainingManage = () => import('@/views/organization/trainingManage/index'); const TrainingManage = () => import('@/views/organization/trainingManage/index');
const TestRunplan = () => import('@/views/designPlatform/testRunplan');
const PracticeDisplay = () => import('@/views/newMap/displayNew/practiceDisplay');
const BigLPFStrategy = () => import('@/views/newMap/displayNew/bigLPFStrategy');
const RunPlanViewWindow = () => import('@/views/newMap/displayNew/demon/runPlanViewWindow');
const PlanScheduleWicket = () => import('@/views/newMap/displayNew/demon/planSchedule');
// const DemoTraining = () => import('@/views/newMap/displayNew/demoTraining'); // const DemoTraining = () => import('@/views/newMap/displayNew/demoTraining');
const BigTrainRunplanManage = () => import('@/views/bigTrainRunplanManage/index'); const BigTrainRunplanManage = () => import('@/views/bigTrainRunplanManage/index');
const jointTrainingNewCCTV = () => import('@/views/newMap/jointTrainingNew/realCCTV');
const Errpr404 = () => import('@/views/error-page/404'); const Errpr404 = () => import('@/views/error-page/404');
@ -163,8 +156,6 @@ const UserRulesDetail = () => import('@/views/orderauthor/rules/detail');
const DeviceManage = () => import('@/views/system/deviceManage/index'); const DeviceManage = () => import('@/views/system/deviceManage/index');
const BankManage = () => import('@/views/competitionManage/bankList/index'); const BankManage = () => import('@/views/competitionManage/bankList/index');
const Scene = () => import('@/views/drts/scene/index');
const QuestionCreatePage = () => import('@/views/competitionManage/bankList/question-create-page'); const QuestionCreatePage = () => import('@/views/competitionManage/bankList/question-create-page');
const QuestionUpdatePage = () => import('@/views/competitionManage/bankList/question-update-page'); const QuestionUpdatePage = () => import('@/views/competitionManage/bankList/question-update-page');
@ -199,8 +190,6 @@ const Demo = () => import('@/views/demo');
const MapGroup = () => import('@/views/publish/mapGroup/index'); const MapGroup = () => import('@/views/publish/mapGroup/index');
const OrgDetail = () => import('@/views/system/companyManage/orgDetail'); const OrgDetail = () => import('@/views/system/companyManage/orgDetail');
const VoiceTraining = () => import('@/views/system/voiceTraining/index'); const VoiceTraining = () => import('@/views/system/voiceTraining/index');
const SceneTrainingResult = () => import('@/views/drts/scene/trainingResult');
const SceneVoiceTraining = () => import('@/views/drts/scene/voiceTraining');
const Ueditor = () => import('@/views/editor/index'); const Ueditor = () => import('@/views/editor/index');
const UeditorList = () => import('@/views/editor/list'); const UeditorList = () => import('@/views/editor/list');
@ -375,11 +364,6 @@ export const constantRoutes = [
component: PlanMonitorEditAUSTool, component: PlanMonitorEditAUSTool,
hidden: true hidden: true
}, },
{
path: '/runPlanViewWindow',
component: RunPlanViewWindow,
hidden: true
},
{ {
path: '/jlmap3d/sandbox', path: '/jlmap3d/sandbox',
component: Jlmap3dSandbox, component: Jlmap3dSandbox,
@ -510,11 +494,6 @@ export const publicAsyncRoute = [
component: BigSplitScreen, component: BigSplitScreen,
hidden: true hidden: true
}, },
{
path: '/jointTrainingNewCCTV',
component: jointTrainingNewCCTV,
hidden: true
},
{ {
path: '/jlmap3d', path: '/jlmap3d',
component: Jlmap3d, component: Jlmap3d,
@ -583,29 +562,6 @@ export const publicAsyncRoute = [
component: ExamResult, component: ExamResult,
hidden: true hidden: true
}, },
{// 运行图预览
path: '/planSchedule/window',
component: PlanScheduleWicket,
hidden: true
},
{
// 运行图测试（仿真，仅有按计划行车和初始化操作）
path: '/design/runPlan/testRunplan',
component: TestRunplan,
hidden: true
},
{
// 北京交大使用 客流视图
path: '/practiceDisplay',
component: PracticeDisplay,
hidden: true
},
{
// 北京交大使用 大客流策略
path: '/bigLPFStrategy',
component: BigLPFStrategy,
hidden: true
},
{ {
path: '/messageBoard', path: '/messageBoard',
component: MessageBoard, component: MessageBoard,
@ -1509,14 +1465,6 @@ export const asyncRouter = [
icon: 'design' icon: 'design'
} }
}, },
{
path: 'scene',
component: Scene,
meta: {
i18n: 'router.sceneManage',
icon: 'design'
}
},
{ {
path: 'questionCreate', path: 'questionCreate',
component: QuestionCreatePage, component: QuestionCreatePage,
@ -1526,16 +1474,6 @@ export const asyncRouter = [
path: 'questionUpdate/:questionId', path: 'questionUpdate/:questionId',
component: QuestionUpdatePage, component: QuestionUpdatePage,
hidden: true hidden: true
},
{
path: 'voiceTraining',
component: SceneVoiceTraining,
hidden: true
},
{
path: 'trainingResult',
component: SceneTrainingResult,
hidden: true
} }
] ]
}, },

0
src/views/newMap/displayNew/utils.js → src/utils/simulation.js
View File

3
src/views/authorityTransfer/distributePackage.vue
View File

@ -171,7 +171,8 @@ export default {
distributePackage(index, row) { distributePackage(index, row) {
if (this.packageId) { if (this.packageId) {
const accountId = row.id; const accountId = row.id;
const subjectType = row.type == '1' ? 'user' : 'org'; // const subjectType = row.type == '1' ? 'user' : 'org';
const subjectType = 'user'; // 都是用户
setDistributeToSubject(this.packageId, subjectType, accountId).then(resp=> { setDistributeToSubject(this.packageId, subjectType, accountId).then(resp=> {
this.$message.success('权限分发给指定账户成功！'); this.$message.success('权限分发给指定账户成功！');
this.$emit('reloadTable'); this.$emit('reloadTable');

198
src/views/designPlatform/testRunplan.vue
View File

@ -1,198 +0,0 @@
<template>
<div class="map-view" :style="{width: canvasWidth+'px',height:'100%',position:'absolute',overflow:'hidden'}">
<div v-show="maskOpen" class="mask" :style="{'width': maskWidth}" />
<jlmap-visual ref="jlmapVisual" />
<div class="display-draft">
<el-button-group>
<el-button type="success" :disabled="isDisable" size="small" @click="selectBeginTime">{{ $t('display.demon.drivingByPlan') }}</el-button>
<el-button type="danger" size="small" @click="end">{{ $t('display.demon.initialize') }}</el-button>
<el-button type="small" @click="back">{{ $t('scriptRecord.scriptBack') }}</el-button>
</el-button-group>
</div>
<set-time ref="setTime" @ConfirmSelectBeginTime="start" />
<menu-system-time ref="menuSystemTime" :offset="15" :group="group" />
</div>
</template>
<script>
import SetTime from '@/views/newMap/displayNew/demon/setTime';
import JlmapVisual from '@/views/newMap/jlmapNew/index';
import { Notification } from 'element-ui';
import { loadMapDataById } from '@/utils/loaddata';
import { ranAsPlan, exitRunPlan, clearSimulation, getSimulationInfoNew } from '@/api/simulation';
import { creatSubscribe, clearSubscribe, displayTopic} from '@/utils/stomp';
import MenuSystemTime from '@/views/newMap/displayNew/menuSystemTime';
import { getToken } from '@/utils/auth';
import { mapGetters } from 'vuex';
export default {
name:'TestRunplan',
components: {
SetTime,
JlmapVisual,
MenuSystemTime
},
data() {
return {
maskOpen: false,
maskWidth: '100%'
};
},
computed:{
...mapGetters([
'canvasWidth'
]),
group() {
return this.$route.query.group;
},
mapId() {
return this.$route.query.mapId;
},
isDisable() {
return this.$store.state.training.started;
},
width() {
return this.$store.state.app.width;
},
height() {
return this.$store.state.app.height;
}
},
watch:{
'$store.state.map.mapViewLoadedCount':function() {
this.$store.dispatch('map/setTrainWindowShow', false);
// this.$jlmap.off('zoom');
if (this.group) {
this.subscribe();
}
},
'$store.state.app.windowSizeCount': function() { // 窗口缩放
this.setWindowSize();
},
'$store.state.socket.equipmentStatus': function (val) {
if (val.length && this.$route.query.group) {
this.statusMessage(val);
}
},
'$store.state.socket.simulationStart': function(val) {
this.$store.dispatch('training/simulationStart').then(() => {
this.$store.dispatch('map/setShowCentralizedStationNum');
});
}
},
async beforeDestroy() {
await this.$store.dispatch('map/mapClear');
},
async mounted() {
this.setWindowSize();
await this.initLoadData();
},
methods:{
initLoadData() { // 加载地图数据
if (this.mapId) {
this.loadSimulationInfo();
loadMapDataById(this.mapId, 'simulation');
}
},
// 缩放设置
setWindowSize() {
const width = this.width;
const height = this.height;
this.$store.dispatch('config/resize', { width, height });
},
async back() {
if (this.group) {
await clearSimulation(this.group);
this.clearSubscribe();
}
this.$store.dispatch('map/setShowCentralizedStationCode', '');
history.go(-1);
Notification.closeAll();
},
selectBeginTime() {
this.$refs.setTime.doShow();
},
async statusMessage(list) {
await this.$store.dispatch('training/updateMapState', list);
await this.$store.dispatch('socket/setEquipmentStatus');
},
end() {
exitRunPlan(this.group).then(() => {
this.$store.dispatch('training/over').then(() => {
this.$store.dispatch('training/setMapDefaultState').then(() => {
this.$store.dispatch('map/resetActiveTrainList', false);
this.$store.dispatch('map/clearJlmapTrainView');
this.$store.dispatch('map/setTrainWindowShow', false);
});
});
}).catch(() => {
this.$messageBox(this.$t('display.demon.endSimulationFail'));
});
},
async subscribe() {
this.clearSubscribe();
const header = { group: this.group || '', 'X-Token': getToken() };
creatSubscribe(`${displayTopic}\/${this.$route.query.group}`, header);
// await this.$store.dispatch('training/setHasSubscribed');
},
clearSubscribe() {
clearSubscribe(`${displayTopic}\/${this.group}`);
},
async loadSimulationInfo() {
const resp = await getSimulationInfoNew(this.group);
if (resp && resp.code == 200 && resp.data) {
if (!resp.data.dataError) {
this.$store.dispatch('scriptRecord/updateSimulationPause', resp.data.pause); // 是否暂停判断
this.$store.dispatch('training/setInitTime', resp.data.systemTime);
this.planRunning = resp.data.planRunning;
if (resp.data.planRunning) {
this.$store.commit('training/start');
}
} else {
this.$messageBox('此地图数据正在维护中,无法运行！');
}
this.dataError = resp.data.dataError;
}
},
start(model) { // 开始仿真
const data = {
time: model.initTime
};
ranAsPlan(data, this.group).then(res => {
// this.$store.dispatch('training/setInitTime', model.initTime);
this.$store.dispatch('training/setInitTime', model.timestamp);
}).catch(error => {
if (error.code == '5001') {
this.$messageBox(this.$t('error.mapDataError') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '5002') {
this.$messageBox(this.$t('error.runningChartDataError') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '5003') {
this.$messageBox(this.$t('error.runningChartIsNotLoaded') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '5004') {
this.$messageBox(this.$t('error.runningDataError') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '5000') {
this.$messageBox(this.$t('error.systemError') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4000') {
this.$messageBox(this.$t('error.simulationDoesNotExist') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4001') {
this.$messageBox(this.$t('error.simulationOperationIsNotDefined') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4002') {
this.$messageBox(this.$t('error.simulationOperationProcessingMethodNotFound') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4003') {
this.$messageBox(this.$t('error.simulationOperationFailed') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4004') {
this.$messageBox(this.$t('error.operationConflict') + ',' + this.$t('error.startSimulationFailed'));
} else {
this.$messageBox('按计划行车异常,请退出重试!');
}
});
}
}
};
</script>
<style lang="scss" scoped>
.display-draft {
position: absolute;
float: right;
right: 15px;
bottom: 15px;
}
</style>

156
src/views/drts/scene/create.vue
View File

@ -1,156 +0,0 @@
<template>
<el-dialog :title="title" :visible.sync="dialogVisible" width="500px" :before-close="doClose" center>
<data-form ref="dataform" :form="form" :form-model="formModel" :rules="rules" />
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="doCreate">{{ $t('global.confirm') }}</el-button>
<el-button @click="doClose">{{ $t('global.cancel') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import {addCompetitionPracticalScene, getCompetitionPracticalSceneById, updateCompetitionPracticalScene} from '@/api/competition';
export default {
name:'SceneCreate',
props: {
scriptList:{
type: Array,
default() {
return [];
}
},
title:{
type: String,
default() {
return '';
}
}
},
data() {
return {
dialogVisible:false,
isEdit:false,
formModel: {
id:'',
name:'', // 场景名称
description:'', // 场景描述
disposalProcesses:'', // 处置流程
scriptId:'', // 剧本id
operationScore:0, // 运营部分总分（站间停车等）
main:true // 是否主场景
}
};
},
computed: {
form() {
const form = {
labelWidth: '120px',
items: [
{ prop: 'name', label: '场景名称', type: 'text', maxlength:80 },
{ prop: 'description', label: '场景描述', type: 'textarea' },
{ prop: 'disposalProcesses', label: '处置流程', type: 'textarea' },
{ prop: 'operationScore', label: '运营部分总分', type: 'number', min: 0, max: 100, step:1, precision:1 },
{ prop:'scriptId', label:'关联剧本', type:'select', options:this.scriptList, optionValue:'value', optionLabel:'label' },
{ prop:'main', label:'是否主场景', type:'switch' }
]
};
return form;
},
rules() {
const crules = {
name: [
{ required: true, validator: this.validateSceneName, trigger: 'blur' },
{ required: true, validator: this.validateSceneName, trigger: 'change' }
],
description: [
{ required: true, validator: this.validateDescription, trigger: 'blur' },
{ required: true, validator: this.validateDescription, trigger: 'change' }
],
disposalProcesses: [
{ required: true, validator: this.validateDisposalProcesses, trigger: 'blur' },
{ required: true, validator: this.validateDisposalProcesses, trigger: 'change' }
],
scriptId:[
{ required: true, message: '请选择剧本', trigger: 'change' }
],
operationScore:[
{ required: true, message: '请输入运营部分总分', trigger: 'blur' }
]
};
return crules;
}
},
methods:{
validateSceneName(rule, value, callback) {
if (value.trim().length === 0) {
this.formModel.name = this.formModel.name.replace(/\s/g, '');
return callback(new Error('请输入场景名称'));
} else {
return callback();
}
},
validateDescription(rule, value, callback) {
if (value.trim().length === 0) {
this.formModel.description = this.formModel.description.replace(/\s/g, '');
return callback(new Error('请输入场景描述'));
} else {
return callback();
}
},
validateDisposalProcesses(rule, value, callback) {
if (value.trim().length === 0) {
this.formModel.disposalProcesses = this.formModel.disposalProcesses.replace(/\s/g, '');
return callback(new Error('请输入处置流程'));
} else {
return callback();
}
},
doShow(sceneId) {
// this.dialogVisible = true;
if (sceneId) {
getCompetitionPracticalSceneById(sceneId).then(resp=>{
const data = {'name':resp.data.name,
'description':resp.data.description,
'disposalProcesses':resp.data.disposalProcesses,
'scriptId':resp.data.scriptId,
'operationScore':resp.data.operationScore,
'main':resp.data.main};
this.formModel = data;
this.formModel.id = sceneId;
this.dialogVisible = true;
this.isEdit = true;
});
} else {
this.dialogVisible = true;
this.isEdit = false;
}
},
doCreate() {
const self = this;
this.$refs.dataform.validateForm(() => {
if (this.isEdit) {
updateCompetitionPracticalScene(Object.assign({}, this.formModel)).then(resp => {
this.$emit('reloadTable');
this.$message.success('更新场景成功');
}).catch(error => {
this.$messageBox(`更新场景失败: ${error.message}`);
});
} else {
delete this.formModel.id;
addCompetitionPracticalScene(Object.assign({}, this.formModel)).then(resp => {
this.$emit('reloadTable');
this.$message.success('创建场景成功');
}).catch(error => {
this.$messageBox(`创建场景失败: ${error.message}`);
});
}
self.doClose();
});
},
doClose() {
this.$refs.dataform.resetForm();
this.dialogVisible = false;
}
}
};
</script>

171
src/views/drts/scene/importScene.vue
View File

@ -1,171 +0,0 @@
<template>
<el-dialog v-dialogDrag title="场景导入" :visible.sync="dialogShow" width="360px" :before-close="handleClose" custom-class="importClass">
<div>
<div v-show="!formDisplay" class="eachButton uploadDemo">
<i class="el-icon-plus avatar-uploader-icon el-icon-other" />
<input ref="files" type="file" class="file_box" accept=".json, application/json" @change="importf">
</div>
<el-form v-show="formDisplay" ref="form" label-position="right" :rules="editRules" :model="editModel" label-width="100px" size="mini" @submit.native.prevent>
<el-form-item label="场景名称" prop="name">
<el-input v-model="editModel.name" />
</el-form-item>
<el-form-item label="请选择剧本" prop="scriptId">
<el-select v-model="editModel.scriptId">
<el-option v-for="item in scriptList" :key="item.code" :label="item.label" :value="item.value" />
</el-select>
</el-form-item>
</el-form>
<div style="margin-left:18px;color:red;font-size:13px;">{{ validateText }}</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="handleClose">{{ $t('map.cancel') }}</el-button>
<el-button type="primary" :loading="loading" @click="importScene">{{ $t('map.confirm') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { postSceneImport } from '@/api/competition';
export default {
name:'ImportScene',
props: {
scriptList:{
type: Array,
default() {
return [];
}
}
},
data() {
return {
formDisplay:false,
dialogShow: false,
loading: false,
jsonData:null,
validateText:'',
editModel: {
scriptId: '',
name: ''
},
editRules: {
name: [
{ required: true, message: '请输入场景名称', trigger: 'blur' }
],
scriptId:[
{ required: true, message: '请选择剧本', trigger: 'change' }
]
}
};
},
methods:{
close() {
this.$refs.form.resetFields();
this.formDisplay = false;
this.editModel.scriptId = '';
this.jsonData = null;
this.dialogShow = false;
this.validateText = '';
},
handleClose() {
this.close();
},
doShow() {
this.validateText = '';
this.dialogShow = true;
},
importf() {
const that = this;
setTimeout(() => {
const obj = this.$refs.files;
if (!obj.files) return;
const f = obj.files[0];
if (f.type != 'application/json') {
this.$message.error('请上传json格式的文件');
return;
}
const reader = new FileReader();
reader.readAsText(f, 'utf-8');
reader.onload = function(e) {
const data = e.target.result;
that.formDisplay = true;
const json = JSON.parse(data);
that.jsonData = json;
that.editModel.name = json.name;
obj.value = '';
that.validateText = '';
};
});
},
importScene() {
if (!this.jsonData) {
this.validateText = '请选择文件';
return false;
}
this.$refs['form'].validate((valid) => {
if (valid) {
this.submitData();
} else {
return false;
}
});
},
submitData() {
const loading = this.$loading({
lock: true,
text: '正在导入中...',
spinner: 'el-icon-loading',
background: 'rgba(0, 0, 0, 0.7)'
});
this.loading = true;
this.dialogShow = false;
this.validateText = '';
const that = this;
postSceneImport(that.editModel.scriptId, that.editModel.name, that.jsonData).then(res => {
loading.close();
that.loading = false;
that.$message.success('导入成功！');
this.$emit('refresh');
// loading.close();
this.close();
}).catch(error => {
loading.close();
that.loading = false;
this.close();
that.$message.error('导入失败' + error.message);
});
}
}
};
</script>
<style lang="scss" scoped>
.eachButton{
margin-left:10px;
width:100px;
height:100px;
border:1px #ccc dashed;
margin-bottom: 10px;
}
.el-icon-other{
width: 100%;
text-align: center;
height: 100%;
line-height: 72px;
font-size: 16px;
}
.uploadDemo {
position: relative;
overflow: hidden;
// float: right;
padding: 9px 15px;
margin-right: 3px;
cursor: pointer;
input {
width: 100%;
height: 100%;
position: absolute;
left: 0;
top: 0;
opacity: 0;
cursor: pointer;
}
}
</style>

178
src/views/drts/scene/index.vue
View File

@ -1,178 +0,0 @@
<template>
<div>
<query-list-page ref="user" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
<create-scene ref="createScene" title="创建场景" :script-list="scriptList" @reloadTable="reloadTable" />
<create-scene ref="updateScene" title="更新场景" :script-list="scriptList" @reloadTable="reloadTable" />
<modify-step ref="modifyStep" title="编辑步骤数据" />
<import-scene ref="importScene" :script-list="scriptList" @refresh="reloadTable" />
</div>
</template>
<script>
import { getCompetitionPracticalScene, deleteCompetitionPracticalScene, getSceneExport } from '@/api/competition';
import { getScriptPageListOnlineNew } from '@/api/script';
import CreateScene from './create';
import ModifyStep from './modify';
import ImportScene from './importScene';
export default {
name:'SceneManage',
components:{
CreateScene,
ModifyStep,
ImportScene
},
data() {
return {
scriptList:[],
pagerConfig: {
pageSize: 'pageSize',
pageIndex: 'pageNum'
},
queryForm: {
reset: false,
labelWidth: '80px',
queryObject: {
name: {
type: 'text',
label: '场景名称'
}
}
},
queryList: {
query: getCompetitionPracticalScene,
selectCheckShow: false,
indexShow: true,
columns: [
{
title: '场景名称',
prop: 'name',
width: '100'
},
{
title: '场景描述',
prop: 'description'
},
{
title: '处置流程',
prop: 'disposalProcesses'
},
{
title: '运营部分总分',
prop: 'operationScore'
},
{
title: '关联剧本',
prop: 'scriptId',
type: 'tag',
width: '320',
columnValue: (row) => { return this.$convertField(row.scriptId, this.scriptList, ['value', 'label']); },
tagType: (row) => { return 'success'; }
},
{
type: 'button',
title: '操 作',
width: '520',
buttons: [
{
name: '更 新',
handleClick: this.doUpdate,
type: 'primary'
},
{
name: '编辑步骤数据',
handleClick: this.doModify,
type: 'success'
},
{
name: '删 除',
handleClick: this.doDelete,
type: 'danger'
},
{
name: '导 出',
handleClick: this.doExport,
type: 'primary'
},
{
name: '语音训练',
handleClick: this.voiceTraining,
type: 'primary'
},
{
name: '训练结果',
handleClick: this.trainingResult,
type: 'primary'
}
]
}
],
actions: [
{ text: '添 加', handler: this.doCreate },
{ text: '导 入', handler: this.doImport }
]
}
};
},
created() {
getScriptPageListOnlineNew({pageSize:999, pageNum:1}).then(response=>{
this.scriptList = response.data.list.map(elem => { return { value: parseInt(elem.id), label: elem.name }; });
// this.queryForm.queryObject.scriptId.config.data = this.scriptList;
});
},
methods:{
// 修改
doUpdate(index, row) {
this.$refs.updateScene.doShow(row.id);
},
doDelete(index, row) {
this.$confirm('此操作将删除此场景, 是否继续?', this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
cancelButtonText: this.$t('global.cancel'),
type: 'warning'
}).then(() => {
deleteCompetitionPracticalScene(row.id).then(response => {
this.$message.success('删除场景成功');
this.reloadTable();
}).catch((error) => {
this.$messageBox(`删除场景失败: ${error.message}`);
});
}).catch(() => { });
},
doCreate() {
this.$refs.createScene.doShow(null);
},
doImport() {
this.$refs.importScene.doShow();
},
reloadTable() {
if (this.queryList && this.queryList.reload) {
this.queryList.reload();
}
},
doModify(index, row) {
this.$refs.modifyStep.doShow(row);
},
voiceTraining(index, row) {
this.$router.push({ path: '/design/race/voiceTraining', query: { scriptId: row.scriptId, sceneId: row.id}});
},
trainingResult(index, row) {
this.$router.push({ path: '/design/race/trainingResult', query: { scriptId: row.scriptId, sceneId: row.id }});
},
doExport(index, row) {
getSceneExport(row.id).then(res=>{
const resultData = res.data;
if (resultData === false) {
return;
}
const content = new Blob([JSON.stringify(resultData)]);
const urlObject = window.URL || window.webkitURL || window;
const url = urlObject.createObjectURL(content);
const el = document.createElement('a');
el.href = url;
el.download = `场景-${resultData.name}.json`;
el.click();
urlObject.revokeObjectURL(url);
});
}
}
};
</script>

781
src/views/drts/scene/modify.vue
View File

@ -1,781 +0,0 @@
<template>
<el-dialog v-loading="loading" :title="title" :visible.sync="dialogVisible" :before-close="doClose" top="50px" center custom-class="sceneModifyOut" fullscreen>
<el-form v-if="!loading" ref="form" :model="formModel" label-width="120px" class="sceneModify" @submit.native.prevent>
<!-- :rules="rules" -->
<el-table :data="actionList" border style="width:1320px;margin: 0 auto;" height="500" :span-method="objectSpanMethod" :show-summary="true" :summary-method="getSummaries">
<el-table-column label="步骤名称" width="100">
<template slot-scope="scope">
<div v-if="stepVOs[scope.row.id]">
{{ stepVOs[scope.row.id].description||'' }}
</div>
</template>
</el-table-column>
<el-table-column label="动作id" width="70" prop="id" />
<el-table-column label="动作内容" width="350">
<template slot-scope="scope">
<!-- v-model="scope.row.id" -->
<el-checkbox v-if="isModify" v-model="checkBoxActionList[scope.row.id].status" :disabled="checkBoxActionList[scope.row.id].disabled" class="checkBoxAction" @change="((val)=>{changeSelectActionId(val, scope.row.id, scope.$index)})" />
<el-radio v-if="isOperate" v-model="radioBoxAction" :label="scope.row.id" name="operateAction" class="checkBoxAction" @change="((val)=>{changeSelectRadioActionId(val, scope.row.id, scope.$index)})">{{ '' }}</el-radio>
<div v-if="dialogVisible">{{ scope.row.remarkName }}</div>
<!-- covert(scope.row) -->
<!-- -->
</template>
</el-table-column>
<el-table-column label="语音识别关键词列表" width="350">
<template v-if="scope.row.type=='Conversation'&&scope.row.memberId=='1'" slot-scope="scope">
<div v-if="commandEvaluationRuleVOs[scope.row.id]&&commandEvaluationRuleVOs[scope.row.id].keyWords">
<el-tag v-for="(tag,index) in commandEvaluationRuleVOs[scope.row.id].keyWords" :key="index" closable :disable-transitions="false" @close="handleClose(scope.row.id,index)">{{ tag }}</el-tag>
<el-input
v-if="commandEvaluationRuleVOs[scope.row.id].inputVisible"
:ref="'saveTagInput'+scope.row.id"
v-model="commandEvaluationRuleVOs[scope.row.id].inputValue"
size="small"
class="input-new-tag"
@keyup.enter.native="handleInputConfirm(scope.row.id)"
@blur="handleInputConfirm(scope.row.id)"
/>
<el-button v-else class="button-new-tag" size="small" @click="showInput(scope.row.id)">添加</el-button>
</div>
<div v-else>
<el-button class="button-new-tag" size="small" @click="addKeyWord(scope.row.id)">添加</el-button>
</div>
</template>
</el-table-column>
<el-table-column label="总分值" width="149">
<template v-if="scope.row.memberId=='1'&&(scope.row.type=='Conversation'||scope.row.type=='Operation')" slot-scope="scope">
<div v-if="commandEvaluationRuleVOs[scope.row.id]&&commandEvaluationRuleVOs[scope.row.id].score!=undefined">
<el-input-number
v-if="commandEvaluationRuleVOs[scope.row.id].scoreVisible"
:ref="'saveScoreInput'+scope.row.id"
v-model="commandEvaluationRuleVOs[scope.row.id].score"
:min="0"
size="small"
:max="Infinity"
:step="1"
@keyup.enter.native="handleScoreConfirm(scope.row.id)"
@blur="handleScoreConfirm(scope.row.id)"
/>
<div v-else style="cursor:pointer" @click="modifyScore(scope.row.id)">
{{ commandEvaluationRuleVOs[scope.row.id].score }}
</div>
</div>
<div v-else>
<el-button class="button-new-tag" size="small" @click="addScore(scope.row.id)">编辑</el-button>
</div>
</template>
</el-table-column>
<el-table-column label="超时时间" width="150">
<template v-if="scope.row.type=='Conversation'&&scope.row.memberId=='1'" slot-scope="scope">
<div v-if="commandEvaluationRuleVOs[scope.row.id]&&commandEvaluationRuleVOs[scope.row.id].timeOut!=undefined">
<el-input-number
v-if="commandEvaluationRuleVOs[scope.row.id].timeOutVisible"
:ref="'saveTimeOutInput'+scope.row.id"
v-model="commandEvaluationRuleVOs[scope.row.id].timeOut"
:min="0"
size="small"
:max="Infinity"
:step="1"
@keyup.enter.native="handleTimeOutConfirm(scope.row.id)"
@blur="handleTimeOutConfirm(scope.row.id)"
/>
<div v-else style="cursor:pointer" @click="modifyTimeOut(scope.row.id)">
{{ commandEvaluationRuleVOs[scope.row.id].timeOut }}
</div>
</div>
<div v-else>
<el-button class="button-new-tag" size="small" @click="addTimeOut(scope.row.id)">编辑</el-button>
</div>
</template>
</el-table-column>
<el-table-column label="扣除分值" width="150">
<template v-if="scope.row.type=='Conversation'&&scope.row.memberId=='1'" slot-scope="scope">
<div v-if="commandEvaluationRuleVOs[scope.row.id]&&commandEvaluationRuleVOs[scope.row.id].deductScore!=undefined">
<el-input-number
v-if="commandEvaluationRuleVOs[scope.row.id].deductScoreVisible"
:ref="'saveDeductScoreInput'+scope.row.id"
v-model="commandEvaluationRuleVOs[scope.row.id].deductScore"
:min="0"
size="small"
:max="Infinity"
:step="1"
@keyup.enter.native="handleDeductScoreConfirm(scope.row.id)"
@blur="handleDeductScoreConfirm(scope.row.id)"
/>
<div v-else style="cursor:pointer" @click="modifyDeductScore(scope.row.id)">
{{ commandEvaluationRuleVOs[scope.row.id].deductScore }}
</div>
</div>
<div v-else>
<el-button class="button-new-tag" size="small" @click="addDeductScore(scope.row.id)">编辑</el-button>
</div>
</template>
</el-table-column>
</el-table>
<table class="operateStatistic">
<thead>
<tr>
<th class="operateStatisticLT">
<div class="operateStatisticLIn">每一项分值</div>
</th>
<th class="operateStatisticRT">
<div class="operateStatisticLIn">运营统计项列表</div>
</th>
</tr>
</thead>
<tr>
<td class="operateStatisticLB">
<el-input-number
v-model="formModel.operationStatisticVO.score"
:style="{width: '130px'}"
:min="0"
size="small"
:max="100"
:step="1"
/>
</td>
<td class="operateStatisticRB">
<el-table :data="formModel.operationStatisticVO.itemVOS" border style="width:651px;float:left;" height="240">
<el-table-column prop="description" label="简介" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.description" type="text" :style="{width: '125px'}" size="small" :maxlength="100" />
</template>
</el-table-column>
<el-table-column prop="type" label="类型" width="150">
<template slot-scope="scope">
<el-select v-model="scope.row.type" :style="{width: '125px'}" size="small">
<el-option
v-for="option in operationItemType"
:key="option.value"
:label="option.label"
:value="option.value"
/>
</el-select>
</template>
</el-table-column>
<el-table-column prop="actionId" label="关联步骤" width="150">
<template slot-scope="scope">
<el-button v-if="scope.row.type=='Time'" type="primary" size="small" class="selectStep" @click="selectStep(scope.row.actionId,scope.$index)">选择步骤</el-button>
<div v-if="scope.row.actionId">步骤id:{{ scope.row.actionId }}</div>
<!-- <el-select v-model="scope.row.stepId" :style="{width: '125px'}" size="small">
<el-option
v-for="option in stepVOs"
:key="option.id"
:label="option.description"
:value="option.id"
/>
</el-select> -->
</template>
</el-table-column>
<el-table-column prop="standardAnswer" label="非时间标准答案" width="150">
<template slot-scope="scope">
<el-input v-if="scope.row.type=='Non_Time'" v-model="scope.row.standardAnswer" type="text" :style="{width: '125px'}" size="small" :maxlength="100" />
</template>
</el-table-column>
<el-table-column label="操作" width="50">
<template slot-scope="scope">
<span class="el-icon-error deleteScene" @click="handleDelete(scope.$index)" />
</template>
</el-table-column>
</el-table>
<el-button type="primary" size="small" class="addOperateItem" @click="addItemVO">添加</el-button>
</td>
</tr>
</table>
</el-form>
<div style="margin-top:15px;width:1250px;margin-left:auto;margin-right:auto;">
<el-button v-if="!isModify" type="primary" @click="doModifyDes">编辑步骤描述</el-button>
<el-button v-if="isModify" type="success" @click="cancleModifyDes">取消编辑步骤描述</el-button>
<!-- <el-button v-if="idOperateStatistic" type="success" @click="doOperateStatistic">编辑运营统计</el-button> -->
</div>
<step-description
ref="addStepDescription"
@cancleDescription="cancleDescription"
@submitDescription="submitDescription"
/>
<!-- <operate-statistic ref="operateStatistic" @submitOperateStatistic="submitOperateStatistic" /> -->
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="doSave">保存</el-button>
<el-button type="primary" @click="doConfirm">{{ $t('global.confirm') }}</el-button>
<el-button @click="doClose">{{ $t('global.cancel') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import ConstConfig from '@/scripts/ConstConfig';
import Cookies from 'js-cookie';
import {getScriptByIdNew} from '@/api/script';
import StepDescription from './stepDescription';
// import OperateStatistic from './operateStatistic';
import {covertOperate} from '@/views/newMap/displayNew/scriptDisplay/component/covertOperation';
import {updateCompetitionPracticalStep, getCompetitionPracticalSceneById} from '@/api/competition';
import { loadMapDataById } from '@/utils/loaddata';
export default {
name:'ModifyStep',
components:{
StepDescription
// OperateStatistic
},
props: {
title:{
type: String,
default() {
return '';
}
}
},
data() {
return {
isModify:false,
jsonData: '',
isOperate:false,
dialogVisible:false,
currentSelectStep:'',
actionList:[],
memberList:[],
operationItemType:[{label:'时间', value:'Time'}, {label:'非时间', value:'Non_Time'}],
checkBoxActionList:[],
radioBoxAction:'',
commandEvaluationRuleVOs:{},
currentstepAction:[],
startArray:[],
endArray:[],
stepVOs:{},
formModel:{
id:'',
name:'',
main:true,
description:'',
disposalProcesses:'',
operationScore:'',
scriptId:'',
commandEvaluationRuleVOs:[],
stepVOs:[],
operationStatisticVO:{
score:'',
itemVOS:[]
}
},
loading: false
};
},
computed: {
idOperateStatistic() {
return Object.values(this.stepVOs).length > 2;
}
},
watch: {
'$store.state.map.mapDataLoadedCount': function (val) {
this.parseMember();
getCompetitionPracticalSceneById(this.formModel.id).then(response=>{
const commandEvaluationRuleVOs = {};
if (response.data.commandEvaluationRuleVOs) {
response.data.commandEvaluationRuleVOs.forEach(data=>{
commandEvaluationRuleVOs[data.actionId] = data;
// commandEvaluationRuleVOs[data.actionId].inputVisible = false;
});
}
const stepVOs = {};
if (response.data.stepVOs) {
response.data.stepVOs.forEach(data=>{
stepVOs[data.startActionId] = data;
const dataIndex = this.tempActionList.findIndex((value, index, arr)=>{ return value.id == data.startActionId; });
const dataIndex1 = this.tempActionList.findIndex((value, index, arr)=>{ return value.id == data.endActionId; });
this.startArray.push(dataIndex);
this.endArray.push(dataIndex1);
});
}
// action.remarkName = this.covert(action);
this.tempActionList.forEach(action=>{
action.remarkName = this.covert(action);
});
this.actionList = [...this.tempActionList];
this.commandEvaluationRuleVOs = commandEvaluationRuleVOs;
if (response.data.operationStatisticVO) {
this.formModel.operationStatisticVO = response.data.operationStatisticVO;
} else {
this.formModel.operationStatisticVO = {score:0, itemVOS:[]};
}
this.stepVOs = stepVOs;
});
}
},
methods:{
doShow(row) {
// 加载剧本数据
this.loading = true;
this.dialogVisible = true;
this.formModel.id = row.id;
this.formModel.name = row.name;
this.formModel.main = row.main;
this.formModel.description = row.description;
this.formModel.disposalProcesses = row.disposalProcesses;
this.formModel.operationScore = row.operationScore;
this.formModel.scriptId = row.scriptId;
this.actionList = [];
this.tempActionList = [];
getScriptByIdNew(row.scriptId).then(res=>{
this.tempActionList = res.data.actionList.filter(action=>{
return action.type != 'Exit_Conversation' && action.type != 'Accept_Conversation_Invitation';
});
this.jsonData = res;
// 加载地图数据
loadMapDataById(res.data.mapId, 'parse');
});
},
parseMember() {
const stationMap = {};
const stationList = this.$store.state.map.map.stationList;
stationList.forEach(station=>{
stationMap[station.code] = station;
});
let lastData = JSON.stringify(this.jsonData.data.memberList);
const roleTypeList = ConstConfig.ConstSelect.roleTypeNew;
roleTypeList.forEach(function(element) {
const rolename = element.value;
if (Cookies.get('user_lang') == 'en') {
lastData = lastData.replace(new RegExp(rolename, 'g'), element.enLabel);
} else {
lastData = lastData.replace(new RegExp(rolename, 'g'), element.label);
}
});
lastData = JSON.parse(lastData);
const lastMemberList = {};
lastData.forEach((member, index)=>{
const userName = member.userName ? '-' + member.userName : '';
const name = member.name ? '-' + member.name : '';
if (member.deviceCode && member.type == '行值') {
const device = stationMap[member.deviceCode];
member.deviceName = device.name;
// || device.groupNumber
member.label = member.type + member.deviceName + name + userName;
member.normalName = member.type + member.deviceName + name;
} else if (member.deviceCode && member.type == '司机') {
member.deviceName = member.deviceCode;
member.label = member.type + member.deviceName + name + userName;
} else {
member.deviceName = '';
member.label = member.type + name + userName;
member.normalName = member.type + name;
}
lastMemberList[member.id] = member;
this.memberList = lastMemberList;
});
this.loading = false;
},
doClose() {
// this.$refs.dataform.resetForm();
this.dialogVisible = false;
this.$store.dispatch('map/mapClear');
},
covert(element) {
// console.log(JSON.stringify(element), '8888888---666666');
const member = this.memberList[element.memberId];
let resultData = '';
if (element.type == 'Accept_Conversation_Invitation') {
resultData = member.label + '请接受会话邀请';
} else if (element.type == 'Conversation') {
resultData = member.label + '说：' + element.content;
} else if (element.type == 'Operation') {
resultData = covertOperate(element.operationType, element.operationParamMap);
resultData = resultData.replace('请', member.label);
// this.scriptTipMessage = '请找到' + deviceName + '，执行【' + operateName.label + '】操作';
} else if (element.type == 'Exit_Conversation') {
resultData = member.label + '结束当前会话';
} else if (element.type == 'Start_Conversation' ) {
const inviteMember = [];
// this.$emit('allowCreatCoversition');
if (element.communicationObject) {
if (element.communicationObject == 'ALL_STATION') {
inviteMember.push('所有车站');
} else if (element.communicationObject == 'ALL_TRAIN') {
inviteMember.push('所有司机');
}
} else {
element.conversationMemberIds.forEach(id=>{
if (element.memberId != id) {
inviteMember.push((this.memberList[id] || {label: ''}).label);
}
});
}
resultData = member.label + '创建会话,选择' + inviteMember.toString();
} else if (element.type == 'Command') {
const targetName = this.memberList[element.commandInitiateVO.targetMemberId];
const CommandList = {
Drive_Ahead:'确认运行至前方站',
Route_Block_Drive:'进路闭塞法行车',
Switch_Hook_Lock: '道岔钩锁',
Drive_Through_The_Red_Light:'越红灯行驶',
Drive_Through_The_Guide_Signal:'越引导信号行驶',
Open_Or_Close_Door:'开关门',
Set_Speed_Limit:'设置限速',
Turn_Direction: '换端',
Drive_To: '驾驶至',
Apply_URM_Mode: '转URM模式',
Apply_RM_Mode: '转RM模式',
Apply_CM_Mode: '转CM模式',
Apply_AM_Mode: '转AM模式'
};
resultData = member.label + '对【' + targetName.label + '】下达【' + CommandList[element.commandInitiateVO.commandType] + '】指令';
} else if (element.type == 'Drive') {
if (element.targetSectionCode) {
const section = this.$store.getters['map/getDeviceByCode'](element.targetSectionCode);
if (section && section.name) {
resultData = member.label + '把车开到区段' + section.name;
}
}
}
return resultData;
},
initCommandEvaluationRuleVOs(actionId) {
if (!this.commandEvaluationRuleVOs[actionId]) {
this.$set(this.commandEvaluationRuleVOs, actionId, {});
this.$set(this.commandEvaluationRuleVOs[actionId], 'actionId', actionId);
}
},
addKeyWord(actionId) {
this.initCommandEvaluationRuleVOs(actionId);
this.$set(this.commandEvaluationRuleVOs[actionId], 'inputValue', '');
this.$set(this.commandEvaluationRuleVOs[actionId], 'keyWords', []);
this.$set(this.commandEvaluationRuleVOs[actionId], 'inputVisible', true);
this.$nextTick(_ => {
this.$refs['saveTagInput' + actionId].$refs.input.focus();
});
},
addScore(actionId) {
this.initCommandEvaluationRuleVOs(actionId);
this.$set(this.commandEvaluationRuleVOs[actionId], 'score', 0);
this.$set(this.commandEvaluationRuleVOs[actionId], 'scoreVisible', true);
this.$nextTick(_ => {
this.$refs['saveScoreInput' + actionId].$refs.input.focus();
});
},
addTimeOut(actionId) {
this.initCommandEvaluationRuleVOs(actionId);
this.$set(this.commandEvaluationRuleVOs[actionId], 'timeOut', 0);
this.$set(this.commandEvaluationRuleVOs[actionId], 'timeOutVisible', true);
this.$nextTick(_ => {
this.$refs['saveTimeOutInput' + actionId].$refs.input.focus();
});
},
handleTimeOutConfirm(actionId) {
this.$set(this.commandEvaluationRuleVOs[actionId], 'timeOutVisible', false);
},
modifyTimeOut(actionId) {
this.$set(this.commandEvaluationRuleVOs[actionId], 'timeOutVisible', true);
this.$nextTick(_ => {
this.$refs['saveTimeOutInput' + actionId].$refs.input.focus();
});
},
showInput(actionId) {
const self = this;
// this.commandEvaluationRuleVOs[actionId].inputVisible = true;
this.$set(this.commandEvaluationRuleVOs[actionId], 'inputVisible', true);
this.$nextTick(_ => {
self.$refs['saveTagInput' + actionId].$refs.input.focus();
});
},
handleInputConfirm(actionId) {
const inputValue = this.commandEvaluationRuleVOs[actionId].inputValue;
if (inputValue) {
this.commandEvaluationRuleVOs[actionId].keyWords.push(inputValue);
}
this.$set(this.commandEvaluationRuleVOs[actionId], 'inputVisible', false);
this.$set(this.commandEvaluationRuleVOs[actionId], 'inputValue', '');
},
handleScoreConfirm(actionId) {
this.$set(this.commandEvaluationRuleVOs[actionId], 'scoreVisible', false);
},
modifyScore(actionId) {
this.$set(this.commandEvaluationRuleVOs[actionId], 'scoreVisible', true);
this.$nextTick(_ => {
this.$refs['saveScoreInput' + actionId].$refs.input.focus();
});
},
handleClose(index, tagIndex) {
const keyWords = this.commandEvaluationRuleVOs[index].keyWords;
keyWords.splice(tagIndex, 1);
},
handleDeductScoreConfirm(actionId) {
this.$set(this.commandEvaluationRuleVOs[actionId], 'deductScoreVisible', false);
},
modifyDeductScore(actionId) {
this.$set(this.commandEvaluationRuleVOs[actionId], 'deductScoreVisible', true);
this.$nextTick(_ => {
this.$refs['saveDeductScoreInput' + actionId].$refs.input.focus();
});
},
addDeductScore(actionId) {
this.initCommandEvaluationRuleVOs(actionId);
this.$set(this.commandEvaluationRuleVOs[actionId], 'deductScore', 0);
this.$set(this.commandEvaluationRuleVOs[actionId], 'deductScoreVisible', true);
this.$nextTick(_ => {
this.$refs['saveDeductScoreInput' + actionId].$refs.input.focus();
});
},
doConfirm() {
this.doUpdate();
this.doClose();
},
doSave() {
this.doUpdate();
},
doUpdate() {
let commandEvaluationRuleVOs = Object.values(this.commandEvaluationRuleVOs);
const stepVOs = Object.values(this.stepVOs);
commandEvaluationRuleVOs = commandEvaluationRuleVOs.filter(eachData=>{
return (eachData.keyWords && eachData.keyWords.length > 0) || eachData.timeOut || eachData.score || eachData.deductScore;
});
let count = 0;
let errorMessage = '';
commandEvaluationRuleVOs.forEach((RuleVO, index)=>{
if (RuleVO.keyWords) {
if (!(RuleVO.keyWords.length > 0 && RuleVO.timeOut && RuleVO.score && RuleVO.deductScore)) {
errorMessage += '动作id为' + RuleVO.actionId + '的表单没有填写完整, ';
count++;
}
}
});
if (count > 0) {
this.$messageBox(errorMessage);
return false;
}
if (stepVOs.length > 0) {
stepVOs.sort(this.objectSort('startActionId'));
stepVOs.map((step, index)=>{
step.id = (index + 1);
});
}
if (commandEvaluationRuleVOs.length > 0) {
commandEvaluationRuleVOs.map(data=>{
delete data.inputValue;
delete data.inputVisible;
delete data.scoreVisible;
delete data.timeOutVisible;
delete data.deductScoreVisible;
});
}
const itemVOS = this.formModel.operationStatisticVO.itemVOS;
if (itemVOS.length > 0) {
let result = true;
itemVOS.forEach(item=>{
delete item.id;
if (item.description && (item.actionId || item.standardAnswer)) {
result = result && true;
} else {
result = result && false;
}
});
if (!result) {
this.$messageBox('请填写运营统计项列表');
return false;
}
}
// if (operationStatisticVO) {
// this.formModel.operationStatisticVO = operationStatisticVO;
// }
this.formModel.commandEvaluationRuleVOs = commandEvaluationRuleVOs;
this.formModel.stepVOs = stepVOs;
updateCompetitionPracticalStep(this.formModel).then(res=>{
this.$message.success('编辑步骤信息成功');
}).catch(error=>{
this.$message.success('编辑步骤信息失败:' + error.message);
});
},
doModifyDes() {
this.actionList.forEach(action=>{
this.$set(this.checkBoxActionList, action.id, {status:false});
});
this.startArray.forEach((start, index)=>{
for (var i = start; i <= this.endArray[index]; i++) {
this.$set(this.checkBoxActionList, this.actionList[i].id, {disabled:true});
}
});
this.isModify = true;
},
cancleModifyDes() {
this.isModify = false;
},
changeSelectActionId(val, actionId, index) {
if (val) {
this.currentstepAction.push({'actionId':actionId, 'index':index});
if (this.currentstepAction.length >= 2) {
this.$refs.addStepDescription.doShow();
}
} else {
const data = this.currentstepAction.findIndex((value, index, arr)=>{ return value.actionId == actionId; });
this.currentstepAction.splice(data, 1);
}
},
changeSelectRadioActionId(val, actionId, index) {
this.formModel.operationStatisticVO.itemVOS[this.currentSelectStep].actionId = actionId;
this.isOperate = false;
this.currentSelectStep = '';
},
cancleDescription() {
this.currentstepAction.forEach(data=>{
this.checkBoxActionList[data.actionId].status = false;
});
this.currentstepAction = [];
},
submitDescription(stepDescription) {
this.currentstepAction.sort(this.objectSort('actionId'));
let start, end;
this.currentstepAction.forEach((data, index)=>{
if (index % 2 == 0) {
this.startArray.push(data.index);
start = data.index;
} else {
this.endArray.push(data.index);
end = data.index;
}
});
for (var i = start; i <= end; i++) {
this.$set(this.checkBoxActionList, this.actionList[i].id, {disabled:true});
}
this.$set(this.stepVOs, this.currentstepAction[0].actionId, {description:stepDescription, startActionId:parseInt(this.currentstepAction[0].actionId), endActionId:parseInt(this.currentstepAction[1].actionId)});
this.cancleDescription();
},
submitOperateStatistic(formModel) {
this.doUpdate(formModel);
},
objectSort(keyName) {
return function (objectN, objectM) {
var valueN = parseInt(objectN[keyName]);
var valueM = parseInt(objectM[keyName]);
if (valueN > valueM) return 1;
else if (valueN < valueM) return -1;
else return 0;
};
},
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
if (this.startArray.length > 0) {
if (columnIndex === 0) {
let rowspan = 1;
let colspan = 1;
for (var i = 0; i < this.startArray.length; i++) {
if (rowIndex == this.startArray[i]) {
rowspan = this.endArray[i] - this.startArray[i] + 1;
colspan = 1;
} else if (rowIndex > this.startArray[i] && rowIndex <= this.endArray[i]) {
rowspan = 0;
colspan = 0;
}
}
return {
rowspan:rowspan,
colspan:colspan
};
}
}
},
// doOperateStatistic() {
// this.$refs.operateStatistic.doShow(this.stepVOs, this.formModel.operationStatisticVO);
// },
handleDelete(index) {
this.formModel.operationStatisticVO.itemVOS.splice(index, 1);
},
addItemVO() {
this.formModel.operationStatisticVO.itemVOS.push({'description':'', actionId:'', type:'Time'});
},
selectStep(actionId, index) {
this.currentSelectStep = index;
this.radioBoxAction = actionId;
this.isOperate = true;
},
getSummaries(param) {
const { columns, data } = param;
const sums = [];
columns && columns.forEach((column, index) => {
if (index === 0) {
sums[index] = '总分值';
return;
}
if (index === 4) {
const values = [];
data.map(item =>{
if (item.memberId === '1' && (item.type == 'Conversation' || item.type == 'Operation')) {
values.push(item.id);
}
});
sums[index] = values.reduce((prev, curr) => {
let value = 0;
if (this.commandEvaluationRuleVOs[curr]) { value = Number(this.commandEvaluationRuleVOs[curr].score || 0); }
if (!isNaN(value)) {
return prev + value;
} else {
return Number(this.commandEvaluationRuleVOs[prev].score);
}
}, 0);
return;
}
});
return sums;
}
}
};
</script>
<style lang="scss" scoped>
.checkBoxAction{
display: inline-block;
float: left;
margin-right: 8px;
}
.input-new-tag {
width: 60px;
margin-left: 10px;
margin-bottom: 10px;
vertical-align: bottom;
}
.button-new-tag{
margin-bottom:10px;
}
.operateStatistic{
width: 1320px;
margin: 15px auto;
border: 1px #EBEEF5 solid;
}
.operateStatisticLT{
width: 300px;
padding: 10px;
border-bottom: 1px #EBEEF5 solid;
border-right: 1px solid #EBEEF5;
}
.operateStatisticLB{
padding: 10px;
border-right: 1px solid #EBEEF5;
}
.operateStatisticRT{
width: 950px;
padding: 10px;
border-bottom: 1px #EBEEF5 solid;
}
.operateStatisticRB{
padding: 10px;
}
.operateStatisticLIn{
text-align: left;
padding-left: 5px;
color: #909399;
}
.addOperateItem{
margin-left: 20px;
margin-top: 200px;
}
.deleteScene{
font-size: 24px;
color: #f00;
cursor: pointer;
}
.selectStep{
}
</style>
<style lang="scss">
.el-tag {
margin-right: 10px;
margin-bottom: 10px;
vertical-align:top;
}
</style>

162
src/views/drts/scene/operateStatistic.vue
View File

@ -1,162 +0,0 @@
<template>
<div v-if="dialogShow" class="OperateStatistic">
<div class="OperateStatisticIn">
<div class="OperateStatisticInName">编辑运营统计</div>
<div class="OperateStatisticContent">
<el-form ref="dataform" :rules="rules" :model="formModel" label-width="140px" class="statisticForm" @submit.native.prevent>
<el-form-item label="每一项分值" :required="true" prop="score">
<el-input-number
v-model="formModel.score"
:style="{width: '130px'}"
:min="0"
size="medium"
:max="100"
:step="1"
/>
</el-form-item>
<el-form-item label="运营统计项列表" :required="true" prop="itemVOS">
<el-button type="primary" size="small" style="margin-bottom:10px" @click="addItemVO">添加</el-button>
<el-table :data="formModel.itemVOS" border style="width:351px;" height="200">
<el-table-column prop="description" label="简介" width="150">
<template slot-scope="scope">
<el-input v-model="scope.row.description" type="text" :style="{width: '125px'}" size="small" :maxlength="100" />
</template>
</el-table-column>
<el-table-column prop="stepId" label="关联步骤" width="150">
<template slot-scope="scope">
<el-select v-model="scope.row.stepId" :style="{width: '125px'}" size="small">
<el-option
v-for="option in stepVOs"
:key="option.id"
:label="option.description"
:value="option.id"
/>
</el-select>
</template>
</el-table-column>
<el-table-column label="操作" width="50">
<template slot-scope="scope">
<span class="el-icon-error deleteScene" @click="handleDelete(scope.$index)" />
</template>
</el-table-column>
</el-table>
</el-form-item>
</el-form>
</div>
<div class="OperateStatistic-footer">
<el-button @click="roleDoClose">{{ $t('global.cancel') }}</el-button>
<el-button type="primary" @click="confirm">{{ $t('global.confirm') }}</el-button>
</div>
</div>
</div>
</template>
<script>
export default {
name:'OperateStatistic',
data() {
return {
dialogShow:false,
stepVOs:[],
formModel:{
score:0,
itemVOS:[]
// private String description;
// private Long stepId;
}
};
},
computed:{
rules() {
const crules = {
score: [
{ required: true, message: '请输入每一项分值', trigger: 'blur' },
{ required: true, message: '请输入每一项分值', trigger: 'change' }
]};
return crules;
// itemVOS
}
},
methods:{
roleDoClose() {
this.dialogShow = false;
},
confirm() {
const self = this;
this.$refs.dataform.validate(() => {
const itemVOS = self.formModel.itemVOS;
if (itemVOS.length > 0) {
let result = true;
itemVOS.forEach(item=>{
if (item.description && item.stepId) {
result = result && true;
} else {
result = result && false;
}
});
if (!result) {
this.$messageBox('请填写运营统计项列表');
}
}
this.dialogShow = false;
this.$emit('submitOperateStatistic', this.formModel);
});
},
doShow(stepVOs, operationStatisticVO) {
if (JSON.stringify(operationStatisticVO) != '{}') {
this.formModel = operationStatisticVO;
}
this.stepVOs = Object.values(stepVOs);
this.stepDescription = '';
this.dialogShow = true;
},
addItemVO() {
this.formModel.itemVOS.push({'description':'', stepId:''});
},
handleDelete(index) {
this.formModel.itemVOS.splice(index, 1);
}
}
};
</script>
<style lang="scss">
.OperateStatistic{
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
background: rgba(0,0,0,0.7);
z-index: 2;
}
.OperateStatisticIn{
width: 600px;
background: #fff;
left: 50%;
position: absolute;
transform: translate(-50%,-50%);
top: 40%;
height: 450px;
border-radius:4px;
}
.OperateStatistic-footer{
text-align: center;
}
.OperateStatisticInName{
font-size: 17px;
margin-top: 16px;
text-align: center;
}
.OperateStatisticContent{
padding: 20px 0px 0px 0px;
}
.statisticForm{
display: table;
margin-left: auto;
margin-right: auto;
}
.deleteScene{
font-size: 24px;
color: #f00;
cursor: pointer;
}
</style>

93
src/views/drts/scene/stepDescription.vue
View File

@ -1,93 +0,0 @@
<template>
<!-- <el-dialog
title="修改步骤名称"
:visible.sync="dialogShow"
top="50px"
width="350px"
:before-do-close="roleDoClose"
:close-on-click-modal="false"
>
<div>
<el-input v-model="stepDescription" type="text" :style="{width: '80%'}" :maxlength="80" />
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="roleDoClose">{{ $t('global.cancel') }}</el-button>
<el-button type="primary" @click="confirm">{{ $t('global.confirm') }}</el-button>
</span>
</el-dialog> -->
<div v-if="dialogShow" class="StepDescription">
<div class="StepDescriptionIn">
<div class="StepDescriptionInName">修改步骤名称</div>
<div class="StepDescriptionInInput">
<el-input v-model="stepDescription" type="text" :style="{width: '80%'}" :maxlength="80" />
</div>
<div class="StepDescription-footer">
<el-button @click="roleDoClose">{{ $t('global.cancel') }}</el-button>
<el-button type="primary" @click="confirm">{{ $t('global.confirm') }}</el-button>
</div>
</div>
</div>
</template>
<script>
export default {
name:'StepDescription',
data() {
return {
dialogShow:false,
stepDescription:''
};
},
methods:{
roleDoClose() {
this.dialogShow = false;
this.$emit('cancleDescription');
},
confirm() {
if (this.stepDescription.trim().length > 0) {
this.dialogShow = false;
this.$emit('submitDescription', this.stepDescription);
}
},
doShow() {
this.stepDescription = '';
this.dialogShow = true;
}
}
};
</script>
<style lang="scss">
.StepDescription{
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
background: rgba(0,0,0,0.7);
z-index: 2;
}
.StepDescriptionIn{
width: 350px;
background: #fff;
left: 50%;
position: absolute;
transform: translate(-50%,-50%);
top: 40%;
height: 240px;
border-radius:4px;
}
.StepDescription-footer{
text-align: center;
}
.StepDescriptionInName{
font-size: 17px;
margin-top: 16px;
text-align: center;
}
.StepDescriptionInInput{
margin-top: 30px;
margin-bottom: 40px;
text-align: center;
padding: 0px 20px;
}
</style>

449
src/views/drts/scene/trainingResult.vue
View File

@ -1,449 +0,0 @@
<template>
<div style="width: 100%;height: 100%">
<div style="position: absolute;top: 61px;width: 100%;background: #fff;z-index: 9;height: 90px;">
<el-row>
<div class="title-text">场景语音训练结果</div>
</el-row>
<el-row v-loading="loading">
<el-col :span="6" :offset="1">
<span>用户：</span>
<el-select v-model="userId" size="mini" filterable placeholder="请选择">
<el-option
v-for="item in userList"
:key="item.id"
:label="item.name"
:value="item.id"
/>
</el-select>
</el-col>
<el-col :span="4" :offset="13">
<el-button size="mini" type="primary" @click="queryData">查询</el-button>
<el-button size="mini" type="primary" @click="goBack">返回</el-button>
</el-col>
</el-row>
</div>
<el-table v-loading="loading" :data="actionList" border style="width:96%;margin: 90px auto 0;" :span-method="objectSpanMethod">
<el-table-column label="动作id" width="70" prop="id" />
<el-table-column label="动作内容" width="350">
<template slot-scope="scope">
<!-- v-model="scope.row.id" -->
<el-checkbox v-if="isModify" v-model="checkBoxActionList[scope.row.id].status" :disabled="checkBoxActionList[scope.row.id].disabled" class="checkBoxAction" @change="((val)=>{changeSelectActionId(val, scope.row.id, scope.$index)})" />
<el-radio v-if="isOperate" v-model="radioBoxAction" :label="scope.row.id" name="operateAction" class="checkBoxAction" @change="((val)=>{changeSelectRadioActionId(val, scope.row.id, scope.$index)})">{{ '' }}</el-radio>
<div>{{ covert(scope.row) }}</div>
</template>
</el-table-column>
<el-table-column label="语音识别关键词列表" width="350">
<template v-if="scope.row.type=='Conversation'&&scope.row.memberId=='1'" slot-scope="scope">
<div v-if="commandEvaluationRuleVOs[scope.row.id]&&commandEvaluationRuleVOs[scope.row.id].keyWords">
<el-tag v-for="(tag,index) in commandEvaluationRuleVOs[scope.row.id].keyWords" :key="index" :disable-transitions="false">{{ tag }}</el-tag>
</div>
</template>
</el-table-column>
<el-table-column label="录音" width="80">
<template slot-scope="scope">
<el-button v-if="scope.row.filePath" class="chat-box-footer-create" style="background: #F2F2F2;color: #000;font-size: 40px;" @click="audioPlay(scope.row)">
<i v-if="audioPlayId !== scope.row.id" class="el-icon-video-play" />
<i v-else class="el-icon-video-pause" />
</el-button>
</template>
</el-table-column>
<el-table-column label="转译结果" prop="result" />
<el-table-column label="错误关键字">
<template slot-scope="scope">
<el-tag v-for="(tag,index) in scope.row.wrongKeyWords" :key="index" :disable-transitions="false">{{ tag }}</el-tag>
</template>
</el-table-column>
<el-table-column label="错误发音">
<template slot-scope="scope">
<el-tag v-for="(tag,index) in scope.row.wrongTripNumbers" :key="index" :disable-transitions="false">{{ tag }}</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="80">
<template slot-scope="scope">
<el-button v-if="scope.row.recordId" type="text" @click="checkAudio(scope.row,scope.$index)">重新校验</el-button>
</template>
</el-table-column>
</el-table>
<audio id="audioPlay" style="display:none" />
</div>
</template>
<script>
import {getScriptByIdNew} from '@/api/script';
import { getCompetitionPracticalSceneById } from '@/api/competition';
import { loadMapDataById } from '@/utils/loaddata';
import ConstConfig from '@/scripts/ConstConfig';
import Cookies from 'js-cookie';
import {covertOperate} from '@/views/newMap/displayNew/scriptDisplay/component/covertOperation';
import { audioFilesCheck, getHavaAudoUserList, audioFilesCheckAllSence } from '@/api/competition';
export default {
name: 'VoiceTraining',
data() {
return {
actionList:[],
startArray: [],
endArray: [],
jsonData: '',
stepVOs: {},
memberList: [],
isModify:false,
isOperate:false,
commandEvaluationRuleVOs:{},
audioDataMap: {},
userList: [],
userId: '',
resultMap: {},
loading: false,
audioPlayId: '',
baseUrl:this.$store.state.user.ossUrl
};
},
watch: {
'$store.state.map.mapDataLoadedCount': function (val) {
this.parseMember();
}
},
mounted() {
this.initFunction();
},
methods: {
async initFunction() {
const userListData = await getHavaAudoUserList(this.$route.query.sceneId);
this.userList = userListData.data;
const scriptData = await getScriptByIdNew(this.$route.query.scriptId);
const dispatcher = scriptData.data.memberList.find(member => member.type === 'DISPATCHER');
this.actionList = scriptData.data.actionList.filter(action => {
action.wrongKeyWords = [];
action.wrongTripNumbers = [];
action.result = '';
action.recordId = '';
action.filePath = '';
return action.type === 'Conversation' && action.memberId == dispatcher.id;
});
this.jsonData = scriptData;
const competitionData = await getCompetitionPracticalSceneById(this.$route.query.sceneId);
const commandEvaluationRuleVOs = {};
if (competitionData.data.commandEvaluationRuleVOs) {
competitionData.data.commandEvaluationRuleVOs.forEach(data=>{
commandEvaluationRuleVOs[data.actionId] = data;
});
}
const stepVOs = {};
if (competitionData.data.stepVOs) {
competitionData.data.stepVOs.forEach(data=>{
stepVOs[data.startActionId] = data;
const dataIndex = this.actionList.findIndex((value, index, arr)=>{ return value.id == data.startActionId; });
const dataIndex1 = this.actionList.findIndex((value, index, arr)=>{ return value.id == data.endActionId; });
this.startArray.push(dataIndex);
this.endArray.push(dataIndex1);
});
}
this.commandEvaluationRuleVOs = commandEvaluationRuleVOs;
this.stepVOs = stepVOs;
loadMapDataById(scriptData.data.mapId, 'parse');
},
audioPlay(row) {
const audioUrl = this.baseUrl + row.filePath;
const that = this;
if (this.audioPlayId === row.id) {
this.audioPlayId = '';
document.querySelector('#audioPlay').pause();
} else if (this.audioPlayId) {
document.querySelector('#audioPlay').pause();
this.audioPlayId = row.id;
document.querySelector('#audioPlay').src = audioUrl;
document.querySelector('#audioPlay').play();
document.querySelector('#audioPlay').onended = function() {
that.audioPlayId = '';
};
} else {
this.audioPlayId = row.id;
document.querySelector('#audioPlay').src = audioUrl;
document.querySelector('#audioPlay').play();
document.querySelector('#audioPlay').onended = function() {
that.audioPlayId = '';
};
}
},
queryData() {
if (this.userId) {
this.loading = true;
audioFilesCheckAllSence(this.$route.query.sceneId, this.userId).then(resp => {
this.actionList.forEach(item => {
item.result = '';
item.wrongKeyWords = [];
item.wrongTripNumbers = [];
item.recordId = '';
item.filePath = '';
});
(resp.data || []).forEach(elem => {
this.actionList.forEach(item => {
if (elem.actionId === item.id) {
item.result = elem.result;
item.wrongKeyWords = elem.keyWords;
item.wrongTripNumbers = elem.tripNumbers;
item.recordId = elem.recordId;
item.filePath = elem.filePath;
}
});
});
this.loading = false;
}).catch(() => {
this.loading = false;
this.$message.error('获取校验数据异常！');
});
} else {
this.$message.error('请选择语音录制用户！');
}
},
parseMember() {
const stationMap = {};
const stationList = this.$store.state.map.map.stationList;
stationList.forEach(station=>{
stationMap[station.code] = station;
});
let lastData = JSON.stringify(this.jsonData.data.memberList);
const roleTypeList = ConstConfig.ConstSelect.roleTypeNew;
roleTypeList.forEach(function(element) {
const rolename = element.value;
if (Cookies.get('user_lang') == 'en') {
lastData = lastData.replace(new RegExp(rolename, 'g'), element.enLabel);
} else {
lastData = lastData.replace(new RegExp(rolename, 'g'), element.label);
}
});
lastData = JSON.parse(lastData);
const lastMemberList = {};
lastData.forEach((member, index)=>{
const userName = member.userName ? '-' + member.userName : '';
const name = member.name ? '-' + member.name : '';
if (member.deviceCode && member.type == '行值') {
const device = stationMap[member.deviceCode];
member.deviceName = device.name;
member.label = member.type + member.deviceName + name + userName;
member.normalName = member.type + member.deviceName + name;
} else if (member.deviceCode && member.type == '司机') {
member.deviceName = member.deviceCode;
member.label = member.type + member.deviceName + name + userName;
} else {
member.deviceName = '';
member.label = member.type + name + userName;
member.normalName = member.type + name;
}
lastMemberList[member.id] = member;
this.memberList = lastMemberList;
});
},
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
if (this.startArray.length > 0) {
if (columnIndex === 0) {
let rowspan = 1;
let colspan = 1;
for (var i = 0; i < this.startArray.length; i++) {
if (rowIndex == this.startArray[i]) {
rowspan = this.endArray[i] - this.startArray[i] + 1;
colspan = 1;
} else if (rowIndex > this.startArray[i] && rowIndex <= this.endArray[i]) {
rowspan = 0;
colspan = 0;
}
}
return {
rowspan:rowspan,
colspan:colspan
};
}
}
},
checkAudio(row, index) {
this.loading = true;
const commandEvaluationRule = this.commandEvaluationRuleVOs[row.id];
const params = {
id: commandEvaluationRule.id,
actionId: commandEvaluationRule.actionId,
actionVO: {content: row.content},
keyWords: commandEvaluationRule.keyWords
};
audioFilesCheck(row.recordId, params).then(resp => {
this.actionList[index].result = resp.data.result;
this.actionList[index].wrongKeyWords = resp.data.keyWords;
this.actionList[index].wrongTripNumbers = resp.data.tripNumbers;
this.loading = false;
}).catch((e) => {
this.loading = false;
this.$message.error('校验语音数据失败！');
});
},
goBack() {
this.$router.go(-1);
},
covert(element) {
const member = this.memberList[element.memberId] || {};
let resultData = '';
if (element.type == 'Accept_Conversation_Invitation') {
resultData = member.label + '请接受会话邀请';
} else if (element.type == 'Conversation') {
resultData = member.label + '说：' + element.content;
} else if (element.type == 'Operation') {
resultData = covertOperate(element.operationType, element.operationParamMap);
resultData = resultData.replace('请', member.label);
// this.scriptTipMessage = '请找到' + deviceName + '，执行【' + operateName.label + '】操作';
} else if (element.type == 'Exit_Conversation') {
resultData = member.label + '结束当前会话';
} else if (element.type == 'Start_Conversation' ) {
const inviteMember = [];
// this.$emit('allowCreatCoversition');
if (element.communicationObject) {
if (element.communicationObject == 'ALL_STATION') {
inviteMember.push('所有车站');
} else if (element.communicationObject == 'ALL_TRAIN') {
inviteMember.push('所有司机');
}
} else {
element.conversationMemberIds.forEach(id=>{
if (element.memberId != id) {
inviteMember.push((this.memberList[id] || {label: ''}).label);
}
});
}
resultData = member.label + '创建会话,选择' + inviteMember.toString();
} else if (element.type == 'Command') {
const targetName = this.memberList[element.commandInitiateVO.targetMemberId];
const CommandList = {
Drive_Ahead:'确认运行至前方站',
Route_Block_Drive:'进路闭塞法行车',
Switch_Hook_Lock: '道岔钩锁',
Drive_Through_The_Red_Light:'越红灯行驶',
Drive_Through_The_Guide_Signal:'越引导信号行驶',
Open_Or_Close_Door:'开关门',
Set_Speed_Limit:'设置限速',
Turn_Direction: '换端',
Drive_To: '驾驶至',
Apply_URM_Mode: '转URM模式',
Apply_RM_Mode: '转RM模式',
Apply_CM_Mode: '转CM模式',
Apply_AM_Mode: '转AM模式'
};
resultData = member.label + '对【' + targetName.label + '】下达【' + CommandList[element.commandInitiateVO.commandType] + '】指令';
} else if (element.type == 'Drive') {
if (element.targetSectionCode) {
const section = this.$store.getters['map/getDeviceByCode'](element.targetSectionCode);
if (section && section.name) {
resultData = member.label + '把车开到区段' + section.name;
}
}
}
return resultData;
},
getUrl(el) {
return `https://joylink.club/oss/joylink${el.filePath}`;
},
covertTime(time) {
const date = new Date(time);
let hour = date.getHours();
let minute = date.getMinutes();
let second = date.getSeconds();
hour = hour > 9 ? hour : '0' + hour;
minute = minute > 9 ? minute : '0' + minute;
second = second > 9 ? second : '0' + second;
return hour + ':' + minute + ':' + second;
}
}
};
</script>
<style lang="scss" scoped>
.record_progress_bar{
width: 40px;
height: 40px;
position: absolute;
left: 0;
top: 0;
border-radius: 50%;
}
.userHeader{margin-bottom: 2px;}
.userChatTime{font-size: 12px;display:inline-block;}
.chatContentInClass{
display: inline-block;
width: 100%;
border: 1px solid #f1f1f1;
}
.leftUser{
float: left;
margin-left: 10px;
margin-top: 10px;
display: inline-block;
}
.chat-box-footer-create{
font-size: 16px;
text-align: center;
color: #fff;
position: relative;
left: 5px;
top: 6px;
line-height: 30px;
cursor: pointer;
width: 40px;
height: 40px;
border-radius: 50%;
background: green;
border: none;
display: flex;
justify-content: center;
align-items: center;
}
.chat-box-footer-send{
background: #F2F2F2;
right: 55px;
cursor: pointer;
.icon-yuyin{
color: #333;
font-size: 24px;
margin: 0;
}
&.active{
.icon-yuyin{
color: green;
}
}
.close_icon{
position: absolute;
top: 8px;
left: 45px;
font-size: 16px;
color: #333;
font-weight: 600;
padding: 3px;
}
}
.deleteRecord{}
.title-text{
font-size: 26px;
height: 50px;
line-height: 50px;
width: 100%;
text-align: center;
}
.chat-box-footer-create{
font-size: 16px;
text-align: center;
color: #fff;
position: relative;
left: 5px;
top: 6px;
line-height: 30px;
cursor: pointer;
width: 40px;
height: 40px;
border-radius: 50%;
background: green;
border: none;
display: flex;
justify-content: center;
align-items: center;
}
/deep/.el-table .el-table__row .cell{
min-height: 50px;
}
</style>

275
src/views/drts/scene/update.vue
View File

@ -1,275 +0,0 @@
<template>
<el-dialog title="修改场景" :visible.sync="dialogVisible" width="1000px" :before-close="doClose" center custom-class="sceneModifyOut">
<el-form ref="form" :rules="rules" :model="formModel" label-width="120px" class="sceneModify">
<el-form-item label="场景名称" :required="true" prop="name">
<el-input v-model="formModel.name" type="text" :style="{width: '80%'}" :maxlength="80" />
</el-form-item>
<el-form-item label="场景描述" :required="true" prop="description">
<el-input v-model="formModel.description" type="textarea" :style="{width: '80%'}" />
</el-form-item>
<el-form-item label="处置流程" :required="true" prop="disposalProcesses">
<el-input v-model="formModel.disposalProcesses" type="textarea" :style="{width: '80%'}" />
</el-form-item>
<el-form-item label="步骤描述" :required="true" prop="stepVOs">
<el-button type="primary" size="small" style="margin-bottom:10px" @click="addStepVO">添加</el-button>
<el-table :data="formModel.stepVOs" border style="width: 661px;">
<el-table-column prop="description" label=" 简介" width="200">
<template slot-scope="scope">
<!-- <el-form-item :prop="'stepVOs[' + scope.$index + '].description'"> -->
<el-input v-model="scope.row.description" type="text" :style="{width: '170px'}" size="small" />
<!-- </el-form-item> -->
</template>
</el-table-column>
<el-table-column prop="startActionId" label=" 首动作" width="200">
<template slot-scope="scope">
<!-- <el-form-item :prop="'stepVOs+[' + scope.$index + '].startActionId'"> -->
<el-select v-model="scope.row.startActionId" type="textarea" :style="{width: '170px'}" size="small">
<el-option
v-for="option in actionList"
:key="option.id"
:label="option.name"
:value="option.id"
/>
</el-select>
<!-- </el-form-item> -->
</template>
</el-table-column>
<el-table-column prop="endActionId" label=" 尾动作" width="200">
<template slot-scope="scope">
<el-select v-model="scope.row.endActionId" type="textarea" :style="{width: '170px'}" size="small">
<el-option
v-for="option in actionList"
:key="option.id"
:label="option.name"
:value="option.id"
/>
</el-select>
</template>
</el-table-column>
<el-table-column label="操作" width="60">
<template slot-scope="scope">
<span class="el-icon-error deleteScene" @click="handleDelete(scope.$index)" />
</template>
</el-table-column>
</el-table>
</el-form-item>
<el-form-item label=" 指令下达规则" :required="true" prop="commandPublishStatistics">
<el-button type="primary" size="small" style="margin-bottom:10px" @click="addStatistics">添加</el-button>
<el-table :data="formModel.commandPublishStatistics" border style="width: 751px;">
<el-table-column prop="keyWords" label=" 语音识别关键词列表" width="250">
<template slot-scope="scope" style="font-size:0">
<el-tag v-for="(tag,index) in scope.row.keyWords" :key="index" closable :disable-transitions="false" @close="handleClose(scope.$index,index)">{{ tag }}</el-tag>
<el-input
v-if="scope.row.inputVisible"
:ref="'saveTagInput'+scope.$index"
v-model="scope.row.inputValue"
size="small"
class="input-new-tag"
@keyup.enter.native="handleInputConfirm(scope.$index)"
@blur="handleInputConfirm(scope.$index)"
/>
<el-button v-else class="button-new-tag" size="small" @click="showInput(scope.$index)">添加</el-button>
</template>
</el-table-column>
<el-table-column prop="actionId" label="动作" width="200">
<template slot-scope="scope">
<el-select v-model="scope.row.actionId" type="textarea" :style="{width: '170px'}" size="small">
<el-option
v-for="option in actionList"
:key="option.id"
:label="option.name"
:value="option.id"
/>
</el-select>
</template>
</el-table-column>
<el-table-column prop="timeOut" label="超时时间" width="150">
<template slot-scope="scope">
<el-input-number
v-model="scope.row.timeOut"
:style="{width: '100px'}"
:min="0"
size="small"
:max="Infinity"
:step="1"
/>
</template>
</el-table-column>
<el-table-column prop="score" label="总分值" width="150">
<template slot-scope="scope">
<el-input-number
v-model="scope.row.score"
:style="{width: '100px'}"
:min="0"
size="small"
:max="Infinity"
:step="1"
/>
</template>
</el-table-column>
</el-table>
</el-form-item>
<el-form-item label="运营部分总分" :required="true" prop="operationScore">
<el-input-number v-model="formModel.operationScore" :controls="true" :min="0" :max="100" :step="1" />
</el-form-item>
<el-form-item label="关联剧本" :required="true" prop="scriptId">
<!-- <el-input-number v-model="formModel.scriptId" :controls="true" :min="0" :max="100" :step="1" /> -->
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="doUpdate">{{ $t('global.confirm') }}</el-button>
<el-button @click="doClose">{{ $t('global.cancel') }}</el-button>
</span>
</el-dialog>
</template>
<script>
export default {
name:'UpdateScene',
props: {
scriptList:{
type: Array,
default() {
return [];
}
}
},
data() {
return {
dialogVisible:false,
sceneId:'',
actionList:[],
formModel:{
name:'', // 场景名称
description:'', // 场景描述
disposalProcesses:'', // 处置流程
scriptId:'', // 剧本id
operationScore:0, // 运营部分总分（站间停车等）
main:true, // 是否主场景
stepVOs:[], // 步骤描述
commandPublishStatistics:[] // 指令下达规则列表
}
};
},
computed:{
rules() {
const crules = {
name: [
{ required: true, validator: this.validateSceneName, trigger: 'blur' },
{ required: true, validator: this.validateSceneName, trigger: 'change' }
],
description: [
{ required: true, validator: this.validateDescription, trigger: 'blur' },
{ required: true, validator: this.validateDescription, trigger: 'change' }
],
disposalProcesses: [
{ required: true, validator: this.validateDisposalProcesses, trigger: 'blur' },
{ required: true, validator: this.validateDisposalProcesses, trigger: 'change' }
],
scriptId:[
{ required: true, message: '请选择剧本', trigger: 'change' }
],
operationScore:[
{ required: true, message: '请输入运营部分总分', trigger: 'blur' }
]
};
return crules;
}
},
methods:{
validateSceneName(rule, value, callback) {
if (value.trim().length === 0) {
this.formModel.name = this.formModel.name.replace(/\s/g, '');
return callback(new Error('请输入场景名称'));
} else {
return callback();
}
},
validateDescription(rule, value, callback) {
if (value.trim().length === 0) {
this.formModel.description = this.formModel.description.replace(/\s/g, '');
return callback(new Error('请输入场景描述'));
} else {
return callback();
}
},
validateDisposalProcesses(rule, value, callback) {
if (value.trim().length === 0) {
this.formModel.disposalProcesses = this.formModel.disposalProcesses.replace(/\s/g, '');
return callback(new Error('请输入处置流程'));
} else {
return callback();
}
},
doShow(sceneId) {
this.dialogVisible = true;
this.sceneId = sceneId;
},
doClose() {
this.$refs.form.resetFields();
this.dialogVisible = false;
},
doUpdate() {
},
addStepVO() {
this.formModel.stepVOs.push({competitionId:this.sceneId, description:'', startActionId:'', endActionId:''});
},
addStatistics() {
this.formModel.commandPublishStatistics.push({competitionId:this.sceneId, keyWords:[], actionId:'', timeOut:0, inputVisible:false, inputValue:'', score:0 });
},
handleDelete(index) {
this.formModel.stepVOs.splice(index, 1);
},
handleClose(index, tagIndex) {
const keyWords = this.formModel.commandPublishStatistics[index].keyWords;
keyWords.splice(tagIndex, 1);
},
handleInputConfirm(index) {
const inputValue = this.formModel.commandPublishStatistics[index].inputValue;
if (inputValue) {
this.formModel.commandPublishStatistics[index].keyWords.push(inputValue);
}
this.formModel.commandPublishStatistics[index].inputVisible = false;
this.formModel.commandPublishStatistics[index].inputValue = '';
},
showInput(index) {
this.formModel.commandPublishStatistics[index].inputVisible = true;
this.$nextTick(_ => {
this.$refs['saveTagInput' + index].$refs.input.focus();
});
}
}
};
</script>
<style lang="scss" scoped>
.deleteScene{
font-size: 24px;
color: #f00;
cursor: pointer;
}
.sceneModify{
height:500px;
overflow: auto;
}
.input-new-tag {
width: 60px;
margin-left: 10px;
margin-bottom: 10px;
vertical-align: bottom;
}
.button-new-tag{
margin-bottom:10px;
}
</style>
<style lang="scss">
.sceneModifyOut.el-dialog--center .el-dialog__body {
text-align: initial;
padding: 25px 10px 30px 10px;
}
.el-tag {
margin-right: 10px;
margin-bottom: 10px;
vertical-align:top;
}
</style>

516
src/views/drts/scene/voiceTraining.vue
View File

@ -1,516 +0,0 @@
<template>
<div style="width: 100%;height: 100%">
<div class="title-text">场景语音训练</div>
<el-button size="mini" type="primary" style="position: absolute;top: 80px;right: 30px;z-index: 10;" @click="goBack">返回</el-button>
<el-table :data="actionList" border style="width:96%;margin: 60px auto 0;" :span-method="objectSpanMethod">
<el-table-column label="动作id" width="70" prop="id" />
<el-table-column label="动作内容" width="350">
<template slot-scope="scope">
<!-- v-model="scope.row.id" -->
<el-checkbox v-if="isModify" v-model="checkBoxActionList[scope.row.id].status" :disabled="checkBoxActionList[scope.row.id].disabled" class="checkBoxAction" @change="((val)=>{changeSelectActionId(val, scope.row.id, scope.$index)})" />
<el-radio v-if="isOperate" v-model="radioBoxAction" :label="scope.row.id" name="operateAction" class="checkBoxAction" @change="((val)=>{changeSelectRadioActionId(val, scope.row.id, scope.$index)})">{{ '' }}</el-radio>
<div>{{ covert(scope.row) }}</div>
</template>
</el-table-column>
<el-table-column label="语音识别关键词列表" width="350">
<template v-if="scope.row.type=='Conversation'&&scope.row.memberId=='1'" slot-scope="scope">
<div v-if="commandEvaluationRuleVOs[scope.row.id]&&commandEvaluationRuleVOs[scope.row.id].keyWords">
<el-tag v-for="(tag,index) in commandEvaluationRuleVOs[scope.row.id].keyWords" :key="index" :disable-transitions="false">{{ tag }}</el-tag>
</div>
</template>
</el-table-column>
<el-table-column label="录音" width="140">
<template slot-scope="scope">
<div style="display: flex;">
<el-button class="chat-box-footer-create chat-box-footer-send" :disabled="recordSendingId !== scope.row.id && !!recordSendingId" :class="{'active': recordSendingId == scope.row.id}" size="mini" type="primary" @click="startRecording(scope.row)">
<el-progress v-if="recordSendingId == scope.row.id" class="record_progress_bar" type="circle" :show-text="false" :percentage="100/60*seconds" :width="40" :stroke-width="2" status="success" />
<i v-if="recordSendingId == scope.row.id" class="el-icon-close close_icon" @click.stop="cancleRecording()" />
<span class="iconfont icon-yuyin">&#xe62b;</span>
</el-button>
<el-button v-if="audioDataMap[scope.row.id]" class="chat-box-footer-create" style="background: #F2F2F2;color: #000;font-size: 40px;" @click="audioPlay(scope.row)">
<i v-if="audioPlayId !== scope.row.id" class="el-icon-video-play" />
<i v-else class="el-icon-video-pause" />
</el-button>
</div>
</template>
</el-table-column>
<el-table-column label="转译结果" prop="result" />
<el-table-column label="错误关键字">
<template slot-scope="scope">
<el-tag v-for="(tag,index) in scope.row.wrongKeyWords" :key="index" :disable-transitions="false">{{ tag }}</el-tag>
</template>
</el-table-column>
<el-table-column label="错误发音">
<template slot-scope="scope">
<el-tag v-for="(tag,index) in scope.row.wrongTripNumbers" :key="index" :disable-transitions="false">{{ tag }}</el-tag>
</template>
</el-table-column>
<el-table-column label="操作" width="80">
<template slot-scope="scope">
<el-button v-if="audioDataMap[scope.row.id]" type="text" @click="checkAudio(scope.row.id, scope.row.content ,scope.$index)">校验</el-button>
</template>
</el-table-column>
</el-table>
<audio id="audioPlay" style="display:none" />
</div>
</template>
<script>
import {getScriptByIdNew} from '@/api/script';
import { getCompetitionPracticalSceneById } from '@/api/competition';
import { loadMapDataById } from '@/utils/loaddata';
import ConstConfig from '@/scripts/ConstConfig';
import Cookies from 'js-cookie';
import {covertOperate} from '@/views/newMap/displayNew/scriptDisplay/component/covertOperation';
import RecordRTC from 'recordrtc';
import { uploadAudioFilesInSence, updateAuidoFilesInSence, getAudioFilesList, audioFilesCheck } from '@/api/competition';
export default {
name: 'VoiceTraining',
data() {
return {
actionList:[],
startArray: [],
endArray: [],
jsonData: '',
stepVOs: {},
memberList: [],
isModify:false,
isOperate:false,
commandEvaluationRuleVOs:{},
seconds: 0,
recordSending: false,
recorders: null,
microphone:null,
recordSendingId: null,
audioDataMap: {},
audioPlayId: '',
baseUrl:this.$store.state.user.ossUrl
};
},
watch: {
'$store.state.map.mapDataLoadedCount': function (val) {
this.parseMember();
}
},
mounted() {
this.initFunction();
},
methods: {
initFunction() {
getScriptByIdNew(this.$route.query.scriptId).then(res=>{
const dispatcher = res.data.memberList.find(member => member.type === 'DISPATCHER');
this.actionList = res.data.actionList.filter(action=>{
action.wrongKeyWords = [];
action.wrongTripNumbers = [];
action.result = '';
return action.type == 'Conversation' && action.memberId == dispatcher.id;
});
this.jsonData = res;
getCompetitionPracticalSceneById(this.$route.query.sceneId).then(response=>{
const commandEvaluationRuleVOs = {};
if (response.data.commandEvaluationRuleVOs) {
response.data.commandEvaluationRuleVOs.forEach(data=>{
commandEvaluationRuleVOs[data.actionId] = data;
});
}
const stepVOs = {};
if (response.data.stepVOs) {
response.data.stepVOs.forEach(data=>{
stepVOs[data.startActionId] = data;
const dataIndex = this.actionList.findIndex((value, index, arr)=>{ return value.id == data.startActionId; });
const dataIndex1 = this.actionList.findIndex((value, index, arr)=>{ return value.id == data.endActionId; });
this.startArray.push(dataIndex);
this.endArray.push(dataIndex1);
});
}
this.commandEvaluationRuleVOs = commandEvaluationRuleVOs;
this.stepVOs = stepVOs;
});
// 加载地图数据
loadMapDataById(res.data.mapId, 'parse');
getAudioFilesList(this.$store.state.user.id, this.$route.query.sceneId).then(resp => {
resp.data.forEach(item => {
this.audioDataMap[item.actionId] = item;
});
});
});
},
parseMember() {
const stationMap = {};
const stationList = this.$store.state.map.map.stationList;
stationList.forEach(station=>{
stationMap[station.code] = station;
});
let lastData = JSON.stringify(this.jsonData.data.memberList);
const roleTypeList = ConstConfig.ConstSelect.roleTypeNew;
roleTypeList.forEach(function(element) {
const rolename = element.value;
if (Cookies.get('user_lang') == 'en') {
lastData = lastData.replace(new RegExp(rolename, 'g'), element.enLabel);
} else {
lastData = lastData.replace(new RegExp(rolename, 'g'), element.label);
}
});
lastData = JSON.parse(lastData);
const lastMemberList = {};
lastData.forEach((member, index)=>{
const userName = member.userName ? '-' + member.userName : '';
const name = member.name ? '-' + member.name : '';
if (member.deviceCode && member.type == '行值') {
const device = stationMap[member.deviceCode];
member.deviceName = device.name;
member.label = member.type + member.deviceName + name + userName;
member.normalName = member.type + member.deviceName + name;
} else if (member.deviceCode && member.type == '司机') {
member.deviceName = member.deviceCode;
member.label = member.type + member.deviceName + name + userName;
} else {
member.deviceName = '';
member.label = member.type + name + userName;
member.normalName = member.type + name;
}
lastMemberList[member.id] = member;
this.memberList = lastMemberList;
});
this.loading = false;
},
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
if (this.startArray.length > 0) {
if (columnIndex === 0) {
let rowspan = 1;
let colspan = 1;
for (var i = 0; i < this.startArray.length; i++) {
if (rowIndex == this.startArray[i]) {
rowspan = this.endArray[i] - this.startArray[i] + 1;
colspan = 1;
} else if (rowIndex > this.startArray[i] && rowIndex <= this.endArray[i]) {
rowspan = 0;
colspan = 0;
}
}
return {
rowspan:rowspan,
colspan:colspan
};
}
}
},
checkAudio(actionId, content, index) {
const commandEvaluationRule = this.commandEvaluationRuleVOs[actionId];
const params = {
id: commandEvaluationRule.id,
actionId: commandEvaluationRule.actionId,
actionVO: {content: content},
keyWords: commandEvaluationRule.keyWords
};
const record = this.audioDataMap[actionId];
audioFilesCheck(record.id, params).then(resp => {
this.actionList[index].result = resp.data.result;
this.actionList[index].wrongKeyWords = resp.data.keyWords;
this.actionList[index].wrongTripNumbers = resp.data.tripNumbers;
}).catch((e) => {
this.$message.error('校验语音数据失败！');
});
},
goBack() {
this.$router.go(-1);
},
covert(element) {
const member = this.memberList[element.memberId] || {};
let resultData = '';
if (element.type == 'Accept_Conversation_Invitation') {
resultData = member.label + '请接受会话邀请';
} else if (element.type == 'Conversation') {
resultData = member.label + '说：' + element.content;
} else if (element.type == 'Operation') {
resultData = covertOperate(element.operationType, element.operationParamMap);
resultData = resultData.replace('请', member.label);
// this.scriptTipMessage = '请找到' + deviceName + '，执行【' + operateName.label + '】操作';
} else if (element.type == 'Exit_Conversation') {
resultData = member.label + '结束当前会话';
} else if (element.type == 'Start_Conversation' ) {
const inviteMember = [];
// this.$emit('allowCreatCoversition');
if (element.communicationObject) {
if (element.communicationObject == 'ALL_STATION') {
inviteMember.push('所有车站');
} else if (element.communicationObject == 'ALL_TRAIN') {
inviteMember.push('所有司机');
}
} else {
element.conversationMemberIds.forEach(id=>{
if (element.memberId != id) {
inviteMember.push((this.memberList[id] || {label: ''}).label);
}
});
}
resultData = member.label + '创建会话,选择' + inviteMember.toString();
} else if (element.type == 'Command') {
const targetName = this.memberList[element.commandInitiateVO.targetMemberId];
const CommandList = {
Drive_Ahead:'确认运行至前方站',
Route_Block_Drive:'进路闭塞法行车',
Switch_Hook_Lock: '道岔钩锁',
Drive_Through_The_Red_Light:'越红灯行驶',
Drive_Through_The_Guide_Signal:'越引导信号行驶',
Open_Or_Close_Door:'开关门',
Set_Speed_Limit:'设置限速',
Turn_Direction: '换端',
Drive_To: '驾驶至',
Apply_URM_Mode: '转URM模式',
Apply_RM_Mode: '转RM模式',
Apply_CM_Mode: '转CM模式',
Apply_AM_Mode: '转AM模式'
};
resultData = member.label + '对【' + targetName.label + '】下达【' + CommandList[element.commandInitiateVO.commandType] + '】指令';
} else if (element.type == 'Drive') {
if (element.targetSectionCode) {
const section = this.$store.getters['map/getDeviceByCode'](element.targetSectionCode);
if (section && section.name) {
resultData = member.label + '把车开到区段' + section.name;
}
}
}
return resultData;
},
audioPlay(row) {
const audioUrl = this.baseUrl + this.audioDataMap[row.id].filePath;
const that = this;
if (this.audioPlayId === row.id) {
this.audioPlayId = '';
document.querySelector('#audioPlay').pause();
} else if (this.audioPlayId) {
document.querySelector('#audioPlay').pause();
this.audioPlayId = row.id;
document.querySelector('#audioPlay').src = audioUrl;
document.querySelector('#audioPlay').play();
document.querySelector('#audioPlay').onended = function() {
that.audioPlayId = '';
};
} else {
this.audioPlayId = row.id;
document.querySelector('#audioPlay').src = audioUrl;
document.querySelector('#audioPlay').play();
document.querySelector('#audioPlay').onended = function() {
that.audioPlayId = '';
};
}
},
cancleRecording() {
this.recordSendingId = null;
if (this.microphone) {
clearInterval(this.inter);
this.seconds = 0;
this.microphone.stop();
this.microphone = null;
this.recordSending = false;
this.recorders = null;
}
},
// 停止录制 发送语音
stopRecording(actionId) {
this.audioPlay = true;
this.recordSendingId = null;
const that = this;
this.recorders.stopRecording(function(blobURL) {
clearInterval(that.inter);
that.seconds = 0;
const blob = that.recorders.getBlob();
const fd = new FormData();
fd.append('file', blob);
if (that.audioDataMap[actionId]) {
updateAuidoFilesInSence(that.audioDataMap[actionId].id, fd).then((resp) => {
that.audioPlay = false;
that.audioDataMap[resp.data.actionId] = resp.data;
}).catch(error => {
console.log(error);
that.$message.error('语音发送失败: ' + error.message);
that.audioPlay = false;
});
} else {
const commandEvaluationRule = that.commandEvaluationRuleVOs[actionId];
uploadAudioFilesInSence(that.$route.query.sceneId, commandEvaluationRule.id, actionId, fd)
.then((resp) => {
that.audioPlay = false;
that.audioDataMap[resp.data.actionId] = resp.data;
that.actionList = [...that.actionList];
})
.catch(error => {
console.log(error);
that.$message.error('语音发送失败: ' + error.message);
that.audioPlay = false;
});
}
if (that.microphone) {
that.microphone.stop();
that.microphone = null;
that.recordSending = false;
that.recorders = null;
}
});
},
getUrl(el) {
return `https://joylink.club/oss/joylink${el.filePath}`;
},
covertTime(time) {
const date = new Date(time);
let hour = date.getHours();
let minute = date.getMinutes();
let second = date.getSeconds();
hour = hour > 9 ? hour : '0' + hour;
minute = minute > 9 ? minute : '0' + minute;
second = second > 9 ? second : '0' + second;
return hour + ':' + minute + ':' + second;
},
startRecording(row) {
this.audioPlay = true;
const that = this;
if (!this.recordSending) {
if (!this.recordSending && !this.recorders && !this.microphone) {
const StereoAudioRecorder = RecordRTC.StereoAudioRecorder;
navigator.getUserMedia({ audio: true }, function (stream) {
that.microphone = stream;
that.recorders = new RecordRTC(that.microphone, {
type: 'audio',
recorderType: StereoAudioRecorder,
numberOfAudioChannels: 1,
bitsPerSecond:256000,
desiredSampRate: 16000
});
that.recordSendingId = row.id;
that.recorders.startRecording();
that.recordSending = true;
that.audioPlay = false;
that.inter = setInterval(() => {
if (that.seconds < 60) {
that.seconds++;
} else {
clearInterval(that.inter);
that.stopRecording(row.id);
}
}, 1000);
}, function (error) {
switch (error.code || error.name) {
case 'PERMISSION_DENIED':
case 'PermissionDeniedError':
that.$message({
showClose: true,
message: '用户拒绝提供信息',
type: 'error'
});
break;
case 'NOT_SUPPORTED_ERROR':
case 'NotSupportedError':
that.$message({
showClose: true,
message: '浏览器不支持硬件设备',
type: 'error'
});
break;
case 'MANDATORY_UNSATISFIED_ERROR':
case 'MandatoryUnsatisfiedError':
that.$message({
showClose: true,
message: '无法发现指定的硬件设备',
type: 'error'
});
break;
default:
that.$message({
showClose: true,
message: '无法打开麦克风',
type: 'error'
});
break;
}
}
);
}
} else {
this.stopRecording(row.id); // 发送语音
}
}
}
};
</script>
<style lang="scss" scoped>
.record_progress_bar{
width: 40px;
height: 40px;
position: absolute;
left: 0;
top: 0;
border-radius: 50%;
}
.userHeader{margin-bottom: 2px;}
.userChatTime{font-size: 12px;display:inline-block;}
.chatContentInClass{
display: inline-block;
width: 100%;
border: 1px solid #f1f1f1;
}
.leftUser{
float: left;
margin-left: 10px;
margin-top: 10px;
display: inline-block;
}
.chat-box-footer-create{
font-size: 16px;
text-align: center;
color: #fff;
position: relative;
left: 5px;
top: 6px;
line-height: 30px;
cursor: pointer;
width: 40px;
height: 40px;
border-radius: 50%;
background: green;
border: none;
display: flex;
justify-content: center;
align-items: center;
}
.chat-box-footer-send{
background: #F2F2F2;
right: 55px;
cursor: pointer;
.icon-yuyin{
color: #333;
font-size: 24px;
margin: 0;
}
&.active{
.icon-yuyin{
color: green;
}
}
.close_icon{
position: absolute;
top: 8px;
left: 45px;
font-size: 16px;
color: #333;
font-weight: 600;
padding: 3px;
}
}
.deleteRecord{}
.title-text{
font-size: 26px;
position: absolute;
height: 50px;
line-height: 50px;
width: 100%;
top: 61px;
background: #fff;
z-index: 9;
text-align: center;
}
/deep/.el-table .el-table__row .cell{
min-height: 50px;
}
</style>

6
src/views/jlmap3d/simulation/jl3dsimulation.vue
View File

@ -91,9 +91,9 @@ export default {
}; };
}, },
watch: { watch: {
'$store.state.socket.simulationOver':function(val) { // '$store.state.socket.simulationOver':function(val) {
this.back(); // this.back();
}, // },
}, },
beforeDestroy() { beforeDestroy() {
// console.log("destroy"); // console.log("destroy");

3
src/views/newMap/display/simulationMenu/simulationMenu.vue
View File

@ -193,7 +193,8 @@ export default {
this.logout(); this.logout();
}); });
} else if (this.$route.query.third) { } else if (this.$route.query.third) {
this.$router.push({ path: `/trainingPlatform/simulation/${this.$route.query.mapId}`, query: { lineCode: this.$route.query.lineCode } }); // this.$router.push({ path: `/trainingPlatform/simulation/${this.$route.query.mapId}`, query: { lineCode: this.$route.query.lineCode } });
window.close();
} else if (this.projectDevice) { } else if (this.projectDevice) {
this.logout(); this.logout();
} else { } else {

2
src/views/newMap/display/terminals/index.vue
View File

@ -272,6 +272,8 @@ export default {
} }
} else if (val === 'scheduleWork') { } else if (val === 'scheduleWork') {
this.mapViewLoaded(true); this.mapViewLoaded(true);
} else if (val === 'dispatcherManage') {
this.mapViewLoaded(true);
} }
this.$nextTick(() => { this.loading = false; }); this.$nextTick(() => { this.loading = false; });
}, },

6
src/views/newMap/display/terminals/terminalMenu.vue
View File

@ -76,16 +76,14 @@ export default {
{ {
name: '路票', name: '路票',
code: 'trainTicket', code: 'trainTicket',
roleList: ['DISPATCHER', 'STATION_SUPERVISOR', 'STATION_ASSISTANT', 'STATION_MASTER', 'STATION_SIGNALER', 'STATION_PASSENGER', roleList: ['STATION_SUPERVISOR', 'STATION_ASSISTANT'],
'STATION_SWITCH_MAN', 'STATION_FACILITATOR', 'STATION_WORKER', 'DEVICE_MANAGER', 'TRAIN_MASTER', 'DEPOT_DISPATCHER', 'SIGNAL_BUILDING', 'DRIVER'],
isShow: () => this.$route.query.simType === 'RAILWAY', isShow: () => this.$route.query.simType === 'RAILWAY',
click: this.changePictureShow click: this.changePictureShow
}, },
{ {
name: '簿册', name: '簿册',
code: 'registerBook', code: 'registerBook',
roleList: ['DISPATCHER', 'STATION_SUPERVISOR', 'STATION_ASSISTANT', 'STATION_MASTER', 'STATION_SIGNALER', 'STATION_PASSENGER', roleList: ['STATION_SUPERVISOR', 'STATION_ASSISTANT'],
'STATION_SWITCH_MAN', 'STATION_FACILITATOR', 'STATION_WORKER', 'DEVICE_MANAGER', 'TRAIN_MASTER', 'DEPOT_DISPATCHER', 'SIGNAL_BUILDING', 'DRIVER'],
isShow: () => this.$route.query.simType === 'RAILWAY', isShow: () => this.$route.query.simType === 'RAILWAY',
click: this.changePictureShow click: this.changePictureShow
}, },

20
src/views/newMap/display/terminals/trainTicket/index.vue
View File

@ -48,7 +48,6 @@ import {menuOperate, commitOperate} from '@/jmapNew/theme/components/utils/menuO
import RailTicket from './trainTicket'; import RailTicket from './trainTicket';
import GreenLicence from './greenLicence'; import GreenLicence from './greenLicence';
import RedLicence from './redLicence'; import RedLicence from './redLicence';
import { EventBus } from '@/scripts/event-bus';
export default { export default {
name: 'Index', name: 'Index',
components: { components: {
@ -118,7 +117,7 @@ export default {
'stationList' 'stationList'
]), ]),
userRole() { userRole() {
return this.$store.state.training.userRole; return this.$store.state.training.roles;
}, },
roleDeviceCode() { roleDeviceCode() {
return this.$store.state.training.roleDeviceCode; return this.$store.state.training.roleDeviceCode;
@ -133,14 +132,14 @@ export default {
this.greenLicenseForm.stationSeal = station.name; this.greenLicenseForm.stationSeal = station.name;
this.redLicenseForm.stationSeal = station.name; this.redLicenseForm.stationSeal = station.name;
} }
},
'$store.state.training.memberList': function (val) {
this.initGiveMemberList(val);
} }
}, },
mounted() { mounted() {
EventBus.$on('trainTicketMember', (memberList) => {
this.giveMemberList = memberList;
});
const station = this.$store.getters['map/getDeviceByCode'](this.roleDeviceCode); const station = this.$store.getters['map/getDeviceByCode'](this.roleDeviceCode);
this.initGiveMemberList(this.$store.state.training.memberList);
if (station) { if (station) {
this.ticketForm.station = station.name; this.ticketForm.station = station.name;
this.ticketForm.stationSeal = station.name; this.ticketForm.stationSeal = station.name;
@ -153,6 +152,15 @@ export default {
} }
}, },
methods: { methods: {
initGiveMemberList(memberList) {
this.giveMemberList = [];
const memberData = this.$store.state.training.memberData;
memberList.forEach(item => {
if (item.type === 'STATION_ASSISTANT' || item.type === 'STATION_SUPERVISOR') {
this.giveMemberList.push(memberData[item.id]);
}
});
},
handleClick() { handleClick() {
if (this.activeName === 'second') { if (this.activeName === 'second') {
this.query(); this.query();

2
src/views/newMap/display/trainingDesign/designPane.vue
View File

@ -116,7 +116,7 @@
import { updateTrainingStep, getTrainingAll, updateTrainingBackgroud, getTrainingStepList, updateTrainingMaplocation, clearDesignTraining} from '@/api/trainingManage'; import { updateTrainingStep, getTrainingAll, updateTrainingBackgroud, getTrainingStepList, updateTrainingMaplocation, clearDesignTraining} from '@/api/trainingManage';
import { assignUsersPlayRoles } from '@/api/jointSimulation'; import { assignUsersPlayRoles } from '@/api/jointSimulation';
import Vue from 'vue'; import Vue from 'vue';
import {covertMemberData} from '@/views/newMap/displayNew/utils'; import {covertMemberData} from '@/utils/simulation';
import DraftTrainingList from './draftTrainingList'; import DraftTrainingList from './draftTrainingList';
import EditOperate from './editOperate'; import EditOperate from './editOperate';
import CreateDraftTraining from './createDraftTraining'; import CreateDraftTraining from './createDraftTraining';

2
src/views/newMap/display/trainingDesign/gradeRules.vue
View File

@ -55,7 +55,7 @@
</template> </template>
<script> <script>
import {handleMemberList} from '@/views/newMap/displayNew/utils'; import {handleMemberList} from '@/utils/simulation';
import { getTrainingStepList, getTrainingPlayers, updateTrainingGradeRules, getTrainingGradeRules } from '@/api/trainingManage'; import { getTrainingStepList, getTrainingPlayers, updateTrainingGradeRules, getTrainingGradeRules } from '@/api/trainingManage';
export default { export default {
name: 'GradeRulesN', name: 'GradeRulesN',

2
src/views/newMap/display/trainingList/scenePlayRole.vue
View File

@ -28,7 +28,7 @@
</template> </template>
<script> <script>
import {covertMemberData} from '@/views/newMap/displayNew/utils'; import {covertMemberData} from '@/utils/simulation';
import { assignUsersPlayRoles } from '@/api/jointSimulation'; import { assignUsersPlayRoles } from '@/api/jointSimulation';
export default { export default {
name: 'ScenePlayRole', name: 'ScenePlayRole',

510
src/views/newMap/displayNew/bigLPFStrategy.vue
View File

@ -1,510 +0,0 @@
<template>
<div class="bigLPFStrategy">
<div class="bigLPFStrategyL">
<div class="bigLPFStrategyLTitle">大客流站台直方图</div>
<div :id="bigLPFStrategyId" class="bigLPFStrategyLChart" />
</div>
<div class="bigLPFStrategyR">
<div class="LPFstrategyTop">
<div class="LPFstrategyTitle">
<span class="LPFstrategyTitleL">客流策略</span>
<span v-if="LPFstrategyList.length>0" class="LPFstrategyTitleR">【 推算时长:{{ recoimemmandTime }}分钟 】</span>
</div>
</div>
<div id="LPFstrategyListOut">
<div v-if="LPFstrategyList.length<=0" class="noLPFstrategy">暂无策略</div>
<!-- <el-tabs v-model="activeName" class="border-card">
<el-tab-pane class="view-control" label="策略列表" name="first"> -->
<!-- <div class=""></div> -->
<!-- <el-tabs v-else v-model="activeName" type="card" class="LPFstrategyListIn">
<el-tab-pane label="策略列表" name="first"> -->
<!-- <div v-else class="eachLPFstrategy">
<div class="eachLPFstrategyData1">大客流站台列表</div>
<div v-for="(eachLPFstand,index) in LPFstandList" :key="index">
<div class="eachLPFstrategyData">站台{{ index+1 }}：{{ eachLPFstand.name }}</div>
<div class="eachLPFstrategyData">等待人数：{{ eachLPFstand.wait }}</div>
</div>
</div> -->
<div v-for="(eachLPFstrategy,index) in LPFstrategyList" :key="index" class="eachLPFstrategy">
<div class="eachLPFstrategyData1">策略{{ index+1 }}：{{ eachLPFstrategy.description }}</div>
<div class="eachLPFstrategyData">指标数据：</div>
<div class="eachLPFstrategyData">
<span> 影响的列车数量: {{ eachLPFstrategy.effectTrainNum }}</span>
<span class="eachLPFstrategySpan">时刻表总偏移量: {{ eachLPFstrategy.scheduleOffset }}秒 </span>
</div>
<!-- <div class="eachLPFstrategyData">影响的列车: {{ eachLPFstrategy.effectTrainSet.toString() }}</div> -->
<div class="eachLPFstrategyData">
<span> 可多载离的乘客数量（累计的）: {{ eachLPFstrategy.extraNum }}</span>
</div>
</div>
<!-- </el-tab-pane> -->
<!-- <el-tab-pane label="大客流站台列表" name="second"> -->
<!-- </el-tab-pane> -->
<!-- </el-tabs> -->
<!-- </el-tab-pane>
<el-tab-pane class="view-control" label="大客流站台列表" name="second">
{{ 111 }}
</el-tab-pane>
</el-tabs> -->
</div>
</div>
<div class="quitLPFstrategy"><el-button type="primary" class="quitLPFButton" @click="quitLPFstrategy">退出</el-button></div>
</div>
</template>
<script>
import echarts from 'echarts';
import { mapGetters } from 'vuex';
import { clearSimulation } from '@/api/simulation';
import { creatSubscribe, clearSubscribe, LPFTopic} from '@/utils/stomp';
import { getToken } from '@/utils/auth';
import { loadMapDataById } from '@/utils/loaddata';
export default {
name:'BigLPFStrategy',
data() {
return {
group:'',
myChart: null,
activeName:'first',
LPFstrategyList:[],
recoimemmandTime:0,
bigLPFStrategyId:'bigLPFStrategyId',
upStandList:[],
downStandList:[],
stationNameList:[],
LPFstandList:[]
};
},
computed: {
...mapGetters('map', [
'stationList',
'stationStandList',
'mapConfig'
])
},
watch: {
'$store.state.socket.LPFstrategy':function(val) {
if (val && val.recommendList && val.recommendList.length > 0) {
this.LPFstrategyList = [];
this.recoimemmandTime = val.duration;
val.recommendList.forEach(strategy=>{
const eachStrategy = {};
switch (strategy.type) {
case 'JUMP': {
// {"type":"JUMP","description":"为列车[132056],设置罗汉山-上行站台跳停",
// "effectTrainSet":["004"],"effectTrainNum":1,"scheduleOffset":-50,
// "extraNum":0,"groupNumber":"004","serviceNumber":"13","tripNumber":"2056","standCode":"PF61848"}]}
// const stand = this.$store.getters['map/getDeviceByCode'](strategy.standCode);
// const station = this.$store.getters['map/getDeviceByCode'](stand.stationCode);
// eachStrategy.description = '为列车[' + strategy.groupNumber +
// '-' + strategy.serviceNumber + '|' + strategy.tripNumber +
// ']，设置站台' + station.name + '-' + (stand.right ? '右行' : '左行') +
// stand.name + ' (' + stand.code + ') 跳停';
// 为列车[005-02|2057],设置站台秀山-右行-PF42(PF44165)跳停",
eachStrategy.description = strategy.description;
break;
}
// "type":"PARK_TIME",
// "description":"福州火车站-上行站台设置停站时间[85]",
// "effectTrainSet":["012","004","005","009"],"effectTrainNum":4,
// "scheduleOffset":160,"extraNum":2540,"time":85,"standCode":"PF83991"
case 'PARK_TIME': {
// const stand = this.$store.getters['map/getDeviceByCode'](strategy.standCode);
// const station = this.$store.getters['map/getDeviceByCode'](stand.stationCode);
eachStrategy.description = strategy.description;
// eachStrategy.description = '为站台[' + station.name + '-' + (stand.right ? '右行' : '左行') +
// stand.name + '(' + stand.code + ')] 设置停站时间，' + strategy.time + '秒';
break;
}
case 'J_P': {
// const stand = this.$store.getters['map/getDeviceByCode'](strategy.standCode);
// const station = this.$store.getters['map/getDeviceByCode'](stand.stationCode);
// eachStrategy.description = '为列车[' + strategy.groupNumber +
// '-' + strategy.serviceNumber + '|' + strategy.tripNumber +
// ']，设置站台' + station.name + '-' + (stand.right ? '右行' : '左行') +
// stand.name + ' (' + stand.code + ') 跳停，并且为站台[' + station.name + '-' + (stand.right ? '右行' : '左行') +
// stand.name + '(' + stand.code + ')] 设置停站时间，' + strategy.time + '秒';
eachStrategy.description = strategy.description;
}
}
eachStrategy.effectTrainNum = strategy.effectTrainNum;
eachStrategy.scheduleOffset = strategy.scheduleOffset;
eachStrategy.extraNum = strategy.extraNum;
eachStrategy.effectTrainSet = strategy.effectTrainSet;
this.LPFstrategyList.push(eachStrategy);
});
this.LPFstandList = [];
val.lpfList.forEach(standInfo=>{
const stand = this.$store.getters['map/getDeviceByCode'](standInfo.standCode);
const station = this.$store.getters['map/getDeviceByCode'](stand.stationCode);
this.LPFstandList.push({name:station.name + '-' + (stand.right ? '右行' : '左行') +
stand.name + '(' + stand.code + ')', wait:standInfo.wait});
});
}
},
'$store.state.socket.simulationOver':function(val) {
this.quitLPFstrategy();
},
'$store.state.app.windowSizeCount': function() { // 窗口缩放
this.setWindowSize();
},
'$store.state.map.mapDataLoadedCount': function (val) {
const upRight = this.mapConfig.upRight;
const stationList = this.stationList.sort((a, b) => {
return parseInt(a.kmRange) - parseInt(b.kmRange);
});
stationList.forEach((station)=>{
if (!station.depot) {
this.stationNameList.push(station.name);
}
});
this.stationStandList.forEach((stand)=>{
const station = this.$store.getters['map/getDeviceByCode'](stand.stationCode);
if ((stand.right && upRight) || (!stand.right && !upRight)) {
this.upStandList[station.name] = 0;
} else {
this.downStandList[station.name] = 0;
}
});
this.loadInitData();
this.subscribe();
},
'$store.state.socket.standPfiNum':function(val) {
if (val) {
// console.log(val, 'standPfiNum');
val.forEach(stationNum=>{
const upRight = this.mapConfig.upRight;
const stand = this.$store.getters['map/getDeviceByCode'](stationNum.standCode);
const station = this.$store.getters['map/getDeviceByCode'](stand.stationCode);
if ((stand.right && upRight) || (!stand.right && !upRight)) {
this.upStandList[station.name] = stationNum.num;
} else {
this.downStandList[station.name] = stationNum.num;
}
});
this.updateData();
}
}
},
beforeDestroy() {
if (this.group) {
clearSimulation(this.group);
this.clearSubscribe();
this.$store.dispatch('socket/resetTrainPassagerNum');
this.$store.dispatch('socket/setIsFirst', false);
}
},
mounted() {
this.group = this.$route.query.group;
loadMapDataById(this.$route.query.mapId, 'parse');
},
methods:{
async subscribe() {
this.clearSubscribe();
const header = { group: this.group || '', 'X-Token': getToken() };
creatSubscribe(`${LPFTopic}\/${this.$route.query.group}`, header);
},
clearSubscribe() {
clearSubscribe(`${LPFTopic}\/${this.group}`);
},
quitLPFstrategy() {
window.close();
},
updateData() {
const result = this.covertData();
const upStandNumList = result.upStandNumList;
const downStandNumList = result.downStandNumList;
const series = [{
name: '上行',
type: 'bar',
data:upStandNumList
},
{
name: '下行',
type: 'bar',
data:downStandNumList
}];
this.myChart && this.myChart.setOption({series: series});
},
covertData() {
const upStandNumList = [];
const downStandNumList = [];
this.stationNameList.forEach(station=>{
upStandNumList.push(this.upStandList[station]);
downStandNumList.push(this.downStandList[station]);
});
return {upStandNumList:upStandNumList, downStandNumList:downStandNumList};
},
async loadInitData() {
const result = this.covertData();
const upStandNumList = result.upStandNumList;
const downStandNumList = result.downStandNumList;
this.myChart && this.myChart.showLoading();
const option = {
tooltip: {
trigger: 'axis'
},
color:['#0029ca', '#33459c'],
grid: [
{
right: '80px',
left: '80px',
height: '85%',
top:'40px'
}
],
xAxis: [
{
type: 'category',
data: this.stationNameList,
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
}
}
],
yAxis: [
{
type: 'value',
splitLine: {
show: false
},
axisTick: {
show: false
},
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
}
}
],
dataZoom: [{
type: 'inside'
},
{
fiterMode: 'filter',
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
handleSize: '80%',
handleStyle: {
color: '#fff',
shadowBlur: 3,
shadowColor: 'rgba(0, 0, 0, 0.6)',
shadowOffsetX: 2,
shadowOffsetY: 2
},
bottom: '20px'
}],
series: [
{
name: '上行',
type: 'bar',
data:upStandNumList
},
{
name: '下行',
type: 'bar',
data:downStandNumList
}
]
};
await this.loadInitChart(option);
this.myChart && this.myChart.hideLoading();
},
loadInitChart(option) {
return new Promise((resolve, reject) => {
try {
this.myChart = echarts.init(document.getElementById(this.bigLPFStrategyId));
if (this.myChart) {
this.myChart.setOption(option);
this.reSize({ width: this.$store.state.app.width * 0.74, height: this.$store.state.app.height - 40 });
}
resolve(true);
} catch (error) {
reject(error);
}
});
},
setWindowSize() {
this.reSize({ width: this.$store.state.app.width * 0.74, height: this.$store.state.app.height - 40 });
},
reSize(opt) {
if (this.myChart) {
this.myChart.resize({
width: opt.width,
height: opt.height,
silent: false
});
}
}
}
};
</script>
<style lang="scss" scoped>
.LPFstrategyList{
position: absolute;
width: 360px;
left: 10px;
height: 500px;
top: 80px;
background: #f1f1f1;
border-radius: 6px;
z-index: 2;
}
.eachLPFstrategy{
width: 96%;
box-shadow: 0px 5px 5px #ccc;
border-top: 1px #dedede solid;
margin-top: 10px;
padding:10px;
background: #fff;
font-size: 14px;
margin-left: 2%;
border-radius: 5px;
}
.LPFstrategyTop{
background:#fff;
height: 40px;
border-bottom: 1px #d4d4d4 solid;
width: 100%;
position: absolute;
top: 0;
left:0;
}
.bigLPFStrategyLTitle{
padding: 15px 20px 0px 20px;
font-size: 15px;
background: #fff;
height: 40px;
width: 100%;
position: absolute;
top: 0;
left: 0;
}
.LPFstrategyTitle{
float: left;
width:100%;
padding-top: 10px;
padding-left: 15px;
font-size: 15px;
padding-right: 20px;
}
.LPFstrategyClose{
float: right;
margin-right: 5px;
padding: 5px;
margin-top: 5px;
}
#LPFstrategyListOut{
height: 100%;
overflow: auto;
background: #f1f1f1;
padding-bottom:20px;
border-bottom: 1px #d4d4d4 solid;
&::-webkit-scrollbar {
width: 5px;
}
&::-webkit-scrollbar-thumb {
border-radius: 10px;
background: #c3c3c3;
}
&::-webkit-scrollbar-track {
border-radius: 0;
background: #f0f0f0;
}
}
.eachLPFstrategyData1{
line-height:145%;
font-weight:600;
}
.eachLPFstrategyData{
margin-top:5px;
}
.eachLPFstrategySpan{
margin-left:50px;
}
.bigLPFStrategyL{
width: 74%;
float: left;
height: 100%;
padding: 40px 0px 0px 0px;
position: relative;
}
.bigLPFStrategyR{
width: 26%;
float: right;
border-left: 1px #eee solid;
height: 100%;
padding: 40px 0px;
position: relative;
box-shadow: -5px 0px 5px #dedede;
}
.bigLPFStrategy{
width:100%;
height:100%;
position: relative;
}
.noLPFstrategy{
padding:50px 0px;
text-align: center;
}
.quitLPFstrategy{
position: absolute;
right: 10px;
bottom: 5px;
}
.quitLPFButton{
height: 30px;
padding-top: 5px;
padding-bottom: 5px;
}
#bigLPFStrategyId{
width:100%;
height:100%;
}
.LPFstrategyTitleL{}
.LPFstrategyTitleR{
// float:right
}
.LPFstrategyListIn{height:100%;overflow:hidden;padding-top: 41px;position:relative;}
</style>
<style lang="scss">
#LPFstrategyListOut .LPFstrategyListIn .el-tabs__header.is-top{
margin-bottom: 10px;
position: absolute;
top: 0;
left: 0;
background: #fff;
width: 100%;
border-bottom: 1px #ccc solid;
}
#LPFstrategyListOut .LPFstrategyListIn .el-tabs__content{
height: 100%;
padding-bottom: 10px;
overflow: auto;
&::-webkit-scrollbar {
width: 5px;
}
&::-webkit-scrollbar-thumb {
border-radius: 10px;
background: #c3c3c3;
}
&::-webkit-scrollbar-track {
border-radius: 0;
background: #f0f0f0;
}
}
#LPFstrategyListOut .el-tabs--card>.el-tabs__header .el-tabs__item.is-active{
border-bottom-color:#dedede;
}
</style>

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

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

284
src/views/newMap/displayNew/demon/addFault.vue
View File

@ -1,284 +0,0 @@
<template>
<div class="addRules">
<div class="addRulesInner">
<div class="addRulesInnerTitle">新增故障</div>
<div class="closeAddRulesInner" @click="addRulesClose">
<span class="el-icon-close closeAddRulesIn" />
</div>
<el-form ref="form" :model="faultRule" label-width="100px" style="margin-left:15px;">
<el-form-item label="目标设备">
<!-- faultRule.targetDeviceCode -->
<el-input v-model="targetDevice.name" disabled size="small" class="inputModelClass" />
<!--<el-button :type="field === 'targetActive' ? 'danger' : 'primary'" size="small" @click="hover('targetActive')">{{ $t('map.activate') }}</el-button>-->
</el-form-item>
<el-form-item label="触发方式">
<el-select v-model="triggerMode" @change="changeTriggerMode">
<el-option
v-for="item in triggerModeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="故障类型">
<el-select v-model="faultRule.faultType" placeholder="请选择" class="inputModelClass">
<el-option
v-for="item in faultTypeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item v-if="triggerMode === 'DEVICE'" label="触发设备">
<!-- faultRule.condition.triggerDeviceCode -->
<el-input v-model="triggerDevice" size="small" disabled class="inputModelClass" />
<el-button :type="field === 'triggerActive' ? 'danger' : 'primary'" size="small" @click="hover('triggerActive')">{{ $t('map.activate') }}</el-button>
</el-form-item>
<el-form-item v-if="triggerMode === 'DEVICE'" label="触发状态">
<!-- <el-input v-model="faultRule.condition.triggerDeviceStatus" size="small" class="inputModelClass" /> -->
<el-select v-model="faultRule.condition.triggerDeviceStatus" placeholder="请选择" class="inputModelClass">
<el-option
v-for="item in triggerStatusList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item v-if="triggerMode === 'DEVICE'" label="关联设备">
<el-input v-model="triggerAssociatedDevice" size="small" disabled class="inputModelClass" />
<el-button :type="field === 'triggerAssociated'? 'danger': 'primary'" size="small" @click="hover('triggerAssociated')">{{ $t('map.activate') }}</el-button>
</el-form-item>
<el-form-item v-if="triggerMode === 'TIME'" label="触发时间">
<el-date-picker
v-model="faultRule.condition.triggeringTime"
type="datetime"
placeholder="选择日期时间"
/>
</el-form-item>
</el-form>
<span class="addRulesFooter">
<el-button size="medium" type="primary" @click="addRulesCreate">{{ $t('global.confirm') }}</el-button>
<el-button size="medium" @click="addRulesClose">{{ $t('global.cancel') }}</el-button>
</span>
</div>
</div>
</template>
<script>
import { FaultStatusEnum } from '@/scripts/FaultDicNew';
import { setFailureModeNew} from '@/api/simulation';
import { deviceFaultType} from '@/scripts/cmdPlugin/Config';
// 添加故障
export default {
name: 'AddChoose',
props: {
targetDevice: {
type: Object,
required: true
}
},
data() {
return {
field:'',
triggerStatusList:[],
faultTypeList:[],
faultRule:{
targetDeviceCode:'',
targetDeviceType:'',
faultType:'',
condition:{
triggerDeviceCode:'',
triggerDeviceStatus:'',
triggerDeviceType :'',
type:'DEVICE',
triggeringTime: '',
triggerAssociatedDeviceCode: ''
}
},
// targetDevice:'',
triggerDevice:'',
triggerAssociatedDevice: '',
triggerMode: 'DEVICE',
triggerModeList: [
{label: '设备触发', value: 'DEVICE'},
{label: '时间触发', value: 'TIME'}
]
// rules:{
// targetDevice:[
// { required: true, message:'请选择目标设备', trigger: 'blur' }
// ],
// triggerDevice:[
// { required: true, message:'请选择触发设备', trigger: 'blur' }
// ],
// faultRule:{
// faultType:[
// { required: true, message:'请选择故障类型', trigger: 'blur' },
// { required: true, message:'请选择故障类型', trigger: 'change' }
// ]
// }
// }
};
},
watch: {
'$store.state.menuOperation.selectedCount':function(em) {
const device = this.$store.state.menuOperation.selected;
if (device.code) {
this.deviceSelect(device);
}
}
},
mounted() {
},
methods:{
deviceSelect(em) {
if (this.field.toUpperCase() === 'triggerAssociated'.toUpperCase()) {
// if (em._type == 'Station') {
// em = this.$store.getters['map/getDeviceByCode'](em.zcCode);
// }
// this.faultRule.targetDeviceType = this.covertType(em._type);
// this.faultRule.targetDeviceCode = em.code;
if (em._type.toUpperCase() === 'Section'.toUpperCase() && em.parentName) {
this.triggerAssociatedDevice = em._type + '-' + em.parentName + '-' + em.name;
} else {
this.triggerAssociatedDevice = em._type + '-' + em.name;
}
this.faultRule.condition.triggerAssociatedDeviceCode = em.code;
} else if (this.field.toUpperCase() === 'triggerActive'.toUpperCase()) {
this.faultRule.condition.triggerDeviceType = this.covertType(em._type);
this.faultRule.condition.triggerDeviceCode = em.code;
if (em._type.toUpperCase() === 'Section'.toUpperCase() && em.parentName) {
this.triggerDevice = em._type + '-' + em.parentName + '-' + em.name;
} else if (em._type.toUpperCase() === 'Train'.toUpperCase()) {
this.triggerDevice = em._type + '-' + em.code;
} else {
this.triggerDevice = em._type + '-' + em.name;
}
this.triggerStatusList = [];
const faultStatus = FaultStatusEnum[this.faultRule.condition.triggerDeviceType];
if (faultStatus) {
const list = Object.keys(faultStatus);
list.forEach(key=>{
this.triggerStatusList.push({label:faultStatus[key], value:key});
});
}
this.field = '';
this.faultRule.condition.triggerDeviceStatus = '';
}
},
covertType(type) {
switch (type) {
case 'Section':return 'SECTION';
case 'Signal':return 'SIGNAL';
case 'Switch':return 'SWITCH';
case 'Station':return 'STATION';
case 'ZcControl':return 'ZC';
case 'StationStand':return 'STAND';
case 'Train':return 'TRAIN';
}
},
hover(field) {
if (this.field == '') {
this.field = field;
} else {
this.field = '';
}
},
addRulesCreate() {
if (this.triggerDevice == '') {
this.$messageBox('请选择触发设备');
return;
}
if (this.faultRule.condition.triggerDeviceStatus == '') {
this.$messageBox('请选择触发状态');
return;
}
if (this.faultRule.faultType == '') {
this.$messageBox('请选择故障类型');
return;
}
console.log(this.faultRule, '-------------');
setFailureModeNew(this.faultRule, this.$route.query.group).then(res=>{
this.$emit('closeAddRules');
this.$emit('reload');
}).catch((error)=>{
this.$messageBox('创建故障失败: ' + error.message);
});
},
addRulesClose() {
this.resetForm();
this.$emit('closeAddRules');
},
initValue() {
this.faultTypeList = deviceFaultType[this.targetDevice._type];
this.faultRule.targetDeviceCode = this.targetDevice.code;
this.faultRule.targetDeviceType = this.covertType(this.targetDevice._type);
},
resetForm() {
this.triggerDevice = '';
this.faultRule = {
targetDeviceCode:'',
targetDeviceType:'',
faultType:'',
condition:{
triggerDeviceCode:'',
triggerDeviceStatus:'',
triggerDeviceType :'',
type:'DEVICE',
triggeringTime: '',
triggerAssociatedDeviceCode: ''
}
};
}
}
};
</script>
<style lang="scss" scoped>
.addRules{
position: absolute;
width: 100%;
left: 0;
top: 40px;
}
.addRulesInner{
position: relative;
width: 380px;
margin-top:6px;
background: #fff;
border-radius: 10px;
border: 1px #ccc solid;
margin-left: auto;
margin-right: auto;
box-shadow: 3px 3px 3px #a0a0a0;
z-index:2;
}
.queryList{
height: 300px;
overflow: auto;
}
.inputModelClass{
width:150px;
}
.addRulesInnerTitle{
padding: 10px;
font-size: 14px;
}
.closeAddRulesInner{
position: absolute;
right: 10px;
top: 9px;
width: 19px;
height: 19px;
cursor: pointer;
}
.closeAddRulesIn{
font-size: 19px;
}
.addRulesFooter{
margin-left: 116px;
display: inline-block;
margin-bottom: 20px;
}
</style>

279
src/views/newMap/displayNew/demon/addQuest.vue
View File

@ -1,279 +0,0 @@
<template>
<div>
<el-dialog
v-dialogDrag
:title="$t('display.script.scriptList')"
:visible.sync="show"
top="50px"
width="70%"
:before-do-close="doClose"
:close-on-click-modal="false"
:z-index="2000"
>
<QueryListPage
ref="queryListPage"
:pager-config="pagerConfig"
:query-form="queryForm"
:query-list="queryList"
/>
</el-dialog>
<el-dialog
v-dialogDrag
:title="$t('display.script.roleSelect')"
:visible.sync="roleShow"
top="50px"
width="350px"
:before-do-close="roleDoClose"
:close-on-click-modal="false"
:z-index="5000"
>
<div>
<el-form ref="ruleForm" :model="form" label-width="50px">
<el-form-item :label="$t('display.script.role')" prop="role">
<el-select v-model="form.type" :placeholder="$t('display.script.pleaseSelect')">
<el-option
v-for="item in memberList"
:key="item.id"
:label="(roleConfig[item.type]?roleConfig[item.type]: '')+(item.name?item.name: '')"
:value="item.id"
:disabled="item.disabled"
/>
<!-- checkDisabled(item.type) -->
</el-select>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="roleDoClose">{{ $t('global.cancel') }}</el-button>
<el-button type="primary" @click="confirm">{{ $t('global.confirm') }}</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import Cookies from 'js-cookie';
import ConstConfig from '@/scripts/ConstConfig';
import {getScriptPageListOnlineNew, getScriptByIdNew } from '@/api/script';
import { EventBus } from '@/scripts/event-bus';
// 剧本弹窗
export default {
name: 'AddQuest',
props: {
trainings: {
type: Array,
default() {
return [];
}
},
detail: {
type: Object,
default() {
return null;
}
}
},
data() {
return {
show: false,
roleShow: false,
pagerConfig: {
pageSize: 'pageSize',
pageIndex: 'pageNum'
},
row: {},
form: {
type: ''
},
memberList: [],
mapLocation:null,
queryForm: {
labelWidth: '80px',
reset: false,
show: false,
queryObject: {
}
},
queryList: {
query: this.listQuest,
selectCheckShow: false,
indexShow: true,
columns: [
{
title: this.$t('display.script.scriptName'),
prop: 'name'
},
{
title: this.$t('display.script.createTime'),
prop: 'createTime'
},
{
type: 'button',
title: this.$t('display.script.operate'),
width: '250',
buttons: [
{
name: this.$t('display.script.loadScript'),
type: 'primary',
handleClick: this.handleLoad
}
]
}
],
actions: [
]
},
currentModel: {},
roleConfig: {
'Admin': this.$t('display.script.admin'),
'Instructor': this.$t('display.script.instructor'),
'Dispatcher': this.$t('display.script.dispatcher'),
'Attendant': this.$t('display.script.attendant'),
'Audience': this.$t('display.script.audience'),
'Driver': this.$t('display.script.driver'),
'Repair':this.$t('display.script.repair'),
'no': ''
}
};
},
created() {
this.loadInitData();
},
methods: {
doShow() {
this.show = true;
this.reloadTable();
},
doClose() {
this.show = false;
},
listQuest(params) {
params['mapId'] = this.$route.query.mapId;
return getScriptPageListOnlineNew(params);
},
async loadInitData() {
},
covert(data, roleTypeList) {
let lastData = data;
roleTypeList.forEach(function(element) {
const rolename = element.value;
if (Cookies.get('user_lang') == 'en') {
lastData = lastData.replace(new RegExp(rolename, 'g'), element.enLabel);
} else {
lastData = lastData.replace(new RegExp(rolename, 'g'), element.label);
}
});
lastData = JSON.parse(lastData);
lastData.forEach(each=>{
const name = each.name == undefined ? '' : '-' + each.name;
const deviceName = each.deviceName == undefined ? '' : '-' + each.deviceName;
each.name = each.type + deviceName + name;
each.disabled = false;
const prdType = this.$store.state.training.prdType;
if ( prdType == '01') {
if (each.type !== '行值' && each.type !== 'no') { each.disabled = true; }
} else if (prdType == '02') {
if (each.type !== '行调' && each.type !== 'no') { each.disabled = true; }
} else if (prdType == '04') {
if (each.type !== '司机' && each.type !== 'no') { each.disabled = true; }
}
});
return lastData;
},
async handleLoad(index, row) {
this.row = row;
const res = await getScriptByIdNew(row.id);
let newMemberList = [];
if (res.code == 200) {
EventBus.$emit('clearRunSeries');
if (res.data.memberList && res.data.memberList.length > 0) {
// newMemberList
// const playerList = res.data.memberList.filter(item => item.hasPlay === true);
// playerList.map(each=>{
// if (!each.deviceName && each.deviceCode) {
// const device = this.$store.getters['map/getDeviceByCode'](each.deviceCode);
// if (device.name) {
// each.deviceName = device.name;
// } else {
// each.deviceName = each.deviceCode;
// }
// }
// });
this.form.type = '';
res.data.memberList.sort((a, b) => {
return parseInt(a.id) - parseInt(b.id);
});
this.$store.dispatch('training/setMemberList', {memberList:res.data.memberList, userId:this.$store.state.user.id});
const activeMemberList = [];
res.data.actionList.forEach((activeMember)=>{
if (!(activeMemberList.length > 0 && activeMemberList.includes(activeMember.memberId))) {
activeMemberList.push(activeMember.memberId);
}
});
const playerList = res.data.memberList.filter(member=>{
return activeMemberList.includes(member.id);
});
playerList.map(member=>{
if (!member.deviceName && member.deviceCode) {
const device = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (device.name) {
member.deviceName = device.name;
} else {
member.deviceName = member.deviceCode;
}
}
});
const lastData = JSON.stringify(playerList);
newMemberList = this.covert(lastData, ConstConfig.ConstSelect.roleTypeNew);
}
if (res.data.mapLocation) {
this.mapLocation = res.data.mapLocation;
}
this.memberList = newMemberList || [];
this.memberList.unshift({ id: '', name: this.$t('display.script.none'), role: 'no' });
}
this.roleShow = true;
},
reloadTable() {
if (this.queryList && this.queryList.reload) {
this.queryList.reload();
}
},
confirm() {
const roleName = this.memberList.find(elem=>{ return elem.id == this.form.type; });
this.$emit('selectQuest', this.row, this.form.type, this.mapLocation, roleName.type);
this.doClose();
this.roleDoClose();
},
roleDoClose() {
this.$refs['ruleForm'].resetFields();
this.roleShow = false;
},
// checkDisabled(role) {
// const prdType = this.$store.state.training.prdType;
// return this.judgeDisabled(prdType, role);
// },
// judgeDisabled(prdType, role) {
// if ( prdType == '01') {
// return role !== '行值' && role !== 'no';
// } else if (prdType == '02') {
// return role !== '行调' && role !== 'no';
// } else if (prdType == '04') {
// return role !== '司机' && role !== 'no';
// }
// },
handleName(item) {
return this.roleConfig[item.type] ? this.roleConfig[item.type] : '' + (item.name ? item.name : '');
}
}
};
</script>

198
src/views/newMap/displayNew/demon/equipment.vue
View File

@ -1,198 +0,0 @@
<template>
<div>
<el-drawer
title="设备管理"
:visible.sync="show"
direction="ltr"
:before-close="doClose"
custom-class="dialog_box"
size="43%"
>
<div style="margin-bottom: 3px; overflow: hidden; padding: 0 10px;">
<div class="plc_box">名称: {{ plcInfo.name }}</div>
<div class="plc_box">状态: <span :style="{'color': plcInfo.status ? 'green' : 'red'}">{{ plcInfo.status ? '在线' : '不在线' }}</span></div>
<el-button type="text" size="small" class="freshen_box" @click="getList">刷新</el-button>
</div>
<el-table :data="tableData" border style="width: 100%; max-height: calc(100% - 24px); overflow: auto;">
<el-table-column prop="code" label="设备编号" width="180" />
<el-table-column prop="typeName" label="设备类型" width="180" />
<el-table-column prop="vrDeviceCode" label="连接设备编码">
<template slot-scope="scope">
<div v-if="scope.row.vrDeviceCode" class="flex_box">{{ scope.row.vrDeviceName }}</div>
<div v-if="!scope.row.vrDeviceCode" class="flex_box">(空)</div>
</template>
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button :type="scope.row.buttonShowType ? 'danger' : 'primary'" size="small" @click="handleClick(scope.row, scope.$index)">连接</el-button>
<el-button size="small" @click="cancel(scope.row, scope.$index)">断开</el-button>
</template>
</el-table-column>
</el-table>
</el-drawer>
</div>
</template>
<script>
import { getAllSimulationList, postSimulationConnectById, putSimulationDisconnectById } from '@/api/simulation.js';
import ConstConfig from '@/scripts/ConstConfig';
import { EventBus } from '@/scripts/event-bus';
import { getSessionStorage } from '@/utils/auth';
export default {
name: 'Equipment',
data() {
return {
show: false,
group: '',
tableData: [],
typeList: ConstConfig.ConstSelect.projectDeviceTypeList,
plcInfo: {
name: '',
status: ''
},
index: 0,
selected: {},
typeObj: {
Section: '区段',
Signal: '信号机',
Switch: '道岔',
Psd: '屏蔽门',
StationStand: '站台'
}
};
},
computed: {
project() {
return getSessionStorage('project');
}
},
mounted() {
EventBus.$on('selectDevice', (data) => {
this.selected = data;
this.tableData[this.index]['buttonShowType'] = false;
this.tableData.splice(this.index, 1, this.tableData[this.index]);
this.$store.dispatch('map/selectDeviceCode', {flag: false, type: ''});
this.connect(this.tableData[this.index]);
});
},
async beforeDestroy() {
EventBus.$off('selectDevice');
},
methods: {
async doShow() {
this.show = true;
this.group = this.$route.query.group;
this.getList();
},
async getList() {
try {
const res = await getAllSimulationList(this.group);
this.tableData = [];
res.data.forEach((item, index) => {
if (item.type == 'PLC_GATEWAY') {
this.plcInfo = {
name: 'PLC网关',
status: item.online
};
} else {
item.buttonShowType = false;
item.typeName = this.typeList.find(el => el.value == item.type).label;
if (item.vrDeviceCode && this.$store.getters['map/getDeviceByCode'](item.vrDeviceCode)) {
item.vrDeviceName = this.$store.getters['map/getDeviceByCode'](item.vrDeviceCode).name;
} else {
item.vrDeviceName = item.vrDeviceCode;
}
if (this.project == 'heb' || this.project == 'designheb') {
if (item.type == 'SWITCH') {
this.tableData.push(item);
}
} else {
this.tableData.push(item);
}
}
});
} catch (error) {
console.error(error);
}
},
doClose() {
this.show = false;
},
handleClick(row, index) {
row.buttonShowType = !row.buttonShowType;
this.index = index;
this.tableData.splice(index, 1, row);
this.$store.dispatch('map/selectDeviceCode', {flag: row.buttonShowType, type: row.type});
},
async connect(row) {
this.$confirm(`您确定连接${this.typeObj[this.selected._type] || '设备'}: ${this.selected.name}, 是否继续?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async () => {
try {
const res = await postSimulationConnectById(this.group, row.id, this.selected.code);
if (res && res.code == 200) {
this.$message.success('连接成功!');
this.tableData[this.index]['vrDeviceCode'] = this.selected.code;
this.tableData[this.index]['vrDeviceName'] = this.selected.name;
this.tableData.splice(this.index, 1, this.tableData[this.index]);
}
} catch (error) {
console.error(error);
}
});
},
async cancel(row, index) {
this.$confirm('您确定将次设备断开, 是否继续?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(async () => {
if (row.vrDeviceCode) {
row.vrDeviceCode = '';
row.vrDeviceName = '';
this.tableData.splice(index, 1, row);
try {
const res = await putSimulationDisconnectById(this.group, row.id);
if (res && res.code == 200) {
this.$message.success('断开成功!');
}
} catch (error) {
console.error(error);
}
}
});
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.plc_box{
float: left;
margin-right: 40px;
padding: 9px;
}
.freshen_box{
float: right;
}
.flex_box{
float: left;
margin-right: 5px;
line-height: 30px;
}
/deep/ {
.el-dialog__wrapper{
width: 800px;
}
.dialog_box{
height: 100%;
}
.el-dialog__body{
padding-top: 6px;
height: calc(100% - 54px);
}
}
</style>

651
src/views/newMap/displayNew/demon/faultChoose.vue
View File

@ -1,651 +0,0 @@
<template>
<div v-if="dialogShow" id="faultChoose">
<div class="falutChooseTitle">{{ title }}</div>
<div class="closeFalutChoose" @click="closeFaultChoose">
<span class="el-icon-close closeFalutChooseIn" />
</div>
<!-- <div class="minimizeFalutChoose">
<span class="el-icon-close closeFalutChooseIn" />
</div> -->
<el-card class="triggerFaultInfo">
<el-button type="primary" size="small" style="margin-bottom:10px;" @click="isTableShow=!isTableShow">{{ isTableShow?'隐藏列表':'显示列表' }}</el-button>
<el-table v-if="isTableShow" :data="faultList" height="300" border style="width: 100%;font-size:13px;">
<el-table-column prop="targetDeviceCode" label="目标设备" width="220">
<template slot-scope="scope">
<span>{{ `${deviceMap[scope.row.targetDeviceType]}${formatNameByCode(scope.row.targetDeviceCode)}` }}</span>
</template>
</el-table-column>
<el-table-column prop="faultType" label="故障类型">
<template slot-scope="scope">
<span>{{ covertFaultType(scope.row) }}</span>
</template>
</el-table-column>
<!--<el-table-column prop="condition" label="触发方式">-->
<!--<template slot-scope="scope">-->
<!--<span>{{ scope.row.condition.type === 'DEVICE'?'设备':'时间' }}</span>-->
<!--</template>-->
<!--</el-table-column>-->
<el-table-column prop="condition" label="列车" width="100">
<template slot-scope="scope">
<span>{{ `${deviceMap[scope.row.condition.triggerDeviceType] || ''}${formatNameByCode(scope.row.condition.triggerDeviceCode)}` }}</span>
</template>
</el-table-column>
<!--<el-table-column prop="condition" label="触发状态">-->
<!--<template slot-scope="scope">-->
<!--<span>{{ formatTriggerStatus(scope.row.condition) }}</span>-->
<!--</template>-->
<!--</el-table-column>-->
<el-table-column prop="condition" label="到达区段" width="180">
<template slot-scope="scope">
<span>{{ `${formatNameByCode(scope.row.condition.triggerAssociatedDeviceCode)}` }}</span>
</template>
</el-table-column>
<el-table-column prop="condition.condition.triggerTime" label="触发时间" width="150" />
<el-table-column prop="triggeringTime" label="故障状态">
<template slot-scope="scope">
<span>{{ scope.row.triggeringTime? '已触发': '未触发' }}</span>
</template>
</el-table-column>
<el-table-column label="操作">
<template slot-scope="scope">
<el-button v-if="!scope.row.triggeringTime" type="text" size="small" @click="handleDelete(scope.row)">取消</el-button>
</template>
</el-table-column>
</el-table>
</el-card>
<div class="targetCard">
<!-- <el-card class="box-card"> -->
<div class="targetCardHead">
<el-button style="padding:3px 0" type="text" @click="addRulesCreate">新增</el-button>
</div>
<div>
<el-form ref="form" :model="faultRule" :inline="true" label-width="100px" style="margin-left:15px;">
<el-form-item label="目标设备" class="targetFormItem">
<!-- faultRule.targetDeviceCode -->
<el-input v-model="targetDeviceName" disabled size="small" class="inputModelClass" style="width: 300px;" />
<!--<el-button :type="field === 'targetActive' ? 'danger' : 'primary'" size="small" @click="hover('targetActive')">{{ $t('map.activate') }}</el-button>-->
</el-form-item>
<!--<el-form-item label="触发方式">-->
<!--<el-select v-model="triggerMode" size="small" style="width: 200px;" @change="changeTriggerMode">-->
<!--<el-option-->
<!--v-for="item in triggerModeList"-->
<!--:key="item.value"-->
<!--:label="item.label"-->
<!--:value="item.value"-->
<!--/>-->
<!--</el-select>-->
<!--</el-form-item>-->
<el-form-item label="故障类型" class="targetFormItem">
<el-select v-model="faultRule.faultType" placeholder="请选择" class="inputModelClass" size="small" style="width: 300px;">
<el-option
v-for="item in faultTypeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item v-if="triggerMode === 'DEVICE'" label="列车" class="targetFormItem">
<!-- faultRule.condition.triggerDeviceCode -->
<el-input v-model="triggerDevice" size="small" disabled class="inputModelClass" style="width: 240px;" />
<el-button :type="field === 'triggerActive' ? 'danger' : 'primary'" size="small" @click="hover('triggerActive')">{{ $t('map.activate') }}</el-button>
</el-form-item>
<!--<el-form-item v-if="triggerMode === 'DEVICE'" label="触发状态">-->
<!--&lt;!&ndash; <el-input v-model="faultRule.condition.triggerDeviceStatus" size="small" class="inputModelClass" /> &ndash;&gt;-->
<!--<el-select v-model="faultRule.condition.triggerDeviceStatus" placeholder="请选择" class="inputModelClass" size="small" style="width: 200px;">-->
<!--<el-option-->
<!--v-for="item in triggerStatusList"-->
<!--:key="item.value"-->
<!--:label="item.label"-->
<!--:value="item.value"-->
<!--/>-->
<!--</el-select>-->
<!--</el-form-item>-->
<el-form-item v-if="triggerMode === 'DEVICE'" label="到达区段" class="targetFormItem">
<el-input v-model="triggerAssociatedDevice" size="small" disabled class="inputModelClass" style="width: 240px;" />
<el-button :type="field === 'triggerAssociated'? 'danger': 'primary'" size="small" @click="hover('triggerAssociated')">{{ $t('map.activate') }}</el-button>
</el-form-item>
<el-form-item v-if="triggerMode === 'TIME'" label="触发时间" class="targetFormItem">
<el-date-picker
v-model="faultRule.condition.triggerTime"
size="small"
format="yyyy-MM-dd HH:mm:ss"
value-format="yyyy-MM-dd HH:mm:ss"
type="datetime"
placeholder="选择日期时间"
/>
</el-form-item>
</el-form>
</div>
<!-- </el-card> -->
</div>
</div>
</template>
<script>
import { getSimulationFaultRules, setFailureModeNew, deleteFailureRule, cancelFailureModeNew } from '@/api/simulation';
import ConstConfig from '@/scripts/ConstConfig';
import { FaultStatusEnum } from '@/scripts/FaultDicNew';
import ModelType from '@/jmapNew/constant/deviceType';
import { deviceFaultType } from '@/scripts/cmdPlugin/Config';
// 故障列表
export default {
name: 'FaultChoose',
props: {
group: {
type: String,
required: true
},
offset: {
type: Number,
required: true
}
},
data() {
return {
dialogShow: false,
loading: false,
isAdd:false,
isTableShow:true,
deviceMap: {},
simulationFault:{},
faultList: [],
faultRule:{
targetDeviceCode:'',
targetDeviceType:'',
faultType:'',
condition:{
triggerDeviceCode:'',
triggerDeviceStatus:'',
triggerDeviceType :'',
type:'DEVICE',
triggerTime: '',
triggerAssociatedDeviceCode: ''
}
},
triggerDevice:'',
triggerAssociatedDevice: '',
triggerMode: 'DEVICE',
triggerModeList: [
{label: '设备触发', value: 'DEVICE'},
{label: '时间触发', value: 'TIME'}
],
field:'',
triggerStatusList:[],
faultTypeList:[],
targetDeviceName: ''
};
},
computed: {
title() {
return '自动故障设置';
},
lineCode() {
return this.$route.query.lineCode;
},
targetDevice() {
return this.$store.state.training.triggerFaultDevice;
}
},
watch:{
'$store.state.socket.autoFaultTrigger':function(val) {
this.dialogShow && this.getSimulationFaultRules();
},
'$store.state.menuOperation.selectedCount':function(em) {
const device = this.$store.state.menuOperation.selected;
if (device && device.code) {
this.deviceSelect(device);
}
},
targetDevice: function(device) {
this.targetDeviceName = this.targetDevice.name || this.targetDevice.code;
}
},
mounted() {
this.deviceMap = [];
ConstConfig.ConstSelect.simulationDeviceList.forEach(elem => {
this.deviceMap[elem.value] = elem.label;
});
},
methods: {
formatNameByCode(code) {
let name = '';
const device = this.$store.getters['map/getDeviceByCode'](code);
if (device) {
switch (device._type) {
case ModelType.Signal:
case ModelType.Switch:
case ModelType.Station:
case ModelType.Section: {
if (device.parentName) {
name += device.parentName + '-' + device.name;
} else {
name += device.name;
}
break;
}
case ModelType.Train:
name = device.code;
break;
}
if (device.stationCode) {
const station = this.$store.getters['map/getDeviceByCode'](device.stationCode);
if (station) {
name += '【' + station.name + '】';
}
}
}
return name;
},
// formatTriggerStatus(condition) {
// if (!condition.triggerDeviceType) {
// return '';
// }
// const faultStatus = FaultStatusEnum[condition.triggerDeviceType];
// return faultStatus[condition.triggerDeviceStatus];
// },
hover(field) {
if (this.field == '') {
this.field = field;
} else {
this.field = '';
}
},
handleDelete(row) {
cancelFailureModeNew(row.id, this.$route.query.group).then(resp => {
this.getSimulationFaultRules();
}).catch(() => {
this.$message.error('取消故障失败！');
});
},
covertType(type) {
switch (type) {
case 'SECTION':return 'Section';
case 'SIGNAL':return 'Signal';
case 'SWITCH':return 'Switch';
case 'STATION':return 'Station';
case 'ZC':return 'ZcControl';
case 'STAND':return 'StationStand';
case 'TRAIN':return 'Train';
case 'Section':return 'SECTION';
case 'Signal':return 'SIGNAL';
case 'Switch':return 'SWITCH';
case 'Station':return 'STATION';
case 'ZcControl':return 'ZC';
case 'StationStand':return 'STAND';
case 'Train':return 'TRAIN';
}
},
covertFaultType(row) {
let faultType = '';
if (row && row.id) {
let type = this.covertType(row.targetDeviceType);
if (type == 'Station') {
type = 'ZcControl';
}
const currentList = deviceFaultType[type];
currentList.forEach(temp=>{
if (temp.value === row.faultType) {
faultType = temp.label;
}
});
}
return faultType;
},
closeFaultChoose() {
this.dialogShow = false;
this.isAdd = false;
if (this.$refs.addFault) {
this.$refs.addFault.resetForm();
}
},
closeAddRules() {
this.isAdd = false;
},
getSimulationFaultRules() {
if (this.dialogShow) {
getSimulationFaultRules(this.$route.query.group).then(resp => {
this.faultList = resp.data;
}).catch(() => {
this.$messageBox('获取数据异常');
});
}
},
changeTriggerMode(val) {
this.resetForm();
this.triggerMode = val;
this.faultRule.condition.type = val;
},
doShow() {
this.dialogShow = true;
this.getSimulationFaultRules();
this.resetForm();
this.faultTypeList = deviceFaultType[this.targetDevice._type];
this.faultRule.targetDeviceCode = this.targetDevice.code;
this.faultRule.targetDeviceType = this.covertType(this.targetDevice._type);
this.faultRule.faultType = (this.faultTypeList[0] || {}).value;
this.$nextTick(()=>{
this.dragEvent();
});
},
resetForm() {
this.getSimulationFaultRules();
this.field = '';
this.triggerDevice = '';
this.triggerAssociatedDevice = '';
this.faultRule = {
targetDeviceCode:this.targetDevice.code,
targetDeviceType:this.covertType(this.targetDevice._type),
faultType:'',
condition:{
triggerDeviceCode:'',
triggerDeviceStatus:'',
triggerDeviceType :'',
type:'DEVICE',
triggerTime: '',
triggerAssociatedDeviceCode: ''
}
};
},
doClose() {
this.dialogShow = false;
},
handleAdd() {
this.isAdd = true;
this.$nextTick(() => {
this.$refs.addFault.initValue();
});
},
deleteFailure(index, row) {
event.cancelBubble = true;
this.$confirm('删除故障规则，是否继续？', '提 示', {
confirmButtonText: '确 定',
cancelButtonText: '取 消',
type: 'warning'
}).then(() => {
deleteFailureRule(row.id).then(resp => {
}).catch(error => {
this.$message.error(`删除故障规则失败: ${error.message}`);
});
}).catch( () => { });
},
settingFailure(index, row, idx) {
const faultModel = {ruleId: row.id, auto:true};
// row['loading' + idx] = true;
setFailureModeNew(faultModel, this.group).then(() => {
this.getSimulationFaultRules();
this.$message.success('设置自动故障成功');
}).catch(() => {
this.$messageBox('设置自动故障失败');
});
},
cancleAutoFault() {
const faultModel = {auto:false};
setFailureModeNew(faultModel, this.group).then(() => {
this.getSimulationFaultRules();
this.$message.success('取消自动故障成功');
}).catch(() => {
this.$messageBox('取消自动故障失败');
});
},
addRulesCreate() {
if (this.triggerMode === 'DEVICE' && this.triggerDevice == '') {
this.$messageBox('请选择触发设备');
return;
}
if (this.triggerMode === 'DEVICE' && this.faultRule.condition.triggerDeviceStatus == '') {
this.$messageBox('请选择触发状态');
return;
}
if (this.faultRule.faultType == '') {
this.$messageBox('请选择故障类型');
return;
}
if (this.triggerMode === 'TIME' && this.faultRule.condition.triggerTime == '') {
this.$messageBox('请选择触发时间');
return;
}
if (this.triggerMode === 'DEVICE' && this.faultRule.condition.triggerDeviceType === 'TRAIN' && this.faultRule.condition.triggerDeviceStatus === 'Section' && this.faultRule.condition.triggerAssociatedDeviceCode == '') {
this.$messageBox('请选择关联设备');
return;
}
const param = {
targetDeviceCode:this.targetDevice.code,
targetDeviceType:this.covertType(this.targetDevice._type),
faultType: this.faultRule.faultType,
condition:{
triggerDeviceCode: this.faultRule.condition.triggerDeviceCode || null,
triggerDeviceStatus:this.faultRule.condition.triggerDeviceStatus || null,
triggerDeviceType :this.faultRule.condition.triggerDeviceType || null,
type:this.faultRule.condition.type,
triggerTime: this.faultRule.condition.triggerTime || null,
triggerAssociatedDeviceCode: this.faultRule.condition.triggerAssociatedDeviceCode || null
}
};
setFailureModeNew(param, this.$route.query.group).then(res=>{
this.$message.success('创建故障成功！');
this.resetForm();
}).catch((error)=>{
this.$messageBox('创建故障失败: ' + error.message);
});
},
deviceSelect(em) {
if (this.field.toUpperCase() === 'triggerAssociated'.toUpperCase() && em._type.toUpperCase() === 'Section'.toUpperCase()) {
// if (em._type == 'Station') {
// em = this.$store.getters['map/getDeviceByCode'](em.zcCode);
// }
// this.faultRule.targetDeviceType = this.covertType(em._type);
// this.faultRule.targetDeviceCode = em.code;
if (em._type.toUpperCase() === 'Section'.toUpperCase() && em.parentName) {
this.triggerAssociatedDevice = em._type + '-' + em.parentName + '-' + em.name;
} else {
this.triggerAssociatedDevice = em._type + '-' + em.name;
}
this.faultRule.condition.triggerAssociatedDeviceCode = em.code;
} else if (this.field.toUpperCase() === 'triggerActive'.toUpperCase() && em._type.toUpperCase() === 'Train'.toUpperCase()) {
this.faultRule.condition.triggerDeviceType = this.covertType(em._type);
this.faultRule.condition.triggerDeviceCode = em.code;
if (em._type.toUpperCase() === 'Section'.toUpperCase() && em.parentName) {
this.triggerDevice = em._type + '-' + em.parentName + '-' + em.name;
} else if (em._type.toUpperCase() === 'Train'.toUpperCase()) {
this.triggerDevice = em._type + '-' + em.code;
} else {
this.triggerDevice = em._type + '-' + em.name;
}
this.triggerStatusList = [];
const faultStatus = FaultStatusEnum[this.faultRule.condition.triggerDeviceType];
if (faultStatus) {
const list = Object.keys(faultStatus);
list.forEach(key=>{
this.triggerStatusList.push({label:faultStatus[key], value:key});
});
}
this.field = '';
this.faultRule.condition.triggerDeviceStatus = (this.triggerStatusList[0] || {}).value;
}
},
dragEvent() {
const offset = this.offset;
const dialogHeaderEl = document.querySelector('.falutChooseTitle');
const dragDom = document.querySelector('#faultChoose');
dialogHeaderEl.style.cursor = 'move';
/** 获取原有属性 ie dom元素.currentStyle 火狐谷歌 window.getComputedStyle(dom元素, null);*/
const sty = dragDom.currentStyle || window.getComputedStyle(dragDom, null);
dialogHeaderEl.onmousedown = (e) => {
/** 鼠标按下，计算当前元素距离可视区的距离*/
const disX = e.clientX - dialogHeaderEl.offsetLeft;
const disY = e.clientY - dialogHeaderEl.offsetTop;
/** 获取到的值带px 正则匹配替换*/
let styL, styT;
/** 注意在ie中 第一次获取到的值为组件自带50% 移动之后赋值为px*/
if (sty.left.includes('%')) {
// eslint-disable-next-line no-useless-escape
styL = +document.body.clientWidth * (+sty.left.replace(/\%/g, '') / 100);
styT = +document.body.clientHeight * (+sty.top.replace(/\%/g, '') / 100);
} else {
// eslint-disable-next-line no-useless-escape
styL = +sty.left.replace(/\px/g, '');
// eslint-disable-next-line no-useless-escape
styT = +sty.top.replace(/\px/g, '');
}
document.onmousemove = function (e) {
/** 通过事件委托，计算移动的距离*/
const l = e.clientX - disX;
const t = e.clientY - disY;
/** 移动当前元素*/
// dragDom.style.left = `${l + styL}px`;
// dragDom.style.top = `${t + styT}px`;
/** 移动当前元素*/
if (l + styL < 0) {
dragDom.style.left = `0px`;
} else if (l + styL > document.body.clientWidth - dragDom.clientWidth - 10) {
dragDom.style.left = `${document.body.clientWidth - dragDom.clientWidth - 10}px`;
} else {
dragDom.style.left = `${l + styL}px`;
}
if (t + styT <= offset) {
dragDom.style.top = offset + `px`;
} else if (t + styT > document.body.clientHeight - dragDom.clientHeight - 10) {
dragDom.style.top = `${document.body.clientHeight - dragDom.clientHeight - 10}px`;
} else {
dragDom.style.top = `${t + styT}px`;
}
/** 将此时的位置传出去*/
// binding.value({ x: e.pageX, y: e.pageY });
};
document.onmouseup = function () {
document.onmousemove = null;
document.onmouseup = null;
};
};
}
}
};
</script>
<style lang="scss">
#faultChoose .card .queryList .el-card .el-card__body .el-table--border .el-table__body-wrapper{
height: 135px !important;
overflow-y: auto !important;
}
#faultChoose .el-button--mini {
margin-left: 5px;
}
.triggerFaultListLeft{
display: inline-block;
float: left;
width: 730px;
}
// 谷歌、safari、qq浏览器、360浏览器滚动条样式
// 定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸
#faultChoose .el-table__body-wrapper::-webkit-scrollbar {
width: 6px;
height: 6px;
// height: 110px;
background-color: #FFFFFF;
}
/*定义滚动条轨道 内阴影+圆角*/
#faultChoose .el-table__body-wrapper::-webkit-scrollbar-track {
// box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
border-radius: 10px;
background-color: #FFFFFF;;
}
/*定义滑块 内阴影+圆角*/
#faultChoose .el-table__body-wrapper::-webkit-scrollbar-thumb {
border-radius: 10px;
// box-shadow: inset 0 0 6px rgba(0,0,0,.3);
background-color: #eaeaea;
}
/*滑块效果*/
#faultChoose .el-table__body-wrapper::-webkit-scrollbar-thumb:hover {
border-radius: 5px;
// box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
background: rgba(0,0,0,0.4);
}
/*IE滚动条颜色*/
html {
scrollbar-face-color:#bfbfbf;/*滚动条颜色*/
scrollbar-highlight-color:#000;
scrollbar-3dlight-color:#000;
scrollbar-darkshadow-color:#000;
scrollbar-Shadow-color:#adadad;/*滑块边色*/
scrollbar-arrow-color:rgba(0,0,0,0.4);/*箭头颜色*/
scrollbar-track-color:#eeeeee;/*背景颜色*/
}
</style>
<style scoped rel="stylesheet/scss" lang="scss">
.triggerFaultInfo{
margin-bottom:10px;
padding: 10px 10px 10px 15px;
}
.triggerFaultList{
font-size: 14px;
margin-top: 10px;
line-height: 20px;
}
.triggerFaultTitle{
font-size: 15px;
font-weight: bold;
}
.falutChooseTitle{
padding: 15px;
cursor: all-scroll;
}
#faultChoose{
width: 1000px;
position: absolute;
left: 30%;
top: 20%;
background: #fff;
padding:0px 0px 15px 0px;
// transform: translate3d(-50%,-50%,0);
border-radius: 6px;
z-index:999;
}
.faultChooseFoot{
display: inline-block;
float: right;
margin-right: 20px;
margin-top: 20px;
}
.closeFalutChoose{
position: absolute;
right: 0px;
top: 0px;
width: 35px;
height: 35px;
cursor: pointer;
}
.closeFalutChooseIn{
font-size: 20px;
margin-left: 5px;
margin-top: 10px;
}
.targetCard{
box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
border-top: 1px #ebeef5 solid;
}
.targetFormItem{
margin-bottom: 12px;
}
.targetCardHead{
padding: 5px;
display: inline-block;
width: 100%;
margin-bottom: 10px;
border-bottom: 1px #f4f4f4 solid;
text-align: right;
padding-right: 15px;
}
</style>

80
src/views/newMap/displayNew/demon/modifyTime.vue
View File

@ -1,80 +0,0 @@
<template>
<el-dialog v-dialogDrag :title="title" :visible.sync="show" width="550px" :before-close="doClose">
<el-form ref="form" label-width="120px" :model="formModel" :rules="rules">
<el-form-item :label="$t('display.setTime.systemTime')" prop="time">
<el-time-picker
v-model="formModel.time"
:picker-options="pickerOptions"
:placeholder="$t('display.setTime.anyTime')"
/>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="show = false">{{ $t('global.cancel') }}</el-button>
<el-button type="primary" :loading="status" @click="handleSure">{{ $t('global.confirm') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { modifySystemTime } from '@/api/simulation';
import { timestampFormat } from '@/utils/date';
// 修改系统时间
export default {
data() {
return {
show: false,
formModel: {
time: new Date()
},
maxNumber: 1,
pickerOptions: { selectableRange: '00:00:00 - 23:59:59' },
status: false
};
},
computed: {
title() {
return '修改系统时间';
},
group() {
return this.$route.query.group;
},
rules() {
return {
time: [
{ required: true, message: this.$t('display.setTime.selectSystemTime'), trigger: 'change' }
]
};
}
},
methods: {
doShow() {
// this.formModel.time = new Date(this.$store.state.training.initTime || null);
this.show = true;
},
doClose() {
this.status = false;
this.show = false;
},
handleSure() {
this.$refs.form.validate((valid) => {
if (valid) {
this.status = true;
const model = {
time: timestampFormat('HH:mm:ss', this.formModel.time)
};
modifySystemTime(model, this.group).then(resp => {
this.status = false;
this.$message.success('修改系统时间成功！');
}).catch(() => {
this.status = false;
this.$messageBox('修改系统时间失败，请稍后再试');
});
this.doClose();
}
});
}
}
};
</script>

128
src/views/newMap/displayNew/demon/payPage.vue
View File

@ -1,128 +0,0 @@
<template>
<el-dialog
title="订单"
:visible.sync="dialogVisible"
width="30%"
center
:before-close="handleClose"
>
<el-row style="font-size: 16px; height: 30px;line-height: 30px;">
<el-col :span="6" :offset="2">产品：</el-col>
<el-col :span="16">全国行车调度员大赛训练系统</el-col>
</el-row>
<el-row style="font-size: 16px; height: 30px;line-height: 30px;">
<el-col :span="6" :offset="2">单价：</el-col>
<el-col :span="16">200元/月</el-col>
</el-row>
<el-row style="font-size: 16px; height: 30px;line-height: 30px;">
<el-col :span="6" :offset="2">购买月数：</el-col>
<el-col :span="16"><el-input-number v-model="monthAmount" size="mini" :min="1" :max="999" :precision="0" :step="1" :disabled="!changeMonth" /></el-col>
</el-row>
<el-row style="font-size: 16px; height: 30px;line-height: 30px;">
<el-col :span="6" :offset="2">总价：</el-col>
<el-col :span="16">{{ unitPrice * monthAmount + ' 元' }}</el-col>
</el-row>
<div style="text-align: center;margin: 20px;">
<el-button type="primary" size="mini" :disabled="!changeMonth" @click="orderDetermine">生成订单</el-button>
<el-button type="primary" size="mini" :disabled="changeMonth" @click="changeOrder">修改订单</el-button>
</div>
<el-row style="font-size: 16px; height: 30px;line-height: 30px;">
<el-col :span="6" :offset="2">订单号：</el-col>
<el-col :span="16">{{ orderCode }}</el-col>
</el-row>
<el-row style="font-size: 16px;height: 200px;">
<el-col :span="6" :offset="2">支付码：</el-col>
<el-col :span="16">
<div style="width: 150px;">
<qrcode-vue
v-loading="loading"
:value="url"
:size="150"
element-loading-spinner="el-icon-refresh"
element-loading-background="rgba(255, 255, 255, 0.9)"
/>
</div>
<div v-if="paySuccess" style="position: relative; top: -50px;color: #0B840B;z-index: 8888;font-size: 18px;text-align: center;width: 150px;font-weight: bold;">
<div>订单支付成功!</div>
<div>{{ `将在${countdown}后自动关闭` }}</div>
</div>
</el-col>
</el-row>
</el-dialog>
</template>
<script>
import { getPayQrCode } from '@/api/competition';
import QrcodeVue from 'qrcode.vue';
export default {
name: 'PayPage',
components: { QrcodeVue },
data() {
return {
dialogVisible: false,
monthAmount: 1,
unitPrice: 200,
loading: true,
changeMonth: true,
url: '',
orderCode: '',
paySuccess: false,
countdown: 10,
timer: null
};
},
watch: {
'$store.state.socket.payOrder':function (val) {
if (this.orderCode == val) {
this.paySuccess = true;
this.loading = true;
this.url = '';
this.timer = setInterval(() => {
this.countdown--;
if (this.countdown <= 0) {
this.handleClose();
}
}, 1000);
}
}
},
methods: {
handleClose() {
this.dialogVisible = false;
this.timer && clearInterval(this.timer);
},
doShow() {
this.loading = true;
this.dialogVisible = true;
this.monthAmount = 1;
this.countdown = 10;
this.url = '';
this.changeMonth = true;
this.paySuccess = false;
},
changeOrder() {
this.loading = true;
this.changeMonth = true;
this.orderCode = '';
this.url = '';
},
orderDetermine() {
this.loading = true;
this.changeMonth = false;
getPayQrCode(this.$route.query.mapId, this.monthAmount).then(resp => {
this.url = resp.data.code_url;
this.orderCode = resp.data.orderCode;
this.loading = false;
}).catch(error => {
console.error(error);
this.dialogVisible = false;
this.$messageBox('生成支付二维码错误,请您重新尝试！');
});
}
}
};
</script>
<style scoped>
</style>

673
src/views/newMap/displayNew/demon/planSchedule.vue
View File

@ -1,673 +0,0 @@
<template>
<div id="PlanSchedule" :style="{top: top+'px', height: height+'px'}">
<el-button size="small" style="position: fixed; top: 5px;right: 5px;" type="primary" plain @click="quit">退出</el-button>
<el-button size="small" style="position: fixed; top: 5px;right: 70px;" type="primary" plain @click="handlePfiNum">{{ pfiNumFlag ? '隐藏客流量' : '显示客流量' }}</el-button>
<div class="left">
<div :id="runPlanId" />
</div>
<div class="right">
<data-table
ref="serviceTable1"
:height="height/2"
:config="serviceNumberConfig"
:style="{top: top-height/2+'px'}"
@touch="scheduleTouch"
/>
<data-table
ref="tripTable1"
:height="height/2"
:config="tripNumberConfig"
:style="{top: top-height/2+'px'}"
@touch="trainNumTouch"
/>
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex';
import { timeFormat } from '@/utils/date';
import DataTable from '@/views/planSchedule/menusPlan/components/dataTable';
import echarts from 'echarts';
import {toTimeStamp, formatDuring} from '@/utils/date';
import { deepAssign } from '@/utils/index';
import { EventBus } from '@/scripts/event-bus';
import { getByGroupStationList, getPassengerHistoryList } from '@/api/jmap/map';
import { loadRunPlanData } from '@/utils/loaddata';
import { creatSubscribe, clearSubscribe, displayTopic, LPFTopic} from '@/utils/stomp';
import { getSimulationInfoNew } from '@/api/simulation';
import { getToken } from '@/utils/auth';
export default {
name: 'PlanSchedule',
components: {
DataTable
},
data() {
return {
top: 0,
height: 0,
inter:null,
runPlanId: 'run-plan-view',
myChart: null,
PlanConvert: {},
serviceNumberConfig: {
data: [],
highlightCurrentRow: true,
handleChange: this.serviceNumberChange,
showClose: false,
columns: [
{
prop: 'serviceNumber',
label: '表号'
},
{
width: 40
}
]
},
tripNumberConfig: {
data: [],
highlightCurrentRow: true,
handleChange: this.tripNumberChange,
showClose: false,
columns: [
{
prop: 'tripNumber',
label: '车次号'
},
{
width: 40
}
]
},
realData: {},
kmRangeCoordMap: {},
absoluteTime: 2 * 3600,
indexKmRangeMap: {},
dialogLoading: false,
dialogShow: false,
seriesMap: {},
staticSeries: [],
runSeries: [],
selectSeries: [],
runPlanData: {},
pfiNumFlag: true,
pfiNumList: [] // 客流量列表
};
},
computed: {
...mapGetters('runPlan', [
'stations'
]),
maxWidth() {
return this.$store.state.app.width > 1920 ? 1920 : this.$store.state.app.width;
},
maxHeight() {
return this.$store.state.app.height > 1080 ? 1080 : this.$store.state.app.height;
},
title() {
return this.$t('display.runPlan.previewRunDiagram');
}
},
watch: {
maxWidth() {
this.setPosition();
},
maxHeight() {
this.setPosition();
},
'$store.state.runPlan.planLoadedCount': async function () {
try {
await this.loadChartPage();
this.selectSeries = []; this.runSeries = []; this.runPlanData = {}; this.pfiNumList = [];
// console.log('清除计划车次');
if (this.dialogShow) {
await this.loadInitData();
}
} catch (e) {
console.error(e);
} finally {
this.loading = false;
}
},
'$store.state.socket.simulationReset': function (val) {
this.selectSeries = []; this.runSeries = []; this.runPlanData = {}; this.pfiNumList = [];
this.loadInitData();
},
'$store.state.runPlan.planSizeCount': function () {
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
},
'$store.state.socket.trainStationList': function (val) {
if (val.length) {
this.updateRunPlanData(val);
}
},
'$store.state.socket.stationPfiNum': function (data) {
if (data) {
this.updateRunPlanPfiNum(data);
this.$store.dispatch('socket/setStationPfiNum');
}
},
'$store.state.socket.simulationOver':function(val) {
this.quit();
},
'$store.state.runPlan.loadRunPlanCount': function () {
this.loadChartPage();
this.setPosition();
this.loadInitData();
this.inter && clearInterval(this.inter);
this.subscribe();
},
'$store.state.socket.isFirst':function(val) {
if (val) {
const header = { group: this.group || '', 'X-Token': getToken() };
creatSubscribe(`${LPFTopic}\/${this.$route.query.group}`, header);
}
}
},
created() {
this.$store.dispatch('app/transitionAnimations');
this.loadRunData();
this.staticSeries = []; this.selectSeries = []; this.runSeries = []; this.runPlanData = {};
this.PlanConvert = this.$theme.loadPlanConvert(this.$route.query.lineCode);
EventBus.$on('clearRunSeries', () => {
this.runSeries = [];
});
},
beforeDestroy() {
this.destroy();
this.clearSubscribe();
this.$store.dispatch('runPlan/setPlanData', []);
this.$store.dispatch('socket/setIsFirst', false);
},
methods: {
async subscribe() {
this.clearSubscribe();
const header = { group: this.$route.query.group || '', 'X-Token': getToken() };
creatSubscribe(`${displayTopic}\/${this.$route.query.group}`, header);
// creatSubscribe(`${LPFTopic}\/${this.$route.query.group}`, header);
// await this.$store.dispatch('training/setHasSubscribed');
this.$store.dispatch('app/animationsClose');
},
clearSubscribe() {
clearSubscribe(`${displayTopic}\/${this.$route.query.group}`);
clearSubscribe(`${LPFTopic}\/${this.$route.query.group}`);
},
loadRunData() {
this.$store.dispatch('runPlan/clear').then(() => {
if (this.$route.query.group) {
// 获取排序的车站列表
getByGroupStationList(this.$route.query.group).then(response => {
getSimulationInfoNew(this.$route.query.group).then(res => {
this.$store.dispatch('runPlan/setRunPlanInfo', res.data.runPlan);
this.$store.dispatch('runPlan/setStations', response.data).then(async() => {
loadRunPlanData(this.$route.query.group, this.dataError);
});
});
}).catch(() => {
this.$messageBox(this.$t('display.schema.getStationListFail'));
});
}
});
},
async doClose() {
this.dialogShow = false;
this.inter && clearInterval(this.inter);
},
serviceNumberChange(row) {
if (row) {
this.$store.dispatch('runPlan/setSelected', { serviceNumber: row.serviceNumber, tripNumber: null });
this.renderTripNumber({ serviceNumber: row.serviceNumber, tripNumber: null });
const serviceObj = this.$store.state.runPlan.editData[row.serviceNumber];
if (serviceObj) {
this.analyticalTripNumber(serviceObj.trainMap);
}
}
},
tripNumberChange(row) {
if (row) {
this.$store.dispatch('runPlan/setSelected', { serviceNumber: this.$store.state.runPlan.selected.serviceNumber, tripNumber: row.tripNumber });
this.renderTripNumber({ serviceNumber: this.$store.state.runPlan.selected.serviceNumber, tripNumber: row.tripNumber });
}
},
async analyticalServiceNumber(data) {
this.serviceNumberConfig.data = Object.keys(data || {})
// .sort((a, b) => { return data[a].oldIndex - data[b].oldIndex; })
.sort((a, b) => { return parseInt(data[a].serviceNumber) - parseInt(data[b].serviceNumber); })
.map(serviceNumber => { return { serviceNumber }; });
},
async analyticalTripNumber(data) {
this.tripNumberConfig.data = Object.keys(data || {})
.sort((a, b) => { return data[a].tripNumber - data[b].tripNumber; })
.map(tripNumber => { return { tripNumber }; });
},
async setPosition() {
this.$nextTick(() => {
const top = 54;
const width = this.maxWidth * 0.85;
let height = this.maxHeight;
height = height - top;
this.$store.dispatch('runPlan/resize', { width, height });
if (this.top != top) {
this.top = top;
}
if (this.height != height) {
this.height = height - top;
}
});
},
updateRunPlanPfiNum(data) {
// const option = this.myChart.getOption();
// const series = option.series;
// const seriesList = series.filter(elem => elem.type != 'bar');
this.handleStationNum(data);
if (this.pfiNumFlag) {
const series = [...this.staticSeries, ...this.runSeries, ...this.selectSeries, ...this.pfiNumList];
this.myChart && this.myChart.setOption({series: series});
}
},
updateRunPlanData(data) {
const stations = this.$store.state.runPlan.stations;
data.forEach(item => {
item.secondTime = item.second;
});
this.kmRangeCoordMap = this.PlanConvert.convertStationsToMap(stations);
this.runSeries = this.PlanConvert.updateDataToModels(data, stations, this.kmRangeCoordMap,
this.runPlanData, this.runSeries, { color: '#FF00DE', width: 2 }
);
const series = [...this.staticSeries, ...this.runSeries, ...this.selectSeries];
this.myChart && this.myChart.setOption({series: series});
},
handleStationNum(data) {
const timeDate = (data.systemTime).split(' ')[0];
const time = ((+new Date(data.systemTime) - (+new Date(`${timeDate} 00:00:00`))) / 1000) - this.PlanConvert.TranslationTime;
let index = 1;
this.stations.forEach((station, ii) => {
if (station.visible) {
const stationObj = data.data.find(ele => ele.stationCode == station.code);
const judge = this.pfiNumList.find(ele => ele.code == station.code);
if (!judge) {
this.pfiNumList.push({
name: '客流量',
type: 'bar',
code: station.code,
barGap: '-100%',
yAxisIndex: index++,
barWidth: '3000%',
itemStyle: {
color: '#3BAAF7'
},
z: 10,
data: [[time, stationObj.passengerQuantity]]
});
} else {
judge.data.push([time, stationObj.passengerQuantity]);
}
}
});
},
handlePfiNum() {
const option = this.myChart.getOption();
const series = option.series;
if (this.pfiNumFlag) {
series.forEach(item => {
if (item.type == 'bar') {
item.itemStyle = {
color: 'rgba(0,0,0,0)'
};
}
});
} else {
series.forEach(item => {
if (item.type == 'bar') {
item.itemStyle = {
color: '#3BAAF7'
};
}
});
}
this.myChart && this.myChart.setOption({series: series});
this.pfiNumFlag = !this.pfiNumFlag;
},
async loadChartPage() {
try {
this.seriesMap = {};
this.staticSeries = [];
const stations = this.$store.state.runPlan.stations;
const planData = this.$store.state.runPlan.planData;
this.kmRangeCoordMap = this.PlanConvert.convertStationsToMap(stations);
this.pushModels(this.staticSeries, [this.PlanConvert.initializeYaxis(stations)]);
this.staticSeries = this.pushModels(this.staticSeries, this.PlanConvert.convertDataToModels(planData, stations, this.kmRangeCoordMap, { color: '#000', width: 0.5 }));
this.staticSeries.forEach(item => {
this.seriesMap[item.name] = item;
});
await this.analyticalServiceNumber(this.$store.state.runPlan.editData);
// 客流量历史数据渲染
const res = await getPassengerHistoryList(this.$route.query.group);
if (res.code == 200) {
res.data.forEach(item => {
this.handleStationNum(item);
});
}
const series = [...this.staticSeries, ...this.runSeries, ...this.selectSeries, ...this.pfiNumList];
this.myChart && this.myChart.setOption({series: series});
} catch (error) {
console.log(error, '====');
this.$messageBox(`加载运行图数据失败`);
}
},
async loadInitData() {
this.myChart && this.myChart.showLoading();
const option = {
tooltip: {
axisPointer: {
trigger: 'item',
type: 'cross'
},
formatter: this.axisTooltip,
borderWidth: 1
},
grid: [
{
right: '40px',
left: '120px',
height: '85%'
}
],
xAxis: [
{
type: 'category',
data: [],
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
formatter: this.xAxisLableFormat,
textStyle: {
color: '#333'
}
},
axisPointer: {
snap: true,
label: {
formatter: this.xAxisPointFormat,
backgroundColor: 'rgb(255,0,0,0.5)',
color: 'white'
}
}
}
],
yAxis: [
{
type: 'value',
splitLine: {
show: false
},
axisTick: {
show: false
},
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
interval: 'auto',
formatter: this.yAxisLableFormat
},
axisPointer: {
xAxisIndex: 'all',
label: {
formatter: this.yAxisPointFormat,
backgroundColor: 'rgb(0,100,0,0.5)',
color: 'white'
}
}
}
],
dataZoom: [{
type: 'inside'
},
{
fiterMode: 'filter',
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
handleSize: '80%',
handleStyle: {
color: '#fff',
shadowBlur: 3,
shadowColor: 'rgba(0, 0, 0, 0.6)',
shadowOffsetX: 2,
shadowOffsetY: 2
},
bottom: '20px'
}],
series: []
};
await this.xAxisInit(option);
await this.yAxisInit(option);
await this.loadInitChart(option);
this.myChart && this.myChart.hideLoading();
},
pushModels(series, models) {
if (models && models.length) {
models.forEach(elem => {
if (elem) {
series.push(elem);
}
});
}
return series;
},
loadInitChart(option) {
return new Promise((resolve, reject) => {
try {
this.destroy();
let startValue = 3600 + this.PlanConvert.TranslationTime;
const offsetTime = 3600;
const initTime = toTimeStamp(formatDuring(parseInt(this.$route.query.initTime)));
startValue = initTime - this.PlanConvert.TranslationTime;
option.dataZoom[0].startValue = option.dataZoom[1].startValue = startValue - offsetTime;
option.dataZoom[0].endValue = option.dataZoom[1].endValue = startValue + offsetTime;
if (this.pfiNumFlag) {
option.series = [...this.staticSeries, ...this.runSeries, ...this.selectSeries, ...this.pfiNumList];
} else {
option.series = [...this.staticSeries, ...this.runSeries, ...this.selectSeries];
}
this.myChart = echarts.init(document.getElementById(this.runPlanId));
if (this.myChart) {
this.myChart.setOption(option);
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
this.myChart.on('click', this.mouseClick);
}
resolve(true);
} catch (error) {
reject(error);
}
});
},
xAxisPointFormat(params) {
return timeFormat(params.value);
},
yAxisPointFormat(params) {
return this.PlanConvert.computedFormatYAxis(this.stations, params);
},
xAxisLableFormat(value, index) {
return timeFormat(value);
},
yAxisLableFormat(value, index) {
return '';
},
xAxisInit(option) {
const list = [];
for (var time = 0 + this.PlanConvert.TranslationTime; time < 3600 * 24 + this.PlanConvert.TranslationTime; time++) {
list.push(time);
}
const startValue = 3600 * 6;
const offsetTime = 3600 * 1;
option.xAxis[0].data = list;
if (!option.dataZoom[0].startValue) {
option.dataZoom[0].startValue = option.dataZoom[1].startValue = startValue - offsetTime;
}
if (!option.dataZoom[0].endValue) {
option.dataZoom[0].endValue = option.dataZoom[1].endValue = startValue + offsetTime;
}
},
yAxisInit(option) {
if (Object.keys(this.PlanConvert).length) {
option.yAxis[0].min = this.PlanConvert.computedYaxisMinValue(this.stations);
option.yAxis[0].max = this.PlanConvert.computedYaxisMaxValue(this.stations);
let index = 1;
this.stations.forEach((station, ii) => {
if (station.visible) {
option.yAxis.push({
type: 'value',
min: Math.floor(option.yAxis[0].min - this.PlanConvert.getYaxisValueByStation(station, ii)),
max: Math.floor(option.yAxis[0].max - this.PlanConvert.getYaxisValueByStation(station, ii)),
show: false,
yAxisIndex : index++
});
}
});
}
},
axisTooltip(param) {
if (param.seriesType == 'bar') {
return [
`Point Data <hr size=1 style=" margin: 3px 0">`,
`车站客流量: ${param.data[1]} 人 <br>`,
`当前时间: ${timeFormat(param.data[0] + this.PlanConvert.TranslationTime)}<br>`
].join('');
} else {
const station = (this.$store.getters['map/getDeviceByCode'](param.data[2])) || { name: '', kmRange: '' };
return [
`Point Data <hr size=1 style=" margin: 3px 0">`,
`车站名称: ${station.name}<br>`,
`车站公里标: ${station.kmRange} km <br>`,
`到站时间: ${timeFormat(param.data[0] + this.PlanConvert.TranslationTime)} (${param.data[0]})<br>`
].join('');
}
},
renderTripNumber(params) {
const tripNumber = params.tripNumber; // 车次号
const serviceNumber = params.serviceNumber; // 服务号
let data, markPoint;
if (tripNumber && this.seriesMap[serviceNumber]) {
const temp = this.seriesMap[serviceNumber].data.filter(elem => elem[3] == tripNumber);
if (temp.length) {
data = temp;
this.seriesMap[serviceNumber].markPoint.data.forEach(each=> {
if (each.name == temp[0][4]) {
markPoint = deepAssign({}, {data:[each]});
markPoint.symbol = 'roundRect';
markPoint.symbolSize = 1;
markPoint.data[0].label.color = '#f00';
}
});
}
} else if (this.seriesMap[serviceNumber]) {
markPoint = deepAssign({}, this.seriesMap[serviceNumber].markPoint);
markPoint.data.forEach(each => {
each.label.color = '#f00';
});
data = this.seriesMap[serviceNumber].data;
}
this.selectSeries = [{
name: 'trainLabel',
lineStyle: {
color: '#f00',
width: 2,
type: 'solid'
},
z: 10,
type: 'line',
markPoint:markPoint,
animation: false,
data: data
}];
const series = [...this.staticSeries, ...this.runSeries, ...this.selectSeries];
this.myChart && this.myChart.setOption({series: series});
},
mouseClick(params) {
const model = {
serviceNumber: params.seriesName
};
this.$store.dispatch('runPlan/setSelected', model);
},
reSize(opt) {
if (this.myChart) {
this.myChart.resize({
width: opt.width,
height: opt.height,
silent: false
});
}
},
destroy() {
if (this.myChart && this.myChart.isDisposed) {
this.myChart.dispose();
this.myChart = null;
}
},
scheduleTouch() {
},
trainNumTouch() {
},
quit() {
window.close();
}
}
};
</script>
<style scoped rel="stylesheet/scss" lang="scss">
@import "src/styles/mixin.scss";
#PlanSchedule {
z-index: 5;
position: absolute;
width: 100%;
.left {
height: 100%;
width: 85%;
float: left;
}
.right {
height: 100%;
width: 15%;
float: right;
}
}
/deep/ {
.el-dialog {
height: 100%;
max-height: 1080px;
}
.el-dialog__body {
padding: 0px !important;
background-color: floralwhite !important;
}
.el-dialog__headerbtn .el-dialog__close {
font-size: 18px;
border: 1px solid #909399;
border-radius: 5px;
}
}
</style>

45
src/views/newMap/displayNew/demon/runPlanEdit.vue
View File

@ -1,45 +0,0 @@
<template>
<div v-show="show" class="run-plan-dialog" style="width: 100%; height: 100%;z-index: 36;">
<edit-tool ref="planSchedule" @doClose="doClose" />
</div>
</template>
<script>
import EditTool from '@/views/planMonitor/newEditTool/index';
export default {
name: 'RunPlanEdit',
components: {
EditTool
},
data() {
return {
menus: null,
show: false
};
},
methods: {
doShow() {
this.show = true;
},
doClose() {
this.show = false;
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.run-plan-dialog {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
position: absolute;
z-index: 38;
top: 0px;
right: 0px;
background: white;
}
</style>

80
src/views/newMap/displayNew/demon/runPlanLoad.vue
View File

@ -1,80 +0,0 @@
<template>
<div v-show="show" class="run-plan-dialog" :style="{width: width + 'px',height:height + 'px'}">
<plan-schedule ref="planSchedule" :group="group" @back="doClose" />
</div>
</template>
<script>
import PlanSchedule from '@/views/planSchedule/index';
import { getSimulationInfoNew } from '@/api/simulation';
import { loadRunPlanData } from '@/utils/loaddata';
// 运行图加载
export default {
name: 'RunPlanLoad',
components: {
PlanSchedule
},
props: {
group: {
type: String,
required: true
}
},
data() {
return {
menus: null,
show: false
};
},
computed: {
title() {
return this.$t('display.runPlan.runDiagramPlanTool');
},
width() {
return this.$store.state.app.width > 1920 ? 1920 : this.$store.state.app.width;
},
height() {
return this.$store.state.app.height > 1080 ? 1080 : this.$store.state.app.height;
}
},
watch: {
'$store.state.socket.runPlanReloadCount': function (val) {
getSimulationInfoNew(this.group).then(res => {
this.$store.dispatch('runPlan/setRunPlanInfo', res.data.runPlan);
loadRunPlanData(this.group);
});
}
},
beforeDestroy() {
this.$store.dispatch('runPlan/setPlanData', []);
},
mounted() {
// this.menus = this.$theme.loadPlanComponent(this.$route.query.lineCode);
},
methods: {
doShow() {
this.show = true;
this.$refs.planSchedule.setPosition();
},
doClose() {
this.show = false;
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.run-plan-dialog {
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
position: absolute;
z-index: 38;
top: 0px;
right: 0px;
background: white;
}
</style>

657
src/views/newMap/displayNew/demon/runPlanView.vue
View File

@ -1,657 +0,0 @@
<template>
<el-dialog
v-dialogLoading="dialogLoading"
:title="title"
:width="maxWidth + 'px'"
top="0"
:style="{left:$store.state.app.width> 1920? '50%': '0'}"
:visible.sync="dialogShow"
:before-close="doClose"
:close-on-click-modal="false"
:modal="false"
>
<div id="PlanSchedule" :style="{top: top+'px', height: height+'px'}">
<div class="left">
<div :id="runPlanId" />
</div>
<div class="right">
<data-table
ref="serviceTable1"
:height="height/2"
:config="serviceNumberConfig"
:style="{top: top-height/2+'px'}"
@touch="scheduleTouch"
/>
<data-table
ref="tripTable1"
:height="height/2"
:config="tripNumberConfig"
:style="{top: top-height/2+'px'}"
@touch="trainNumTouch"
/>
</div>
</div>
</el-dialog>
</template>
<script>
import { mapGetters } from 'vuex';
import { timeFormat } from '@/utils/date';
import DataTable from '@/views/planSchedule/menusPlan/components/dataTable';
import echarts from 'echarts';
import {toTimeStamp, formatDuring} from '@/utils/date';
import { deepAssign } from '@/utils/index';
import { EventBus } from '@/scripts/event-bus';
let myChart = null;
export default {
name: 'PlanSchedule',
components: {
DataTable
},
props: {
group: {
type: String,
required: true
}
},
data() {
return {
top: 0,
height: 0,
inter:null,
runPlanId: 'run-plan-view',
// myChart: null,
PlanParser: {},
serviceNumberConfig: {
data: [],
highlightCurrentRow: true,
handleChange: this.serviceNumberChange,
showClose: false,
columns: [
{
prop: 'serviceNumber',
label: '表号'
},
{
width: 40
}
]
},
tripNumberConfig: {
data: [],
highlightCurrentRow: true,
handleChange: this.tripNumberChange,
showClose: false,
columns: [
{
prop: 'tripNumber',
label: '车次号'
},
{
width: 40
}
]
},
realData: {},
kmRangeMap: {},
absoluteTime: 2 * 3600,
indexKmRangeMap: {},
dialogLoading: false,
dialogShow: false,
seriesMap: {},
staticSeries: [],
runSeries: [],
selectSeries: [],
runPlanData: {}
};
},
computed: {
...mapGetters('runPlan', [
'stations'
]),
maxWidth() {
return this.$store.state.app.width > 1920 ? 1920 : this.$store.state.app.width;
},
maxHeight() {
return this.$store.state.app.height > 1080 ? 1080 : this.$store.state.app.height;
},
title() {
return this.$t('display.runPlan.previewRunDiagram');
}
},
watch: {
maxWidth() {
this.setPosition();
},
maxHeight() {
this.setPosition();
},
'$store.state.runPlan.planLoadedCount': async function () {
try {
await this.loadChartPage();
this.selectSeries = []; this.runSeries = []; this.runPlanData = {};
if (this.dialogShow) {
await this.loadInitData();
}
} catch (e) {
console.error(e);
} finally {
this.loading = false;
}
},
'$store.state.socket.simulationReset': function (val) {
this.selectSeries = []; this.runSeries = []; this.runPlanData = {};
if (this.dialogShow) {
this.loadInitData();
}
},
'$store.state.runPlan.planSizeCount': function () {
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
},
'$store.state.socket.trainStationList': function (val) {
if (val.length) {
this.updateRunPlanData(val);
}
}
},
mounted() {
this.staticSeries = []; this.selectSeries = []; this.runSeries = []; this.runPlanData = {};
this.PlanParser = this.$theme.loadPlanParser(this.$route.query.lineCode);
// this.loadChartPage();
EventBus.$on('clearRunSeries', () => {
this.runSeries = [];
});
},
beforeDestroy() {
this.$store.dispatch('runPlan/setSelected', null);
this.destroy();
},
methods: {
async doShow() {
try {
this.dialogLoading = true;
this.dialogShow = true;
this.setPosition();
this.loadInitData();
this.inter && clearInterval(this.inter);
} catch (e) {
console.error(e);
} finally {
this.dialogLoading = false;
}
},
async doClose() {
this.dialogShow = false;
this.inter && clearInterval(this.inter);
},
serviceNumberChange(row) {
if (row) {
this.$store.dispatch('runPlan/setSelected', { serviceNumber: row.serviceNumber, tripNumber: null });
this.renderTripNumber({ serviceNumber: row.serviceNumber, tripNumber: null });
const serviceObj = this.$store.state.runPlan.editData[row.serviceNumber];
if (serviceObj) {
this.analyticalTripNumber(serviceObj.trainMap);
}
}
},
tripNumberChange(row) {
if (row) {
this.$store.dispatch('runPlan/setSelected', { serviceNumber: this.$store.state.runPlan.selected.serviceNumber, tripNumber: row.tripNumber });
this.renderTripNumber({ serviceNumber: this.$store.state.runPlan.selected.serviceNumber, tripNumber: row.tripNumber });
}
},
async analyticalServiceNumber(data) {
this.serviceNumberConfig.data = Object.keys(data || {})
.sort((a, b) => { return parseInt(data[a].serviceNumber) - parseInt(data[b].serviceNumber); })
.map(serviceNumber => { return { serviceNumber }; });
},
async analyticalTripNumber(data) {
this.tripNumberConfig.data = Object.keys(data || {})
.sort((a, b) => { return data[a].tripNumber - data[b].tripNumber; })
.map(tripNumber => { return { tripNumber }; });
},
async setPosition() {
this.$nextTick(() => {
const top = 54;
const width = this.maxWidth * 0.85;
let height = this.maxHeight;
height = height - top;
this.$store.dispatch('runPlan/resize', { width, height });
if (this.top != top) {
this.top = top;
}
if (this.height != height) {
this.height = height - top;
}
});
},
updateRunPlanData(data) {
const stations = this.$store.state.runPlan.stations;
data.forEach(item => {
item.secondTime = item.second;
});
this.kmRangeMap = this.PlanParser.convertStationsToMap(stations);
this.runSeries = this.PlanParser.updateDataToModels(data, stations, this.kmRangeMap,
this.runPlanData, this.runSeries, { color: '#FF00DE', width: 2 }
);
const series = [...this.staticSeries, ...this.runSeries, ... this.selectSeries];
myChart && myChart.setOption({series: series});
},
async loadChartPage() {
try {
this.seriesMap = {};
this.staticSeries = [];
const stations = this.$store.state.runPlan.stations;
const planData = this.$store.state.runPlan.planData;
this.kmRangeMap = this.PlanParser.convertStationsToMap(stations);
if (this.$route.query.lineCode === '07') {
this.pushModels(this.staticSeries, [this.PlanParser.initializeAxisX(stations)]);
} else {
this.pushModels(this.staticSeries, [this.PlanParser.initializeAxisY(stations)]);
}
this.staticSeries = this.pushModels(this.staticSeries, this.PlanParser.convertDataToModels(planData, stations, this.kmRangeMap, { color: '#000', width: 0.5 }));
this.staticSeries.forEach(item => {
this.seriesMap[item.name] = item;
});
await this.analyticalServiceNumber(this.$store.state.runPlan.editData);
} catch (error) {
console.log(error);
this.$messageBox(`加载运行图数据失败`);
}
},
async loadInitData() {
myChart && myChart.showLoading();
const option = {
tooltip: {
axisPointer: {
trigger: 'item',
type: 'cross'
},
formatter: this.axisTooltip,
borderWidth: 1
},
grid: {
right: '40px',
left: '120px',
height: '85%'
},
xAxis: [
{
type: 'category',
data: [],
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
formatter: this.xAxisLableFormat,
textStyle: {
color: '#333'
}
},
axisPointer: {
snap: true,
label: {
formatter: this.xAxisPointFormat,
backgroundColor: 'rgb(255,0,0,0.5)',
color: 'white'
}
}
}
],
yAxis: [
{
type: 'value',
yAxisIndex: 0,
splitLine: {
show: false
},
axisTick: {
show: false
},
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
interval: 'auto',
formatter: this.yAxisLableFormat
},
axisPointer: {
xAxisIndex: 'all',
label: {
formatter: this.yAxisPointFormat,
backgroundColor: 'rgb(0,100,0,0.5)',
color: 'white'
}
}
}
],
dataZoom: [{
type: 'inside'
},
{
fiterMode: 'filter',
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
handleSize: '80%',
handleStyle: {
color: '#fff',
shadowBlur: 3,
shadowColor: 'rgba(0, 0, 0, 0.6)',
shadowOffsetX: 2,
shadowOffsetY: 2
},
bottom: '20px'
}],
series: [
]
};
const hebXAxis = {
type: 'value',
splitLine: {
show: false
},
axisTick: {
show: false
},
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
interval: 'auto',
formatter: this.yAxisLableFormat
},
axisPointer: {
xAxisIndex: 'all',
label: {
formatter: this.yAxisPointFormat,
backgroundColor: 'rgb(0,100,0,0.5)',
color: 'white'
}
},
min: 0,
max: 0
};
const hebYAxis = [
{
type: 'category',
boundaryGap: false,
data: [],
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
formatter: this.xAxisLableFormat,
textStyle: {
color: '#333'
}
},
axisPointer: {
snap: true,
label: {
formatter: this.xAxisPointFormat,
backgroundColor: 'rgb(255,0,0,0.5)',
color: 'white'
}
}
}
];
const hebDataZoom = [
{
type: 'inside',
yAxisIndex: 0
},
{
fiterMode: 'filter',
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
handleSize: '80%',
yAxisIndex: 0,
handleStyle: {
color: '#fff',
shadowBlur: 3,
shadowColor: 'rgba(0, 0, 0, 0.6)',
shadowOffsetX: 2,
shadowOffsetY: 2
},
left: '20px'
}
];
if (this.$route.query.lineCode === '07') {
option.xAxis = hebXAxis;
option.yAxis = hebYAxis;
option.dataZoom = hebDataZoom;
}
await this.xAxisInit(option);
await this.yAxisInit(option);
await this.loadInitChart(option);
myChart && myChart.hideLoading();
},
pushModels(series, models) {
if (models && models.length) {
models.forEach(elem => {
if (elem) {
series.push(elem);
}
});
}
return series;
},
loadInitChart(option) {
return new Promise((resolve, reject) => {
try {
this.destroy();
let startValue = 3600 + this.PlanParser.getTranslation();
const offsetTime = 3600;
const initTime = toTimeStamp(formatDuring(this.$store.state.training.initTime));
startValue = initTime - this.PlanParser.getTranslation();
option.dataZoom[0].startValue = option.dataZoom[1].startValue = startValue - offsetTime;
option.dataZoom[0].endValue = option.dataZoom[1].endValue = startValue + offsetTime;
option.series = [...this.staticSeries, ...this.runSeries, ...this.selectSeries];
myChart = echarts.init(document.getElementById(this.runPlanId));
if (myChart) {
myChart.setOption(option);
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
myChart.on('click', this.mouseClick);
}
resolve(true);
} catch (error) {
reject(error);
}
});
},
xAxisPointFormat(params) {
return timeFormat(params.value);
},
yAxisPointFormat(params) {
return this.PlanParser.computedFormatAxisY(this.stations, params);
},
xAxisLableFormat(value, index) {
return timeFormat(value);
},
yAxisLableFormat(value, index) {
return '';
},
xAxisInit(option) {
const list = [];
for (var time = 0 + this.PlanParser.getTranslation(); time < 3600 * 24 + this.PlanParser.getTranslation(); time++) {
list.push(time);
}
const startValue = 3600 * 6;
const offsetTime = 3600 * 1;
if (this.$route.query.lineCode === '07') {
option.yAxis[0].data = list;
} else {
option.xAxis[0].data = list;
}
if (!option.dataZoom[0].startValue) {
option.dataZoom[0].startValue = option.dataZoom[1].startValue = startValue - offsetTime;
}
if (!option.dataZoom[0].endValue) {
option.dataZoom[0].endValue = option.dataZoom[1].endValue = startValue + offsetTime;
}
},
yAxisInit(option) {
if (Object.keys(this.PlanParser).length && this.$route.query.lineCode !== '07') {
option.yAxis.min = this.PlanParser.computedAxisYMinValue(this.stations);
option.yAxis.max = this.PlanParser.computedAxisYMaxValue(this.stations);
} else if (Object.keys(this.PlanParser).length && this.$route.query.lineCode === '07') {
option.xAxis.min = this.PlanParser.computedAxisXMinValue(this.stations);
option.xAxis.max = this.PlanParser.computedAxisXMaxValue(this.stations);
}
},
axisTooltip(param) {
const station = (this.$store.getters['map/getDeviceByCode'](param.data[2])) || { name: '', kmRange: '' };
if (this.$route.query.lineCode !== '07') {
if (station.name) {
return [
`Point Data <hr size=1 style=" margin: 3px 0">`,
`车站名称: ${station.name}<br>`,
`车站公里标: ${station.kmRange} km <br>`,
`到站时间: ${timeFormat(param.data[0] + this.PlanParser.getTranslation())} (${param.data[0]})<br>`
].join('');
} else {
return '';
}
} else {
return [
`Point Data <hr size=1 style=" margin: 3px 0">`,
`车站名称: ${station.name}<br>`,
`车站公里标: ${station.kmRange} km <br>`,
`到站时间: ${timeFormat(param.data[1] + this.PlanParser.getTranslation())} (${param.data[1]})<br>`
].join('');
}
},
renderTripNumber(params) {
const tripNumber = params.tripNumber; // 车次号
const serviceNumber = params.serviceNumber; // 服务号
let data, markPoint;
if (tripNumber && this.seriesMap[serviceNumber]) {
const temp = this.seriesMap[serviceNumber].data.filter(elem => elem[3] == tripNumber);
if (temp.length) {
data = temp;
this.seriesMap[serviceNumber].markPoint.data.forEach(each=> {
if (each.name == temp[0][4]) {
markPoint = deepAssign({}, {data:[each]});
markPoint.symbol = 'roundRect';
markPoint.symbolSize = 1;
markPoint.data[0].label.color = '#f00';
}
});
}
} else if (this.seriesMap[serviceNumber]) {
markPoint = deepAssign({}, this.seriesMap[serviceNumber].markPoint);
markPoint.data.forEach((each, index) => {
if (each.symbol == 'circle') {
markPoint.data.splice(index, 1);
} else {
each.label.color = '#f00';
}
});
data = this.seriesMap[serviceNumber].data;
}
this.selectSeries = [{
name: 'trainLabel',
lineStyle: {
color: '#f00',
width: 2,
type: 'solid'
},
z: 10,
type: 'line',
markPoint:markPoint,
animation: false,
data: data
}];
const series = [...this.staticSeries, ...this.runSeries, ...this.selectSeries];
myChart && myChart.setOption({series: series});
},
mouseClick(params) {
const model = {
serviceNumber: params.seriesName
};
this.$store.dispatch('runPlan/setSelected', model);
},
reSize(opt) {
if (myChart) {
myChart.resize({
width: opt.width,
height: opt.height,
silent: false
});
}
},
destroy() {
if (myChart && myChart.isDisposed) {
myChart.dispose();
myChart = null;
}
},
scheduleTouch() {
},
trainNumTouch() {
}
}
};
</script>
<style scoped rel="stylesheet/scss" lang="scss">
@import "src/styles/mixin.scss";
#PlanSchedule {
z-index: 5;
position: absolute;
width: 100%;
.left {
height: 100%;
width: 85%;
float: left;
}
.right {
height: 100%;
width: 15%;
float: right;
}
}
/deep/ {
.el-dialog {
height: 100%;
max-height: 1080px;
}
.el-dialog__body {
padding: 0px !important;
background-color: floralwhite !important;
}
.el-dialog__headerbtn .el-dialog__close {
font-size: 18px;
border: 1px solid #909399;
border-radius: 5px;
}
}
</style>

659
src/views/newMap/displayNew/demon/runPlanViewWindow.vue
View File

@ -1,659 +0,0 @@
<template>
<div v-loading="dialogLoading" style="width: 100%;height: 100%;">
<div style="text-align: center;font-size: 20px;padding-top: 10px;">{{ title }}</div>
<div id="PlanSchedule" :style="{top: top+'px', height: height+'px'}">
<div class="left">
<div :id="runPlanId" />
</div>
<div class="right">
<data-table
ref="serviceTable1"
:height="height/2 - 15"
:config="serviceNumberConfig"
:style="{top: top-height/2+'px'}"
@touch="scheduleTouch"
/>
<data-table
ref="tripTable1"
:height="height/2 -15"
:config="tripNumberConfig"
:style="{top: top-height/2+'px'}"
@touch="trainNumTouch"
/>
<div style="width: 100%;height: 30px;">
<el-button style="float: right;" type="primary" size="mini" @click="quit">退出</el-button>
</div>
</div>
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex';
import { timeFormat } from '@/utils/date';
import DataTable from '@/views/planSchedule/menusPlan/components/dataTable';
import echarts from 'echarts';
import {toTimeStamp, formatDuring} from '@/utils/date';
import { deepAssign } from '@/utils/index';
import { EventBus } from '@/scripts/event-bus';
import { creatSubscribe, clearSubscribe, displayTopic} from '@/utils/stomp';
import { getToken } from '@/utils/auth';
import { getByGroupStationList } from '@/api/jmap/map';
import { loadRunPlanData } from '@/utils/loaddata';
import { getSimulationInfoNew } from '@/api/simulation';
export default {
name: 'PlanSchedule',
components: {
DataTable
},
data() {
return {
top: 0,
height: 0,
inter:null,
runPlanId: 'run-plan-view',
myChart: null,
PlanParser: {},
dialogLoading: false,
serviceNumberConfig: {
data: [],
highlightCurrentRow: true,
handleChange: this.serviceNumberChange,
showClose: false,
columns: [
{
prop: 'serviceNumber',
label: '表号'
},
{
width: 40
}
]
},
tripNumberConfig: {
data: [],
highlightCurrentRow: true,
handleChange: this.tripNumberChange,
showClose: false,
columns: [
{
prop: 'tripNumber',
label: '车次号'
},
{
width: 40
}
]
},
realData: {},
kmRangeMap: {},
absoluteTime: 2 * 3600,
indexKmRangeMap: {},
seriesMap: {},
staticSeries: [],
runSeries: [],
selectSeries: [],
runPlanData: {}
};
},
computed: {
...mapGetters('runPlan', [
'stations'
]),
group() {
return this.$route.query.group;
},
maxWidth() {
return this.$store.state.app.width > 1920 ? 1920 : this.$store.state.app.width;
},
maxHeight() {
return this.$store.state.app.height > 1080 ? 1080 : this.$store.state.app.height;
},
title() {
return this.$t('display.runPlan.previewRunDiagram');
}
},
watch: {
maxWidth() {
this.setPosition();
},
maxHeight() {
this.setPosition();
},
'$store.state.runPlan.planLoadedCount': async function () {
try {
await this.loadChartPage();
this.selectSeries = []; this.runSeries = []; this.runPlanData = {};
await this.loadInitData();
} catch (e) {
console.error(e);
} finally {
this.loading = false;
}
},
'$store.state.socket.simulationReset': function (val) {
this.selectSeries = []; this.runSeries = []; this.runPlanData = {};
this.loadInitData();
},
'$store.state.runPlan.planSizeCount': function () {
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
},
'$store.state.socket.trainStationList': function (val) {
if (val.length) {
this.updateRunPlanData(val);
}
}
},
mounted() {
this.dialogLoading = true;
getSimulationInfoNew(this.group).then(res => {
this.$store.dispatch('runPlan/setRunPlanInfo', res.data.runPlan);
getByGroupStationList(this.group).then(response => {
this.$store.dispatch('runPlan/setStations', response.data).then(() => {
loadRunPlanData(this.group, this.dataError);
this.staticSeries = []; this.selectSeries = []; this.runSeries = []; this.runPlanData = {};
this.PlanParser = this.$theme.loadPlanParser(this.$route.query.lineCode);
this.loadChartPage();
EventBus.$on('clearRunSeries', () => {
this.runSeries = [];
});
this.doShow();
});
}).catch(() => {
this.$messageBox(this.$t('display.schema.getStationListFail'));
});
});
},
beforeDestroy() {
this.$store.dispatch('runPlan/setSelected', null);
this.destroy();
this.clearSubscribe();
},
methods: {
async doShow() {
try {
await this.setPosition();
await this.loadInitData();
this.inter && clearInterval(this.inter);
await this.subscribe();
} catch (e) {
console.error(e);
} finally {
this.dialogLoading = false;
}
},
async doClose() {
this.inter && clearInterval(this.inter);
},
serviceNumberChange(row) {
if (row) {
this.$store.dispatch('runPlan/setSelected', { serviceNumber: row.serviceNumber, tripNumber: null });
this.renderTripNumber({ serviceNumber: row.serviceNumber, tripNumber: null });
const serviceObj = this.$store.state.runPlan.editData[row.serviceNumber];
if (serviceObj) {
this.analyticalTripNumber(serviceObj.trainMap);
}
}
},
tripNumberChange(row) {
if (row) {
this.$store.dispatch('runPlan/setSelected', { serviceNumber: this.$store.state.runPlan.selected.serviceNumber, tripNumber: row.tripNumber });
this.renderTripNumber({ serviceNumber: this.$store.state.runPlan.selected.serviceNumber, tripNumber: row.tripNumber });
}
},
async analyticalServiceNumber(data) {
this.serviceNumberConfig.data = Object.keys(data || {})
.sort((a, b) => { return parseInt(data[a].serviceNumber) - parseInt(data[b].serviceNumber); })
.map(serviceNumber => { return { serviceNumber }; });
},
async analyticalTripNumber(data) {
this.tripNumberConfig.data = Object.keys(data || {})
.sort((a, b) => { return data[a].tripNumber - data[b].tripNumber; })
.map(tripNumber => { return { tripNumber }; });
},
async setPosition() {
this.$nextTick(() => {
const top = 54;
const width = this.maxWidth * 0.85;
let height = this.maxHeight;
height = height - top;
this.$store.dispatch('runPlan/resize', { width, height });
if (this.top != top) {
this.top = top;
}
if (this.height != height) {
this.height = height - top;
}
});
},
updateRunPlanData(data) {
const stations = this.$store.state.runPlan.stations;
data.forEach(item => {
item.secondTime = item.second;
});
this.kmRangeMap = this.PlanParser.convertStationsToMap(stations);
this.runSeries = this.PlanParser.updateDataToModels(data, stations, this.kmRangeMap,
this.runPlanData, this.runSeries, { color: '#FF00DE', width: 2 }
);
const series = [...this.staticSeries, ...this.runSeries, ... this.selectSeries];
this.myChart && this.myChart.setOption({series: series});
},
async loadChartPage() {
try {
this.seriesMap = {};
this.staticSeries = [];
const stations = this.$store.state.runPlan.stations;
const planData = this.$store.state.runPlan.planData;
this.kmRangeMap = this.PlanParser.convertStationsToMap(stations);
if (this.$route.query.lineCode === '07') {
this.pushModels(this.staticSeries, [this.PlanParser.initializeAxisX(stations)]);
} else {
this.pushModels(this.staticSeries, [this.PlanParser.initializeAxisY(stations)]);
}
this.staticSeries = this.pushModels(this.staticSeries, this.PlanParser.convertDataToModels(planData, stations, this.kmRangeMap, { color: '#000', width: 0.5 }));
this.staticSeries.forEach(item => {
this.seriesMap[item.name] = item;
});
await this.analyticalServiceNumber(this.$store.state.runPlan.editData);
} catch (error) {
this.$messageBox(`加载运行图数据失败`);
}
},
async loadInitData() {
this.myChart && this.myChart.showLoading();
const option = {
tooltip: {
axisPointer: {
trigger: 'item',
type: 'cross'
},
formatter: this.axisTooltip,
borderWidth: 1
},
grid: {
right: '40px',
left: '120px',
height: '85%'
},
xAxis: [
{
type: 'category',
data: [],
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
formatter: this.xAxisLableFormat,
textStyle: {
color: '#333'
}
},
axisPointer: {
snap: true,
label: {
formatter: this.xAxisPointFormat,
backgroundColor: 'rgb(255,0,0,0.5)',
color: 'white'
}
}
}
],
yAxis: [
{
type: 'value',
yAxisIndex: 0,
splitLine: {
show: false
},
axisTick: {
show: false
},
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
interval: 'auto',
formatter: this.yAxisLableFormat
},
axisPointer: {
xAxisIndex: 'all',
label: {
formatter: this.yAxisPointFormat,
backgroundColor: 'rgb(0,100,0,0.5)',
color: 'white'
}
}
}
],
dataZoom: [{
type: 'inside'
},
{
fiterMode: 'filter',
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
handleSize: '80%',
handleStyle: {
color: '#fff',
shadowBlur: 3,
shadowColor: 'rgba(0, 0, 0, 0.6)',
shadowOffsetX: 2,
shadowOffsetY: 2
},
bottom: '20px'
}],
series: [
]
};
const hebXAxis = {
type: 'value',
splitLine: {
show: false
},
axisTick: {
show: false
},
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
interval: 'auto',
formatter: this.yAxisLableFormat
},
axisPointer: {
xAxisIndex: 'all',
label: {
formatter: this.yAxisPointFormat,
backgroundColor: 'rgb(0,100,0,0.5)',
color: 'white'
}
},
min: 0,
max: 0
};
const hebYAxis = [
{
type: 'category',
boundaryGap: false,
data: [],
axisLine: {
onZero: false,
lineStyle: {
width: 2,
color: '#d14a61'
}
},
axisLabel: {
formatter: this.xAxisLableFormat,
textStyle: {
color: '#333'
}
},
axisPointer: {
snap: true,
label: {
formatter: this.xAxisPointFormat,
backgroundColor: 'rgb(255,0,0,0.5)',
color: 'white'
}
}
}
];
const hebDataZoom = [
{
type: 'inside',
yAxisIndex: 0
},
{
fiterMode: 'filter',
handleIcon: 'M10.7,11.9v-1.3H9.3v1.3c-4.9,0.3-8.8,4.4-8.8,9.4c0,5,3.9,9.1,8.8,9.4v1.3h1.3v-1.3c4.9-0.3,8.8-4.4,8.8-9.4C19.5,16.3,15.6,12.2,10.7,11.9z M13.3,24.4H6.7V23h6.6V24.4z M13.3,19.6H6.7v-1.4h6.6V19.6z',
handleSize: '80%',
yAxisIndex: 0,
handleStyle: {
color: '#fff',
shadowBlur: 3,
shadowColor: 'rgba(0, 0, 0, 0.6)',
shadowOffsetX: 2,
shadowOffsetY: 2
},
left: '20px'
}
];
if (this.$route.query.lineCode === '07') {
option.xAxis = hebXAxis;
option.yAxis = hebYAxis;
option.dataZoom = hebDataZoom;
}
await this.xAxisInit(option);
await this.yAxisInit(option);
await this.loadInitChart(option);
this.myChart && this.myChart.hideLoading();
},
pushModels(series, models) {
if (models && models.length) {
models.forEach(elem => {
if (elem) {
series.push(elem);
}
});
}
return series;
},
loadInitChart(option) {
return new Promise((resolve, reject) => {
try {
this.destroy();
let startValue = 3600 + this.PlanParser.getTranslation();
const offsetTime = 3600;
const initTime = toTimeStamp(formatDuring(parseInt(this.$route.query.initTime)));
startValue = initTime - this.PlanParser.getTranslation();
option.dataZoom[0].startValue = option.dataZoom[1].startValue = startValue - offsetTime;
option.dataZoom[0].endValue = option.dataZoom[1].endValue = startValue + offsetTime;
option.series = [...this.staticSeries, ...this.runSeries, ...this.selectSeries];
this.myChart = echarts.init(document.getElementById(this.runPlanId));
if (this.myChart) {
this.myChart.setOption(option);
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
this.myChart.on('click', this.mouseClick);
}
resolve(true);
} catch (error) {
reject(error);
}
});
},
xAxisPointFormat(params) {
return timeFormat(params.value);
},
yAxisPointFormat(params) {
return this.PlanParser.computedFormatAxisY(this.stations, params);
},
xAxisLableFormat(value, index) {
return timeFormat(value);
},
yAxisLableFormat(value, index) {
return '';
},
xAxisInit(option) {
const list = [];
for (var time = 0 + this.PlanParser.getTranslation(); time < 3600 * 24 + this.PlanParser.getTranslation(); time++) {
list.push(time);
}
const startValue = 3600 * 6;
const offsetTime = 3600 * 1;
if (this.$route.query.lineCode === '07') {
option.yAxis[0].data = list;
} else {
option.xAxis[0].data = list;
}
if (!option.dataZoom[0].startValue) {
option.dataZoom[0].startValue = option.dataZoom[1].startValue = startValue - offsetTime;
}
if (!option.dataZoom[0].endValue) {
option.dataZoom[0].endValue = option.dataZoom[1].endValue = startValue + offsetTime;
}
},
yAxisInit(option) {
if (Object.keys(this.PlanParser).length && this.$route.query.lineCode !== '07') {
option.yAxis.min = this.PlanParser.computedAxisYMinValue(this.stations);
option.yAxis.max = this.PlanParser.computedAxisYMaxValue(this.stations);
} else if (Object.keys(this.PlanParser).length && this.$route.query.lineCode === '07') {
option.xAxis.min = this.PlanParser.computedAxisXMinValue(this.stations);
option.xAxis.max = this.PlanParser.computedAxisXMaxValue(this.stations);
}
},
axisTooltip(param) {
const station = (this.$store.getters['map/getDeviceByCode'](param.data[2])) || { name: '', kmRange: '' };
if (this.$route.query.lineCode !== '07') {
return [
`Point Data <hr size=1 style=" margin: 3px 0">`,
`车站名称: ${station.name}<br>`,
`车站公里标: ${station.kmRange} km <br>`,
`到站时间: ${timeFormat(param.data[0] + this.PlanParser.getTranslation())} (${param.data[0]})<br>`
].join('');
} else {
return [
`Point Data <hr size=1 style=" margin: 3px 0">`,
`车站名称: ${station.name}<br>`,
`车站公里标: ${station.kmRange} km <br>`,
`到站时间: ${timeFormat(param.data[1] + this.PlanParser.getTranslation())} (${param.data[1]})<br>`
].join('');
}
},
renderTripNumber(params) {
const tripNumber = params.tripNumber; // 车次号
const serviceNumber = params.serviceNumber; // 服务号
let data, markPoint;
if (tripNumber && this.seriesMap[serviceNumber]) {
const temp = this.seriesMap[serviceNumber].data.filter(elem => elem[3] == tripNumber);
if (temp.length) {
data = temp;
this.seriesMap[serviceNumber].markPoint.data.forEach(each=> {
if (each.name == temp[0][4]) {
markPoint = deepAssign({}, {data:[each]});
markPoint.symbol = 'roundRect';
markPoint.symbolSize = 1;
markPoint.data[0].label.color = '#f00';
}
});
}
} else if (this.seriesMap[serviceNumber]) {
markPoint = deepAssign({}, this.seriesMap[serviceNumber].markPoint);
markPoint.data.forEach(each => {
each.label.color = '#f00';
});
data = this.seriesMap[serviceNumber].data;
}
this.selectSeries = [{
name: 'trainLabel',
lineStyle: {
color: '#f00',
width: 2,
type: 'solid'
},
z: 10,
type: 'line',
markPoint:markPoint,
animation: false,
data: data
}];
const series = [...this.staticSeries, ...this.runSeries, ...this.selectSeries];
this.myChart && this.myChart.setOption({series: series});
},
mouseClick(params) {
const model = {
serviceNumber: params.seriesName
};
this.$store.dispatch('runPlan/setSelected', model);
},
reSize(opt) {
if (this.myChart) {
this.myChart.resize({
width: opt.width,
height: opt.height,
silent: false
});
}
},
destroy() {
if (this.myChart && this.myChart.isDisposed) {
this.myChart.dispose();
this.myChart = null;
}
},
async subscribe() {
this.clearSubscribe();
const header = { group: this.group || '', 'X-Token': getToken() };
creatSubscribe(`${displayTopic}\/${this.group}`, header);
},
clearSubscribe() {
clearSubscribe(`${displayTopic}\/${this.group}`);
},
quit() {
window.close();
},
scheduleTouch() {
},
trainNumTouch() {
}
}
};
</script>
<style scoped rel="stylesheet/scss" lang="scss">
@import "src/styles/mixin.scss";
#PlanSchedule {
z-index: 5;
position: absolute;
width: 100%;
.left {
height: 100%;
width: 85%;
float: left;
}
.right {
height: 100%;
width: 15%;
float: right;
}
}
/deep/ {
.el-dialog {
height: 100%;
max-height: 1080px;
}
.el-dialog__body {
padding: 0px !important;
background-color: floralwhite !important;
}
.el-dialog__headerbtn .el-dialog__close {
font-size: 18px;
border: 1px solid #909399;
border-radius: 5px;
}
}
</style>

356
src/views/newMap/displayNew/demon/scheduling.vue
View File

@ -1,356 +0,0 @@
<template>
<div>
<el-dialog
v-dialogDrag
:title="title"
:visible.sync="show"
top="50px"
width="95%"
:before-do-close="doClose"
:close-on-click-modal="false"
:z-index="2000"
>
<div class="scheduling">
<el-card class="scheduling_header">
<el-form>
<el-row>
<el-col :span="6">
<el-form-item :label="$t('display.schedule.scheduleSelect')">
<el-date-picker
v-model="formModel.planDate"
clearable
size="small"
type="date"
value-format="yyyy-MM-dd"
:picker-options="pickerOptions"
@change="handleQuery"
/>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item :label="$t('display.schedule.runDiagramName')">
<!--<el-select v-model="formModel.runPlanName" size="small" style="display: inline-block">-->
<!--<el-option-->
<!--v-for="item in runPlanList"-->
<!--:key="item.value"-->
<!--:label="item.label"-->
<!--:value="item.value"-->
<!--/>-->
<!--</el-select>-->
<el-input v-model="formModel.runPlanName" size="small" style="width:140px;" />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item style="text-align: right">
<el-button-group>
<el-button size="small" type="primary" @click="handleSave">{{ $t('display.schedule.save') }}</el-button>
</el-button-group>
</el-form-item>
</el-col>
</el-row>
</el-form>
</el-card>
<div class="scheduling_body">
<div class="scheduling_body-table">
<edit-table ref="table" v-loading="loading" border stripe :table-data="tableData" :table-form="tableForm" :row-style="handleRowStyle" />
</div>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
import { querySechedulingNew, generateSchedulingNew, saveSchedulingNew } from '@/api/scheduling';
import { hexColor } from '@/jmapNew/theme/parser/util';
import EditTable from '@/views/components/editTable/index';
// 排班计划弹窗列表
export default {
name: 'Scheduling',
components: {
EditTable
},
props: {
group: {
type: String,
required: true
}
},
data() {
return {
show: false,
loading: false,
runPlanList: [],
groupNumberList: [],
pickerOptions: {
disabledDate(time) {
return time.getTime() < Date.now() - 24 * 3600 * 1000;
}
},
formModel: {
id: '',
mode: '',
planDate: '',
runPlanName: ''
},
tableForm: {
index: true,
columns: [
// {
// title: this.$t('display.schedule.driverNumber'),
// prop: 'driverCode',
// type: 'text'
// },
{
title: this.$t('display.schedule.trainNumber'),
prop: 'groupNumber',
type: 'select',
width: '150',
options: () => { return this.groupNumberList; },
editable: true,
editing: true
},
{
title: this.$t('display.schedule.onlineSection'),
prop: 'outDepotTrip.outDepotSectionCode',
type: 'text',
format: (row) => { return this.handleDeviceName(row.outDepotTrip.outDepotSectionCode); }
},
{
title: this.$t('display.schedule.onlineServerNumber'),
prop: 'outDepotTrip.serviceNumber',
type: 'text',
format: (row) => { return row.outDepotTrip.serviceNumber; }
},
{
title: this.$t('display.schedule.onlineTargetNumber'),
prop: 'outDepotTrip.destinationCode',
type: 'text',
format: (row) => { return row.outDepotTrip.destinationCode; }
},
{
title: this.$t('display.schedule.onlineTime'),
prop: 'outDepotTrip.outDepotTime',
type: 'text',
format: (row) => { return row.outDepotTrip.outDepotTime; }
},
{
title: this.$t('display.schedule.onlineTripNumber'),
prop: 'outDepotTrip.tripNumber',
type: 'text',
format: (row) => { return row.outDepotTrip.tripNumber; }
},
{
title: this.$t('display.schedule.outDepot'),
prop: 'outDepotTrip.outDepotCode',
type: 'text',
format: (row) => { return this.handleDeviceName(row.outDepotTrip.outDepotCode); }
},
{
title: this.$t('display.schedule.outDepotStatus'),
prop: 'outDepotTrip.status',
type: 'tag',
columnValue: (row) => { return this.$ConstSelect.translate(row.outDepotTrip.status, 'Whether'); },
tagType: (row) => {
switch (row.outDepotTrip.status) {
case true: return 'success';
case false: return 'danger';
}
}
},
{
title: this.$t('display.schedule.offlineSection'),
prop: 'offlineSection',
type: 'text',
format: (row) => { return this.handleDeviceName(row.inDepotTrip.inDepotSectionCode); }
},
{
title: this.$t('display.schedule.offlineServerNumber'),
prop: 'offlineServerNumber',
type: 'text',
format: (row) => { return row.inDepotTrip.serviceNumber; }
},
{
title: this.$t('display.schedule.offlineTargetNumber'),
prop: 'offlineTargetNumber',
type: 'text',
format: (row) => { return row.inDepotTrip.destinationCode; }
},
{
title: this.$t('display.schedule.offlineTime'),
prop: 'offlineTime',
type: 'text',
format: (row) => { return row.inDepotTrip.inDepotTime; }
},
{
title: this.$t('display.schedule.offlineTripNumber'),
prop: 'offlineTripNumber',
type: 'text',
format: (row) => { return row.inDepotTrip.tripNumber; }
},
{
title: this.$t('display.schedule.inDepot'),
prop: 'inDepot',
type: 'text',
format: (row) => { return this.handleDeviceName(row.inDepotTrip.inDepotCode); }
},
{
title: this.$t('display.schedule.inDepotStatus'),
prop: 'inStatus',
type: 'tag',
columnValue: (row) => { return this.$ConstSelect.translate(row.inDepotTrip.status, 'Whether'); },
tagType: (row) => {
switch (row.inDepotTrip.status) {
case true: return 'success';
case false: return 'danger';
}
}
}
]
},
tableData: []
};
},
computed: {
title() {
return this.$t('display.schedule.schedulePlan');
}
},
watch: {
'$store.state.map.mapDataLoadedCount': function () {
const trainList = this.$store.state.map.map.trainList || [];
this.groupNumberList = [];
trainList.forEach(item => {
this.groupNumberList.push({value: item.code, label: item.groupNumber});
});
}
},
methods: {
doShow() {
this.formModel.day = '';
this.show = true;
},
doClose() {
this.show = false;
},
handleQuery(day) {
if (day) {
this.loading = true;
querySechedulingNew(this.group, {day}).then(resp => {
if (!resp.data) {
this.$confirm(this.$t('display.schedule.noSchedulePlan'), this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
cancelButtonText: this.$t('global.cancel'),
type: 'warning'
}).then(() => {
this.handleGenerate(day);
}).catch(() => {
this.clearData();
this.loading = false;
});
} else {
this.tableData = this.initTableData(resp.data.planList || []);
this.formModel.id = resp.data.id;
this.formModel.planDate = resp.data.planDate;
this.formModel.runPlanName = resp.data.runPlanName;
this.$message.success(`${this.$t('display.schedule.loadData')} ${day} ${this.$t('display.schedule.schedulePlanSuccess')}`);
this.loading = false;
}
}).catch(error => {
this.clearData();
this.$messageBox(`${error.message}`);
this.loading = false;
});
}
},
handleGenerate(day) {
generateSchedulingNew(this.group, {day}).then(resp => {
this.loading = false;
this.tableData = this.initTableData(resp.data.planList || []);
this.formModel.id = resp.data.id;
// this.formModel.planDate = resp.data.planDate;
this.formModel.runPlanName = resp.data.runPlanName;
this.$message.success(this.$t('display.schedule.createSchedulePlanSuccess'));
}).catch(error => {
this.loading = false;
this.clearData();
this.$messageBox(`${error.message}`);
});
},
handleSave() {
if (this.formModel.planDate) {
saveSchedulingNew(this.group, this.tableData).then(resp => {
if (resp.data && !resp.data.pass) {
this.setConflictList(resp.data.conflictList);
this.$message.warning(this.$t('display.schedule.checkFailed'));
} else {
this.setConflictList([]);
this.$message.success(this.$t('display.schedule.saveSchedulePlanSuccess'));
}
}).catch(() => {
this.$messageBox(this.$t('display.schedule.saveSchedulePlanFail'));
});
} else {
this.$messageBox(this.$t('display.schedule.selectSchedulePlan'));
}
},
handleRowStyle({row, rowIndex}) {
return row['$conflict'] ? {background: row.$conflict} : {background: '#FFF'};
},
setConflictList(list) {
this.tableData.forEach(elem => { elem['$conflict'] = null; });
if (list && list.length) {
list.forEach(idList => {
const color = hexColor.colorRandom();
this.tableData.forEach(elem => {
if (idList.includes(parseInt(elem.id))) {
elem['$conflict'] = color;
}
});
});
}
this.tableData = [...this.tableData];
},
initTableData(tableData) {
tableData.forEach(elem => {
this.$set(elem, '$conflict', null);
});
return tableData;
},
clearData() {
this.formModel.planDate = '';
this.tableData = [];
},
handleDeviceName(code) {
const device = this.$store.getters['map/getDeviceByCode'](code) || {};
return device.name;
}
}
};
</script>
<style scoped rel="stylesheet/scss" lang="scss">
.scheduling {
&_header {
background: #fff;
padding: 30px 30px 0;
}
&_body {
margin-top: 30px;
background: #ffff;
border: 1px solid #F1F1F1;
width: 100%;
overflow: auto;
}
}
/deep/ .el-dialog__body {
background: #fafafa;
}
/deep/ label {
font-weight: 0;
}
</style>

254
src/views/newMap/displayNew/demon/schedulingView.vue
View File

@ -1,254 +0,0 @@
<template>
<div>
<el-dialog
v-dialogDrag
:title="title"
:visible.sync="show"
top="50px"
width="95%"
:before-do-close="doClose"
:close-on-click-modal="false"
:z-index="2000"
>
<div class="scheduling">
<div class="scheduling_body">
<div class="scheduling_body-table">
<edit-table ref="table" v-loading="loading" border stripe :table-data="tableData" :table-form="tableForm" :row-style="handleRowStyle" />
</div>
</div>
</div>
</el-dialog>
</div>
</template>
<script>
import { queryCurrentSecheduling } from '@/api/scheduling';
import { hexColor } from '@/jmapNew/theme/parser/util';
import EditTable from '@/views/components/editTable/index';
// 排班计划弹窗列表
export default {
name: 'AddQuest',
components: {
EditTable
},
props: {
group: {
type: String,
required: true
}
},
data() {
return {
show: false,
loading: false,
runPlanList: [],
groupNumberList: [],
tableForm: {
index: true,
columns: [
// {
// title: this.$t('display.schedule.driverNumber'),
// prop: 'driverCode',
// type: 'text'
// },
{
title: this.$t('display.schedule.trainNumber'),
prop: 'groupNumber',
type: 'select',
width: '150',
options: () => { return this.groupNumberList; },
editable: false,
editing: false
},
{
title: this.$t('display.schedule.onlineSection'),
prop: 'outDepotTrip.outDepotSectionCode',
type: 'text',
format: (row) => { return this.handleDeviceName(row.outDepotTrip.outDepotSectionCode); }
},
{
title: this.$t('display.schedule.onlineServerNumber'),
prop: 'outDepotTrip.serviceNumber',
type: 'text',
format: (row) => { return row.outDepotTrip.serviceNumber; }
},
{
title: this.$t('display.schedule.onlineTargetNumber'),
prop: 'outDepotTrip.destinationCode',
type: 'text',
format: (row) => { return row.outDepotTrip.destinationCode; }
},
{
title: this.$t('display.schedule.onlineTime'),
prop: 'outDepotTrip.outDepotTime',
type: 'text',
format: (row) => { return row.outDepotTrip.outDepotTime; }
},
{
title: this.$t('display.schedule.onlineTripNumber'),
prop: 'outDepotTrip.tripNumber',
type: 'text',
format: (row) => { return row.outDepotTrip.tripNumber; }
},
{
title: this.$t('display.schedule.outDepot'),
prop: 'outDepotTrip.outDepotCode',
type: 'text',
format: (row) => { return this.handleDeviceName(row.outDepotTrip.outDepotCode); }
},
{
title: this.$t('display.schedule.outDepotStatus'),
prop: 'outDepotTrip.status',
type: 'tag',
columnValue: (row) => { return this.$ConstSelect.translate(row.outDepotTrip.status, 'Whether'); },
tagType: (row) => {
switch (row.outDepotTrip.status) {
case true: return 'success';
case false: return 'danger';
}
}
},
{
title: this.$t('display.schedule.offlineSection'),
prop: 'offlineSection',
type: 'text',
format: (row) => { return this.handleDeviceName(row.inDepotTrip.inDepotSectionCode); }
},
{
title: this.$t('display.schedule.offlineServerNumber'),
prop: 'offlineServerNumber',
type: 'text',
format: (row) => { return row.inDepotTrip.serviceNumber; }
},
{
title: this.$t('display.schedule.offlineTargetNumber'),
prop: 'offlineTargetNumber',
type: 'text',
format: (row) => { return row.inDepotTrip.destinationCode; }
},
{
title: this.$t('display.schedule.offlineTime'),
prop: 'offlineTime',
type: 'text',
format: (row) => { return row.inDepotTrip.inDepotTime; }
},
{
title: this.$t('display.schedule.offlineTripNumber'),
prop: 'offlineTripNumber',
type: 'text',
format: (row) => { return row.inDepotTrip.tripNumber; }
},
{
title: this.$t('display.schedule.inDepot'),
prop: 'inDepot',
type: 'text',
format: (row) => { return this.handleDeviceName(row.inDepotTrip.inDepotCode); }
},
{
title: this.$t('display.schedule.inDepotStatus'),
prop: 'inStatus',
type: 'tag',
columnValue: (row) => { return this.$ConstSelect.translate(row.inDepotTrip.status, 'Whether'); },
tagType: (row) => {
switch (row.inDepotTrip.status) {
case true: return 'success';
case false: return 'danger';
}
}
}
]
},
tableData: []
};
},
computed: {
title() {
return '派班计划预览';
}
},
watch: {
'$store.state.map.mapDataLoadedCount': function () {
const trainList = this.$store.state.map.map.trainList || [];
this.groupNumberList = [];
trainList.forEach(item => {
this.groupNumberList.push({value: item.code, label: item.groupNumber});
});
}
},
methods: {
doShow() {
this.initData();
this.show = true;
},
doClose() {
this.show = false;
},
initData() {
this.loading = true;
queryCurrentSecheduling(this.group).then(resp => {
this.tableData = [];
if (resp.data) {
this.tableData = this.initTableData(resp.data.planList || []);
// this.$message.success(`${this.$t('display.schedule.loadData')}${this.$t('display.schedule.schedulePlanSuccess')}`);
}
this.loading = false;
}).catch(error => {
this.$messageBox(`${error.message}`);
this.loading = false;
});
},
handleRowStyle({row, rowIndex}) {
return row['$conflict'] ? {background: row.$conflict} : {background: '#FFF'};
},
setConflictList(list) {
this.tableData.forEach(elem => { elem['$conflict'] = null; });
if (list && list.length) {
list.forEach(idList => {
const color = hexColor.colorRandom();
this.tableData.forEach(elem => {
if (idList.includes(parseInt(elem.id))) {
elem['$conflict'] = color;
}
});
});
}
this.tableData = [...this.tableData];
},
initTableData(tableData) {
tableData.forEach(elem => {
this.$set(elem, '$conflict', null);
});
return tableData;
},
handleDeviceName(code) {
const device = this.$store.getters['map/getDeviceByCode'](code) || {};
return device.name;
}
}
};
</script>
<style scoped rel="stylesheet/scss" lang="scss">
.scheduling {
&_header {
background: #fff;
padding: 30px 30px 0;
}
&_body {
margin-top: 30px;
background: #ffff;
border: 1px solid #F1F1F1;
width: 100%;
overflow: auto;
}
}
/deep/ .el-dialog__body {
background: #fafafa;
}
/deep/ label {
font-weight: 0;
}
</style>

130
src/views/newMap/displayNew/demon/selectIbp.vue
View File

@ -1,130 +0,0 @@
<template>
<div>
<el-dialog
v-dialogDrag
:title="$t('display.script.scriptList')"
:visible.sync="show"
top="50px"
width="60%"
:before-do-close="doClose"
:close-on-click-modal="false"
:z-index="2000"
>
<QueryListPage
ref="queryListPage"
:pager-config="pagerConfig"
:query-form="queryForm"
:query-list="queryList"
/>
</el-dialog>
</div>
</template>
<script>
import {getScriptPageListOnlineNew } from '@/api/script';
// 剧本弹窗
export default {
name: 'AddQuest',
props: {
trainings: {
type: Array,
default() {
return [];
}
},
detail: {
type: Object,
default() {
return null;
}
}
},
data() {
return {
show: false,
pagerConfig: {
pageSize: 'pageSize',
pageIndex: 'pageNum'
},
queryForm: {
labelWidth: '80px',
reset: false,
show: false,
queryObject: {
}
},
queryList: {
query: this.listQuest,
selectCheckShow: false,
indexShow: true,
columns: [
{
title: '关联站台',
prop: 'name'
},
// {
// title: '创建时间',
// prop: 'createTime'
// },
{
type: 'button',
title: '操作',
width: '250',
buttons: [
{
name: '预览',
type: 'primary',
handleClick: this.handleLoad
}
]
}
],
actions: [
]
},
currentModel: {}
};
},
created() {
this.loadInitData();
},
methods: {
doShow() {
this.show = true;
this.reloadTable();
},
doClose() {
this.show = false;
},
listQuest(params) {
params['mapId'] = this.$route.query.mapId;
return getScriptPageListOnlineNew(params);
},
async loadInitData() {
},
async handleLoad(index, row) {
this.row = row;
// const routeData = this.$router.resolve({
// path:`/ibpShow`,
// query:{
// lineCode: this.$route.query.lineCode,
// mapId: this.$route.query.mapId,
// group: this.$route.query.group
// }
// });
// window.open(routeData.href, '_blank');
},
reloadTable() {
if (this.queryList && this.queryList.reload) {
this.queryList.reload();
}
}
}
};
</script>

115
src/views/newMap/displayNew/demon/setTime.vue
View File

@ -1,115 +0,0 @@
<template>
<el-dialog v-dialogDrag :title="title" :visible.sync="show" width="550px" :before-close="doClose">
<el-form ref="form" label-width="120px" :model="formModel" :rules="rules">
<el-form-item :label="$t('display.setTime.systemTime')" prop="initTime">
<el-time-picker
v-model="formModel.initTime"
:picker-options="pickerOptions"
:placeholder="$t('display.setTime.anyTime')"
@change="handleChange"
/>
</el-form-item>
<el-form-item v-if="hasNumber" :label="$t('display.setTime.loadTrainNum')" prop="loadNum">
<el-input-number v-model="formModel.loadNum" :min="1" :max="maxNumber" :label="$t('display.setTime.selectLoadTrainNum')" />
<span> {{ ` (${$t('display.setTime.maxTrainNum')} ：${maxNumber}) ` }} </span>
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button @click="show = false">{{ $t('global.cancel') }}</el-button>
<el-button type="primary" :loading="status" @click="handleSure">{{ $t('global.confirm') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { timestampFormat } from '@/utils/date';
import { getLoadTrainNumber } from '@/api/simulation';
// 计划行车时间选择
export default {
data() {
return {
show: false,
formModel: {
initTime: new Date(),
loadNum: 1
},
maxNumber: 1,
pickerOptions: { selectableRange: '00:00:00 - 23:59:59' },
status: false
};
},
computed: {
title() {
return this.$t('display.setTime.setSimulationSystemTime');
},
hasNumber() {
return this.$route.params.mode == 'demon' && this.$route.query.prdType == '04';
},
group() {
return this.$route.query.group;
},
rules() {
return {
initTime: [
{ required: true, message: this.$t('display.setTime.selectSystemTime'), trigger: 'change' },
{
validator(rule, value, callback) {
if (this.maxNumber == 0) {
callback(new Error(this.$t('display.setTime.selectValidStartTime')));
} else {
callback();
}
},
trigger: 'change',
maxNumber: this.maxNumber
}
],
loadNum: [
{ required: true, message: this.$t('display.setTime.selectTrainNum'), trigger: 'change' }
]
};
}
},
methods: {
doShow() {
console.log(this.$store.state.training.initTime)
this.formModel.initTime = new Date(this.$store.state.training.initTime || null);
this.handleChange(this.formModel.initTime);
this.show = true;
},
doClose() {
this.status = false;
this.show = false;
},
handleChange(initTime) {
this.formModel.loadNum = 0;
if (this.hasNumber) {
getLoadTrainNumber({ time: timestampFormat('HH:mm:ss', initTime) }, this.group).then(resp => {
this.maxNumber = parseInt(resp.data);
});
}
},
handleSure() {
this.$refs.form.validate((valid) => {
debugger
if (valid) {
this.status = true;
const model = {
initTime: timestampFormat('HH:mm:ss', this.formModel.initTime),
timestamp:this.formModel.initTime
};
if (this.hasNumber) {
model['loadNum'] = this.formModel.loadNum;
}
this.$emit('ConfirmSelectBeginTime', model);
this.doClose();
}
});
}
}
};
</script>

68
src/views/newMap/displayNew/demonChat.vue
View File

@ -1,68 +0,0 @@
<template>
<div>
<voice-chat-box
v-if="$route.query.lineCode == '16'"
ref="chatbox"
:group="group"
:user-role="userRole"
/>
<chat-box
v-else
ref="chatbox"
:group="group"
:user-role="userRole"
/>
<script-tip ref="scriptTip" :offset="offset" @allowCreatCoversition="allowCreatCoversition" />
</div>
</template>
<script>
import ChatBox from '../chatView/chatBox.vue';
import voiceChatBox from '../chatView/voiceChatBox.vue';
import ScriptTip from '@/views/newMap/displayNew/scriptDisplay/component/scriptTip';
export default {
name:'DemonChat',
components:{
ChatBox,
voiceChatBox,
ScriptTip
},
props: {
group: {
type: String,
required: true
},
userRole: {
type: String,
required: true
},
offset: {
type: Number,
required: true
}
},
watch:{
},
mounted() {
},
methods:{
clearAllData() {
// this.resetCoversition();
this.$refs.chatbox.resetCoversition();
this.$refs.scriptTip.resetScriptTip();
},
resetCoversition() {
this.$refs.chatbox.resetCoversition();
},
allowCreatCoversition() {
},
resetScriptTip() {
this.$refs.scriptTip.resetScriptTip();
},
cancelCommonConversation() {
this.$refs.chatbox.cancelCommonConversation();
}
}
};
</script>

335
src/views/newMap/displayNew/demonMenu.vue
View File

@ -1,335 +0,0 @@
<template>
<div>
<div v-if="isAllShow&&project != 'bjd'&& !isCtc" class="display_top_draft" :style="allStyle">
<div class="btn_hover" @click="menuClick">菜单</div>
<el-button-group ref="button_group_box" class="button_group_box" :style="`margin-left:-${btnWidth}px`">
<!-- 地图错误判断 -->
<!-- 设备视图 -->
<el-button v-if="jl3dmodelShow && !isContest && project !== 'bjd' && $route.query.lineCode !== '16' && project !== 'teaching'" size="small" @click="jumpjlmap3dmodel">{{ jl3dmodel }}</el-button>
<!-- 三维视图/数字沙盘 -->
<el-button v-if="jl3dnameShow && !isContest && project !== 'bjd' && $route.query.lineCode !== '16' && project !== 'teaching'" size="small" @click="jumpjlmap3d">{{ jl3dname }}</el-button>
<!-- cctv视图 -->
<el-button v-if="jl3dnameShow && !isContest && project !== 'bjd' && $route.query.lineCode !== '16' && project !== 'teaching'" size="small" @click="jumpjl3dpassflow">{{ jl3dpassflow }}</el-button>
<!-- 客流规划视图 -->
<!-- <el-button v-if="trafficplanShow && project == 'bjd' && !isContest" size="small" @click="jumpjl3dtrafficplan">{{ jl3dtrafficplan }}</el-button>
<el-button v-if="trafficplanShow && project == 'bjd' && !isContest" size="small" @click="jumpjl3dtraffictrain">{{ $t('display.demon.traffictraintext') }}</el-button> -->
<!-- 故障设备视图 -->
<el-button v-if="jlmap3dFaultShow" size="small" @click="jumpjlmap3dFault">故障设备</el-button>
<!-- 司机视角 -->
<el-button v-if="driverShow" size="small" type="jumpjlmap3d" @click="jumpjlmap3dDriver">司机视角</el-button>
<!-- 排班计划 -->
<el-button v-if="scheduleLoadShow" type="primary" size="small" @click="jumpScheduling">派班计划加载</el-button>
<el-button v-if="schedulePreviewShow" type="primary" size="small" @click="schedulingView">派班计划预览</el-button>
<el-button v-if="isContest" size="small" :disabled="practiceDisabled" @click="fieldPractice">实操练习</el-button>
<el-button v-if="isContest" size="small" @click="goTheoryQuiz">理论考试</el-button>
<el-button v-if="messageBoard" size="small" @click="messageBoardShow">留言板</el-button>
<!-- v-if="isContest" -->
<el-button v-if="!isLocal" size="small" @click="contectUs">联系方式</el-button>
</el-button-group>
</div>
<Jl3d-Device
v-if="deviceif"
v-show="deviceShow"
ref="Jl3dDevice"
:panel-show="deviceShow"
@closedevice3dview="jumpjlmap3dmodel"
/>
<Jl3d-Drive v-show="drivingShow" ref="Jl3dDrive" :panel-show="drivingShow" @showdriving="showdriving" />
<scheduling v-if="scheduleLoadShow" ref="scheduling" :group="group" />
<scheduling-view v-if="schedulePreviewShow" ref="schedulingView" :group="group" />
<contect-us ref="contectUs" />
</div>
</template>
<script>
import Jl3dDevice from '@/views/jlmap3d/device/jl3ddevice';
import Jl3dDrive from '@/views/jlmap3d/drive/jl3ddrive';
import { getToken } from '@/utils/auth';
import { getSessionStorage } from '@/utils/auth';
import Scheduling from '@/views/newMap/displayNew/demon/scheduling';
import SchedulingView from '@/views/newMap/displayNew/demon/schedulingView';
import { EventBus } from '@/scripts/event-bus';
import ContectUs from '@/views/newMap/displayNew/dispatherContest/contectUs';
import { getPostByProjectCode } from '@/api/learn';
import { ProjectCode } from '@/scripts/ProjectConfig';
export default {
name:'DemonMenu',
components:{
Jl3dDevice,
Jl3dDrive,
Scheduling,
SchedulingView,
ContectUs
},
props:{
isAllShow:{
type:Boolean,
require:true
},
jl3dmodelShow:{
type:Boolean,
require:true
},
jl3dnameShow:{
type:Boolean,
require:true
},
cctvShow:{
type:Boolean,
require:true
},
trafficplanShow:{
type:Boolean,
require:true
},
traffictrainShow:{
type:Boolean,
require:true
},
scheduleLoadShow:{
type:Boolean,
require:true
},
driverShow:{
type:Boolean,
require:true
},
schedulePreviewShow:{
type:Boolean,
require:true
},
jlmap3dFaultShow:{
type:Boolean,
require:true
},
allStyle:{
type:String,
default() {
return '';
}
}
},
data() {
return {
hoverBtn: false,
btnWidth: 0,
group:'',
mapId:'',
lineCode:'',
practiceDisabled:false,
deviceif:false,
deviceShow: true,
drivingShow: false,
messageBoard: false,
jl3dtrafficplan:this.$t('display.demon.trafficplantext'),
jl3dtraffictrain:this.$t('display.demon.traffictraintext'),
jl3dpassflow:this.$t('display.demon.passengerflow'),
jl3dname: this.$t('display.demon.threeDimensionalView'),
jl3dmodel: this.$t('display.demon.deviceView')
};
},
computed:{
isDrive() {
return this.$route.query.prdType == '04';
},
project() {
return getSessionStorage('project');
},
isContest() {
return this.$route.params.mode === 'demon' && (this.project.includes('drts') || this.$route.query.thirdDrts);
},
running() {
return this.$store.state.training.started;
},
isLocal() { // 是否为本地项目
return process.env.VUE_APP_PRO === 'local';
},
isCtc() {
return this.$route.query.ctc;
}
},
mounted() {
this.group = this.$route.query.group;
this.mapId = this.$route.query.mapId;
this.lineCode = this.$route.query.lineCode;
EventBus.$on('loadScene', () => {
this.practiceDisabled = true;
});
EventBus.$on('quitScene', () => {
this.practiceDisabled = false;
});
if (this.project) {
getPostByProjectCode(ProjectCode[this.project]).then(resp => {
if (resp.data) {
this.messageBoard = true;
}
}).catch(() => {
// this.$message.error('获取留言板信息失败');
console.log('获取留言板信息失败');
});
}
},
methods:{
menuClick() {
this.hoverBtn = !this.hoverBtn;
if (this.hoverBtn) {
// this.$refs.button_group_box.$el.clientWidth ||
this.btnWidth = 600; // 默认宽度
} else {
// button_group_box
this.btnWidth = 0;
}
},
jumpjlmap3dmodel() {
if (this.deviceif == false) {
this.deviceif = true;
} else {
if (this.deviceShow == false) {
this.deviceShow = true;
} else {
this.deviceShow = false;
}
}
},
showdriving() {
this.drivingShow = false;
},
jumpjlmap3d() {
const routeData = this.$router.resolve({
path:'/jlmap3d/sandbox',
query:{
mapid:this.mapId,
group:this.group,
token:getToken(),
project: this.project,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
jumpjl3dpassflow() {
const routeData = this.$router.resolve({
path:'/jlmap3d/passengerflow',
query:{
mapid:this.mapId,
group:this.group,
project: this.project,
noPreLogout: true,
lineCode:this.lineCode
}
});
window.open(routeData.href, '_blank');
},
// jumpjl3dtrafficplan() {
// const routeData = this.$router.resolve({
// path:'/jlmap3d/trafficplan',
// query:{
// mapid:this.mapId,
// group:this.group,
// project: this.project,
// noPreLogout: true,
// lineCode:this.lineCode
// }
// });
// window.open(routeData.href, '_blank');
// },
// jumpjl3dtraffictrain() {
// const routeData = this.$router.resolve({
// path:'/jlmap3d/traffictrain',
// query:{
// mapid:this.mapId,
// group:this.group,
// project: this.project,
// noPreLogout: true,
// lineCode:this.lineCode
// }
// });
// window.open(routeData.href, '_blank');
// },
jumpjlmap3dFault() {
const routeData = this.$router.resolve({
path:'/jlmap3d/maintainer',
query:{
mapid:this.mapId,
group:this.group,
token:getToken(),
project: this.project,
noPreLogout: true
}
});
window.open(routeData.href);
},
jumpjlmap3dDriver() {
this.drivingShow = true;
this.$refs.Jl3dDrive.show(this.mapId, this.group);
},
jumpScheduling() {
this.$refs.scheduling.doShow();
},
schedulingView() {
this.$refs.schedulingView.doShow();
},
hideScheduling(running) {
if (running) {
this.$refs.scheduling && this.$refs.scheduling.doClose();
} else {
this.$refs.schedulingView && this.$refs.schedulingView.doClose();
}
},
fieldPractice() {
this.$emit('fieldPractice');
},
goTheoryQuiz() {
this.$emit('goTheoryQuiz');
},
messageBoardShow() {
const routeData = this.$router.resolve({
path:'/messageBoard',
query:{
project: this.$route.query.project || getSessionStorage('project'),
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
contectUs() {
this.$refs.contectUs.doShow();
}
}
};
</script>
<style lang="scss" scoped>
.display_top_draft{
position: absolute;
left: 5px;
top: 15px;
height: 32px;
overflow: hidden;
padding-left: 44px;
z-index: 35;
.btn_hover{
position: absolute;
left: 0;
top: 0;
z-index: 2;
color: #4e4d4d;
font-size: 14px;
background: #fff;
padding: 8px;
border-radius: 5px;
display: block;
cursor: pointer;
float: left;
height: 32px;
}
.button_group_box{
float: left;
transition: all 0.5s;
overflow: hidden;
margin-left: -700px;
// transform: translateX(0px);
}
}
</style>

66
src/views/newMap/displayNew/dispatherContest/contectUs.vue
View File

@ -1,66 +0,0 @@
<template>
<el-dialog
title="联系方式"
:visible.sync="dialogVisible"
width="400px"
:before-close="handleClose"
>
<div v-if="thirdLogin">
<div><span class="el-icon-user" style="font-size:15px;margin-right:8px;" />联系人：欧阳炜椿</div>
<div class="eachInfo"><span class="el-icon-mobile-phone" style="font-size:15px;margin-right:7px;" />电&nbsp;&nbsp;&nbsp;&nbsp;话：4000500081</div>
<div class="eachInfo"><span class="el-icon-message" style="font-size:15px;margin-right:7px;" />邮&nbsp;&nbsp;&nbsp;&nbsp;箱：zhrc@richortech.com</div>
<div class="eachInfo"><span class="el-icon-connection" style="font-size:15px;margin-right:7px;" />网&nbsp;&nbsp;&nbsp;&nbsp;址：www.richortech.com</div>
<!-- <div class="eachInfo">
<span class="el-icon-chat-round" style="font-size:15px;margin-right:3px;vertical-align:top;" />
<span style="vertical-align: top;">微&nbsp;&nbsp;&nbsp;&nbsp;信：</span>
<img :src="wchatImg" width="80" height="80">
</div> -->
</div>
<div v-else>
<div><span class="el-icon-user" style="font-size:15px;margin-right:8px;" />联系人：许经理</div>
<div class="eachInfo"><span class="el-icon-mobile-phone" style="font-size:15px;margin-right:7px;" />手&nbsp;&nbsp;&nbsp;&nbsp;机：13910989830</div>
<div class="eachInfo"><span class="el-icon-message" style="font-size:15px;margin-right:7px;" />邮&nbsp;&nbsp;&nbsp;&nbsp;箱：henry@joylink.club</div>
<div class="eachInfo">
<span class="el-icon-chat-round" style="font-size:15px;margin-right:3px;vertical-align:top;" />
<span style="vertical-align: top;">微&nbsp;&nbsp;&nbsp;&nbsp;信：</span>
<img :src="wchatImg" width="80" height="80">
</div>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="dialogVisible = false">确 定</el-button>
</span>
</el-dialog>
</template>
<script>
import wchat from '@/assets/wchat.png';
import { getSessionStorage } from '@/utils/auth';
import { RichorContectUsList } from '@/scripts/ProjectConfig';
export default {
name:'',
data() {
return {
dialogVisible:false,
wchatImg: wchat
};
},
computed:{
thirdLogin() {
return RichorContectUsList.includes(getSessionStorage('project'));
}
},
methods:{
handleClose() {
this.dialogVisible = false;
},
doShow() {
this.dialogVisible = true;
}
}
};
</script>
<style lang="scss" scoped>
.eachInfo{
margin-top: 10px;
}
</style>

528
src/views/newMap/displayNew/dispatherContest/index.vue
View File

@ -1,528 +0,0 @@
<template>
<div>
<demon-chat ref="chatbox" :group="group" :user-role="userRole" :offset="offset" />
<demon-menu
ref="demonMenu"
:is-all-show="!dataError"
:jl3dmodel-show="false"
:jl3dname-show="!isShowScheduling&&!isDrive"
:cctv-show="!isShowScheduling"
:schedule-load-show="isShowScheduling && !runing"
:schedule-preview-show="isShowScheduling && runing"
:jlmap3d-fault-show="false"
:driver-show="isDrive"
:all-style="'top:'+(offset+textStatusHeight)+'px'"
@fieldPractice="fieldPractice"
@goTheoryQuiz="goTheoryQuiz"
/>
<div v-if="isScriptLoad" class="trainingButton" :style="{top: (offset+45)+'px'}">
<el-row>
<el-radio-group v-model="scriptMode" class="mode" size="small" @change="changeScriptMode">
<el-radio-button :label="scriptModeList.TEACH" :disabled="isScriptRun">{{ $t('display.lesson.teachingMode') }}</el-radio-button>
<el-radio-button :label="scriptModeList.PRACTICE" :disabled="isScriptRun">{{ $t('display.lesson.practiceMode') }}</el-radio-button>
<el-radio-button :label="scriptModeList.TEST" :disabled="isScriptRun">{{ $t('display.lesson.testMode') }}</el-radio-button>
</el-radio-group>
</el-row>
</div>
<div class="display-draft" :class="{'haerbin_btn_box': $route.query.lineCode == '07'}" :style="{bottom: offsetBottom + 'px'}">
<el-button-group class="button-group-box">
<template v-if="!dataError">
<template v-if="isScriptLoad">
<el-button type="" size="small" @click="handleExplain">说明</el-button>
<el-button type="primary" size="small" :disabled="isScriptRun" @click="startTraining">开始</el-button>
<el-button type="success" size="small" :disabled="!isScriptRun" @click="endTraining">结束</el-button>
<el-button type="danger" size="small" @click="handleQuitQuest">退出场景</el-button>
</template>
<template v-else>
<!-- 按计划行车 -->
<el-button type="success" :disabled="isDisable" size="small" @click="selectBeginTime">{{ $t('display.demon.drivingByPlan') }}</el-button>
<!-- 初始化 -->
<el-button type="danger" size="small" @click="end">{{ $t('display.demon.initialize') }}</el-button>
</template>
<el-button type="primary" size="small" @click="back">退出</el-button>
</template>
</el-button-group>
</div>
<menu-schema
ref="menuSchema"
:offset="offset"
:data-error="dataError"
:offset-bottom="offsetBottom"
@selectQuest="selectQuest"
/>
<!-- :station-list="stationListMode"
:show-select-station="showSelectStation"
@selectQuest="selectQuest"
@switchStationMode="switchStationMode"
@switchMode="switchMode" -->
<set-time ref="setTime" @ConfirmSelectBeginTime="start" />
<scene-list ref="sceneList" @selectScript="selectScript" @goToPay="goToPay" />
<theory-exam-select ref="theoryExamSelect" @startTheoryExam="startTheoryExam" />
<theory-exam ref="theoryExam" />
<select-role ref="selectRole" :member-list="currentPlayList" @selectRole="selectRole" />
<operational-statistic ref="operationalStatistic" @finishTraining="finishTraining" />
<test-result ref="testResult" />
<pay-page ref="payPage" />
</div>
</template>
<!-- 单人仿真 -->
<script>
import SetTime from '../demon/setTime';
import DemonMenu from '../demonMenu';
import DemonChat from '../demonChat';
import SceneList from './sceneList';
import MenuSchema from '@/views/newMap/displayNew/menuSchema';
import TheoryExamSelect from './theoryExamSelect';
import TheoryExam from './theoryExam';
import PayPage from '@/views/newMap/displayNew/demon/payPage';
import {clearSimulation, getSimulationInfoNew } from '@/api/simulation';
import { timestampFormat } from '@/utils/date';
import { ScriptMode, TrainingMode } from '@/scripts/ConstDic';
import SelectRole from '@/views/newMap/displayNew/scriptDisplay/component/selectRole';
import {competitionPracticalSceneStart, competitionPracticalSceneExit, competitionPracticalSceneFinish, getEmptyOperationalStatistics} from '@/api/competition';
import { EventBus } from '@/scripts/event-bus';
import OperationalStatistic from './operationalStatistic.vue';
import TestResult from './testResult.vue';
import Vue from 'vue';
import ConstConfig from '@/scripts/ConstConfig';
export default {
name: 'MenuDemon',
components: {
SetTime,
DemonChat,
MenuSchema,
DemonMenu,
SceneList,
TheoryExamSelect,
TheoryExam,
OperationalStatistic,
TestResult,
SelectRole,
PayPage
},
props: {
offset: {
type: Number,
required: true
},
offsetBottom: {
type: Number,
required: true
},
dataError: {
type: Boolean,
default() {
return false;
}
},
textStatusHeight: {
type: Number,
default() {
return 0;
}
}
},
data() {
return {
userRole: 'AUDIENCE',
isScriptLoad: false,
isScriptRun: false,
scriptMode: ScriptMode.TEACH,
mapLocation: {},
playerList: [],
currentPlayList: [],
isGoback: false,
runing: false,
prdTypeMap: {
'01': '01', // 现地 => 现地
'02': '02', // 行调 => 行调
'04': '02', // 司机 => 行调
'05': '' // 派班 => null
}
};
},
computed: {
isShowScheduling() {
return this.$route.query.prdType == '05';
},
isDrive() {
return this.$route.query.prdType == '04';
},
group() {
return this.$route.query.group;
},
scriptModeList() {
return ScriptMode;
},
isDisable() {
return this.$store.state.training.started;
}
},
watch: {
// '$store.state.training.subscribeCount': function () {
// this.group && this.initLoadPage();
// },
'$store.state.socket.simulationRoleList':function(val) {
(val || []).forEach(item => {
if (item.messageType === 'KICK_OUT' && item.userId == this.$store.state.user.id) {
!this.isGoback && this.back();
}
});
},
'$store.state.socket.competitionPracticeFinish':function(val) {
this.getEmptyOperationalStatistics();
},
// '$store.state.socket.simulationOver':function(val) {
// !this.isGoback && this.back();
// },
// '$store.state.training.started': function (val) {
// this.setRuning(val);
// },
'$store.state.socket.simulationStart':function(val) {
if (val) {
this.setRuning(true);
this.$store.dispatch('training/simulationStart').then(() => {
this.$store.dispatch('map/setShowCentralizedStationNum');
});
}
},
'$store.state.socket.simulationReset':function(val) {
this.setRuning(false);
},
'$store.state.map.mapViewLoadedCount': function (val) { // 地图视图加载完成标识 开始加载默认状态
if (this.$route.query.noFirst) {
const initTime = new Date(this.$store.state.training.initTime || null);
const model = {initTime: timestampFormat('HH:mm:ss', initTime), timestamp:initTime};
this.start(model);
}
},
isScriptLoad(val) {
if (!val && this.$store.state.training.notifySelected) {
this.$store.state.training.notifySelected.close();
this.$store.commit('training/setNotifySelected', null);
}
}
},
created() {
this.$store.dispatch('training/setPrdType', this.$route.query.prdType);
if (this.$store.state.training.prdType == '02') {
this.userRole = 'DISPATCHER';
} else if (this.$store.state.training.prdType == '01') {
this.userRole = 'STATION_SUPERVISOR';
} else if (this.$store.state.training.prdType == '04') {
this.userRole = 'DRIVER';
} else if (this.$store.state.training.prdType == '05') {
this.userRole = 'DEPOT_DISPATCHER';
} else {
this.userRole = 'AUDIENCE';
}
},
beforeDestroy() {
this.$store.dispatch('scriptRecord/updateSimulationPause', false);
this.$store.dispatch('map/resetActiveTrainList', true);
},
mounted() {
this.$store.dispatch('training/end', TrainingMode.NORMAL);
this.$store.dispatch('training/setPrdType', this.prdTypeMap[this.$route.query.prdType]);
this.$nextTick(() => {
this.$refs.demonMenu.menuClick();
});
},
methods: {
selectBeginTime() {
this.$refs.setTime.doShow();
},
start(model) { // 开始仿真
this.$emit('start', model);
},
setRuning(run) {
this.runing = run;
this.$refs.demonMenu.hideScheduling(run);
},
end() {
this.$emit('end');
},
handleQuitQuest() {
competitionPracticalSceneExit(this.group).then(resp => {
getSimulationInfoNew(this.group).then((res)=>{
this.$store.dispatch('scriptRecord/updateAudioPlay', false);
EventBus.$emit('quitScene');
this.quitQuest();
// this.initLoadPage();
this.isScriptRun = false;
this.clearAllData();
this.$store.dispatch('scriptRecord/updateBgSet', false);
}).catch(()=>{
this.$messageBox(this.$t('display.demon.exitTaskFail'));
});
}).catch(() => {
this.$messageBox(this.$t('display.demon.exitTaskFail'));
});
},
// 选择脚本
async selectQuest({row, id, mapLocation, roleName}) {
try {
let userRole = 'AUDIENCE';
if (id) {
this.$store.dispatch('training/setPrdType', this.$route.query.prdType);
if (this.$route.query.prdType) {
if (this.$route.query.prdType == '02') {
userRole = 'DISPATCHER';
} else if (this.$route.query.prdType == '01') {
userRole = 'STATION_SUPERVISOR';
} else if (this.$route.query.prdType == '04') {
userRole = 'DRIVER';
} else if (this.$route.query.prdType == '05') {
userRole = 'DEPOT_DISPATCHER';
} else {
userRole = 'AUDIENCE';
}
}
this.$store.dispatch('training/setRoles', userRole);
} else {
this.$store.dispatch('training/setRoles', 'AUDIENCE');
this.$store.dispatch('training/setPrdType', '');
}
this.userRole = userRole;
this.$store.dispatch('scriptRecord/updateBgSet', true);
this.isScriptLoad = true;
// this.$refs.chatbox.setMembers(id);
// const res = await loadScriptNewMode(row.id, id, this.group, operationType);
// if (res && res.code == 200) {
// if (mapLocation) {
// const newMapLocation = {'offsetX': mapLocation.x, 'offsetY': mapLocation.y, 'scaleRate': mapLocation.scale};
// Vue.prototype.$jlmap.setOptions(newMapLocation);
// }
// this.isScriptRun = true;
// // this.initLoadPage();
// }
} catch (error) {
this.$messageBox(error.message);
}
// if (this.isScript) {
// this.$refs.menuScript.initLoadPage();
// }
},
selectScript({playerList, mapLocation}) {
this.changeScriptMode(this.scriptMode);
this.isScriptLoad = true;
this.playerList = playerList;
this.mapLocation = mapLocation;
this.userRole = 'AUDIENCE';
this.$store.dispatch('training/setRoles', 'AUDIENCE');
},
selectRole(role) {
const memberId = role.id;
(this.$store.state.training.memberData[role.id] || {}).userId = this.$store.state.user.id;
(this.$store.state.training.memberData[role.id] || {}).disabled = true;
this.runScriptMode(memberId);
},
handleExplain() {
let name = this.$store.state.training.notifySelected.title;
if (name.includes('—')) {
name = name.split('—')[0];
}
const ossData = ConstConfig.ConstSelect.ossList.find(ele => { return ele.name == name; });
const href = `https://joylink.club/oss/cbtc/race/${ossData.url}`;
window.open(href, '_blank');
},
finishTraining(data) {
this.isScriptRun = false;
this.showResultData(data);
},
showResultData(data) {
this.$refs.testResult.doShow({data:data});
},
endTraining() {
competitionPracticalSceneFinish(this.group, {operationStatisticVO:{}}).then(res=>{
this.isScriptRun = false;
// if (this.scriptMode == ScriptMode.TEST) {
this.showResultData(res.data);
// this.$store.dispatch('scriptRecord/updateAudioPlay', false);
// }
// this.userRole = 'AUDIENCE';
// this.$store.dispatch('training/setRoles', 'AUDIENCE');
// this.quitScriptTraining();
}).catch(error=>{
this.$messageBox(error.message);
});
},
startTraining() {
this.$store.dispatch('scriptRecord/updateAudioPlay', false);
let userRole = 'AUDIENCE';
if (this.$route.query.prdType) {
if (this.$route.query.prdType == '02') {
userRole = 'DISPATCHER';
} else if (this.$route.query.prdType == '01') {
userRole = 'STATION_SUPERVISOR';
} else if (this.$route.query.prdType == '04') {
userRole = 'DRIVER';
} else if (this.$route.query.prdType == '05') {
userRole = 'DEPOT_DISPATCHER';
} else {
userRole = 'AUDIENCE';
}
}
this.userRole = userRole;
this.$store.dispatch('training/setRoles', userRole);
this.$refs.chatbox.cancelCommonConversation();
if (this.isScriptLoad) {
this.clearAllData();
}
const currentPlayList = [];
this.playerList.forEach(play=>{
if (play.type === userRole) {
currentPlayList.push(play);
}
});
if (currentPlayList.length > 0) {
// if (currentPlayList.length > 1) {
// this.currentPlayList = currentPlayList;
// this.$refs.selectRole.doShow();
// } else {
const member = currentPlayList[0];
const memberId = member.id;
(this.$store.state.training.memberData[member.id] || {}).userId = this.$store.state.user.id;
(this.$store.state.training.memberData[member.id] || {}).disabled = true;
this.runScriptMode(memberId);
// }
}
},
runScriptMode(memberId) {
// this.$store.dispatch('scriptRecord/updateBgSet', true);
competitionPracticalSceneStart(this.group, memberId, this.scriptMode)
.then(res=>{
this.isScriptRun = true;
if (this.mapLocation) {
const newMapLocation = {'offsetX': this.mapLocation.x, 'offsetY': this.mapLocation.y, 'scaleRate': this.mapLocation.scale};
Vue.prototype.$jlmap.setOptions(newMapLocation);
}
})
.catch(error=>{
this.$messageBox(error.message);
});
},
changeScriptMode(scriptMode) {
const ScriptModeList = {
TEACHING_MODE:'teach',
PRACTICE_MODE:'practice',
TEST_MODE:'test'
};
this.$store.dispatch('training/setScriptOperationType', ScriptModeList[scriptMode]);
},
quitQuest() {
this.isScriptLoad = false;
if (this.isScriptRun) {
this.quitScriptTraining();
}
this.$store.dispatch('training/setScriptQuit');
// this.$refs.chatbox.resetCoversition();
// this.$store.dispatch('scriptRecord/updateSimulationPause', false);
},
quitScriptTraining() {
let userRole = '';
if (this.$route.query.prdType) {
if (this.$route.query.prdType == '02') {
userRole = 'DISPATCHER';
} else if (this.$route.query.prdType == '01') {
userRole = 'STATION_SUPERVISOR';
} else if (this.$route.query.prdType == '04') {
userRole = 'DRIVER';
} else if (this.$route.query.prdType == '05') {
userRole = 'DEPOT_DISPATCHER';
} else {
userRole = 'AUDIENCE';
}
}
this.userRole = userRole;
// this.$refs.chatbox.setMembers(this.$store.state.training.orignalUserRoleId);
// this.$refs.chatbox.clearAllData();
this.$store.dispatch('training/setPrdType', this.$route.query.prdType);
this.$store.dispatch('training/setRoles', userRole);
},
clearAllData() {
this.$refs.chatbox.clearAllData();
},
async back() {
clearSimulation(this.group).then(res=>{
this.isGoback = true;
this.$store.dispatch('training/over').then(() => {
if (this.$route.query.thirdDrts) {
window.close();
} else {
this.$store.dispatch('LogOut').then(() => {
location.reload();
});
}
});
}).catch(()=> {
this.$message.error('结束仿真失败！');
});
},
fieldPractice() {
this.$refs.sceneList.doShow();
},
goTheoryQuiz() {
this.$refs.theoryExamSelect.doShow();
},
startTheoryExam(mode) {
this.$refs.theoryExam.doShow(mode);
},
getEmptyOperationalStatistics() {
getEmptyOperationalStatistics(this.group).then(res=>{
this.$refs.operationalStatistic.doShow(res.data);
});
},
goToPay() {
this.$refs.payPage.doShow();
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.trainingButton{
position: absolute;
left: 5px;
}
.display-score {
background-color: black;
display: -moz-inline-box;
display: inline-block;
text-align: left;
height: 32px;
line-height: 24px;
border-radius: 4px;
padding-left: 2px;
margin-left: 10px;
font-family: "Microsoft" !important;
font-size: 18px !important;
color: #fff;
}
.haerbin_btn_box{
width: 450px;
bottom: 15px!important;
}
.display-draft {
position: absolute;
right: 10px;
bottom: 15px;
.button-group-box{
float: right;
}
}
</style>

99
src/views/newMap/displayNew/dispatherContest/operationalStatistic.vue
View File

@ -1,99 +0,0 @@
<template>
<el-dialog
title="提交运营统计数据"
:visible.sync="dialogShow"
top="50px"
width="500px"
:before-do-close="roleDoClose"
:close-on-click-modal="false"
>
<div v-for="(item,index) in resultData.itemVOS" :key="index" style="margin-top:10px;">
<span class="itemDescription">{{ item.description+':' }}</span>
<el-time-picker
v-if="item.type=='Time'"
v-model="dataList[index]"
value-format="HH:mm"
format="HH:mm"
size="small"
class="itemFormItem"
@change="((val)=>{changeData(val,index)}) "
/>
<el-input v-if="item.type=='Non_Time'" v-model="dataList[index]" type="text" class="itemFormItem" size="small" :maxlength="100" @change="((val)=>{changeNoTimeData(val,index)}) " />
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="roleDoClose">{{ $t('global.cancel') }}</el-button>
<el-button type="primary" @click="confirm">{{ $t('global.confirm') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { competitionPracticalSceneFinish} from '@/api/competition';
export default {
name:'OperationalStatistics',
data() {
return {
dialogShow:false,
resultData:{
score:0,
itemVOS:[]
},
dataList:[]
};
},
methods:{
doShow(resultData) {
this.dialogShow = true;
this.resultData.score = resultData.score;
this.resultData.itemVOS = resultData.itemVOS;
this.dataList = [];
},
roleDoClose() {
this.dialogShow = false;
},
confirm() {
let result = true;
if (this.resultData.itemVOS.length > 0) {
this.resultData.itemVOS.forEach(item=>{
if (!item.timeFilledInByUser && !item.userAnswer) {
result = result && false;
}
});
}
if (!result) {
this.$messageBox('请填写表单');
} else {
competitionPracticalSceneFinish(this.$route.query.group, this.resultData).then(res=>{
this.$message.success('运营统计数据提交成功');
// this.formatScore = res.data;
// this.$messageBox('得分：' + this.formatScore);
this.$emit('finishTraining', res.data);
this.dialogShow = false;
}).catch(error=>{
this.$message.error('运营统计数据提交失败：' + error.message);
});
}
},
changeData(val, index) {
this.resultData.itemVOS[index].timeFilledInByUser = val + ':00';
},
changeNoTimeData(val, index) {
this.resultData.itemVOS[index].userAnswer = val;
}
}
};
</script>
<style lang="scss" scoped>
.itemDescription{
margin-left: 20px;
width:180px;
display: inline-block;
text-align: right;
vertical-align: middle;
}
.itemFormItem{
width:200px;
display:inline-block;
vertical-align: middle;
}
</style>

91
src/views/newMap/displayNew/dispatherContest/question.vue
View File

@ -1,91 +0,0 @@
<template>
<div class="question">
<div class="ql-editor" v-html="appendIndex($escapeHTML(`${option.topic}`), $vnode.key)" />
<template v-if="checkType(option, 'judge')">
<el-radio-group v-model="answer" @change="onChnage">
<el-radio v-for="(el,i) in option.optionList" :key="i" :label="$str2number(el.id)" style="display: inline">
<span>{{ el.content }}</span>
</el-radio>
</el-radio-group>
</template>
<template v-else-if="checkType(option, 'select')">
<el-radio-group v-model="answer" @change="onChnage">
<el-radio v-for="(el,i) in option.optionList" :key="i" :label="$str2number(el.id)" style="display: block">
<span>{{ $asc2chart(i+65) }}. </span>
<div class="ql-editor" style="display: inline; padding: 0" v-html="$escapeHTML(el.content)" />
</el-radio>
</el-radio-group>
</template>
</div>
</template>
<script>
export default {
props: {
value: {
type: String,
default: ''
},
option: {
type: Object,
required: true
}
},
data() {
return {
answer: 0
};
},
watch: {
value(val) {
this.changeValue();
}
},
mounted() {
this.changeValue();
},
methods: {
changeValue() {
this.answer = parseInt(this.value);
},
checkType(option, type) {
return option.type == type;
},
appendIndex(str, index) {
return `${index + 1}. ${str}`;
},
onChnage(e) {
const answer = `${e}`;
this.$emit('input', answer);
this.$emit('save', {userExamQuestionId: this.option.id, answer: answer});
}
}
};
</script>
<style lang="scss" scoped>
.rich-text {
padding: 0;
display: inline;
}
.question {
/deep/ {
.ql-editor {
line-height: 26px;
padding: 0;
}
.el-radio {
color: #000;
}
.el-radio__label {
font-size: 16px;
line-height: 26px;
}
}
}
</style>

342
src/views/newMap/displayNew/dispatherContest/sceneList.vue
View File

@ -1,342 +0,0 @@
<template>
<div>
<el-dialog v-dialogDrag title="场景列表" :visible.sync="dialogVisible" width="920px" center>
<el-tabs v-model="activeName" type="card" style="height:550px">
<el-tab-pane label="主场景列表" name="first">
<div v-if="!hasPermission" style="margin-bottom: 10px;color: #f00;width: 100%;text-align: center;">
尊敬的用户，您好：由于您暂无场景权限，现仅提供场景1试用，如需使用其他场景请
<el-button type="text" style="text-decoration: underline" @click="goToPay">购买权限</el-button>
</div>
<div v-if="permisson.endTime" style="margin-bottom: 10px;color: #f00;width: 100%;text-align: center;">
{{ `您的场景权限截止时间：${permisson.endTime || '永久'}。` }}
<el-button type="text" style="text-decoration: underline" @click="goToPay">立即续费</el-button>
</div>
<el-table :data="mainSceneData" border :span-method="objectSpanMethod" height="465" stripe :cell-style="{padding: '8px 0'}">
<el-table-column type="index" width="50" label="序号" />
<el-table-column prop="type" width="200" label="类别" />
<el-table-column prop="scene" width="350" label="场景" />
<el-table-column label="操作">
<template slot-scope="scope">
<div v-if="scope.row.result">
<template v-for="(each, index) in scope.row.result">
<el-button :key="index" type="primary" size="small" :disabled="!hasPermission && each.name !=='场景1'" style="margin-right: 8px;margin-left: 0;margin-bottom: 5px" @click="handleLoad(each)">{{ each.name }}</el-button>
</template>
</div>
</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
</el-dialog>
</div>
</template>
<script>
import { getDraftScriptByGroupNew } from '@/api/script';
import {loadCompetitionPracticalScene, getCompetitionPracticalScene, queryCompetitionPracticalPermissions} from '@/api/competition';
import { EventBus } from '@/scripts/event-bus';
import ConstConfig from '@/scripts/ConstConfig';
export default {
name:'ChangeMap',
data() {
return {
projectMapList:[],
dialogVisible: false,
selectMapId:'',
hasPermission: false,
permisson: {},
form: {
type: ''
},
row: '',
activeName: 'first',
memberList: [],
selectMapLineCode:'',
mainSceneData: [
{type: '车辆故障', scene: '列车救援', result:[]},
{type: '信号系统故障', scene: '道岔故障', result:[]},
{type: '信号系统故障', scene: '区域控制器故障', result:[]},
{type: '信号系统故障', scene: '联锁故障', result:[]},
{type: '供电系统故障', scene: '接触轨(网)断电', result:[]},
{type: '供电系统故障', scene: '车站照明熄灭影响乘降', result:[]},
{type: '车站机电设备故障', scene: '站台门故障', result:[]},
// {type: '车站机电设备故障', scene: '车站照明故障', result:[]},
{type: '限速', scene: '列车限速', result:[]},
{type: '轨道故障', scene: '线路故障影响列车运行', result:[]},
{type: '轨道故障', scene: '计轴故障', result:[]}
// {type: '在区域控制器故障', scene: '线路故障多车降级', result:[]}
]
};
},
watch: {
'$store.state.socket.payOrder':function (val) {
this.queryPermission();
}
},
mounted() {
this.queryPermission();
getCompetitionPracticalScene({pageSize:100, pageNum:1}).then(res=>{
if (res.data.list && res.data.list.length > 0) {
const list = res.data.list.sort((a, b) => {
return parseInt(a.name.replace('场景', '')) - parseInt(b.name.replace('场景', ''));
});
list.forEach(each=>{
if (each.name == '场景1' || each.name == '场景2' || each.name == '场景3' || each.name == '场景7') {
this.mainSceneData[1].result.push({id:each.id, name:each.name, description: each.description, disposalProcesses: each.disposalProcesses});
} else if (each.name == '场景4') {
this.mainSceneData[0].result.push({id:each.id, name:'场景4', description: each.description, disposalProcesses: each.disposalProcesses});
} else if (each.name == '场景5' || each.name == '场景11') {
this.mainSceneData[4].result.push({id:each.id, name:each.name, description: each.description, disposalProcesses: each.disposalProcesses});
} else if (each.name == '场景6') {
this.mainSceneData[9].result.push({id:each.id, name:each.name, description: each.description, disposalProcesses: each.disposalProcesses});
} else if (each.name == '场景9') {
this.mainSceneData[6].result.push({id:each.id, name:'场景9', description: each.description, disposalProcesses: each.disposalProcesses});
} else if (each.name == '场景8') {
this.mainSceneData[5].result.push({id:each.id, name:'场景8', description: each.description, disposalProcesses: each.disposalProcesses});
} else if (each.name == '场景10') {
this.mainSceneData[7].result.push({id:each.id, name:'场景10', description: each.description, disposalProcesses: each.disposalProcesses});
} else if (each.name == '场景12') {
this.mainSceneData[2].result.push({id:each.id, name:'场景12', description: each.description, disposalProcesses: each.disposalProcesses});
}
});
}
});
},
methods:{
doShow() {
this.dialogVisible = true;
},
doClose() {
this.dialogVisible = false;
},
queryPermission() {
this.permisson = {};
queryCompetitionPracticalPermissions({mapId:this.$route.query.mapId}).then(res => {
this.hasPermission = !!res.data;
if (res.data) { this.permisson = res.data; }
}).catch(() => {
this.$message.error('获取场景权限异常！');
});
},
async handleLoad(row) {
this.row = row;
const response = await loadCompetitionPracticalScene(this.$route.query.group, row.id);
if (response.code == 200) {
const res = await getDraftScriptByGroupNew(this.$route.query.group);
if (res.code == 200) {
const playerList = [];
EventBus.$emit('clearRunSeries');
EventBus.$emit('loadScene');
const notifyData = this.$notify({
title: res.data.name,
dangerouslyUseHTMLString: true,
message: `<p><span style="color: #000;font-weight: bold;">场景描述：</span>${row.description}</p>`,
customClass: 'notify_box',
showClose: false,
offset: 75,
duration: 0
});
this.$store.commit('training/setNotifySelected', notifyData);
if (res.data.memberList && res.data.memberList.length > 0) {
this.form.type = '';
res.data.memberList.sort((a, b) => {
return parseInt(a.id) - parseInt(b.id);
});
this.$store.dispatch('training/setMemberList', {memberList:res.data.memberList, userId:this.$store.state.user.id});
const activeMemberList = [];
res.data.actionList.forEach((activeMember)=>{
if (!(activeMemberList.length > 0 && activeMemberList.includes(activeMember.memberId))) {
activeMemberList.push(activeMember.memberId);
}
});
res.data.memberList.forEach(member=>{
if (activeMemberList.includes(member.id)) {
playerList.push(Object.assign({}, member));
}
});
playerList.map(member=>{
switch (member.type) {
case 'DISPATCHER': {
member.label = '行调' + (member.name ? member.name : '');
break;
}
case 'STATION_SUPERVISOR': {
const device = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (device) {
member.label = '行值' + device.name;
member.deviceName = device.name;
}
break;
}
case 'DRIVER': {
member.deviceName = member.deviceCode;
member.label = '司机' + member.deviceName;
break;
}
case 'MAINTAINER': {
member.label = '通号' + (member.name ? member.name : '');
break;
}
case 'DEPOT_DISPATCHER': {
member.label = '车辆段/停车场调度' + (member.name ? member.name : '');
break;
}
case 'PARENT_DEPARTMENT': {
member.label = '上级部门' + (member.name ? member.name : '');
break;
}
case 'ELECTRIC_DISPATCHER': {
member.label = '电力调度' + (member.name ? member.name : '');
break;
}
case 'SIGNAL_BUILDING': {
member.label = '信号楼' + (member.name ? member.name : '');
break;
}
case 'STATION_ASSISTANT': {
const device = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (device) {
member.label = '车站助理-' + device.name + (member.name ? member.name : '');
member.deviceName = device.name;
}
// member.label = '车站助理' + (member.name ? member.name : '');
break;
}
case 'STATION_MASTER': {
const device = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (device) {
member.label = '车站站长-' + device.name + (member.name ? member.name : '');
member.deviceName = device.name;
}
// member.label = '车站站长' + (member.name ? member.name : '');
break;
}
case 'STATION_SIGNALER': {
const device = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (device) {
member.label = '车站信号员-' + device.name + (member.name ? member.name : '');
member.deviceName = device.name;
}
// member.label = '车站信号员' + (member.name ? member.name : '');
break;
}
case 'STATION_PASSENGER': {
const device = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (device) {
member.label = '车站客运员-' + device.name + (member.name ? member.name : '');
member.deviceName = device.name;
}
// member.label = '车站客运员' + (member.name ? member.name : '');
break;
}
case 'STATION_SWITCH_MAN': {
const device = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (device) {
member.label = '车站扳道员-' + device.name + (member.name ? member.name : '');
member.deviceName = device.name;
}
// member.label = '车站扳道员' + (member.name ? member.name : '');
break;
}
case 'STATION_FACILITATOR': {
const device = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (device) {
member.label = '车站引导员-' + device.name + (member.name ? member.name : '');
member.deviceName = device.name;
}
// member.label = '车站引导员' + (member.name ? member.name : '');
break;
}
case 'STATION_WORKER': {
// member.label = '车站工务工' + (member.name ? member.name : '');
const device = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (device) {
member.label = '车站工务工-' + device.name + (member.name ? member.name : '');
member.deviceName = device.name;
}
break;
}
case 'DEVICE_MANAGER': {
const device = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (device) {
member.label = '设备管理员-' + device.name + (member.name ? member.name : '');
member.deviceName = device.name;
}
// member.label = '设备管理员' + (member.name ? member.name : '');
break;
}
case 'TRAIN_MASTER': {
const device = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (device) {
// + device.name
member.label = '车务段段长-' + (member.name ? member.name : '');
member.deviceName = device.name;
}
break;
}
}
});
}
if (res.data.mapLocation) {
this.mapLocation = res.data.mapLocation;
}
this.confirm(playerList);
}
}
},
async handleExplain(row) {
const ossData = ConstConfig.ConstSelect.ossList.find(ele => { return ele.name == row.name; });
const href = `https://joylink.club/oss/cbtc/race/${ossData.url}`;
window.open(href, '_blank');
},
confirm(playerList) {
this.$emit('selectScript', {playerList:playerList, mapLocation:this.mapLocation});
this.doClose();
},
goToPay() {
this.$emit('goToPay');
this.doClose();
},
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
if (rowIndex === 1 && columnIndex === 1) {
return {
rowspan: 3,
colspan: 1
};
} else if ((rowIndex === 4 || rowIndex === 8) && columnIndex === 1) {
return {
rowspan: 2,
colspan: 1
};
} else if ((rowIndex === 2 || rowIndex === 3 || rowIndex === 5 || rowIndex === 9) && columnIndex === 1) {
return {
rowspan: 0,
colspan: 0
};
} else {
return {
rowspan: 1,
colspan: 1
};
}
}
}
};
</script>
<style lang="scss">
.tooltip-box {
white-space:pre-wrap;
}
.notify_box{
width: 300px;
white-space: inherit;
&.el-notification.right{
right: 5px;
padding: 6px 0;
}
}
</style>

275
src/views/newMap/displayNew/dispatherContest/testResult.vue
View File

@ -1,275 +0,0 @@
<template>
<el-dialog
title="竞赛结果详情"
:visible.sync="dialogShow"
top="50px"
width="900px"
:before-do-close="doClose"
class="OSResult"
:close-on-click-modal="false"
>
<div class="operationStatisticResult">
<div class="OSTcompleted">
<span v-if="completed" style="font-size:16px;color:green">完成</span>
<span v-else style="font-size:16px;color:red">未完成</span>
<span style="margin-left:20px;font-size:16px;">满分：{{ fullScore }} 分</span>
<span style="margin-left:20px;font-size:16px;">得分：{{ userScore }} 分</span>
</div>
<div class="OSTitle"><span>关键步骤信息</span><span style="margin-left:10px;">{{ '(得分: '+userScoreOfCommand+' / 满分: '+ fullScoreOfCommand+')' }}</span></div>
<el-table :data="commandPublishStatisticVO" border class="OSTTable3">
<!-- height="400" -->
<el-table-column prop="actionId" label="步骤描述" width="230">
<template slot-scope="scope">
{{ covert(scope.row.actionVO) }}
</template>
</el-table-column>
<el-table-column prop="keyWords" label="关键字" width="200">
<template slot-scope="scope">
<el-tag v-for="(tag,index) in scope.row.keyWords" :key="index" class="eachTag">{{ tag }}</el-tag>
</template>
</el-table-column>
<el-table-column prop="timeConsumed" label="用时" width="100" />
<el-table-column prop="timeOut" label="超时时间" width="100">
<template slot-scope="scope">
{{ scope.row.timeOut?scope.row.timeOut+'s':'' }}
</template>
</el-table-column>
<el-table-column prop="score" label="步骤总分" width="100" />
<el-table-column prop="finalPointsDeducted" label="用户扣分" width="100" />
</el-table>
<div class="OSTitle">
<span>运营统计信息</span>
<span style="margin-left:10px;">{{ '(得分: '+userScoreOfOperationStatistic+' / 满分: '+ fullScoreOfOperationStatistic+')' }}</span>
</div>
<el-table :data="operationStaticItemVOs" border class="OSTTable">
<el-table-column prop="description" label="数据名称" width="300" />
<el-table-column label="正确答案" width="150">
<template slot-scope="scope">
<div v-if="scope.row.type=='Time'">{{ covertTime(scope.row.time) }}</div>
<div v-else-if="scope.row.type=='Non_Time'">{{ scope.row.standardAnswer }}</div>
</template>
</el-table-column>
<el-table-column label="用户填写" width="150">
<template slot-scope="scope">
<div v-if="scope.row.type=='Time'">{{ covertTime(scope.row.timeFilledInByUser) }}</div>
<div v-else-if="scope.row.type=='Non_Time'">{{ scope.row.userAnswer }}</div>
</template>
</el-table-column>
<el-table-column prop="finalPointsDeducted" label="扣分" />
</el-table>
<div class="OSTSignInfo">
<span>运营指标信息</span>
<span style="margin-left:10px;">{{ '(得分: '+userScoreOfOperationIndex+' / 满分: '+fullScoreOfOperationIndex+')' }}</span>
</div>
<div class="OSTSignInfoTips">
<span class="el-icon-info" style="font-size: 16px;" /> 若竞赛未完成，运营指标不得分
</div>
<div class="OSTSignInfoTips">停运列车信息</div>
<el-table :data="finalStoppedRunningStatistics" border class="OSTTable4">
<el-table-column prop="groupNumber" label="车组号" width="400" />
<el-table-column prop="finalPointsDeducted" label="扣分" width="430" />
</el-table>
<div class="OSTSignInfoTips">晚点列车信息</div>
<el-table :data="finalLateStatistics" border class="OSTTable1">
<el-table-column prop="groupNumber" label="车组号" width="300" />
<el-table-column prop="dt" label="晚点时间" width="300">
<template slot-scope="scope">
{{ scope.row.dt }} s
</template>
</el-table-column>
<el-table-column prop="finalPointsDeducted" label="扣分" width="230" />
</el-table>
<div class="OSTSignInfoTips">区间停车信息</div>
<el-table :data="finalStopInSectionStatistics" border class="OSTTable2">
<el-table-column prop="groupNumber" label="车组号" width="300" />
<el-table-column prop="duration" label="停车时长" width="300">
<template slot-scope="scope">
{{ scope.row.duration }} s
</template>
</el-table-column>
<el-table-column prop="finalPointsDeducted" label="扣分" width="230" />
</el-table>
</div>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="doClose">{{ $t('global.confirm') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import {covertOperate} from '@/views/newMap/displayNew/scriptDisplay/component/covertOperation';
export default {
name:'TestResult',
data() {
return {
dialogShow:false,
operationStaticItemVOs:[], // 运营统计信息
finalLateStatistics:[], // 晚点列车信息
finalStopInSectionStatistics:[], // 区间停车信息
commandPublishStatisticVO:[], // 关键步骤信息
finalStoppedRunningStatistics:[], // 停运列车列表
completed:false, // 竞赛是否已完成
fullScore:'', // 总分
userScore:'', // 用户得分
fullScoreOfCommand:0, // 指令发布部分总分
userScoreOfCommand:0, // 关键步骤部分用户得分
fullScoreOfOperationStatistic:0, // 运营统计满分
userScoreOfOperationStatistic:0, // 运营统计用户得分
fullScoreOfOperationIndex:0, // 运营指标满分
userScoreOfOperationIndex:0 // 运营指标用户得分
};
},
methods:{
doShow({data}) {
this.dialogShow = true;
this.completed = data.completed;
this.operationStaticItemVOs = data.operationStatisticVO.itemVOS;
this.finalLateStatistics = data.operationIndexStatisticVO.finalLateStatistics;
this.finalStopInSectionStatistics = data.operationIndexStatisticVO.finalStopInSectionStatistics;
this.finalStoppedRunningStatistics = data.operationIndexStatisticVO.finalStoppedRunningStatistics;
this.commandPublishStatisticVO = data.commandPublishStatisticVO;
this.fullScore = data.fullScore;
this.userScore = data.userScore;
this.fullScoreOfCommand = data.fullScoreOfCommand;
this.userScoreOfCommand = data.userScoreOfCommand;
this.fullScoreOfOperationStatistic = data.fullScoreOfOperationStatistic;
this.userScoreOfOperationStatistic = data.userScoreOfOperationStatistic;
this.fullScoreOfOperationIndex = data.fullScoreOfOperationIndex;
this.userScoreOfOperationIndex = data.userScoreOfOperationIndex;
},
doClose() {
this.dialogShow = false;
},
covertTime(time) {
return time ? time.slice(0, time.length - 3) : '';
},
covert(element) {
const member = this.$store.state.training.memberData[element.memberId];
let resultData = '';
if (element.type == 'Accept_Conversation_Invitation') {
resultData = member.label + '请接受会话邀请';
} else if (element.type == 'Conversation') {
resultData = member.label + '说：' + element.content;
} else if (element.type == 'Operation') {
resultData = covertOperate(element.operationType, element.operationParamMap);
resultData = resultData.replace('请', member.label);
// this.scriptTipMessage = '请找到' + deviceName + '，执行【' + operateName.label + '】操作';
} else if (element.type == 'Exit_Conversation') {
resultData = member.label + '结束当前会话';
} else if (element.type == 'Start_Conversation' ) {
const inviteMember = [];
// this.$emit('allowCreatCoversition');
if (element.communicationObject) {
if (element.communicationObject == 'ALL_STATION') {
inviteMember.push('所有车站');
} else if (element.communicationObject == 'ALL_TRAIN') {
inviteMember.push('所有司机');
}
} else {
element.conversationMemberIds.forEach(id=>{
if (element.memberId != id) {
inviteMember.push((this.memberList[id] || {label: ''}).label);
}
});
}
resultData = member.label + '创建会话,选择' + inviteMember.toString();
} else if (element.type == 'Command') {
const targetName = this.memberList[element.commandInitiateVO.targetMemberId];
const CommandList = {
Drive_Ahead:'确认运行至前方站',
Route_Block_Drive:'进路闭塞法行车',
Switch_Hook_Lock: '道岔钩锁',
Drive_Through_The_Red_Light:'越红灯行驶',
Drive_Through_The_Guide_Signal:'越引导信号行驶',
Open_Or_Close_Door:'开关门',
Set_Speed_Limit:'设置限速',
Turn_Direction: '换端',
Drive_To: '驾驶至',
Apply_URM_Mode: '转URM模式',
Apply_RM_Mode: '转RM模式',
Apply_CM_Mode: '转CM模式',
Apply_AM_Mode: '转AM模式'
};
resultData = member.label + '对【' + targetName.label + '】下达【' + CommandList[element.commandInitiateVO.commandType] + '】指令';
} else if (element.type == 'Drive') {
if (element.targetSectionCode) {
const section = this.$store.getters['map/getDeviceByCode'](element.targetSectionCode);
if (section && section.name) {
resultData = member.label + '把车开到区段' + section.name;
}
}
}
return resultData;
}
}
};
</script>
<style lang="scss" scoped>
.operationStatisticResult{
height: 500px;
overflow: auto;
&::-webkit-scrollbar {
width: 4px;
}
&::-webkit-scrollbar-thumb {
border-radius: 10px;
background: #c3c3c3;
}
&::-webkit-scrollbar-track {
border-radius: 0;
background: #f0f0f0;
}
}
.OSTitle{
padding: 10px 5px;
font-size: 15px;
font-weight: bold;
}
.OSTTable{
width:832px;
}
.OSTTable1,.OSTTable2{
width:832px;
}
.OSTTable3,.OSTTable4{
width:832px;
}
.OSTcompleted{
padding: 5px 5px;
font-size: 15px;
}
.OSTSignInfo{
padding: 15px 5px 10px 5px;
font-size: 15px;
font-weight: bold;
}
.OSTSignInfoTips{
padding: 10px 5px;
font-size: 15px;
}
.eachTag{
margin-left:10px;
}
</style>
<style lang="scss">
.OSResult .el-dialog__body{
padding: 10px 20px;
}
// .OSTTable3 .el-table__body-wrapper.is-scrolling-none {
// &::-webkit-scrollbar{
// width: 4px !important;
// }
// &::-webkit-scrollbar-thumb {
// border-radius: 10px;
// background: #c3c3c3;
// }
// &::-webkit-scrollbar-track {
// border-radius: 0;
// background: #f0f0f0;
// }
// }
</style>

618
src/views/newMap/displayNew/dispatherContest/theoryExam.vue
View File

@ -1,618 +0,0 @@
<template>
<el-dialog :visible.sync="dialogVisible" :close-on-click-modal="false" class="theoryExam" fullscreen style="background:#eeeeee" :before-close="close">
<div v-if="!isResult" v-loading="loading" class="theoryExamBody">
<div class="theoryExamBodyL">
<div class="theoryExamQuestion">
<div class="QuestionName">{{ covert() }}</div>
<div class="choiceList">
<div v-if="judgeQuestionType('radio',questionList[currentQuestionNum])">
<el-radio
v-for="(choice,index) in questionList[currentQuestionNum].optionList "
:key="index"
v-model="currentRadioAnswer"
:label="choice.id"
class="eachChoice"
@change="changeAnswer"
>{{ choiceTypeList[index]+'、 '+choice.content }}</el-radio>
</div>
<div v-else-if="judgeQuestionType('multi',questionList[currentQuestionNum])">
<el-checkbox-group v-model="currentSelectAnswer" @change="changeAnswer">
<el-checkbox
v-for="(choice,index) in questionList[currentQuestionNum].optionList "
:key="index"
:label="choice.id"
class="eachChoice"
>{{ choiceTypeList[index]+'、 '+choice.content }}</el-checkbox>
</el-checkbox-group>
</div>
</div>
<div v-if="!isTest&&isSelect" class="correctAnswer" :style="answerIsCorrect?'color: #67C23A;':'color: #ff4d4f;'">
<span class="practiceIconTips" :class="answerIsCorrect?'el-icon-success':'el-icon-error'" />
<span class="practicecorrectAnswer">{{ '答案：'+correctAnswer }}</span>
</div>
</div>
<div class="buttonList" :style="!isTest?'bottom: 15px;':''">
<el-button v-if="!isTest" :disabled="isSelect" type="success" class="commitQuestion" size="small" @click="commitQuestion">确 认</el-button>
<div class="prevAndNext">
<el-button-group>
<el-button type="primary" size="small" :disabled="currentQuestionNum==0" @click="prevQuestion"><span class="el-icon-arrow-left" style="margin-right:5px;" />上一题</el-button>
<el-button type="primary" size="small" :disabled="checkNextButton()" @click="nextQuestion">下一题<span class="el-icon-arrow-right" style="margin-left:5px;" /></el-button>
</el-button-group>
</div>
<el-button v-if="isTest" type="success" class="commitExam" size="small" @click="commitExam">交卷</el-button>
</div>
<div v-if="isTest" class="examTips">距离测试结束还有 {{ currentTime }}</div>
</div>
<div class="theoryExamBodyR">
<div v-if="mode=='test'" class="theoryExamBodyRT">
<span class="noAnswer">未作答</span>
<span class="hasAnswer">已作答</span>
<!-- <span class="hasSign">标记</span> -->
</div>
<div class="theoryExamQuestionList">
<!-- :class="item.answerOptionId.length>0?'hasSelect':''" -->
<div v-for="(item,index) in questionList" :id="'eachQuestionNum'+index" :key="index" class="eachQuestionNum" @click="changeQuestion(index+1)">
{{ (index+1) }}
</div>
</div>
</div>
</div>
<div v-else class="theoryExamBody">
<div v-if="theoryExamWrongList.length>0" class="theoryExamWrongList">
<div class="theoryExamScore">{{ '测验得分：' }}<span class="resultScoreStyle">{{ resultScore+' 分' }}</span></div>
<div class="theoryExamWrongListName">错题列表</div>
<div class="theoryExamWrongListL">
<div class="QuestionName">{{ covertWrong() }}</div>
<div class="choiceList">
<div v-if="judgeQuestionType('radio',theoryExamWrongList[wrongQuestionNum].question)">
<el-radio
v-for="(choice,index) in theoryExamWrongList[wrongQuestionNum].question.optionList "
:key="index"
v-model="currentRadioAnswer"
:label="choice.id"
:disabled="true"
class="eachChoice"
>{{ choiceTypeList[index]+'、 '+choice.content }}</el-radio>
</div>
<div v-else-if="judgeQuestionType('multi',theoryExamWrongList[wrongQuestionNum].question)">
<el-checkbox-group v-model="currentSelectAnswer">
<el-checkbox
v-for="(choice,index) in theoryExamWrongList[wrongQuestionNum].question.optionList"
:key="index"
:label="choice.id"
:disabled="true"
class="eachChoice"
>{{ choiceTypeList[index]+'、 '+choice.content }}</el-checkbox>
</el-checkbox-group>
</div>
</div>
<div class="correctAnswer" style="color: #ff4d4f;">
<span class="practicecorrectAnswer">{{ '答案：'+wrongCorrectAnswer() }}</span>
</div>
</div>
<div class="theoryExamWrongListR">
<div class="theoryExamWrongQuestionList">
<div v-for="(wrongQuestion,index) in theoryExamWrongList" :key="index" class="eachQuestionNum" :class="wrongQuestionNum==index?'active':''" @click="changeWrongQuestion(index)">
{{ index+1 }}
</div>
</div>
</div>
</div>
<div v-else>
<div class="el-icon-success theoryExamEnd" />
<div class="theoryExamScore1">{{ '测验得分：' }}<span class="resultScoreStyle">{{ resultScore+' 分' }}</span></div>
</div>
</div>
</el-dialog>
</template>
<script>
import {getItemListByProjectCode, updatePracticeQuestionProgress, getPracticeQuestionProgress, submitPracticeQuestionData} from '@/api/competition';
export default {
name:'TheoryExam',
data() {
return {
loading:false,
dialogVisible:false,
mode:'',
currentTime:'00:30:00',
allTime:30 * 60,
questionList:[],
inter:null,
currentQuestionNum:0,
wrongQuestionNum:0,
currentSelectAnswer:[],
currentRadioAnswer:'',
answerIsCorrect:false,
hasAnswerList:{},
correctAnswer:'',
isSelect:false,
isResult:false,
theoryExamWrongList:[],
resultScore:0,
choiceTypeList:['A', 'B', 'C', 'D', 'E', 'F', 'G']
};
},
computed:{
isTest() {
return this.mode == 'test';
}
},
methods:{
doShow({type}) {
this.isResult = false;
this.loading = true;
this.allTime = 30 * 60;
this.currentTime = '00:30:00';
this.isSelect = false;
this.questionList = [];
this.currentSelectAnswer = [];
this.currentRadioAnswer = '';
this.hasAnswerList = {};
let currentMode = '01';
if (type == 'practice') {
currentMode = '01';
} else if (type == 'test') {
currentMode = '02';
}
this.mode = type;
getItemListByProjectCode('DRTS', {mode:currentMode}).then(res=>{
this.questionList = res.data;
if (this.isTest) {
this.questionList.forEach((question, index)=>{
this.hasAnswerList[index] = {questionId:question.id, answerContents:[]};
});
}
if (this.mode == 'practice') {
getPracticeQuestionProgress('DRTS').then(res=>{
this.currentQuestionNum = res.data.questionIndex;
this.loading = false;
}).catch(error=>{
console.log(error.message);
});
} else {
this.initCurrentTime();
this.currentQuestionNum = 0;
this.wrongQuestionNum = 0;
this.loading = false;
}
});
this.dialogVisible = true;
},
close() {
this.dialogVisible = false;
clearInterval(this.inter);
},
covert() {
const typeList = {'judge':'判断', 'select':'选择', 'multi':'多选'};
const currentQuestion = this.questionList[this.currentQuestionNum];
if (currentQuestion) {
return '第 ' + (this.currentQuestionNum + 1) + ' 题、[' + typeList[currentQuestion.type] + '] ' + currentQuestion.topic + ' (' + currentQuestion.score + '分)';
}
return '';
},
initCurrentTime() {
this.inter = setInterval(() => {
if (this.allTime > 0) {
this.allTime--;
let seconds = this.allTime % 60;
let minutes = (this.allTime - this.allTime % 60) / 60;
minutes = minutes > 9 ? minutes : '0' + minutes;
seconds = seconds > 9 ? seconds : '0' + seconds;
this.currentTime = '00:' + minutes + ':' + seconds;
} else {
clearInterval(this.inter);
const submitData = Object.values(this.hasAnswerList);
this.submitConfirmExam(submitData);
}
}, 1000);
},
covertWrong() {
const typeList = {'judge':'判断', 'select':'选择', 'multi':'多选'};
const WrongQuestion = this.theoryExamWrongList[this.wrongQuestionNum];
if (WrongQuestion) {
return (this.wrongQuestionNum + 1) + '、[' + typeList[WrongQuestion.question.type] + '] ' + WrongQuestion.question.topic + ' (' + WrongQuestion.question.score + '分)';
}
return '';
},
changeQuestion(num) {
this.isSelect = false;
this.currentQuestionNum = num - 1;
this.checkCurrentData(this.currentQuestionNum);
},
changeWrongQuestion(num) {
this.wrongQuestionNum = num;
this.getWrongDataOption();
},
judgeQuestionType(type, currentQuestion) {
if (currentQuestion && type == 'radio') {
return currentQuestion.type == 'judge' || currentQuestion.type == 'select';
} else if (currentQuestion && type == 'multi') {
return currentQuestion.type == 'multi';
} else {
return false;
}
},
prevQuestion() {
if (this.currentQuestionNum > 0) {
this.currentQuestionNum -= 1;
this.isSelect = false;
this.checkCurrentData(this.currentQuestionNum);
}
},
nextQuestion() {
if (this.currentQuestionNum < this.questionList.length) {
this.currentQuestionNum += 1;
this.isSelect = false;
this.checkCurrentData(this.currentQuestionNum);
}
},
checkCurrentData(currentQuestionNum) {
if (this.hasAnswerList[currentQuestionNum]) {
const answerObj = this.hasAnswerList[currentQuestionNum].answerContents;
if (answerObj.length > 0) {
const question = this.questionList[currentQuestionNum];
if (question.type == 'judge' || question.type == 'select') {
this.currentRadioAnswer = answerObj[0].optionId;
} else {
const list = [];
answerObj.forEach(item => {
list.push(item.optionId);
});
this.currentSelectAnswer = list;
}
} else {
this.currentSelectAnswer = [];
this.currentRadioAnswer = '';
}
} else {
this.currentSelectAnswer = [];
this.currentRadioAnswer = '';
}
},
commitExam() {
const submitData = Object.values(this.hasAnswerList);
let submitWriteLength = 0;
submitData.forEach(each=>{
if (each.answerContents.length > 0) {
submitWriteLength++;
}
});
if (submitWriteLength < this.questionList.length) {
this.$confirm(`测试未完成，是否确认交卷?`, '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消'
}).then(() => {
this.submitConfirmExam(submitData);
});
} else {
this.submitConfirmExam(submitData);
}
},
submitConfirmExam(submitData) {
this.loading = true;
submitPracticeQuestionData('DRTS', {mode:'02', theoryAnswers:submitData}).then(res=>{
this.loading = false;
this.isResult = true;
this.$message.success('提交成功');
this.resultScore = 0;
this.theoryExamWrongList = [];
res.data.forEach(item => {
this.resultScore += (item.score || 0);
if (item.answerOptionId && item.answerOptionId.length && !item.score) {
this.theoryExamWrongList.push(item);
}
});
// const writeList = res.data.filter(wrong=>{
// return wrong.answerContents && wrong.answerContents.length > 0;
// });
// this.theoryExamWrongList = writeList.filter(wrong=>{
// return wrong.correct == false;
// });
// if (writeList.length > 0) {
// if (writeList.length >= 2) {
// this.resultScore = writeList.reduce((prev, cur, index, arr)=>{
// return prev.score == undefined ? prev + cur.score : prev.score + cur.score;
// });
// } else {
// this.resultScore = writeList[0].score;
// }
// } else {
// this.resultScore = 0;
// }
// if (this.theoryExamWrongList.length > 0) {
// this.getWrongDataOption();
// }
}).catch(()=>{
this.$message.error('提交失败，请稍后再试');
});
},
getWrongDataOption() {
const wrongList = this.theoryExamWrongList[this.wrongQuestionNum].answerOptionId;
if (wrongList.length > 1) {
this.currentSelectAnswer = wrongList;
} else {
this.currentRadioAnswer = wrongList[0];
}
},
wrongCorrectAnswer() {
let correctAnswer = '';
const wrongList = this.theoryExamWrongList[this.wrongQuestionNum].question.optionList;
wrongList.forEach((choice, index)=>{
if (choice.correct) {
correctAnswer += this.choiceTypeList[index] + '、' + choice.content + ' ';
}
});
return correctAnswer;
},
checkNextButton() {
if (this.questionList.length > 0) {
return this.currentQuestionNum == this.questionList.length - 1;
}
return true;
},
commitQuestion() {
if (this.mode == 'practice') {
const currentCorrectAnswer = [];
this.correctAnswer = '';
this.answerIsCorrect = false;
const question = this.questionList[this.currentQuestionNum];
if (question) {
const options = this.questionList[this.currentQuestionNum].optionList;
options.forEach((choice, index)=>{
if (choice.correct) {
this.correctAnswer += this.choiceTypeList[index] + '、' + choice.content + ' ';
currentCorrectAnswer.push(choice.id);
}
});
if (this.currentRadioAnswer) {
if (this.currentRadioAnswer == currentCorrectAnswer.toString()) {
this.answerIsCorrect = true;
} else {
this.answerIsCorrect = false;
}
}
if (this.currentSelectAnswer.length > 0) {
if (currentCorrectAnswer.toString() == this.currentSelectAnswer.sort().toString()) {
this.answerIsCorrect = true;
} else {
this.answerIsCorrect = false;
}
}
this.isSelect = true;
updatePracticeQuestionProgress('DRTS', {index:this.currentQuestionNum}).then(res=>{
}).catch(error=>{
console.log(error.message);
});
}
}
},
changeAnswer(data) {
if (this.isTest) {
let answerContents = [];
if (data instanceof Array) {
data.forEach(item => {
answerContents.push({optionId: item, answerContent: ''});
});
} else {
answerContents = [{optionId: data, answerContents: ''}];
}
this.hasAnswerList[this.currentQuestionNum].answerContents = answerContents;
document.querySelector('#eachQuestionNum' + this.currentQuestionNum).classList.add('hasSelect');
}
}
}
};
</script>
<style lang="scss" scoped>
.theoryExamBody{
width: 800px;
height: 460px;
border: 1px #ccc solid;
position: absolute;
left: 50%;
transform: translate(-50%,-50%);
border-radius: 6px;
top: 39%;
padding: 10px;
box-shadow: 0px 0px 10px #ccc;
background:#fff;
}
.theoryExamBodyL{
width: 500px;
display: inline-block;
float: left;
height: 100%;
position: relative;
}
.theoryExamQuestion{
padding: 5px 15px 0px 10px;
}
.theoryExamBodyR{
width: 277px;
display: inline-block;
height: 100%;
}
.theoryExamBodyRT{margin-top: 5px;margin-left: 25px;}
.theoryExamQuestionList{
margin-top: 10px;
height: 360px;
overflow:auto;
padding-left: 10px;
width: 256px;
}
.theoryExamWrongQuestionList{
height: 320px;
overflow:auto;
padding-left: 10px;
width: 256px;
border: 1px #ececec solid;
border-radius: 5px;
}
.eachQuestionNum{
color: #8f7f70;
border-radius: 4px;
border: 1px #cfcfcf solid;
display: inline-block;
width: 30px;
height: 30px;
text-align: center;
line-height: 28px;
margin-right: 25px;
margin-top: 10px;
cursor: pointer;
}
.noAnswer{
position: relative;
}
.hasAnswer,.hasSign{
position: relative;
margin-left: 25px;
}
.noAnswer::before{
content: '';
width: 10px;
height: 10px;
border-radius: 20px;
background: #fff;
border: 1px #606266 solid;
position: absolute;
left: -15px;
top: 4px;
}
.hasSign::before{
content: '';
width: 10px;
height: 10px;
border-radius: 20px;
background: #ff4d4f;
position: absolute;
left: -15px;
top: 4px;
}
.hasAnswer::before{
content: '';
width: 10px;
height: 10px;
border-radius: 20px;
background: #40a9ff;
position: absolute;
left: -15px;
top: 4px;
}
.QuestionName{
font-weight: bold;
line-height: 160%;
}
.choiceList{
margin-top:10px;
display: inline-block;
margin-left: 15px;
}
.eachChoice{
display: block;
margin-top: 15px;
}
.correctAnswer{
margin-top: 20px;
}
.buttonList{
position: absolute;
bottom: 30px;
left: 20px;
}
.prevAndNext{
float: left;
display: inline-block;
}
.commitExam{margin-left: 30px;}
.commitQuestion{
float: left;
margin-right: 200px;
}
.practiceIconTips{
font-size: 25px;
display: inline-block;
float: left;
margin-left:10px;
}
.practicecorrectAnswer{
vertical-align: top;
line-height: 131%;
display: inline-block;
width: 375px;
margin-left: 8px;
margin-top: 3px;
}
.hasSelect{
background: #409eff;
color: #fff;
}
.theoryExamScore{
margin-left: 20px;
margin-top: 10px;
font-size: 15px;
}
.theoryExamScore1{
text-align: center;
font-size: 17px;
margin-top: 20px;
}
.theoryExamEnd{
font-size: 90px;
color: #007b00;
margin-left: 340px;
margin-top: 115px;
}
.theoryExamWrongList{}
.theoryExamWrongListL{
width: 500px;
display: inline-block;
float: left;
height: 100%;
position: relative;
padding-left: 20px;
padding-right: 20px;
padding-top: 5px;
}
.theoryExamWrongListR{
width: 277px;
display: inline-block;
height: 100%;
}
.theoryExamWrongListName{
margin-left: 20px;
margin-top: 15px;
font-size: 15px;
font-weight: bold;
color: #ff3737;
margin-bottom: 5px;
}
.eachQuestionNum.active{
background: #67c23a;
color: #fff;
}
.resultScoreStyle{
color: #f00;
font-size: 17px;
}
.examTips{
position: absolute;
bottom: 5px;
left: 22px;
color:#000;
}
/deep/.el-dialog__headerbtn {
font-size: 25px;
}
/deep/.el-dialog__close {
color: #000;
}
</style>
<style lang="scss">
.theoryExam .el-dialog.is-fullscreen{
background:#eeeeee
}
</style>

49
src/views/newMap/displayNew/dispatherContest/theoryExamSelect.vue
View File

@ -1,49 +0,0 @@
<template>
<el-dialog
title="选择考试类型"
:visible.sync="dialogVisible"
:close-on-click-modal="false"
width="350px"
:before-do-close="close"
>
<div>
<el-form ref="ruleForm" :model="form" label-width="30px">
<el-form-item label="" prop="role">
<el-select v-model="form.type" style="width:260px">
<el-option label="练习模式" value="practice" />
<el-option label="测验模式" value="test" />
</el-select>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="close">{{ $t('global.cancel') }}</el-button>
<el-button type="primary" @click="confirm">{{ $t('global.confirm') }}</el-button>
</span>
</el-dialog>
</template>
<script>
export default {
name:'TheoryExamSelect',
data() {
return {
dialogVisible:false,
form:{
type:'practice'
}
};
},
methods:{
doShow() {
this.dialogVisible = true;
},
close() {
this.dialogVisible = false;
},
confirm() {
this.dialogVisible = false;
this.$emit('startTheoryExam', this.form);
}
}
};
</script>

431
src/views/newMap/displayNew/exam/index.vue
View File

@ -1,431 +0,0 @@
<template>
<div>
<div class="display-card" :style="{top: offset + 'px'}">
<el-row style="vertical-align:middle; ">
<span class="display-time">{{ formatUsedTime }}</span>
</el-row>
</div>
<div class="display-draft" :style="{bottom: offsetBottom + 'px'}">
<el-button-group>
<el-button type="success" :disabled="isDisable || dataError" :loading="startLoading" @click="start">{{ $t('display.startBtn') }}</el-button>
<el-button type="danger" :disabled="!isDisable || dataError" @click="end">{{ $t('display.endBtn') }}</el-button>
<el-button type="primary" class="back" @click="back">{{ $t('display.backBtn') }}</el-button>
</el-button-group>
</div>
<tip-exam-list :offset-bottom="offsetBottom" />
</div>
</template>
<script>
import TipExamList from './tipExamList';
import { Notification } from 'element-ui';
import { startTrainingNew } from '@/api/jmap/training';
import { timeFormat } from '@/utils/date';
import { refreshExamList, finishOneExamQuestion } from '@/api/management/userexam';
import { EventBus } from '@/scripts/event-bus';
export default {
name: 'MenuExam',
components: {
TipExamList
},
props: {
offset: {
type: Number,
required: true
},
offsetBottom: {
type: Number,
required: true
},
dataError: {
type: Boolean,
default() {
return false;
}
}
},
data() {
return {
isDisable: false,
startLoading: false,
locateDeviceCode:null,
training: {
id: '',
name: '',
remarks: ''
},
prdTypeMap: {
'01': '01', // 现地 => 现地
'02': '02', // 行调 => 行调
'04': '02', // 司机 => 行调
'05': '' // 派班 => null
}
};
},
computed: {
group() {
return this.$route.query.group;
},
formatUsedTime() {
return timeFormat(this.$store.state.training.usedTime);
}
},
watch: {
'$store.state.map.mapViewLoadedCount': function() {
// this.$store.dispatch('exam/countUsedTime');
this.locateDeviceCode && this.$store.dispatch('exam/setCenter', this.locateDeviceCode); // 设置考题对象居中
},
$route() {
// this.initData();
this.isDisable = false;
this.$store.dispatch('training/end', null);
this.$store.dispatch('training/reset');
this.$store.dispatch('menuOperation/setButtonOperation', null);
this.$store.dispatch('training/setStopCountTime');
this.$store.dispatch('training/setTrainingStart', false);
EventBus.$emit('viewLoading', false);
},
'$store.state.socket.simulationRoleList':function(list) {
if (list && list.length) {
this.checkRoleChange(list);
}
},
'$store.state.training.simulationUserList': function(val) {
const userInfo = this.$store.state.training.simulationUserList.find(user => user.userId == this.$store.state.user.id );
if (userInfo.type === 'STATION_SUPERVISOR') {
if (this.$store.state.map.map && this.$store.state.map.map.pictureList) {
const picture = this.$store.state.map.map.pictureList.find(picture => picture.stationCodes && picture.stationCodes.includes(userInfo.deviceCode) && picture.type === 'chainStation');
if (picture) {
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
const deviceList = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
deviceList.push(key);
}
this.$store.dispatch('map/setPictureDeviceMap', picture.deviceMap);
this.$jlmap.updatePicture(deviceList);
// this.$jlmap.updateTransform(picture.scaling, picture.origin);
this.$store.dispatch('map/setShowCentralizedStationCode', userInfo.deviceCode);
} else {
this.$store.dispatch('map/setShowCentralizedStationCode', userInfo.deviceCode);
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, userInfo.deviceCode);
}
} else {
this.$store.dispatch('map/setShowCentralizedStationCode', userInfo.deviceCode);
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, userInfo.deviceCode);
}
}
}
},
// mounted() {
// this.initDate();
// },
methods: {
tipInfo(opt) {
if (opt && opt.hasOwnProperty('color') && opt.hasOwnProperty('message')) {
const h = this.$createElement;
this.$notify({
title: this.$t('global.tips'),
message: h('i', { style: 'color:' + opt.color }, this.$t('display.exam.startTestOperateTip'))
});
}
},
start() {
this.$store.dispatch('menuOperation/setButtonOperation', null);
this.startLoading = true;
if (this.$route.query.trainingId) {
this.isDisable = true;
startTrainingNew({ id: this.$route.query.trainingId }, this.group).then(response => {
this.$store.dispatch('training/setTrainingStart', true);
this.$store.dispatch('training/examModeStart');
this.$store.dispatch('exam/start');
this.$store.dispatch('map/clearJlmapTrainView').then(() => {
this.$store.dispatch('training/emitTipFresh');
this.$store.dispatch('training/countTime', 'Lesson'); // 开始计时
});
this.startLoading = false;
}).catch(() => {
this.isDisable = false;
this.startLoading = false;
});
} else {
this.startLoading = true;
this.$messageBox(this.$t('display.exam.selectTest'));
}
},
end() {
if (this.$route.query.trainingId) {
this.isDisable = false;
if (this.$store.state.exam.started) {
const model = {
id: this.$route.query.examQuestionId,
usedTime: this.$store.state.training.usedTime,
group: this.group
};
this.$store.dispatch('training/end', null);
this.$store.dispatch('exam/over');
finishOneExamQuestion(model).then(response => {
this.$store.dispatch('training/setStopCountTime');
this.$store.dispatch('training/emitTipFresh');
this.init();
}).catch(() => {
this.$store.dispatch('training/emitTipFresh');
this.$messageBox(this.$t('display.exam.endTrainingError'));
});
} else {
this.isDisable = true;
this.$messageBox(this.$t('display.exam.startTestTip'));
}
}
},
back() {
this.$confirm(this.$t('display.exam.endTestTip'), this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
cancelButtonText: this.$t('global.cancel'),
type: 'warning'
}).then(() => {
if (this.$route.query.noPreLogout) {
this.$router.replace({path: `/device/exam/${this.$route.query.examId}`, query: {mapId: this.$route.query.mapId, noPreLogout: this.$route.query.noPreLogout}});
} else {
this.$router.go(-1);
}
Notification.closeAll();
}).catch(() => {
});
},
init() {
// 刷新考试列表
refreshExamList(this.$route.query.userExamId).then(response => {
this.$store.dispatch('exam/setUsedTime', response.data.usedTime);
this.$store.dispatch('exam/setTotalTime', response.data.duration);
this.$store.dispatch('trainingList/setTrainingList', response.data.userExamQuestionsVOs).then(response => { });
}).catch(error => {
// 如果时50009则表示考试已完成，不能再次进行y
if (error.code === 500009) {
this.$router.replace({ path: `/trainingPlatform/result/${this.$route.params.userExamId}`, query: { subSystem: this.$route.query.subSystem, mapId:this.$route.query.mapId } });
} else {
this.$messageBox(this.$t('display.exam.refreshListError'));
}
});
},
// refresh() {
// this.isDisable = false;
// this.$store.dispatch('training/end', null);
// },
// // 课程和考试系统
// async initData() {
// if (parseInt(this.$route.query.trainingId)) {
// const resp = await getTrainingDetailNew(this.$route.query.trainingId);
// if (resp && resp.code == 200) {
// const detail = resp.data;
// this.locateDeviceCode = resp.data.locateDeviceCode;
// debugger;
// await this.$store.dispatch('training/setPrdType', this.prdTypeMap[detail.prdType]);
// await this.$store.dispatch('training/setTrainingData', detail); // 设置实训信息
// } else {
// this.$messageBox(`获取实训步骤数据失败`);
// this.endViewLoading();
// }
// } else {
// this.endViewLoading();
// }
// },
// 结束加载状态
endViewLoading(isSuccess) {
if (!isSuccess) {
this.$store.dispatch('map/mapClear');
}
},
checkRoleChange(list) {
list.forEach(item => {
if (item.messageType === 'PLAY_CHANGE' && item.userId == this.$store.state.user.id && item.type === 'STATION_SUPERVISOR') {
if (this.$store.state.map.map && this.$store.state.map.map.pictureList) {
const picture = this.$store.state.map.map.pictureList.find(picture => picture.stationCodes && picture.stationCodes.includes(item.deviceCode) && picture.type === 'chainStation');
if (picture) {
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
const deviceList = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
deviceList.push(key);
}
this.$store.dispatch('map/setPictureDeviceMap', picture.deviceMap);
this.$jlmap.updatePicture(deviceList);
// this.$jlmap.updateTransform(picture.scaling, picture.origin);
this.$store.dispatch('map/setShowCentralizedStationCode', item.deviceCode);
} else {
this.$store.dispatch('map/setShowCentralizedStationCode', item.deviceCode);
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, item.deviceCode);
}
} else {
this.$store.dispatch('map/setShowCentralizedStationCode', item.deviceCode);
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, item.deviceCode);
}
this.$jlmap.setCenter(item.deviceCode);
}
});
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.display-card {
z-index: 9;
display: inline;
position: absolute;
left: 10px;
}
.display-time {
background-color: white;
display: -moz-inline-box;
display: inline-block;
border: 1px solid lightskyblue;
width: 100px;
height: 32px;
line-height: 32px;
border-radius: 4px;
text-align: center;
font-family: "Microsoft" !important;
font-size: 18px !important;
font-weight: bold;
color: black;
}
.display-draft {
position: absolute;
float: right;
right: 15px;
bottom: 15px;
.back {
z-index: 100000;
}
}
.tip-body-box {
position: relative;
height: 430px;
}
.reminder-box {
position: absolute;
float: left;
left: 15px;
bottom: 15px;
width: 650px;
height: 470px;
background-color: #fff;
border-radius: 5px;
overflow: hidden;
z-index: 500;
/* transition: height 0.5s; */
font-size: 18px;
.tip-title {
width: 100%;
overflow: hidden;
height: 40px;
display: flex;
align-items: center;
flex-direction: row-reverse;
background-color: #409EFF;
cursor: move;
border-radius: 5px 5px 0 0;
justify-content: space-between;
padding: 0 10px;
}
.drag-right,
.drag-left {
width: 10px;
cursor: e-resize;
background-color: yellow;
height: 100%;
position: absolute;
right: 0;
top: 0;
opacity: 0;
}
.drag-left {
left: 0;
}
.drag-bottom {
position: absolute;
bottom: 0;
width: 100%;
height: 10px;
cursor: s-resize;
background-color: yellow;
opacity: 0;
}
.tip-body {
height: 366px;
padding: 10px;
}
.tip-foot {
width: 100%;
margin-right: 10px;
position: absolute;
right: 0px;
bottom: 0px;
background-color: #fff;
padding: 10px 0;
display: flex;
align-items: center;
flex-direction: row-reverse;
.btn {
margin-right: 10px;
}
}
.icon {
float: right;
margin-right: 10px;
cursor: pointer;
background-color: #d2d2d2;
border-radius: 50%;
}
/deep/ {
.el-tree-node__content {
margin-bottom: 4px;
}
.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
background-color: #d6e5f7;
}
}
}
</style>

477
src/views/newMap/displayNew/exam/tipExamList.vue
View File

@ -1,477 +0,0 @@
<template>
<div v-quickMenuDrag class="reminder-drag" :style="{bottom: offsetBottom + 'px'}">
<div ref="drapBox" class="reminder-box">
<div class="tip-title">
<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 class="time-label">{{ $t('display.exam.examTime') }}</span>
<span class="time-elem">{{ formatRemainTime }}</span>
</p>
<p v-if="isShrink" style="color: #fff;">
<span>{{ examName }}</span>
</p>
</div>
<div v-if="isShrink" class="reminder-box-content">
<div class="zhezhao" />
<div ref="dragBody" class="tip-body-box">
<div v-show="detailShow" class="tip-body">
<el-scrollbar wrap-class="scrollbar-wrapper">
<el-tree
ref="treeQuestion"
style="background:rgba(0,0,0,0)"
:data="trainingList"
node-key="id"
highlight-current
@node-click="getTrainDetail"
>
<span slot-scope="{ data }">
<span :style="{color: data.usedTime !== undefined ? 'green':''}">&nbsp;{{ trainingList.indexOf(data)+1 }}.{{
data.trainingName }}
</span>
</span>
</el-tree>
</el-scrollbar>
</div>
<div v-show="!detailShow" class="tip-body">
<el-scrollbar wrap-class="scrollbar-wrapper">
<p class="list-item">
<span class="list-label">{{ $t('display.exam.questionTitle') }}</span>
<span class="list-elem">{{ courseModel.name }}</span>
</p>
<!-- <p class="list-item">-->
<!-- <span class="list-label">{{ $t('display.exam.bestTime') }}</span>-->
<!-- <span class="list-elem">{{ courseModel.minDuration }} {{ $t('display.seconds') }} </span>-->
<!-- </p>-->
<!-- <p class="list-item">-->
<!-- <span class="list-label">{{ $t('display.exam.maximumTime') }}</span>-->
<!-- <span class="list-elem">{{ courseModel.maxDuration }} {{ $t('display.seconds') }} </span>-->
<!-- </p>-->
<p class="list-item">
<span class="list-label"> {{ $t('display.exam.trainingInstructions') }}</span>
<span class="list-elem">{{ courseModel.remarks }}</span>
</p>
</el-scrollbar>
</div>
<div class="tip-foot">
<div v-show="!detailShow" class="foot-detail">
<el-button class="btn" @click="backList">{{ $t('display.exam.viewQuestions') }}</el-button>
<el-button v-if="!isFirst" class="btn" type="primary" @click="lastExam">{{ $t('display.exam.prev') }}</el-button>
<el-button v-if="!isLast" class="btn" type="primary" @click="nextExam">{{ $t('display.exam.next') }}</el-button>
<el-button v-if="isLast" class="btn" type="primary" @click="overExam">{{ $t('display.exam.submitExaminationPaper') }}</el-button>
</div>
<div v-show="detailShow" class="foot-submit">
<el-button class="btn" type="primary" @click="overExam">{{ $t('display.exam.submitExaminationPaper') }}</el-button>
</div>
<p style="color: #000; float: left;">
<span class="time-label">{{ $t('display.exam.examTime') }}</span>
<span class="time-elem">{{ formatRemainTime }}</span>
</p>
</div>
<div class="drag-right" />
<div class="drag-left" />
<div class="drag-bottom" />
<div class="drag-top" />
</div>
</div>
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex';
import { timeFormat } from '@/utils/date';
import { refreshExamList } from '@/api/management/userexam';
// import { getTrainingDetailNew } from '@/api/jmap/training';
import { loadTrainingInSimulation } from '@/api/jmap/training';
export default {
name: 'TipExamList',
components: {
},
props: {
offsetBottom: {
type: Number,
required: true
}
},
data() {
return {
training: {
id: '',
name: '',
remarks: ''
},
isShrink: true,
examName: '',
courseModel: {
id: '',
name: '',
maxDuration: '',
minDuration: '',
remarks: '',
updateTime: ''
},
detailShow: false,
examIndex: 0,
scanInter:null,
prdTypeMap: {
'01': '01', // 现地 => 现地
'02': '02', // 行调 => 行调
'04': '02', // 司机 => 行调
'05': '' // 派班 => null
}
};
},
computed: {
...mapGetters('trainingList', [
'trainingList'
]),
remainTime() {
return this.$store.state.exam.totalTime - this.$store.state.exam.usedTime;
},
formatRemainTime() {
return this.remainTime >= 0 ? timeFormat(this.remainTime) : '';
},
isFirst() {
return this.examIndex == 0;
},
isLast() {
return this.examIndex == this.trainingList.length - 1;
},
group() {
return this.$route.query.group;
}
},
watch: {
'$store.state.map.mapViewLoadedCount': function() { // 地图视图加载完成标识
this.$store.dispatch('exam/stopCountTime');
this.loadInitData();
this.$store.dispatch('exam/countUsedTime');
}
},
beforeDestroy() {
this.$store.dispatch('exam/stopCountTime');
this.clearScanCommit();
},
methods: {
backList() {
this.detailShow = true;
this.$nextTick(() => {
this.$refs.treeQuestion.setCurrentKey(this.$route.query.examQuestionId); // value 绑定的node-key
});
},
// 获取试题详情
selectedTraining(obj, type = null) {
this.trainingList.forEach((item, index) => {
if (item.id == obj.id) {
this.examIndex = index;
return;
}
});
if (obj) {
loadTrainingInSimulation(this.group, obj.trainingId).then(resp => {
// getTrainingDetailNew(obj.trainingId).then(resp => {
this.courseModel = {
id: resp.data.id,
name: resp.data.name,
maxDuration: resp.data.maxDuration,
remarks: resp.data.remarks,
minDuration: resp.data.minDuration,
updateTime: resp.data.updateTime
};
this.$store.dispatch('training/setPrdType', this.prdTypeMap[resp.data.prdType]);
this.$store.dispatch('exam/setCenter', resp.data.locateDeviceCode);
this.$store.dispatch('training/setTrainingData', resp.data); // 设置实训信息
}).catch(error => {
this.$message.error(this.$t('display.exam.getTestInformation') + ':' + error.message);
});
}
this.jump(obj);
},
getTrainDetail(obj) {
this.selectedTraining(obj);
this.detailShow = false;
},
// 获取试题列表
async loadInitData() {
// 刷新考试列表
refreshExamList(this.$route.query.userExamId).then(response => {
this.examName = response.data.examName;
this.$store.commit('exam/setUsedTime', response.data.usedTime);
this.$store.commit('exam/setTotalTime', response.data.duration);
this.$store.commit('trainingList/setTrainingList', response.data.userExamQuestionsVOs);
const obj = {
trainingId: '',
id: ''
};
if (this.$route.query.examQuestionId && this.$route.query.trainingId) {
obj.trainingId = this.$route.query.trainingId;
obj.id = this.$route.query.examQuestionId;
} else {
obj.trainingId = response.data.userExamQuestionsVOs[0].trainingId;
obj.id = response.data.userExamQuestionsVOs[0].id;
}
this.selectedTraining(obj, 'first');
this.scanCommit();
}).catch(error => {
// 如果时50009则表示考试已完成，不能再次进行y
if (error.code === 500009) {
if (this.$route.query.subSystem) {
this.$router.replace({ path: `/trainingPlatform/result/${this.$route.query.userExamId}`, query: { subSystem: this.$route.query.subSystem, mapId:this.$route.query.mapId } });
} else {
this.$router.replace({ path: `/device/result/${this.$route.query.userExamId}`, query: { mapId:this.$route.query.mapId, noPreLogout: this.$route.query.noPreLogout } });
}
} else {
this.$messageBox(this.$t('display.exam.refreshListError'));
}
});
},
scanCommit() {
this.clearScanCommit();
this.scanInter = setInterval(()=>{
if (this.remainTime < 0) {
this.$message.success(this.$t('display.exam.autoSubmit'));
this.clearScanCommit();
this.submit();
}
}, 1000);
},
clearScanCommit() {
clearInterval(this.scanInter);
this.scanInter = null;
},
nextExam() {
const obj = {
trainingId: '',
id: ''
};
if (this.trainingList[this.examIndex + 1] && this.trainingList[this.examIndex + 1].trainingId) {
obj.trainingId = this.trainingList[this.examIndex + 1].trainingId;
obj.id = this.trainingList[this.examIndex + 1].id;
this.examIndex = this.examIndex + 1;
}
if (obj.trainingId && obj.id) {
this.selectedTraining(obj);
}
},
lastExam() {
const obj = {
trainingId: '',
id: ''
};
if (this.trainingList[this.examIndex - 1] && this.trainingList[this.examIndex - 1].trainingId) {
obj.trainingId = this.trainingList[this.examIndex - 1].trainingId;
obj.id = this.trainingList[this.examIndex - 1].id;
this.examIndex = this.examIndex - 1;
}
if (obj.trainingId && obj.id) {
this.selectedTraining(obj);
}
},
jump(obj) {
const query = {
group: this.$route.query.group,
userExamId: this.$route.query.userExamId,
trainingId: obj.trainingId,
examQuestionId: obj.id,
subSystem: this.$route.query.subSystem,
examId: this.$route.query.examId,
mapId: this.$route.query.mapId,
lineCode: this.$route.query.lineCode,
noPreLogout: this.$route.query.noPreLogout
};
this.$router.replace({query: query});
// this.$emit('refresh');
},
overExam() {
this.$store.dispatch('exam/isOver').then(isOver => {
if (isOver) {
this.submit();
} else {
this.$confirm(this.$t('display.exam.cancleExam'), this.$t('global.tips'), {
cancelButtonText: this.$t('global.cancel'),
confirmButtonText: this.$t('global.confirm'),
type: 'warning',
center: true
}).then(() => {
this.submit();
}).catch(() => {
});
}
});
},
submit() {
this.$store.dispatch('exam/over').then(() => {
this.$store.dispatch('trainingList/clearTrainingList');
if (this.$route.query.subSystem) {
this.$router.replace({ path: `/trainingPlatform/result/${this.$route.query.userExamId}`, query: { subSystem: this.$route.query.subSystem, mapId:this.$route.query.mapId } });
} else {
this.$router.replace({ path: `/device/result/${this.$route.query.userExamId}`, query: { mapId:this.$route.query.mapId, noPreLogout: this.$route.query.noPreLogout } });
}
});
},
shrink() {
// const height = this.$refs.dragBody.offsetHeight + 40;
// const top = this.$refs.drapBox.style.top;
if (this.isShrink) {
// this.$refs.drapBox.style.height = '40px';
// this.$refs.drapBox.style.top = '';
this.isShrink = false;
} else {
// this.$refs.drapBox.style.height = height + 'px';
// this.$refs.drapBox.style.top = top;
this.isShrink = true;
this.$nextTick(()=>{
const dragDom = document.querySelector('.reminder-drag').style.bottom;
if (document.body.clientHeight - 470 - parseInt(dragDom.replace('px', '')) < 0) {
document.querySelector('.reminder-drag').style.bottom = `${document.body.clientHeight - 470}px`;
}
});
}
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.reminder-drag{
position: absolute;
bottom: 0px;
left: 15px;
z-index: 10;
}
.tip-body-box {
position: relative;
height: 430px;
position: absolute;
left: 0;
top: 0;
width: 100%;
}
.zhezhao{
width: 100%;
height: 100%;
filter: blur(8px);
background: rgba(255,255,255,0.9);
}
.reminder-box-content{
width: 500px;
height: 430px;
left: 0;
top: 0;
z-index: 2;
background: rgba(255,255,255,0.8);
position: relative;
}
.reminder-box {
border-radius: 5px;
overflow: hidden;
z-index: 10;
font-size: 18px;
.tip-title {
width: 500px;
overflow: hidden;
height: 40px;
display: flex;
align-items: center;
flex-direction: row-reverse;
background-color: #409EFF;
border-radius: 5px 5px 0 0;
justify-content: space-between;
padding: 0 10px;
}
.drag-right,
.drag-left {
width: 10px;
cursor: e-resize;
background-color: yellow;
height: 100%;
position: absolute;
right: 0;
top: 0;
opacity: 0;
}
.drag-left {
left: 0;
}
.drag-bottom {
position: absolute;
bottom: 0;
width: 100%;
height: 10px;
cursor: s-resize;
background-color: yellow;
opacity: 0;
}
.drag-top {
position: absolute;
top: -45px;
left: 0;
width: 100%;
height: 10px;
cursor: s-resize;
background-color: yellow;
opacity: 0;
}
.tip-body {
height: 370px;
padding: 10px;
.list-label {
width: 105px;
}
}
.tip-foot {
width: 100%;
position: absolute;
right: 0px;
bottom: 0px;
padding: 10px 0 10px 10px;
.foot-detail {
height: 100%;
float: right;
margin-top: 9px;
padding-right: 15px;
}
.foot-submit {
float: right;
margin-top: 9px;
padding-right: 15px;
}
}
.icon {
float: right;
margin-right: 10px;
cursor: pointer;
background-color: #f3f3f3;
border-radius: 50%;
}
/deep/ {
.el-tree-node__content {
margin-bottom: 4px;
}
.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
background-color: #d6e5f7;
}
}
}
</style>

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

@ -1,360 +0,0 @@
<template>
<div class="main" :style="{width: canvasWidth+'px'}">
<template>
<transition name="el-zoom-in-bottom">
<map-system-draft v-show="!specialDispatch" ref="mapCanvas" @back="back" />
</transition>
<menu-demon v-if="isDemon" ref="menuDemon" :offset="offset" :offset-bottom="offsetBottom" :data-error="dataError" :text-status-height="textStatusHeight" @start="start" @end="end" @changeShowMap="changeShowMap"/>
<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-script v-if="isScript" ref="menuScript" :offset-bottom="offsetBottom" :offset="offset" :text-status-height="textStatusHeight" :data-error="dataError" @start="start" @end="end" @changeShowMap="changeShowMap" />
<menu-dispather-contest v-if="isContest" ref="menuDispatherContest" :offset="offset" :offset-bottom="offsetBottom" :data-error="dataError" :text-status-height="textStatusHeight" @start="start" @end="end" />
<div v-if="lineCode === '16'" v-show="prdType === '02'&& !showMap" style="position:absolute;width: 100%;top:0;left:0;">
<!-- && (isScript || isDemon) -->
<dispatcher-station ref="dispatcherStation" @changeShowMap="changeShowMap" />
</div>
</template>
<menu-train-list v-if="isDemon||isContest||isScript" />
<menu-system-time v-if="lineCode !== '16'&&lineCode !== '19'" ref="menuSystemTime" :offset="offset" :group="group" />
</div>
</template>
<script>
import { getSessionStorage } from '@/utils/auth';
import { mapGetters } from 'vuex';
import { OperateMode } from '@/scripts/ConstDic';
import MapSystemDraft from '@/views/newMap/mapsystemNew/index';
import MenuLesson from './lesson/index';
import MenuDemon from './menuDemon';
import MenuExam from './exam/index';
import MenuScript from './scriptDisplay/scriptRecord/index';
import MenuDispatherContest from './dispatherContest/index';
import MenuTrainList from '@/views/newMap/displayNew/menuTrainList';
import MenuSystemTime from '@/views/newMap/displayNew/menuSystemTime';
import { clearSimulation, getSimulationInfoNew, ranAsPlan, exitRunPlan } from '@/api/simulation';
import { loadMapDataById } from '@/utils/loaddata';
// import DispatcherStation from '../jointTrainingNew/dispatcherStation';
import { EventBus } from '@/scripts/event-bus';
export default {
name: 'DisplayDraft',
components: {
MapSystemDraft,
MenuDemon,
MenuExam,
MenuLesson,
MenuSystemTime,
MenuTrainList,
MenuDispatherContest,
MenuScript,
DispatcherStation
},
data() {
return {
offset: 15,
offsetBottom: 15,
tipBottom: 0,
textStatusHeight: 0,
planRunning:false,
dataError: false,
group:'',
showMap: false
};
},
computed:{
...mapGetters([
'canvasWidth'
]),
mode() {
return this.$route.params.mode;
},
project() {
return getSessionStorage('project');
},
isDemon() {
return this.mode === 'demon' && !(this.project.includes('drts') || this.$route.query.thirdDrts);
},
isContest() {
return this.mode === 'demon' && (this.project.includes('drts') || this.$route.query.thirdDrts);
},
isExam() {
return this.mode === 'exam';
},
isLesson() {
return (this.mode === 'teach' || this.mode === 'manage');
},
isScript() {
return this.mode === 'script';
},
mapId() {
return this.$route.query.mapId;
},
width() {
return this.$store.state.app.width;
},
height() {
return this.$store.state.app.height;
},
prdType() {
return this.$store.state.training.prdType;
},
lineCode() {
return this.$route.query.lineCode;
},
specialDispatch() {
return (this.lineCode === '14' && this.$store.state.training.prdType === '02') || (this.lineCode === '16' && this.$store.state.training.prdType === '02' && !this.showMap);
}
},
watch:{
'$store.state.socket.permissionOver': function () {
this.$alert('用户权限已被收回', '提示', {
confirmButtonText: '确定',
callback: action => {
this.back();
}
});
},
// 此处代码似乎没什么用，之前从menuSchema复制过来的
// '$store.state.training.prdType':function(val) {
// if (val == '01') { this.switchModeInner('01'); } else { this.switchModeInner('02'); }
// },
'$store.state.config.menuBarLoadedCount': function (val) { // menuBar加载完成
this.setPosition();
},
'$store.state.app.windowSizeCount': function() { // 窗口缩放
this.setWindowSize();
},
'$store.state.training.prdType': function (val) { // 根据权限类型计算高度
this.setPosition();
},
'$store.state.map.mapViewLoadedCount': function (val) { // 地图视图加载完成标识 开始加载默认状态
if (this.planRunning) {
this.$store.dispatch('training/simulationStart');
}
},
$route() {
if (!this.isLesson && !this.isExam) {
this.initLoadData();
}
}
},
beforeDestroy() {
clearSimulation(this.group);
this.$store.dispatch('training/setSimulationUserList', []);
this.$store.dispatch('training/setUserRole', '');
this.$store.dispatch('training/reset');
// this.$store.dispatch('map/mapClear');
},
async mounted() {
this.setWindowSize();
this.initLoadData();
},
methods:{
// 结束加载状态
endViewLoading(isSuccess) {
if (!isSuccess) {
this.$store.dispatch('map/mapClear');
}
this.$nextTick(() => {
EventBus.$emit('viewLoading', false);
});
},
// 仿真错误时，被动退出时调用
async back() {
if (this.isExam) {
await this.$refs.menuExam.back();
} else if (this.isLesson) {
await this.$refs.lessonMenu.back();
} else if (this.isDemon) {
await this.$refs.menuDemon.back();
} else if (this.isScript) {
await this.$refs.menuScript.back();
} else if (this.isContest) {
await this.$refs.menuDispatherContest.back();
}
},
// 设置各个按钮的定位
setPosition() {
this.$nextTick(() => {
this.offset = 10;
this.offsetBottom = 15;
const menuBar = document.getElementById('menuBar');
const menuTool = document.getElementById('menuTool');
const menuBottom = document.getElementById('menuButton');
const menuButtonsBox = document.getElementById('menuButtons_box');
const textStatus = document.getElementById('textStatus');
if (menuBar) {
this.offset = (menuBar.offsetHeight || 0) + 15;
}
if (menuTool) {
this.offset = (menuTool.offsetHeight || 0) + 15;
}
const buttonWidth = this.width - 1200; // B box widht
if (menuBottom && buttonWidth < 780) {
this.offsetBottom = (menuBottom.offsetHeight || 0) + 15;
}
if (menuButtonsBox) {
this.tipBottom = (menuButtonsBox.offsetHeight || 0) + 15;
}
if (textStatus) {
this.textStatusHeight = textStatus.offsetHeight || 0;
textStatus.style.top = this.offset - 15 + 'px';
}
if (this.$route.query.ctc) {
this.offset = 65;
this.offsetBottom = 2;
}
});
},
// 缩放设置
setWindowSize() {
const width = this.width;
const height = this.height;
this.$store.dispatch('config/resize', { width, height });
// this.$store.dispatch('training/updateOffsetStationCode', { offsetStationCode: this.offsetStationCode });
},
// 初始化
initLoadData() {
this.group = this.$route.query.group;
this.$store.dispatch('training/reset');
this.loadSimulationInfo();
},
// 新版地图根据仿真group获取仿真基础信息
async loadSimulationInfo() {
const resp = await getSimulationInfoNew(this.group);
if (resp && resp.code == 200 && resp.data) {
if (!resp.data.dataError) {
this.$store.dispatch('scriptRecord/updateSimulationPause', resp.data.pause); // 是否暂停判断
this.$store.dispatch('training/setInitTime', resp.data.systemTime);
// this.$store.dispatch('training/countTime');
if (resp.data.prodType === '03') {
this.$store.dispatch('training/setPrdType', this.$route.query.prdType);
} else {
this.$store.dispatch('training/setPrdType', resp.data.prodType);
}
this.$store.dispatch('runPlan/setRunPlanInfo', resp.data.runPlan);
this.planRunning = resp.data.planRunning;
if (resp.data.planRunning) {
this.$store.commit('training/start');
}
if (this.isScript) {
this.$store.dispatch('training/setPrdType', '02');
}
this.loadMapData();
} else {
this.$messageBox('此地图数据正在维护中,无法运行！');
}
this.dataError = resp.data.dataError;
}
},
// 通过showMode切换显示效果 11
// switchModeInner(swch) {
// let showMode = '03';
// if (swch == '01') {
// showMode = '03';
// } else if (swch == '02') {
// showMode = '02';
// }
//
// const list = [];
// const mapDevice = this.$store.state.map.mapDevice;
// for (const key in mapDevice) {
// list.push(mapDevice[key]);
// }
//
// if (swch == '01') {
// this.$jlmap.updateShowStation(list, this.$store.state.training.centerStationCode); // 显示全部元素
// } else {
// this.$jlmap.updateShowStation(list, ''); // 显示全部元素
// }
//
// this.$jlmap.updateShowMode(list, showMode); // 二次过滤
// },
// 加载地图数据
loadMapData() {
if (parseInt(this.mapId)) {
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); // 默认为正常模式
loadMapDataById(this.mapId, 'simulation');
} else {
this.endViewLoading();
}
},
start(model) { // 开始仿真
const data = {
time: model.initTime
};
if (this.$route.query.prdType === '04') {
data.loadNumber = model.loadNum;
}
ranAsPlan(data, this.group).then(res => {
// this.$store.dispatch('training/setInitTime', model.initTime);
this.$store.dispatch('training/setInitTime', model.timestamp);
}).catch(error => {
let message = '';
switch (error.code) {
case '5001':
message = this.$t('error.mapDataError');
break;
case '5002':
message = this.$t('error.runningChartDataError');
break;
case '5003':
message = this.$t('error.runningChartIsNotLoaded');
break;
case '5004':
message = this.$t('error.runningDataError');
break;
case '5000':
message = this.$t('error.systemError');
break;
case '4000':
message = this.$t('error.simulationDoesNotExist');
break;
case '4001':
message = this.$t('error.simulationOperationIsNotDefined');
break;
case '4002':
message = this.$t('error.simulationOperationProcessingMethodNotFound');
break;
case '4003':
message = this.$t('error.simulationOperationFailed');
break;
case '4004':
message = this.$t('error.operationConflict');
break;
default:
message = '按计划行车异常,请退出重试!';
// this.$messageBox('按计划行车异常,请退出重试!');
break;
}
this.$messageBox(message + '，' + this.$t('error.startSimulationFailed'));
});
},
end() {
exitRunPlan(this.group).then(() => {
this.$store.dispatch('training/over').then(() => {
this.$store.dispatch('training/setMapDefaultState').then(() => {
this.$store.dispatch('map/clearJlmapTrainView');
this.$store.dispatch('map/resetActiveTrainList', false);
this.$store.dispatch('map/setTrainWindowShow', false);
});
});
}).catch(() => {
this.$messageBox(this.$t('display.demon.endSimulationFail'));
});
},
changeShowMap(flag) {
this.showMap = flag;
}
}
};
</script>
<style scoped lang="scss" rel="stylesheep/scss">
.main {
display: block;
width: 100% !important;
height: 100%;
overflow: hidden;
position: relative;
background: #000000;
}
</style>

158
src/views/newMap/displayNew/lesson/LeftSlider.vue
View File

@ -1,158 +0,0 @@
<template>
<div id="leftSlider" class="left-slider">
<div class="tip-title">
<span>
{{ $t('display.lesson.coursePracticeList') }}
</span>
</div>
<div class="handleShow">
<!-- {{ $t('display.lesson.unfold') }} -->
<span v-if="show" class="el-icon-arrow-right" style="cursor:pointer" @click="handleSliderShow(true)">实训列表</span>
<!-- {{ $t('display.lesson.fold') }} -->
<span v-else class="el-icon-arrow-left" style="cursor:pointer" @click="handleSliderShow(false)">实训列表</span>
</div>
<div class="slider-tree">
<el-scrollbar wrap-class="scrollbar-wrapper" style="background: #fff;">
<el-tree
ref="tree"
style="margin-top: 10px"
:data="treeList"
node-key="id"
:props="defaultProps"
highlight-current
:span="22"
default-expand-all
@node-click="clickEvent"
>
<span slot-scope="{ node }">
<span v-if="node.data.type === 'Training'" class="el-icon-goods" />
<span v-if="node.data.id === trainingId" :style="{color: 'red'}">&nbsp;{{ node.data.name }}</span>
<span v-else-if="node.data.valid" :style="{color: 'green'}">&nbsp;{{ node.data.name }}</span>
<span v-else>&nbsp;{{ node.data.name }}</span>
</span>
</el-tree>
</el-scrollbar>
</div>
</div>
</template>
<script>
import { getPublishLessonTree } from '@/api/jmap/lesson';
// import { trainingNotifyNew } from '@/api/simulation';
import { launchFullscreen } from '@/utils/screen';
import { UrlConfig } from '@/scripts/ConstDic';
export default {
name: 'LeftSlider',
props:{
offsetBottom:{
type: Number,
required: true
}
},
data() {
return {
show: true,
treeList: [],
defaultProps: ''
};
},
computed: {
trainingId () {
return this.$route.query.trainingId;
}
},
mounted() {
this.initLoadPage();
// this.$nextTick(() => {
// document.querySelector('.left-slider').style.height = document.querySelector('.left-slider').offsetHeight - this.offsetBottom + 'px';
// });
},
methods: {
initLoadPage() {
getPublishLessonTree(this.$route.query.lessonId).then(response => {
if (response.data.tree && response.data.tree.length > 0) {
this.treeList = response.data.tree;
}
}).catch(error => {
this.$message.error(this.$t('tip.failedCourse') + ':' + error.message);
});
},
handleSliderShow(flag) {
this.$emit('overallTranslation', flag);
const slider = document.getElementById('leftSlider');
if (flag) {
slider.style.transform = 'translateX(0)';
this.show = false;
} else {
slider.style.transform = '';
this.show = true;
}
},
clickEvent(obj, node, ele) {
if (obj && obj.type === 'Training') {
if (obj.valid) {
this.disabled = true;
// trainingNotifyNew({ trainingId: obj.id }).then(resp => {
const query = {
group: this.$route.query.group, trainingId: obj.id, lessonId: this.$route.query.lessonId, mapId: this.$route.query.mapId, lineCode:this.$route.query.lineCode, noPreLogout: this.$route.query.noPreLogout
};
this.$router.replace({ path: `${UrlConfig.display}/teach`, query: query });
launchFullscreen();
// }).catch(error => {
// this.$messageBox(`${this.$t('tip.createSimulationFaild')} : ${error.message}`);
// this.disabled = false;
// });
} else {
this.$confirm(this.$t('tip.accessCourseNo'), this.$t('tip.hint'), {
confirmButtonText: this.$t('tip.confirm'),
cancelButtonText: this.$t('tip.cancel')
}).then(() => {
// this.buy();
}).catch(() => { });
}
}
}
}
};
</script>
<style scoped>
.left-slider{
z-index: 10;
width: 400px;
height: 100%;
position: absolute;
left: 0;
top: 0;
transform: translateX(-400px);
}
.slider-tree{
height: calc(100% - 40px);
border: 2px solid #409EFF;
}
.handleShow{
position: absolute;
left: 400px;
top: 50%;
background: #fff;
color: #000;
border-radius: 3px;
box-shadow: 3px 1px 5px #000;
padding: 3px;
}
.tip-title {
width: 100%;
overflow: hidden;
height: 40px;
display: flex;
align-items: center;
flex-direction: row-reverse;
background-color: #409EFF;
border-radius: 5px 5px 0 0;
justify-content: center;
padding: 0 10px;
color: #fff;
font-size: 18px;
text-align: center;
}
</style>

482
src/views/newMap/displayNew/lesson/index.vue
View File

@ -1,482 +0,0 @@
<template>
<div>
<div class="display-card" :style="{top: offset + 'px'}">
<el-row>
<el-radio-group v-model="demoMode" class="mode" size="small">
<el-radio-button :label="TrainingMode.TEACH">{{ $t('display.lesson.teachingMode') }}</el-radio-button>
<el-radio-button :label="TrainingMode.PRACTICE">{{ $t('display.lesson.practiceMode') }}</el-radio-button>
<el-radio-button :label="TrainingMode.TEST">{{ $t('display.lesson.testMode') }}</el-radio-button>
</el-radio-group>
<span class="display-time">{{ formatUsedTime }}</span>
<span v-if="demoMode === TrainingMode.TEST" class="display-score">{{ $t('display.lesson.score') }}{{ formatScore }}</span>
<el-button v-if="messageBoard" size="small" @click="messageBoardShow">留言板</el-button>
</el-row>
</div>
<div id="teachGroupButton" class="display-draft" :style="{bottom: offsetBottom + 'px'}">
<el-button-group>
<el-button type="success" class="start" :disabled="isDisable || dataError" :loading="startLoading" @click="start">{{ $t('display.startBtn') }}</el-button>
<el-button type="danger" class="end" :disabled="!isDisable || dataError" @click="end">{{ $t('display.endBtn') }}</el-button>
<el-button type="primary" :disabled="backDisable" class="back" @click="back">{{ $t('display.backBtn') }}</el-button>
</el-button-group>
</div>
<tip-training-detail :training-obj="trainingObj" :offset-bottom="offsetBottom + tipBottom" />
<left-slider v-if="isShowLeftSlider" :offset-bottom="offsetBottom" @overallTranslation="overallTranslation" />
</div>
</template>
<script>
import TipTrainingDetail from './tipTrainingDetail';
import LeftSlider from './LeftSlider';
import { mapGetters } from 'vuex';
import { Notification } from 'element-ui';
import { startTrainingNew, endTrainingNew } from '@/api/jmap/training';
import { trainingNotifyNew } from '@/api/simulation';
import { TrainingMode, UrlConfig } from '@/scripts/ConstDic';
import { timeFormat } from '@/utils/date';
import { getTrainingStepsDetailNew, loadTrainingInSimulation } from '@/api/jmap/training';
import { EventBus } from '@/scripts/event-bus';
import { getSessionStorage } from '@/utils/auth';
import { getPostByProjectCode } from '@/api/learn';
import { ProjectCode } from '@/scripts/ProjectConfig';
export default {
name: 'MenuLesson',
components: {
TipTrainingDetail,
LeftSlider
},
props: {
offset: {
type: Number,
required: true
},
offsetBottom: {
type: Number,
required: true
},
tipBottom: {
type: Number,
default: 0
},
dataError: {
type: Boolean,
default() {
return false;
}
}
},
data() {
return {
result: {},
timeInterval: null,
TrainingMode: TrainingMode,
trainingObj:{},
demoMode: TrainingMode.TEACH,
isDisable: false,
backDisable: false,
startLoading: false,
messageBoard: false,
prdTypeMap: {
'01': '01', // 现地 => 现地
'02': '02', // 行调 => 行调
'04': '02', // 司机 => 行调
'05': '' // 派班 => null
}
};
},
computed: {
...mapGetters('training', [
'score',
'usedTime',
'basicInfo'
]),
group() {
return this.$route.query.group;
},
formatScore() {
return this.score;
},
formatUsedTime() {
return timeFormat(this.usedTime);
},
isShowLeftSlider() {
return this.$route.query.lessonId != '0' && !this.isOther;
},
project() {
return getSessionStorage('project');
},
isOther() {
return this.$route.query.from == 'kzfmooc';
}
},
watch: {
demoMode: function (val) {
this.$store.dispatch('training/end', null);
this.$store.dispatch('training/reset');
this.$store.dispatch('training/setStopCountTime');
this.$store.dispatch('training/emitTipFresh');
this.$store.dispatch('menuOperation/setButtonOperation', null);
this.isDisable = false;
},
'$store.state.map.mapViewLoadedCount': function (val) {
this.getTrainingData();
},
'$store.state.training.operateErrMsg': function (val) {
this.tipInfo({ color: val.color, message: val.errMsg });
},
'$store.state.socket.simulationOver':function(val) {
this.back();
},
'$store.state.training.simulationUserList': function(val) {
const userInfo = this.$store.state.training.simulationUserList.find(user => user.userId == this.$store.state.user.id );
if (userInfo.type === 'STATION_SUPERVISOR') {
if (this.$store.state.map.map && this.$store.state.map.map.pictureList) {
const picture = this.$store.state.map.map.pictureList.find(picture => picture.stationCodes && picture.stationCodes.includes(userInfo.deviceCode) && picture.type === 'chainStation');
if (picture) {
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
const deviceList = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
deviceList.push(key);
}
this.$store.dispatch('map/setPictureDeviceMap', picture.deviceMap);
this.$jlmap.updatePicture(deviceList);
// this.$jlmap.updateTransform(picture.scaling, picture.origin);
this.$store.dispatch('map/setShowCentralizedStationCode', userInfo.deviceCode);
} else {
this.$store.dispatch('map/setShowCentralizedStationCode', userInfo.deviceCode);
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, userInfo.deviceCode);
}
} else {
this.$store.dispatch('map/setShowCentralizedStationCode', userInfo.deviceCode);
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, userInfo.deviceCode);
}
}
},
'$store.state.socket.simulationRoleList':function(list) {
if (list && list.length) {
this.checkRoleChange(list);
}
},
async $route() {
loadTrainingInSimulation(this.group, this.$route.query.trainingId).then(resp => {
this.setTrainingData(resp);
this.endViewLoading(true);
}).catch(error => {
this.endViewLoading(true);
this.$messageBox(`初始化实训内容失败: ${error.message}`);
});
this.resetTraining();
}
},
mounted() {
if (this.project) {
getPostByProjectCode(ProjectCode[this.project]).then(resp => {
if (resp.data) {
this.messageBoard = true;
}
}).catch(() => {
// this.$message.error('获取留言板信息失败');
console.log('获取留言板信息失败');
});
}
},
methods: {
tipInfo(opt) {
if (opt && opt.hasOwnProperty('color') && opt.hasOwnProperty('message')) {
const h = this.$createElement;
this.$notify({
title: this.$t('global.tips'),
message: h('i', { style: 'color:' + opt.color }, opt.message)
});
}
},
setTrainingData(resp) {
const detail = resp.data;
this.trainingObj = detail;
this.$store.dispatch('exam/setCenter', detail.locateDeviceCode);
this.$store.dispatch('training/setTrainingData', this.trainingObj); // 设置实训教学信息
this.$store.dispatch('training/setPrdType', this.prdTypeMap[detail.prdType]);
},
resetTraining() {
this.$store.dispatch('training/end', null);
this.$store.dispatch('training/reset');
this.$store.dispatch('training/emitTipFresh');
this.$store.dispatch('menuOperation/setButtonOperation', null);
this.$store.dispatch('training/setStopCountTime');
this.$store.dispatch('training/setScore', 0);
this.$store.dispatch('training/setTrainingStart', false);
this.isDisable = false;
},
getTrainingData() {
if (this.$route.query.trainingId) {
// 获取实训步骤数据（新版地图）
getTrainingStepsDetailNew(this.$route.query.trainingId, { group: this.group }).then(resp => {
this.setTrainingData(resp);
}).catch(error => {
this.$messageBox(`初始化实训内容失败: ${error.message}`);
});
}
this.resetTraining();
},
overallTranslation(flag) {
const panel = document.getElementById('leftSlider');
if (flag) {
panel.style.transform = 'translateX(400px)';
} else {
panel.style.transform = '';
}
},
start() {
// 清空按钮操作
this.$store.dispatch('menuOperation/setButtonOperation', null);
this.startLoading = true;
if (this.trainingObj && this.trainingObj.id) {
startTrainingNew(this.trainingObj, this.group).then(response => {
this.isDisable = true;
this.$store.dispatch('training/setTrainingStart', true);
this.$store.dispatch('map/clearJlmapTrainView').then(() => {
this.$store.dispatch('training/teachModeStart', this.demoMode).then(()=>{
this.$store.dispatch('training/countTime', 'Lesson'); // 开始计时
this.$store.dispatch('training/emitTipFresh');
this.tipInfo({ color: 'green', message: this.$t('global.pleaseOpearte') });
});
});
this.startLoading = false;
}).catch(() => {
this.isDisable = false;
this.startLoading = false;
});
} else {
this.startLoading = false;
this.$messageBox(this.$t('display.lesson.selectTraining'));
}
},
endCommit() {
const mode = {
mode: this.demoMode,
id: this.trainingObj.id,
lessonId: this.$route.query.lessonId,
usedTime: this.usedTime
};
endTrainingNew(mode, this.group).then(response => {
const data = response.data;
this.result = data;
this.$store.dispatch('training/judgeFinish', data).then(rsp => {
this.$store.dispatch('training/setStopCountTime');
this.$store.dispatch('training/emitTipFresh');
this.$store.dispatch('training/setTrainingStart', false);
});
}).catch(() => {
this.$messageBox(this.$t('display.lesson.endTrainingError'));
});
},
end() {
// 如果是测试模式需要获取最终的得分
if (this.trainingObj && this.trainingObj.id) {
this.isDisable = false;
this.$store.dispatch('training/isStepOver').then((rnt) => {
if (rnt) {
this.endCommit();
} else {
this.backDisable = true;
this.$confirm(this.$t('display.lesson.endTrainingTip'), this.$t('global.tips'), {
cancelButtonText: this.$t('global.cancel'),
confirmButtonText: this.$t('global.confirm'),
type: 'warning',
center: true,
zIndex: 9999
}).then(() => {
this.backDisable = false;
const mode = {
mode: this.demoMode,
id: this.trainingObj.id,
lessonId: this.$route.query.lessonId,
usedTime: this.usedTime
};
endTrainingNew(mode, this.group).then(response => {
this.result = response.data;
this.$store.dispatch('training/end', null);
this.$store.dispatch('training/setStopCountTime');
this.$store.dispatch('training/setScore', 0);
this.$store.dispatch('training/emitTipFresh');
this.$store.dispatch('training/setTrainingStart', false);
}).catch(() => {
this.$messageBox(this.$t('display.lesson.endTrainingError'));
});
}).catch(() => {
this.isDisable = true;
this.backDisable = false;
});
}
});
}
},
back() {
Notification.closeAll();
if (this.isOther) {
EventBus.$emit('demoResult', this.result);
} else if (this.$route.params.mode == 'record') {
/** 如果是演示返回时，需要重新创建仿真*/
trainingNotifyNew({ trainingId: this.$route.query.trainingId }).then(resp => {
this.$router.push({ path: `${UrlConfig.lesson.record}/${this.$route.query.trainingId}/${this.$route.query.trainingName}`, query: { group: resp.data } });
}).catch(error => {
this.$messageBox(`${this.$t('display.lesson.createSimulationError')}: ${error.message}`);
});
} else {
if (this.$route.query.noPreLogout) {
this.$router.replace({path:'/device/teachDetail', query: {lessonId: this.$route.query.lessonId, mapId: this.$route.query.mapId, noPreLogout: this.$route.query.noPreLogout}});
} else {
history.go(-1);
}
}
},
// 结束加载状态
endViewLoading(isSuccess) {
if (!isSuccess) {
this.$store.dispatch('map/mapClear');
}
this.$nextTick(() => {
EventBus.$emit('viewLoading', false);
});
},
messageBoardShow() {
const routeData = this.$router.resolve({
path:'/messageBoard',
query:{
project: this.project,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
checkRoleChange(list) {
list.forEach(item => {
if (item.messageType === 'PLAY_CHANGE' && item.userId == this.$store.state.user.id && item.type === 'STATION_SUPERVISOR') {
if (this.$store.state.map.map && this.$store.state.map.map.pictureList) {
const picture = this.$store.state.map.map.pictureList.find(picture => picture.stationCodes && picture.stationCodes.includes(item.deviceCode) && picture.type === 'chainStation');
if (picture) {
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
const deviceList = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
deviceList.push(key);
}
this.$store.dispatch('map/setPictureDeviceMap', picture.deviceMap);
this.$jlmap.updatePicture(deviceList);
// this.$jlmap.updateTransform(picture.scaling, picture.origin);
this.$store.dispatch('map/setShowCentralizedStationCode', item.deviceCode);
} else {
this.$store.dispatch('map/setShowCentralizedStationCode', item.deviceCode);
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, item.deviceCode);
}
} else {
this.$store.dispatch('map/setShowCentralizedStationCode', item.deviceCode);
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, item.deviceCode);
}
this.$jlmap.setCenter(this.trainingObj.locateDeviceCode);
}
});
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.display-card {
z-index: 9;
display: inline-block;
position: absolute;
left: 5px;
height: 32px;
}
.display-card .el-row {
line-height: 32px !important;
}
.display-mode {
display: -moz-inline-box;
display: inline-block;
/deep/ .el-radio-button__inner {
font-weight: bold;
}
}
.display-time {
background-color: white;
display: -moz-inline-box;
display: inline-block;
text-align: center;
font-weight: bold;
border: 1px solid lightskyblue;
width: 100px;
height: 32px;
line-height: 24px;
border-radius: 4px;
margin-left: 10px;
font-family: "Microsoft" !important;
font-size: 18px !important;
color: black;
}
.display-score {
background-color: black;
display: -moz-inline-box;
display: inline-block;
text-align: left;
border: 1px solid lightskyblue;
width: 100px;
height: 32px;
line-height: 24px;
border-radius: 4px;
padding-left: 2px;
margin-left: 10px;
font-family: "Microsoft" !important;
font-size: 18px !important;
color: #fff;
}
.display-draft {
position: absolute;
float: right;
right: 15px;
bottom: 15px;
.back {
z-index: 100000;
}
.start{z-index:2;}
.end{z-index:2}
/deep/ .el-button {
font-weight: bold;
}
}
</style>

304
src/views/newMap/displayNew/lesson/tipTrainingDetail.vue
View File

@ -1,304 +0,0 @@
<template>
<!-- v-drag 拖拽 调整宽高 -->
<div v-quickMenuDrag class="reminder-drag" :style="{bottom: offsetBottom + 'px'}">
<div ref="drapBox" class="reminder-box">
<div class="tip-title">
<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>
</p>
</div>
<div v-if="isShrink" class="reminder-box-content">
<div class="zhezhao" />
<div ref="dragBody" class="tip-body-box">
<div class="tip-body">
<el-scrollbar wrap-class="scrollbar-wrapper">
<p class="list-item">
<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>-->
<!-- <p class="list-item">-->
<!-- <span class="list-label">{{ $t('display.training.maximumTime') }}</span>-->
<!-- <span class="list-elem">{{ courseModel.maxDuration }} {{ $t('display.seconds') }} </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>
</p>
</el-scrollbar>
</div>
<div class="drag-right" />
<div class="drag-left" />
<div class="drag-bottom" />
<div class="drag-top" />
</div>
</div>
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex';
import { getPublishLessonDetail } from '@/api/jmap/lesson';
import { launchFullscreen } from '@/utils/screen';
export default {
name: 'TipTrainingDetail',
props: {
trainingObj: {
type: Object,
default() {
return null;
}
},
offsetBottom: {
type: Number,
required: true
}
},
data() {
return {
training: {
id: '',
name: '',
remarks: ''
},
isShrink: true,
lessonName: '',
courseModel: {
id: '',
name: '',
maxDuration: '',
minDuration: '',
remarks: '',
updateTime: ''
},
showSumbit: false,
lessonIndex: 0
};
},
computed: {
...mapGetters('trainingList', [
'trainingList'
])
},
watch: {
'trainingObj': function (val) {
if (val) {
this.courseModel = {
id: val.id,
name: val.name,
maxDuration: val.maxDuration,
minDuration: val.minDuration,
remarks: val.remarks,
updateTime: val.updateTime
};
}
}
},
mounted() {
this.loadInitData(this.$route.query);
},
methods: {
loadInitData(obj) {
this.showSumbit = false;
this.lessonName = '';
this.courseModel = {
id: '',
name: '',
maxDuration: '',
minDuration: '',
remarks: '',
updateTime: ''
};
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;
// const top = this.$refs.drapBox.style.top;
if (this.isShrink) {
//
// this.$refs.drapBox.style.height = '40px';
// this.$refs.drapBox.style.top = '';
this.isShrink = false;
} else {
this.isShrink = true;
this.$nextTick(()=>{
const dragDom = document.querySelector('.reminder-drag').style.bottom;
if (document.body.clientHeight - 300 - parseInt(dragDom.replace('px', '')) < 0) {
document.querySelector('.reminder-drag').style.bottom = `${document.body.clientHeight - 300}px`;
}
});
// this.$refs.drapBox.style.height = height + 'px';
// this.$refs.drapBox.style.top = top;
}
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.tip-body-box {
position: relative;
height: 260px;
position: absolute;
left: 0;
top: 0;
width: 100%;
}
.reminder-drag{
position: absolute;
bottom: 0px;
left: 15px;
z-index: 10;
}
.elem-span{
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);
position:absolute;
}
.reminder-box-content{
width: 500px;
height: 260px;
left: 0;
top: 0;
z-index: 2;
background: rgba(255,255,255,0.8);
position: relative;
}
.reminder-box {
border-radius: 5px;
overflow: hidden;
z-index: 10;
font-size: 18px;
.tip-title {
width: 500px;
overflow: hidden;
height: 40px;
display: flex;
align-items: center;
flex-direction: row-reverse;
background-color: rgba(64, 158, 255,1);
border-radius: 5px 5px 0 0;
justify-content: space-between;
padding: 0 10px;
}
.drag-right,
.drag-left {
width: 10px;
cursor: e-resize;
background-color: yellow;
height: 100%;
position: absolute;
right: 0;
top: 0;
opacity: 0;
}
.drag-left {
left: 0;
}
.drag-bottom {
position: absolute;
bottom: 0;
width: 100%;
height: 10px;
cursor: s-resize;
background-color: yellow;
opacity: 0;
}
.drag-top {
position: absolute;
top: -45px;
left: 0;
width: 100%;
height: 10px;
cursor: s-resize;
background-color: yellow;
opacity: 0;
}
.tip-body {
height: 260px;
padding: 10px;
.list-label {
width: 105px;
}
}
.tip-foot {
width: 100%;
position: absolute;
right: 0px;
bottom: 0px;
background-color: #fff;
padding: 10px 0 10px 10px;
.foot-detail {
height: 100%;
float: right;
margin-top: 9px;
padding-right: 15px;
}
.foot-submit {
float: right;
margin-top: 9px;
padding-right: 15px;
}
}
.icon {
float: right;
margin-right: 10px;
cursor: pointer;
background-color: #f3f3f3;
border-radius: 50%;
}
/deep/ {
.el-tree-node__content {
margin-bottom: 4px;
}
.el-tree--highlight-current .el-tree-node.is-current>.el-tree-node__content {
background-color: #d6e5f7;
}
}
}
</style>

497
src/views/newMap/displayNew/menuDemon.vue
View File

@ -1,497 +0,0 @@
<template>
<div>
<status-icon v-if="$route.query.lineCode == '11' || $route.query.lineCode == '10'" ref="statusIcon" />
<demon-chat v-if="!noChatBox" ref="chatbox" :group="group" :user-role="userRole" :offset="offset" />
<div class="display-card" :style="{top: offset+'px'}">
<el-row>
<span v-if="countTime" class="display-score">{{ $t('display.demon.trialTime') }} {{ countTime }}</span>
</el-row>
</div>
<demon-menu
ref="demonMenu"
:is-all-show="!dataError"
:jl3dmodel-show="isShow3dmodel && !isShowScheduling && !isDrive"
:jl3dname-show="!isShowScheduling&&!isDrive"
:cctv-show="!isShowScheduling"
:trafficplan-show="!isShowScheduling"
:schedule-load-show="isShowScheduling && !runing"
:schedule-preview-show="isShowScheduling && runing"
:jlmap3d-fault-show="false"
:driver-show="isDrive"
:all-style="'top:'+(offset+textStatusHeight)+'px'"
@runPlanLoadShow="runPlanLoadShow"
/>
<div class="display-draft" :class="{'haerbin_btn_box': $route.query.lineCode == '07'||$route.query.lineCode == '14'}" :style="{bottom: offsetBottom + 'px', zIndex: zIndex}">
<el-button-group class="button-group-box">
<template v-if="!dataError&&project != 'bjd'">
<template v-if="isScriptRun">
<el-button type="danger" size="small" @click="handleQuitQuest">退出剧本</el-button>
</template>
<template v-if="datie">
<el-button type="primary" size="small" @click="modifySystemTime">修改系统时间</el-button>
</template>
<template v-if="!projectDevice">
<el-button v-if="project !== 'srsandbox' && !datie " type="success" :disabled="isDisable" size="small" @click="selectBeginTime">{{ $t('display.demon.drivingByPlan') }}</el-button>
<!-- isDisable&& -->
<el-button v-if="isAdmin && !datie " v-loading="pauseLoading" :type="simulationPaused?'warning':'primary'" size="small" @click="startOrPause">{{ simulationPaused?'开始':'暂停' }}</el-button>
<el-button type="danger" size="small" @click="end">{{ $t('display.demon.initialize') }}</el-button>
</template>
</template>
<el-button v-if="project !='bjd'" type="primary" size="small" @click="back">{{ projectDevice || isCtc ?'退出':$t('display.demon.back') }}</el-button>
</el-button-group>
</div>
<div v-if="project ==='bjd'" style="position:absolute;right:0;bottom:0"><el-button type="primary" @click="quit">退出</el-button></div>
<menu-schema
ref="menuSchema"
:offset="offset"
:data-error="dataError"
:offset-bottom="offsetBottom"
@selectQuest="selectQuest"
@changeShowMap="changeShowMap"
/>
<set-time ref="setTime" @ConfirmSelectBeginTime="start" />
<modify-time v-if="datie" ref="modifySysTime" />
</div>
</template>
<!-- 单人仿真 -->
<script>
import SetTime from './demon/setTime';
import ModifyTime from './demon/modifyTime';
import DemonMenu from './demonMenu';
import DemonChat from './demonChat';
import { Notification } from 'element-ui';
import MenuSchema from '@/views/newMap/displayNew/menuSchema';
import { getGoodsTryUse } from '@/api/management/goods';
import {getSimulationInfoNew, clearSimulation } from '@/api/simulation';
import { PermissionType } from '@/scripts/ConstDic';
import { getCountTime } from '@/utils/index';
import { TrainingMode } from '@/scripts/ConstDic';
import { quitScriptNew } from '@/api/simulation';
import { setGoodsTryUse } from '@/api/management/goods';
import { simulationPause, simulationStart } from '@/api/rtSimulation';
import {loadScriptNew } from '@/api/simulation';
import StatusIcon from '@/views/components/StatusIcon/statusIcon';
import Vue from 'vue';
import { getSessionStorage } from '@/utils/auth';
import { EventBus } from '@/scripts/event-bus';
export default {
name: 'MenuDemon',
components: {
SetTime,
ModifyTime,
DemonChat,
MenuSchema,
DemonMenu,
StatusIcon
},
props: {
offset: {
type: Number,
required: true
},
offsetBottom: {
type: Number,
required: true
},
dataError: {
type: Boolean,
default() {
return false;
}
},
textStatusHeight: {
type: Number,
default() {
return 0;
}
}
},
data() {
return {
tryTime: 0, // 进入页面多少秒
timeNow: 0, // 进入页面 相对时间
time: null, // 定时器
countTime: 0, // 显示 倒计时
remainingTime: 0,
userRole:'AUDIENCE',
pauseLoading: false,
goodsId: this.$route.query.goodsId,
try: this.$route.query.try, // 是否是试用权限
training: {
id: '',
name: '',
remarks: ''
},
isScriptRun:false,
jl3dpassflow:this.$t('display.demon.passengerflow'),
jl3dname: this.$t('display.demon.threeDimensionalView'),
jl3dstation: this.$t('display.demon.threeDimensionalStation'),
jl3dmodel: this.$t('display.demon.deviceView'),
isShow3dmodel :true,
isGoback: false,
runing:false,
prdTypeMap: {
'01': '01', // 现地 => 现地
'02': '02', // 行调 => 行调
'04': '02', // 司机 => 行调
'05': '' // 派班 => null
}
};
},
computed: {
isShowScheduling() {
return this.$route.query.prdType == '05';
},
datie() {
return ['16', '19'].includes(this.$route.query.lineCode);
},
isDrive() {
return this.$route.query.prdType == '04';
},
group() {
return this.$route.query.group;
},
projectDevice() {
return this.$route.query.projectDevice;
},
isDisable() {
return this.$store.state.training.started;
},
isCtc() {
return !!this.$route.query.ctc;
},
zIndex() {
return this.$route.query.ctc ? 11 : 0;
},
project() {
return getSessionStorage('project');
},
isAdmin() {
return this.$store.state.user.roles.includes('04') || this.$store.state.user.roles.includes('05');
},
simulationPaused() {
return this.$store.state.socket.simulationPause;
},
noChatBox() {
return this.project.includes('srsandbox') || this.project.includes('jxgm');
}
},
watch: {
'$store.state.training.subscribeCount': function () {
this.group && this.initLoadPage();
},
'$store.state.socket.simulationRoleList':function(val) {
(val || []).forEach(item => {
if (item.messageType === 'KICK_OUT' && item.userId == this.$store.state.user.id) {
!this.isGoback && this.back();
}
});
},
'$store.state.socket.simulationOver':function(val) {
!this.isGoback && this.back();
},
// '$store.state.training.started': function (val) {
// this.setRuning(val);
// },
'$store.state.socket.simulationStart':function(val) {
if (val) {
this.setRuning(true);
this.$store.dispatch('training/simulationStart').then(() => {
this.$store.dispatch('map/setShowCentralizedStationNum');
});
}
},
'$store.state.socket.simulationReset':function(val) {
this.setRuning(false);
}
},
created() {
this.$store.dispatch('training/setPrdType', this.$route.query.prdType);
switch (this.$store.state.training.prdType) {
case '02': { this.userRole = 'DISPATCHER'; break; }
case '01': { this.userRole = 'STATION_SUPERVISOR'; break; }
case '04': { this.userRole = 'DRIVER'; break; }
case '05': { this.userRole = 'DEPOT_DISPATCHER'; break; }
default: { this.userRole = 'AUDIENCE'; break; }
}
},
beforeDestroy() {
if (this.time) {
this.setTryTime();
clearTimeout(this.time);
}
this.$store.dispatch('scriptRecord/updateSimulationPause', false);
this.$store.dispatch('map/resetActiveTrainList', true);
},
mounted() {
this.$store.dispatch('training/end', TrainingMode.NORMAL);
// this.$store.dispatch('training/setPrdType', this.prdTypeMap[this.$route.query.prdType]);
this.$nextTick(() => {
this.$refs.demonMenu.menuClick();
});
},
methods: {
startOrPause() {
this.pauseLoading = true;
if (this.simulationPaused) {
simulationStart(this.group).then(resp => {
this.pauseLoading = false;
}).catch(() => {
this.pauseLoading = false;
this.$messageBox('开始失败，请稍后再试');
});
} else {
simulationPause(this.group).then(resp => {
this.pauseLoading = false;
}).catch(() => {
this.pauseLoading = false;
this.$messageBox('暂停失败，请稍后再试');
});
}
},
async initLoadPage() {
try {
if (this.try != '0') {
this.loadInitData();
}
} catch (error) {
console.log(error);
}
},
loadInitData() {
const data = {
mapId: this.$route.query.mapId,
prdType: this.$route.query.prdType,
permissionType: PermissionType.SIMULATION
};
getGoodsTryUse(data).then(res => {
if (res.data) {
this.remainingTime = res.data.tryTime;
this.timeNow = Date.parse(new Date()) / 1000 + this.remainingTime;
}
if (this.try) {
this.time = setInterval(() => {
this.tryTime += 1;
this.countTime = getCountTime(this.timeNow);
if (this.countTime == -1) {
this.back();
}
}, 1000);
}
}).catch(() => {
this.$messageBox(this.$t('display.demon.getTimeFail'));
});
},
selectBeginTime() {
this.$refs.setTime.doShow();
},
start(model) { // 开始仿真
this.$emit('start', model);
},
setRuning(run) {
this.runing = run;
this.$refs.demonMenu.hideScheduling(run);
},
end() {
this.$emit('end');
},
handleQuitQuest() {
quitScriptNew(this.group).then(resp => {
getSimulationInfoNew(this.group).then((res)=>{
EventBus.$emit('clearRunSeries');
this.quitQuest();
this.initLoadPage();
this.clearAllData();
this.$store.dispatch('scriptRecord/updateBgSet', false);
});
}).catch(() => {
this.$messageBox(this.$t('display.demon.exitTaskFail'));
});
},
// 修改系统时间
modifySystemTime() {
this.$refs.modifySysTime.doShow();
},
// 选择脚本
async selectQuest({row, id, mapLocation, roleName}) {
try {
let userRole = 'AUDIENCE';
if (id) {
this.$store.dispatch('training/setPrdType', this.$route.query.prdType);
if (this.$route.query.prdType) {
if (this.$route.query.prdType == '02') {
userRole = 'DISPATCHER';
} else if (this.$route.query.prdType == '01') {
userRole = 'STATION_SUPERVISOR';
} else if (this.$route.query.prdType == '04') {
userRole = 'DRIVER';
} else if (this.$route.query.prdType == '05') {
userRole = 'DEPOT_DISPATCHER';
} else {
userRole = 'AUDIENCE';
}
}
this.$store.dispatch('training/setRoles', userRole);
} else {
this.$store.dispatch('training/setRoles', 'AUDIENCE');
this.$store.dispatch('training/setPrdType', '');
}
// this.$refs.menuSchema.loadRunData();
this.userRole = userRole;
this.$store.dispatch('scriptRecord/updateBgSet', true);
// this.$refs.chatbox.setMembers(id);
(this.$store.state.training.memberData[id] || {}).userId = this.$store.state.user.id;
(this.$store.state.training.memberData[id] || {}).disabled = true;
const res = await loadScriptNew(row.id, id, this.group);
if (res && res.code == 200) {
if (mapLocation) {
const newMapLocation = {'offsetX': mapLocation.x, 'offsetY': mapLocation.y, 'scaleRate': mapLocation.scale};
Vue.prototype.$jlmap.setOptions(newMapLocation);
}
this.isScriptRun = true;
// this.initLoadPage();
}
} catch (error) {
this.$messageBox(error.message);
}
// if (this.isScript) {
// this.$refs.menuScript.initLoadPage();
// }
},
quitQuest() {
this.isScriptRun = false;
let userRole = '';
if (this.$route.query.prdType) {
if (this.$route.query.prdType == '02') {
userRole = 'DISPATCHER';
} else if (this.$route.query.prdType == '01') {
userRole = 'STATION_SUPERVISOR';
} else if (this.$route.query.prdType == '04') {
userRole = 'DRIVER';
} else if (this.$route.query.prdType == '05') {
userRole = 'DEPOT_DISPATCHER';
} else {
userRole = 'AUDIENCE';
}
}
this.userRole = userRole;
if (this.$refs.chatbox) {
this.$refs.chatbox.clearAllData();
}
this.$store.dispatch('training/setPrdType', this.$route.query.prdType);
this.$store.dispatch('training/setRoles', userRole);
this.$store.dispatch('training/setScriptQuit');
// this.$store.dispatch('scriptRecord/updateSimulationPause', false);
},
clearAllData() {
if (this.$refs.chatbox) {
this.$refs.chatbox.clearAllData();
}
},
async back() {
this.isGoback = true;
if (this.projectDevice) {
if (this.$route.query.type == 'IM') {
clearSimulation(this.group).then(res=>{
this.$store.dispatch('training/over').then(() => {
this.$store.dispatch('LogOut').then(() => {
// this.$store.dispatch('training/reset');
// this.$store.dispatch('map/mapClear');
location.reload();
});
});
});
} else {
this.$store.dispatch('training/over').then(() => {
this.$store.dispatch('LogOut').then(() => {
// this.$store.dispatch('training/reset');
// this.$store.dispatch('map/mapClear');
location.reload();
});
});
}
// || this.project === 'bjd'
} else {
if (this.project === 'bjd' || this.isCtc) {
window.close();
} else {
this.$store.dispatch('map/setShowCentralizedStationCode', '');
history.go(-1);
Notification.closeAll();
}
}
},
setTryTime() {
if (this.try) {
const data = { time: this.tryTime, goodsId: this.goodsId };
if (data.goodsId) {
setGoodsTryUse(data);
}
}
},
runPlanLoadShow() {
this.$refs.menuSchema.loadRunPlan();
},
quit() {
window.close();
},
changeShowMap(flag) {
this.$emit('changeShowMap', flag);
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.display-card {
z-index: 9;
display: inline-block;
position: absolute;
top: 17px;
left: 160px;
height: 32px;
}
.display-card .el-row {
line-height: 32px !important;
}
.display-score {
background-color: black;
display: -moz-inline-box;
display: inline-block;
text-align: left;
height: 32px;
line-height: 24px;
border-radius: 4px;
padding-left: 2px;
margin-left: 10px;
font-family: "Microsoft" !important;
font-size: 18px !important;
color: #fff;
}
.haerbin_btn_box{
width: 450px;
bottom: 15px!important;
}
.display-draft {
position: absolute;
right: 10px;
bottom: 15px;
.button-group-box{
float: right;
}
}
</style>

520
src/views/newMap/displayNew/menuSchema.vue
View File

@ -1,520 +0,0 @@
<template>
<div style="height:100%;">
<div class="schema" :style="{top: offset+'px'}">
<select-station v-show="!$route.query.joint" v-if="isShowSelectStation && !isScript" ref="selectStation" :style-css="'width: 100px;'" />
<el-select v-model="speed" style="width: 100px;" size="small" @change="speedChange">
<el-option
v-for="item in speedList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<template v-if="!dataError">
<el-button-group v-if="project !== 'bjd'">
<el-button v-if="$route.query.lineCode === '16'&&!isCtc && project !== 'teaching'&&isLocalStation" size="small" @click="goCtc">车务终端</el-button>
<el-button v-if="$route.query.lineCode === '16'&&!isCtc && project !== 'teaching'&&isLocalStation" size="small" @click="goRpManage">车务管理终端</el-button>
<el-button v-if="$route.query.lineCode ==='16'&&isLocalStation" size="small" @click="showTrainTicket">路票</el-button>
<el-button v-if="showRegisterBookBtn" size="small" @click="showRegisterBook">簿册</el-button>
<!-- <el-button v-if="$route.query.lineCode === '16'&&!isCtc" size="small" @click="goDsManage">调度台</el-button> -->
<el-button v-if="showDispatcherStation" size="small" @click="changeShowMap">调度台</el-button>
<el-button v-if="isLocalStation && $route.query.lineCode!='08' && $route.query.lineCode!='16' && $route.query.lineCode!='19' && project !== 'teaching'" size="small" @click="goIbp">IBP盘</el-button>
<el-button v-if="isScheduling && isDepot && project !== 'teaching'" size="small" type="primary" @click="runPlanEditShow">运行图编辑</el-button>
<!-- 加载剧本 -->
<el-button v-if="isDemon && !isScheduling && !isContest && !isDepoltSim && $route.query.lineCode!='16' && $route.query.lineCode!='19' && project !== 'teaching'" size="small" :disabled="viewDisabled" type="success" @click="viewRunQuest">{{ $t('display.schema.loadScript') }}</el-button>
<!-- 运行图加载 -->
<!-- notScript && -->
<el-button v-if="running && project !== 'teaching'" size="small" :disabled="viewDisabled" @click="viewRunPlan">{{ $t('display.schema.previewRunDiagram') }}</el-button>
<!-- notScript && -->
<el-button v-if="!running && $route.query.lineCode!='16'&& $route.query.lineCode!='19' && project !== 'teaching'" size="small" type="warning" @click="loadRunPlan">{{ $t('display.schema.loadRunDiagram') }}</el-button>
</el-button-group>
<el-button v-if="!isScheduling && project !== 'bjd'" size="small" :type="faultMode ? '':'primary' " @click="changeOperateMode()">{{ faultMode?'切换到普通模式[Tab]':'切换到故障模式[Tab]' }}</el-button>
<el-button v-if="running&&project == 'bjd'" size="small" :disabled="viewDisabled" @click="viewRunPlan">{{ $t('display.schema.previewRunDiagram') }}</el-button>
<!-- <el-button v-if="!isLocalStation" size="small" :type="faultMode ? 'danger' : ''" @click="changeDirectiveMode()">指令模式</el-button> -->
</template>
</div>
<fault-choose ref="faultChoose" :group="group" :offset="offset" />
<run-plan-Load ref="runPlanLoad" :group="group" />
<!-- v-if="project!== 'bjd'" -->
<run-plan-view ref="runPlanView" :group="group" />
<!-- 加载剧本列表弹窗 -->
<add-quest ref="addQuest" @selectQuest="selectQuest" />
<line-board ref="lineBoard" />
<train-ticket ref="trainTicket" />
<register-book ref="registerBook" />
<!-- <run-plan-edit v-if="isScheduling && isDepot" ref="runPlanEdit" /> -->
</div>
</template>
<script>
import SelectStation from './selectStation';
import RunPlanLoad from './demon/runPlanLoad';
import RunPlanView from './demon/runPlanView';
import FaultChoose from './demon/faultChoose';
import LineBoard from '../displayCity/lineBoard';
import AddQuest from './demon/addQuest';
import { OperateMode } from '@/scripts/ConstDic';
import { getByGroupStationList } from '@/api/jmap/map';
import { generateRunPlanInfoSync } from '@/api/jmap/mapdraft.js';
import { getSessionStorage } from '@/utils/auth';
import { getToken } from '@/utils/auth';
import { getIbpInfoByStation } from '@/api/ibp';
import { loadRunPlanData } from '@/utils/loaddata';
import { EventBus } from '@/scripts/event-bus';
import { timesSpeedPlayback } from '@/api/rtSimulation';
import TrainTicket from '../trainTicket/index';
import RegisterBook from '../registerBook/index';
// 右上角操作
export default {
name: 'MenuSchema',
components: {
RunPlanLoad,
RunPlanView,
FaultChoose,
AddQuest,
// RunPlanEdit,
SelectStation,
LineBoard,
TrainTicket,
RegisterBook
},
props: {
offset: {
type: Number,
required: true
},
dataError: {
type: Boolean,
default() {
return false;
}
}
},
data() {
return {
mode: OperateMode.NORMAL,
OperateMode: OperateMode,
viewDisabled: true,
swch: '02',
isScriptCommand:false,
faultMode: false,
speed: 1,
centralizedstationList: [],
centralizedStationMap: {}
// firstLoad: true
};
},
computed: {
group() {
return this.$route.query.group;
},
notScript() {
return this.$route.params.mode !== 'script';
},
isCtc() {
return !!this.$route.query.ctc;
},
isScript() {
return this.$route.params.mode === 'script';
},
project() {
return getSessionStorage('project');
},
isDemon() {
return this.$route.params.mode === 'demon';
},
isScheduling() {
return this.$route.query.prdType === '05';
},
isDepoltSim() {
return this.$route.query.prdType === '09';
},
isLocalStation() {
return this.$store.state.training.prdType === '01';
},
isShowSelectStation() {
return this.$store.state.training.prdType === '01' || this.$store.state.training.prdType === '09';
},
running() {
return this.$store.state.training.started;
},
isDepot() {
return this.$route.query.type === 'DEPOT';
},
showDispatcherStation() {
return this.$route.query.lineCode === '16' && this.$store.state.training.prdType === '02';
},
isContest() {
return this.project.includes('drts') || this.$route.query.thirdDrts;
},
isAdmin() {
return this.$store.state.user.roles.includes('04') || this.$store.state.user.roles.includes('05');
},
userId() {
return this.$store.state.user ? this.$store.state.user.id : '';
},
speedList() {
return this.isAdmin ? [
{ value: 1, label: '1倍速' },
{ value: 2, label: '2倍速' },
{ value: 3, label: '3倍速' },
{ value: 4, label: '4倍速' },
{ value: 5, label: '5倍速' },
{ value: 6, label: '6倍速' },
{ value: 7, label: '7倍速' },
{ value: 8, label: '8倍速' },
{ value: 9, label: '9倍速' },
{ value: 10, label: '10倍速' }
] : [
{ value: 1, label: '1倍速' },
{ value: 2, label: '2倍速' },
{ value: 3, label: '3倍速' },
{ value: 4, label: '4倍速' },
{ value: 5, label: '5倍速' }
];
},
showRegisterBookBtn() {
const roleList = ['STATION_SUPERVISOR', 'STATION_ASSISTANT', 'STATION_SIGNALER', 'STATION_SWITCH_MAN', 'STATION_MASTER', 'STATION_WORKER', 'DEVICE_MANAGER'];
return this.$route.query.lineCode === '16' && roleList.includes(this.$store.state.training.userRole);
}
},
watch: {
'$store.state.scriptRecord.bgSet':function (val) {
this.isScriptCommand = val;
if (!val) {
this.swch = '01';
}
},
// '$store.state.map.mapDataLoadedCount': function () {
// this.loadRunData();
// },
'$store.state.training.subscribeCount': function () {
this.loadRunData();
},
'$store.state.socket.simulationPlanChange': function (val) {
// 判断是否已经加载运行图，若加载只处理运行图数据，否则，缓存数据
if (JSON.stringify(this.$store.state.runPlan.planData) == '{}') {
this.$store.dispatch('runPlan/setUpdateTrainRpData', val);
} else {
this.$store.dispatch('runPlan/updateTrainRunplan', val);
}
},
'$store.state.training.triggerFaultCount': function () {
this.setFault();
},
'$store.state.runPlan.loadRunPlanCount': function () {
this.viewDisabled = false;
if (JSON.stringify(this.$store.state.runPlan.updateTrainRpData) != '{}') {
this.$store.dispatch('runPlan/updateTrainRunplan', this.$store.state.runPlan.updateTrainRpData);
}
},
'$store.state.socket.simulationSpeed': function (val) {
this.speed = val;
},
'$store.state.map.map': function (map) {
if (map) {
this.setCentralizedstationList(map); // 获取集中站列表
}
},
'$store.state.training.simulationUserList': function(list) {
if (list && list.length && this.$route.query.lineCode == '16' && this.isCtc && !this.$route.query.joint) {
this.checkRoleInit(list);
}
},
'$store.state.socket.simulationRoleList':function(list) {
if (list && list.length && this.$route.query.lineCode == '16' && this.isCtc && !this.$route.query.joint) {
this.checkRoleChange(list);
}
}
},
mounted() {
EventBus.$on('CheckFaultModeEvent', () => {
if (!this.isScheduling) {
this.changeOperateMode();
}
});
EventBus.$on('showLineBoard', () => {
this.showLineBoard();
});
},
methods: {
loadRunData() {
this.$store.dispatch('runPlan/clear').then(() => {
if (this.group) {
this.viewDisabled = true;
// 获取排序的车站列表
getByGroupStationList(this.group).then(response => {
this.$store.dispatch('runPlan/setStations', response.data).then(() => {
loadRunPlanData(this.group, this.dataError);
});
}).catch(() => {
this.$messageBox(this.$t('display.schema.getStationListFail'));
});
}
});
},
showLineBoard() {
this.$refs.lineBoard.doShow();
},
changeShowMap() {
this.$emit('changeShowMap', false);
},
goCtc() {
// const routeData = this.$router.resolve({
// path:'/displayNew/demon',
// query:{
// lineCode:this.$route.query.lineCode,
// group: this.$route.query.group,
// prdType: this.$store.state.training.prdType,
// mapId:this.$route.query.mapId,
// project: this.project,
// newApi: this.$route.query.newApi,
// ctc: true,
// try: this.$route.query.try,
// token:getToken(),
// noPreLogout: true
// }
// });
const routeData = this.$router.resolve({
path:'/display/demon',
query:{
lineCode:this.$route.query.lineCode,
group: this.$route.query.group,
prdType: '01',
mapId:this.$route.query.mapId,
project: this.project,
newApi: false,
// joint: true,
ctc: true,
try: this.$route.query.try || 0,
token:getToken(),
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
showTrainTicket() {
const stationSupervisorList = [];
for (const memberId in this.$store.state.training.memberData) {
const item = this.$store.state.training.memberData[memberId];
if (item.type === 'STATION_SUPERVISOR') {
const device = this.$store.getters['map/getDeviceByCode'](item.deviceCode);
const memberData = { labelName: '值班员-' + device.name + (item.name ? `-${item.name }` : ''), id:item.id, userId:item.userId };
stationSupervisorList.push(memberData);
}
}
EventBus.$emit('trainTicketMember', stationSupervisorList);
this.$refs.trainTicket.doShow();
},
showRegisterBook() {
this.$refs.registerBook.doShow();
},
checkRoleInit(data) {
const stationRoleList = ['STATION_SUPERVISOR', 'STATION_ASSISTANT', 'STATION_MASTER', 'STATION_SIGNALER',
'STATION_PASSENGER', 'STATION_SWITCH_MAN', 'STATION_FACILITATOR', 'STATION_WORKER', 'DEVICE_MANAGER'];
// 'TRAIN_MASTER'
data.forEach(item => {
if ((item.admin && item.online) && item.userId == this.userId && stationRoleList.includes(item.type)) {
this.$store.dispatch('training/setRoleDeviceCode', item.deviceCode);
this.deviceCode = item.deviceCode;
this.setShowStation(item.deviceCode);
this.$store.dispatch('training/setPrdType', '01');
}
});
},
checkRoleChange(data) {
const stationRoleList = ['STATION_SUPERVISOR', 'STATION_ASSISTANT', 'STATION_MASTER', 'STATION_SIGNALER',
'STATION_PASSENGER', 'STATION_SWITCH_MAN', 'STATION_FACILITATOR', 'STATION_WORKER', 'DEVICE_MANAGER'];
// 'TRAIN_MASTER'
data.forEach(item => {
if ((item.messageType === 'PLAY_CHANGE' || item.messageType === 'ONLINE' ) && item.userId == this.userId && stationRoleList.includes(item.type)) {
// this.userRole = item.type || 'AUDIENCE';
this.$store.dispatch('training/setRoleDeviceCode', item.deviceCode);
this.$store.dispatch('training/setUserRole', item.type);
this.deviceCode = item.deviceCode;
// this.setShowStation(item.deviceCode);
this.setShowStation(item.deviceCode);
this.$store.dispatch('training/setPrdType', '01');
// this.setSimulationPrdType(this.centralizedStationMap[item.deviceCode]);
// this.$nextTick(() => {
// if (item.deviceCode && this.$store.state.training.prdType !== '09') { this.setCenter(item.deviceCode); }
// });
}
});
},
setShowStation(stationCode) {
const showStation = this.centralizedStationMap[stationCode];
const list = [];
const mapDevice = this.$store.state.map.mapDevice;
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, showStation);
this.$nextTick(()=>{
this.$jlmap.setCenter(showStation);
});
},
setCentralizedstationList(map) {
this.centralizedstationList = [];
(map.stationList || []).forEach(item => {
if (item.centralized) {
this.centralizedstationList.push({value: item.code, name: item.name});
this.centralizedStationMap[item.code] = item.code;
item.chargeStationCodeList && item.chargeStationCodeList.length && item.chargeStationCodeList.forEach(ele => {
this.centralizedStationMap[ele] = item.code;
});
}
});
// if (this.centralizedstationList.length && !this.showStation) {
// this.showStation = this.centralizedstationList[0].value;
// }
},
goRpManage() {
const routeData = this.$router.resolve({
path:'/bigTrainRunplanManage',
query:{
group: this.$route.query.group,
mapId:this.$route.query.mapId,
project: this.project,
prdType: this.$route.query.prdType,
lineCode:this.$route.query.lineCode,
// stationCode:this.$store.state.training.roleDeviceCode,
// token:getToken(),
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
// goDispatcherStation() {
// const routeData = this.$router.resolve({
// // path:'/bigTrainDispatcherStation',
// path:'/displayNew/demon',
// query:{
// group: this.$route.query.group,
// mapId:this.$route.query.mapId,
// project: this.project,
// prdType: this.$route.query.prdType,
// lineCode:this.$route.query.lineCode,
// newApi: this.$route.query.newApi,
// dispatcherStation:true,
// // stationCode:this.$store.state.training.roleDeviceCode,
// // token:getToken(),
// try: this.$route.query.try,
// token:getToken(),
// noPreLogout: true
// }
// });
// window.open(routeData.href, '_blank');
// },
// goDsManage() {
// const routeData = this.$router.resolve({
// path:'/dispatcherStationManage',
// query:{
// group: this.$route.query.group,
// mapId:this.$route.query.mapId,
// project: this.project,
// prdType: this.$route.query.prdType,
// lineCode:this.$route.query.lineCode,
// // stationCode:this.$store.state.training.roleDeviceCode,
// token:getToken(),
// noPreLogout: true
// }
// });
// window.open(routeData.href, '_blank');
// },
changeOperateMode() {
this.faultMode = !this.faultMode;
let mode = OperateMode.NORMAL;
if (this.faultMode) {
mode = OperateMode.FAULT;
}
this.$store.dispatch('training/changeOperateMode', { mode: mode });
},
// changeDirectiveMode() { // 调整指令模式 (暂时不使用 等项目更新 在使用)
// this.directiveMode = !this.directiveMode;
// let mode = OperateMode.NORMAL;
// if (this.directiveMode) {
// mode = OperateMode.DIRECTIVE;
// }
// this.$store.dispatch('training/changeOperateMode', { mode: mode });
// },
speedChange(val) {
timesSpeedPlayback(this.$route.query.group, val).then(resp => {
this.$message.success(`设置${val}倍速成功!`);
}).catch(e => {
this.$message.error('设置倍速失败！');
});
},
setFault() {
this.$refs.faultChoose.doShow();
},
loadRunPlan() {
this.$refs.runPlanLoad.doShow();
},
viewRunPlan() {
this.$refs.runPlanView.doShow();
},
viewRunQuest() {
this.$refs.addQuest.doShow();
},
selectQuest(row, id, mapLocation, roleName) {
this.$emit('selectQuest', {row, id, mapLocation, roleName});
},
runPlanEditShow() {
generateRunPlanInfoSync(this.$route.query.mapId).then(resp => {
const routeData = this.$router.resolve({
path:'/plan/newTool',
query:{
mapId:this.$route.query.mapId,
lineCode:this.$route.query.lineCode,
token:getToken(),
project: this.project,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
});
},
goIbp() {
const deviceCode = this.$refs.selectStation.showStation;
getIbpInfoByStation(this.$route.query.mapId, deviceCode).then(resp => {
if (resp.data) {
const routeData = this.$router.resolve({
path:`/ibpShow`,
query:{
lineCode: this.$route.query.lineCode,
mapId: this.$route.query.mapId,
group: this.$route.query.group,
stationCode: deviceCode,
loadAll: true,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
} else {
this.$messageBox('本车站暂无IBP盘数据！');
}
}).catch((error) => {
if (error.code == '10007') {
this.$messageBox('本车站暂无IBP盘数据！');
} else {
this.$message.error('获取IBP盘数据异常');
}
});
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.schema {
z-index: 36;
display: inline;
position: absolute;
right: 5px;
}
/deep/ .el-button+.el-button {
margin-left: 0px;
}
</style>

127
src/views/newMap/displayNew/menuSystemTime.vue
View File

@ -1,127 +0,0 @@
<template>
<div v-if="isShowSystemTime" class="display-card" :style="{top: top+'px', right: newRight+'px'}">
<template v-if="pause">
<span class="display-pause">{{ $t('display.systemTime.timePause') }}</span>
</template>
<template v-else>
<system-time
class="display-time"
:time="time"
/>
<div v-if="isShowDate" style="width: 80px;height: 58px;float: right;box-shadow: 0 0 5px #eee;">
<div class="display-date-box">{{ dateString }}</div>
<div class="display-date-box">{{ dayString }}</div>
</div>
</template>
</div>
</template>
<script>
import SystemTime from '@/views/components/systemTime/index';
import { timestampFormat } from '@/utils/date';
// 顶部时间栏显示
export default {
name: 'MenuSystemTime',
components: {
SystemTime
},
props: {
offset: {
type: Number,
required: true
}
},
data() {
return {
time: '00:0000',
dateString: '00/00/00',
dayString: ''
};
},
computed: {
isShowSystemTime() {
return this.$route.params.mode == 'demon' ||
this.$route.params.mode == 'dp' ||
this.$route.params.mode == 'plan' ||
this.$route.params.mode == 'script' ||
this.$route.params.mode == 'practice' ||
!this.$route.params.mode;
},
pause() {
return this.$store.state.scriptRecord.simulationPause;
},
isDisplay() {
return this.$route.path.includes('display') || this.$route.path.includes('scriptDisplayNew');
},
isShowDate() { // 西安一 三号线
return (this.$route.query.lineCode == 10 || this.$route.query.lineCode == 11) && this.isDisplay;
},
top() {
if (this.isShowDate) {
return this.$route.query.prdType === '05' ? 5 : this.offset - 10;
} else {
return this.$store.state.training.prdType === '09' ? this.offset + 20 : this.offset;
}
},
newRight() {
return this.isShowDate ? this.$store.state.config.width - 420 : this.$store.state.config.width / 2 - 55;
}
},
watch: {
'$store.state.training.initTime': function (timestamp) {
this.initDate(timestamp);
},
'$store.state.socket.simulationTimeSync': function (timestamp) { // 仿真时间更新
this.initDate(timestamp)
}
},
mounted() {
const initTime = this.$store.state.training.initTime;
if (initTime > 0) {
this.initDate(initTime);
}
},
methods: {
initDate(timestamp) {
this.time = timestampFormat('HH:mmss', timestamp)
this.dateString = timestampFormat('YYYY/MM/DD', timestamp)
this.dayString = timestampFormat('dddd', timestamp).split('').join(' ')
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.display-card {
z-index: 9;
display: inline;
position: absolute;
}
.display-pause {
font-size: 21px;
font-weight: bold;
color: yellow;
}
.display-time{
padding: 3px 5px;
border: 1px solid rgba(255,255,255,.2);
box-shadow: 0 2px 12px 0 rgba(255,255,255,.3);
border-radius: 3px;
}
.display-card .el-row {
line-height: 32px !important;
}
.display-date-box{
height: 29px;
line-height: 29px;
background: #404040;
color: #1DEA1E;
text-align: center;
font-size: 16px;
}
</style>

174
src/views/newMap/displayNew/menuTrainList.vue
View File

@ -1,174 +0,0 @@
<template>
<div class="menuTrainListOut" :class="{'xian_01' : lineCode == '11', 'active': drawer}">
<div class="menuTrainListBtn" @click="clickBtn">列车</div>
<div :show-close="false" class="menuTrainList_box" style="height: 100%;">
<div v-if="lineCode=='10'||lineCode=='11'" class="menuTrainList">
<div class="bottomTrainListInfo">下行列车详细信息</div>
<el-table :data="bottomTrainList" height="45%" :highlight-current-row="true" @row-click="selectTrain">
<el-table-column property="groupNumber" label="车组号" width="70" />
<el-table-column property="tripNumber" label="车次号" width="70" />
<el-table-column property="destinationCode" label="目的地号" width="100" />
<el-table-column property="serviceNumber" label="表号" width="70" />
<el-table-column property="dt" label="早晚点" width="70">
<template slot-scope="scope">
<div>{{ covert(scope.row.dt) }}</div>
</template>
</el-table-column>
</el-table>
<div class="topTrainListInfo">上行列车详细信息</div>
<el-table :data="topTrainList" height="45%" :highlight-current-row="true" style="border-radius:0px 0px 0px 5px;" @row-click="selectTrain">
<el-table-column property="groupNumber" label="车组号" width="70" />
<el-table-column property="tripNumber" label="车次号" width="70" />
<el-table-column property="destinationCode" label="目的地号" width="100" />
<el-table-column property="serviceNumber" label="表号" width="70" />
<el-table-column property="dt" label="早晚点" width="70">
<template slot-scope="scope">
<div>{{ covert(scope.row.dt) }}</div>
</template>
</el-table-column>
</el-table>
</div>
<div v-else class="menuTrainList">
<el-table :data="trainList" height="100%" :highlight-current-row="true" style="border-radius:5px 0px 0px 5px;" @row-click="selectTrain">
<el-table-column property="groupNumber" label="车组号" width="130" />
<el-table-column property="tripNumber" label="车次号" width="130" />
<el-table-column property="serviceNumber" label="表号" width="130" />
</el-table>
</div>
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex';
export default {
name: 'MenuTrainList',
data() {
return {
drawer: false,
trainList:[],
oldDevice: null,
topTrainList:[],
bottomTrainList:[]
};
},
computed: {
...mapGetters('map', [
'map',
'mapConfig'
]),
lineCode() {
return this.$route.query.lineCode;
}
},
watch:{
'$store.state.map.activeTrainListUpdate': function (val) {
if (val) {
const activeTrainList = this.$store.state.map.activeTrainList;
if (this.lineCode == '10' || this.lineCode == '11') {
this.topTrainList = [];
this.bottomTrainList = [];
activeTrainList.forEach((trainCode)=>{
// train.serviceNumber != '' && train.serviceNumber != undefined &&
const train = this.$store.getters['map/getDeviceByCode'](trainCode);
let isUpDirection;
if (this.mapConfig.upRight) {
isUpDirection = train.right;
} else if (!this.mapConfig.upRight) {
isUpDirection = !train.right;
}
if (train && isUpDirection && train.sectionCode) {
this.topTrainList.push(train);
} else if (train && !isUpDirection && train.sectionCode) {
this.bottomTrainList.push(train);
}
});
} else {
this.trainList = [];
activeTrainList.forEach((trainCode)=>{
const train = this.$store.getters['map/getDeviceByCode'](trainCode);
if (train && train.sectionCode) {
this.trainList.push(train);
}
});
}
} else {
this.topTrainList = [];
this.bottomTrainList = [];
this.trainList = [];
}
}
},
mounted() {
},
methods:{
clickBtn() {
if (this.drawer) {
this.drawer = false;
} else {
this.drawer = true;
}
},
selectTrain(row, column, event) {
// 设置显示中心
this.$jlmap.setCenter(row.code);
},
covert(data) {
const absData = Math.abs(data);
const hours = Math.floor(absData / 3600);
let min = Math.floor((absData % 3600) / 60);
let seconds = (absData % 3600) % 60;
min = min > 9 ? min : '0' + min;
seconds = seconds > 9 ? seconds : '0' + seconds;
const time = hours + ':' + min + ':' + seconds;
return data == 0 ? '00:00:00' : (data > 0 ? time + 'E' : time + 'L');
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.menuTrainListOut{
position: absolute;
right: 0;
top: 20%;
height: 60%;
transform: translateX(400px);
transition: all 0.4s;
&.active{
transform: translateX(0px);
}
}
.menuTrainListBtn{
background: #fff;
text-align: center;
border-radius: 6px 0px 0px 6px;
position: absolute;
top: 45%;
z-index: 2;
transform: translateX(-23px);
cursor: pointer;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
justify-content: center;
padding: 7px 4px;
width: 23px;
}
.menuTrainList_box{
height: 100%;
.menuTrainList{
width: 400px;
height: 100%;
border-radius: 10px 0px 0px 10px;
background: #fff;
}
}
.topTrainListInfo,
.bottomTrainListInfo{
padding: 10px 10px;
background: #cde2ef;
font-size: 13px;
border-radius: 5px 0px 0px 0px;
}
</style>

541
src/views/newMap/displayNew/practiceDisplay.vue
View File

@ -1,541 +0,0 @@
<template>
<div class="map-view" :style="{width: canvasWidth+'px',height:'100%',position:'absolute',overflow:'hidden'}">
<div v-show="maskOpen" class="mask" :style="{'width': maskWidth}" />
<jlmap-visual ref="jlmapVisual" />
<div class="menudown">
<el-button-group class="button-group-box">
<el-button type="success" :disabled="isDisable" size="small" @click="selectBeginTime">{{ $t('display.demon.drivingByPlan') }}</el-button>
<el-button type="danger" size="small" @click="end">{{ $t('display.demon.initialize') }}</el-button>
<el-button type="primary" size="small" @click="back">退出</el-button>
</el-button-group>
</div>
<el-button-group ref="button_group_box" class="button_group">
<!-- {{ $t('joinTraining.runGraphPreview') }} -->
<el-button v-if="running" size="small" @click="changeFlowData">切换客流数据</el-button>
<!-- <el-button v-if="running" size="small" @click="viewRunPlan">运行图视图</el-button> -->
<el-button v-if="running" size="small" @click="bigLPFStrategy">大客流策略</el-button>
<!-- 运行图加载 -->
<el-button size="small" @click="dispatcherWorkStation">ATS行调工作站</el-button>
<!-- <el-button v-if="!running" size="small" type="warning" @click="loadRunPlan">{{ $t('joinTraining.runGraphLoading') }}</el-button> -->
<el-button size="small" @click="distribute">权限分发</el-button>
<el-button v-if="messageBoard" size="small" @click="messageBoardShow">留言板</el-button>
<el-button size="small" @click="contectUs">联系方式</el-button>
</el-button-group>
<div class="trainExample">
<div class="currentFlowDataName">{{ currentFlowDataName }}</div>
<div class="trainExampleL">
<div class="trainExampleName">车站 颜色图例</div>
<div class="eachTrainExample">
<span class="smallExample" />
<span class="eachTrainExampleName">0 ~ 400</span>
</div>
<div class="eachTrainExample">
<span class="mediumExample" />
<span class="eachTrainExampleName">400 ~ 800</span>
</div>
<div class="eachTrainExample">
<span class="bigExample" />
<span class="eachTrainExampleName">800及以上</span>
</div>
</div>
<div class="trainExampleR">
<div class="trainExampleName">列车 颜色图例</div>
<div class="eachTrainExample">
<span class="smallExample" />
<span class="eachTrainExampleName">0 ~ 400</span>
</div>
<div class="eachTrainExample">
<span class="mediumExample" />
<span class="eachTrainExampleName">400 ~ 1000</span>
</div>
<div class="eachTrainExample">
<span class="bigExample" />
<span class="eachTrainExampleName">1000及以上</span>
</div>
</div>
</div>
<distribute-draft ref="distribute" @QrCodeShow="QrCodeShow" />
<qr-code ref="qrCode" />
<menu-system-time ref="menuSystemTime" :offset="15" :group="group" />
<contect-us ref="contectUs" />
<run-plan-Load ref="runPlanLoad" :group="group" />
<set-time ref="setTime" @ConfirmSelectBeginTime="start" />
<el-dialog
title="切换客流数据"
:visible.sync="flowDataShow"
top="150px"
width="400px"
:before-do-close="flowDataClose"
:close-on-click-modal="false"
:z-index="5000"
>
<div>
<el-form ref="ruleForm" label-width="100px">
<el-form-item label="客流数据:" prop="role">
<el-select v-model="currentFlowDataId" placeholder="请选择客流数据" @change="changeData">
<el-option
v-for="item in flowDataList"
:key="item.id"
:label="item.name==currentFlowDataName?item.name+' [运行中]':item.name"
:value="item.id"
/>
</el-select>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="flowDataClose">{{ $t('global.cancel') }}</el-button>
<el-button type="primary" :disabled="isDisabled" :loading="loading" @click="confirmFlowData">{{ $t('global.confirm') }}</el-button>
</span>
</el-dialog>
</div>
</template>
<script>
import JlmapVisual from '@/views/newMap/jlmapNew/index';
import DistributeDraft from '@/views/components/limits/distribute';
import QrCode from '@/components/QrCode';
import ContectUs from '@/views/newMap/displayNew/dispatherContest/contectUs';
import RunPlanLoad from './demon/runPlanLoad';
import SetTime from './demon/setTime';
import { PermissionType } from '@/scripts/ConstDic';
import { loadMapDataById } from '@/utils/loaddata';
import { clearSimulation, getSimulationInfoNew, ranAsPlan, exitRunPlan, getPassengerFlowData, changePassengerFlowData } from '@/api/simulation';
import { creatSubscribe, clearSubscribe, displayTopic, LPFTopic} from '@/utils/stomp';
import MenuSystemTime from '@/views/newMap/displayNew/menuSystemTime';
import { getToken } from '@/utils/auth';
import { mapGetters } from 'vuex';
import { getPostByProjectCode } from '@/api/learn';
import { ProjectCode } from '@/scripts/ProjectConfig';
export default {
name:'PracticeDisplay',
components: {
JlmapVisual,
MenuSystemTime,
QrCode,
DistributeDraft,
ContectUs,
SetTime,
RunPlanLoad
},
data() {
return {
maskOpen: false,
flowDataShow:false,
maskWidth: '100%',
group:'',
openWindow:null,
openBigLPF:null,
flowDataList:[],
currentFlowDataName:'',
currentFlowDataId:'',
isDisabled:false,
loading:false,
messageBoard: false
};
},
computed:{
...mapGetters([
'canvasWidth'
]),
mapId() {
return this.$route.query.mapId;
},
width() {
return this.$store.state.app.width;
},
height() {
return this.$store.state.app.height;
},
running() {
return this.$store.state.training.started;
},
isDisable() {
return this.$store.state.training.started;
}
},
watch:{
'$store.state.map.mapViewLoadedCount':function() {
this.$store.dispatch('map/setTrainWindowShow', false);
// this.$jlmap.off('zoom');
if (this.group) {
getPassengerFlowData(this.mapId).then(res=>{
this.flowDataList = res.data;
const currentFlowData = res.data.find(each=>{ return each.initial; });
if (currentFlowData) {
this.currentFlowDataName = currentFlowData.name;
this.currentFlowDataId = currentFlowData.id;
}
this.subscribe();
});
}
},
'$store.state.app.windowSizeCount': function() { // 窗口缩放
this.setWindowSize();
},
'$store.state.socket.equipmentStatus': function (val) {
if (val.length && this.$route.query.group) {
this.statusMessage(val);
}
},
'$store.state.socket.simulationStart': function(val) {
this.$store.dispatch('training/simulationStart').then(() => {
this.$store.dispatch('map/setShowCentralizedStationNum');
});
},
'$store.state.socket.standPfiNum':function(val) {
if (val) {
// console.log(val, 'standPfiNum');
const stationNumList = val;
stationNumList.forEach(stationNum=>{
stationNum.deviceType = 'STAND';
stationNum.code = stationNum.standCode;
});
this.$store.dispatch('training/updateMapState', stationNumList);
}
},
'$store.state.socket.trainPfiNum':function(val) {
if (val) {
// console.log(val, 'trainPfiNum');
const trainNumList = this.$store.state.socket.trainPfiNum;
trainNumList.forEach(stationNum=>{
stationNum.deviceType = 'TRAIN';
});
this.$store.dispatch('training/updateMapState', trainNumList);
}
},
'$store.state.socket.trainPfiBL':function(val) {
if (val) {
const trainNum = this.$store.state.socket.trainPfiBL;
// const device = this.$store.getters['map/getDeviceByCode'](trainNum.code);
trainNum.deviceType = 'TRAIN';
// console.log(trainNum, device, device.num, trainNum.in, trainNum.out, 'changed');
trainNum.num = trainNum.remain;
// device.num + trainNum.in - trainNum.out;
// console.log(trainNum.num, 'changeder');
this.$store.dispatch('training/updateMapState', [trainNum]);
}
},
'$store.state.socket.isFirst':function(val) {
if (val) {
const header = { group: this.group || '', 'X-Token': getToken() };
creatSubscribe(`${LPFTopic}\/${this.$route.query.group}`, header);
}
}
},
beforeDestroy() {
this.$store.dispatch('map/mapClear');
if (this.group) {
clearSimulation(this.group);
this.clearSubscribe();
this.$store.dispatch('socket/resetTrainPassagerNum');
this.$store.dispatch('socket/setIsFirst', false);
}
},
mounted() {
this.group = this.$route.query.group;
this.setWindowSize();
this.initLoadData();
getPostByProjectCode(ProjectCode[this.$route.query.project]).then(resp => {
if (resp.data) {
this.messageBoard = true;
}
}).catch(() => {
this.$message.error('获取留言板信息失败');
});
},
methods:{
async initLoadData() { // 加载地图数据
if (this.group) {
this.loadSimulationInfo();
loadMapDataById(this.mapId, 'simulation');
}
},
// 缩放设置
setWindowSize() {
const width = this.width;
const height = this.height;
this.$store.dispatch('config/resize', { width, height });
},
async back() {
// this.isGoback = true;
clearSimulation(this.group).then(res=>{
this.$store.dispatch('training/over').then(() => {
this.$store.dispatch('LogOut').then(() => {
// this.$store.dispatch('training/reset');
// this.$store.dispatch('map/mapClear');
location.reload();
});
});
});
},
async statusMessage(list) {
await this.$store.dispatch('training/updateMapState', list);
await this.$store.dispatch('socket/setEquipmentStatus');
},
async subscribe() {
this.clearSubscribe();
const header = { group: this.group || '', 'X-Token': getToken() };
creatSubscribe(`${displayTopic}\/${this.$route.query.group}`, header);
// await this.$store.dispatch('training/setHasSubscribed');
},
clearSubscribe() {
clearSubscribe(`${LPFTopic}\/${this.group}`);
clearSubscribe(`${displayTopic}\/${this.group}`);
},
async loadSimulationInfo() {
const resp = await getSimulationInfoNew(this.group);
if (resp && resp.code == 200 && resp.data) {
if (!resp.data.dataError) {
this.$store.dispatch('scriptRecord/updateSimulationPause', resp.data.pause); // 是否暂停判断
this.$store.dispatch('training/setInitTime', resp.data.systemTime);
// this.$store.dispatch('training/countTime');
this.$store.dispatch('runPlan/setRunPlanInfo', resp.data.runPlan);
this.planRunning = resp.data.planRunning;
if (resp.data.planRunning) {
this.$store.commit('training/start');
}
} else {
this.$messageBox('此地图数据正在维护中,无法运行！');
}
this.dataError = resp.data.dataError;
}
},
distribute() {
if (this.$refs) {
this.$refs.distribute.doShow({PermissionType:PermissionType.SIMULATION, mapId: this.$route.query.mapId, prdType: this.$route.query.prdType});
}
},
QrCodeShow(data) {
if (this.$refs && data) {
this.$refs.qrCode.doShow(data);
}
},
flowDataClose() {
this.flowDataShow = false;
},
confirmFlowData() {
if (this.currentFlowDataId) {
this.loading = true;
changePassengerFlowData(this.group, this.currentFlowDataId).then(res=>{
this.$store.dispatch('socket/resetTrainPassagerNum');
// this.$store.dispatch('map/mapClear');
this.flowDataShow = false;
const currentFlowData = this.flowDataList.find(each=>{ return each.id == this.currentFlowDataId; });
if (currentFlowData) { this.currentFlowDataName = currentFlowData.name; }
this.loading = false;
}).catch(error=>{
this.loading = false;
this.$messageBox('切换客流数据失败');
console.log(error.message);
});
} else {
this.$messageBox('当前的客流数据不存在');
}
},
messageBoardShow() {
// this.$refs.messageBoard.doShow();
const routeData = this.$router.resolve({
path:'/messageBoard',
query:{
project: this.$route.query.project,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
contectUs() {
this.$refs.contectUs.doShow();
},
viewRunPlan() {
const routeData = this.$router.resolve({
path:'/planSchedule/window',
query:{
mapId:this.$route.query.mapId,
group:this.$route.query.group,
lineCode: this.$route.query.lineCode,
project: this.$route.query.project,
noPreLogout: true,
initTime: this.$store.state.training.initTime
}
});
window.open(routeData.href, '_blank');
},
dispatcherWorkStation() {
if (this.openWindow) {
this.openWindow.close();
}
const routeData = this.$router.resolve({
path:'/display/demon',
query:{
mapId:this.$route.query.mapId,
group:this.$route.query.group,
prdType: this.$route.query.prdType,
lineCode: this.$route.query.lineCode,
project: this.$route.query.project,
noPreLogout: true,
goodsId:'',
try:'0'
}
});
this.openWindow = window.open(routeData.href);
},
/** 大客流策略 */
bigLPFStrategy() {
if (this.openBigLPF) {
this.openBigLPF.close();
}
const routeData = this.$router.resolve({
path:'/bigLPFStrategy',
query:{
mapId:this.$route.query.mapId,
group:this.$route.query.group,
project: this.$route.query.project,
noPreLogout: true
}
});
this.openBigLPF = window.open(routeData.href);
},
loadRunPlan() {
this.$refs.runPlanLoad.doShow();
},
selectBeginTime() {
this.$refs.setTime.doShow();
},
changeFlowData() {
this.flowDataShow = true;
this.isDisabled = true;
const currentFlowData = this.flowDataList.find(each=>{ return each.name == this.currentFlowDataName; });
if (currentFlowData) { this.currentFlowDataId = currentFlowData.id; }
},
changeData(id) {
const currentFlowData = this.flowDataList.find(each=>{ return each.id == id; });
if (currentFlowData && currentFlowData.name == this.currentFlowDataName) {
this.isDisabled = true;
} else {
this.isDisabled = false;
}
},
end() {
exitRunPlan(this.group).then(() => {
this.$store.dispatch('training/over').then(() => {
this.$store.dispatch('training/setMapDefaultState').then(() => {
this.$store.dispatch('map/clearJlmapTrainView');
this.$store.dispatch('map/resetActiveTrainList', false);
this.$store.dispatch('map/setTrainWindowShow', false);
});
});
}).catch(() => {
this.$messageBox(this.$t('display.demon.endSimulationFail'));
});
},
start(model) { // 开始仿真
const data = {
time: model.initTime
};
if (this.$route.query.prdType === '04') {
data.loadNumber = model.loadNum;
}
ranAsPlan(data, this.group).then(res => {
// this.$store.dispatch('training/setInitTime', model.initTime);
this.$store.dispatch('training/setInitTime', model.timestamp);
}).catch(error => {
let message = '';
switch (error.code) {
case '5001':
message = this.$t('error.mapDataError');
break;
case '5002':
message = this.$t('error.runningChartDataError');
break;
case '5003':
message = this.$t('error.runningChartIsNotLoaded');
break;
case '5004':
message = this.$t('error.runningDataError');
break;
case '5000':
message = this.$t('error.systemError');
break;
case '4000':
message = this.$t('error.simulationDoesNotExist');
break;
case '4001':
message = this.$t('error.simulationOperationIsNotDefined');
break;
case '4002':
message = this.$t('error.simulationOperationProcessingMethodNotFound');
break;
case '4003':
message = this.$t('error.simulationOperationFailed');
break;
case '4004':
message = this.$t('error.operationConflict');
break;
default:
message = '按计划行车异常,请退出重试!';
// this.$messageBox('按计划行车异常,请退出重试!');
break;
}
this.$messageBox(message + '，' + this.$t('error.startSimulationFailed'));
});
}
}
};
</script>
<style lang="scss" scoped>
.display-draft {
position: absolute;
float: right;
right: 5px;
top: 5px;
}
.currentFlowDataName{
padding-bottom: 30px;
padding-left: 5px;
padding-top: 5px;
font-size: 18px;
}
.trainExample{
position: absolute;
width: 360px;
padding: 10px;
left: 20px;
bottom: 40px;
color: #fff;
border: 1px #fff solid;
border-radius: 5px;
background: #000;
}
.trainExampleName{margin-bottom: 10px;}
.eachTrainExample{margin-top: 5px;}
.smallExample,.mediumExample,.bigExample{
width: 50px;
height: 20px;
display: inline-block;
}
.eachTrainExampleName{
vertical-align: top;
line-height: 23px;
margin-left: 8px;
}
.smallExample{background: #29a909;}
.mediumExample{background: #ffa500;}
.bigExample{background: #F00;}
.trainExampleL{
float: left;
display: inline-block;
margin-right: 35px;
margin-left: 10px;
}
.menudown{
position: absolute;
right: 10px;
bottom: 15px;
}
.trainExampleR{display: inline-block;}
.button_group{
position: absolute;
left: 10px;
top: 15px;
}
</style>

1348
src/views/newMap/displayNew/scriptDisplay/component/covertOperation.js
View File

File diff suppressed because it is too large Load Diff

132
src/views/newMap/displayNew/scriptDisplay/component/scriptTip.vue
View File

@ -1,132 +0,0 @@
<template>
<div v-if="scriptTipMessage!=''" class="scriptTipMessage" :style="{top:offset + 55 +'px'}">{{ scriptTipMessage }}</div>
</template>
<script>
import {covertOperate} from './covertOperation.js';
import LangStorage from '@/utils/lang';
export default {
name:'ScriptTip',
props: {
offset: {
type: Number,
required: true
}
},
data() {
return {
scriptTipMessage:''
};
},
computed: {
memberData() {
return this.$store.state.training.memberData;
}
},
watch:{
// 剧本提示
'$store.state.socket.simulationScriptTip':function(val, old) {
if (val && this.$store.state.training.scriptOperationType === 'teach') {
if (val.type == 'Accept_Conversation_Invitation') {
this.scriptTipMessage = '请接受会话邀请';
} else if (val.type == 'Conversation') {
this.scriptTipMessage = '请说：' + val.content.replace(/%s/g, '[当前时间]');
} else if (val.type == 'Operation') {
this.scriptTipMessage = covertOperate(val.operationType, val.operationParamMap);
// this.scriptTipMessage = '请找到' + deviceName + '，执行【' + operateName.label + '】操作';
} else if (val.type == 'Exit_Conversation') {
this.scriptTipMessage = '请结束当前会话';
} else if (val.type == 'Start_Conversation' ) {
const inviteMember = [];
this.$emit('allowCreatCoversition');
if (val.communicationObject) {
if (val.communicationObject == 'ALL_STATION') {
inviteMember.push('所有车站');
} else if (val.communicationObject == 'ALL_TRAIN') {
inviteMember.push('所有司机');
}
} else {
val.conversationMemberIds.forEach(id=>{
if (val.memberId != id) {
inviteMember.push((this.memberData[id] || {labelName: ''}).labelName);
}
});
}
this.scriptTipMessage = '请创建会话,选择' + inviteMember.toString();
} else if (val.type == 'Command') {
const targetName = this.memberData[val.commandInitiateVO.targetMemberId];
const CommandList = {
Drive_Ahead:'确认运行至前方站',
Route_Block_Drive:'进路闭塞法行车',
Switch_Hook_Lock: '道岔钩锁',
Drive_Through_The_Red_Light:'越红灯行驶',
Drive_Through_The_Guide_Signal:'越引导信号行驶',
Open_Or_Close_Door:'开关门',
Set_Speed_Limit:'设置限速',
Turn_Direction: '换端',
Drive_To: '驾驶至',
Apply_URM_Mode: '转URM模式',
Apply_RM_Mode: '转RM模式',
Apply_CM_Mode: '转CM模式',
Apply_AM_Mode: '转AM模式'
};
this.scriptTipMessage = '请对【' + targetName.labelName + '】下达【' + CommandList[val.commandInitiateVO.commandType] + '】指令';
} else if (val.type == 'Drive') {
if (val.targetSectionCode) {
const section = this.$store.getters['map/getDeviceByCode'](val.targetSectionCode);
if (section && section.name) {
this.scriptTipMessage = '请把车开到区段' + section.name;
}
}
}
}
},
'$store.state.socket.simulationScriptTipFinish':function(val, old) {
if (val && this.$store.state.training.scriptOperationType != 'test') {
// 剧本某一步骤完成消息推送
this.scriptTipMessage = '';
this.tipInfo({ message: LangStorage.getLang() == 'en' ? "Correct operation! That's great!" : '操作正确！真棒！', color: 'green' });
}
},
'$store.state.socket.simulationScriptTipError': function(val, old) {
if (val && this.$store.state.training.scriptOperationType != 'test') {
this.tipInfo({ message: LangStorage.getLang() == 'en' ? "Correct operation! That's great!" : '操作错误！', color: 'red' });
}
}
},
methods:{
resetScriptTip() {
this.scriptTipMessage = '';
},
tipInfo(opt) {
if (opt && opt.hasOwnProperty('color') && opt.hasOwnProperty('message')) {
const h = this.$createElement;
this.$notify({
title: this.$t('global.tips'),
duration: 3000,
offset: 100,
message: h('i', { style: 'color:' + opt.color }, opt.message)
});
}
}
}
};
</script>
<style lang="scss" scoped>
.scriptTipMessage{
position: absolute;
width: 400px;
padding: 15px 15px 20px 15px;
background: rgba(255,255,255,0.97);
top: 100px;
left: 50%;
border-radius: 8px;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
color: #000;
line-height: 180%;
// z-index: 1501;
z-index: 15;
font-size: 14px;
}
</style>

68
src/views/newMap/displayNew/scriptDisplay/component/selectRole.vue
View File

@ -1,68 +0,0 @@
<template>
<el-dialog
v-dialogDrag
:title="$t('display.script.roleSelect')"
:visible.sync="roleShow"
top="50px"
width="350px"
:before-do-close="roleDoClose"
:close-on-click-modal="false"
:z-index="5000"
>
<div>
<el-form ref="ruleForm" :model="form" label-width="50px">
<el-form-item :label="$t('display.script.role')" prop="role">
<el-select v-model="form.type" :placeholder="$t('display.script.pleaseSelect')">
<el-option
v-for="item in memberList"
:key="item.id"
:label="item.label"
:value="item.id"
:disabled="item.disabled"
/>
</el-select>
</el-form-item>
</el-form>
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="roleDoClose">{{ $t('global.cancel') }}</el-button>
<el-button type="primary" @click="confirm">{{ $t('global.confirm') }}</el-button>
</span>
</el-dialog>
</template>
<script>
export default {
name:'SelectRole',
props:{
memberList:{
type: Array,
default() {
return [];
}
}
},
data() {
return {
roleShow:false,
form: {
type: ''
}
};
},
methods:{
roleDoClose() {
this.$refs['ruleForm'].resetFields();
this.roleShow = false;
},
doShow() {
this.roleShow = true;
},
confirm() {
const role = this.memberList.find(elem=>{ return elem.id == this.form.type; });
this.$emit('selectRole', role);
this.roleDoClose();
}
}
};
</script>

413
src/views/newMap/displayNew/scriptDisplay/scriptPreview/index.vue
View File

@ -1,413 +0,0 @@
<template>
<div class="main" :style="{width: canvasWidth+'px'}">
<div v-show="panelShow" :panelShow="panelShow">
<transition name="el-zoom-in-bottom">
<map-system-draft v-show="userRole != 'DISPATCHER'" ref="mapCanvas" @back="back" />
</transition>
<script-button-group
ref="scriptButtonGroup"
:offset="offset"
:text-status-height="textStatusHeight"
:group="group"
:user-role.sync="userRole"
@viewScriptRoles="viewScriptRoles"
@viewRunPlan="viewRunPlan"
@loadRunPlan="loadRunPlan"
@setFault="setFault"
@setMemberData="setMemberData"
@setMemberList="setMemberList"
@clearAllData="clearAllData"
@setTreeData="setTreeData"
@changeScriptMode="changeScriptMode"
@setMapLocation="setMapLocation"
@changeShowMap="changeShowMap"
@quitQuest="quitQuest"
/>
<div v-if="lineCode === '16'" v-show="userRole === 'DISPATCHER' && !showMap">
<dispatcher-station ref="dispatcherStation" @changeShowMap="changeShowMap" />
</div>
<script-preview-chat ref="chatbox" :group="group" :user-role="userRole" :offset="offset" />
<menu-system-time ref="menuSystemTime" :offset="offset" :group="group" />
</div>
<select-role ref="selectRole" :member-list="memberList" @selectRole="selectRole" />
<run-plan-Load ref="runPlanLoad" :group="group" />
<run-plan-view ref="runPlanView" :group="group" />
<fault-choose ref="faultChoose" :group="group" :offset="offset" />
</div>
</template>
<script>
// 草稿预备预览
import { getToken } from '@/utils/auth';
import RunPlanLoad from '@/views/newMap/displayNew/demon/runPlanLoad';
import RunPlanView from '@/views/newMap/displayNew/demon/runPlanView';
import SelectRole from '../component/selectRole';
import ScriptPreviewChat from './scriptPreviewChat.vue';
import MapSystemDraft from '@/views/newMap/mapsystemNew/index';
import ScriptButtonGroup from './scriptButtonGroup';
import FaultChoose from '@/views/newMap/displayNew/demon/faultChoose';
import MenuSystemTime from '@/views/newMap/displayNew/menuSystemTime';
import { mapGetters } from 'vuex';
import { loadDraftScriptNew } from '@/api/designPlatform';
import Vue from 'vue';
import { ScriptMode } from '@/scripts/ConstDic';
import ConstConfig from '@/scripts/ConstConfig';
// import DispatcherStation from '@/views/newMap/jointTrainingNew/dispatcherStation.vue';
export default {
name: 'DisplayDraft',
components: {
RunPlanLoad,
RunPlanView,
ScriptPreviewChat,
MapSystemDraft,
FaultChoose,
MenuSystemTime,
SelectRole,
DispatcherStation,
ScriptButtonGroup
},
data() {
return {
trainingObj: {},
timeDemonNum: 0,
offset: 15,
textStatusHeight: 0,
panelShow: true,
memberData:[],
mapLocation:{},
showStation: '',
group: '',
lineCode: '',
prdTypeMap: {
'01': '01', // 现地 => 现地
'02': '02', // 行调 => 行调
'04': '02', // 司机 => 行调
'05': '' // 派班 => null
},
userRole:'',
showMap: false,
isDrive: this.prdType == '04',
treeData:[],
memberList:[],
centralizedstationList: [],
centralizedStationMap: {},
scriptMode: ScriptMode.TEACH
};
},
computed: {
...mapGetters([
'canvasWidth',
'canvasHeight'
]),
...mapGetters('map', [
'map',
'stationList'
]),
...mapGetters('config', [
'canvasId'
]),
mapId() {
return this.$route.query.mapId;
},
prdType() {
return this.$store.state.training.prdType;
}
},
watch: {
'$store.state.config.menuBarLoadedCount': function (val) {
this.setPosition();
},
'$store.state.map.mapViewLoadedCount': function (val) {
this.switchStationMode(this.showStation);
},
'$store.state.training.centerStationCode': function(code) {
if (code) {
this.showStation = code;
}
},
'$store.state.map.map': function (map) {
if (map) {
this.setCentralizedstationList(map); // 获取集中站列表
}
},
'$store.state.training.prdType':function(val) {
this.setPosition();
// this.setMode();
}
},
beforeDestroy() {
this.$store.dispatch('training/setRoles', '');
this.$store.dispatch('training/setPrdType', '');
this.clearAllData();
},
created() {
this.group = this.$route.query.group || '';
this.lineCode = this.$route.query.lineCode;
},
methods: {
changeShowMap(flag) {
this.showMap = flag;
},
back() {
this.$refs.scriptButtonGroup.back();
},
changeScriptMode(scriptMode) {
this.scriptMode = scriptMode;
},
async selectRole(role) {
try {
const res = await loadDraftScriptNew(role.id, this.group, this.scriptMode);
if (res && res.code == 200) {
// if (this.querymapLocation) {
const newMapLocation = {'offsetX': this.mapLocation.x, 'offsetY': this.mapLocation.y, 'scaleRate': this.mapLocation.scale};
Vue.prototype.$jlmap.setOptions(newMapLocation);
// }
}
this.$store.dispatch('scriptRecord/updateAudioPlay', false);
this.$store.dispatch('scriptRecord/updateBgSet', true);
this.$refs.scriptButtonGroup.setIsscriptRun(true);
if (role.type) {
(this.$store.state.training.memberData[role.id] || {}).userId = this.$store.state.user.id;
(this.$store.state.training.memberData[role.id] || {}).disabled = true;
const typeList = ConstConfig.ConstSelect.roleTypeNew;
typeList.forEach(type=>{
if (role.type == type.label) {
this.userRole = type.value;
}
});
let prdType;
let type;
if (role.type == '行值') {
prdType = '01';
type = 'STATION_SUPERVISOR';
this.$store.dispatch('training/setRoles', 'STATION_SUPERVISOR');
this.$store.dispatch('training/setRoleDeviceCode', role.deviceCode);
} else if (role.type == '行调') {
prdType = '02';
type = 'DISPATCHER';
this.$store.dispatch('training/setRoles', 'DISPATCHER');
} else if (role.type == '司机') {
prdType = '04';
type = 'DRIVER';
this.$store.dispatch('training/setRoles', 'DRIVER');
} else if (role.type == '通号') {
prdType = '';
type = 'MAINTAINER';
this.$store.dispatch('training/setRoles', 'MAINTAINER');
const routeData = this.$router.resolve({
path:'/jlmap3d/maintainer',
query:{
mapid:this.$route.query.mapId,
group:this.group,
token:getToken(),
project: this.project,
noPreLogout: true
}
});
window.open(routeData.href);
} else if (role.type == '车辆段/停车场调度') {
prdType = '05';
type = 'DEPOT_DISPATCHER';
this.$store.dispatch('training/setRoles', 'DEPOT_DISPATCHER');
} else if (role.type == '上级部门') {
prdType = '';
type = 'PARENT_DEPARTMENT';
this.$store.dispatch('training/setRoles', 'PARENT_DEPARTMENT');
} else if (role.type == '电力调度') {
prdType = '';
type = 'ELECTRIC_DISPATCHER';
this.$store.dispatch('training/setRoles', 'ELECTRIC_DISPATCHER');
} else if (role.type == '车辆段/停车场信号楼') {
prdType = '';
type = 'SIGNAL_BUILDING';
this.$store.dispatch('training/setRoles', 'SIGNAL_BUILDING');
} else if (role.type == '车站助理') {
prdType = '';
type = 'STATION_ASSISTANT';
this.$store.dispatch('training/setRoles', 'STATION_ASSISTANT');
} else if (role.type == '车站站长') {
prdType = '';
type = 'STATION_MASTER';
this.$store.dispatch('training/setRoles', 'STATION_MASTER');
} else if (role.type == '车站信号员') {
prdType = '01';
type = 'STATION_SIGNALER';
this.$store.dispatch('training/setRoles', 'STATION_SIGNALER');
} else if (role.type == '车站客运员') {
prdType = '';
type = 'STATION_PASSENGER';
this.$store.dispatch('training/setRoles', 'STATION_PASSENGER');
} else if (role.type == '车站扳道员') {
prdType = '01';
type = 'STATION_SWITCH_MAN';
this.$store.dispatch('training/setRoles', 'STATION_SWITCH_MAN');
} else if (role.type == '车站引导员') {
prdType = '';
type = 'STATION_FACILITATOR';
this.$store.dispatch('training/setRoles', 'STATION_FACILITATOR');
} else if (role.type == '车站工务工') {
prdType = '';
type = 'STATION_WORKER';
this.$store.dispatch('training/setRoles', 'STATION_WORKER');
} else if (role.type == '设备管理员') {
prdType = '';
type = 'DEVICE_MANAGER';
this.$store.dispatch('training/setRoles', 'DEVICE_MANAGER');
} else if (role.type == '车务段段长') {
prdType = '';
type = 'TRAIN_MASTER';
this.$store.dispatch('training/setRoles', 'TRAIN_MASTER');
} else {
prdType = '';
}
this.$store.dispatch('training/setPrdType', prdType);
this.$store.dispatch('scriptRecord/updateRole', type + ':' + role.id);
if (role.type == '行值' || role.type == '车站信号员' || role.type == '车站扳道员') {
this.setShowStation(role.deviceCode);
}
this.memberData.map(member=>{
if (member.id == role.id) {
member.userId = this.$store.state.user.id;
member.userName = this.$store.state.user.nickname;
member.disabled = true;
} else {
member.userId = '';
member.userName = '';
member.disabled = false;
}
const userName = member.userName ? '-' + member.userName : '';
const name = member.name == undefined ? '' : '-' + member.name;
member.label = member.type + member.deviceName + name + userName;
});
} else {
this.userRole = 'AUDIENCE';
this.$store.dispatch('training/setRoles', 'AUDIENCE');
this.memberData.map(member=>{
if (member.userId) {
member.userId = '';
member.userName = '';
member.disabled = false;
const userName = member.userName ? '-' + member.userName : '';
const name = member.name == undefined ? '' : '-' + member.name;
member.label = member.type + member.deviceName + name + userName;
}
});
this.switchMode('');
}
} catch (error) {
this.$messageBox(error.message);
}
},
setPosition() {
this.$nextTick(() => {
const menuBar = document.getElementById('menuBar');
const menuTool = document.getElementById('menuTool');
this.offset = 15 + (menuBar ? menuBar.offsetHeight || 0 : 0) + (menuTool ? menuTool.offsetHeight || 0 : 0);
const textStatus = document.getElementById('textStatus');
if (textStatus) {
this.textStatusHeight = textStatus.offsetHeight || 0;
textStatus.style.top = this.offset - 15 + 'px';
}
});
},
setMapLocation(mapLocation) {
this.mapLocation = mapLocation;
},
switchMode(prdType) {
this.$store.dispatch('training/setPrdType', prdType);
},
viewScriptRoles() {
this.$refs.selectRole.doShow();
},
viewRunPlan() {
this.$refs.runPlanView.doShow();
},
loadRunPlan() {
this.$refs.runPlanLoad.doShow();
},
setFault() {
this.$refs.faultChoose.doShow();
},
setMemberData(lastMemberList) {
this.memberData = lastMemberList;
},
setMemberList(memberList) {
this.memberList = memberList;
},
setTreeData(treeData) {
this.treeData = treeData;
},
clearAllData() {
this.$refs.chatbox.clearAllData();
},
switchStationMode(val) {
if (val == null && this.stationListMode.length > 0) {
this.showStation = this.stationListMode[0].value;
} else {
this.showStation = val;
}
this.$store.dispatch('map/setShowCentralizedStationCode', this.showStation);
this.$store.dispatch('map/setShowCentralizedStationNum');
},
quitQuest() {
this.userRole = '';
this.setShowStation('');
},
setShowStation(stationCode) {
const showStation = this.centralizedStationMap[stationCode];
const list = [];
const mapDevice = this.$store.state.map.mapDevice;
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, showStation);
this.$nextTick(()=>{
this.$jlmap.setCenter(showStation);
});
},
setCentralizedstationList(map) {
this.centralizedstationList = [];
(map.stationList || []).forEach(item => {
if (item.centralized) {
this.centralizedstationList.push({value: item.code, name: item.name});
this.centralizedStationMap[item.code] = item.code;
item.chargeStationCodeList && item.chargeStationCodeList.length && item.chargeStationCodeList.forEach(ele => {
this.centralizedStationMap[ele] = item.code;
});
}
});
console.log(this.centralizedStationMap, '----this.centralizedStationMap--');
// if (this.centralizedstationList.length && !this.showStation) {
// this.showStation = this.centralizedstationList[0].value;
// }
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.main {
z-index: 10;
display: block;
width: 100%;
height: 100%;
overflow: hidden;
background: #000000;
-moz-user-select: none;
-o-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
}
/deep/ .el-button+.el-button {
margin-left: 0px;
}
</style>

582
src/views/newMap/displayNew/scriptDisplay/scriptPreview/scriptButtonGroup.vue
View File

@ -1,582 +0,0 @@
<template>
<div>
<!-- 右下角按钮列表 -->
<div class="display-draft">
<el-button v-if="isscriptRun&&!dataError" type="danger" @click="handleQuitQuest">{{ $t('display.demon.exitScript') }}</el-button>
<el-button type="primary" @click="back">{{ $t('display.demon.back') }}</el-button>
</div>
<!-- 左上角按钮 -->
<div class="trainingButton" :style="{top: (offset+45)+'px'}">
<el-row>
<el-radio-group v-model="scriptMode" class="mode" size="small" @change="changeScriptMode">
<el-radio-button :label="scriptModeList.TEACH" :disabled="isscriptRun">{{ $t('display.lesson.teachingMode') }}</el-radio-button>
<el-radio-button :label="scriptModeList.PRACTICE" :disabled="isscriptRun">{{ $t('display.lesson.practiceMode') }}</el-radio-button>
<el-radio-button :label="scriptModeList.TEST" :disabled="isscriptRun">{{ $t('display.lesson.testMode') }}</el-radio-button>
</el-radio-group>
</el-row>
</div>
<!-- 右上角按钮列表 -->
<div class="schema" :style="{top: offset+'px'}">
<el-select v-model="speed" style="width: 100px;" size="small" @change="speedChange">
<el-option
v-for="item in speedList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<template v-if="!dataError">
<el-button-group>
<el-button size="small" :disabled="viewDisabled || isscriptRun" type="success" @click="viewScriptRoles">{{ $t('display.schema.selectRoles') }}</el-button>
<el-button v-if="userRole=== 'STATION_SUPERVISOR'&&$route.query.lineCode ==='16'" size="small" @click="goCtc">车务终端</el-button>
<el-button v-if="$route.query.lineCode ==='16'&&$store.state.training.prdType === '01'" size="small" @click="showTrainTicket">路票</el-button>
<el-button v-if="showRegisterBookBtn" size="small" @click="showRegisterBook">簿册</el-button>
<el-button v-if="showDispatcherStation && userRole === 'DISPATCHER'" size="small" @click="changeShowMap">调度台</el-button>
<!-- 运行图加载 -->
<el-button v-if="running" size="small" :disabled="viewDisabled" @click="viewRunPlan">{{ $t('display.schema.previewRunDiagram') }}</el-button>
<el-button v-if="!running" size="small" type="warning" @click="loadRunPlan">{{ $t('display.schema.loadRunDiagram') }}</el-button>
</el-button-group>
<el-button v-if="!isScheduling" size="small" :type="faultMode ? '':'primary' " @click="changeOperateMode()">{{ faultMode?'切换到普通模式[Tab]':'切换到故障模式[Tab]' }}</el-button>
</template>
</div>
<!-- 菜单按钮列表 -->
<demon-menu
ref="demonMenu"
:is-all-show="!dataError"
:jl3dmodel-show="false"
:jl3dname-show="!isScheduling&&!isDriver"
:cctv-show="false"
:schedule-load-show="false"
:schedule-preview-show="false"
:jlmap3d-fault-show="isStation"
:driver-show="isDriver"
:all-style="'top:'+(offset+textStatusHeight)+'px'"
/>
<train-ticket ref="trainTicket" />
<register-book ref="registerBook" />
</div>
</template>
<script>
import { ScriptMode } from '@/scripts/ConstDic';
import DemonMenu from '@/views/newMap/displayNew/demonMenu';
import { EventBus } from '@/scripts/event-bus';
import {covertMemberData} from '@/views/newMap/displayNew/utils';
import { timeFormat } from '@/utils/date';
import { OperateMode } from '@/scripts/ConstDic';
import { clearSimulation, getSimulationInfoNew } from '@/api/simulation';
import { scriptRePreview } from '@/api/simulation';
import {getDraftScriptByGroupNew } from '@/api/script';
import { loadMapDataById } from '@/utils/loaddata';
import { getByGroupStationList } from '@/api/jmap/map';
import ConstConfig from '@/scripts/ConstConfig';
import { loadRunPlanData } from '@/utils/loaddata';
import Cookies from 'js-cookie';
import { Notification } from 'element-ui';
import { getToken } from '@/utils/auth';
import TrainTicket from '@/views/newMap/trainTicket/index.vue';
import RegisterBook from '@/views/newMap/registerBook/index.vue';
import { timesSpeedPlayback } from '@/api/rtSimulation';
export default {
name:'ScriptButtonGroup',
components:{
DemonMenu,
TrainTicket,
RegisterBook
},
props:{
offset: {
type: Number,
required: true
},
group: {
type: String,
required: true
},
userRole: {
type: String,
required: true
},
textStatusHeight: {
type: Number,
default() {
return 0;
}
}
},
data() {
return {
dataError: false,
faultMode: false,
viewDisabled: true,
firstLoad:true,
activeTrainList:[],
isscriptRun:false, // 剧本是否正在加载
scriptMode: ScriptMode.TEACH,
speed: 1,
planRunning:false
};
},
computed:{
running() {
return this.$store.state.training.started;
},
isScheduling() {
return this.$store.state.training.prdType === '05';
},
width() {
return this.$store.state.app.width;
},
height() {
return this.$store.state.app.height;
},
isDriver() {
return this.$store.state.scriptRecord.userRole == 'DRIVER';
},
isStation() {
return this.$store.state.training.prdType == '01';
},
showDispatcherStation() {
return this.$route.query.lineCode === '16' && this.$store.state.training.prdType === '02';
},
scriptModeList() {
return ScriptMode;
},
isAdmin() {
return this.$store.state.user.roles.includes('04') || this.$store.state.user.roles.includes('05');
},
mapId() {
return this.$route.query.mapId;
},
speedList() {
return this.isAdmin ? [
{ value: 1, label: '1倍速' },
{ value: 2, label: '2倍速' },
{ value: 3, label: '3倍速' },
{ value: 4, label: '4倍速' },
{ value: 5, label: '5倍速' },
{ value: 6, label: '6倍速' },
{ value: 7, label: '7倍速' },
{ value: 8, label: '8倍速' },
{ value: 9, label: '9倍速' },
{ value: 10, label: '10倍速' }
] : [
{ value: 1, label: '1倍速' },
{ value: 2, label: '2倍速' },
{ value: 3, label: '3倍速' },
{ value: 4, label: '4倍速' },
{ value: 5, label: '5倍速' }
];
},
showRegisterBookBtn() {
const roleList = ['STATION_SUPERVISOR', 'STATION_ASSISTANT', 'STATION_SIGNALER', 'STATION_SWITCH_MAN', 'STATION_MASTER', 'STATION_WORKER', 'DEVICE_MANAGER'];
return this.$route.query.lineCode === '16' && roleList.includes(this.$store.state.training.userRole);
}
},
watch:{
$route() {
this.initLoadData();
},
'$store.state.map.mapDataLoadedCount': async function () {
await this.getDraftScriptByGroupNew(this.group);
await this.loadRunData();
},
'$store.state.app.windowSizeCount': function() {
this.setWindowSize();
},
'$store.state.runPlan.loadRunPlanCount': function () {
this.viewDisabled = false;
},
'$store.state.socket.simulationSpeed': function (val) {
this.speed = val;
}
},
async mounted() {
EventBus.$on('CheckFaultModeEvent', () => {
if (!this.isScheduling) {
this.changeOperateMode();
}
});
await this.initLoadData();
},
async beforeDestroy() {
await this.quit();
await this.$store.dispatch('training/reset');
await this.$store.dispatch('map/mapClear');
this.$store.dispatch('scriptRecord/updateSimulationPause', false);
this.$store.dispatch('scriptRecord/updateAudioPlay', false);
this.$store.dispatch('map/resetActiveTrainList', true);
},
methods:{
goCtc() {
const routeData = this.$router.resolve({
path:'/display/demon',
query:{
lineCode:this.$route.query.lineCode,
group: this.$route.query.group,
prdType: '01',
mapId:this.$route.query.mapId,
project: this.project,
newApi: false,
ctc: true,
try: this.$route.query.try || 0,
token:getToken(),
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
showTrainTicket() {
this.$refs.trainTicket.doShow();
},
showRegisterBook() {
this.$refs.registerBook.doShow();
},
changeShowMap() {
this.$emit('changeShowMap', false);
},
speedChange(val) {
timesSpeedPlayback(this.$route.query.group, val).then(resp => {
this.$message.success(`设置${val}倍速成功!`);
}).catch(e => {
this.$message.error('设置倍速失败！');
});
},
// 加载地图数据
async initLoadData() {
this.changeScriptMode(this.scriptMode);
this.$store.dispatch('training/setPrdType', '');
this.setWindowSize();
this.$store.dispatch('training/reset');
try {
await this.loadSimulationInfo();
this.initLoadDemonData();
} catch (error) {
this.$messageBox(`初始化失败: ${error.message}`);
this.endViewLoading();
}
},
// 加载仿真信息
async loadSimulationInfo() {
const resp = await getSimulationInfoNew(this.group);
if (resp && resp.code == 200 && resp.data && !resp.data.dataError) {
this.$store.dispatch('scriptRecord/updateSimulationPause', resp.data.pause);
this.$store.dispatch('runPlan/setRunPlanInfo', resp.data.runPlan);
if (resp.data.planRunning) {
this.$store.dispatch('training/start');// 仿真开始按计划行车
} else {
this.$store.dispatch('training/over');// 仿真按计划行车结束
}
this.planRunning = resp.data.planRunning;
this.$store.dispatch('training/setInitTime', resp.data.systemTime);
} else if (resp && resp.code == 200 && resp.data && resp.data.dataError) {
this.dataError = true;
this.$messageBox('此地图数据正在维护中,无法运行！');
}
},
// 仿真系统
initLoadDemonData() {
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); // 默认为正常模式
if (this.group) {
loadMapDataById(this.mapId, 'simulation');
this.$store.dispatch('training/setPrdType', '02');
} else {
this.endViewLoading();
}
},
// 结束加载状态
endViewLoading() {
this.$store.dispatch('map/mapClear');
this.$nextTick(() => {
EventBus.$emit('viewLoading', false);
});
},
setIsscriptRun(status) {
this.isscriptRun = status;
},
async getDraftScriptByGroupNew(group) {
const resp = await getDraftScriptByGroupNew(group);
if (resp.code == 200) {
if (resp.data.memberList && resp.data.memberList.length > 0) {
resp.data.memberList.sort((a, b) => {
return parseInt(a.id) - parseInt(b.id);
});
this.$store.dispatch('training/setMemberList', {memberList:resp.data.memberList, userId:this.$store.state.user.id});
if (this.$store.state.training.started) {
this.activeTrainList = this.$store.state.map.activeTrainList;
}
const memberList = resp.data.memberList;
// 获取仿真成员列表
const result = covertMemberData(this.activeTrainList, memberList);
this.driverList = result.driverList;
const treeData = [{
label: '行调',
id: 'dispatcher',
type: 'role',
children: result.deviceListData[0]
}, {
label: '车站值班员',
id: 'stationSupervisor',
type: 'role',
children: result.deviceListData[2]
}, {
label: '司机',
id: 'driver',
type: 'role',
children: result.deviceListData[3]
}, {
label: '通号',
id: 'maintainer',
type: 'role',
children: result.deviceListData[1]
}, {
label: '车辆段/停车场调度',
id: 'depotDispatcher',
type: 'role',
children: result.deviceListData[4]
}, {
label: '上级部门',
id: 'parentDepartment',
type: 'role',
children: result.deviceListData[5]
},
{
label: '电力调度',
id: 'electricDispatcher',
type: 'role',
children: result.deviceListData[6]
},
{
label: '车辆段/停车场信号楼',
id: 'parkingLotSignalBuilding',
type: 'role',
children: result.deviceListData[7]
},
{
label: '车站助理',
id: 'stationAssistant',
type: 'role',
children: result.deviceListData[8]
},
{
label: '车站站长',
id: 'stationMaster',
type: 'role',
children: result.deviceListData[9]
},
{
label: '车站信号员',
id: 'stationSignaler',
type: 'role',
children: result.deviceListData[10]
},
{
label: '车站客运员',
id: 'stationPassenger',
type: 'role',
children: result.deviceListData[11]
},
{
label: '车站扳道员',
id: 'stationSwitchMan',
type: 'role',
children: result.deviceListData[12]
},
{
label: '车站引导员',
id: 'stationFacilitator',
type: 'role',
children: result.deviceListData[13]
},
{
label: '车站工务工',
id: 'stationWorker',
type: 'role',
children: result.deviceListData[14]
},
{
label: '设备管理员',
id: 'deviceManager',
type: 'role',
children: result.deviceListData[15]
},
{
label: '车务段段长',
id: 'trainMaster',
type: 'role',
children: result.deviceListData[16]
}
];
/**
* 车站助理
*/
// STATION_ASSISTANT,
// STATION_MASTER:'车站站长',
// STATION_SIGNALER:'车站信号员',
// STATION_PASSENGER:'车站客运员',
// STATION_SWITCH_MAN:'车站扳道员',
// STATION_FACILITATOR:'车站引导员',
// STATION_WORKER:'车站工务工'
// stationMaster
// stationSignaler
// stationPassenger
// stationSwitchMan
// stationFacilitator
// stationWorker
const lastMemberList = result.lastMemberList;
this.$emit('setTreeData', treeData);
this.$emit('setMemberData', lastMemberList);
}
let newMemberList = [];
// planRunning
// debugger;
const activeMemberList = [];
resp.data.actionList.forEach((activeMember)=>{
if (!(activeMemberList.length > 0 && activeMemberList.includes(activeMember.memberId))) {
activeMemberList.push(activeMember.memberId);
}
});
const playerList = resp.data.memberList.filter(member=>{
return activeMemberList.includes(member.id);
});
playerList.map(member=>{
if (!member.deviceName && member.deviceCode) {
const device = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (device.name) {
member.deviceName = device.name;
} else {
member.deviceName = member.deviceCode;
}
}
});
const lastData = JSON.stringify(playerList);
newMemberList = this.covert(lastData, ConstConfig.ConstSelect.roleTypeNew);
if (resp.data.mapLocation) {
this.$emit('setMapLocation', resp.data.mapLocation);
}
const memberList = newMemberList || [];
memberList.unshift({ id: '', label: this.$t('display.script.none'), role: 'no', disabled:false });
this.$emit('setMemberList', memberList);
}
},
loadRunData() {
this.$store.dispatch('runPlan/clear').then(() => {
if (this.group) {
this.viewDisabled = true;
// 获取排序的车站列表
getByGroupStationList(this.group).then(response => {
this.$store.dispatch('runPlan/setStations', response.data).then(() => {
loadRunPlanData(this.group, this.dataError);
});
}).catch(() => {
this.$messageBox(this.$t('display.schema.getStationListFail'));
});
}
});
},
covert(data, roleTypeList) {
let lastData = data;
roleTypeList.forEach(function(element) {
const rolename = element.value;
if (Cookies.get('user_lang') == 'en') {
lastData = lastData.replace(new RegExp(rolename, 'g'), element.enLabel);
} else {
lastData = lastData.replace(new RegExp(rolename, 'g'), element.label);
}
});
lastData = JSON.parse(lastData);
lastData.forEach(each=>{
const name = each.name == undefined ? '' : '-' + each.name;
const deviceName = each.deviceName == undefined ? '' : '-' + each.deviceName;
each.label = each.type + deviceName + name;
each.disabled = false;
});
return lastData;
},
// 退出剧本
handleQuitQuest() {
scriptRePreview(this.group).then(resp=>{
getSimulationInfoNew(this.group).then(()=>{
this.isscriptRun = false;
this.$store.dispatch('scriptRecord/updateBgSet', false);
this.$store.dispatch('scriptRecord/updateAudioPlay', false);
// this.userRole = '';
this.$store.dispatch('training/setRoles', '');
this.$store.dispatch('training/setPrdType', '');
this.$emit('clearAllData');
this.$emit('quitQuest');
// if (resp.data.planRunning) {
// this.$store.dispatch('training/start');// 仿真开始按计划行车
// } else {
// this.$store.dispatch('training/over');// 仿真按计划行车结束
// }
}).catch(()=>{
this.$messageBox(this.$t('display.demon.exitTaskFail'));
});
}).catch(()=>{
this.$messageBox(this.$t('display.demon.exitTaskFail'));
});
},
async back() {
await clearSimulation(this.group);
this.$store.dispatch('training/over').then(() => {
history.go(-1);
Notification.closeAll();
});
},
// 销毁仿真
async quit() {
await clearSimulation(this.group);
await this.$store.dispatch('training/over');
},
viewScriptRoles() {
this.$emit('viewScriptRoles');
},
changeOperateMode() {
this.faultMode = !this.faultMode;
let mode = OperateMode.NORMAL;
if (this.faultMode) {
mode = OperateMode.FAULT;
}
this.$store.dispatch('training/changeOperateMode', { mode: mode });
},
viewRunPlan() {
this.$emit('viewRunPlan');
},
loadRunPlan() {
this.$emit('loadRunPlan');
},
setWindowSize() {
this.$nextTick(() => {
const width = this.width;
const height = this.height;
this.$store.dispatch('config/resize', { width, height });
});
},
changeScriptMode(scriptMode) {
const ScriptModeList = {
TEACHING_MODE:'teach',
PRACTICE_MODE:'practice',
TEST_MODE:'test'
};
this.$store.dispatch('training/setScriptOperationType', ScriptModeList[scriptMode]);
this.$emit('changeScriptMode', scriptMode);
}
}
};
</script>
<style lang="scss" scoped>
.trainingButton{
position: absolute;
left: 5px;
z-index: 2;
}
.display-draft{
position: absolute;
right: 10px;
bottom: 15px;
}
.schema{
position: absolute;
right: 10px;
}
</style>

68
src/views/newMap/displayNew/scriptDisplay/scriptPreview/scriptPreviewChat.vue
View File

@ -1,68 +0,0 @@
<template>
<div>
<voice-chat-box
v-if="$route.query.lineCode == '16'"
ref="chatbox"
:group="group"
:user-role="userRole"
/>
<chat-box
v-else
ref="chatbox"
:group="group"
:user-role="userRole"
/>
<script-tip ref="scriptTip" :offset="offset" @allowCreatCoversition="allowCreatCoversition" />
</div>
</template>
<script>
import ChatBox from '@/views/newMap/chatView/chatBox.vue';
import voiceChatBox from '@/views/newMap/chatView/voiceChatBox.vue';
import ScriptTip from '@/views/newMap/displayNew/scriptDisplay/component/scriptTip';
export default {
name:'ScriptPreviewChat',
components:{
ChatBox,
voiceChatBox,
ScriptTip
},
props: {
group: {
type: String,
required: true
},
userRole: {
type: String,
required: true
},
offset: {
type: Number,
required: true
}
},
data() {
return {
};
},
computed:{
},
watch:{
},
methods:{
clearAllData() {
this.resetCoversition();
this.$refs.scriptTip.resetScriptTip();
},
resetCoversition() {
},
allowCreatCoversition() {
this.createCoversition = true;
},
resetScriptTip() {
this.$refs.scriptTip.resetScriptTip();
}
}
};
</script>

338
src/views/newMap/displayNew/scriptDisplay/scriptRecord/index.vue
View File

@ -1,338 +0,0 @@
<template>
<div style="width:100%;height:100%;">
<div class="display-draft">
<el-button-group>
<el-button v-if="!isReplaceBg" type="primary" @click="back">{{ $t('scriptRecord.scriptBack') }}</el-button>
<template v-if="$route.query.lineCode == '16'">
<el-button type="primary" @click="modifySystemTime">修改系统时间</el-button>
</template>
<el-button v-if="!isScriptCommand||isReplaceBg" type="danger" :disabled="dataError" @click="end">初始化</el-button>
<el-button v-if="!isScriptCommand||isReplaceBg" type="success" :disabled="isDisable||dataError" @click="selectBeginTime">{{ $t('scriptRecord.drivingByPlan') }}</el-button>
</el-button-group>
</div>
<demon-menu
ref="demonMenu"
:is-all-show="!dataError"
:jl3dmodel-show="false"
:jl3dname-show="!isShowScheduling&&!isDriver"
:cctv-show="false"
:schedule-load-show="false"
:schedule-preview-show="false"
:jlmap3d-fault-show="isStation"
:driver-show="isDriver"
:all-style="'top:'+(offset+textStatusHeight)+'px'"
/>
<menu-schema
ref="menuSchema"
:offset="offset"
:data-error="dataError"
:offset-bottom="offsetBottom"
@changeShowMap="changeShowMap"
/>
<set-time ref="setTime" @ConfirmSelectBeginTime="start" />
<modify-time v-if="$route.query.lineCode == '16'" ref="modifySysTime" />
<tip-script-record-new
ref="tipTaskRecordNew"
:group="group"
:offset-bottom="offsetBottom"
:offset="offset"
:is-replace-bg="isReplaceBg"
@resetChat="resetChat"
@setReplace="setReplace"
/>
<voice-chat-box
v-if="$route.query.lineCode == '16'"
ref="chatbox"
:group="group"
:user-role="userRole"
:is-replace-bg="isReplaceBg"
/>
<chat-box
v-else
ref="chatbox"
:group="group"
:user-role="userRole"
:is-replace-bg="isReplaceBg"
/>
</div>
</template>
<!-- 单人仿真 -->
<script>
import { TrainingMode } from '@/scripts/ConstDic';
import MenuSchema from '@/views/newMap/displayNew/menuSchema';
import DemonMenu from '@/views/newMap/displayNew/demonMenu';
import TipScriptRecordNew from '@/views/scriptManage/tipScriptRecord';
import SetTime from '@/views/newMap/displayNew/demon/setTime';
import ModifyTime from '@/views/newMap/displayNew/demon/modifyTime';
import { Notification } from 'element-ui';
import { getSimulationMemberList} from '@/api/simulation';
import ChatBox from '@/views/newMap/chatView/chatBox.vue';
import voiceChatBox from '@/views/newMap/chatView/voiceChatBox.vue';
export default {
name: 'MenuScript',
components: {
SetTime,
ModifyTime,
MenuSchema,
DemonMenu,
TipScriptRecordNew,
ChatBox,
voiceChatBox
},
props: {
offsetBottom: {
type: Number,
required: true
},
dataError: {
type: Boolean,
default() {
return false;
}
},
offset: {
type: Number,
required: true
},
textStatusHeight: {
type: Number,
default() {
return 0;
}
}
},
data() {
return {
isScriptCommand:false,
isReplaceBg: false,
userRole:'',
centralizedstationList: [],
centralizedStationMap: {}
};
},
computed: {
scriptId() {
return this.$route.query.scriptId;
},
group() {
return this.$route.query.group;
},
// userRole() {
// return this.$store.state.scriptRecord.userRole ? this.$store.state.scriptRecord.userRole : 'DISPATCHER';
// },
isDriver() {
return this.userRole == 'DRIVER';
},
isShowScheduling() {
return this.$store.state.training.prdType == '05';
},
isStation() {
return this.$store.state.training.prdType == '01';
},
isDisable() {
return this.$store.state.training.started;
},
userId() {
return this.$store.state.user ? this.$store.state.user.id : '';
}
},
watch: {
'$store.state.scriptRecord.bgSet':function (val) {
this.isScriptCommand = val;
},
'$store.state.socket.simulationStart': function(val) {
this.$store.dispatch('training/simulationStart').then(() => {
this.$store.dispatch('map/setShowCentralizedStationNum');
});
},
'$store.state.map.map': function (map) {
if (map) {
this.setCentralizedstationList(map); // 获取集中站列表
}
},
'$store.state.map.mapViewLoadedCount': function (val) { // 地图视图加载完成标识
getSimulationMemberList(this.group).then(resp => {
this.$store.dispatch('training/setMemberList', {memberList:resp.data, userId:this.$store.state.user.id});
// 设置当前角色
const member = resp.data.find(mem=>{
return mem.userId != '' && mem.userId != undefined;
});
if (member) {
const memberType = ['STATION_SUPERVISOR', 'DISPATCHER', 'DRIVER', 'MAINTAINER', 'DEPOT_DISPATCHER', 'PARENT_DEPARTMENT',
'ELECTRIC_DISPATCHER', 'SIGNAL_BUILDING', 'STATION_ASSISTANT', 'STATION_MASTER', 'STATION_SIGNALER',
'STATION_PASSENGER', 'STATION_SWITCH_MAN', 'STATION_FACILITATOR', 'STATION_WORKER', 'DEVICE_MANAGER', ' TRAIN_MASTER'];
const prdTypeList = ['01', '02', '04', '', '05', '', '', '', '', '', '01', '', '01', '', '', '', ''];
const index = memberType.indexOf(member.type);
let prdType;
if (index >= 0) {
prdType = prdTypeList[index];
}
this.userRole = member.type;
this.$store.dispatch('training/setRoles', member.type);
this.$store.dispatch('scriptRecord/updateRole', member.type + ':' + member.id);
this.$store.dispatch('training/setPrdType', prdType);
}
}).catch(() => {
this.$messageBox('获取仿真成员列表失败！');
});
},
'$store.state.scriptRecord.userRole':function (val) {
this.userRole = val;
},
// '$store.state.training.roleDeviceCode':function (val) {
// if (val) {
// this.setShowStation(val);
// }
// },
'$store.state.socket.simulationRoleList':function(list) {
if (list && list.length && this.$route.query.lineCode == '16') { // 人员变化监控
this.checkRoleChange(list);
}
}
},
beforeDestroy() {
// this.clearAutoSave();
this.$store.dispatch('training/setMemberList', {memberList:[], userId:this.$store.state.user.id});
this.$store.dispatch('map/resetActiveTrainList', true);
this.$store.dispatch('scriptRecord/updateBgSet', false);
this.$store.dispatch('scriptRecord/updateRole', null);
this.$store.dispatch('training/setRoles', null);
},
mounted() {
this.isScriptCommand = this.$store.state.scriptRecord.bgSet;
this.$store.dispatch('training/end', TrainingMode.NORMAL);
this.$nextTick(() => {
this.$refs.demonMenu.menuClick();
});
},
methods: {
// 修改系统时间
modifySystemTime() {
this.$refs.modifySysTime.doShow();
},
selectBeginTime() {
this.$refs.setTime.doShow();
},
start(model) {
this.$emit('start', model);
},
end() {
this.$emit('end');
},
back() {
history.go(-1);
Notification.closeAll();
},
resetChat() {
// this.$refs.chatbox.resetCoversition();
},
setReplace(isRp) {
this.isReplaceBg = isRp;
},
changeShowMap() {
this.$emit('changeShowMap', false);
},
checkRoleChange(data) {
const stationRoleList = ['STATION_SUPERVISOR', 'STATION_ASSISTANT', 'STATION_MASTER', 'STATION_SIGNALER',
'STATION_PASSENGER', 'STATION_SWITCH_MAN', 'STATION_FACILITATOR', 'STATION_WORKER', 'DEVICE_MANAGER'];
// 'TRAIN_MASTER'
data.forEach(item => {
if ((item.messageType === 'PLAY_CHANGE' || item.messageType === 'ONLINE' ) && item.userId == this.userId && (stationRoleList.includes(item.type) )) {
// this.userRole = item.type || 'AUDIENCE';
this.$store.dispatch('training/setRoleDeviceCode', item.deviceCode);
this.$store.dispatch('training/setUserRole', item.type);
this.deviceCode = item.deviceCode;
if (item.type == 'STATION_SUPERVISOR' || item.type == 'STATION_SIGNALER') {
this.setShowStation(item.deviceCode);
this.$store.dispatch('training/setPrdType', '01');
} else {
const showStation = this.centralizedStationMap[item.deviceCode];
this.setShowStation('');
this.$jlmap.setCenter(showStation);
}
// this.setSimulationPrdType(this.centralizedStationMap[item.deviceCode]);
// this.$nextTick(() => {
// if (item.deviceCode && this.$store.state.training.prdType !== '09') { this.setCenter(item.deviceCode); }
// });
}
});
},
setShowStation(stationCode) {
const showStation = this.centralizedStationMap[stationCode];
const list = [];
const mapDevice = this.$store.state.map.mapDevice;
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, showStation);
this.$nextTick(()=>{
this.$jlmap.setCenter(showStation);
});
},
setCentralizedstationList(map) {
this.centralizedstationList = [];
(map.stationList || []).forEach(item => {
if (item.centralized) {
this.centralizedstationList.push({value: item.code, name: item.name});
this.centralizedStationMap[item.code] = item.code;
item.chargeStationCodeList && item.chargeStationCodeList.length && item.chargeStationCodeList.forEach(ele => {
this.centralizedStationMap[ele] = item.code;
});
}
});
// if (this.centralizedstationList.length && !this.showStation) {
// this.showStation = this.centralizedstationList[0].value;
// }
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.display-card {
z-index: 9;
display: inline-block;
position: absolute;
top: 17px;
left: 160px;
height: 32px;
}
.display-card .el-row {
line-height: 32px !important;
}
.display-score {
background-color: black;
display: -moz-inline-box;
display: inline-block;
text-align: left;
height: 32px;
line-height: 24px;
border-radius: 4px;
padding-left: 2px;
margin-left: 10px;
font-family: "Microsoft" !important;
font-size: 18px !important;
color: #fff;
}
.display-draft {
position: absolute;
float: right;
right: 15px;
bottom: 15px;
}
</style>

183
src/views/newMap/displayNew/selectStation.vue
View File

@ -1,183 +0,0 @@
<template>
<span>
<el-select v-if="$store.state.training.prdType === '01'" v-model="oldShowMemberId" :style="styleCss" size="small" @change="switchStationMode">
<el-option v-for="item in stationListMode" :key="item.value" :label="item.name" :value="item.value" />
</el-select>
<el-select v-else-if="$store.state.training.prdType === '09'" v-model="oldShowMemberId" :style="styleCss" size="small" style="margin-right:20px;" @change="switchStationMode">
<el-option v-for="item in depotListMode" :key="item.value" :label="item.name" :value="item.value" />
</el-select>
</span>
</template>
<script>
import { mapGetters } from 'vuex';
import { assignUsersPlayRoles } from '@/api/jointSimulation';
import { EventBus } from '@/scripts/event-bus';
export default {
name:'SelectStation',
props:{
styleCss: {
type: String,
required: true
}
},
data() {
return {
stationListMode: [], // 设备集中站列表
depotListMode: [],
showMemberId: '', // 展示的值班站memberId
oldShowMemberId: '',
stationCentralizedMap: {},
showStation: ''
};
},
computed:{
...mapGetters('map', [
'map',
'stationList'
])
},
watch:{
'$store.state.training.memberData': function (val) {
this.initStationListMode();
},
'$store.state.training.simulationUserList': function(val) {
this.initData();
},
'$store.state.socket.simulationRoleList':function(list) {
if (list && list.length) { // 人员变化监控
this.checkRoleChange(list);
}
}
},
mounted() {
this.initStationListMode();
this.initData();
EventBus.$on('switchStationMode', (stationCode) => {
this.$store.state.training.memberList.filter(el => el.type == 'STATION_SUPERVISOR').find(el => {
if (el.deviceCode == stationCode) {
this.oldShowMemberId = el.id;
this.switchStationMode(el.id);
}
});
});
},
methods:{
switchStationMode(val) {
assignUsersPlayRoles([{ userId: this.$store.state.user.id, memberId: val}], this.$route.query.group).then(resp => {
this.showMemberId = val;
const member = this.$store.state.training.memberData[val];
const station = this.$store.getters['map/getDeviceByCode'](member.deviceCode);
if (station) {
if (this.$store.state.map.map && this.$store.state.map.map.pictureList) {
const picture = this.$store.state.map.map.pictureList.find(picture => picture.stationCodes && picture.stationCodes.includes(station.code) && picture.type === 'chainStation');
if (picture) {
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
const deviceList = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
deviceList.push(key);
}
this.$jlmap.updateShowStation(list, '');
this.$store.dispatch('map/setPictureDeviceMap', picture.deviceMap);
this.$jlmap.updatePicture(deviceList);
this.$jlmap.updateTransform(picture.scaling, picture.origin);
} else {
this.jmapShowStation(station);
}
} else {
this.jmapShowStation(station);
}
}
}).catch((err) => {
console.log(err);
this.showMemberId = this.oldShowMemberId;
this.$message.error('调整角色成员失败！');
});
},
jmapShowStation(station) {
this.showStation = station.code;
const showStationCode = this.stationCentralizedMap[station.code];
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$store.dispatch('training/setRoleDeviceCode', station.code);
this.$jlmap.updateShowStation(list, showStationCode || station.code);
this.setCenter(showStationCode);
},
setCenter(code) {
if (this.$store.state.training.prdType === '09' && this.$store.state.map.map.displayList && this.$store.state.map.map.displayList.length) {
const tempData = this.$store.state.map.map.displayList.find(item => { return item.stationCodeList.includes(code) && item.type === 'DEPOT_IL'; });
const dataZoom = { offsetX: tempData.offsetX, offsetY: tempData.offsetY, scaleRate: tempData.scaleRate };
this.$store.commit('map/setDataZoom', dataZoom);
this.$jlmap.setDepot(dataZoom);
} else {
this.$jlmap.setCenter(code);
}
},
initStationListMode() {
this.stationListMode = [];
this.$store.state.training.memberList.forEach(item => {
if (item.type === 'STATION_SUPERVISOR') {
const station = this.$store.getters['map/getDeviceByCode'](item.deviceCode);
if (station) {
this.stationListMode.push({value:item.id, name: station.name});
}
} else if (item.type === 'DEPOT_DISPATCHER') {
const station = this.$store.getters['map/getDeviceByCode'](item.deviceCode);
if (station) {
this.depotListMode.push({value:item.id, name: station.name});
}
}
});
},
initData() {
this.$store.state.training.simulationUserList.forEach(item => {
if (item.type === 'STATION_SUPERVISOR' && item.userId == this.$store.state.user.id) {
this.showMemberId = item.memberId;
this.oldShowMemberId = item.memberId;
} else if (item.type === 'DEPOT_DISPATCHER' && item.userId == this.$store.state.user.id) {
this.showMemberId = item.memberId;
this.oldShowMemberId = item.memberId;
}
});
this.stationList.forEach(item => {
if (item.centralized) {
this.stationCentralizedMap[item.code] = item.code;
item.chargeStationCodeList.forEach(ele => {
this.stationCentralizedMap[ele] = item.code;
});
}
});
if (this.showMemberId) {
this.switchStationMode( this.showMemberId);
}
},
checkRoleChange(data) {
data.forEach(item => {
if (item.messageType === 'KICK_OUT' && item.userId == this.$store.state.user.id) {
this.$messageBox('您已经被请离房间！');
window.close();
} else if (item.messageType === 'PLAY_CHANGE' && item.userId == this.$store.state.user.id && item.type === 'STATION_SUPERVISOR') {
this.showMemberId = item.memberId;
this.oldShowMemberId = item.memberId;
this.showStation = item.deviceCode;
const showStationCode = this.stationCentralizedMap[item.deviceCode];
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$store.dispatch('training/setRoleDeviceCode', item.deviceCode);
this.$store.dispatch('training/setUserRole', item.type);
this.$jlmap.updateShowStation(list, showStationCode || item.deviceCode);
this.setCenter(showStationCode);
}
});
}
}
};
</script>

446
src/views/newMap/jointTrainingNew/dispatcherStation.vue
View File

@ -1,446 +0,0 @@
<template>
<div class="dispatcher-station">
<div class="station-title">上海局CTC系统-行调台-控制工具条</div>
<div class="main">
<div class="menu-list">
<el-button v-for="(item, index) in menuList" :key="index" class="btn" type="text" @click="clickMenu(item.refPath)">{{ item.label }}</el-button>
</div>
<div class="btn-box">
<div v-for="(item, index) in buttonList" :key="index" class="btn-div" @click="doShow(item.refPath)">
<div class="img">
<el-image
style="width: 83px; height: 83px"
:src="item.imgUrl"
/>
</div>
<div class="text">{{ item.label }}</div>
</div>
</div>
</div>
<DispatchCmd ref="dispatch-cmd" />
<DispatcherLoger ref="dispatcherLoger" />
</div>
</template>
<script>
import DispatchCmd from '@/views/dispatcherStationManage/dispatchCmd';
import DispatcherLoger from '@/views/dispatcherLoger/index';
// import DispatcherLoger from '@/jmapNew/theme/datie_02/menus/dispatcherLoger';
import ZhanchangIcon from '@/assets/dispatcherStation/zhanchang.png';
import YunxingIcon from '@/assets/dispatcherStation/yunxing.png';
import CmdIcon from '@/assets/dispatcherStation/cmd.png';
import { getToken } from '@/utils/auth';
import { creatSubscribe, clearSubscribe, getTopic } from '@/utils/stomp';
export default {
name: 'DispatcherStation',
components: {
DispatchCmd,
DispatcherLoger
},
data() {
return {
stationCode:'',
groupModel: '',
hasUnsubscribe:false,
buttonList: [
{
label: '运行图',
refPath: 'dispatcherLoger',
imgUrl: YunxingIcon
},
{
label: '调度命令',
refPath: 'dispatch-cmd',
imgUrl: CmdIcon
},
{
label: '站场图',
refPath: 'station-map',
imgUrl: ZhanchangIcon
},
{
label: '数据更新',
refPath: '',
imgUrl: CmdIcon
},
{
label: '时间同步',
refPath: '',
imgUrl: CmdIcon
}
],
menuList: [
{
label: '登录(L)',
refPath: ''
},
{
label: '应用程序(T)',
refPath: ''
}
]
};
},
watch: {
'$store.state.training.prdType': function(prdType, oldPrdType) {
this.changePrdType(prdType, oldPrdType);
}
},
mounted() {
// const _that = this;
// window.onbeforeunload = () => { _that.clearSubscribe(); };
this.groupModel = this.$route.query.group;
// this.subscribe();
},
// beforeDestroy() {
// this.clearSubscribe();
// },
methods: {
doShow(refPath) {
if (!refPath) {
this.$alert('实现中......', '提示', {
confirmButtonText: '确定',
callback: action => {
}
});
return;
}
if (refPath === 'station-map') {
this.$emit('changeShowMap', true);
} else {
this.$refs[refPath].doShow();
}
},
clickMenu(refPath) {
this.$alert('实现中......', '提示', {
confirmButtonText: '确定',
callback: action => {
}
});
},
changePrdType(prdType, oldPrdType) {
// if (prdType) {
// this.subscribe(prdType);
// }
// if (oldPrdType) {
// this.clearSubscribe(oldPrdType);
// }
if (prdType == '01') {
this.clearSubscribe();
this.hasUnsubscribe = true;
} else if (prdType == '02' && this.hasUnsubscribe) {
this.subscribe();
}
},
async subscribe(prdType) {
const header = { group: this.$route.query.group || '', 'X-Token': getToken() };
creatSubscribe(getTopic('CTC', this.$route.query.group), header);
// if (prdType == '02') {
// // creatSubscribe(getTopic('CTC_RAILWAY', this.$route.query.group), header);
// } else if (prdType == '01') {
// // creatSubscribe(getTopic('CTC', this.$route.query.group), header);
// }
},
clearSubscribe(prdType) {
// if (prdType == '02') {
// // clearSubscribe(getTopic('CTC_RAILWAY', this.groupModel));
// } else if (prdType == '01') {
clearSubscribe(getTopic('CTC', this.groupModel));
// }
}
}
};
</script>
<style lang="scss" scoped>
.dispatcher-station{
height: 100%;
width: 100%;
overflow: hidden;
background: #E1EDF9;
.station-title {
height: 30px;
padding: 0 10px;
line-height: 30px;
width: 100%;
}
.main {
margin: 5px;
height: calc(100% - 40px);
border: 1px solid #000;
background: #C0C0C0;
.menu-list {
width: 100%;
padding-left: 50px;
background: #D9DFF0;
.el-button {
padding: 5px;
}
}
.btn-box {
height: 100%;
border-top: 2px solid #808080;
display: flex;
justify-content: space-around;
padding: 20px 10px;
.btn-div {
width: 120px;
height: 100px;
text-align: center;
.text {
font-weight: bold;
text-align: center;
}
&:hover {
cursor: pointer;
}
}
}
}
}
</style>
<style>
.chengdou-03__systerm {
overflow: hidden !important;
}
.chengdou-03__systerm .el-dialog {
background: #0055E8;
box-shadow: 1px hsla(240, 0%, 100%, 0.5) inset;
border: 1px solid rgb(69, 134, 247);
border-radius: 6px;
font-size: 13px !important;
color: #000;
}
.chengdou-03__systerm .el-dialog span {
font-size: 13px !important;
line-height: 22px;
}
.chengdou-03__systerm .el-dialog span .el-icon-arrow-up{
line-height: 18px;
}
.chengdou-03__systerm .el-dialog .el-dialog__footer {
background: #ECE9D8;
opacity: 1;
}
.chengdou-03__systerm .el-dialog .el-dialog__body {
padding: 20px;
margin: 0px 3px 3px;
border: 2px solid rgba(120, 121, 123, 0.5);
box-shadow: 1px hsla(240, 0%, 100%, 0.5) inset;
background: #ECE9D8;
opacity: 1;
}
.chengdou-03__systerm .el-dialog .el-dialog__title {
font-size: 16px;
color: #fff;
position: absolute;
top: 4px;
left: 7px;
}
.chengdou-03__systerm .el-dialog .el-dialog__headerbtn {
background: linear-gradient(#CD98A0, #C27D6E, #B63022, #C68770);
border: 1px solid #fff;
border-radius: 4px;
top: 6px;
right: 3px;
line-height: 16px;
}
.chengdou-03__systerm .el-dialog .el-dialog__headerbtn .el-icon-close:before {
font-size: 16px;
}
.chengdou-03__systerm .el-dialog .el-dialog__headerbtn .el-dialog__close {
color: #fff;
}
.chengdou-03__systerm .el-dialog .el-button {
height: 24px;
line-height: 22px;
padding: 0px;
width: 80px;
border: 2px outset #E2E2E2;
border-radius: 4px !important;
color: #000;
background: #F0F0F0;
}
.chengdou-03__systerm .el-dialog .expand {
width: 120px;
}
.chengdou-03__systerm .el-dialog .el-button:focus span {
border: 1px dashed gray;
}
.chengdou-03__systerm .el-dialog .el-button:active {
border: 2px inset #E2E2E2;
}
.chengdou-03__systerm .el-dialog .el-button:disabled {
border: 2px inset #E2E2E2;
}
.chengdou-03__systerm .el-dialog .el-button:disabled span {
border: 0px;
}
.chengdou-03__systerm .el-dialog .el-input {
border: 2px inset #E9E9E9;
height: 22px !important;
line-height: 22px !important;
}
.chengdou-03__systerm .el-dialog .el-input__inner {
color: #000;
background: #fff !important;
border: 0px;
border-radius: 0px !important;
box-sizing: border-box;
height: 22px !important;
line-height: 22px !important;
}
.chengdou-03__systerm .el-dialog .el-input.is-disabled .el-input__inner {
background: #F0F0F0 !important;
}
.chengdou-03__systerm .el-dialog .el-textarea {
border: 2px inset #E9E9E9;
border-radius: 0px;
}
.chengdou-03__systerm .el-dialog .el-textarea .el-textarea__inner {
color: #000;
background: #fff !important;
border: 0px;
border-radius: 0px !important;
box-sizing: border-box;
}
.chengdou-03__systerm .el-dialog .el-textarea.is-disabled .el-textarea__inner {
background: #F0F0F0 !important;
}
.chengdou-03__systerm .el-dialog .el-table--border th.gutter {
background: #EBEADB !important;
}
.chengdou-03__systerm .el-dialog .el-table {
border: 2px inset #E9E9E9;
color: #000 !important;
}
.chengdou-03__systerm .el-dialog .el-table .cell {
height: 22px;
line-height: 22px;
}
.chengdou-03__systerm .el-dialog .el-table th.is-leaf {
background: #F0F0F0 !important;
border-right: 1px solid #BDBDBD !important;
border-bottom: 1px solid #BDBDBD !important;
color: #000 !important;
height: 20px !important;
padding: 0px;
}
.chengdou-03__systerm .el-dialog .el-table tr td {
height: 20px !important;
padding: 0px;
}
.chengdou-03__systerm .el-dialog .el-table .el-table__empty-text {
top: 15px !important;
}
.chengdou-03__systerm .el-dialog .current-row>td {
background: #3399FF !important;
color: #fff !important;
}
.chengdou-03__systerm .el-dialog .el-checkbox__inner {
border: 1px inset #dcdfe6 !important;
}
.chengdou-03__systerm .el-dialog .el-checkbox__label {
color: #000 !important;
}
.chengdou-03__systerm .el-dialog .el-checkbox.is-disabled .el-checkbox__inner {
background: #E6E6E6 !important;
}
.chengdou-03__systerm .el-dialog .el-checkbox.is-disabled .el-checkbox__label {
color: #C5C9CC !important;
}
.chengdou-03__systerm .el-dialog .el-checkbox__input.is-checked .el-checkbox__inner {
background: #fff !important;
border: 1px inset #dcdfe6 !important;
}
.chengdou-03__systerm .el-dialog .el-checkbox__input.is-checked .el-checkbox__inner::after {
position: absolute;
-webkit-box-sizing: content-box;
box-sizing: content-box;
content: "";
border: 1px solid #000;
border-left: 0;
border-top: 0;
height: 7px;
left: 4px;
top: 1px;
}
.chengdou-03__systerm .el-dialog .el-radio__inner {
border: 1px inset #dcdfe6 !important;
}
.chengdou-03__systerm .el-dialog .el-radio__label {
color: #000 !important;
}
.chengdou-03__systerm .el-dialog .el-radio__input.is-checked .el-radio__inner {
background: #fff !important;
border: 1px inset #dcdfe6 !important;
}
.chengdou-03__systerm .el-dialog .el-radio__input.is-checked .el-radio__inner::after {
width: 4px;
height: 4px;
border-radius: 100%;
background-color: #000 !important;
position: absolute;
left: 50%;
top: 50%;
}
.chengdou-03__systerm .el-dialog .el-radio.is-disabled .el-radio__inner {
background: #E6E6E6 !important;
}
.chengdou-03__systerm .el-dialog .el-radio.is-disabled .el-radio__label {
color: #C5C9CC !important;
}
.chengdou-03__systerm .el-dialog .base-label {
background: rgba(0, 0, 0, x);
position: relative;
left: -15px;
top: -18px;
}
.chengdou-03__systerm .el-dialog .el-form-item label {
font-weight: normal !important;
color: #000 !important;
}
</style>

806
src/views/newMap/jointTrainingNew/index.vue
View File

@ -1,806 +0,0 @@
<template>
<div class="main" :style="{width: canvasWidth+'px'}">
<Jl3d-Drive v-show="drivingShow" ref="Jl3dDrive" :panel-show="drivingShow" @showdriving="showdriving" />
<Jl3d-MaintainerSelect v-if="jl3dmaintainershow" :is-admin="isAdmin" @back="back" @handlerMemberManage="handlerMemberManage" />
<ibp-plate v-show="ibpShow" ref="ibpPlate" @hideIbp="hideIbp" />
<template v-show="panelShow" :panelShow="panelShow">
<transition name="el-zoom-in-bottom">
<map-system-draft v-show="!specialDispatch" ref="mapCanvas" @back="back" />
</transition>
<div v-if="lineCode === '14'" v-show="prdType=='02'">
<ba-si-di ref="baSiDi" @handleDialogShow="handleDialogShow" />
<rps-dialog ref="rpsDialog" :is-run-plan="isRunPlan" :train-list="trainList" />
<tro-dialog ref="troDialog" :is-run-plan="isRunPlan" :train-list="trainList" :station-list="stationList" />
<car-pack ref="carPack" />
<tro-detail ref="troDetail" :is-run-plan="isRunPlan" :train-list="trainList" :station-list="stationList" @goTroDialog="troClick" />
<tra-dialog ref="traDialog" @openTrainTrunkDetail="openTrainTrunkDetail" />
<ttl-dialog ref="ttlDialog" />
<tmt-dialog ref="tmtDialog" />
<atr-dialog ref="atrDialog" />
<train-trunk-detail ref="trainTrunkDetail" @openTra="openTra" />
</div>
<div v-if="lineCode === '16'" v-show="prdType === '02'&& !showMap">
<dispatcher-station ref="dispatcherStation" @changeShowMap="changeShowMap" />
</div>
<menu-demon-joint
ref="demonMenu"
:group="group"
:offset="offset"
:offset-bottom="offsetBottom"
:data-error="dataError"
:user-role="userRole"
:is-admin="isAdmin"
:device-code="deviceCode"
@passflow="passflow"
@faultdevice="faultdevice"
@getUserRole="getUserRole"
@hidepanel="hidepanel"
@devicemodel="devicemodel"
@hidejl3dcctv="hidejl3dcctv"
@runPlanLoadShow="runPlanLoadShow"
@handlerMemberManage="handlerMemberManage"
/>
<menu-demon-schema
ref="menuSchema"
:group="group"
:offset="offset"
:user-role="userRole"
:is-admin="isAdmin"
:show-station="showStation"
:station-list="centralizedstationList"
:device-code="deviceCode"
:show-select-station="showSelectStation"
:data-error="dataError"
@runPlanLoadShow="runPlanLoadShow"
@faultChooseShow="faultChooseShow"
@switchStationMode="switchStationMode"
@changeShowMap="changeShowMap"
/>
<join-fault-choose ref="faultChoose" :group="group" :offset="offset" />
<join-run-plan-Load ref="runPlanLoad" :group="group" />
<menu-system-time v-show="!specialDispatch && lineCode !== '19'" ref="menuSystemTime" :offset="offset" :group="group" />
<menu-train-list v-if="prdType=='02'" @setCenter="setCenter" />
<members-manage ref="membersManage" :is-admin="isAdmin" @addSimulationMember="addSimulationMember" /> <!-- 成员管理 -->
<add-member ref="addMember" :station-list="stationList" />
<ticket-info v-if="lineCode === '16'" ref="ticketInfo" />
<Jl3d-Device
v-if="deviceif"
v-show="deviceShow"
ref="Jl3dDevice"
:panel-show="deviceShow"
@closedevice3dview="devicemodel"
/>
</template>
</div>
</template>
<script>
import MapSystemDraft from '@/views/newMap/mapsystemNew/index';
import MenuDemonJoint from './menuDemon';
import MenuDemonSchema from './menuSchema';
import JoinFaultChoose from '@/views/newMap/displayNew/demon/faultChoose';
import JoinRunPlanLoad from '@/views/newMap/displayNew/demon/runPlanLoad';
import menuSystemTime from '@/views/newMap/displayNew/menuSystemTime';
import IbpPlate from '@/views/ibp/ibpsystem/index';
import MenuTrainList from './menuTrainList';
import { mapGetters } from 'vuex';
import { OperateMode, TrainingMode } from '@/scripts/ConstDic';
import { loadMapDataById } from '@/utils/loaddata';
import { clearSimulation, getSimulationInfoNew, getSimulationUserInfo } from '@/api/simulation';
import { getSessionStorage } from '@/utils/auth';
import Jl3dDrive from '@/views/jlmap3d/drive/jl3ddrive';
import Jl3dDevice from '@/views/jlmap3d/device/jl3ddevice';
import Jl3dMaintainerSelect from '@/views/jlmap3d/maintainer/jl3dmaintainerselect';
import { EventBus } from '@/scripts/event-bus';
import { Message } from 'element-ui';
import { getToken } from '@/utils/auth';
import MembersManage from './memberManage/membersManage';
import AddMember from './memberManage/addMember';
// import BaSiDi from '@/views/newMap/displayBaSiDi/baSiDiNew';
// import RpsDialog from '@/views/newMap/displayBaSiDi/rps';
// import TroDialog from '@/views/newMap/displayBaSiDi/tro';
// import CarPack from '@/views/newMap/displayBaSiDi/carPack';
// import TroDetail from '@/views/newMap/displayBaSiDi/troDetail';
// import TraDialog from '@/views/newMap/displayBaSiDi/tra';
// import TtlDialog from '@/views/newMap/displayBaSiDi/ttl';
// import TmtDialog from '@/views/newMap/displayBaSiDi/tmt';
// import AtrDialog from '@/views/newMap/displayBaSiDi/atr';
// import TrainTrunkDetail from '@/views/newMap/displayBaSiDi/trainTrunkDetail';
import DispatcherStation from './dispatcherStation';
import TicketInfo from '../trainTicket/ticketInfo';
import Vue from 'vue';
export default {
name: 'JointTrainingDraft',
components: {
MapSystemDraft,
MenuDemonJoint,
MenuDemonSchema,
JoinFaultChoose,
JoinRunPlanLoad,
MenuTrainList,
menuSystemTime,
Jl3dDrive,
Jl3dMaintainerSelect,
IbpPlate,
MembersManage,
AddMember,
Jl3dDevice,
BaSiDi,
RpsDialog,
TroDialog,
CarPack,
TroDetail,
TraDialog,
TtlDialog,
TmtDialog,
AtrDialog,
TrainTrunkDetail,
DispatcherStation,
TicketInfo
},
data() {
return {
// trainingObj: {},
// timeDemonNum: 0,
offset: 10,
offsetBottom: 15,
userRole: '',
deviceCode: '',
group: '',
mapId: '',
lineCode: '',
simulationShow: false,
drivingShow: false,
jl3dmaintainershow:false,
ibpShow: false,
panelShow: true,
ibpPart: '',
showStation: '',
centralizedstationList: [],
showSelectStation: false, // 宁波线集中站 显示
mapViewLoadedOver: false,
dataError: false,
isAdmin: false,
deviceif:false,
deviceShow: true,
centralizedStationMap: {},
selfJmap: null,
showMap: false
};
},
computed: {
...mapGetters([
'canvasWidth'
]),
...mapGetters('map', [
'map',
'bigScreenConfig',
'stationList',
'sectionList',
'signalList',
'trainList',
'trainWindowList'
]),
width() {
return this.$store.state.app.width;
},
height() {
return this.$store.state.app.height;
},
userId() {
return this.$store.state.user ? this.$store.state.user.id : '';
},
prdType() {
return this.$store.state.training.prdType;
},
project() {
return getSessionStorage('project');
},
specialDispatch() {
return (this.lineCode === '14' && this.$store.state.training.prdType === '02') || (this.lineCode === '16' && this.$store.state.training.prdType === '02' && !this.showMap);
},
isRunPlan() {
return this.$store.state.training.started;
}
},
watch: {
'$store.state.config.menuBarLoadedCount': function (val) { // menuBar加载完成
this.setPosition();
},
'$store.state.menuOperation.selectedCount':function(em) {
const device = this.$store.state.menuOperation.selected;
if (device && device._type === 'Station' && this.$store.state.menuOperation.subType === 'troButton') {
this.$refs.troDialog.doClose();
this.$refs.troDetail.doShow(device.code);
}
},
'$store.state.training.prdType': function (prdType) {
this.setPosition();
if (prdType == '01') {
this.showSelectStation = true;
this.cancelBigScreenMode();
} else if (prdType == '02') {
this.showSelectStation = false;
this.cancelBigScreenMode();
} else if (prdType == '07') { // 大屏
this.setBigScreenMode();
} else {
this.cancelBigScreenMode();
}
},
'$store.state.map.mapDataLoadedCount':function(val) {
const roleList = ['STATION_SUPERVISOR', 'STATION_ASSISTANT'];
if (roleList.includes(this.$store.state.training.roles)) {
const list = [];
const mapDevice = this.$store.state.map.mapDevice;
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowMode(list, '02');
}
},
'$store.state.map.mapViewLoadedCount': function () { // 地图视图加载完成标识
this.mapViewLoadedOver = true;
this.showSelectStation && this.setShowStation(this.showStation);
// this.initMemberUserInfo();
if (this.$route.query.type === 'VR_PSD') {
this.deviceif = true;
this.deviceShow = true;
}
if (this.$route.query.type === 'DRIVE') {
this.$store.dispatch('training/setPrdType', '04');
this.$store.dispatch('training/setRoles', 'DRIVER');
this.hidepanel();
}
},
// '$store.state.socket.memberChangeCount': function () { // 仿真成员变更
// this.initMemberUserInfo();
// },
'$store.state.socket.permissionOver': function () {
this.$alert(this.$t('tip.userRightsHaveBeenReclaimed'), this.$t('tip.hint'), {
confirmButtonText: this.$t('global.confirm'),
showClose: false,
callback: async (action) => {
await this.$store.dispatch('training/over');
await clearSimulation(this.group);
this.$router.go(-1);
}
});
},
'$store.state.app.windowSizeCount': function() { // 窗口变化
this.setWindowSize();
this.setPosition();
},
$route() {
this.initLoadData();
},
'$store.state.map.map': function (map) {
if (map) {
this.setCentralizedstationList(map); // 获取集中站列表
}
},
'$store.state.socket.simulationRoleList':function(list) {
if (list && list.length) { // 人员变化监控
this.checkRoleChange(list);
}
},
'$store.state.socket.ticketInfo': function(val) {
if (val) {
this.$refs.ticketInfo.doShow(val);
}
}
},
async created() {
this.group = this.$route.query.group;
this.mapId = this.$route.query.mapId;
this.lineCode = this.$route.query.lineCode;
Message.closeAll();
},
async mounted() {
await this.setWindowSize();
await this.initLoadData();
this.selfJmap = Vue.prototype.$jlmap;
},
async beforeDestroy() {
await this.$store.dispatch('training/end', null);
await this.$store.dispatch('training/reset');
await this.$store.dispatch('map/mapClear');
await this.$store.dispatch('menuOperation/resetRequestList');
this.$store.dispatch('training/setUserRole', '');
Message.closeAll();
},
methods: {
// 设置菜单和工具栏位置
setPosition() {
this.$nextTick(() => {
this.offset = 10;
this.offsetBottom = 15;
const menuBar = document.getElementById('menuBar');
const menuTool = document.getElementById('menuTool');
const menuBottom = document.getElementById('menuButton');
if (menuBar) {
this.offset = (menuBar.offsetHeight || 0) + 15;
}
if (menuTool) {
this.offset = (menuTool.offsetHeight || 0) + 15;
}
const buttonWidth = this.width - 1200;
if (menuBottom && buttonWidth < 780) {
this.offsetBottom = (menuBottom.offsetHeight || 0) + 15;
}
if (this.$route.query.lineCode === '16' && this.$store.state.training.prdType === '02') {
this.offset = 35;
}
});
},
// 结束加载状态
endViewLoading(isSuccess) {
if (!isSuccess) {
this.$store.dispatch('map/mapClear');
}
this.$nextTick(() => {
EventBus.$emit('viewLoading', false);
});
},
setCenter(code) {
this.$jlmap.setCenter(code);
},
// 加载地图数据
initLoadData() {
const width = document.documentElement.clientWidth;
const height = document.documentElement.clientHeight + 200;
this.$store.dispatch('config/resize', { width, height });
try {
this.loadSimulationInfo();
this.initLoadDemonData();
} catch (error) {
this.$messageBox( this.$t('error.initializationFailed') + error.message);
this.endViewLoading();
}
},
// initMemberUserInfo() {
// // 获取仿真成员列表
// getSimulationMemberList(this.$route.query.group).then(resp => {
// this.$store.dispatch('training/setMemberList', { memberList: resp.data, userId: this.$store.state.user.id });
// }).catch(() => {
// this.$messageBox('获取仿真成员列表失败！');
// });
// getAllSimulationUser(this.$route.query.group).then(resp => {
// this.$store.dispatch('training/setSimulationUserList', resp.data);
// }).catch(() => {
// this.$messageBox('获取所有仿真用户失败！');
// });
// },
devicemodel() {
if (this.deviceif == false) {
this.deviceif = true;
} else {
if (this.deviceShow == false) {
this.deviceShow = true;
} else {
this.deviceShow = false;
}
}
},
/* 地图根据仿真group获取仿真基础信息 */
async loadSimulationInfo() {
const resp = await getSimulationInfoNew(this.group);
if (resp && resp.code == 200 && resp.data && !resp.data.dataError) {
this.$store.dispatch('scriptRecord/updateSimulationPause', resp.data.pause);// 设置剧本暂停装填
this.$store.dispatch('training/setInitTime', resp.data.systemTime);// 设置仿真时间
// this.$store.dispatch('training/countTime');// 前端仿真时间开始跑秒
this.$store.dispatch('runPlan/setRunPlanInfo', resp.data.runPlan);
if (resp.data.planRunning) {
this.$store.dispatch('training/start');// 仿真开始按计划行车
} else {
this.$store.dispatch('training/over');// 仿真按计划行车结束
}
this.$store.dispatch('training/changeMode', {mode:TrainingMode.NORMAL}); // 设置教学模式以便操作顺利执行
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); // 默认为正常模式
} else if (resp && resp.code == 200 && resp.data && resp.data.dataError) {
this.dataError = true;
this.$messageBox('此地图数据正在维护中,无法运行！');
}
},
/* 获取个人仿真信息*/
async getUserRole() {
const res = await getSimulationUserInfo(this.group);
const data = res.data || {};
this.userRole = data.type || 'AUDIENCE';
this.deviceCode = data.deviceCode;
this.$store.dispatch('training/setRoleDeviceCode', data.deviceCode);
this.isAdmin = data.admin;
const deviceVO = JSON.parse(getSessionStorage('projectDevice'));
if (deviceVO && deviceVO.type === 'VR_IBP') {
const config = JSON.parse(deviceVO.config);
this.ibpPart = config.part.toLowerCase();
this.showIbp(this.deviceCode);
} else {
this.hideIbp();
}
return res;
},
// 仿真系统
async initLoadDemonData() {
if (this.lineCode) {
let resp = {data: {}};
resp = await this.getUserRole();
if (resp && resp.code == 200) {
this.setSimulationPrdType(resp.data.deviceCode);
}
loadMapDataById(this.mapId, 'simulation');
} else {
this.endViewLoading();
}
},
handleDialogShow(type) {
this.$refs[type].doShow();
},
stationRoleShow(deviceCode) {
if (this.lineCode === '14') {
const list = [];
const mapDevice = this.$store.state.map.mapDevice;
this.$jlmap.setMap(this.$store.state.map.map, this.$store.state.map.mapDevice, {routeData:this.$store.state.map.routeData, autoReentryData: this.$store.state.map.autoReentryData});
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowMode(list, '02');
}
if (this.$store.state.map.map && this.$store.state.map.map.pictureList) {
const picture = this.$store.state.map.map.pictureList.find(picture => picture.stationCodes && picture.stationCodes.includes(deviceCode) && picture.type === 'chainStation');
if (picture) {
const mapDevice = this.$store.state.map.mapDevice;
const list = [];
const deviceList = [];
for (const key in mapDevice) {
list.push(mapDevice[key]);
deviceList.push(key);
}
this.$jlmap.updateShowStation(list, '');
this.$store.dispatch('map/setPictureDeviceMap', picture.deviceMap);
this.$jlmap.updatePicture(deviceList);
this.$jlmap.updateTransform(picture.scaling, picture.origin);
this.$store.dispatch('map/setShowCentralizedStationCode', this.centralizedStationMap[deviceCode]);
} else {
this.$jlmap.amendDevice([...this.sectionList, ...this.signalList, ...this.trainWindowList]);
this.mapViewLoadedOver && this.switchStationMode(deviceCode);
}
} else {
this.$jlmap.amendDevice([...this.sectionList, ...this.signalList, ...this.trainWindowList]);
this.mapViewLoadedOver && this.switchStationMode(deviceCode);
}
},
// 设置prdType和role
setSimulationPrdType(deviceCode) {
// Dispatcher 行调 STATION_SUPERVISOR 车站 Audience 观众 Driver 司机 MAINTAINER 通号
this.showStation = '';
let tempData;
let dataZoom;
switch (this.userRole) {
case 'DISPATCHER':
this.$store.dispatch('training/setPrdType', '02');
this.$store.dispatch('training/setRoles', 'DISPATCHER');
this.hideIbp();
this.drivingShow = false;
// this.changePrdType('02');
this.$jlmap.amendDevice([...this.sectionList, ...this.signalList, ...this.trainWindowList]);
this.mapViewLoadedOver && this.setShowStation('');
this.jl3dmaintainershow = false;
break;
case 'STATION_SUPERVISOR':
if (this.selfJmap) { Vue.prototype.$jlmap = this.selfJmap; }
this.$store.dispatch('training/setPrdType', '01');
this.$store.dispatch('training/setRoles', 'STATION_SUPERVISOR');
this.$refs.menuSchema.chiShowStation = deviceCode;
this.showStation = deviceCode;
// this.changePrdType('01');
this.stationRoleShow(deviceCode);
this.jl3dmaintainershow = false;
this.drivingShow = false;
break;
case 'STATION_ASSISTANT':
if (this.selfJmap) { Vue.prototype.$jlmap = this.selfJmap; }
this.$store.dispatch('training/setPrdType', '01');
this.$store.dispatch('training/setRoles', 'STATION_ASSISTANT');
this.$refs.menuSchema.chiShowStation = deviceCode;
this.showStation = deviceCode;
this.stationRoleShow(deviceCode);
this.jl3dmaintainershow = false;
this.drivingShow = false;
break;
case 'DEPOT_DISPATCHER':
this.$store.dispatch('training/setPrdType', '09');
this.$store.dispatch('training/setRoles', 'DEPOT_DISPATCHER');
this.$refs.menuSchema.chiShowStation = deviceCode;
this.showStation = deviceCode;
this.$jlmap.amendDevice([...this.sectionList, ...this.signalList, ...this.trainWindowList]);
if (this.mapViewLoadedOver) {
const showStation = this.centralizedStationMap[deviceCode];
const list = [];
const mapDevice = this.$store.state.map.mapDevice;
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, showStation);
}
tempData = this.$store.state.map.map.displayList.find(item => { return item.stationCodeList.includes(deviceCode); });
dataZoom = { offsetX: tempData.offsetX, offsetY: tempData.offsetY, scaleRate: tempData.scaleRate };
this.$store.commit('map/setDataZoom', dataZoom);
this.$jlmap.setDepot(dataZoom);
this.jl3dmaintainershow = false;
this.drivingShow = false;
break;
case 'DRIVER':
this.$store.dispatch('training/setPrdType', '04');
this.$store.dispatch('training/setRoles', 'DRIVER');
this.jl3dmaintainershow = false;
this.hidepanel();
this.mapViewLoadedOver && this.setShowStation('');
break;
case 'MAINTAINER':
this.$store.dispatch('training/setPrdType', '');
this.$store.dispatch('training/setRoles', 'MAINTAINER');
this.hideIbp();
this.jl3dmaintainershow = true;
this.mapViewLoadedOver && this.setShowStation('');
this.drivingShow = false;
break;
case 'RAIL_CTC':
this.$store.dispatch('training/setPrdType', '10');
this.$store.dispatch('training/setRoles', 'RAIL_CTC');
this.$refs.menuSchema.chiShowStation = deviceCode;
this.showStation = deviceCode;
this.$jlmap.amendDevice([...this.sectionList, ...this.signalList, ...this.trainWindowList]);
this.mapViewLoadedOver && this.switchStationMode(deviceCode);
this.jl3dmaintainershow = false;
this.drivingShow = false;
break;
default:
this.$store.dispatch('training/setPrdType', '');
this.$store.dispatch('training/setRoles', 'AUDIENCE');
this.jl3dmaintainershow = false;
this.drivingShow = false;
this.hideIbp();
this.mapViewLoadedOver && this.setShowStation('');
}
if (this.$route.query.type === 'ILW') {
this.$store.dispatch('training/setPrdType', '');
this.$store.dispatch('training/setRoles', 'AUDIENCE');
this.jl3dmaintainershow = false;
this.drivingShow = false;
this.hideIbp();
}
},
async getTrainDetail() {
try {
// await loadNewMapDataByGroup(this.group);
await loadMapDataById(this.mapId, 'Group');
await this.$store.dispatch('training/setMapDefaultState');
// if (this.userRole == 'MAINTAINER') {
// this.jl3dmaintainershow = true;
// }
} catch (error) {
this.$messageBox(this.$t('error.getMapDataFailed'));
this.endViewLoading();
}
},
back() {
this.$refs.demonMenu.back();
},
runPlanLoadShow() { // 运行图加载
this.$refs.runPlanLoad.doShow();
},
faultChooseShow() { // 故障列表加载
this.$refs.faultChoose.doShow();
},
passflow() {
const routeData = this.$router.resolve({
path:'/jlmap3d/passengerflow',
query:{
mapid:this.mapId,
group:this.group,
project: this.project,
lineCode:this.lineCode,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
faultdevice() {
const routeData = this.$router.resolve({
path:'/jlmap3d/maintainer',
query:{
mapid:this.mapId,
group:this.group,
project: this.project,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
showdriving() {
this.panelShow = true;
this.drivingShow = false;
this.ibpShow = false;
},
showIbp(deviceCode) {
this.drivingShow = false;
this.panelShow = false;
this.ibpShow = true;
this.$refs.ibpPlate.show(deviceCode, this.ibpPart);
},
hidejl3dcctv() {
const routeData = this.$router.resolve({
path:'/jlmap3d/passengerflow',
query:{
mapid:this.mapId,
group:this.group,
project: this.project,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
hidepanel() { // 司机视角
if (this.$store.state.training.prdType == '04') {
this.panelShow = false;
this.drivingShow = true;
this.$refs.Jl3dDrive.show(this.mapId, this.group, 34, 'isTraining', this.deviceCode);
} else {
const routeData = this.$router.resolve({
path:'/jlmap3d/sandbox',
query:{
mapid: this.mapId,
group: this.group,
token: getToken(),
project: this.project,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
}
},
hideIbp() {
Message.closeAll();
this.jl3dmaintainershow = false;
this.panelShow = true;
this.ibpShow = false;
if (this.$refs && this.$refs.ibpPlate) {
this.$refs.ibpPlate.ibpDestroy();
}
},
messageInfo(message, type) {
this.$message({
showClose: true,
message: message,
type: type
});
},
setWindowSize() {
this.$store.dispatch('config/resize', { width: this.width, height: this.height });
if (this.prdType == '07') {
this.setBigScreenMode();
}
},
switchStationMode(stationCode) {
this.showStation = this.centralizedStationMap[stationCode];
this.setShowStation(this.showStation);
},
// changePrdType(val) {
// const nameList = Object.keys(this.$store.state.map.map || {});
// let list = []; let showMode = '';
// nameList.forEach(item => {
// if (item !== 'skinVO') {
// const data = this.$store.state.map.map[item];
// if (data && data.constructor === Array) {
// list = [...list, ...data];
// }
// }
// });
//
// if (val === '01') {
// showMode = '03';
// } else if (val === '02') {
// showMode = '02';
// }
//
// this.$jlmap.updatePrdType(list, showMode, val);
// },
setShowStation(stationCode) {
const showStation = this.centralizedStationMap[stationCode];
const list = [];
const mapDevice = this.$store.state.map.mapDevice;
for (const key in mapDevice) {
list.push(mapDevice[key]);
}
this.$jlmap.updateShowStation(list, showStation);
this.$jlmap.setCenter(showStation);
},
setCentralizedstationList(map) {
this.centralizedstationList = [];
(map.stationList || []).forEach(item => {
if (item.centralized) {
this.centralizedstationList.push({value: item.code, name: item.name});
this.centralizedStationMap[item.code] = item.code;
item.chargeStationCodeList && item.chargeStationCodeList.length && item.chargeStationCodeList.forEach(ele => {
this.centralizedStationMap[ele] = item.code;
});
}
});
if (this.centralizedstationList.length && !this.showStation) {
this.showStation = this.centralizedstationList[0].value;
}
},
setBigScreenMode() {
if (this.bigScreenConfig.bigScreenSplitConfig.length) {
const offsetList = this.bigScreenConfig.offsetList;
const width = this.bigScreenConfig.width;
const height = this.bigScreenConfig.height;
const size = {
width: this.$store.state.app.width * width,
height: (this.$store.state.app.height - 60) * height,
offsetY: 60,
list: this.bigScreenConfig.bigScreenSplitConfig.map(ele => ele.position),
offsetList: offsetList
};
this.$jlmap.off('zoom'); // 禁止缩放
this.$jlmap.setUpdateScreen(size);
}
},
cancelBigScreenMode() {
this.$jlmap.on('zoom'); // 激活缩放
this.$jlmap.setRevoverBigScreen(); // 设置默认缩放 位移
},
handlerMemberManage() {
this.$refs.membersManage.doShow();
},
addSimulationMember() {
this.$refs.addMember.doShow();
},
troClick() {
this.$refs.troDialog.doShow();
},
openTrainTrunkDetail(index) {
this.$refs.trainTrunkDetail.doShow(index);
},
changeShowMap(flag) {
this.showMap = flag;
},
openTra() {
this.$refs.traDialog.doShow();
},
checkRoleChange(data) {
data.forEach(item => {
if (item.messageType === 'KICK_OUT' && item.userId == this.userId) {
this.$messageBox('您已经被请离房间！');
this.$refs.demonMenu.back();
} else if (item.messageType === 'PLAY_CHANGE' && item.userId == this.userId) {
this.userRole = item.type || 'AUDIENCE';
this.$store.dispatch('training/setRoleDeviceCode', item.deviceCode);
this.$store.dispatch('training/setUserRole', this.userRole);
this.deviceCode = item.deviceCode;
this.setSimulationPrdType(this.centralizedStationMap[item.deviceCode]);
}
});
}
}
};
</script>
<style scoped lang="scss" rel="stylesheep/scss">
.main {
display: block;
width: 100% !important;
height: 100%;
overflow: hidden;
position: relative;
background: #000000;
}
</style>

138
src/views/newMap/jointTrainingNew/memberManage/addMember.vue
View File

@ -1,138 +0,0 @@
<template>
<el-dialog
v-dialogDrag
:title="title"
:visible.sync="dialogVisible"
width="500px"
:before-close="handleClose"
center
:close-on-click-modal="false"
>
<el-form ref="form" :model="formModel" label-width="120px" :rules="rules">
<el-form-item label="添加仿真成员:" prop="type">
<el-select v-model="formModel.type" placeholder="请选择" size="small">
<el-option
v-for="item in typeList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item v-if="stationRoleList.includes(formModel.type)" label="值班车站:" prop="deviceCode">
<el-select v-model="formModel.deviceCode" placeholder="请选择" size="small">
<el-option
v-for="item in filterStationList"
:key="item.code"
:label="item.name"
:value="item.code"
/>
</el-select>
</el-form-item>
<el-form-item label="仿真成员名称:" prop="name">
<el-input v-model="formModel.name" size="small" placeholder="请输入成员名称" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click="doSave">{{ $t('global.confirm') }}</el-button>
<el-button @click="handleClose">{{ $t('global.cancel') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { addSimulationMember } from '@/api/jointSimulation';
export default {
name: 'AddMember',
props: {
stationList: {
type: Array,
required: true
}
},
data() {
return {
dialogVisible: false,
formModel: {
type: '',
name: '',
deviceCode: ''
},
filterStationList: [],
rules: {
type: [
{ required: true, message: '请选择显示位置', trigger: 'change' }
],
deviceCode: [
{ required: true, message: '请选择值班车站', trigger: 'change' }
]
},
stationRoleList:[
'STATION_SUPERVISOR',
'STATION_ASSISTANT',
'STATION_MASTER',
'STATION_SIGNALER',
'STATION_PASSENGER',
'STATION_SWITCH_MAN',
'STATION_FACILITATOR',
'STATION_WORKER',
'DEVICE_MANAGER'
],
typeList: [
{label: '行调', value: 'DISPATCHER'},
{label: '通号', value: 'MAINTAINER'},
{label: '车站值班员', value: 'STATION_SUPERVISOR'},
{label: '车站助理', value: 'STATION_ASSISTANT'},
{label: '车站站长', value: 'STATION_MASTER'},
{label: '车站信号员', value: 'STATION_SIGNALER'},
{label: '车站客运员', value: 'STATION_PASSENGER'},
{label: '车站扳道员', value: 'STATION_SWITCH_MAN'},
{label: '车站引导员', value: 'STATION_FACILITATOR'},
{label: '车站工务工', value: 'STATION_WORKER'},
{label: '设备管理员', value: 'DEVICE_MANAGER'},
{label: '车务段段长', value: 'TRAIN_MASTER'}
]
};
},
computed: {
title() {
return '添加仿真角色成员';
}
},
methods: {
initData(row) {
this.filterStationList = [];
this.stationList.forEach(item => {
if (!item.depot) {
this.filterStationList.push(item);
}
});
},
doShow(row) {
this.initData(row);
this.dialogVisible = true;
},
doSave() {
this.$refs.form.validate(() => {
// if (this.formModel.type !== 'STATION_SUPERVISOR') { delete this.formModel.deviceCode; }
if (!this.stationRoleList.includes(this.formModel.type)) { delete this.formModel.deviceCode; }
addSimulationMember(this.formModel, this.$route.query.group).then(() => {
this.$message.success('添加仿真角色成员成功！');
this.handleClose();
}).catch(() => {
this.$message.error('添加仿真角色成员失败！');
});
});
},
handleClose() {
this.dialogVisible = false;
this.formModel = {
type: '',
name: '',
deviceCode: ''
};
this.$refs.form.resetFields();
}
}
};
</script>

100
src/views/newMap/jointTrainingNew/memberManage/content-menu.vue
View File

@ -1,100 +0,0 @@
<template>
<div class="jointRoomMenu">
<pop-menu ref="popMenu" :menu="menu" />
</div>
</template>
<script>
import PopMenu from '@/components/PopMenu';
import { DeviceMenu } from '@/scripts/ConstDic';
import { kickOutMember } from '@/api/jointSimulation';
export default {
components: {
PopMenu
},
props: {
clickUserId: {
type: String,
default: ''
},
menuDisabled: {
type: Boolean,
default: false
}
},
data() {
return {
// menu: [{
// label: this.$t('trainRoom.kickOutTheRoom'),
// handler: this.kicked
// }]
};
},
computed: {
userId() {
return this.$store.state.user ? this.$store.state.user.id : '';
},
position() {
return this.$store.state.menuOperation.menuPosition;
},
menu() {
return [{
label: this.$t('trainRoom.kickOutTheRoom'),
handler: this.kicked,
disabled: this.menuDisabled
}];
}
},
watch: {
'$store.state.menuOperation.menuCount': function (val) {
if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.JointRoom)) {
this.doShow();
} else {
this.doClose();
}
}
},
mounted() {
this.closeEvent();
},
beforeDestroy() {
window.removeEventListener('click', this.doClose, false);
},
methods: {
closeEvent() {
window.addEventListener('click', this.doClose, false);
},
doShow() {
this.closeEvent();
if (this.userId != this.clickUserId) {
if (this.$refs && this.$refs.popMenu) {
this.$refs.popMenu.resetShowPosition(this.position);
}
}
},
doClose() {
if (this.$refs && this.$refs.popMenu) {
this.$refs.popMenu.close();
}
},
async kicked() {
try {
await kickOutMember(this.$route.query.group, this.clickUserId);
} catch (error) {
console.error(error);
}
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
/deep/ {
.menu-item{
background: #f1ecec;
.pop-menu {
background: #5F9EA0;
}
}
}
</style>

157
src/views/newMap/jointTrainingNew/memberManage/e-members.vue
View File

@ -1,157 +0,0 @@
<template>
<div class="member">
<div class="member__head">
<div class="member__head--title"> 仿真用户列表</div>
<div class="member__head--notes"> {{ onlineNum }}/{{ members.length }}</div>
</div>
<div class="member__container">
<el-input v-model="filterText" :placeholder="this.$t('global.enterNameToFilter')" clearable />
<el-scrollbar class="member__container--list" wrap-class="scrollbar-wrapper" style="{height: calc(100% - 64px)}">
<el-tree
ref="tree"
:data="filterMembers"
:filter-node-method="handleFilterNode"
:lazy="false"
:props="defaultProps"
@node-contextmenu="handleShowContextMenu"
>
<span slot-scope="{ node, data }">
<span v-if="node.data.online" style="color: green;">{{ data.nickName + (data.admin? '【管理员】':'') + (data.referee? '【裁判员】':'') + (data.deviceVO? ` -- (${data.deviceVO.code})`:'') }}</span>
<span v-else style="color: #ccc;">{{ data.nickName + (data.admin? '【管理员】':'') + (data.referee? '【裁判员】':'') + (data.deviceVO? ` -- (${data.deviceVO.code})`:'') }}</span>
</span>
</el-tree>
</el-scrollbar>
</div>
<content-menu ref="menu" :click-user-id="clickUserId" :menu-disabled="menuDisabled" />
</div>
</template>
<script>
import { DeviceMenu } from '@/scripts/ConstDic';
import ContentMenu from './content-menu';
export default {
components: {
ContentMenu
},
props: {
room: {
type: Object,
required: true
},
members: {
type: Array,
required: true
},
isAdmin: {
type: Boolean,
default() {
return false;
}
}
},
data() {
return {
filterText: '',
clickUserId: '',
menuDisabled: false,
onlineNum: 1
};
},
computed: {
defaultProps() {
return { label: 'nickName' };
},
filterMembers() {
return this.members.filter(e =>{ return e.nickName.includes(this.filterText); });
},
userId() {
return this.$store.state.user ? this.$store.state.user.id : '';
}
},
watch: {
members: {
handler(n, o) {
let num = 0;
if (n && n.length) {
n.forEach(item => {
if (item.online) {
num++;
}
});
}
this.onlineNum = num;
},
immediate: true,
deep: true
}
},
methods: {
handleFilterNode(value, data) {
if (!value) return true;
return data.name.indexOf(value) !== -1;
},
handleShowContextMenu(e, obj, node, vueElem) {
e.preventDefault();
const position = {
x: e.clientX,
y: e.clientY
};
if (this.isAdmin) {
this.clickUserId = `${obj.userId || ''}`;
this.menuDisabled = !!obj.deviceVO;
this.$store.dispatch('menuOperation/setPopMenu', { position, menu: DeviceMenu.JointRoom });
}
}
}
};
</script>
<style scoped lang="scss">
.member {
background: #f0f0f0;
display: flex;
flex-direction: column;
border: 1px solid #ccc;
&__head {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 10px;
border-bottom: 1px solid #ccc;
&--title {
padding:10px 0px;
font-size: 16px;
font-weight: bold;
}
&--notes {
font-size: 16px;
padding:10px 0px;
display: flex;
align-items: flex-end;
}
}
&__container {
flex-grow: 1;
height: 520px;
&--list {
background: #fff;
height: calc(100% - 109px);
border-bottom: 1px #ccc solid;
&::-webkit-scrollbar {
display: none;
}
}
}
}
/deep/ {
.member__container{
height: calc(100% - 40px);
}
}
</style>

484
src/views/newMap/jointTrainingNew/memberManage/membersManage.vue
View File

@ -1,484 +0,0 @@
<template>
<el-drawer
title="仿真成员管理"
:visible.sync="show"
:direction="direction"
:before-close="doClose"
custom-class="drawer_box"
size="43%"
>
<div class="room">
<div class="room__container">
<div style="width: 70%;height: calc(100% - 20px);">
<div style="margin-left: 10px;margin-right: 10px;">
<el-input v-model="queryMember" placeholder="请输入搜索人员">
<el-button slot="append" icon="el-icon-search" />
</el-input>
<el-button @click="addMember">添加仿真成员</el-button>
</div>
<el-tree
ref="tree"
:data="treeData"
:props="defaultProps"
default-expand-all
style="margin: 10px;margin-bottom: 0;border: 1px solid #ccc;overflow-y: auto;height: calc(100% - 120px);"
:filter-node-method="filterNode"
@node-click="handleNodeClick"
>
<span :id="data.id" slot-scope="{ data }" class="custom-tree-node">
<span>{{ data.labelName }}</span>
<span v-if="data.type">
<el-select :key="data.id" v-model="data.userId" placeholder="请选择" clearable size="mini" @change="nodeMemberChange($event, data)">
<el-option
v-for="item in simulationUserList"
:key="item.userId"
:label="item.nickName"
:value="item.userId"
/>
</el-select>
</span>
</span>
</el-tree>
</div>
<e-members
class="room__container--members"
:room="room"
:members="simulationUserList"
:is-admin="isAdmin"
style="height: 100%"
@message="messageInfo"
/>
</div>
<div class="room__footer" />
</div>
</el-drawer>
</template>
<script>
import eMembers from './e-members';
import { EventBus } from '@/scripts/event-bus';
import { assignUsersPlayRoles } from '@/api/jointSimulation';
export default {
name: 'MembersManage',
components: {
eMembers
},
props: {
isAdmin: {
type: Boolean,
default() {
return false;
}
}
},
data() {
return {
show: false,
direction: 'ltr',
queryMember: '',
room: {
totalNum: 0,
group: '',
mapId: '',
creatorId: '',
creator: {
nickName: ''
},
permissionRest: 0,
permissionNum: 0,
state: ''
},
defaultProps: {
children: 'children',
label: 'labelName'
},
simulationUserList: [],
stationList: [],
availableStationList:[],
activeTrains: [],
standList: [],
doorList: [],
memberData: {},
treeData: [{
labelName: '行调',
children: []
}, {
labelName: '车站值班员',
children: []
}, {
labelName: '司机',
children: []
}, {
labelName: '通号',
children: []
}, {
labelName: '车辆段',
children: []
}, {
labelName: 'CTC操作员',
children: []
}, {
labelName: '车站助理',
children: []
},
{
labelName: '车站站长',
children: []
},
{
labelName: '车站信号员',
children: []
},
{
labelName: '车站客运员',
children: []
},
{
labelName: '车站扳道员',
children: []
},
{
labelName: '车站引导员',
children: []
},
{
labelName: '车站工务工',
children: []
},
{
labelName: '设备管理员',
children: []
}
]
};
},
computed: {
height() {
return this.$store.state.app.height - 130;
},
group() {
return this.$route.query.group;
},
userId() {
return this.$store.state.user ? this.$store.state.user.id : '';
},
username() {
return this.$store.state.user.nickname;
}
},
watch: {
queryMember(val) {
this.$refs.tree.filter(val);
},
'$store.state.training.simulationUserList': function(val) {
this.simulationUserList = val;
},
'$store.state.training.memberList': function (val) {
if (val && val.length) {
this.memberData = this.$store.state.training.memberData;
const dispatcherList = [];
const electricDispatcherList = [];
const depotDispatcherList = [];
const stationSupervisorList = [];
const driverList = [];
const maintainerList = [];
const ctcOperatorList = [];
const stationAssistantList = [];
const stationMasterList = [];
const stationSignalerList = [];
const stationPassengerList = [];
const stationSwitchManList = [];
const stationFacilitatorList = [];
const stationWorkerList = [];
const deviceManagerList = [];
const trainMasterList = [];
val.forEach(item => {
const device = this.$store.getters['map/getDeviceByCode'](item.deviceCode);
switch (item.type) {
case 'DISPATCHER':
this.memberData[item.id].labelName = '行调' + (item.name || '');
dispatcherList.push(this.memberData[item.id]);
break;
case 'ELECTRIC_DISPATCHER':
this.memberData[item.id].labelName = '电力调度' + (item.name || '');
electricDispatcherList.push(this.memberData[item.id]);
break;
case 'DEPOT_DISPATCHER':
this.memberData[item.id].labelName = '车辆段信号楼' + (item.name || '');
depotDispatcherList.push(this.memberData[item.id]);
break;
case 'STATION_SUPERVISOR':
this.memberData[item.id].labelName = '值班员-' + device.name + (item.name ? `-${item.name }` : '');
stationSupervisorList.push(this.memberData[item.id]);
break;
case 'DRIVER':
this.memberData[item.id].labelName = '司机-列车' + item.deviceCode;
driverList.push(this.memberData[item.id]);
break;
case 'MAINTAINER':
this.memberData[item.id].labelName = '通号' + (item.name || '');
maintainerList.push(this.memberData[item.id]);
break;
case 'RAIL_CTC':
this.memberData[item.id].labelName = 'CTC操作员' + device.name;
ctcOperatorList.push(this.memberData[item.id]);
break;
case 'STATION_ASSISTANT':
this.memberData[item.id].labelName = '车站助理-' + device.name + (item.name ? `-${item.name }` : '');
stationAssistantList.push(this.memberData[item.id]);
break;
case 'STATION_MASTER':
this.memberData[item.id].labelName = '车站站长-' + device.name + (item.name ? `-${item.name }` : '');
stationMasterList.push(this.memberData[item.id]);
break;
case 'STATION_SIGNALER':
this.memberData[item.id].labelName = '车站信号员-' + device.name + (item.name ? `-${item.name }` : '');
stationSignalerList.push(this.memberData[item.id]);
break;
case 'STATION_PASSENGER':
this.memberData[item.id].labelName = '车站客运员-' + device.name + (item.name ? `-${item.name }` : '');
stationPassengerList.push(this.memberData[item.id]);
break;
case 'STATION_SWITCH_MAN':
this.memberData[item.id].labelName = '车站扳道员-' + device.name + (item.name ? `-${item.name }` : '');
stationSwitchManList.push(this.memberData[item.id]);
break;
case 'STATION_FACILITATOR':
this.memberData[item.id].labelName = '车站引导员-' + device.name + (item.name ? `-${item.name }` : '');
stationFacilitatorList.push(this.memberData[item.id]);
break;
case 'STATION_WORKER':
this.memberData[item.id].labelName = '车站工务工-' + device.name + (item.name ? `-${item.name }` : '');
stationWorkerList.push(this.memberData[item.id]);
break;
case 'DEVICE_MANAGER':
this.memberData[item.id].labelName = '设备管理员-' + device.name + (item.name ? `-${item.name }` : '');
deviceManagerList.push(this.memberData[item.id]);
break;
case 'TRAIN_MASTER':
// device.name;
this.memberData[item.id].labelName = '车务段段长-' + (item.name ? `-${item.name }` : '');
trainMasterList.push(this.memberData[item.id]);
break;
// DEVICE_MANAGER:'设备管理员' deviceManager
}
});
this.treeData = [{
labelName: '行调',
id: 'dispatcher',
children: dispatcherList
}, {
labelName: '车站值班员',
id: 'stationSupervisor',
children: stationSupervisorList
}, {
labelName: '司机',
id: 'driver',
children: driverList
}, {
labelName: '通号',
id: 'maintainer',
children: maintainerList
}, {
labelName: '车辆段信号楼',
id: 'depotDispatcher',
children: depotDispatcherList
}, {
labelName: '电力调度',
id: 'electricDispatcher',
children: electricDispatcherList
}, {
labelName: 'CTC操作员',
id: 'ctcOperator',
children: ctcOperatorList
}, {
labelName: '车站助理',
id: 'stationAssistant',
children: stationAssistantList
},
{
labelName: '车站站长',
id: 'stationMaster',
children: stationMasterList
},
{
labelName: '车站信号员',
id: 'stationSignaler',
children: stationSignalerList
},
{
labelName: '车站客运员',
id: 'stationPassenger',
children: stationPassengerList
},
{
labelName: '车站扳道员',
id: 'stationSwitchMan',
children: stationSwitchManList
},
{
labelName: '车站引导员',
id: 'stationFacilitator',
children: stationFacilitatorList
},
{
labelName: '车站工务工',
id: 'stationWorker',
children: stationWorkerList
},
{
labelName: '设备管理员',
id: 'deviceManager',
children: deviceManagerList
},
{
labelName: '车务段段长 ',
id: 'trainMaster',
children: trainMasterList
}
];
EventBus.$emit('trainTicketMember', [...stationSupervisorList, ...stationAssistantList]);
this.$nextTick(() => {
if (this.$refs.tree) {
this.$refs.tree.filter(this.queryMember);
}
});
}
},
'$store.state.map.activeTrainListChange': function () {
this.activeTrains = [];
const activeTrainList = this.$store.state.map.activeTrainList;
if (activeTrainList && activeTrainList.length) {
activeTrainList.forEach(groupNumber => {
this.activeTrains.push(groupNumber);
});
}
this.$refs.tree && this.$refs.tree.filter(this.queryMember);
}
},
mounted() {
},
methods: {
doShow() {
this.show = true;
this.memberData = this.$store.state.training.memberData;
this.simulationUserList = this.$store.state.training.simulationUserList;
this.$nextTick(() => {
if (this.$refs.tree) {
this.$refs.tree.filter(this.queryMember);
}
});
},
doClose() {
this.show = false;
},
messageInfo(info) {
this.$message({ showClose: true, ...info });
},
jumpInSimulation() {
},
clearSubscribe() {
},
handleNodeClick() {
},
nodeMemberChange(val, nodeData) {
let user = '';
this.simulationUserList.forEach(item => {
if (val && item.userId === val) {
user = item;
} else if (!val && item.memberId === nodeData.id) {
user = item;
}
});
const data = [{userId: user.userId, memberId:val ? nodeData.id : ''}];
const self = this;
assignUsersPlayRoles(data, this.$route.query.group).then(resp => {
this.$message.success('调整角色成员成功！');
}).catch(() => {
self.memberData[nodeData.id].userId = '';
this.$message.error('调整角色成员失败！');
});
},
addMember() {
this.$emit('addSimulationMember');
},
filterNode(value, data) {
let flag = false;
if (this.memberData[data.id] && this.memberData[data.id].nickName) {
flag = this.memberData[data.id].nickName.indexOf(value) !== -1;
}
let driverNoShow = true;
if (data.type && data.type === 'DRIVER' && !this.activeTrains.includes(data.deviceCode)) {
driverNoShow = false;
}
return (data.labelName.indexOf(value) !== -1 || flag) && driverNoShow;
}
// handlerMemberOnOff(data) {
// this.$store.dispatch('training/updateMemberAndUser', { simulationUserList: data, userId: this.userId });
// }
}
};
</script>
<style scoped lang="scss">
.drawer_box{
width: 800px;
}
.custom-tree-node {
flex: 1;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 14px;
padding-right: 8px;
margin: 2px;
}
.room {
width: 100%;
height: 100%;
// display: flex;
// flex-direction: column;
box-sizing: border-box;
background: #f0f0f0;
&__container {
height: 100%;
display: flex;
flex-grow: 1;
padding: 10px;
&--members {
flex-shrink: 1;
flex-grow: 1;
}
&--roles {
flex-grow: 5;
flex-shrink: 5;
}
&--chat {
flex-basis: 360px;
}
}
&__footer {
height: 20px;
}
}
/deep/ {
.el-input--mini .el-input__inner {
height: 24px;
line-height: 24px;
}
.el-input-group {
width: calc(100% - 146px);
}
.el-dialog__body {
padding: 6px 20px;
}
.el-drawer__body{
height: 100%;
}
}
</style>

566
src/views/newMap/jointTrainingNew/menuDemon.vue
View File

@ -1,566 +0,0 @@
<template>
<div>
<status-icon v-if="statusIconShow" ref="statusIcon" />
<voice-chat-box v-if="!noChatBox && datie" :group="group" :user-role="userRole" />
<chat-box v-if="!noChatBox && !datie" :group="group" :user-role="userRole" />
<!-- 地图没有报错-->
<!-- 地图错误判断 -->
<div v-if="!dataError&&hasOneButton" class="display_top_draft" :style="{top: statusIconShow ? offset + 60 + 'px':offset+'px'}">
<div class="btn_hover" @click="menuClick">菜单</div>
<el-button-group ref="button_group_box" class="button_group_box" :style="`margin-left:-${btnWidth}px`">
<!-- 设备视图 -->
<el-button v-if="isShow3dmodel && isShowScheduling" size="small" @click="jumpjlmap3dmodel">{{ $t('display.demon.deviceView') }}</el-button>
<!-- 三维视图 / 司机视角 -->
<el-button v-if="isShowScheduling || isDriver || isDISPATCHER" size="small" @click="jumpjlmap3d">{{ jl3dname }}</el-button>
<!-- cctv视图 -->
<el-button v-if="isShowScheduling || isStationSupervisor" size="small" @click="jumpjl3dpassflow">{{ $t('display.demon.passengerflow') }}</el-button>
<!-- 客流规划视图 -->
<el-button v-if="project == 'bjd' && (isShowScheduling || isStationSupervisor)" size="small" @click="jumpjl3dtrafficplan">{{ $t('display.demon.trafficplantext') }}</el-button>
<el-button v-if="project == 'bjd' && (isShowScheduling || isStationSupervisor)" size="small" @click="jumpjl3dtraffictrain">{{ $t('display.demon.traffictraintext') }}</el-button>
<el-button v-if="(isShowScheduling || isStationSupervisor)&&project !== 'bjd'" size="small" @click="jumpjl3dfaultdevice">{{ $t('display.demon.maintainer') }}</el-button>
<!-- <el-button v-if="isAdmin" size="small" @click="otherVrView">VR第三人称视角</el-button> -->
<el-button v-if="qrCodeShow" type="primary" size="small" @click="generateQrCode">生成二维码</el-button>
<el-button v-if="memberManageShow" size="small" @click="memberManage">成员管理</el-button>
<el-button v-if="deviceManageShow" size="small" @click="handleEquipment">设备管理</el-button>
<el-button v-if="teachSystemShow" size="small" @click="handleTeach">教学系统</el-button>
<el-button v-if="examSystemShow" size="small" @click="handleExam">考试系统</el-button>
<el-button v-if="messageBoard" size="small" @click="messageBoardShow">留言板</el-button>
<el-button v-if="!isLocal" size="small" @click="contectUs">联系方式</el-button>
</el-button-group>
</div>
<div class="display-draft" :class="{'haerbin_btn_box': lineCode == '07'||lineCode=='14'}" :style="{bottom: offsetBottom + 'px'}">
<el-button-group class="button-group-box">
<template v-if="!dataError"> <!-- 地图错误判断 -->
<template v-if="isAdmin && project != 'refereeJsxt' && $route.query.type !== 'ILW'">
<!-- 按计划行车 -->
<el-button v-if="project !== 'srsandbox' && !datie" type="success" :disabled="isDisable" size="small" @click="selectBeginTime">{{ $t('joinTraining.drivingByPlan') }}</el-button>
<el-button v-if="isAdministrator && !datie" v-loading="pauseLoading" :type="simulationPaused?'warning':'primary'" size="small" @click="startOrPause">{{ simulationPaused?'开始':'暂停' }}</el-button>
<el-button type="danger" size="small" @click="end">{{ $t('joinTraining.initialize') }}</el-button>
</template>
<template v-if="datie">
<el-button type="primary" size="small" @click="modifySystemTime">修改系统时间</el-button>
</template>
</template>
<el-button type="primary" :loading="backLoading" size="small" @click="back">退出</el-button>
</el-button-group>
</div>
<qr-code ref="qrCode" />
<set-time ref="setTime" @ConfirmSelectBeginTime="start" />
<modify-time v-if="datie" ref="modifySysTime" />
<equipment ref="equipment" />
<contect-us ref="contectUs" />
</div>
</template>
<script>
import QrCode from '@/components/QrCode';
import StatusIcon from '@/views/components/StatusIcon/statusIcon';
import ChatBox from '../chatView/chatBox';
import voiceChatBox from '../chatView/voiceChatBox';
import Equipment from '@/views/newMap/displayNew/demon/equipment';
import SetTime from '@/views/newMap/displayNew/demon/setTime';
import ModifyTime from '@/views/newMap/displayNew/demon/modifyTime';
import { ranAsPlan, exitRunPlan, clearSimulation } from '@/api/simulation';
import { exitFullscreen } from '@/utils/screen';
import { getSimulationQrcode } from '@/api/jointSimulation';
import { getSessionStorage } from '@/utils/auth';
import { NoSimulationQrCodeList } from '@/scripts/ProjectConfig';
import { getPublishLessonListByMapId } from '@/api/jmap/lesson';
import { getPostByProjectCode } from '@/api/learn';
import { ProjectCode } from '@/scripts/ProjectConfig';
import ContectUs from '@/views/newMap/displayNew/dispatherContest/contectUs';
import { simulationPause, simulationStart } from '@/api/rtSimulation';
export default {
name: 'MenuDemonJoint',
components: {
ChatBox,
voiceChatBox,
QrCode,
SetTime,
ModifyTime,
Equipment,
ContectUs,
StatusIcon
},
props: {
group: {
type: String,
required: true
},
userRole: {
type: String,
required: true
},
deviceCode: {
type: String,
default() {
return '';
}
},
dataError: {
type: Boolean,
default() {
return false;
}
},
isAdmin: {
type: Boolean,
default() {
return false;
}
},
offset: {
type: Number,
required: true
},
offsetBottom: {
type: [String, Number],
default: 15
}
},
data() {
return {
backLoading: false,
chatShow: true,
pauseLoading: false,
isGoback: false,
noSimulationQrCodeList: NoSimulationQrCodeList,
isShow3dmodel :false,
jl3dname: this.$t('display.demon.threeDimensionalView'),
hoverBtn: false,
btnWidth: 0,
messageBoard: false
};
},
computed: {
lineCode() {
return this.$route.query.lineCode;
},
datie() {
return ['16', '19'].includes(this.$route.query.lineCode);
},
mapId() {
return this.$route.query.mapId;
},
isShowScheduling() {
// 行调与管理员 可显示
return (this.$store.state.training.prdType == '02' || this.isAdmin) && (!this.$route.query.projectDevice) && !['16', '19'].includes(this.$route.query.lineCode);
},
isDISPATCHER() {
return (this.$store.state.training.prdType == '01' || this.$store.state.training.prdType == '02' || this.isAdmin) && (!this.$route.query.projectDevice || this.project == 'sdy');
},
isStationSupervisor() {
return (this.userRole == 'STATION_SUPERVISOR' && (!this.$route.query.projectDevice || this.project == 'sdy')) || this.project === 'gzb';
},
isDriver() {
return this.userRole == 'DRIVER' && !this.$route.query.projectDevice;
},
project() {
return getSessionStorage('project');
},
isProject() {
return getSessionStorage('project') != 'login' && getSessionStorage('project') != 'design';
},
isLocal() { // 是否为本地项目
return process.env.VUE_APP_PRO === 'local';
},
hasOneButton() {
let num = 0;
if ((this.isShow3dmodel && this.isShowScheduling) ||
(this.isShowScheduling || this.isDriver) ||
(this.isShowScheduling || this.isStationSupervisor) ||
(this.isAdmin && !this.noSimulationQrCodeList.includes(this.project)) ||
(this.isAdmin) || (this.isAdmin && this.isProject) || this.isDeviceLogin || this.$route.query.type === 'IM') {
num++;
}
return num > 0;
},
isDeviceLogin() {
const typeList = ['LW', 'CW'];
return typeList.includes(this.$route.query.type);
},
examSystemShow() {
const typeList = ['LW', 'CW', 'IM'];
return typeList.includes(this.$route.query.type);
},
teachSystemShow() {
const typeList = ['LW', 'CW'];
return typeList.includes(this.$route.query.type);
},
memberManageShow() {
return this.isAdmin && this.$route.query.type !== 'ILW';
},
deviceManageShow() {
return (this.isAdmin && this.isProject) || this.$route.query.type === 'ILW';
},
qrCodeShow() {
return this.isAdmin && !this.noSimulationQrCodeList.includes(this.project) && this.$route.query.type !== 'ILW';
},
isDisable() {
return this.$store.state.training.started;
},
statusIconShow() {
return (this.$route.query.lineCode == '11' || this.$route.query.lineCode == '10') && this.$store.state.training.prdType == '02';
},
isAdministrator() {
return this.$store.state.user.roles.includes('04') || this.$store.state.user.roles.includes('05');
},
simulationPaused() {
return this.$store.state.socket.simulationPause;
},
noChatBox() {
return this.$route.query.type === 'ILW' || this.project.includes('srsandbox') || this.project.includes('jxgm');
}
},
watch: {
'$store.state.socket.simulationOver':function(val) {
if (val && this.project == 'refereeJsxt') {
this.$router.go(-1);
} else {
if (!this.isGoback) {
this.back();
}
}
},
'$store.state.training.prdType': function(prdType) {
this.change3dname();
},
'$store.state.socket.simulationStart': async function (val) {
if (val) {
this.$store.dispatch('training/setInitTime', val);
this.$store.dispatch('training/start');
}
}
},
async mounted() {
this.change3dname();
getPostByProjectCode(ProjectCode[this.project]).then(resp => {
if (resp.data) {
this.messageBoard = true;
}
}).catch(() => {
this.$message.error('获取留言板信息失败');
});
this.$nextTick(() => {
this.menuClick();
});
},
async beforeDestroy() {
// 返回 销毁仿真 重置状态
this.isGoback = true;
if (this.isAdmin) {
await clearSimulation(this.group);
}
this.$store.dispatch('training/setMemberList', {memberList:[], userId: this.$store.state.user.id});
this.$store.dispatch('training/setSimulationUserList', []);
this.$store.dispatch('training/over').then(() => {
this.backLoading = true;
this.$store.dispatch('map/resetActiveTrainList', true);
if (this.$route.query.projectDevice) {
this.$store.dispatch('LogOut').then(() => {
location.reload();
});
} else {
exitFullscreen();
}
});
},
methods: {
startOrPause() {
this.pauseLoading = true;
if (this.simulationPaused) {
simulationStart(this.group).then(resp => {
this.pauseLoading = false;
}).catch(() => {
this.pauseLoading = false;
this.$messageBox('开始失败，请稍后再试');
});
} else {
simulationPause(this.group).then(resp => {
this.pauseLoading = false;
}).catch(() => {
this.pauseLoading = false;
this.$messageBox('暂停失败，请稍后再试');
});
}
},
// 修改系统时间
modifySystemTime() {
this.$refs.modifySysTime.doShow();
},
selectBeginTime() {
this.$refs.setTime.doShow();
console.log(1);
},
// 开始仿真
start(model) {
const data = {
time: model.initTime
};
ranAsPlan(data, this.group).then(res => {
// this.$store.dispatch('training/setInitTime', model.initTime);
this.$store.dispatch('training/setInitTime', model.timestamp);
}).catch((error) => {
if (error.code == '5001') {
this.$messageBox(this.$t('error.mapDataError') + '，' + this.$t('error.startSimulationFailed'));
} else if (error.code == '5002') {
this.$messageBox(this.$t('error.runningChartDataError') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '5003') {
this.$messageBox(this.$t('error.runningChartIsNotLoaded') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '5004') {
this.$messageBox(this.$t('error.runningDataError') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '5000') {
this.$messageBox(this.$t('error.systemError') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4000') {
this.$messageBox(this.$t('error.simulationDoesNotExist') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4001') {
this.$messageBox(this.$t('error.simulationOperationIsNotDefined') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4002') {
this.$messageBox(this.$t('error.simulationOperationProcessingMethodNotFound') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4003') {
this.$messageBox(this.$t('error.simulationOperationFailed') + ',' + this.$t('error.startSimulationFailed'));
} else if (error.code == '4004') {
this.$messageBox(this.$t('error.operationConflict') + ',' + this.$t('error.startSimulationFailed'));
}
});
},
end() {
exitRunPlan(this.group).then(()=>{
this.$store.dispatch('map/clearJlmapTrainView');
this.$store.dispatch('map/setTrainWindowShow', false);
this.$store.dispatch('map/resetActiveTrainList', false);
}).catch(() => {
this.$store.dispatch('training/over').then(() => {
this.$store.dispatch('map/resetActiveTrainList', false);
this.$messageBox(this.$t('error.endSimulationFailed'));
});
});
},
handleEquipment() {
this.$refs.equipment.doShow();
},
async back() {
this.isGoback = true;
if (this.isAdmin) {
await clearSimulation(this.group);
}
this.$store.dispatch('training/setMemberList', {memberList:[], userId: this.$store.state.user.id});
this.$store.dispatch('training/setSimulationUserList', []);
this.$store.dispatch('training/over').then(() => {
this.backLoading = true;
this.$store.dispatch('map/resetActiveTrainList', true);
if (this.$route.query.projectDevice) {
this.$store.dispatch('LogOut').then(() => {
location.reload();
});
} else {
history.go(-1);
exitFullscreen();
}
});
},
jumpjlmap3d() {
this.$emit('hidepanel');
},
jlmap3dcctv() {
this.$emit('hidejl3dcctv');
},
jumpjl3dpassflow() {
this.$emit('passflow');
},
jumpjl3dtrafficplan() {
const routeData = this.$router.resolve({
path:'/jlmap3d/trafficplan',
query:{
mapid:this.mapId,
group:this.group,
project: this.project,
noPreLogout: true,
lineCode:this.lineCode
}
});
window.open(routeData.href, '_blank');
},
jumpjl3dtraffictrain() {
const routeData = this.$router.resolve({
path:'/jlmap3d/traffictrain',
query:{
mapid:this.mapId,
group:this.group,
project: this.project,
noPreLogout: true,
lineCode:this.lineCode
}
});
window.open(routeData.href, '_blank');
},
jumpjl3dfaultdevice() {
this.$emit('faultdevice');
},
jumpjlmap3dmodel() {
this.$emit('devicemodel');
},
otherVrView() {
const routeData = this.$router.resolve({
path:'/jlmap3d/othervr',
query:{
mapid:this.$route.query.mapId,
group:this.$route.query.group,
noPreLogout: true
}
});
window.open(routeData.href);
},
memberManage() {
this.$emit('handlerMemberManage');
},
generateQrCode() {
getSimulationQrcode(this.$route.query.group).then(resp => {
const param = {
url: resp.data,
title: this.$t('综合演练二维码'),
group: this.$route.query.group
};
if (this.$refs) {
this.$refs.qrCode.doShow(param);
}
}).catch(() => {
this.$messageBox('仿真生成二维码失败！');
});
},
change3dname() {
if (this.$store.state.training.prdType == '04') {
this.jl3dname = this.$t('display.demon.driverPerspective'); // 司机视角
} else {
this.jl3dname = this.$t('display.demon.threeDimensionalView'); // 三维视图
this.isShow3dmodel = true;
}
},
menuClick() {
this.hoverBtn = !this.hoverBtn;
if (this.hoverBtn) {
this.btnWidth = 800;
} else {
this.btnWidth = 0;
}
},
messageBoardShow() {
const routeData = this.$router.resolve({
path:'/messageBoard',
query:{
project: this.project,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
handleTeach() {
getPublishLessonListByMapId({mapId: this.mapId}).then(resp => {
const lesson = resp.data.find(item => {
return (this.$route.query.type === 'LW' && item.prdType === '01') || (this.$route.query.type === 'CW' && item.prdType === '02');
});
if (lesson) {
const routeData = this.$router.resolve({
path:'/device/teachDetail',
query:{
lessonId: lesson.id,
mapId:this.mapId,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
} else {
this.$message.error('暂无教学系统数据！');
}
}).catch(() => {
this.$message.error('获取课程ID失败！');
});
},
contectUs() {
this.$refs.contectUs.doShow();
},
handleExam() {
if (this.$route.query.type === 'IM') {
const routeData = this.$router.resolve({
path:'/device/examRule/manage',
query:{
mapId:this.mapId,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
} else {
let prdType = '';
if (this.$route.query.type === 'LW') {
prdType = '01';
} else if (this.$route.query.type === 'CW') {
prdType = '02';
}
if (prdType) {
const routeData = this.$router.resolve({
path:'/device/course',
query:{
prdType: prdType,
mapId:this.mapId,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
}
}
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.display-draft {
position: absolute;
right: 10px;
bottom: 28px;
.button-group-box{
float: right;
}
}
.display_top_draft{
position: absolute;
left: 5px;
top: 15px;
height: 32px;
overflow: hidden;
padding-left: 44px;
z-index: 35;
.btn_hover{
position: absolute;
left: 0;
top: 0;
z-index: 2;
color: #4e4d4d;
font-size: 14px;
background: #fff;
padding: 8px;
border-radius: 5px;
display: block;
cursor: pointer;
float: left;
height: 32px;
}
.button_group_box{
float: left;
transition: all 0.5s;
overflow: hidden;
// transform: translateX(0px);
margin-left: -500px;
}
}
.haerbin_btn_box{
width: 450px;
bottom: 15px!important;
}
.display-type-hb{
bottom: 105px;
}
</style>

94
src/views/newMap/jointTrainingNew/menuDraft/chooseRole.vue
View File

@ -1,94 +0,0 @@
<template>
<el-dialog
v-dialogDrag
:title="title"
:visible.sync="show"
width="400px"
:before-close="doClose"
:z-index="2000"
:modal="false"
:close-on-click-modal="false"
append-to-body
>
<el-input v-model="filterText" placeholder="输入名称进行过滤" clearable />
<ul v-if="filterList.length" class="listBox">
<li v-for="item in filterList" :key="item" class="listLi">
<el-radio v-model="selected" :label="item"><span>{{ item.name }}</span></el-radio>
</li>
</ul>
<span v-else class="tipLable"> {{ $t('global.temporarilyNoData') }} </span>
<span slot="footer" class="dialog-footer">
<el-button @click="doClose">{{ $t('global.cancel') }}</el-button>
<el-button type="primary" :loading="loading" @click="commit">{{ $t('global.confirm') }}</el-button>
</span>
</el-dialog>
</template>
<script>
export default {
name: 'CmdNotice',
data() {
return {
dialogShow: false,
title: '',
props: {
label: 'name'
},
sourceList: [],
filterText: '',
selected: '',
loading: false
};
},
computed: {
show() {
return this.dialogShow;
},
filterList() {
return this.sourceList.filter(p => p.name.indexOf(this.filterText) !== -1);
}
},
methods: {
doShow(obj) {
this.dialogShow = true;
this.title = obj.title;
this.sourceList = obj.list;
this.selected = '';
},
doClose() {
this.dialogShow = false;
},
commit() {
this.$emit('setDriver', this.selected);
this.doClose();
}
}
};
</script>
<style scoped lang="scss">
/deep/ {
.el-dialog__body {
padding: 0px 20px;
}
}
.listBox {
margin: 0px;
max-height: 270px;
overflow-y: auto;
padding-inline-start: 0px;
width: 100%;
.listLi {
list-style: none;
height: 30px;
line-height: 30px;
}
}
.tipLable {
line-height: 33px;
}
</style>

145
src/views/newMap/jointTrainingNew/menuDraft/operateMenu.vue
View File

@ -1,145 +0,0 @@
<template>
<div>
<pop-menu ref="popMenu" :menu="menu" />
<choose-role ref="chooseRole" @setDriver="setDriver" />
</div>
</template>
<script>
import PopMenu from '@/components/PopMenu';
import ChooseRole from './chooseRole';
import { putUserRolesNew} from '@/api/jointTraining';
import { DeviceMenu } from '@/scripts/ConstDic';
export default {
name: 'OperateMenu',
components: {
PopMenu,
ChooseRole
},
props: {
group: {
type: String,
required: true
},
point: {
type: Object,
required: true
},
selected: {
type: Object,
required: true
},
driverList: {
type: Array,
required: true
},
driverMapDict: {
type: Object,
required: true
}
},
data() {
return {
menuShow: false,
menu: [
{
label: this.$t('joinTraining.chooseDriver'),
handler: this.chooseDriver
},
{
label: this.$t('joinTraining.cancelDriver'),
handler: this.cancelDriver
}
]
};
},
watch: {
'$store.state.menuOperation.menuCount': function (val) {
if (this.$store.getters['menuOperation/checkDialogIsOpen'](DeviceMenu.SetDriver)) {
this.doShow(this.$store.state.menuOperation.menuPosition);
} else {
this.doClose();
}
}
},
mounted() {
this.closeEvent();
},
methods: {
closeEvent() {
const self = this;
window.onclick = function (e) {
self.doClose();
};
},
doShow(point) {
this.closeEvent();
if (this.$refs && this.$refs.popMenu) {
this.$refs.popMenu.resetShowPosition(point);
}
this.menuShow = true;
},
doClose() {
if (this.$refs && this.$refs.popMenu) {
this.$refs.popMenu.close();
}
this.menuShow = false;
},
chooseDriver() {
const arrs = Object.values(this.driverMapDict);
const list = this.driverList.filter(elem => {
let ret = true;
arrs.forEach(item => {
if (item.id == elem.id) {
ret = false;
}
});
return ret;
});
this.$refs.chooseRole.doShow({ title: this.$t('joinTraining.chooseDriver'), list: list });
},
async setDriver(obj) {
if (obj && this.selected) {
const params = [{
id: obj.id,
nickName: obj.name,
userRole: 'DRIVER',
stationCode: '',
trainCode: this.selected._code
}];
await putUserRolesNew(params, this.group);
}
},
async cancelDriver() {
const data = this.driverMapDict[this.selected._code];
if (data) {
const params = [{
id: data.id,
nickName: data.name,
userRole: 'DRIVER',
stationCode: '',
trainCode: ''
}];
await putUserRolesNew(params, this.group);
}
},
refresh() {
this.$emit('refresh');
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
/deep/ {
.menu-item{
background: #f1ecec;
.pop-menu {
background: #5F9EA0;
}
}
}
</style>

426
src/views/newMap/jointTrainingNew/menuSchema.vue
View File

@ -1,426 +0,0 @@
<template>
<div style="height:100%">
<div class="schema" :style="{top: offset+'px'}">
<!--<el-select v-if="showSelectStation" v-model="chiShowStation" style="width: 100px;" size="small" @change="switchStationMode">-->
<!--<el-option v-for="item in stationList" :key="item.value" :label="item.name" :value="item.value" />-->
<!--</el-select>-->
<el-select v-if="isAdmin && isSystemAdmin" v-model="speed" style="width: 100px;" size="small" @change="speedChange">
<el-option
v-for="item in speedList"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
<el-button-group>
<el-button v-if="userRole=== 'STATION_SUPERVISOR'&&$route.query.lineCode ==='16'" size="small" @click="goCtc">车务终端</el-button>
<el-button v-if="userRole=== 'STATION_SUPERVISOR'&&$route.query.lineCode ==='16'" size="small" @click="goRpManage">车务管理终端</el-button>
<el-button v-if="$route.query.lineCode ==='16'&&$store.state.training.prdType === '01'" size="small" @click="showTrainTicket">路票</el-button>
<el-button v-if="showRegisterBookBtn" size="small" @click="showRegisterBook">簿册</el-button>
<el-button v-if="showDispatcherStation" size="small" @click="changeShowMap">调度台</el-button>
<el-button v-if="ibpShow" size="small" @click="goIbp">IBP盘</el-button>
<el-button v-if="userRole=== 'DISPATCHER' && !$route.query.projectDevice && hasBigScreen" size="small" @click="goBigScreen">大屏</el-button>
<el-button v-if="(userRole==='DISPATCHER' || userRole=== 'STATION_SUPERVISOR') && !$route.query.projectDevice && iscsShow" size="small" @click="goIscs">ISCS</el-button>
<el-button v-if="running && !dataError && $route.query.type !== 'ILW' && !datie" size="small" :disabled="viewDisabled" @click="viewRunPlan">{{ $t('joinTraining.runGraphPreview') }}</el-button>
<template v-if="isAdmin">
<el-button v-if="!running && !dataError && $route.query.type !== 'ILW' && !datie" size="small" type="warning" @click="loadRunPlan">
{{ $t('joinTraining.runGraphLoading') }}</el-button><!-- 运行图加载 -->
</template>
</el-button-group>
<el-button v-if="(isAdmin || $route.query.type === 'ILW') && !dataError && !isScreen" size="small" :type="faultMode ? '' : 'primary' " @click="changeOperateMode()">{{ faultMode?' 切换到普通模式[Tab]':'切换到故障模式[Tab]' }}</el-button>
<!-- isCenter && !dataError && !isAdmin 此判断用于以后(目前 暂时不用) -->
<el-button v-if="isShowDirective" size="small" :type="directiveMode ? 'primary' : ''" @click="changeDirectiveMode()">{{ directiveMode? '切换到普通模式[Tab]':'切换到指令模式[Tab]' }}</el-button>
</div>
<!-- running && -->
<join-run-plan-view v-if="!dataError" ref="runPlanView" :group="group" />
<select-ibp ref="selectIbp" />
<train-ticket ref="trainTicket" />
<register-book ref="registerBook" />
</div>
</template>
<script>
import { mapGetters } from 'vuex';
import { OperateMode } from '@/scripts/ConstDic';
import { getByGroupStationList } from '@/api/jmap/map';
import { getSessionStorage } from '@/utils/auth';
import JoinRunPlanView from '@/views/newMap/displayNew/demon/runPlanView';
import SelectIbp from '@/views/newMap/displayNew/demon/selectIbp';
import { getIbpInfoByStation } from '@/api/ibp';
import { loadRunPlanData } from '@/utils/loaddata';
import { EventBus } from '@/scripts/event-bus';
import { timesSpeedPlayback } from '@/api/rtSimulation';
import { queryHasIscs } from '@/api/iscs';
import { getToken } from '@/utils/auth';
import TrainTicket from '../trainTicket/index';
import RegisterBook from '../registerBook/index';
export default {
name: 'MenuDemonSchema',
components:{
JoinRunPlanView,
SelectIbp,
TrainTicket,
RegisterBook
},
props: {
group: {
type: String,
required: true
},
offset: {
type: Number,
required: true
},
userRole: {
type: String,
required: true
},
showSelectStation: {
type: Boolean,
default() {
return false;
}
},
stationList: {
type: Array,
default() {
return [];
}
},
dataError: {
type: Boolean,
default() {
return false;
}
},
isAdmin: {
type: Boolean,
default() {
return false;
}
},
deviceCode: {
type: String,
default() {
return '';
}
}
},
data() {
return {
mode: OperateMode.NORMAL,
OperateMode: OperateMode,
viewDisabled: true,
realData: {},
series: [],
chiShowStation: '',
kmRangeMap: {},
runPlanData: {},
userId: '',
faultMode: false,
directiveMode: false,
firstLoad: true,
iscsShow:false,
speedList:[
{ value: 1, label: '1倍速' },
{ value: 2, label: '2倍速' },
{ value: 3, label: '3倍速' },
{ value: 4, label: '4倍速' },
{ value: 5, label: '5倍速' },
{ value: 6, label: '6倍速' },
{ value: 7, label: '7倍速' },
{ value: 8, label: '8倍速' },
{ value: 9, label: '9倍速' },
{ value: 10, label: '10倍速' }
],
speed: 1
};
},
computed: {
...mapGetters('runPlan', [
'stations'
]),
...mapGetters('map', [
'bigScreenConfig'
]),
running() {
return this.$store.state.training.started;
},
datie() {
return ['16', '19'].includes(this.$route.query.lineCode);
},
isScreen() {
return this.$store.state.training.prdType === '07';
},
project() {
return getSessionStorage('project');
},
isShowDirective() { // 哈尔滨项目 行调设备显示
return this.$route.query.type == 'CW' && this.project == 'heb';
},
hasBigScreen() {
return this.bigScreenConfig.bigScreenSplitConfig && this.bigScreenConfig.bigScreenSplitConfig.length;
},
isSystemAdmin() {
return this.$store.state.user.roles.includes('04') || this.$store.state.user.roles.includes('05');
},
showDispatcherStation() {
return this.$route.query.lineCode === '16' && this.$store.state.training.prdType === '02';
},
ibpShow() {
const lineCodeList = ['08', '16'];
return this.userRole === 'STATION_SUPERVISOR' && !this.$route.query.projectDevice && !lineCodeList.includes(this.$route.query.lineCode);
},
showRegisterBookBtn() {
const roleList = ['STATION_SUPERVISOR', 'STATION_ASSISTANT', 'STATION_SIGNALER', 'STATION_SWITCH_MAN', 'STATION_MASTER', 'STATION_WORKER', 'DEVICE_MANAGER'];
return this.$route.query.lineCode === '16' && roleList.includes(this.$store.state.training.userRole);
}
},
watch: {
// '$store.state.training.switchcount': async function () {
// if (this.group) {
// const started = this.$store.state.training.started;
// if (started && !this.firstLoad) {
// await this.loadRunData(this.$route.query);
// } else if (this.firstLoad) {
// await this.loadRunData(this.$route.query);
// }
// }
// }
'$store.state.socket.simulationPlanChange': function (val) {
// 判断是否已经加载运行图，若加载只处理运行图数据，否则，缓存数据
if (JSON.stringify(this.$store.state.runPlan.planData) == '{}') {
this.$store.dispatch('runPlan/setUpdateTrainRpData', val);
} else {
this.$store.dispatch('runPlan/updateTrainRunplan', val);
}
},
// '$store.state.map.mapDataLoadedCount': function () {
// this.loadRunData(this.$route.query);
// },
'$store.state.training.subscribeCount': function () {
this.loadRunData(this.$route.query);
},
'$store.state.training.triggerFaultCount': function () {
this.setFault();
},
'$store.state.runPlan.loadRunPlanCount': function () {
this.viewDisabled = false;
this.firstLoad = false;
if (JSON.stringify(this.$store.state.runPlan.updateTrainRpData) != '{}') {
this.$store.dispatch('runPlan/updateTrainRunplan', this.$store.state.runPlan.updateTrainRpData);
this.$store.dispatch('runPlan/setUpdateTrainRpData', {});
}
}
},
async mounted() {
this.userId = this.$store.state.user.id;
EventBus.$on('CheckFaultModeEvent', () => {
if ((this.isAdmin || this.$route.query.type === 'ILW') && !this.dataError && !this.isScreen) {
this.changeOperateMode();
}
if (this.isShowDirective) {
this.changeDirectiveMode();
}
});
queryHasIscs({mapId: this.$route.query.mapId}).then(resp => {
if (resp.data) {
this.iscsShow = true;
} else {
this.iscsShow = false;
}
}).catch(() => {
this.$message.error('查询ISCS数据异常');
});
},
methods: {
loadRunData(opt) {
this.$store.dispatch('runPlan/clear').then(resp => {
if (opt && opt.mapId) {
this.viewDisabled = true;
getByGroupStationList(this.$route.query.group).then(response => {
const stations = response.data;
this.$store.dispatch('runPlan/setStations', stations).then(() => {
loadRunPlanData(this.group, this.dataError);
});
}).catch(() => {
this.$messageBox(this.$t('error.obtainStationListFailed'));
});
}
});
},
// initPlannedDriving(isDisable) {
// this.isDisable = isDisable;
// },
changeOperateMode() {
this.faultMode = !this.faultMode;
let mode = OperateMode.NORMAL;
if (this.faultMode) {
mode = OperateMode.FAULT;
}
this.$store.dispatch('training/changeOperateMode', { mode: mode });
},
goCtc() {
const routeData = this.$router.resolve({
path:'/display/demon',
query:{
lineCode:this.$route.query.lineCode,
group: this.$route.query.group,
prdType: '01',
mapId:this.$route.query.mapId,
project: this.project,
newApi: false,
joint: true,
ctc: true,
try: this.$route.query.try || 0,
token:getToken(),
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
changeDirectiveMode() { // 调整指令模式
this.directiveMode = !this.directiveMode;
let mode = OperateMode.NORMAL;
if (this.directiveMode) {
mode = OperateMode.DIRECTIVE;
}
this.$store.dispatch('training/changeOperateMode', { mode: mode });
},
setFault() {
this.$emit('faultChooseShow');
},
loadRunPlan() {
this.$emit('runPlanLoadShow');
},
viewRunPlan() {
if (this.$route.query.type === 'CW') {
const routeData = this.$router.resolve({
path:`/runPlanViewWindow`,
query:{
lineCode: this.$route.query.lineCode,
mapId:this.$route.query.mapId,
group:this.$route.query.group,
initTime: this.$store.state.training.initTime,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
} else {
this.$refs.runPlanView.doShow();
}
},
// 选择车站
switchStationMode(stationCode) {
this.$emit('switchStationMode', stationCode);
},
// 点击大屏预览
goBigScreen() {
const routeData = this.$router.resolve({
path:`/displayBigScreen/${this.$route.query.mapId}`,
query:{
lineCode: this.$route.query.lineCode,
mapId:this.$route.query.mapId,
group:this.$route.query.group,
prdType: '07',
try:0,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
goIscs() {
const routeData = this.$router.resolve({
path:`/displayIscs/system`,
query:{
lineCode: this.$route.query.lineCode,
mapId: this.$route.query.mapId,
group: this.$route.query.group,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
},
speedChange(val) {
timesSpeedPlayback(this.$route.query.group, val).then(resp => {
this.$message.success(`设置${val}倍速成功!`);
}).catch(e => {
this.$message.error('设置倍速失败！');
});
},
showTrainTicket() {
this.$refs.trainTicket.doShow();
},
showRegisterBook() {
this.$refs.registerBook.doShow();
},
changeShowMap() {
this.$emit('changeShowMap', false);
},
// 点击ibp预览
goIbp() {
// this.$refs.selectIbp.doShow();
getIbpInfoByStation(this.$route.query.mapId, this.deviceCode).then(resp => {
if (resp.data) {
const routeData = this.$router.resolve({
path:`/ibpShow`,
query:{
lineCode: this.$route.query.lineCode,
mapId: this.$route.query.mapId,
group: this.$route.query.group,
stationCode: this.deviceCode,
loadAll: true,
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
} else {
this.$messageBox('本车站暂无IBP盘数据！');
}
}).catch((error) => {
if (error.code == '10007') {
this.$messageBox('本车站暂无IBP盘数据！');
} else {
this.$message.error('获取IBP盘数据异常');
}
});
},
goRpManage() {
const routeData = this.$router.resolve({
path:'/bigTrainRunplanManage',
query:{
group: this.$route.query.group,
mapId:this.$route.query.mapId,
project: this.project,
prdType: this.$store.state.training.prdType,
lineCode:this.$route.query.lineCode,
// stationCode:this.$store.state.training.roleDeviceCode,
// token:getToken(),
noPreLogout: true
}
});
window.open(routeData.href, '_blank');
}
}
};
</script>
<style>
.schema {
z-index: 18;
display: inline;
position: absolute;
right: 5px;
}
.schema .el-radio-group .el-radio-button__inner {
padding: 0px 15px 0px 15px;
height: 32px;
line-height: 32px;
font-size: 12px;
}
/* /deep/ .el-button+ .el-button {
margin-left: 0px;
} */
</style>

172
src/views/newMap/jointTrainingNew/menuTrainList.vue
View File

@ -1,172 +0,0 @@
<template>
<div class="menuTrainListOut" :class="{'xian_01' : lineCode == '11', 'active': drawer}">
<div class="menuTrainListBtn" @click="clickBtn">
<!-- <i class="el-icon-more" /> -->
<p style="margin: 0;">列</p>
<p style="margin: 0;">车</p>
</div>
<div :show-close="false" class="menuTrainList_box" style="height: 100%;">
<div v-if="lineCode=='10'||lineCode=='11'" class="menuTrainList">
<div class="bottomTrainListInfo">下行列车详细信息</div>
<el-table :data="bottomTrainList" height="45%" :highlight-current-row="true" @row-click="selectTrain">
<el-table-column property="groupNumber" label="车组号" width="70" />
<el-table-column property="tripNumber" label="车次号" width="70" />
<el-table-column property="destinationCode" label="目的地号" width="100" />
<el-table-column property="serviceNumber" label="表号" width="70" />
<el-table-column property="dt" label="早晚点" width="70">
<template slot-scope="scope">
<div>{{ covert(scope.row.dt) }}</div>
</template>
</el-table-column>
</el-table>
<div class="topTrainListInfo">上行列车详细信息</div>
<el-table :data="topTrainList" height="45%" :highlight-current-row="true" style="border-radius:0px 0px 0px 5px;" @row-click="selectTrain">
<el-table-column property="groupNumber" label="车组号" width="70" />
<el-table-column property="tripNumber" label="车次号" width="70" />
<el-table-column property="destinationCode" label="目的地号" width="100" />
<el-table-column property="serviceNumber" label="表号" width="70" />
<el-table-column property="dt" label="早晚点" width="70">
<template slot-scope="scope">
<div>{{ covert(scope.row.dt) }}</div>
</template>
</el-table-column>
</el-table>
</div>
<div v-else class="menuTrainList">
<el-table :data="trainList" height="100%" :highlight-current-row="true" style="border-radius:5px 0px 0px 5px;" @row-click="selectTrain">
<el-table-column property="groupNumber" label="车组号" width="130" />
<el-table-column property="tripNumber" label="车次号" width="130" />
<el-table-column property="serviceNumber" label="表号" width="130" />
</el-table>
</div>
</div>
</div>
</template>
<script>
import { mapGetters } from 'vuex';
export default {
name: 'MenuTrainList',
data() {
return {
drawer: false,
trainList:[],
oldDevice: null,
topTrainList:[],
bottomTrainList:[]
};
},
computed: {
lineCode() {
return this.$route.query.lineCode;
},
...mapGetters('map', ['mapConfig'])
},
watch:{
'$store.state.map.activeTrainListUpdate': function (val) {
if (val) {
const activeTrainList = this.$store.state.map.activeTrainList;
if (this.lineCode == '10' || this.lineCode == '11') {
this.topTrainList = [];
this.bottomTrainList = [];
activeTrainList.forEach((trainCode)=>{
// train.serviceNumber != '' && train.serviceNumber != undefined &&
const train = this.$store.getters['map/getDeviceByCode'](trainCode);
const isUpDirection = this.mapConfig.upRight ? train.right : !train.right
if (train && isUpDirection && train.sectionCode) {
this.topTrainList.push(train);
} else if (train && !isUpDirection && train.sectionCode) {
this.bottomTrainList.push(train);
}
});
} else {
this.trainList = [];
activeTrainList.forEach((trainCode)=>{
const train = this.$store.getters['map/getDeviceByCode'](trainCode);
if (train && train.sectionCode) {
this.trainList.push(train);
}
});
}
} else {
this.topTrainList = [];
this.bottomTrainList = [];
this.trainList = [];
}
}
},
mounted() {
},
methods:{
clickBtn() {
if (this.drawer) {
this.drawer = false;
} else {
this.drawer = true;
}
},
selectTrain(row, column, event) {
this.setCenter(row.code);
},
// 设置显示中心
setCenter(code) {
this.$emit('setCenter', code);
},
covert(data) {
const absData = Math.abs(data);
const hours = Math.floor(absData / 3600);
let min = Math.floor((absData % 3600) / 60);
let seconds = (absData % 3600) % 60;
min = min > 9 ? min : '0' + min;
seconds = seconds > 9 ? seconds : '0' + seconds;
const time = hours + ':' + min + ':' + seconds;
return data == 0 ? '00:00:00' : (data > 0 ? time + 'E' : time + 'L');
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.menuTrainListOut{
position: absolute;
right: 0;
top: 20%;
height: 60%;
transform: translateX(400px);
transition: all 0.4s;
&.active{
transform: translateX(0px);
}
}
.menuTrainListBtn{
background: #fff;
text-align: center;
border-radius: 6px 0px 0px 6px;
position: absolute;
top: 45%;
z-index: 2;
transform: translateX(-23px);
cursor: pointer;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
justify-content: center;
padding: 7px 4px;
}
.menuTrainList_box{
height: 100%;
.menuTrainList{
width: 400px;
height: 100%;
border-radius: 10px 0px 0px 10px;
background: #fff;
}
}
.topTrainListInfo,
.bottomTrainListInfo{
padding: 10px 10px;
background: #cde2ef;
font-size: 13px;
border-radius: 5px 0px 0px 0px;
}
</style>

159
src/views/newMap/jointTrainingNew/realCCTV.vue
View File

@ -1,159 +0,0 @@
<template>
<div class="jl3dpassflow">
<div id="jlReal3d" class="jlReal3d">
<div class="realCctv1">
<video id="myvideo0" class="video-js">
<source :src="`${host}/hls/cctv1.m3u8`" type="application/x-mpegURL">
</video>
</div>
<div class="realCctv2">
<video id="myvideo1" class="video-js">
<source :src="`${host}/hls/cctv2.m3u8`" type="application/x-mpegURL">
</video>
</div>
</div>
<!-- <div class="menudown">
<el-button-group>
<el-button type="primary" @click="back">退出</el-button>
</el-button-group>
</div> -->
</div>
</template>
<script>
import Video from 'video.js';
import 'video.js/dist/video-js.css';
import { RealCctvMap } from '@/scripts/ProjectConfig';
import { getSessionStorage } from '@/utils/auth';
export default {
name:'RealCCTV',
data() {
return {
videoList:[]
};
},
computed: {
host() {
const project = getSessionStorage('project');
return RealCctvMap[project];
}
},
mounted() {
for (var i = 0; i < 2; i++) {
const videoPlay = new Video('myvideo' + i, {
controls: false,
autoplay: 'muted',
loop: false,
preload: 'auto',
width: window.innerWidth / 2 + 'px',
height: window.innerHeight + 'px',
hls: {
withCredentials: true
}
}, function () {
console.log('videojs播放器初始化成功');
const video = this;
var lastTime = -1;
this.on('loadeddata', function() {
console.log('loadeddata');
});
this.on('seeked', function() {
// 已经拿到视频流,可以播放
console.log('seeked');
// var currentTime = video.currentTime();
// if (currentTime != lastTime) {
// video.currentTime(currentTime + 10000);
// video.play();
// }
});
this.on('error', function() {
console.log('error');
if (video.error().code == '') {
const src = video.getMedia().src[0].src;
video.reset();
video.src(src);
video.load();
video.play();
var currentTime = video.currentTime();
lastTime = currentTime;
}
});
this.on('loadedmetadata', function() {
console.log('loadedmetadata');
// 加载到元数据后开始播放视频
// startVideo();
video.autoplay(true);
// var tryTimes = 0;
let isVideoBreak = null;
clearInterval(isVideoBreak);
isVideoBreak = setInterval(function() {
// debugger;
var currentTime = video.currentTime();
console.log('currentTime' + currentTime + 'lastTime' + lastTime);
if (currentTime == lastTime) {
video.currentTime(currentTime + 10000);
video.play();
// video.src({
// src:that.videosrc
// });
// // 尝试5次播放后，如仍未播放成功提示刷新
// if (++tryTimes > 5) {
// alert('您的网速有点慢，刷新下试试');
// tryTimes = 0;
// }
} else {
lastTime = currentTime;
// tryTimes = 0;
}
}, 3000);
});
this.on('play', function() {
console.log('play');
});
});
this.videoList.push(videoPlay);
}
},
methods:{
// back() {
// window.close();
// }
}
};
</script>
<style>
.jl3dpassflow{
width: 100%;
height: 100%;
}
.jlReal3d{
width: 100%;
height: 100%;
z-index: 0;
font-size:0;
}
.realCctv1{
position: absolute;
width:50%;
height:50%;
left:0;
top:0;
}
.realCctv2{
position: absolute;
width:50%;
height:50%;
left:50%;
top:0;
}
.menudown{
bottom:0;
right:0;
position:absolute;
z-index: 2;
}
.video-js video{
outline: none !important;
}
</style>

2
src/views/scriptManage/tipScriptRecord.vue
View File

@ -88,7 +88,7 @@ import Cookies from 'js-cookie';
import {getDraftScriptByGroupNew, getAllSelectedScriptRole } from '@/api/script'; import {getDraftScriptByGroupNew, getAllSelectedScriptRole } from '@/api/script';
import ConstConfig from '@/scripts/ConstConfig'; import ConstConfig from '@/scripts/ConstConfig';
import AddScriptMember from './addScriptMember'; import AddScriptMember from './addScriptMember';
import {covertMemberData} from '@/views/newMap/displayNew/utils'; import {covertMemberData} from '@/utils/simulation';
import GetActionNew from './getAction'; import GetActionNew from './getAction';
import AllScriptRole from './allScriptRole'; import AllScriptRole from './allScriptRole';
import { getToken } from '@/utils/auth'; import { getToken } from '@/utils/auth';