Merge branch 'test_dispaly' of https://git.code.tencent.com/lian-cbtc/jl-client into test_dispaly
This commit is contained in:
joylink_cuiweidong
commit
45243e1968
@ -434,7 +434,6 @@ export default {
|
||||
{ label: '联系方式', name: 'contectUs', click: this.contectUs, isShow: true },
|
||||
{ label: '成员管理', name: 'memberManage', click: this.memberManage, isShow: true },
|
||||
{ label: '实训', name: 'trainingPane', click: this.trainingPane, isShow: true },
|
||||
{ label: '实训设计', name: 'trainingDesign', click: this.trainingDesign, isShow: true },
|
||||
{ label: '切换客流数据', name: 'changeFlowData', click: this.changeFlowData, isShow: true },
|
||||
// { label: '权限分发', name: 'distribute', click: this.distribute, isShow: true },
|
||||
{
|
||||
@ -957,9 +956,6 @@ export default {
|
||||
trainingPane() {
|
||||
this.$refs.trainingList.doShow();
|
||||
},
|
||||
trainingDesign() {
|
||||
this.$refs.trainingDesign.doShow();
|
||||
},
|
||||
changeFlowData() {
|
||||
this.hideMenuList();
|
||||
this.$refs.flowData.doShow();
|
||||
|
||||
@ -168,7 +168,7 @@ export default {
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.$refs.dataform.resetForm();
|
||||
this.$refs.dataform && this.$refs.dataform.resetForm();
|
||||
this.dialogVisible = false;
|
||||
}
|
||||
}
|
||||
|
||||
472
src/views/trainingManage/designIndex.vue
Normal file
472
src/views/trainingManage/designIndex.vue
Normal file
@ -0,0 +1,472 @@
|
||||
<template>
|
||||
<div class="editContent" :class="{'active': dialogVisible}">
|
||||
<div class="editContentTab">
|
||||
<div v-if="tabVisible" class="editContentTabLable" @click="minisize">
|
||||
<span class="titleStyle">实训设计</span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-show="showList">
|
||||
<List ref="list" v-on="$listeners" @updateDetails="updateDetails" />
|
||||
</div>
|
||||
<div v-show="!showList" class="editContentBox">
|
||||
<div class="editContentTitle">
|
||||
<div>
|
||||
<span>实训名称：{{ editData.name || '' }}</span>
|
||||
</div>
|
||||
<div>
|
||||
<el-button size="small" type="success" @click="gradeRules">评分</el-button>
|
||||
<el-button size="small" type="primary" @click="previewTraining">预览</el-button>
|
||||
<el-button size="small" type="primary" @click="publishTraining">发布</el-button>
|
||||
<el-button size="small" type="danger" @click="clearStep">清空步骤</el-button>
|
||||
<el-button size="small" type="primary" @click="showList = true">返回列表</el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-tabs v-model="activeName" type="card">
|
||||
<el-tab-pane label="步骤列表" name="stepList">
|
||||
<div class="tabPaneBox">
|
||||
<div class="tabPaneHead">
|
||||
<el-button size="small" type="primary" @click="addStep">新增步骤</el-button>
|
||||
</div>
|
||||
<el-table
|
||||
:data="tableData"
|
||||
:max-height="tableHeight"
|
||||
border
|
||||
>
|
||||
<el-table-column type="index" label="序号" width="50" />
|
||||
<el-table-column :label="$t('trainingManage.roleSelect')" width="200">
|
||||
<template slot-scope="scope">
|
||||
<el-select v-model="scope.row.memberId" placeholder="请选择" size="mini">
|
||||
<el-option
|
||||
v-for="item in roleList"
|
||||
:key="item.id"
|
||||
:label="item.label"
|
||||
:value="item.id"
|
||||
/>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('trainingManage.stepDescription')">
|
||||
<template slot-scope="scope">
|
||||
<el-input v-model="scope.row.description" placeholder="请输入步骤描述" size="mini" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('trainingManage.triggerCondition')">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getConditionName(scope.row, 'triggerCondition') }}</span>
|
||||
<el-button style="margin-left: 10px" size="mini" @click="handleCondition(scope.$index, scope.row, 'triggerCondition')">{{ $t('global.edit') }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('trainingManage.completionCondition')">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getConditionName(scope.row, 'completionCondition') }}</span>
|
||||
<el-button style="margin-left: 10px" size="mini" @click="handleCondition(scope.$index, scope.row, 'completionCondition')">{{ $t('global.edit') }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('trainingManage.operateCondition')">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ getConditionName(scope.row, 'operateCondition') }}</span>
|
||||
<el-button style="margin-left: 10px" size="mini" @click="handleEditOperate(scope.$index, scope.row)">{{ $t('global.edit') }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column :label="$t('global.operate')" width="90">
|
||||
<template slot-scope="scope">
|
||||
<el-button size="mini" type="danger" @click="handleDelete(scope.$index, scope.row)">{{ $t('global.delete') }}</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="tabPaneFooter">
|
||||
<el-button size="small" type="success" @click="saveStepData">{{ $t('trainingManage.saveStepData') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="地图定位" name="mapLocation">
|
||||
<div class="tabPaneBox">
|
||||
<div>
|
||||
<el-form ref="form" :model="mapLocationObj" label-width="80px">
|
||||
<el-form-item label="X坐标">
|
||||
<span>{{ mapLocationObj.x || '' }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="Y坐标">
|
||||
<span>{{ mapLocationObj.y || '' }}</span>
|
||||
</el-form-item>
|
||||
<el-form-item label="缩放">
|
||||
<span>{{ mapLocationObj.scale || '' }}</span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="tabPaneFooter">
|
||||
<el-button size="small" type="primary" @click="updateMapLocation">{{ $t('trainingManage.mapLocation') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="背景" name="Background">
|
||||
<div class="tabPaneBox">
|
||||
<div>
|
||||
<el-form ref="form" :model="bgSceneObj" label-width="80px">
|
||||
<el-form-item label="更新时间">
|
||||
<span>{{ bgSceneObj.systemTime || '' }}</span>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="tabPaneFooter">
|
||||
<el-button size="small" type="primary" @click="saveScenesStage">{{ $t('trainingManage.saveBackground') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { updateTrainingStep, getTrainingAll, updateTrainingBackgroud, getTrainingStepList, updateTrainingMaplocation, clearTrainingStep } from '@/api/trainingManage';
|
||||
import { assignUsersPlayRoles } from '@/api/jointSimulation';
|
||||
import Vue from 'vue';
|
||||
import {covertMemberData} from '@/views/newMap/displayNew/utils';
|
||||
import List from './list';
|
||||
import { getLocalStorage } from '@/utils/auth';
|
||||
|
||||
export default {
|
||||
name: 'DesignIndex',
|
||||
components:{
|
||||
List
|
||||
},
|
||||
props: {
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
editData: {},
|
||||
showList: true,
|
||||
dialogWidth: '1100px',
|
||||
tabVisible: false,
|
||||
dialogVisible: false,
|
||||
roleList: [],
|
||||
tableData: [],
|
||||
activeName: 'stepList',
|
||||
mapLocationObj: {},
|
||||
bgSceneObj: {}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
tableHeight() {
|
||||
const s = 210;
|
||||
const h = this.$store.state.app.height;
|
||||
return h - s;
|
||||
},
|
||||
group() {
|
||||
return this.$route.query.group;
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
'$store.state.training.memberList': function (val) {
|
||||
if (val && val.length) {
|
||||
const memberData = this.$store.state.training.memberData;
|
||||
let activeTrainList = [];
|
||||
if (this.$store.state.training.started) {
|
||||
activeTrainList = this.$store.state.map.activeTrainList;
|
||||
}
|
||||
// 获取仿真成员列表
|
||||
const result = covertMemberData(activeTrainList, Object.values(memberData));
|
||||
let list = [];
|
||||
result.deviceListData.forEach(item => {
|
||||
list = list.concat(item);
|
||||
});
|
||||
this.roleList = list;
|
||||
}
|
||||
},
|
||||
editData() {
|
||||
this.mapLocationObj = {};
|
||||
if (this.editData['mapLocationJson']) {
|
||||
this.mapLocationObj = JSON.parse(this.editData['mapLocationJson']);
|
||||
}
|
||||
this.bgSceneObj = {};
|
||||
if (this.editData['bgSceneJson']) {
|
||||
this.bgSceneObj = JSON.parse(this.editData['bgSceneJson']);
|
||||
}
|
||||
},
|
||||
'$store.state.map.activeTrainListChange': function () {
|
||||
const activeTrainList = this.$store.state.map.activeTrainList;
|
||||
const memberData = this.$store.state.training.memberData;
|
||||
// 获取仿真成员列表
|
||||
const result = covertMemberData(activeTrainList, Object.values(memberData));
|
||||
let list = [];
|
||||
result.deviceListData.forEach(item => {
|
||||
list = list.concat(item);
|
||||
});
|
||||
this.roleList = list;
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getTabShow();
|
||||
},
|
||||
methods: {
|
||||
getTabShow() {
|
||||
let domConfig = getLocalStorage('domConfig') || `{}`;
|
||||
domConfig = JSON.parse(domConfig);
|
||||
this.tabVisible = domConfig.trainingDesign || false;
|
||||
},
|
||||
updateDetails(data) {
|
||||
this.editData = data;
|
||||
this.$emit('closeAllDialog', 'editDetails');
|
||||
this.getStepList(data);
|
||||
this.showList = false;
|
||||
},
|
||||
publishTraining() {
|
||||
console.log('发布实训');
|
||||
// this.$emit('publish', this.editData);
|
||||
this.$refs.list.publishScript(null, this.editData);
|
||||
},
|
||||
previewTraining() {
|
||||
console.log('预览实训');
|
||||
// this.$emit('preview', this.editData);
|
||||
this.$refs.list.previewScript(null, this.editData);
|
||||
},
|
||||
clearStep() {
|
||||
this.$confirm('确定清空实训步骤?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
clearTrainingStep(this.editData.id).then(res => {
|
||||
console.log(res, '清空步骤');
|
||||
this.getStepList(this.editData);
|
||||
}).cathc(err => {
|
||||
console.log(err, '清空步骤失败');
|
||||
});
|
||||
}).catch(e => {});
|
||||
},
|
||||
editConditionFn(data, index, key) {
|
||||
this.tableData[index][key] = data;
|
||||
this.dialogVisible = true;
|
||||
},
|
||||
getRoleSelect(v) {
|
||||
let name = '';
|
||||
const colObj = this.roleList.find(item => {
|
||||
return item.value == v;
|
||||
});
|
||||
if (colObj) {
|
||||
name = colObj.label;
|
||||
}
|
||||
return name;
|
||||
},
|
||||
getConditionName(row, key) {
|
||||
const obj = row[key] || {};
|
||||
let n = '';
|
||||
switch (obj.t) {
|
||||
case 'V':
|
||||
n = `值为${obj.v}`;
|
||||
break;
|
||||
case 'S':
|
||||
n = `${obj.elementCode}设备的${obj.filedName}属性`;
|
||||
break;
|
||||
case 'E':
|
||||
n = '';
|
||||
break;
|
||||
}
|
||||
return n;
|
||||
},
|
||||
addStep() {
|
||||
const lastIndex = this.tableData.length - 1;
|
||||
let mId = '';
|
||||
if (this.tableData[lastIndex]) {
|
||||
mId = this.tableData[lastIndex].memberId || '';
|
||||
}
|
||||
const obj = {
|
||||
memberId: mId,
|
||||
description: ''
|
||||
};
|
||||
this.tableData.push(obj);
|
||||
},
|
||||
setOperations(data) {
|
||||
if (data) {
|
||||
this.tableData[data.index].operations = data.stepDetail.operations;
|
||||
this.tableData[data.index].tipPosition = data.tipPosition;
|
||||
}
|
||||
},
|
||||
gradeRules() {
|
||||
this.$emit('gradeRules', this.editData);
|
||||
},
|
||||
handleDelete(index, row) {
|
||||
console.log('删除', index, row);
|
||||
this.$confirm('确定删除该条步骤数据?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
this.tableData.splice(index, 1);
|
||||
}).catch(e => {});
|
||||
},
|
||||
handleCondition(index, row, key) {
|
||||
console.log(key, '条件', index, row);
|
||||
const member = this.$store.state.training.memberData[row.memberId];
|
||||
if (!member.userId) {
|
||||
assignUsersPlayRoles([{ userId: this.$store.state.user.id, memberId: member.id}], this.$route.query.group).then(resp => {
|
||||
}).catch(() => { this.$message.error('调整角色失败！'); });
|
||||
}
|
||||
this.$emit('handleCondition', index, row, key);
|
||||
this.doClose();
|
||||
},
|
||||
handleEditOperate(index, row) {
|
||||
if (!row.memberId) {
|
||||
this.$message.info('请先选择角色！');
|
||||
return;
|
||||
}
|
||||
const member = this.$store.state.training.memberData[row.memberId];
|
||||
if (!member.userId) {
|
||||
assignUsersPlayRoles([{ userId: this.$store.state.user.id, memberId: member.id}], this.$route.query.group).then(resp => {
|
||||
}).catch(() => { this.$message.error('调整角色失败！'); });
|
||||
}
|
||||
this.$emit('openEditOperate', { index: index, data: row, type: this.editData.type });
|
||||
this.doClose();
|
||||
},
|
||||
minisize() {
|
||||
this.dialogVisible = !this.dialogVisible;
|
||||
},
|
||||
backStep() {
|
||||
this.dialogVisible = true;
|
||||
this.activeName = 'stepList';
|
||||
},
|
||||
doShow(data) {
|
||||
// this.getStepList(data);
|
||||
this.dialogVisible = true;
|
||||
this.tabVisible = true;
|
||||
},
|
||||
saveStepData() {
|
||||
const list = [];
|
||||
this.tableData.forEach((item, index) => {
|
||||
const obj = {
|
||||
...item
|
||||
// id: index + 1 + ''
|
||||
};
|
||||
delete obj.isEdit;
|
||||
list.push(obj);
|
||||
});
|
||||
updateTrainingStep(this.group, this.editData.id, list).then(res => {
|
||||
console.log('保存步骤成功！', res);
|
||||
this.$message.success('保存步骤成功！');
|
||||
// this.doClose();
|
||||
this.getStepList(this.editData);
|
||||
}).catch(err => {
|
||||
console.log('保存步骤失败', err);
|
||||
this.$message.error('保存步骤失败');
|
||||
});
|
||||
},
|
||||
doClose() {
|
||||
this.dialogVisible = false;
|
||||
},
|
||||
getStepList(data) { // 获取步骤
|
||||
getTrainingStepList(data.id).then(res => {
|
||||
console.log(res, '获取步骤成功');
|
||||
this.tableData = res.data;
|
||||
}).catch(err => {
|
||||
console.log(err, '获取步骤失败');
|
||||
this.tableData = [];
|
||||
});
|
||||
},
|
||||
getTrainingAllInfo(id) {
|
||||
return new Promise((resolve, reject) => {
|
||||
getTrainingAll(id).then(res => {
|
||||
console.log(res, '获取详细信息成功');
|
||||
const data = {
|
||||
...res.data
|
||||
};
|
||||
const objArr = ['bgSceneJson', 'mapLocationJson'];
|
||||
objArr.forEach(key => {
|
||||
data[key] = res.data[key] ? JSON.parse(res.data[key]) : {};
|
||||
});
|
||||
const arr = ['labelJson', 'memberJson', 'playerIdJson', 'stepJson'];
|
||||
arr.forEach(key => {
|
||||
data[key] = res.data[key] ? JSON.parse(res.data[key]) : [];
|
||||
});
|
||||
resolve(data);
|
||||
}).catch(err => {
|
||||
console.log(err, '获取详细信息失败');
|
||||
reject(err);
|
||||
});
|
||||
});
|
||||
},
|
||||
updateMapLocation() {
|
||||
const data = Vue.prototype.$jlmap.$options;
|
||||
const params = {scale: data.scaleRate, x: data.offsetX, y: data.offsetY};
|
||||
updateTrainingMaplocation({id: this.editData.id, mapLocationJson: JSON.stringify(params)}).then(res => {
|
||||
console.log('保存地图定位成功！', res);
|
||||
this.$message.success('保存地图定位成功！');
|
||||
this.mapLocationObj = params;
|
||||
}).catch(err => {
|
||||
console.log('保存地图定位失败', err);
|
||||
this.$message.error('保存地图定位失败');
|
||||
});
|
||||
},
|
||||
saveScenesStage() {
|
||||
updateTrainingBackgroud({id: this.editData.id, groupId: this.group}).then(res => {
|
||||
console.log('保存背景', res);
|
||||
this.$message.success('保存背景成功！');
|
||||
this.getTrainingAllInfo(this.editData.id).then(suc => {
|
||||
this.bgSceneObj = suc.bgSceneJson;
|
||||
}).catch(() => {
|
||||
this.bgSceneObj = {};
|
||||
});
|
||||
}).catch(err => {
|
||||
console.log('保存背景失败', err);
|
||||
this.$message.error('保存背景失败');
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.editContent {
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
// height: 100%;
|
||||
width: 800px;
|
||||
transform: translateX(800px);
|
||||
transition: all 0.4s;
|
||||
z-index: 35;
|
||||
background: #fff;
|
||||
&.active{
|
||||
transform: translateX(0px);
|
||||
}
|
||||
}
|
||||
.editContentBox {
|
||||
padding: 20px;
|
||||
}
|
||||
.editContentTab{
|
||||
position: absolute;
|
||||
z-index: 10;
|
||||
left: -12px;
|
||||
// top: calc(45% + 200px);
|
||||
top: 200px;
|
||||
}
|
||||
.editContentTabLable{
|
||||
position: absolute;
|
||||
background: #fff;
|
||||
border-radius: 5px 0px 0px 5px ;
|
||||
padding: 5px 0px;
|
||||
width: 24px;
|
||||
text-align: center;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
cursor: pointer;
|
||||
top: 0px;
|
||||
}
|
||||
.tabPaneBox {
|
||||
padding: 0 20px;
|
||||
.tabPaneHead, .tabPaneFooter {
|
||||
padding: 10px 0;
|
||||
}
|
||||
.tabPaneFooter {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
}
|
||||
.editContentTitle {
|
||||
height: 50px;
|
||||
// padding: 20px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
@ -1,28 +1,28 @@
|
||||
<template>
|
||||
<div class="main">
|
||||
<TrainingList ref="trainingList" @updateDetails="updateDetails" @gradeRules="gradeRules" @closeAllDialog="closeAllDialog" @draftTracK="draftTracK" />
|
||||
<EditDetails ref="editDetails" :edit-data="editData" @openEditOperate="openEditOperate" @handleCondition="handleCondition" @publish="publish" @preview="preview" @gradeRules="gradeRules" />
|
||||
<DesignIndex ref="designIndex" @create="create" @openEditOperate="openEditOperate" @handleCondition="handleCondition" @gradeRules="gradeRules" @draftTracK="draftTracK" @closeAllDialog="closeAllDialog" />
|
||||
<EditCondition ref="editCondition" v-dialogDrag :materials-list="materialsList" @editConditionFn="editConditionFn" @backStep="backStep" />
|
||||
<edit-operate ref="editOperate" v-dialogDrag @backStepList="backStepList" />
|
||||
<grade-rules ref="gradeRules" />
|
||||
<TrackList ref="trackList" />
|
||||
<Create ref="create" v-dialogDrag @edit="getListData" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import TrainingList from './trainingList.vue';
|
||||
import DesignIndex from './designIndex.vue';
|
||||
import TrackList from './trackList.vue';
|
||||
import EditDetails from './editDetails.vue';
|
||||
import EditCondition from './editCondition.vue';
|
||||
import EditOperate from './editOperate.vue';
|
||||
import GradeRules from './gradeRules.vue';
|
||||
import { getTrainingMaterials } from '@/api/trainingManage';
|
||||
import Create from './create.vue';
|
||||
|
||||
export default {
|
||||
name:'TrainingIndex',
|
||||
components:{
|
||||
TrainingList,
|
||||
DesignIndex,
|
||||
Create,
|
||||
TrackList,
|
||||
EditDetails,
|
||||
EditCondition,
|
||||
EditOperate,
|
||||
GradeRules
|
||||
@ -34,7 +34,7 @@ export default {
|
||||
hoverBtn: false,
|
||||
btnWidth: -600,
|
||||
materialsList: [],
|
||||
refsList: ['editDetails', 'editCondition', 'trackList'],
|
||||
refsList: ['create', 'editCondition', 'trackList'],
|
||||
editData: {}
|
||||
};
|
||||
},
|
||||
@ -53,6 +53,12 @@ export default {
|
||||
this.getMaterials();
|
||||
},
|
||||
methods:{
|
||||
create(data) {
|
||||
this.$refs.create.doShow(data);
|
||||
},
|
||||
getListData() {
|
||||
this.$refs.designIndex.$refs.list && this.$refs.designIndex.$refs.list.getListData();
|
||||
},
|
||||
publish(data) {
|
||||
this.$refs.trainingList.publishScript(null, data);
|
||||
},
|
||||
@ -60,10 +66,10 @@ export default {
|
||||
this.$refs.trainingList.previewScript(null, data);
|
||||
},
|
||||
editConditionFn(data, index, key) {
|
||||
this.$refs.editDetails.editConditionFn(data, index, key);
|
||||
this.$refs.designIndex.editConditionFn(data, index, key);
|
||||
},
|
||||
backStep() {
|
||||
this.$refs.editDetails.backStep();
|
||||
this.$refs.designIndex.backStep();
|
||||
},
|
||||
handleCondition(index, row, key) {
|
||||
this.$refs.editCondition.doShow(row, index, key);
|
||||
@ -82,11 +88,6 @@ export default {
|
||||
doShow() {
|
||||
this.$refs.trainingList.doShow();
|
||||
},
|
||||
updateDetails(data) {
|
||||
this.editData = data;
|
||||
this.closeAllDialog('editDetails');
|
||||
this.$refs.editDetails.doShow(data);
|
||||
},
|
||||
closeAllDialog(noCloseName) {
|
||||
this.refsList.forEach(key => {
|
||||
if (key != noCloseName && this.$refs[key]) {
|
||||
@ -98,8 +99,8 @@ export default {
|
||||
this.$refs.editOperate.doShow(data);
|
||||
},
|
||||
backStepList(data) {
|
||||
this.$refs.editDetails.setOperations(data);
|
||||
this.$refs.editDetails.minisize();
|
||||
this.$refs.designIndex.setOperations(data);
|
||||
this.$refs.designIndex.minisize();
|
||||
},
|
||||
gradeRules(data) {
|
||||
this.$refs.gradeRules.doShow(data);
|
||||
|
||||
329
src/views/trainingManage/list.vue
Normal file
329
src/views/trainingManage/list.vue
Normal file
@ -0,0 +1,329 @@
|
||||
<template>
|
||||
<div class="main">
|
||||
<div class="trainingHeader">
|
||||
<div class="trainingList">实训草稿列表</div>
|
||||
<div class="flexNull" />
|
||||
<el-button size="small" type="primary" class="createScript" @click="handleCreate">{{ $t('trainingManage.create') }}</el-button>
|
||||
</div>
|
||||
<QueryListPage ref="queryListPage" :card-padding="10" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getTrainingList, getTrainingAll } from '@/api/trainingManage';
|
||||
import { loadTrainingBg } from '@/api/jmap/training';
|
||||
import Cookies from 'js-cookie';
|
||||
import ConstConfig from '@/scripts/ConstConfig';
|
||||
import { loadDraftTraining } from '@/api/jmap/training';
|
||||
import { deleteTraining, publishTraining } from '@/api/trainingManage';
|
||||
import { OperateMode } from '@/scripts/ConstDic';
|
||||
|
||||
export default {
|
||||
name: 'List',
|
||||
components:{
|
||||
},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
// dialogVisible: false,
|
||||
pagerConfig: {
|
||||
pageSize: 'pageSize',
|
||||
pageIndex: 'pageNum'
|
||||
},
|
||||
training: {},
|
||||
queryForm: {
|
||||
labelWidth: '100px',
|
||||
reset: true,
|
||||
show:false
|
||||
},
|
||||
prdTypeMap: {
|
||||
DISPATCHER: '02',
|
||||
STATION_SUPERVISOR: '01',
|
||||
STATION_ASSISTANT: '01',
|
||||
DEPOT_DISPATCHER: '09',
|
||||
DRIVER: '04',
|
||||
RAIL_CTC: '10'
|
||||
},
|
||||
queryList: {
|
||||
height: 800,
|
||||
query: this.queryFunction,
|
||||
selectCheckShow: false,
|
||||
indexShow: true,
|
||||
columns: [
|
||||
{
|
||||
title: this.$t('trainingManage.name'),
|
||||
prop: 'name'
|
||||
},
|
||||
{
|
||||
title: this.$t('trainingManage.description'),
|
||||
prop: 'description'
|
||||
},
|
||||
{
|
||||
title: this.$t('trainingManage.type'),
|
||||
width: '70',
|
||||
prop: 'type',
|
||||
type: 'tag',
|
||||
columnValue: (row) => { return this.covertData(row); },
|
||||
tagType: (row) => { return ''; }
|
||||
},
|
||||
{
|
||||
title: this.$t('trainingManage.labelJson'),
|
||||
width: '200',
|
||||
prop: 'labelJson',
|
||||
type: 'tagMore',
|
||||
columnValue: (row) => { return this.labelJsonData(row); },
|
||||
tagType: (row) => { return ''; }
|
||||
},
|
||||
{
|
||||
type: 'button',
|
||||
title: this.$t('trainingManage.operate'),
|
||||
width: '500',
|
||||
buttons: [
|
||||
{
|
||||
name: this.$t('trainingManage.record'),
|
||||
handleClick: this.drawUp,
|
||||
type: 'success',
|
||||
showControl:(row) => { return row.id; }
|
||||
},
|
||||
{
|
||||
name: this.$t('trainingManage.modify'),
|
||||
handleClick: this.handleModify,
|
||||
type: 'primary',
|
||||
showControl:(row) => { return row.id; }
|
||||
},
|
||||
{
|
||||
name: this.$t('trainingManage.delete'),
|
||||
handleClick: this.deleteScript,
|
||||
type: 'danger',
|
||||
showControl:(row) => { return row.id; }
|
||||
},
|
||||
{
|
||||
name: this.$t('trainingManage.publish'),
|
||||
handleClick: this.publishScript,
|
||||
type: 'primary',
|
||||
showControl:(row) => { return row.id; }
|
||||
},
|
||||
{
|
||||
name: this.$t('trainingManage.preview'),
|
||||
handleClick: this.previewScript,
|
||||
type: 'primary',
|
||||
showControl:(row) => { return row.id; }
|
||||
},
|
||||
{
|
||||
name: this.$t('trainingManage.gradeRules'),
|
||||
handleClick: this.gradeRules,
|
||||
type: 'success',
|
||||
showControl:(row) => { return row.id; }
|
||||
},
|
||||
{
|
||||
name: this.$t('trainingManage.publishTrack'),
|
||||
handleClick: this.publishTrack,
|
||||
type: 'primary',
|
||||
showControl:(row) => { return row.id; }
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
group() {
|
||||
return this.$route.query.group;
|
||||
},
|
||||
mapId() {
|
||||
return this.$route.query.mapId;
|
||||
},
|
||||
teachMode() {
|
||||
return 'TEACHING_MODE';
|
||||
},
|
||||
trainingSwitch() {
|
||||
return this.$store.state.trainingNew.trainingSwitch;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
queryFunction(param) {
|
||||
const params = {
|
||||
...param,
|
||||
mapId: this.$route.query.mapId
|
||||
};
|
||||
return getTrainingList(params);
|
||||
},
|
||||
doShow() {
|
||||
this.getListData();
|
||||
// this.dialogVisible = true;
|
||||
},
|
||||
doClose() {
|
||||
// this.dialogVisible = false;
|
||||
},
|
||||
handleCreate() {
|
||||
// this.$refs.create.doShow(null);
|
||||
this.$emit('create', null);
|
||||
},
|
||||
covertData(row) {
|
||||
const releaseReview = ConstConfig.ConstSelect.trainingType;
|
||||
const lastData = Object.assign({}, row);
|
||||
if (Cookies.get('user_lang') == 'en') {
|
||||
releaseReview.forEach(function(element) {
|
||||
const rolename = element.value;
|
||||
if (lastData.type == rolename) {
|
||||
lastData.type = element.enlabel;
|
||||
}
|
||||
});
|
||||
} else {
|
||||
releaseReview.forEach(function(element) {
|
||||
const rolename = element.value;
|
||||
if (lastData.type == rolename) {
|
||||
lastData.type = element.label;
|
||||
}
|
||||
});
|
||||
}
|
||||
return lastData.type;
|
||||
},
|
||||
labelJsonData(row) {
|
||||
const sList = row.labelJson ? JSON.parse(row.labelJson) : [];
|
||||
const list = Object.prototype.toString.call(sList) === '[object Array]' ? sList : [sList];
|
||||
return list;
|
||||
},
|
||||
drawUp(index, row) {
|
||||
if (this.trainingSwitch) {
|
||||
this.$message.error('请先结束当前实训再编制！');
|
||||
return;
|
||||
}
|
||||
const qObj = {...this.$route.query};
|
||||
qObj.record = true;
|
||||
this.$router.replace({ query:{...qObj}});
|
||||
console.log('编辑', qObj, index, row);
|
||||
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); // 默认为正常模式
|
||||
getTrainingAll(row.id).then(resp => {
|
||||
this.$store.dispatch('trainingNew/setTrainingDetail', null);
|
||||
if (resp.data && resp.data.mapLocationJson) {
|
||||
const mapLocation = JSON.parse(resp.data.mapLocationJson);
|
||||
this.$jlmap.updateTransform(mapLocation.scale, {x:mapLocation.x, y:mapLocation.y});
|
||||
}
|
||||
this.$emit('updateDetails', resp.data);
|
||||
this.doClose();
|
||||
}).catch((e) => {
|
||||
console.error(e);
|
||||
this.$emit('updateDetails', {});
|
||||
this.$message.error('获取实训详情信息失败！');
|
||||
});
|
||||
loadTrainingBg(this.$route.query.group, row.id).then(resp => {
|
||||
console.log('加载草稿实训背景', resp);
|
||||
}).catch(() => {
|
||||
this.$message.error('加载草稿实训背景失败！');
|
||||
});
|
||||
},
|
||||
handleModify(index, row) {
|
||||
console.log('修改', index, row);
|
||||
if (!row.id) { return; }
|
||||
// this.$refs.create.doShow(row);
|
||||
this.$emit('create', row);
|
||||
},
|
||||
deleteScript(index, row) {
|
||||
console.log('删除', index, row);
|
||||
this.$confirm('确定删除该条实训数据?', '警告', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
}).then(() => {
|
||||
if (!row.id) { return; }
|
||||
deleteTraining([row.id]).then(res => {
|
||||
console.log('删除实训成功', res);
|
||||
this.getListData();
|
||||
}).catch(err => {
|
||||
console.log('删除实训失败', err);
|
||||
this.getListData();
|
||||
});
|
||||
}).catch(e => {});
|
||||
},
|
||||
publishScript(index, row) {
|
||||
console.log('发布', index, row);
|
||||
this.$prompt('请输入发布后名称', '提示',
|
||||
{
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
inputValue: row.name,
|
||||
inputErrorMessage: '输入不能为空',
|
||||
inputValidator: (value) => {
|
||||
if (!value) {
|
||||
return '输入不能为空';
|
||||
}
|
||||
}
|
||||
|
||||
}).then(suc => {
|
||||
if (!row.id || !suc.value) { return; }
|
||||
publishTraining({draftId: row.id, reName: suc.value}).then(res => {
|
||||
console.log('发布实训成功', res);
|
||||
this.$message.success('发布实训成功！');
|
||||
}).catch(err => {
|
||||
console.log('发布实训失败', err);
|
||||
this.$message.error(`发布实训失败！，${err.message}`);
|
||||
});
|
||||
});
|
||||
},
|
||||
async previewScript(index, data) {
|
||||
console.log('预览', index, data);
|
||||
if (this.trainingSwitch) {
|
||||
this.$message.error('请先结束当前实训后再加载新的实训！');
|
||||
return;
|
||||
}
|
||||
const qObj = {...this.$route.query};
|
||||
delete qObj.record;
|
||||
this.$router.replace({ query:{...qObj}});
|
||||
this.$store.dispatch('training/changeOperateMode', { mode: OperateMode.NORMAL }); // 默认为正常模式
|
||||
try {
|
||||
const detailResp = await getTrainingAll(data.id);
|
||||
this.training = detailResp.data;
|
||||
if (detailResp.data.mapLocationJson) {
|
||||
const mapLocation = JSON.parse(detailResp.data.mapLocationJson);
|
||||
this.$jlmap.updateTransform(mapLocation.scale, {x:mapLocation.x, y:mapLocation.y});
|
||||
}
|
||||
if (detailResp.data.playerIdJson) {
|
||||
const playerId = JSON.parse(detailResp.data.playerIdJson)[0];
|
||||
if (playerId) {
|
||||
const member = this.$store.state.training.memberData[playerId];
|
||||
this.$store.dispatch('training/setPrdType', this.prdTypeMap[member.type]);
|
||||
this.$store.dispatch('training/setRoles', member.type);
|
||||
}
|
||||
}
|
||||
this.$emit('closeAllDialog');
|
||||
this.$store.dispatch('trainingNew/setTrainingDetail', detailResp.data);
|
||||
this.$store.dispatch('trainingNew/setTrainingScore', '');
|
||||
await loadDraftTraining(this.group, data.id, {mode: this.teachMode});
|
||||
this.$message.success('加载实训成功！');
|
||||
} catch (e) {
|
||||
console.error('ceshi', e);
|
||||
this.$message.error(`加载实训失败！，${e.message}`);
|
||||
}
|
||||
},
|
||||
// 打分
|
||||
gradeRules(index, row) {
|
||||
this.doClose();
|
||||
this.$emit('gradeRules', row);
|
||||
// this.$refs.gradeRules.doShow();
|
||||
},
|
||||
publishTrack(index, row) {
|
||||
this.$emit('draftTracK', row);
|
||||
},
|
||||
getListData() {
|
||||
this.$refs.queryListPage && this.$refs.queryListPage.commitQuery();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.main {
|
||||
padding: 20px;
|
||||
}
|
||||
.trainingHeader {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 10px 5px;
|
||||
.flexNull {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@ -27,7 +27,7 @@ import { superAdmin, admin } from '@/router/index';
|
||||
import selectRole from './selectRole/list';
|
||||
import { launchFullscreen } from '@/utils/screen';
|
||||
import { createSimulation } from '@/api/simulation';
|
||||
import { getSessionStorage } from '@/utils/auth';
|
||||
import { getSessionStorage, setLocalStorage } from '@/utils/auth';
|
||||
|
||||
export default {
|
||||
name: 'Simulation',
|
||||
@ -217,6 +217,7 @@ export default {
|
||||
},
|
||||
enterSimulation(system) {
|
||||
const data = {...system.paramVO, mapId: system.mapId};
|
||||
setLocalStorage('domConfig', JSON.stringify(system.paramVO.domConfig || {}));
|
||||
createSimulation(data).then(resp => {
|
||||
const query = { lineCode: this.$route.query.lineCode, group: resp.data, mapId: system.mapId, project: this.project};
|
||||
if (this.loadingProjectList.includes(this.project)) {
|
||||
|
||||
Loading…
Reference in New Issue
Block a user