From 6fb8812039731a7705de42e2df1951f4a47b942c Mon Sep 17 00:00:00 2001
From: dong <58670809@qq.com>
Date: Tue, 1 Nov 2022 17:45:36 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AE=9E=E8=AE=AD=E8=AE=BE=E8=AE=A1=E8=B0=83?=
 =?UTF-8?q?=E6=95=B4?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/newMap/display/simulationMenu.vue |   4 -
 src/views/trainingManage/create.vue         |   2 +-
 src/views/trainingManage/designIndex.vue    | 472 ++++++++++++++++++++
 src/views/trainingManage/index.vue          |  33 +-
 src/views/trainingManage/list.vue           | 329 ++++++++++++++
 src/views/trainingPlatform/simulation.vue   |   3 +-
 6 files changed, 821 insertions(+), 22 deletions(-)
 create mode 100644 src/views/trainingManage/designIndex.vue
 create mode 100644 src/views/trainingManage/list.vue

diff --git a/src/views/newMap/display/simulationMenu.vue b/src/views/newMap/display/simulationMenu.vue
index 49f8c8992..8b2e41b54 100644
--- a/src/views/newMap/display/simulationMenu.vue
+++ b/src/views/newMap/display/simulationMenu.vue
@@ -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();
diff --git a/src/views/trainingManage/create.vue b/src/views/trainingManage/create.vue
index 5d0f7e5c8..4c1ad8cea 100644
--- a/src/views/trainingManage/create.vue
+++ b/src/views/trainingManage/create.vue
@@ -168,7 +168,7 @@ export default {
             });
         },
         doClose() {
-            this.$refs.dataform.resetForm();
+            this.$refs.dataform && this.$refs.dataform.resetForm();
             this.dialogVisible = false;
         }
     }
diff --git a/src/views/trainingManage/designIndex.vue b/src/views/trainingManage/designIndex.vue
new file mode 100644
index 000000000..0a7b1c11f
--- /dev/null
+++ b/src/views/trainingManage/designIndex.vue
@@ -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>
diff --git a/src/views/trainingManage/index.vue b/src/views/trainingManage/index.vue
index 4df2804d9..51367eec2 100644
--- a/src/views/trainingManage/index.vue
+++ b/src/views/trainingManage/index.vue
@@ -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);
diff --git a/src/views/trainingManage/list.vue b/src/views/trainingManage/list.vue
new file mode 100644
index 000000000..1f3adc54e
--- /dev/null
+++ b/src/views/trainingManage/list.vue
@@ -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>
diff --git a/src/views/trainingPlatform/simulation.vue b/src/views/trainingPlatform/simulation.vue
index 25fa8ad06..092f4c4f0 100644
--- a/src/views/trainingPlatform/simulation.vue
+++ b/src/views/trainingPlatform/simulation.vue
@@ -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)) {