新版地图包加载仿真

This commit is contained in:
fan 2019-12-30 09:00:16 +08:00
parent e5997a5856
commit c7078dcdb9
28 changed files with 4895 additions and 433 deletions

View File

@ -423,3 +423,36 @@ export function scriptDraftRecordNotify(scriptId) {
});
}
/** 新版地图创建仿真 */
export function createSimulationNew(params) {
return request({
url: `/simulation`,
method: 'get',
params
});
}
/** 新版地图根据仿真group获取仿真基础信息 */
export function getSimulationInfoNew(group) {
return request({
url: `/simulation/${group}`,
method: 'get'
});
}
/** 新版地图根据仿真group获取仿真地图数据 */
export function getNewMapDataByGroup(group) {
return request({
url: `/simulation/${group}/mapData`,
method: 'get'
});
}
/** 新版地图指令操作定义 */
export function newMapOperate(group, operationId, data) {
}
/** 新版地图根据group获取仿真运行图 */
export function getRunPlanNew(group) {
return request({
url: `/simulation/${group}/runPlan`,
method: 'get'
});
}

View File

@ -1,414 +1,431 @@
<template>
<el-dialog class="chengdou-03__systerm station-control-convert" title="控制模式转换" :visible.sync="show" width="700px"
:before-close="doClose" :showClose="true" :zIndex="2000" :modal="false" :close-on-click-modal="false"
v-dialogDrag>
<el-table ref="multipleTable" :data="tableData" border row-key="code" style="width: 100%" height="250" center
size="mini" highlight-current-row>
<el-table-column prop="check" label="选择" width="60" :id="domIdChoose" style="margin-left:30px">
<template slot-scope="scope">
<el-checkbox ref="check" v-model="scope.row.check" :disabled="scope.row.disabled"></el-checkbox>
</template>
</el-table-column>
<el-table-column prop="operate" label="操作区域" width="140">
<template slot-scope="scope">
<span :style="{color: scope.row.disabled ? '#CBCBCB':'unset'}">{{scope.row.operate}}</span>
</template>
</el-table-column>
<el-table-column prop="control" label="控制模式" width="80">
<template slot-scope="scope">
<span :style="{color: scope.row.disabled ? '#CBCBCB':'unset'}">{{scope.row.control}}</span>
</template>
</el-table-column>
<el-table-column prop="status" label="中心-车站通信状态" width="140">
<template slot-scope="scope">
<span :style="{color: scope.row.disabled ? '#CBCBCB':'unset'}">{{scope.row.status}}</span>
</template>
</el-table-column>
<el-table-column prop="result" label="转换执行状态">
<template slot-scope="scope">
<span :style="{color: scope.row.disabled ? '#CBCBCB':'unset'}">{{scope.row.result}}</span>
</template>
</el-table-column>
</el-table>
<el-row class="button-group">
<el-col :span="10" :offset="3">
<el-button v-if="isFork" :id="domIdFork" :disabled="disabledCommit" @click="forkCommit">强制站控</el-button>
<el-button v-if="isRequest" :id="domIdRequest" :disabled="disabledCommit" @click="requestCommit">请求站控
</el-button>
<el-button v-if="isConter" :id="domIdConter" :disabled="disabledCommit" @click="conterCommit">请求中控
</el-button>
</el-col>
<el-col :span="6" :offset="4">
<el-button :id="domIdCancel" :disabled="disabledClose" @click="cancel">关闭</el-button>
</el-col>
</el-row>
<two-confirmation ref="twoConfirmation" @setOperate="getOperate"></two-confirmation>
</el-dialog>
<el-dialog
v-dialogDrag
class="chengdou-03__systerm station-control-convert"
title="控制模式转换"
:visible.sync="show"
width="700px"
:before-close="doClose"
:show-close="true"
:z-index="2000"
:modal="false"
:close-on-click-modal="false"
>
<el-table
ref="multipleTable"
:data="tableData"
border
row-key="code"
style="width: 100%"
height="250"
center
size="mini"
highlight-current-row
>
<el-table-column :id="domIdChoose" prop="check" label="选择" width="60" style="margin-left:30px">
<template slot-scope="scope">
<el-checkbox ref="check" v-model="scope.row.check" :disabled="scope.row.disabled" />
</template>
</el-table-column>
<el-table-column prop="operate" label="操作区域" width="140">
<template slot-scope="scope">
<span :style="{color: scope.row.disabled ? '#CBCBCB':'unset'}">{{ scope.row.operate }}</span>
</template>
</el-table-column>
<el-table-column prop="control" label="控制模式" width="80">
<template slot-scope="scope">
<span :style="{color: scope.row.disabled ? '#CBCBCB':'unset'}">{{ scope.row.control }}</span>
</template>
</el-table-column>
<el-table-column prop="status" label="中心-车站通信状态" width="140">
<template slot-scope="scope">
<span :style="{color: scope.row.disabled ? '#CBCBCB':'unset'}">{{ scope.row.status }}</span>
</template>
</el-table-column>
<el-table-column prop="result" label="转换执行状态">
<template slot-scope="scope">
<span :style="{color: scope.row.disabled ? '#CBCBCB':'unset'}">{{ scope.row.result }}</span>
</template>
</el-table-column>
</el-table>
<el-row class="button-group">
<el-col :span="10" :offset="3">
<el-button v-if="isFork" :id="domIdFork" :disabled="disabledCommit" @click="forkCommit">强制站控</el-button>
<el-button v-if="isRequest" :id="domIdRequest" :disabled="disabledCommit" @click="requestCommit">请求站控
</el-button>
<el-button v-if="isConter" :id="domIdConter" :disabled="disabledCommit" @click="conterCommit">请求中控
</el-button>
</el-col>
<el-col :span="6" :offset="4">
<el-button :id="domIdCancel" :disabled="disabledClose" @click="cancel">关闭</el-button>
</el-col>
</el-row>
<two-confirmation ref="twoConfirmation" @setOperate="getOperate" />
</el-dialog>
</template>
<script>
import { mapGetters } from 'vuex';
import { MapDeviceType, TrainingMode, OperationEvent, getDomIdByOperation, checkOperationIsCurrentOperate } from '@/scripts/ConstDic';
import TwoConfirmation from './childDialog/twoConfirmation';
import { mapGetters } from 'vuex';
import { MapDeviceType, TrainingMode, OperationEvent, getDomIdByOperation, checkOperationIsCurrentOperate } from '@/scripts/ConstDic';
import TwoConfirmation from './childDialog/twoConfirmation';
export default {
name: 'StationControlConvert',
data() {
return {
operate: null,
dialogShow: false,
disabledSend: false,
disabledSure: false,
disabledClose: false,
operation: '',
controlProps: {
'01': '中控',
'02': '站控'
},
selection: [],
tableData: [],
timer: null,
count: 0,
backOperate: '',
timeout: 61,
export default {
name: 'StationControlConvert',
components: {
TwoConfirmation
},
data() {
return {
operate: null,
dialogShow: false,
disabledSend: false,
disabledSure: false,
disabledClose: false,
operation: '',
controlProps: {
'01': '中控',
'02': '站控'
},
selection: [],
tableData: [],
timer: null,
count: 0,
backOperate: '',
timeout: 61
};
},
computed: {
...mapGetters('map', [
'stationList',
]),
...mapGetters('training', [
'mode',
'started'
]),
disabledCommit() {
return this.disabledSend || this.disabledSure;
},
show() {
return this.dialogShow && !this.$store.state.menuOperation.break;
},
isFork() {
if (this.dialogShow) {
return checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.forcedStationControl);
}
},
components: {
TwoConfirmation
},
computed: {
...mapGetters('map', [
'stationList',
'stationControlList',
]),
...mapGetters('training', [
'mode',
'started'
]),
disabledCommit() {
return this.disabledSend || this.disabledSure;
},
show() {
return this.dialogShow && !this.$store.state.menuOperation.break;
},
isFork() {
if (this.dialogShow) {
return checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.forcedStationControl)
}
},
isRequest() {
if (this.dialogShow) {
return checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestStationControl)
}
},
isConter() {
if (this.dialogShow) {
return checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestCentralControl)
}
},
domIdChoose() {
if (this.dialogShow) {
if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.forcedStationControl)) {
return OperationEvent.StationControl.forcedStationControl.choose.domId
} else if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestStationControl)) {
return OperationEvent.StationControl.requestStationControl.choose.domId
} else if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestCentralControl)) {
return OperationEvent.StationControl.requestCentralControl.choose.domId
}
}
},
domIdConter() {
return this.dialogShow ? OperationEvent.StationControl.requestCentralControl.menu.domId : '';
},
domIdFork() {
return this.dialogShow ? OperationEvent.StationControl.forcedStationControl.menu.domId : '';
},
domIdRequest() {
return this.dialogShow ? OperationEvent.StationControl.requestStationControl.menu.domId : '';
},
domIdCancel() {
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
isRequest() {
if (this.dialogShow) {
return checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestStationControl);
}
},
watch: {
'$store.state.socket.msgHead': function (elem) {
if (elem) {
if (elem.hasOwnProperty('timeout')) {
this.updateTableValue(elem.stationControlCode, { result: `接受转换应答超时` }, false);
} else if (elem.hasOwnProperty('success')) {
if (elem.success) {
this.updateTableValue(elem.stationControlCode, { result: '控制模式转换成功' }, true);
} else {
this.updateTableValue(elem.stationControlCode, { result: `控制模式转换失败` }, false);
}
}
}
},
backOperate: function (operate) {
if (this.dialogShow && operate) {
if (operate.selection && operate.selection.length) {
operate.selection.forEach(elem => {
if (operate.commit) {
this.updateTableValue(elem.code, { result: `已发送转换请求,${this.timeout}秒后超时.` }, false);
} else if (operate.cancel) {
this.updateTableValue(elem.code, { result: '' }, false);
}
})
}
}
},
//
tableData: {
handler(val, oldVal) {
this.checkTableDataSelction(val);
},
deep: true
isConter() {
if (this.dialogShow) {
return checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestCentralControl);
}
},
mounted() {
this.loadTableData();
this.$nextTick(() => {
this.$store.dispatch('training/tipReload');
})
},
methods: {
updateTableValue(code, result, success) {
this.tableData.forEach((row, index) => {
if (row.code == code) {
for (let prop in result) {
row[prop] = result[prop];
}
if (success) {
if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.forcedStationControl) || checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestStationControl)) {
row.control = this.controlProps['02']; //01: 02:
} else if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestCentralControl)) {
row.control = this.controlProps['01']; //01: 02:
}
row.disabled = true;
row.check = false;
}
}
})
},
checkTableDataSelction(data) {
let selection = [];
if (data && data.length > 0) {
data.forEach(row => {
if (row.check && !row.disabled) {
selection.push(row);
}
})
}
this.disabledSend = selection.length ? false : true;
if (JSON.stringify(selection) !== JSON.stringify(this.selection)) {
this.handleChooseChange(selection);
this.selection = selection;
}
},
checkBoxDisabled(row) {
let control = (this.$store.getters('map/getDeviceByCode')(row.code) || {});
if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.forcedStationControl) || checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestStationControl)) {
if (control && control.status == '02') { //01: 02:
return true;
}
domIdChoose() {
if (this.dialogShow) {
if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.forcedStationControl)) {
return OperationEvent.StationControl.forcedStationControl.choose.domId;
} else if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestStationControl)) {
return OperationEvent.StationControl.requestStationControl.choose.domId;
} else if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestCentralControl)) {
if (control && control.status == '01') { //01: 02:
return true;
return OperationEvent.StationControl.requestCentralControl.choose.domId;
}
}
},
domIdConter() {
return this.dialogShow ? OperationEvent.StationControl.requestCentralControl.menu.domId : '';
},
domIdFork() {
return this.dialogShow ? OperationEvent.StationControl.forcedStationControl.menu.domId : '';
},
domIdRequest() {
return this.dialogShow ? OperationEvent.StationControl.requestStationControl.menu.domId : '';
},
domIdCancel() {
return this.dialogShow ? OperationEvent.Command.cancel.menu.domId : '';
}
},
watch: {
'$store.state.socket.msgHead': function (elem) {
if (elem) {
if (elem.hasOwnProperty('timeout')) {
this.updateTableValue(elem.stationControlCode, { result: `接受转换应答超时` }, false);
} else if (elem.hasOwnProperty('success')) {
if (elem.success) {
this.updateTableValue(elem.stationControlCode, { result: '控制模式转换成功' }, true);
} else {
this.updateTableValue(elem.stationControlCode, { result: `控制模式转换失败` }, false);
}
}
},
loadTableData() {
this.tableData = [];
this.stationControlList.forEach(control => {
let station = this.$store.getters['map/getDeviceByCode'](control.stationCode);
this.tableData.push({
code: control.code,
operate: station.name || '',
control: '',
check: false,
disabled: false,
status: '正常',
result: '',
});
})
},
initTableDataStatus() {
this.tableData.forEach(row => {
row.disabled = this.checkBoxDisabled(row);
row.check = false;
row.result = '';
let control = (this.$store.getters('map/getDeviceByCode')(row.code) || {}).state;
if (control) {
row.control = this.controlProps[control.status];
}
})
},
doShow(operate) {
if (!this.dialogShow) {
this.operate = operate || {};
this.operation = operate.operation;
this.disabledSure = false;
this.initTableDataStatus();
}
this.dialogShow = true;
this.$store.dispatch('training/emitTipFresh');
},
doClose() {
this.dialogShow = false;
this.$store.dispatch('training/emitTipFresh');
this.$refs.multipleTable.setCurrentRow();
},
cancel() {
let operate = {
type: 'bar',
operation: OperationEvent.Command.cancel.menu.operation,
}
this.$store.dispatch('training/next', operate).then(({ valid }) => {
if (valid) {
this.doClose();
}
})
},
clearTimer() {
this.count = 0;
if (this.timer) {
clearInterval(this.timer);
this.timer = null;
}
},
serializeCodeListWithSeparator(sep) {
let codeList = [];
if (this.selection && this.selection.length) {
this.selection.forEach(elem => {
codeList.push(elem.code);
})
}
return codeList.join(sep);
},
handleChooseChange(selection) {
this.selection = selection;
if (selection && selection.length) {
let operate = {
type: MapDeviceType.StationControl.type,
operation: '',
val: this.serializeCodeListWithSeparator('::'),
selection: selection
}
if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.forcedStationControl)) {
operate.operation = OperationEvent.StationControl.forcedStationControl.choose.operation
} else if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestStationControl)) {
operate.operation = OperationEvent.StationControl.requestStationControl.choose.operation
} else if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestCentralControl)) {
operate.operation = OperationEvent.StationControl.requestCentralControl.choose.operation
}
this.disabledSure = true;
this.$store.dispatch('training/next', operate).then(({ valid }) => {
if (valid) {
this.disabledSure = false;
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
}
},
backOperate: function (operate) {
if (this.dialogShow && operate) {
if (operate.selection && operate.selection.length) {
operate.selection.forEach(elem => {
if (operate.commit) {
this.updateTableValue(elem.code, { result: `已发送转换请求,${this.timeout}秒后超时.` }, false);
} else if (operate.cancel) {
this.updateTableValue(elem.code, { result: '' }, false);
}
})
} else if (!selection) {
this.$messageBox('请选择一条数据');
});
}
}
},
//
tableData: {
handler(val, oldVal) {
this.checkTableDataSelction(val);
},
requestCommit() {
let operate = {
type: MapDeviceType.StationControl.type,
messages: ['确认将如下操作区域的控制模式由中控转为站控:'],
operation: OperationEvent.StationControl.requestStationControl.menu.operation,
val: this.serializeCodeListWithSeparator('::'),
selection: this.selection
deep: true
}
},
mounted() {
this.loadTableData();
this.$nextTick(() => {
this.$store.dispatch('training/tipReload');
});
},
methods: {
updateTableValue(code, result, success) {
this.tableData.forEach((row, index) => {
if (row.code == code) {
for (const prop in result) {
row[prop] = result[prop];
}
if (success) {
if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.forcedStationControl) || checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestStationControl)) {
row.control = this.controlProps['02']; // 01: 02:
} else if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestCentralControl)) {
row.control = this.controlProps['01']; // 01: 02:
}
row.disabled = true;
row.check = false;
}
}
this.selection.forEach((elem, index) => {
operate.messages.push(`操作区域${index + 1}:${elem.operate}`);
});
},
checkTableDataSelction(data) {
const selection = [];
if (data && data.length > 0) {
data.forEach(row => {
if (row.check && !row.disabled) {
selection.push(row);
}
});
}
this.disabledSend = !selection.length;
if (JSON.stringify(selection) !== JSON.stringify(this.selection)) {
this.handleChooseChange(selection);
this.selection = selection;
}
},
checkBoxDisabled(row) {
const control = (this.$store.getters('map/getDeviceByCode')(row.code) || {});
if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.forcedStationControl) || checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestStationControl)) {
if (control && control.status == '02') { // 01: 02:
return true;
}
} else if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestCentralControl)) {
if (control && control.status == '01') { // 01: 02:
return true;
}
}
},
loadTableData() {
this.tableData = [];
this.stationList.forEach(station => {
// const station = this.$store.getters['map/getDeviceByCode'](control.stationCode);
this.tableData.push({
code: station.code,
operate: station.name || '',
control: '',
check: false,
disabled: false,
status: '正常',
result: ''
});
});
},
initTableDataStatus() {
this.tableData.forEach(row => {
row.disabled = this.checkBoxDisabled(row);
row.check = false;
row.result = '';
const control = (this.$store.getters('map/getDeviceByCode')(row.code) || {}).state;
if (control) {
row.control = this.controlProps[control.status];
}
});
},
doShow(operate) {
if (!this.dialogShow) {
this.operate = operate || {};
this.operation = operate.operation;
this.disabledSure = false;
this.initTableDataStatus();
}
this.dialogShow = true;
this.$store.dispatch('training/emitTipFresh');
},
doClose() {
this.dialogShow = false;
this.$store.dispatch('training/emitTipFresh');
this.$refs.multipleTable.setCurrentRow();
},
cancel() {
const operate = {
type: 'bar',
operation: OperationEvent.Command.cancel.menu.operation
};
this.$store.dispatch('training/next', operate).then(({ valid }) => {
if (valid) {
this.doClose();
}
});
},
clearTimer() {
this.count = 0;
if (this.timer) {
clearInterval(this.timer);
this.timer = null;
}
},
serializeCodeListWithSeparator(sep) {
const codeList = [];
if (this.selection && this.selection.length) {
this.selection.forEach(elem => {
codeList.push(elem.code);
});
}
return codeList.join(sep);
},
handleChooseChange(selection) {
this.selection = selection;
if (selection && selection.length) {
const operate = {
type: MapDeviceType.StationControl.type,
operation: '',
val: this.serializeCodeListWithSeparator('::'),
selection: selection
};
if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.forcedStationControl)) {
operate.operation = OperationEvent.StationControl.forcedStationControl.choose.operation;
} else if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestStationControl)) {
operate.operation = OperationEvent.StationControl.requestStationControl.choose.operation;
} else if (checkOperationIsCurrentOperate(this.operation, OperationEvent.StationControl.requestCentralControl)) {
operate.operation = OperationEvent.StationControl.requestCentralControl.choose.operation;
}
this.disabledSure = true;
this.disabledClose = true;
this.$store.dispatch('training/next', operate).then(({ valid }) => {
if (valid) {
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
this.$refs.twoConfirmation.doShow(operate);
} else {
this.disabledSure = false;
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
}
}).catch((error) => {
this.disabledSure = false;
this.disabledClose = false;
})
},
forkCommit() {
let operate = {
type: MapDeviceType.StationControl.type,
messages: ['确认将如下操作区域的控制模式由中控转为站控:'],
operation: OperationEvent.StationControl.forcedStationControl.menu.operation,
val: this.serializeCodeListWithSeparator('::'),
selection: this.selection
}
this.selection.forEach((elem, index) => {
operate.messages.push(`操作区域${index + 1}:${elem.operate}`);
});
} else if (!selection) {
this.$messageBox('请选择一条数据');
}
},
requestCommit() {
const operate = {
type: MapDeviceType.StationControl.type,
messages: ['确认将如下操作区域的控制模式由中控转为站控:'],
operation: OperationEvent.StationControl.requestStationControl.menu.operation,
val: this.serializeCodeListWithSeparator('::'),
selection: this.selection
};
this.disabledSure = true;
this.disabledClose = true;
this.$store.dispatch('training/next', operate).then(({ valid }) => {
if (valid) {
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
this.$refs.twoConfirmation.doShow(operate);
} else {
this.disabledSure = false;
}
}).catch(() => {
this.selection.forEach((elem, index) => {
operate.messages.push(`操作区域${index + 1}:${elem.operate}`);
});
this.disabledSure = true;
this.disabledClose = true;
this.$store.dispatch('training/next', operate).then(({ valid }) => {
if (valid) {
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
this.$refs.twoConfirmation.doShow(operate);
} else {
this.disabledSure = false;
this.disabledClose = false;
})
},
conterCommit() { //
let operate = {
type: MapDeviceType.StationControl.type,
messages: ['确认将如下操作区域的控制模式由站控转为中控:'],
operation: OperationEvent.StationControl.requestCentralControl.menu.operation,
val: this.serializeCodeListWithSeparator('::'),
selection: this.selection
}
}).catch((error) => {
this.disabledSure = false;
this.disabledClose = false;
});
},
forkCommit() {
const operate = {
type: MapDeviceType.StationControl.type,
messages: ['确认将如下操作区域的控制模式由中控转为站控:'],
operation: OperationEvent.StationControl.forcedStationControl.menu.operation,
val: this.serializeCodeListWithSeparator('::'),
selection: this.selection
};
this.selection.forEach((elem, index) => {
operate.messages.push(`操作区域${index + 1}:${elem.operate}`);
});
this.selection.forEach((elem, index) => {
operate.messages.push(`操作区域${index + 1}:${elem.operate}`);
});
this.disabledSure = true;
this.disabledClose = true;
this.$store.dispatch('training/next', operate).then(({ valid }) => {
if (valid) {
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
this.$refs.twoConfirmation.doShow(operate);
} else {
this.disabledSure = false;
}
}).catch(() => {
this.disabledSure = true;
this.disabledClose = true;
this.$store.dispatch('training/next', operate).then(({ valid }) => {
if (valid) {
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
this.$refs.twoConfirmation.doShow(operate);
} else {
this.disabledSure = false;
this.disabledClose = false;
})
},
getOperate(operate) {
this.backOperate = operate;
if (operate.cancel) {
this.disabledClose = false;
this.disabledSure = this.disabledSend = false;
}
if (operate.commit || operate.timeout) {
this.disabledSend = this.disabledSure = true;
this.disabledClose = false;
}).catch(() => {
this.disabledSure = false;
this.disabledClose = false;
});
},
conterCommit() { //
const operate = {
type: MapDeviceType.StationControl.type,
messages: ['确认将如下操作区域的控制模式由站控转为中控:'],
operation: OperationEvent.StationControl.requestCentralControl.menu.operation,
val: this.serializeCodeListWithSeparator('::'),
selection: this.selection
};
this.selection.forEach((elem, index) => {
operate.messages.push(`操作区域${index + 1}:${elem.operate}`);
});
this.disabledSure = true;
this.disabledClose = true;
this.$store.dispatch('training/next', operate).then(({ valid }) => {
if (valid) {
this.$store.dispatch('menuOperation/handleBreakFlag', { break: true });
this.$refs.twoConfirmation.doShow(operate);
} else {
this.disabledSure = false;
}
}).catch(() => {
this.disabledSure = false;
this.disabledClose = false;
});
},
getOperate(operate) {
this.backOperate = operate;
if (operate.cancel) {
this.disabledClose = false;
this.disabledSure = this.disabledSend = false;
}
if (operate.commit || operate.timeout) {
this.disabledSend = this.disabledSure = true;
this.disabledClose = false;
}
}
}
};
</script>

View File

@ -111,12 +111,12 @@ export default {
getPublishMapInfo(this.$route.query.mapId).then(res=>{
this.PlanConvert = this.$theme.loadPlanConvert(res.data.lineCode);
this.$store.dispatch('runPlan/setStations', stations).then(() => {
getEveryDayRunPlanData(this.$route.query.group).then(resp => {
this.$store.dispatch('runPlan/setPlanData', resp.data);
}).catch(() => {
this.$store.dispatch('runPlan/setPlanData', []);
this.$messageBox(`获取运行图数据失败`);
});
// getEveryDayRunPlanData(this.$route.query.group).then(resp => {
// this.$store.dispatch('runPlan/setPlanData', resp.data);
// }).catch(() => {
// this.$store.dispatch('runPlan/setPlanData', []);
// this.$messageBox(``);
// });
});
});
}).catch(() => {

View File

@ -362,18 +362,18 @@ export default {
let startValue = 3600 + this.PlanConvert.TranslationTime;
const offsetTime = 3600;
runDiagramGetTime(this.group).then(resp => {
startValue = resp.data - this.PlanConvert.TranslationTime;
this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
this.option.series = series;
this.myChart = echarts.init(document.getElementById(this.runPlanId));
if (this.myChart) {
this.myChart.setOption(this.option);
this.reSize({ width: this.$store.state.runPlan.width, height: this.$store.state.runPlan.height });
this.myChart.on('click', this.mouseClick);
}
});
// runDiagramGetTime(this.group).then(resp => {
// startValue = resp.data - this.PlanConvert.TranslationTime;
// this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
// this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
// this.option.series = series;
// this.myChart = echarts.init(document.getElementById(this.runPlanId));
// if (this.myChart) {
// this.myChart.setOption(this.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);

View File

@ -14,7 +14,7 @@ const Jlmap3dSandbox = () => import('@/views/jlmap3d/simulation/jl3dsimulation')
const Jlmap3dModel = () => import('@/views/jlmap3d/device/jl3ddevice');
const Jlmap3dTrain = () => import('@/views/jlmap3d/devicetrain/jl3ddevicetrain');
const Display = () => import('@/views/display/index');
const DisplayNew = () => import('@/views/display/indexNew');
const DisplayNew = () => import('@/views/newMap/displayNew/index');
const DesignDisplay = () => import('@/views/display/designIndex');
const TrainRoom = () => import('@/views/trainRoom/index');

View File

@ -3,9 +3,9 @@ export function getBaseUrl() {
let BASE_API;
if (process.env.NODE_ENV === 'development') {
// BASE_API = 'https://joylink.club/jlcloud';
BASE_API = 'https://test.joylink.club/jlcloud';
// BASE_API = 'https://test.joylink.club/jlcloud';
// BASE_API = 'http://192.168.3.5:9000'; // 袁琪
// BASE_API = 'http://192.168.3.6:9000'; // 旭强
BASE_API = 'http://192.168.3.6:9000'; // 旭强
// BASE_API = 'http://192.168.3.41:9000'; // 张赛
// BASE_API = 'http://192.168.3.82:9000'; // 杜康
} else {

View File

@ -1,5 +1,6 @@
import store from '@/store';
import { getPublishMapVersionById, getPublishMapDetailById} from '@/api/jmap/map';
import { getNewMapDataByGroup } from '@/api/simulation';
// 获取地图版本数据和store里面的map版本做比较如果不同
// 获取发布的地图数据
@ -34,3 +35,17 @@ export function loadMapDataById(mapId) {
});
});
}
export function loadNewMapDataByGroup(group) {
return new Promise((resolve, reject) => {
getNewMapDataByGroup(group).then(resp => {
const mapData = resp.data.graphDataNew;
store.dispatch('map/setMapData', mapData).then(() => {
store.dispatch('map/clearJlmapTrainView').then(() => {
resolve();
});
});
}).catch(error => {
reject(error);
});
});
}

View File

@ -30,7 +30,7 @@ import { PermissionType } from '@/scripts/ConstDic';
import { launchFullscreen } from '@/utils/screen';
import { postCreateRoom, getjointTraining, checkRoomExist } from '@/api/chat';
import { UrlConfig } from '@/router/index';
import { simulationNotify, schedulingNotify } from '@/api/simulation';
import { simulationNotify, schedulingNotify, createSimulationNew } from '@/api/simulation';
import LimitList from '@/views/components/limits/index';
import { getSubSystemDetail } from '@/api/trainingPlatform';
@ -223,7 +223,11 @@ export default {
const data = { mapId: this.courseModel.mapId, prdId: this.currentPrdId };
schedulingNotify(data).then(resp => {
const query = { lineCode: this.courseModel.lineCode, group: resp.data, prdType: this.courseModel.prdType, mapId: this.courseModel.mapId, code: this.currentPrdId, goodsId: this.goodsId, try: this.tryUser };
this.$router.push({ path: `${UrlConfig.display}/demon`, query: query });
if (this.drawWay) {
this.$router.push({ path: `${UrlConfig.displayNew}/demon`, query: query });
} else {
this.$router.push({ path: `${UrlConfig.display}/demon`, query: query });
}
launchFullscreen();
}).catch(error => {
this.$messageBox(this.$t('error.createSimulationFailed') + error.message);
@ -234,19 +238,27 @@ export default {
jump() {
this.disabled = true;
setTimeout(() => {
const data = { mapId: this.courseModel.mapId, mapPrdId: this.currentPrdId };
simulationNotify(data).then(resp => {
const query = { lineCode: this.courseModel.lineCode, group: resp.data, prdType: this.courseModel.prdType, mapId: this.courseModel.mapId, code: this.currentPrdId, goodsId: this.goodsId, try: this.tryUser };
if (this.drawWay) { //
this.$router.push({ path: `${UrlConfig.displayNew}/demon`, query: query });
} else {
if (!this.drawWay) {
const data = { mapId: this.courseModel.mapId, mapPrdId: this.currentPrdId };
simulationNotify(data).then(resp => {
const query = { lineCode: this.courseModel.lineCode, group: resp.data, prdType: this.courseModel.prdType, mapId: this.courseModel.mapId, code: this.currentPrdId, goodsId: this.goodsId, try: this.tryUser };
this.$router.push({ path: `${UrlConfig.display}/demon`, query: query });
}
launchFullscreen();
}).catch(error => {
this.$messageBox(this.$t('error.createSimulationFailed') + error.message);
this.disabled = false;
});
launchFullscreen();
}).catch(error => {
this.$messageBox(this.$t('error.createSimulationFailed') + error.message);
this.disabled = false;
});
} else {
const data = { mapId: this.courseModel.mapId, prdCode: this.currentPrdId };
createSimulationNew(data).then(resp => {
const query = { lineCode: this.courseModel.lineCode, group: resp.data, prdType: this.courseModel.prdType, mapId: this.courseModel.mapId, code: this.currentPrdId, goodsId: this.goodsId, try: this.tryUser };
this.$router.push({ path: `${UrlConfig.displayNew}/demon`, query: query });
launchFullscreen();
}).catch(error => {
this.$messageBox(this.$t('error.createSimulationFailed') + error.message);
this.disabled = false;
});
}
}, 100);
},
buy() {

View File

@ -0,0 +1,209 @@
<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.role" :placeholder="$t('display.script.pleaseSelect')">
<el-option
v-for="item in memberList"
:key="item.id"
:label="(roleConfig[item.role]?roleConfig[item.role]: '')+(item.name?item.name: '')"
:value="item.id"
:disabled="checkDisabled(item.role)"
/>
</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 { getScriptPageListOnline, getScriptById, getDraftScriptByGroup } from '@/api/script';
//
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: {
role: ''
},
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 getScriptPageListOnline(params);
},
async loadInitData() {
},
async handleLoad(index, row) {
this.row = row;
const res = this.$route.fullPath.includes('design/display/demon') ? await getDraftScriptByGroup(row.group) : await getScriptById(row.id);
let newMemberList = [];
if (res.code == 200) {
if (res.data.playerVOList && res.data.playerVOList.length > 0) {
newMemberList = res.data.playerVOList.filter(item => item.hasPlay === true);
}
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.role; });
this.$emit('selectQuest', this.row, this.form.role, this.mapLocation, roleName.role);
this.doClose();
this.roleDoClose();
},
roleDoClose() {
this.$refs['ruleForm'].resetFields();
this.roleShow = false;
},
checkDisabled(role) {
if (!this.$route.fullPath.includes('design/display/demon')) {
if (this.$route.query.prdType == '01') {
return role !== 'Attendant' && role !== 'no';
} else if (this.$route.query.prdType == '02') {
return role !== 'Dispatcher' && role !== 'no';
} else if (this.$route.query.prdType == '04') {
return role !== 'Driver' && role !== 'no';
}
}
},
handleName(item) {
return this.roleConfig[item.role] ? this.roleConfig[item.role] : '' + (item.name ? item.name : '');
}
}
};
</script>

View File

@ -0,0 +1,161 @@
<template>
<el-dialog v-dialogDrag :title="title" :visible.sync="dialogShow" width="800px" :before-close="doClose" :modal="false">
<div class="draft">
<el-radio-group v-model="auto">
<el-radio :label="false" border>{{ $t('display.faultChoose.manual') }}</el-radio>
<el-radio :label="true" border>{{ $t('display.faultChoose.automatic') }}</el-radio>
</el-radio-group>
</div>
<div v-if="auto" class="card">
<QueryListPage ref="pageRules" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
</div>
<span slot="footer" class="dialog-footer">
<el-button @click="dialogShow = false">{{ $t('global.cancel') }}</el-button>
<el-button type="primary" :loading="loading" @click="handleConfirm">{{ $t('global.confirm') }}</el-button>
</span>
</el-dialog>
</template>
<script>
import { getFailureGenerateRules, setFailureMode } from '@/api/simulation';
import { FaultStatusEnum } from '@/scripts/FaultDic';
import ModelType from '@/jmap/constant/deviceType';
//
export default {
name: 'FaultChoose',
props: {
group: {
type: String,
required: true
}
},
data() {
return {
dialogShow: false,
loading: false,
deviceMap: {},
auto: false,
pagerConfig: {
pageSize: 'pageSize',
pageIndex: 'pageNum'
},
queryForm: {
reset: true,
labelWidth: '80px',
queryObject: {
condition: {
type: 'text',
label: this.$t('display.faultChoose.settingCondition')
}
}
},
queryList: {
query: null,
selectCheckShow: false,
radioShow: true,
columns: [
{
title: this.$t('display.faultChoose.settingCondition'),
prop: 'condition'
},
{
title: this.$t('display.faultChoose.triggerTarget'),
prop: 'target'
}
]
}
};
},
computed: {
title() {
return this.$t('display.faultChoose.selectFault');
},
lineCode() {
return this.$route.query.lineCode;
}
},
mounted() {
this.$Dictionary.physicalViewType().then(list => {
this.deviceMap = [];
list.forEach(elem => {
this.deviceMap[elem.code] = elem.name;
});
});
},
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: {
name += device.name;
break;
}
}
if (device.stationCode) {
const station = this.$store.getters['map/getDeviceByCode'](device.stationCode);
if (station) {
name += '【' + station.name + '】';
}
}
}
return name;
},
doShow() {
this.dialogShow = true;
this.queryList.data = [];
getFailureGenerateRules({ skin: this.lineCode, group: this.group }).then(response => {
const data = response.data;
data.forEach(elem => {
this.queryList.data.push({
id: elem.id,
condition: `${this.deviceMap[elem.condition.triggerDeviceType]}${this.formatNameByCode(elem.condition.triggerDeviceCode)} 状态:${FaultStatusEnum[elem.condition.triggerDeviceType][elem.condition.triggerDeviceStatus]}`,
target: `${this.deviceMap[elem.targetDeviceType]}${this.formatNameByCode(elem.targetDeviceCode)}`
});
});
});
},
doClose() {
this.dialogShow = false;
},
getFailureModel(auto) {
const model = { auto };
if (auto) {
const choose = this.$refs.pageRules.currentChoose();
if (choose) {
choose.id ? Object.assign(model, { ruleId: choose.id }) : this.$messageBox(this.$t('display.faultChoose.selectRules'));
}
}
return model;
},
handleConfirm() {
this.$nextTick(() => {
const faultModel = this.getFailureModel(this.auto);
setFailureMode(faultModel, this.group).then(() => {
this.$message.success(this.$t('display.faultChoose.setFaultSuccess'));
}).catch(() => {
this.$messageBox(this.$t('display.faultChoose.setFaultFail'));
});
this.doClose();
});
},
reloadTable() {
this.queryList.reload();
}
}
};
</script>
<style scoped rel="stylesheet/scss" lang="scss">
.draft {
text-align: center;
margin-bottom: 10px;
}
</style>

