新版地图包加载仿真
This commit is contained in:
parent
e5997a5856
commit
c7078dcdb9
@ -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'
|
||||
});
|
||||
}
|
||||
|
@ -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>
|
||||
|
@ -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(() => {
|
||||
|
@ -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);
|
||||
|
@ -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');
|
||||
|
@ -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 {
|
||||
|
@ -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);
|
||||
});
|
||||
});
|
||||
}
|
||||
|
@ -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() {
|
||||
|
209
src/views/newMap/displayNew/demon/addQuest.vue
Normal file
209
src/views/newMap/displayNew/demon/addQuest.vue
Normal 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>
|
161
src/views/newMap/displayNew/demon/faultChoose.vue
Normal file
161
src/views/newMap/displayNew/demon/faultChoose.vue
Normal 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>
|
66
src/views/newMap/displayNew/demon/runPlanLoad.vue
Normal file
66
src/views/newMap/displayNew/demon/runPlanLoad.vue
Normal 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>
|
362
src/views/newMap/displayNew/demon/runPlanView.vue
Normal file
362
src/views/newMap/displayNew/demon/runPlanView.vue
Normal 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>
|
371
src/views/newMap/displayNew/demon/scheduling.vue
Normal file
371
src/views/newMap/displayNew/demon/scheduling.vue
Normal 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>
|
118
src/views/newMap/displayNew/demon/setTime.vue
Normal file
118
src/views/newMap/displayNew/demon/setTime.vue
Normal 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>
|
637
src/views/newMap/displayNew/designIndex.vue
Normal file
637
src/views/newMap/displayNew/designIndex.vue
Normal 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>
|
@ -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}`);
|
269
src/views/newMap/displayNew/menuDemon.vue
Normal file
269
src/views/newMap/displayNew/menuDemon.vue
Normal 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>
|
292
src/views/newMap/displayNew/menuExam.vue
Normal file
292
src/views/newMap/displayNew/menuExam.vue
Normal 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 => {
|
||||
// 如果时50009则表示考试已完成,不能再次进行y
|
||||
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>
|
268
src/views/newMap/displayNew/menuLesson.vue
Normal file
268
src/views/newMap/displayNew/menuLesson.vue
Normal 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>
|
141
src/views/newMap/displayNew/menuPlan.vue
Normal file
141
src/views/newMap/displayNew/menuPlan.vue
Normal 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>
|
180
src/views/newMap/displayNew/menuReplay.vue
Normal file
180
src/views/newMap/displayNew/menuReplay.vue
Normal 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>
|
198
src/views/newMap/displayNew/menuSchema.vue
Normal file
198
src/views/newMap/displayNew/menuSchema.vue
Normal 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>
|
151
src/views/newMap/displayNew/menuScreen.vue
Normal file
151
src/views/newMap/displayNew/menuScreen.vue
Normal 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>
|
183
src/views/newMap/displayNew/menuScript.vue
Normal file
183
src/views/newMap/displayNew/menuScript.vue
Normal 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>
|
85
src/views/newMap/displayNew/menuSystemTime.vue
Normal file
85
src/views/newMap/displayNew/menuSystemTime.vue
Normal 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>
|
423
src/views/newMap/displayNew/tipExamList.vue
Normal file
423
src/views/newMap/displayNew/tipExamList.vue
Normal 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':''}"> {{ 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 => {
|
||||
// 如果时50009则表示考试已完成,不能再次进行y
|
||||
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>
|
272
src/views/newMap/displayNew/tipTrainingDetail.vue
Normal file
272
src/views/newMap/displayNew/tipTrainingDetail.vue
Normal 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>
|
@ -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];
|
||||
|
Loading…
Reference in New Issue
Block a user