View File

@ -0,0 +1,66 @@
<template>
<div v-show="show" class="run-plan-dialog">
<component :is="menus" ref="schedule" :group="group" @back="doClose" />
</div>
</template>
<script>
//
export default {
name: 'RunPlanLoad',
props: {
group: {
type: String,
required: true
}
},
data() {
return {
menus: null,
show: false
};
},
computed: {
title() {
return this.$t('display.runPlan.runDiagramPlanTool');
}
},
watch: {
'$route.query.lineCode': function (code) {
if (code) {
this.menus = this.$theme.loadPlanComponent(code);
}
}
},
mounted() {
this.menus = this.$theme.loadPlanComponent(this.$route.query.lineCode);
},
methods: {
doShow() {
this.show = true;
this.$refs.schedule.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: 10;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
background: white;
}
</style>

View File

@ -0,0 +1,362 @@
<template>
<el-dialog
v-dialogDrag
v-dialogLoading="dialogLoading"
:title="title"
:visible.sync="dialogShow"
width="100%"
:before-close="doClose"
:close-on-click-modal="false"
:modal="false"
fullscreen
>
<div :id="runPlanId" v-loading="loading" />
</el-dialog>
</template>
<script>
import { mapGetters } from 'vuex';
import { runDiagramGetTime } from '@/api/simulation';
import { getPublishMapInfo } from '@/api/jmap/map';
import { timeFormat } from '@/utils/date';
import echarts from 'echarts';
//
export default {
name: 'RunPlanView',
props: {
group: {
type: String,
required: true
}
},
data() {
return {
dialogShow: false,
loading: true,
runPlanId: 'run-plan-view',
myChart: null,
PlanConvert: {},
series: [],
option: {
title: {
text: '',
left: 'center'
},
grid: {
top: '30px',
left: '120px',
right: '40px',
bottom: '80px',
containLabel: true,
backgroundColor: 'floralwhite'
},
toolbox: {
right: '20px',
feature: {
dataZoom: {
yAxisIndex: 'none'
},
restore: {},
saveAsImage: {}
}
},
tooltip: {
axisPointer: {
trigger: 'item',
type: 'cross'
},
formatter: this.axisTooltip,
borderWidth: 1
},
xAxis: [
{
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'
}
}
}
],
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'
}
},
min: 0,
max: 0
},
// graphic: {
// type: 'line',
// progressive: true
// },
series: [],
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: '25px'
}
]
},
absoluteTime: 2 * 3600,
indexKmRangeMap: {},
runPlanData: {},
dialogLoading: false
};
},
computed: {
...mapGetters('runPlan', [
'stations'
]),
title() {
return this.$t('display.runPlan.previewRunDiagram');
}
},
watch: {
'$store.state.runPlan.planLoadedCount': async function () {
try {
await this.loadChartPage();
if (this.dialogShow) {
await this.loadInitData(this.series);
}
} catch (e) {
console.error(e);
} finally {
this.loading = false;
}
},
'$store.state.runPlan.planUpdateCount': function () {
this.updateRunPlanData(this.$store.state.runPlan.updateData);
},
'$store.state.app.windowSizeCount': function() {
this.reSize({ width: this.$store.state.app.width, height: this.$store.state.app.height - 55 });
}
},
mounted() {
getPublishMapInfo(this.$route.query.mapId).then(res=>{
this.PlanConvert = this.$theme.loadPlanConvert(res.data.lineCode);
this.loadChartPage();
});
},
beforeDestroy() {
if (this.myChart && this.myChart.isDisposed) {
this.myChart.dispose();
this.myChart = null;
}
},
methods: {
async doShow() {
try {
this.dialogLoading = true;
this.dialogShow = true;
this.loadInitData(this.series);
} catch (e) {
console.error(e);
} finally {
this.dialogLoading = false;
}
},
async doClose() {
this.dialogShow = false;
},
async loadChartPage() {
const stations = this.$store.state.runPlan.stations;
const planData = this.$store.state.runPlan.planData;
this.series = [];
this.kmRangeCoordMap = this.PlanConvert.convertStationsToMap(stations);
this.pushModels(this.series, [this.PlanConvert.initializeYaxis(stations)]);
this.pushModels(this.series, this.PlanConvert.convertDataToModels(planData, stations, this.kmRangeCoordMap, { width: 1, color: '#000' }));
},
async loadInitData(series) {
this.myChart && this.myChart.showLoading();
await this.xAxisInit();
await this.yAxisInit();
await this.loadInitChart(series);
this.myChart && this.myChart.hideLoading();
},
loadInitChart(series) {
return new Promise((resolve, reject) => {
try {
if (this.myChart && this.myChart.isDisposed) {
this.myChart.clear();
}
let startValue = 3600 + this.PlanConvert.TranslationTime;
const offsetTime = 3600;
// runDiagramGetTime(this.group).then(resp => {
// startValue = resp.data - this.PlanConvert.TranslationTime;
// this.option.dataZoom[0].startValue = this.option.dataZoom[1].startValue = startValue - offsetTime;
// this.option.dataZoom[0].endValue = this.option.dataZoom[1].endValue = startValue + offsetTime;
// this.option.series = series;
// this.myChart = echarts.init(document.getElementById(this.runPlanId));
// if (this.myChart) {
// this.myChart.setOption(this.option);
// this.reSize({ width: document.documentElement.clientWidth, height: document.documentElement.clientHeight - 55 });
// }
// });
resolve(true);
} catch (error) {
reject(error);
}
});
},
updateRunPlanData(data) {
const stations = this.$store.state.runPlan.stations;
const planData = this.$store.state.runPlan.planData;
this.series = this.PlanConvert.updateDataToModels(data, stations, this.kmRangeCoordMap,
planData, this.series, { color: '#FF00DE', width: 0.5 }
);
this.myChart && this.myChart.setOption({ series: this.series });
},
pushModels(series, models) {
if (models && models.length) {
models.forEach(elem => {
if (elem) {
series.push(elem);
}
});
}
return series;
},
popModels(series, models) {
if (models && models.length) {
models.forEach(elem => {
const index = series.indexOf(elem);
if (index >= 0) {
series.split(index, 1);
}
});
}
return series;
},
xAxisPointFormat(params) {
return timeFormat(params.value);
},
yAxisPointFormat(params) {
return this.PlanConvert.computedFormatYAxis(this.stations, params);
},
xAxisLableFormat(value, index) {
if (value % 60 === 0) {
return timeFormat(value);
}
},
yAxisLableFormat(value, index) {
return '';
},
xAxisInit() {
const list = [];
for (var time = this.PlanConvert.TranslationTime; time < 3600 * 24 + this.PlanConvert.TranslationTime; time++) {
list.push(time);
}
this.option.xAxis[0].data = list;
},
yAxisInit() {
if (Object.keys(this.PlanConvert).length) {
this.option.yAxis.min = this.PlanConvert.computedYaxisMinValue(this.stations);
this.option.yAxis.max = this.PlanConvert.computedYaxisMaxValue(this.stations);
}
},
axisTooltip(param) {
const station = this.stations[Math.floor((param.data[1] - this.PlanConvert.EdgeHeight) / this.PlanConvert.CoordMultiple)] || { name: '', kmRange: '' };
return [
`Point Data <hr size=1 style="margin: 3px 0">`,
`${this.$t('display.runPlan.stationName')}: ${station.name}<br>`,
`${this.$t('display.runPlan.stationMark')}: ${station.kmRange} km <br>`,
`${this.$t('display.runPlan.arrivalTime')}: ${timeFormat(param.data[0] + this.PlanConvert.TranslationTime)} (${param.data[0]})<br>`
].join('');
},
settingExac(data) {
this.absoluteTime = Math.abs(parseInt(data.endValue) - parseInt(data.startValue)) / 1000;
this.myChart && this.myChart.setOption({
xAxis: this.option.xAxis,
yAxis: this.option.yAxis
});
this.myChart && this.myChart.dispatchAction({
type: 'dataZoom',
dataZoomIndex: [0, 1],
startValue: parseInt(data.startValue / 1000),
endValue: parseInt(data.endValue / 1000)
});
},
run(start) {
this.myChart && this.myChart.dispatchAction({
type: 'dataZoom',
dataZoomIndex: [0, 1],
startValue: parseInt(start - this.absoluteTime / 2),
endValue: parseInt(start + this.absoluteTime / 2)
});
this.loadInitData(this.series);
},
reSize(opt) {
if (this.myChart) {
this.myChart.resize({ width: opt.width, height: opt.height, silent: false });
}
}
}
};
</script>
<style scoped rel="stylesheet/scss" lang="scss">
/deep/ {
.el-dialog__body {
padding: 0px !important;
background-color: floralwhite !important;
}
}
</style>

View File

@ -0,0 +1,371 @@
<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"
@change="handleQuery"
/>
</el-form-item>
</el-col>
<el-col :span="6">
<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-form-item>
</el-col>
<el-col :span="6">
<el-form-item :label="$t('display.schedule.scheduleMode')">
<div>{{ formModel.mode }}</div>
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item style="text-align: right">
<el-button-group>
<el-button size="small" type="warning" @click="handleCheck">{{ $t('display.schedule.check') }}</el-button>
<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 { querySecheduling, generateScheduling, getSchedulingAllTrains, checkScheduling, saveScheduling, generateSchedulingAgain } from '@/api/scheduling';
import { hexColor } from '@/utils/runPlan';
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: [],
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: 'trainCode',
type: 'select',
width: '150',
options: () => { return this.groupNumberList; },
editable: true,
editing: true
},
{
title: this.$t('display.schedule.onlineSection'),
prop: 'onlineSection',
type: 'text'
},
{
title: this.$t('display.schedule.onlineServerNumber'),
prop: 'onlineServerNumber',
type: 'text'
},
{
title: this.$t('display.schedule.onlineTargetNumber'),
prop: 'onlineTargetNumber',
type: 'text'
},
{
title: this.$t('display.schedule.onlineTime'),
prop: 'onlineTime',
type: 'text'
},
{
title: this.$t('display.schedule.onlineTripNumber'),
prop: 'onlineTripNumber',
type: 'text',
format: (row) => { return `${row.onlineDirectionCode}${row.onlineTripNumber}`; }
},
{
title: this.$t('display.schedule.outDepot'),
prop: 'outDepot',
type: 'text'
},
{
title: this.$t('display.schedule.outDepotStatus'),
prop: 'outStatus',
type: 'tag',
columnValue: (row) => { return this.$ConstSelect.translate(row.outStatus, 'Whether'); },
tagType: (row) => {
switch (row.outStatus) {
case true: return 'success';
case false: return 'danger';
}
}
},
{
title: this.$t('display.schedule.offlineSection'),
prop: 'offlineSection',
type: 'text'
},
{
title: this.$t('display.schedule.offlineServerNumber'),
prop: 'offlineServerNumber',
type: 'text'
},
{
title: this.$t('display.schedule.offlineTargetNumber'),
prop: 'offlineTargetNumber',
type: 'text'
},
{
title: this.$t('display.schedule.offlineTime'),
prop: 'offlineTime',
type: 'text'
},
{
title: this.$t('display.schedule.offlineTripNumber'),
prop: 'offlineTripNumber',
type: 'text',
format: (row) => { return `${row.offlineDirectionCode}${row.offlineTripNumber}`; }
},
{
title: this.$t('display.schedule.inDepot'),
prop: 'inDepot',
type: 'text'
},
{
title: this.$t('display.schedule.inDepotStatus'),
prop: 'inStatus',
type: 'tag',
columnValue: (row) => { return this.$ConstSelect.translate(row.inStatus, 'Whether'); },
tagType: (row) => {
switch (row.inStatus) {
case true: return 'success';
case false: return 'danger';
}
}
}
]
},
tableData: []
};
},
computed: {
title() {
return this.$t('display.schedule.schedulePlan');
}
},
created() {
this.loadInitData();
},
methods: {
doShow() {
this.formModel.day = '';
this.show = true;
},
doClose() {
this.show = false;
},
loadInitData() {
this.groupNumberList = [];
getSchedulingAllTrains(this.group).then(resp => {
this.groupNumberList = resp.data.map(elem => { return {value: elem.code, label: elem.groupNumber}; });
});
},
handleQuery(day) {
if (day) {
this.loading = true;
querySecheduling(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();
if (error.code == 30002) {
this.handleReGenerate(day);
} else {
this.$messageBox(`${error.message}`);
this.loading = false;
}
});
}
},
handleGenerate(day) {
generateScheduling(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}`);
});
},
handleReGenerate(day) {
generateSchedulingAgain(this.group).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.regenerateSchedulePlanSuccess'));
}).catch(error => {
this.loading = false;
this.clearData();
this.$messageBox(`${error.message}`);
});
},
handleCheck() {
if (this.formModel.planDate) {
checkScheduling(this.group, this.tableData).then(resp => {
const data = resp.data;
this.setConflictList(data.conflictList);
if (data.pass) {
this.$message.success(this.$t('display.schedule.checkPassed'));
} else {
this.$message.warning(this.$t('display.schedule.checkFailed'));
}
}).catch(error => {
this.$messageBox(`${this.$t('display.schedule.checkSchedulePlanFailed')}: ${error.message}`);
});
} else {
this.$messageBox(this.$t('display.schedule.selectSchedulePlan'));
}
},
handleSave() {
if (this.formModel.planDate) {
saveScheduling(this.group, this.tableData).then(resp => {
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({rowIndex}) {
const row = this.tableData[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 => {
elem['$conflict'] = null;
});
return tableData;
},
clearData() {
this.formModel.planDate = '';
this.tableData = [];
}
}
};
</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>

View File

@ -0,0 +1,118 @@
<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 { prefixIntrger } from '@/utils/date';
import { getDesignatedTimeTrainNum } 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() {
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) {
getDesignatedTimeTrainNum({ initTime: this.formatTime(initTime) }, this.group).then(resp => {
this.maxNumber = parseInt(resp.data);
});
}
},
formatTime(initTime) {
const hh = prefixIntrger(initTime.getHours(), 2);
const mm = prefixIntrger(initTime.getMinutes(), 2);
const ss = prefixIntrger(initTime.getSeconds(), 2);
return `${hh}:${mm}:${ss}`;
},
handleSure() {
this.$refs.form.validate((valid) => {
if (valid) {
this.status = true;
const model = {
initTime: this.formatTime(this.formModel.initTime)
};
if (this.hasNumber) {
model['loadNum'] = this.formModel.loadNum;
}
this.$emit('ConfirmSelectBeginTime', model);
this.doClose();
}
});
}
}
};
</script>

View File

@ -0,0 +1,637 @@
<template>
<div class="main" :style="{width: canvasWidth+'px'}" @mousemove="mousemove">
<div v-show="panelShow" :panelShow="panelShow">
<transition name="el-zoom-in-bottom">
<map-system-draft ref="mapCanvas" @back="back" />
</transition>
<menu-exam v-if="isExam" ref="menuExam" :offset="offset" :group="group" />
<menu-lesson v-if="isLesson" ref="lessonMenu" :offset="offset" :group="group" :training-obj="trainingObj" />
<menu-demon
v-if="isDemon"
ref="menuDemon"
:offset="offset"
:group="group"
:quest-id="questId"
@tryTime="tryTime"
@hidepanel="hidepanel"
@quitQuest="quitQuest"
@showScheduling="showScheduling"
/>
<menu-screen v-if="isScreen" ref="menuScreen" :offset="offset" :group="group" @tryTime="tryTime" />
<menu-plan v-if="isPlan" ref="menuPlan" :offset="offset" :group="group" />
<menu-replay v-if="isReplay" ref="menuReplay" :offset="offset" :group="group" />
<menu-script v-if="isScript" ref="menuScript" :offset="offset" :group="group" />
<menu-schema
v-if="isDemon || isPlan || isScript "
ref="menuSchema"
:offset="offset"
:group="group"
@switchMode="switchMode"
@selectQuest="selectQuest"
/>
<menu-system-time ref="menuSystemTime" :offset="offset" :right="right" :group="group" />
</div>
<Jl3d-Simulation v-show="simulationShow" ref="Jl3dSimulation" :panel-show="simulationShow" @showpanel="showpanel" />
<Jl3d-Drive v-show="drivingShow" ref="Jl3dDrive" :panel-show="drivingShow" @showdriving="showdriving" />
<fault-choose ref="faultChoose" :group="group" />
<run-plan-Load ref="runPlanLoad" :group="group" />
<run-plan-view ref="runPlanView" :group="group" />
<add-quest ref="addQuest" @selectQuest="selectQuest" />
<scheduling v-if="isShowScheduling" ref="scheduling" :group="group" />
</div>
</template>
<script>
import RunPlanLoad from './demon/runPlanLoad';
import RunPlanView from './demon/runPlanView';
import FaultChoose from './demon/faultChoose';
import MapSystemDraft from '@/views/mapsystem/index';
import MenuExam from '@/views/display/menuExam';
import MenuLesson from '@/views/display/menuLesson';
import MenuReplay from '@/views/display/menuReplay';
import MenuDemon from '@/views/display/menuDemon';
import MenuScreen from '@/views/display/menuScreen';
import MenuSchema from '@/views/display/menuSchema';
import MenuSystemTime from '@/views/display/menuSystemTime';
import MenuPlan from '@/views/display/menuPlan';
import MenuScript from '@/views/display/menuScript';
import AddQuest from './demon/addQuest';
import Scheduling from './demon/scheduling';
import { mapGetters } from 'vuex';
import { getTrainingDetail, getTrainingStepsDetail } from '@/api/jmap/training';
import { setGoodsTryUse } from '@/api/management/goods';
import { getProductDetail } from '@/api/management/mapprd';
import { runDiagramQuit, getSimulationInfo } from '@/api/simulation';
import { OperateMode, TrainingMode } from '@/scripts/ConstDic';
import { checkLoginLine } from '@/api/login';
import { loadMapDataById } from '@/utils/loaddata';
import { EventBus } from '@/scripts/event-bus';
import Vue from 'vue';
import {loadDraftScript} from '@/api/designPlatform';
//
import Jl3dSimulation from '@/views/jlmap3d/simulation/jl3dsimulation';
import Jl3dDrive from '@/views/jlmap3d/drive/jl3ddrive';
export default {
name: 'DisplayDraft',
components: {
RunPlanLoad,
RunPlanView,
FaultChoose,
AddQuest,
MenuExam,
MenuLesson,
MenuReplay,
MapSystemDraft,
MenuPlan,
MenuDemon,
MenuScreen,
MenuScript,
MenuSchema,
MenuSystemTime,
Jl3dSimulation,
Jl3dDrive,
Scheduling
},
props: {
size: {
type: Object,
default() {
return null;
}
}
},
data() {
return {
mode: '',
trainingObj: {},
timeDemonNum: 0,
checkLine: null,
offset: 15,
mouseNum: 1,
ierval: null,
mouseNumTime: 0,
mapBox: null,
mapBoxP: null,
panelShow: true,
simulationShow: false,
drivingShow: false,
questId: 0, // Id
group: '',
prdTypeMap: {
'01': '01', // =>
'02': '02', // =>
'04': '02', // =>
'05': '' // => null
},
isDrive: this.prdType == '04',
isShowScheduling: this.prdType == '05'
};
},
computed: {
...mapGetters([
'canvasWidth',
'canvasHeight'
]),
...mapGetters('map', [
'map'
]),
...mapGetters('training', [
'offsetStationCode'
]),
...mapGetters('config', [
'canvasId'
]),
width() {
return this.$store.state.app.width;
},
height() {
return this.$store.state.app.height;
},
right() {
return this.$store.state.config.width / 2 - 55;
},
trainingId() {
return this.$route.query.trainingId;
},
mapId() {
return this.$route.query.mapId;
},
prdType() {
// return this.$route.query.prdType;
return this.$store.state.training.prdType;
},
skinCode() {
return this.$route.query.skinCode;
},
mapId() {
return this.$route.query.mapId;
},
isLesson() {
return this.mode === 'teach' || this.mode === 'record' || this.mode === 'manage';
},
isExam() {
return this.mode === 'exam';
},
isDemon() {
return this.mode === 'demon';
},
isScreen() {
return this.mode === 'dp';
},
isReplay() {
return this.mode === 'replay';
},
isScript() {
return this.mode === 'script';
},
isPlan() {
return this.mode === 'plan';
}
// isDrive() {
// return this.prdType == '04';
// },
// isShowScheduling() {
// return this.prdType == '05';
// }
},
watch: {
'$store.state.config.menuBarLoadedCount': function (val) {
this.setPosition();
},
'$store.state.map.mapViewLoadedCount': function (val) {
this.mapBoxP = document.getElementById(this.canvasId).children[0];
this.mapBox = document.getElementsByTagName('canvas');
if (this.trainingId) {
getTrainingStepsDetail(this.trainingId, { group: this.group }).then(resp => {
this.trainingObj = resp.data;
this.$store.dispatch('training/setTrainingData', this.trainingObj);
});
}
},
'$store.state.training.prdType': function(val) {
// this.prdType=val;
this.isDrive = (val == '04');
this.isShowScheduling = (val == '05');
},
'$store.state.socket.permissionOver': function () {
this.$alert('用户权限已被收回', '提示', {
confirmButtonText: '确定',
callback: action => {
this.back();
}
});
},
'$store.state.app.windowSizeCount': function() {
this.setWindowSize();
},
$route() {
this.$nextTick(() => {
this.initLoadData();
});
}
},
async created() {
this.mode = this.$route.params.mode;
this.group = this.$route.query.group || '';
},
async mounted() {
EventBus.$on('clearCheckLogin', () => {
this.clearCheckLogin();
});
await this.setWindowSize();
await this.initLoadData();
this.switchMode('');
},
async beforeDestroy() {
await this.clearAllTimer();
if (!this.isReplay) {
await this.quit();
}
await this.$store.dispatch('training/reset');
await this.$store.dispatch('map/mapClear');
EventBus.$off('clearCheckLogin');
},
methods: {
// 线
clearAllTimer() {
if (this.ierval) {
clearTimeout(this.ierval);
this.ierval = null;
}
if (this.checkLine) {
clearTimeout(this.checkLine);
this.checkLine = null;
}
},
// 线
checkLoginLineTimer() {
if (this.checkLine) {
clearTimeout(this.checkLine);
}
this.checkLine = setInterval(() => {
checkLoginLine();
}, 5000 * 60);
},
//
checkMouseStatusTimer() {
if (this.ierval) {
clearTimeout(this.ierval);
}
this.ierval = setInterval(() => {
if (this.mouseNum) {
this.mouseNum = 0;
this.mouseNumTime = 0;
} else {
this.mouseNumTime += 1;
}
if (this.mapBox) {
if (this.mouseNumTime >= 15) {
for (let i = 0; i < this.mapBox.length; i++) {
this.mapBox[i].style.cursor = 'none';
}
} else {
for (let i = 0; i < this.mapBox.length; i++) {
this.mapBox[i].style.cursor = '';
}
}
}
}, 1000);
},
mousemove(e) {
this.mouseNum = 1;
},
setPosition() {
this.$nextTick(() => {
let offset = 15;
const menuBar = document.getElementById('menuBar');
const menuTool = document.getElementById('menuTool');
if (menuBar) {
offset += (menuBar.offsetHeight || 0);
}
if (menuTool) {
offset += (menuTool.offsetHeight || 0);
}
if (this.offset != offset) {
this.offset = offset;
}
});
},
//
endViewLoading(isSuccess) {
if (!isSuccess) {
this.$store.dispatch('map/mapClear');
}
this.$nextTick(() => {
EventBus.$emit('viewLoading', false);
});
},
// 仿
async loadSimulationInfo() {
const resp = await getSimulationInfo(this.group);
if (resp && resp.code == 200) {
this.$store.dispatch('scriptRecord/updateSimulationPause', resp.data.pause);
this.questId = Number(resp.data.questId) || 0;
}
},
//
async initLoadData() {
this.$store.dispatch('training/reset');
try {
if (!this.isReplay) {
await this.loadSimulationInfo();
}
if (this.isReplay) {
await this.initLoadReplayData();
} else if (this.isDemon) {
await this.initLoadDemonData();
} else if (this.isScreen) {
await this.initLoadScreenData();
} else if (this.isPlan) {
await this.initLoadTestRunData();
} else if (this.isScript) {
await this.initLoadTaskData();
} else {
await this.initLoadLessonOrExamData();
}
this.checkLoginLineTimer();
this.checkMouseStatusTimer();
} catch (error) {
this.$messageBox(`初始化失败: ${error.message}`);
this.endViewLoading();
}
},
//
async initLoadLessonOrExamData() {
this.$store.dispatch('training/end', null);
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); //
if (parseInt(this.trainingId)) {
//
//
const resp = await getTrainingDetail(this.trainingId);
if (resp && resp.code == 200) {
const detail = resp.data;
const rest = await getProductDetail(detail.prdId);
if (rest && rest.code == 200) {
const data = rest.data;
await this.$store.dispatch('training/setPrdType', data.prdType);
await this.loadMapDataById(this.mapId);
}
} else {
this.$messageBox(`获取实训步骤数据失败`);
this.endViewLoading();
}
} else {
this.endViewLoading();
}
},
//
async initLoadReplayData() {
this.$store.dispatch('training/end', TrainingMode.NORMAL);
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); //
this.$store.dispatch('training/setPrdType', '');
if (parseInt(this.mapId)) {
await this.loadMapDataById(this.mapId);
} else {
this.endViewLoading();
}
},
// 仿
async initLoadDemonData() {
this.$store.dispatch('training/end', TrainingMode.NORMAL);
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); //
this.$store.dispatch('training/setPrdType', this.prdTypeMap[this.prdType]);
if (parseInt(this.mapId)) {
await this.loadMapDataById(this.mapId);
} else {
this.endViewLoading();
}
},
//
async initLoadScreenData() {
this.$store.dispatch('training/end', TrainingMode.NORMAL);
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); //
this.$store.dispatch('training/setPrdType', '01');
if (parseInt(this.mapId)) {
await this.loadMapDataById(this.mapId);
} else {
this.endViewLoading();
}
},
//
async initLoadTaskData() {
this.$store.dispatch('training/end', TrainingMode.NORMAL);
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); //
this.switchMode('01');
if (parseInt(this.mapId)) {
await this.loadMapDataById(this.mapId);
} else {
this.endViewLoading();
}
},
//
async initLoadTestRunData() {
this.$store.dispatch('training/end', TrainingMode.NORMAL);
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); //
this.$store.dispatch('training/setPrdType', '01');
if (parseInt(this.mapId)) {
await this.loadMapDataById(this.mapId);
} else {
this.endViewLoading();
}
},
//
async runQuestLoadShow() {
this.$refs.addQuest.doShow();
},
async runAddRolesLoadShow() {
// this.$refs.addQuest.doShow();
// const row={id: this.$route.query.scriptId};
const row = {group: this.$route.query.group, id: this.$route.query.scriptId};
this.$refs.addQuest.handleLoad(1, row);
},
//
async selectQuest(row, id, mapLocation, roleName) {
try {
let prdType = '';
switch (roleName) {
case 'Attendant': {
prdType = '01';
break;
}
case 'Dispatcher': {
prdType = '02';
break;
}
case 'Driver': {
prdType = '04';
break;
}
case 'Repair': {
prdType = '';
break;
}
}
this.switchMode(prdType);
const res = await loadDraftScript(row.id, id, this.group);
if (res && res.code == 200) {
this.questId = parseInt(row.id);
if (mapLocation) {
const newMapLocation = {'offsetX': mapLocation.x, 'offsetY': mapLocation.y, 'scaleRate': mapLocation.scale};
Vue.prototype.$jlmap.setOptions(newMapLocation);
}
// if (res.data && res.data.mapLocation) {
// const mapLocation={'offsetX': res.data.mapLocation.x, 'offsetY': res.data.mapLocation.y, 'scaleRate': res.data.mapLocation.scale};
// Vue.prototype.$jlmap.setOptions(mapLocation);
// }
}
if (this.$refs.menuDemon) {
await this.$refs.menuDemon.initLoadPage();
}
if (this.$refs.menuScript) {
await this.$refs.menuScript.initLoadPage();
}
} catch (error) {
this.$messageBox(error.message);
}
},
// 退
async quitQuest() {
this.questId = 0;
},
// id
async loadMapDataById(mapId) {
try {
await loadMapDataById(mapId);
await this.$store.dispatch('training/setMapDefaultState');
} catch (error) {
this.$messageBox(`获取地图数据失败: ${error.message}`);
this.endViewLoading();
}
},
// 仿
async quit() {
await runDiagramQuit(this.group);
await this.$store.dispatch('training/over');
},
// 仿退
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.isScreen) {
await this.$refs.menuScreen.back();
} else if (this.isPlan) {
await this.$refs.menuPlan.back();
} else if (this.isScript) {
await this.$refs.menuScript.back();
}
},
// 使
async tryTime(param) {
const data = {
goodsId: param.goodsId,
time: param.time
};
if (data.goodsId) {
await setGoodsTryUse(data);
}
},
switchMode(prdType) {
this.$store.dispatch('training/setPrdType', prdType);
},
hidepanel() {
if (this.isDrive) {
this.panelShow = false;
this.drivingShow = true;
this.$refs.Jl3dDrive.show(this.mapId, this.group);
} else {
this.panelShow = false;
this.simulationShow = true;
this.$refs.Jl3dSimulation.show(this.mapId, this.group);
}
},
showScheduling() {
this.$refs.scheduling.doShow();
},
showpanel() {
this.panelShow = true;
this.simulationShow = false;
},
showdriving() {
this.panelShow = true;
this.drivingShow = false;
},
runPlanViewShow() {
this.$refs.runPlanView.doShow();
},
runPlanLoadShow() {
this.$refs.runPlanLoad.doShow();
},
// faultChooseShow() {
// this.$refs.faultChoose.doShow();
// },
setWindowSize() {
this.$nextTick(() => {
const width = this.size ? this.size.width : this.width;
const height = this.size ? this.size.height : this.height;
this.$store.dispatch('config/resize', { width, height });
this.$store.dispatch('training/updateOffsetStationCode', { offsetStationCode: this.offsetStationCode });
});
}
}
};
</script>
<style>
.main {
z-index: 10;
display: block;
width: 100%;
height: 100%;
overflow: hidden;
-moz-user-select: none;
-o-user-select: none;
-khtml-user-select: none;
-webkit-user-select: none;
-ms-user-select: none;
user-select: none;
}
</style>

View File

@ -53,24 +53,24 @@
<script>
import MapSystemDraft from '@/views/newMap/mapsystemNew/index';
import MenuExam from '@/views/display/menuExam';
import MenuLesson from '@/views/display/menuLesson';
import MenuReplay from '@/views/display/menuReplay';
import MenuDemon from '@/views/display/menuDemon';
import MenuScreen from '@/views/display/menuScreen';
import MenuSchema from '@/views/display/menuSchema';
import MenuSystemTime from '@/views/display/menuSystemTime';
import MenuPlan from '@/views/display/menuPlan';
import MenuScript from '@/views/display/menuScript';
import MenuExam from '@/views/newMap/displayNew/menuExam';
import MenuLesson from '@/views/newMap/displayNew/menuLesson';
import MenuReplay from '@/views/newMap/displayNew/menuReplay';
import MenuDemon from '@/views/newMap/displayNew/menuDemon';
import MenuScreen from '@/views/newMap/displayNew/menuScreen';
import MenuSchema from '@/views/newMap/displayNew/menuSchema';
import MenuSystemTime from '@/views/newMap/displayNew/menuSystemTime';
import MenuPlan from '@/views/newMap/displayNew/menuPlan';
import MenuScript from '@/views/newMap/displayNew/menuScript';
import Scheduling from './demon/scheduling';
import { mapGetters } from 'vuex';
import { getTrainingDetail, getTrainingStepsDetail } from '@/api/jmap/training';
import { setGoodsTryUse } from '@/api/management/goods';
import { getProductDetail } from '@/api/management/mapprd';
import { runDiagramQuit, loadScript, getSimulationInfo } from '@/api/simulation';
import { runDiagramQuit, loadScript, getSimulationInfoNew } from '@/api/simulation';
import { OperateMode, TrainingMode } from '@/scripts/ConstDic';
import { checkLoginLine } from '@/api/login';
import { loadMapDataById } from '@/utils/loaddata';
import { loadNewMapDataByGroup } from '@/utils/loaddata';
import { EventBus } from '@/scripts/event-bus';
import Vue from 'vue';
@ -331,7 +331,8 @@ export default {
},
// 仿
async loadSimulationInfo() {
const resp = await getSimulationInfo(this.group);
const resp = await getSimulationInfoNew(this.group);
console.log(resp, '================');
if (resp && resp.code == 200) {
this.$store.dispatch('scriptRecord/updateSimulationPause', resp.data.pause);
this.questId = Number(resp.data.questId) || 0;
@ -382,7 +383,7 @@ export default {
if (rest && rest.code == 200) {
const data = rest.data;
await this.$store.dispatch('training/setPrdType', data.prdType);
await this.loadMapDataById(this.mapId);
await this.loadNewMapDataByGroup(this.group);
}
} else {
this.$messageBox(`获取实训步骤数据失败`);
@ -399,7 +400,7 @@ export default {
this.$store.dispatch('training/setPrdType', '');
if (parseInt(this.mapId)) {
await this.loadMapDataById(this.mapId);
await this.loadNewMapDataByGroup(this.group);
} else {
this.endViewLoading();
}
@ -411,8 +412,7 @@ export default {
this.$store.dispatch('training/setPrdType', this.prdTypeMap[this.prdType]);
if (parseInt(this.mapId)) {
await this.loadMapDataById(this.mapId);
await this.loadNewMapDataByGroup(this.group);
} else {
this.endViewLoading();
}
@ -423,7 +423,7 @@ export default {
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); //
this.$store.dispatch('training/setPrdType', '01');
if (parseInt(this.mapId)) {
await this.loadMapDataById(this.mapId);
await this.loadNewMapDataByGroup(this.group);
} else {
this.endViewLoading();
}
@ -435,7 +435,7 @@ export default {
this.switchMode('01');
if (parseInt(this.mapId)) {
await this.loadMapDataById(this.mapId);
await this.loadNewMapDataByGroup(this.group);
} else {
this.endViewLoading();
}
@ -447,7 +447,7 @@ export default {
this.$store.dispatch('training/setPrdType', '01');
if (parseInt(this.mapId)) {
await this.loadMapDataById(this.mapId);
await this.loadNewMapDataByGroup(this.group);
} else {
this.endViewLoading();
}
@ -482,9 +482,9 @@ export default {
this.$store.dispatch('scriptRecord/updateSimulationPause', false);
},
// id
async loadMapDataById(mapId) {
async loadNewMapDataByGroup(group) {
try {
await loadMapDataById(mapId);
await loadNewMapDataByGroup(group);
await this.$store.dispatch('training/setMapDefaultState');
} catch (error) {
this.$messageBox(`获取地图数据失败: ${error.message}`);

View File

@ -0,0 +1,269 @@
<template>
<div>
<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>
<div class="display-draft">
<el-button-group>
<el-button v-if="isShowScheduling" type="primary" @click="jumpScheduling">{{ $t('display.demon.dispatchingPlan') }}</el-button>
<el-button type="jumpjlmap3d" @click="jumpjlmap3d">{{ jl3dname }}</el-button>
<el-button v-if="isShow3dmodel" type="jumpjlmap3dmodel" @click="jumpjlmap3dmodel">{{ jl3dmodel }}</el-button>
<template v-if="isShowQuest">
<!-- && !isDesignPlatform -->
<el-button v-if="!isDesignPlatform " type="danger" @click="handleQuitQuest">{{ $t('display.demon.exitScript') }}</el-button>
</template>
<template v-else>
<el-button type="success" :disabled="isDisable" @click="selectBeginTime">{{ $t('display.demon.drivingByPlan') }}</el-button>
<el-button type="danger" :disabled="!isDisable" @click="end">{{ $t('display.demon.exitPlan') }}</el-button>
</template>
<el-button type="primary" @click="back">{{ $t('display.demon.back') }}</el-button>
</el-button-group>
</div>
<set-time ref="setTime" @ConfirmSelectBeginTime="start" />
</div>
</template>
<!-- 单人仿真 -->
<script>
import SetTime from './demon/setTime';
import { Notification } from 'element-ui';
import { getGoodsTryUse } from '@/api/management/goods';
import { runDiagramStart, runDiagramOver, runDiagramGetTime } from '@/api/simulation';
import { PermissionType } from '@/scripts/ConstDic';
import { getCountTime } from '@/utils/index';
import { runDiagramIsStart, quitScript } from '@/api/simulation';
import { timeFormat } from '@/utils/date';
import { getToken } from '@/utils/auth';
export default {
name: 'MenuDemon',
components: {
SetTime
},
props: {
group: {
type: String,
required: true
},
offset: {
type: Number,
required: true
},
questId: {
type: Number,
default() {
return 0;
}
}
},
data() {
return {
isDisable: false,
tryTime: 0, //
timeNow: 0, //
time: null, //
countTime: 0, //
remainingTime: 0,
goodsId: this.$route.query.goodsId,
try: this.$route.query.try, //
training: {
id: '',
name: '',
remarks: ''
},
jl3dname: this.$t('display.demon.threeDimensionalView'),
jl3dmodel: this.$t('display.demon.deviceView'),
isShow3dmodel :false,
};
},
computed: {
isShowQuest() {
return this.questId;
},
isShowScheduling() {
return this.$route.query.prdType == '05';
},
isDesignPlatform() {
return this.$route.fullPath.includes('design/display/demon');
}
},
watch: {
'$store.state.training.subscribeCount': function () {
this.group && this.initLoadPage();
},
'$store.state.socket.tipOperateCount': function (val) {
this.$alert(this.$t('display.demon.taskOperateSuccess'), this.$t('global.tips'), {
confirmButtonText: this.$t('global.confirm'),
callback: action => {
}
});
}
},
beforeDestroy() {
if (this.time) {
this.setTryTime();
clearTimeout(this.time);
}
},
methods: {
async initLoadPage() {
try {
if (this.try != '0') {
this.loadInitData();
}
const resp = '';//await runDiagramIsStart(this.group);
if (resp && resp.data) {
this.isDisable = true;
this.$store.dispatch('training/simulationStart');
} else {
this.isDisable = false;
this.$store.dispatch('training/over');
}
await this.loadSystemTime();
this.change3dname();
} catch (error) {
console.log(error);
}
},
loadInitData() {
const data = {
mapId: this.$route.query.mapId,
prdId: this.$route.query.code,
permissionType: PermissionType.SIMULATION
};
getGoodsTryUse(data).then(res => {
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.isDisable = true;
runDiagramStart(model, this.group).then(res => {
this.$store.dispatch('training/simulationStart').then(() => {
this.$store.dispatch('training/setInitTime', +new Date(`${new Date().getFullYear()} ${model.initTime}`));
});
}).catch(error => {
this.isDisable = false;
this.$messageBox(error.message + '' + this.$t('display.demon.startSimulationFail'));
});
},
end() {
this.isDisable = false;
runDiagramOver(this.group).then(() => {
this.$store.dispatch('training/over').then(() => {
this.$store.dispatch('training/setMapDefaultState').then(() => {
this.$store.dispatch('map/clearJlmapTrainView');
this.$store.dispatch('map/setTrainWindowShow', false);
});
});
}).catch(() => {
this.isDisable = true;
this.$messageBox(this.$t('display.demon.endSimulationFail'));
});
},
handleQuitQuest() {
quitScript(this.group).then(resp => {
this.$emit('quitQuest');
this.initLoadPage();
}).catch(() => {
this.$messageBox(this.$t('display.demon.exitTaskFail'));
});
},
back() {
this.$store.dispatch('training/over').then(() => {
history.go(-1);
Notification.closeAll();
});
},
jumpjlmap3d() {
this.$emit('hidepanel');
},
jumpjlmap3dmodel() {
this.$emit('devicemodel');
},
jumpScheduling() {
this.$emit('showScheduling');
},
setTryTime() {
if (this.try) {
this.$emit('tryTime', { time: this.tryTime, goodsId: this.goodsId });
}
},
async loadSystemTime() {
// const rest = await runDiagramGetTime(this.group);
// if (rest && rest.code == 200) {
// this.$store.dispatch('training/setInitTime', +new Date(`${new Date().getFullYear()} ${timeFormat(rest.data)}`));
// }
},
change3dname() {
if (this.$route.query.prdType == '04') {
this.jl3dname = this.$t('display.demon.driverPerspective');
} else {
this.jl3dname = this.$t('display.demon.threeDimensionalView');
this.isShow3dmodel = true;
}
}
}
};
</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: 20px;
bottom: 15px;
}
</style>

View File

@ -0,0 +1,292 @@
<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">
<el-button-group>
<el-button type="success" :disabled="isDisable" :loading="startLoading" @click="start">{{ $t('display.startBtn') }}</el-button>
<el-button type="danger" :disabled="!isDisable" @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 @refresh="refresh" />
</div>
</template>
<script>
import TipExamList from './tipExamList';
import { Notification } from 'element-ui';
import { startTraining } from '@/api/jmap/training';
import { timeFormat } from '@/utils/date';
import { refreshExamList, finishOneExamQuestion } from '@/api/management/userexam';
import { launchFullscreen } from '@/utils/screen';
export default {
name: 'MenuExam',
components: {
TipExamList
},
props: {
group: {
type: String,
required: true
},
offset: {
type: Number,
required: true
}
},
data() {
return {
isDisable: false,
startLoading: false,
training: {
id: '',
name: '',
remarks: ''
}
};
},
computed: {
formatUsedTime() {
return timeFormat(this.$store.state.training.usedTime);
}
},
watch: {
'$store.state.map.mapViewLoadedCount': function() {
this.$store.dispatch('exam/countUsedTime');
}
},
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;
startTraining({ id: this.$route.query.trainingId }, this.group).then(response => {
this.$store.dispatch('training/examModeStart');
this.$store.dispatch('map/clearJlmapTrainView').then(() => {
this.$store.dispatch('training/setMapDefaultState').then(() => {
this.$store.dispatch('training/emitTipFresh');
});
});
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.training.started) {
const model = {
id: this.$route.query.examQuestionId,
usedTime: this.$store.state.training.usedTime,
group: this.group
};
this.$store.dispatch('training/end', null);
finishOneExamQuestion(model).then(response => {
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(() => {
this.$emit('quit');
this.$router.go(-1);
Notification.closeAll();
}).catch(() => {
});
},
init() {
launchFullscreen();
//
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 => {
// 50009y
if (error.code === 500009) {
this.$router.replace({ path: `/trainingPlatform/result/${this.$route.params.userExamId}`, query: {subSystem: this.$route.query.subSystem} });
} else {
this.$messageBox(this.$t('display.exam.refreshListError'));
}
});
},
refresh() {
this.isDisable = false;
this.$store.dispatch('training/end', null);
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.display-card {
z-index: 9;
display: inline;
position: absolute;
// float: left;
left: 160px;
}
.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>

View File

@ -0,0 +1,268 @@
<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-row>
</div>
<div class="display-draft">
<el-button-group>
<el-button type="success" :disabled="isDisable" :loading="startLoading" @click="start">{{ $t('display.startBtn') }}</el-button>
<el-button type="danger" class="end" :disabled="!isDisable" @click="end">{{ $t('display.endBtn') }}</el-button>
<el-button type="primary" :disabled="backDisable" class="back" @click="back">{{ $t('display.backBtn') }}</el-button>
</el-button-group>
</div>
<tip-training-detail :training-obj="trainingObj" />
</div>
</template>
<script>
import TipTrainingDetail from './tipTrainingDetail';
import { mapGetters } from 'vuex';
import { Notification } from 'element-ui';
import { startTraining, endTraining } from '@/api/jmap/training';
import { trainingNotify } from '@/api/simulation';
import { TrainingMode } from '@/scripts/ConstDic';
import { timeFormat } from '@/utils/date';
import { UrlConfig } from '@/router/index';
export default {
name: 'MenuLesson',
components: {
TipTrainingDetail
},
props: {
group: {
type: String,
required: true
},
trainingObj: {
type: Object,
default() {
return null;
}
},
offset: {
type: Number,
required: true
}
},
data() {
return {
timeInterval: null,
TrainingMode: TrainingMode,
demoMode: TrainingMode.TEACH,
isDisable: false,
backDisable: false,
startLoading: false
};
},
computed: {
...mapGetters('training', [
'score',
'started',
'usedTime',
'basicInfo'
]),
formatScore() {
return this.score;
},
formatUsedTime() {
return timeFormat(this.usedTime);
}
},
watch: {
demoMode: function (val) {
this.$store.dispatch('training/end', null);
this.$store.dispatch('training/reset');
this.$store.dispatch('training/emitTipFresh');
this.$store.dispatch('menuOperation/setButtonOperation', null);
this.isDisable = false;
},
'$store.state.training.operateErrMsg': function (val) {
this.tipInfo({ color: val.color, message: val.errMsg });
}
},
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)
});
}
},
start() {
//
this.$store.dispatch('menuOperation/setButtonOperation', null);
this.startLoading = true;
if (this.trainingObj && this.trainingObj.id) {
this.isDisable = true;
startTraining(this.trainingObj, this.group).then(response => {
this.$store.dispatch('map/clearJlmapTrainView').then(() => {
this.$store.dispatch('training/teachModeStart', this.demoMode);
this.$store.dispatch('training/setMapDefaultState').then(() => {
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() {
this.$store.dispatch('training/setStopCountTime');
const mode = {
mode: this.demoMode,
id: this.trainingObj.id,
lessonId: this.$route.query.lessonId,
usedTime: this.usedTime
};
endTraining(mode, this.group).then(response => {
const data = response.data;
this.$store.dispatch('training/judgeFinish', data).then(rsp => {
this.$store.dispatch('training/emitTipFresh');
});
}).catch(() => {
this.$messageBox(this.$t('display.lesson.endTrainingError'));
});
},
end() {
//
if (this.trainingObj && this.trainingObj.id) {
if (this.started) {
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;
this.$store.dispatch('training/end', null);
this.$store.dispatch('training/setScore', 0);
this.$store.dispatch('training/emitTipFresh');
}).catch(() => {
this.isDisable = true;
this.backDisable = false;
});
}
});
} else {
this.$messageBox(this.$t('display.lesson.startTrainingTip'));
}
}
},
back() {
this.$emit('quit');
Notification.closeAll();
if (this.$route.params.mode == 'record') {
/** 如果是演示返回时,需要重新创建仿真*/
trainingNotify({ 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 {
history.go(-1);
}
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.display-card {
z-index: 9;
display: inline-block;
position: absolute;
left: 160px;
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;
}
/deep/ .el-button {
font-weight: bold;
}
}
</style>

View File

@ -0,0 +1,141 @@
<template>
<div class="display-draft">
<el-button-group>
<el-button type="success" :disabled="isDisable" @click="selectBeginTime">{{ $t('display.plan.drivingByPlan') }}</el-button>
<el-button type="danger" :disabled="!isDisable" @click="end">{{ $t('display.plan.exitPlan') }}</el-button>
<el-button type="primary" @click="back">{{ $t('display.plan.back') }}</el-button>
</el-button-group>
<set-time ref="setTime" @ConfirmSelectBeginTime="start" />
</div>
</template>
<script>
import SetTime from './demon/setTime';
import { Notification } from 'element-ui';
import { runDiagramIsStart, runDiagramGetTime, runDiagramOver, runDiagramStart } from '@/api/simulation';
import { timeFormat } from '@/utils/date';
//
export default {
name: 'MenuPlan',
components: {
SetTime
},
props: {
group: {
type: String,
required: true
},
offset: {
type: Number,
required: true
}
},
data() {
return {
isDisable: false
};
},
watch: {
'$store.state.training.simulationGroupCount': function () {
this.initLoadPage();
}
},
methods: {
async initLoadPage() {
try {
const rest = '';//await runDiagramIsStart(this.group);
if (rest && rest.data) {
this.isDisable = true;
this.$store.dispatch('training/simulationStart');
} else {
this.isDisable = false;
this.$store.dispatch('training/over');
}
await this.loadSystemTime();
} catch (error) {
console.log(error);
}
},
async loadSystemTime() {
// const rest = await runDiagramGetTime(this.group);
// if (rest && rest.code == 200) {
// this.$store.dispatch('training/setInitTime', +new Date(`${new Date().getFullYear()} ${timeFormat(rest.data)}`));
// }
},
selectBeginTime() {
this.$refs.setTime.doShow();
},
start(model) {
this.isDisable = true;
runDiagramStart(model, this.group).then(res => {
this.$store.dispatch('training/simulationStart').then(() => {
this.$store.dispatch('training/setInitTime', +new Date(`${new Date().getFullYear()} ${model.initTime}`));
});
}).catch(() => {
this.isDisable = false;
this.$messageBox(this.$t('display.plan.startPlanFail'));
});
},
end() {
this.isDisable = false;
runDiagramOver(this.group).then(() => {
this.$store.dispatch('training/over').then(() => {
this.$store.dispatch('training/setMapDefaultState').then(() => {
this.$store.dispatch('map/clearJlmapTrainView');
this.$store.dispatch('map/setTrainWindowShow', false);
});
});
}).catch(() => {
this.isDisable = true;
this.$messageBox(this.$t('display.plan.endPlanFail'));
});
},
async back() {
this.$store.dispatch('training/over').then(() => {
history.go(-1);
Notification.closeAll();
// exitFullscreen();
});
}
}
};
</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>

View File

@ -0,0 +1,180 @@
<template>
<div>
<div>
<chart-view ref="chatView" :group="group" />
</div>
<div class="draft-box">
<div class="draft-menu">
<el-row>
<el-col :span="4">
<el-select v-model="speed" :placeholder="$t('display.replay.pleaseSelect')" @change="changeSpeed">
<el-option
v-for="item in optionsList"
:key="item.value"
:label="item.label"
size="mini"
:value="item.value"
/>
</el-select>
</el-col>
<el-col :span="4">
<el-button type="primary" class="back btn" @click="play">{{ playName }}</el-button>
</el-col>
<el-col :span="12">
<el-progress class="progress" :percentage="progress" style="width: 100%" :show-text="false" />
</el-col>
<el-col :span="2">
<el-button type="primary" class="back" @click="back">{{ $t('display.replay.back') }}</el-button>
</el-col>
</el-row>
</div>
</div>
</div>
</template>
<!-- 回放界面 -->
<script>
import { Notification } from 'element-ui';
// import { exitFullscreen } from '@/utils/screen';
import { putsSimulationRecord, putsSimulationRecordPause, putsSimulationRecordPlay, putsSimulationRecordPlaySpeed, putsSimulationRecordplayTime } from '@/api/simulationRecord';
import { EventBus } from '@/scripts/event-bus';
export default {
name: 'MenuReplay',
components: {
},
props: {
group: {
type: String,
required: true
},
offset: {
type: Number,
required: true
}
},
data() {
return {
isDisable: false,
startLoading: false,
speed: '1X',
level: 1,
isPlay: false,
time: '',
timeInterval: null,
progress: 0,
schedule: 0,
optionsList: [
{
label: '1X',
value: '1'
},
{
label: '2X',
value: '2'
},
{
label: '4X',
value: '4'
},
{
label: '8X',
value: '8'
}
]
};
},
computed: {
playName() {
return this.isPlay ? this.$t('display.replay.pause') : this.$t('display.replay.play');
}
},
watch: {
'$store.state.map.mapViewLoadedCount': function() {
this.isPlay = true;
}
},
mounted() {
EventBus.$emit('showChat');
this.time = (+new Date(this.$route.query.destroyTime) - +new Date(this.$route.query.createTime)) / 1000;
this.timeIntervals();
},
beforeDestroy() {
clearInterval(this.timeInterval);
this.timeInterval = null;
},
methods: {
timeIntervals() {
const timebili = 100 / this.time;
if (!this.timeInterval) {
this.timeInterval = setInterval(() => {
if (this.isPlay) {
this.progress += (this.level) * timebili;
if (this.progress >= 100) {
clearInterval(this.timeInterval);
this.timeInterval = null;
this.progress = 100;
this.isPlay = false;
}
}
}, 1000);
}
},
async play() {
this.isPlay = !this.isPlay;
if (this.isPlay) {
if (this.progress >= 100) {
this.progress = 0;
this.timeIntervals();
this.$refs.chatView.clearTextList();
await putsSimulationRecordplayTime(this.$route.query.replayId, 0);
} else {
await putsSimulationRecordPlay(this.$route.query.replayId);
}
} else {
await putsSimulationRecordPause(this.$route.query.replayId);
}
},
async changeSpeed(val) {
this.level = val;
await putsSimulationRecordPlaySpeed(this.$route.query.replayId, val);
},
async back() {
await putsSimulationRecord(this.$route.query.replayId);
history.go(-1);
Notification.closeAll();
// exitFullscreen();
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.draft-box {
position: absolute;
display: inline;
bottom: 10px;
right: 0px;
.draft-menu {
position: static;
width: 800px;
float: right;
.back {
z-index: 100000;
/deep/ .el-button {
font-weight: bold;
}
}
.progress {
left: -30px;
position: relative;
top: 14px;
}
}
}
</style>

View File

@ -0,0 +1,198 @@
<template>
<div>
<div class="schema" :style="{top: offset+'px'}">
<el-select v-if="isScript" v-model="swch" size="small" :placeholder="$t('display.schema.selectProduct')" @change="switchMode">
<el-option v-for="item in swchList" :key="item.value" :label="item.name" :value="item.value" />
</el-select>
<el-button-group>
<el-button v-if="isDemon && isDesignPlatform" size="small" :disabled="viewDisabled" type="success" @click="viewScriptRoles">{{ $t('display.schema.selectRoles') }}</el-button>
<!-- 加载剧本 -->
<el-button v-if="isDemon && !isDesignPlatform" size="small" :disabled="viewDisabled" type="success" @click="viewRunQuest">{{ $t('display.schema.loadScript') }}</el-button>
<el-button v-if="notScript && runing" size="small" :disabled="viewDisabled" @click="viewRunPlan">{{ $t('display.schema.previewRunDiagram') }}</el-button>
<el-button v-if="!runing && !isPlan && notScript" size="small" :disabled="viewDisabled" type="warning" @click="loadRunPlan">{{ $t('display.schema.loadRunDiagram') }}</el-button>
<el-button v-if="mode==OperateMode.FAULT" size="small" type="danger" @click="setFault">{{ $t('display.schema.faultSetting') }}</el-button>
</el-button-group>
<el-radio-group v-if="!isPlan" v-model="mode" size="small" @change="changeOperateMode(mode)">
<el-radio-button class="mode" :label="OperateMode.NORMAL">{{ $t('display.schema.normalOperation') }}</el-radio-button>
<el-radio-button class="mode" :label="OperateMode.FAULT">{{ $t('display.schema.faultOperation') }}</el-radio-button>
</el-radio-group>
</div>
<fault-choose v-if="isDemon || isPlan || isScript" ref="faultChoose" :group="group" />
<run-plan-Load ref="runPlanLoad" :group="group" />
<run-plan-view ref="runPlanView" :group="group" />
<!-- 加载剧本列表弹窗 -->
<add-quest ref="addQuest" @selectQuest="selectQuest" />
</div>
</template>
<script>
import RunPlanLoad from './demon/runPlanLoad';
import RunPlanView from './demon/runPlanView';
import FaultChoose from './demon/faultChoose';
import AddQuest from './demon/addQuest';
import { mapGetters } from 'vuex';
import { OperateMode } from '@/scripts/ConstDic';
import { getStationList, queryRunPlan } from '@/api/runplan';
import { getEveryDayRunPlanData } from '@/api/simulation';
import {getRpDetailByUserMapId} from '@/api/designPlatform';
//
export default {
name: 'MenuSchema',
components: {
RunPlanLoad,
RunPlanView,
FaultChoose,
AddQuest
},
props: {
group: {
type: String,
required: true
},
offset: {
type: Number,
required: true
}
},
data() {
return {
mode: OperateMode.NORMAL,
OperateMode: OperateMode,
viewDisabled: true,
runing: false,
swch: '01',
swchList: [
{ value: '01', name: '现地' },
{ value: '02', name: '行调' }
]
};
},
computed: {
...mapGetters('runPlan', [
'stations'
]),
notScript() {
return this.$route.params.mode !== 'script';
},
isPlan() {
return this.$route.params.mode === 'plan';
},
isScript() {
return this.$route.params.mode === 'script';
},
isDemon() {
return this.$route.params.mode === 'demon';
},
isDesignPlatform() {
return this.$route.fullPath.includes('design/display/demon');
}
},
watch: {
'$store.state.training.started': function (val) {
this.setRuning(val);
},
'$store.state.training.switchcount': async function () {
if (this.group) {
const started = this.$store.state.training.started;
if (started) {
await this.loadRunData(this.$route.query);
}
}
}
},
async mounted() {
await this.loadRunData(this.$route.query);
},
methods: {
loadRunData(opt) {
this.$store.dispatch('runPlan/clear').then(() => {
if (opt && opt.mapId) {
this.viewDisabled = true;
getStationList(opt.mapId).then(response => {
this.$store.dispatch('runPlan/setStations', response.data).then(() => {
if (this.$route.params.mode == 'plan') {
if (this.$route.query.from == 'user') {
//
getRpDetailByUserMapId(this.$route.query.planId).then(resp => {
this.$store.dispatch('runPlan/setPlanData', resp.data);
this.viewDisabled = false;
}).catch(() => {
this.$store.dispatch('runPlan/setPlanData', []);
this.$messageBox(this.$t('display.schema.getRunDiagramFail'));
});
} else {
//
queryRunPlan(this.$route.query.planId).then(resp => {
this.$store.dispatch('runPlan/setPlanData', resp.data);
this.viewDisabled = false;
}).catch(() => {
this.$store.dispatch('runPlan/setPlanData', []);
this.$messageBox(this.$t('display.schema.getRunDiagramFail'));
});
}
} else {
// getEveryDayRunPlanData(this.group).then(resp => {
// this.$store.dispatch('runPlan/setPlanData', resp.data);
// this.viewDisabled = false;
// }).catch(error => {
// this.$store.dispatch('runPlan/setPlanData', []);
// if (error.code == 30001) {
// this.$messageBox(this.$t('display.schema.todayRunDiagramNoLoad'));
// } else {
// this.$messageBox(this.$t('display.schema.getRunDiagramFail'));
// }
// });
}
});
}).catch(() => {
this.$messageBox(this.$t('display.schema.getStationListFail'));
});
}
});
},
changeOperateMode(handle) {
this.$store.dispatch('training/changeOperateMode', { mode: handle });
},
setRuning(run) {
this.runing = run;
},
setFault() {
this.$refs.faultChoose.doShow();
},
loadRunPlan() {
this.$refs.runPlanLoad.doShow();
},
viewRunPlan() {
this.$refs.runPlanView.doShow();
},
viewRunQuest() {
this.$refs.addQuest.doShow();
},
viewScriptRoles() {
const row = {id: this.$route.query.scriptId, group:this.$route.query.group};
this.$refs.addQuest.handleLoad(1, row);
},
selectQuest(row, id, mapLocation, roleName) {
this.$emit('selectQuest', row, id, mapLocation, roleName);
},
switchMode(swch) {
this.$emit('switchMode', swch);
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.schema {
z-index: 9;
display: inline;
position: absolute;
right: 15px;
}
/deep/ .el-button+.el-button {
margin-left: 0px;
}
</style>

View File

@ -0,0 +1,151 @@
<template>
<div>
<div class="display-card" :style="{top: offset+'px'}">
<el-row>
<span v-if="countTime" class="display-score">{{ $t('display.screen.trialTime') }} {{ countTime }}</span>
</el-row>
</div>
</div>
</template>
<script>
import { getGoodsTryUse } from '@/api/management/goods';
import { PermissionType } from '@/scripts/ConstDic';
import { getCountTime } from '@/utils/index';
import { runDiagramIsStart, runDiagramGetTime, runDiagramStart } from '@/api/simulation';
import { timeFormat } from '@/utils/date';
export default {
name: 'MenuScreen',
props: {
group: {
type: String,
required: true
},
offset: {
type: Number,
required: true
}
},
data() {
return {
tryTime: 0, //
timeNow: 0, //
time: null, //
countTime: 0, //
remainingTime: 0,
goodsId: this.$route.query.goodsId,
try: this.$route.query.try, //
training: {
id: '',
name: '',
remarks: ''
}
};
},
watch: {
'$store.state.training.subscribeCount': function () {
this.group && this.initLoadPage();
}
},
beforeDestroy() {
if (this.time) {
this.setTryTime();
clearTimeout(this.time);
}
},
methods: {
async initLoadPage() {
try {
if (this.try != '0') {
const data = {
permissionType: PermissionType.SCREEN
};
const resr = await getGoodsTryUse(data);
if (resr && resr.code == 200) {
this.remainingTime = resr.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);
}
} else {
this.$messageBox(this.$t('display.screen.getTimeFail'));
}
}
const initTime = this.$route.query.initTime;
const retp = '';//await runDiagramIsStart(this.group);
if (retp && !retp.data) {
await runDiagramStart({ initTime: initTime }, this.group);
}
await this.$store.dispatch('training/simulationStart');
await this.loadSystemTime();
} catch (error) {
console.log(error);
}
},
async loadSystemTime() {
// const rest = await runDiagramGetTime(this.group);
// if (rest && rest.code == 200) {
// this.$store.dispatch('training/setInitTime', +new Date(`${new Date().getFullYear()} ${timeFormat(rest.data)}`));
// }
},
setTryTime() {
if (this.try) {
this.$emit('tryTime', { time: this.tryTime, goodsId: this.goodsId });
}
},
back() {
this.$store.dispatch('training/over').then(() => {
Notification.closeAll();
history.go(-1);
// exitFullscreen();
});
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.display-card {
z-index: 9;
display: inline;
position: absolute;
top: 17px;
left: 30px;
}
.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>

View File

@ -0,0 +1,183 @@
<template>
<div>
<div class="display-draft">
<!-- <el-button-group>
<el-button type="primary" @click="saveScenesStage" v-if="isSaveStage">保存背景</el-button>
<el-button type="success" @click="saveScenesData" v-else>保存数据</el-button>
<el-button type="danger" @click="dumpScenesData">重置剧本</el-button>
</el-button-group> -->
<el-button-group>
<el-button type="success" :disabled="isDisable" @click="selectBeginTime">{{ $t('scriptRecord.drivingByPlan') }}</el-button>
<!-- <el-button type="danger" :disabled="!isDisable" @click="end">退出计划</el-button> -->
<el-button type="primary" @click="back">{{ $t('scriptRecord.scriptBack') }}</el-button>
</el-button-group>
</div>
<set-time ref="setTime" @ConfirmSelectBeginTime="start" />
</div>
</template>
<!-- 单人仿真 -->
<script>
import SetTime from './demon/setTime';
import { Notification } from 'element-ui';
import { runDiagramStart, runDiagramOver, runDiagramGetTime } from '@/api/simulation';
import { runDiagramIsStart } from '@/api/simulation';
import { timeFormat } from '@/utils/date';
import { EventBus } from '@/scripts/event-bus';
export default {
name: 'MenuTask',
components: {
SetTime
},
props: {
group: {
type: String,
required: true
},
offset: {
type: Number,
required: true
}
},
data() {
return {
isDisable: false,
tryTime: 0, //
timeNow: 0, //
time: null, //
countTime: 0, //
remainingTime: 0,
goodsId: this.$route.query.goodsId,
// isSaveStage: true,
training: {
id: '',
name: '',
remarks: ''
}
};
},
computed: {
scriptId() {
return this.$route.query.scriptId;
}
},
watch: {
'$store.state.training.subscribeCount': function () {
this.group && this.initLoadPage();
}
},
beforeDestroy() {
if (this.time) {
this.setTryTime();
clearTimeout(this.time);
}
},
methods: {
async initLoadPage() {
try {
const resp = '';//await runDiagramIsStart(this.group);
if (resp && resp.data) {
this.isDisable = true;
this.$store.dispatch('training/simulationStart');
} else {
this.isDisable = false;
this.$store.dispatch('training/over');
}
await this.loadSystemTime();
} catch (error) {
console.log(error);
}
},
selectBeginTime() {
this.$refs.setTime.doShow();
},
resetBeginTime() {
this.isDisable = false;
},
start(model) {
this.isDisable = true;
runDiagramStart(model, this.group).then(res => {
this.$store.dispatch('training/simulationStart').then(() => {
this.$store.dispatch('training/setInitTime', +new Date(`${new Date().getFullYear()} ${model.initTime}`));
});
}).catch(() => {
this.isDisable = false;
this.$messageBox('开始仿真失败,请返回重试');
});
},
end() {
this.isDisable = false;
runDiagramOver(this.group).then(() => {
this.$store.dispatch('training/over').then(() => {
this.$store.dispatch('training/setMapDefaultState').then(() => {
this.$store.dispatch('map/clearJlmapTrainView');
this.$store.dispatch('map/setTrainWindowShow', false);
});
});
}).catch(() => {
this.isDisable = true;
this.$messageBox('结束仿真失败,请返回');
});
},
setTryTime() {
if (this.try) {
this.$emit('tryTime', { time: this.tryTime, goodsId: this.goodsId });
}
},
back() {
this.$store.dispatch('training/over').then(() => {
EventBus.$emit('runPlanStop');
EventBus.$emit('chatSubscribeStop');
history.go(-1);
Notification.closeAll();
});
},
async loadSystemTime() {
// const rest = await runDiagramGetTime(this.group);
// if (rest && rest.code == 200) {
// this.$store.dispatch('training/setInitTime', +new Date(`${new Date().getFullYear()} ${timeFormat(rest.data)}`));
// }
}
}
};
</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>

View File

@ -0,0 +1,85 @@
<template>
<div v-if="isShowSystemTime" class="display-card" :style="{top: offset+'px', right: right+'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"
/>
</template>
</div>
</template>
<script>
import { prefixIntrger } from '@/utils/date';
import SystemTime from '@/views/components/systemTime/index';
//
export default {
name: 'MenuSystemTime',
components: {
SystemTime
},
props: {
offset: {
type: Number,
required: true
},
right: {
type: Number,
required: true
}
},
data() {
return {
time: '00:0000'
};
},
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;
},
pause() {
return this.$store.state.scriptRecord.simulationPause;
}
},
watch: {
'$store.state.training.initTime': function (initTime) {
const date = new Date(initTime);
this.time = `${prefixIntrger(date.getHours(), 2)}:${prefixIntrger(date.getMinutes(), 2)}${prefixIntrger(date.getSeconds(), 2)}`;
}
}
};
</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;
box-shadow: 0px 0px 5px #eee;
border-radius: 3px;
}
.display-card .el-row {
line-height: 32px !important;
}
</style>

View File

@ -0,0 +1,423 @@
<template>
<div v-drag class="reminder-drag">
<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 ref="dragBody" class="tip-body-box">
<div v-show="detailShow" class="tip-body">
<el-scrollbar wrap-class="scrollbar-wrapper">
<el-tree
ref="treeQuestion"
:data="trainingList"
node-key="id"
highlight-current
@node-click="getTrainDetail"
>
<span slot-scope="{ node, 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>
</template>
<script>
import { mapGetters } from 'vuex';
import { timeFormat } from '@/utils/date';
import { refreshExamList } from '@/api/management/userexam';
import { getTrainingDetail } from '@/api/jmap/training';
import { launchFullscreen } from '@/utils/screen';
export default {
name: 'TipExamList',
components: {
},
data() {
return {
training: {
id: '',
name: '',
remarks: ''
},
isShrink: false,
examName: '',
courseModel: {
id: '',
name: '',
maxDuration: '',
minDuration: '',
remarks: '',
updateTime: ''
},
detailShow: false,
examIndex: 0,
scanInter: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;
}
},
watch: {
'$store.state.map.mapViewLoadedCount': function() {
this.$store.dispatch('exam/stopCountTime');
this.loadInitData();
this.$store.dispatch('exam/countUsedTime');
}
},
beforeDestroy() {
this.clearScanCommit();
},
methods: {
backList() {
this.detailShow = true;
this.$nextTick(() => {
this.$refs.treeQuestion.setCurrentKey(this.$route.query.examQuestionId); // value node-key
});
},
//
selectedTraining(obj) {
this.trainingList.forEach((item, index) => {
if (item.id == obj.id) {
this.examIndex = index;
return;
}
});
if (obj) {
getTrainingDetail(obj.trainingId).then(res => {
this.courseModel = {
id: res.data.id,
name: res.data.name,
maxDuration: res.data.maxDuration,
remarks: res.data.remarks,
minDuration: res.data.minDuration,
updateTime: res.data.updateTime
};
this.$store.dispatch('exam/setCenter ', res.data.locateDeviceCode);
}).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);
this.scanCommit();
}).catch(error => {
// 50009y
if (error.code === 500009) {
this.$router.replace({ path: `/trainingPlatform/result/${this.$route.params.userExamId}`, query: { subSystem: this.$route.query.subSystem } });
} else {
this.$messageBox(this.$t('display.exam.refreshListError'));
}
});
this.shrink();
},
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
};
this.$router.replace({ path: '/display/exam', query: query });
this.$emit('refresh');
launchFullscreen();
},
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');
this.$router.replace({ path: `/trainingPlatform/result/${this.$route.query.userExamId}`, query: {subSystem: this.$route.query.subSystem} });
});
},
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;
}
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.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: 10;
font-size: 18px;
.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: 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: 366px;
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>

View File

@ -0,0 +1,272 @@
<template>
<!-- v-drag 拖拽 调整宽高 -->
<div v-quickMenuDrag class="reminder-drag">
<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 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"> {{ $t('display.training.trainingInstructions') }}</span>
<span class="list-elem">{{ 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>
</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;
}
}
},
data() {
return {
training: {
id: '',
name: '',
remarks: ''
},
isShrink: false,
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);
});
}
this.shrink();
},
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.$refs.drapBox.style.height = height + 'px';
this.$refs.drapBox.style.top = top;
this.isShrink = true;
}
}
}
};
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.tip-body-box {
position: relative;
height: 260px;
}
.reminder-drag{
position: relative;
}
.reminder-box {
position: absolute;
float: left;
left: 15px;
bottom: 15px;
width: 500px;
height: 300px;
background-color: #fff;
border-radius: 5px;
overflow: hidden;
z-index: 10;
font-size: 18px;
.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: 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: 366px;
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>

View File

@ -278,7 +278,6 @@ export default {
if (lsection.points[lsection.points.length - 1].x === rsection.points[0].x && lsection.points[lsection.points.length - 1].y === rsection.points[0].y) {
this.handleRealLocationRelationships(model, rsection, lsection);
console.log(model, '==============');
models.push(model);
const associatedSectionList = this.handleMergeSectionAssociated(model);
models = [...models, ...associatedSectionList];