实训列表调整

2022-12-06 17:28:22 +08:00 · 2022-12-06 17:28:22 +08:00 · e6f62a87d8
commit e6f62a87d8
parent e056455e5e
8 changed files with 216 additions and 203 deletions
--- a/src/api/jmap/training.js
+++ b/src/api/jmap/training.js
@ -198,18 +198,12 @@ export function getAllPublishTrainingList(params) {
        params
    });
 }
-/** 根据mapId查所有的已发布单操实训的基础信息 */
-export function getPublishSingleList(mapId) {
+/** 查询组织已发布实训的基础信息 */
+export function getPublishTrainingListInOrg(params) {
    return request({
-        url: `/api/v2/training/published/${mapId}/singles`,
-        method: 'get'
-    });
-}
-/** 根据mapId查所有的已发布场景实训的基础信息 */
-export function getPublishScenesList(mapId) {
-    return request({
-        url: `/api/v2/training/published/${mapId}/scenes`,
-        method: 'get'
+        url: `/api/v2/training/published/infos`,
+        method: 'get',
+        params
    });
 }
 /** 根据实训id查该已发布实训的所有信息 */
--- a/src/scripts/ConstDic.js
+++ b/src/scripts/ConstDic.js
@ -381,3 +381,33 @@ export const SimulationUserType = {
    TEACHER: 'TEACHER',
    STUDENT: 'STUDENT'
 };
+/** 客户端list */
+export const ClientList = [
+    { label: '中心ATS工作站', value: 'dispatchWork' },
+    { label: '中心ATS大屏', value: 'bigScreen' },
+    { label: '现地ATS工作站', value: 'localWork' },
+    { label: 'ISCS', value: 'iscsView' },
+    { label: 'IBP', value: 'ibp' },
+    { label: 'PSL', value: 'psl' },
+    { label: '列车驾驶', value: 'drivingPlan' },
+    { label: 'CCTV', value: 'cctvView' },
+    { label: '设备视图', value: 'jl3dModle' },
+    { label: '数字沙盘', value: 'digitalStand' },
+    { label: '车务终端', value: 'trafficTerminal' },
+    { label: '车务管理终端', value: 'trafficManageTerminal' },
+    { label: '调度命令', value: 'dispatchingCommand' },
+    { label: '调度计划', value: 'schedulingPlan' },
+    { label: '大客流策略', value: 'largePassengerStrategy' },
+    { label: '大客流视图', value: 'largePassengerView' },
+    { label: '行调台', value: 'dispatcherManage' },
+    { label: '派班工作站', value: 'scheduleWork' },
+    { label: '应急调度', value: 'emergency' },
+    { label: '运行图加载', value: 'diagramLoad' },
+    { label: '运行图预览', value: 'diagramPreview' },
+    { label: '运行图编制', value: 'diagramEdit' }
+];
+/** 实训类型list */
+export const TrainingTypeList = [
+    {label: '场景', value: 'SCENE'},
+    {label: '单操', value: 'SINGLE'}
+];
--- a/src/views/newMap/display/index.vue
+++ b/src/views/newMap/display/index.vue
@ -11,6 +11,7 @@
    <training-design v-if="trainingDesign" ref="trainingDesign" />
    <chat-box v-if="hasVoice" ref="chatBox" :group="group" />
    <design-training-menu v-if="trainingDesign && trainingDetail" ref="trainingMenu" :offset-bottom="offsetBottom" />
+    <training-left-slider ref="trainingLeftSlider" @overallTranslation="overallTranslation" />
  </div>
 </template>
 <script>
@ -29,6 +30,7 @@ import TrainingMenu from './trainingList/trainingMenu';
 import TrainingDesign from './trainingDesign/designPane.vue';
 import ChatBox from './chatBox';
 import DesignTrainingMenu from './trainingList/designTrainingMenu';
+import TrainingLeftSlider from './trainingList/trainingLeftSlider';
 export default {
    name: 'DisplayDraft',
    components: {
@ -40,7 +42,8 @@ export default {
        TrainingMenu,
        TrainingDesign,
        ChatBox,
-        DesignTrainingMenu
+        DesignTrainingMenu,
+        TrainingLeftSlider
    },
    data() {
        return {
@ -104,8 +107,13 @@ export default {
        } else {
            exitSimulation(this.group);
        }
+
    },
    methods:{
+        overallTranslation(flag) {
+            const panel = document.getElementById('leftSlider');
+            panel.style.transform = flag ? 'translateX(400px)' : '';
+        },
        // 缩放设置
        setWindowSize() {
            const width = this.width;
--- a/src/views/newMap/display/trainingList/trainingLeftSlider.vue
+++ b/src/views/newMap/display/trainingList/trainingLeftSlider.vue
@ -0,0 +1,146 @@
+<template>
+  <div id="leftSlider" class="left-slider">
+    <div class="tip-title">
+      <span>实训列表</span>
+    </div>
+    <div class="handleShow">
+      <span v-if="!show" class="el-icon-arrow-left" style="cursor:pointer" @click="handleSliderShow(false)" />
+    </div>
+    <div class="slider-tree">
+      <el-scrollbar wrap-class="scrollbar-wrapper" style="background: #fff;">
+        <template v-for="(training, index) in trainingList">
+          <div :key="training.id" class="training-name-box" :class="{'active': trainingDetail && trainingDetail.id === training.id}" @click="loadScript(training)">
+            <span>{{ `${index + 1}、${training.name}` }}</span>
+          </div>
+        </template>
+      </el-scrollbar>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getPublishTrainingListInOrg, getPublishTrainingDetail, loadPublishTraining } from '@/api/jmap/training';
+import { EventBus } from '@/scripts/event-bus';
+export default {
+    name: 'LeftSlider',
+    data() {
+        return {
+            show: true,
+            treeList: [],
+            defaultProps: '',
+            trainingList: ''
+        };
+    },
+    computed: {
+        mapId () {
+            return this.$route.query.mapId;
+        },
+        trainingDetail() {
+            console.log(this.$store.state.trainingNew.trainingDetail, '****');
+            return this.$store.state.trainingNew.trainingDetail;
+        },
+        group () {
+            return this.$route.query.group;
+        }
+    },
+    mounted() {
+        EventBus.$on('handleSliderShow', () => {
+            this.handleSliderShow(true);
+        });
+        this.initLoadPage();
+    },
+    methods: {
+        initLoadPage() {
+            getPublishTrainingListInOrg({mapId: this.mapId}).then(response => {
+                this.trainingList = response.data;
+            }).catch(error => {
+                this.$message.error(this.$t('tip.failedCourse') + ':' + error.message);
+            });
+        },
+        handleSliderShow(flag) {
+            this.$emit('overallTranslation', flag);
+            const slider = document.getElementById('leftSlider');
+            if (flag) {
+                slider.style.transform = 'translateX(0)';
+                this.show = false;
+            } else {
+                slider.style.transform = '';
+                this.show = true;
+            }
+        },
+        async loadScript(training) {
+            if (this.trainingSwitch) {
+                this.$message.error('请先结束当前实训后再加载新的实训！');
+                return;
+            }
+            try {
+                const detailResp = await getPublishTrainingDetail(training.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});
+                }
+                this.$store.dispatch('trainingNew/setTrainingDetail', detailResp.data);
+                await loadPublishTraining(this.group, training.id, {mode: ''});
+                this.$message.success('加载实训成功！');
+            } catch (e) {
+                this.$message.error('加载实训失败！');
+            }
+        }
+    }
+};
+</script>
+
+<style scoped>
+.left-slider{
+	z-index: 900;
+	width: 400px;
+	height: 100%;
+	position: absolute;
+	left: 0;
+	top: 0;
+	transform: translateX(-400px);
+}
+.training-name-box{
+	padding: 5px;
+	font-size: 16px;
+	color: green;
+	margin-left: 10px;
+	cursor: pointer;
+}
+.training-name-box :hover{
+	color: red;
+}
+.active {
+	color: red;
+}
+.slider-tree{
+	height: calc(100% - 40px);
+	border: 2px solid #409EFF;
+}
+.handleShow{
+	position: absolute;
+	left: 395px;
+	top: 50%;
+	background: #fff;
+	color: #000;
+	border-radius: 3px;
+	box-shadow: 3px 1px 5px #000;
+	padding: 3px;
+}
+.tip-title {
+	width: 100%;
+	overflow: hidden;
+	height: 40px;
+	display: flex;
+	align-items: center;
+	flex-direction: row-reverse;
+	background-color: #409EFF;
+	border-radius: 5px 5px 0 0;
+	justify-content: center;
+	padding: 0 10px;
+	color: #fff;
+	font-size: 18px;
+	text-align: center;
+}
+</style>
--- a/src/views/newMap/display/trainingList/trainingMenu.vue
+++ b/src/views/newMap/display/trainingList/trainingMenu.vue
@ -4,8 +4,7 @@
    <div ref="drapBox" class="reminder-box">
      <div class="tip-title">
        <div style="display: flex;justify-content: center;align-items: center;">
-          <el-button v-show="showMenu" plain type="success" size="mini" style="margin-right: 10px;" @click="changeShow(false)">实训列表</el-button>
-          <el-button v-show="!showMenu && trainingDetail" plain type="success" size="mini" style="margin-right: 10px;" @click="changeShow(true)">实训菜单</el-button>
+          <i class="icon el-icon-document" @click="trainingListShow" />
          <i v-show="!isShrink && !trainingSwitch && trainingDetail" class="icon el-icon-video-play" @click="handlerStart" />
          <i v-show="!isShrink && trainingSwitch" class="icon el-icon-switch-button" @click="handlerEnd" />
          <i v-show="isShrink" class="icon el-icon-minus" @click="shrink" />
@ -17,12 +16,12 @@
      </div>
      <div v-if="isShrink" class="reminder-box-content">
        <div class="zhezhao" />
-        <div v-if="showMenu" ref="dragBody" class="tip-body-box">
+        <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">{{ trainingDetail.name }}</span>
+                <span class="list-elem">{{ trainingDetail ?trainingDetail.name:'' }}</span>
              </p>
              <p class="list-item">
                <span class="list-label">实训模式：</span>
@ -36,7 +35,7 @@
              </p>
              <p class="list-item">
                <span class="list-label" style="vertical-align: top;"> {{ $t('display.training.trainingInstructions') }}</span>
-                <span class="list-elem elem-span">{{ trainingDetail.description }}</span>
+                <span class="list-elem elem-span">{{ trainingDetail ?trainingDetail.description:'' }}</span>
              </p>
              <p class="list-item">
                <span class="list-label">操作按钮：</span>
@ -52,16 +51,6 @@
          <div class="drag-bottom" />
          <div class="drag-top" />
        </div>
-        <div v-else>
-          <el-tabs v-model="activeName">
-            <el-tab-pane label="单操实训" name="first">
-              <QueryListPage ref="queryListPage" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
-            </el-tab-pane>
-            <el-tab-pane label="场景实训" name="second">
-              <QueryListPage ref="queryListPage" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryListScene" />
-            </el-tab-pane>
-          </el-tabs>
-        </div>
      </div>
    </div>
    <scene-play-role ref="scenePlayRole" @startTraining="startTraining" />
@ -74,7 +63,7 @@ import { ScriptMode } from '@/scripts/ConstDic';
 import { startTraining, endTraining } from '@/api/jmap/training';
 import ScenePlayRole from './scenePlayRole';
 import TestResult from './testResult';
-import { getPublishSingleList, getPublishTrainingDetail, loadPublishTraining, getPublishScenesList } from '@/api/jmap/training';
+import { EventBus } from '@/scripts/event-bus';
 export default {
    name: 'TipTrainingDetail',
    components: {
@ -90,88 +79,11 @@ export default {
    data() {
        return {
            isShrink: true,
-            showSumbit: false,
            demoMode: ScriptMode.TEACH,
            TrainingMode: ScriptMode,
            activeName: 'first',
-            showMenu: false,
-            pagerConfig: {
-                pageSize: 'pageSize',
-                pageIndex: 'pageNum'
-            },
            training: {},
-            queryForm: {
-                labelWidth: '100px',
-                reset: true,
-                show:false
-            },
-            queryList: {
-                query: this.queryFunction,
-                selectCheckShow: false,
-                paginationHiden: true,
-                indexShow: true,
-                height: 200,
-                columns: [
-                    {
-                        title: this.$t('trainingManage.name'),
-                        prop: 'name'
-                    },
-                    {
-                        title: this.$t('trainingManage.description'),
-                        prop: 'description'
-                    },
-                    {
-                        title: this.$t('trainingManage.labelJson'),
-                        prop: 'labelJson'
-                    },
-                    {
-                        type: 'button',
-                        title: this.$t('trainingManage.operate'),
-                        buttons: [
-                            {
-                                name: '加载',
-                                handleClick: this.loadScript,
-                                type: 'primary',
-                                showControl:(row) => { return row.id; }
-                            }
-                        ]
-                    }
-                ]
-            },
-            queryListScene: {
-                query: this.queryFunctionScene,
-                selectCheckShow: false,
-                paginationHiden: true,
-                indexShow: true,
-                height: 200,
-                columns: [
-                    {
-                        title: this.$t('trainingManage.name'),
-                        prop: 'name'
-                    },
-                    {
-                        title: this.$t('trainingManage.description'),
-                        prop: 'description'
-                    },
-                    {
-                        title: this.$t('trainingManage.labelJson'),
-                        prop: 'labelJson'
-                    },
-                    {
-                        type: 'button',
-                        title: this.$t('trainingManage.operate'),
-                        buttons: [
-                            {
-                                name: '加载',
-                                handleClick: this.loadScript,
-                                type: 'primary',
-                                showControl:(row) => { return row.id; }
-                            }
-                        ]
-                    }
-                ]
-            },
-            playerId: ''
+            trainingDesign: false
        };
    },
    computed: {
@ -192,15 +104,9 @@ export default {
        }
    },
    mounted() {
-        this.loadInitData();
+        this.trainingDesign = this.$store.state.training.domConfig.trainingDesign;
    },
    methods: {
-        loadInitData() {
-            this.showSumbit = false;
-        },
-        changeShow(val) {
-            this.showMenu = val;
-        },
        shrink() {
            if (this.isShrink) {
                this.isShrink = false;
@ -246,35 +152,8 @@ export default {
                this.$message.error('结束实训失败！');
            });
        },
-        queryFunction() {
-            return getPublishSingleList(this.mapId);
-        },
-        queryFunctionScene() {
-            return getPublishScenesList(this.mapId);
-        },
-        async loadScript(index, data) {
-            if (this.trainingSwitch) {
-                this.$message.error('请先结束当前实训后再加载新的实训！');
-                return;
-            }
-            try {
-                const detailResp = await getPublishTrainingDetail(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});
-                }
-                this.playerId = '';
-                if (detailResp.data.playerIdJson) {
-                    this.playerId = JSON.parse(detailResp.data.playerIdJson)[0];
-                }
-                this.showMenu = true;
-                this.$store.dispatch('trainingNew/setTrainingDetail', detailResp.data);
-                await loadPublishTraining(this.group, data.id, {mode: this.teachMode});
-                this.$message.success('加载实训成功！');
-            } catch (e) {
-                this.$message.error('加载实训失败！');
-            }
+        trainingListShow() {
+            EventBus.$emit('handleSliderShow');
        }
    }
 };
--- a/src/views/organization/trainingDesign/index.vue
+++ b/src/views/organization/trainingDesign/index.vue
@ -7,7 +7,6 @@
 import {queryMapListByUser} from '@/api/jmap/map';
 import Cookies from 'js-cookie';
 import ConstConfig from '@/scripts/ConstConfig';
-// import { getPublishSingleList, getPublishScenesList } from '@/api/jmap/training';
 import { deleteTraining } from '@/api/trainingManage';
 import { getTrainingList } from '@/api/trainingManage';
 // getPublishTrainingDetail, loadPublishTraining,
--- a/src/views/organization/trainingManage/index.vue
+++ b/src/views/organization/trainingManage/index.vue
@ -10,7 +10,7 @@ import { createSimulation } from '@/api/simulation';
 import ConstConfig from '@/scripts/ConstConfig';
 import { getSessionStorage } from '@/utils/auth';
 import { launchFullscreen } from '@/utils/screen';
-import { getPublishSingleList, getPublishScenesList, getAllPublishTrainingList } from '@/api/jmap/training';
+import { getAllPublishTrainingList, getPublishTrainingListInOrg } from '@/api/jmap/training';
 export default {
    name:'TrainingManage',
    data() {
@ -25,14 +25,12 @@ export default {
            queryForm: {
                labelWidth: '100px',
                reset: false,
-                initLoadCallback: this.initLoadCallback,
                queryObject: {
                    mapId: {
                        type: 'select',
                        label: '地图名称',
                        config: {
                            default: '',
-                            noClear:true,
                            data: []
                        }
                    },
@ -41,7 +39,6 @@ export default {
                        label: '实训类型',
                        config: {
                            default: '',
-                            noClear:true,
                            data: [
                                {label: '单操实训', value: 'single'},
                                {label: '场景实训', value: 'scene'}
@ -64,6 +61,13 @@ export default {
                        title: this.$t('trainingManage.description'),
                        prop: 'description'
                    },
+                    {
+                        title:'所属地图',
+                        prop: 'mapId',
+                        type: 'tag',
+                        columnValue: (row) => { return this.$convertField(row.mapId, this.mapList, ['value', 'label']); },
+                        tagType: (row) => { return ''; }
+                    },
                    {
                        title: this.$t('trainingManage.type'),
                        prop: 'type',
@ -116,38 +120,13 @@ export default {
        hasTeachingDataManage() {
            return this.$route.path.includes('/teachingDataManage/');
        },
-        initLoadCallback(form) {
-            if (this.hasTeachingDataManage()) {
-                form.type = '';
-                form.mapId = '';
-                return;
-            }
-            if (!form.type) {
-                form.type = 'single';
-            }
-            if (!form.mapId) {
-                form.mapId = this.mapList[0] ? this.mapList[0].value : '';
-            }
-        },
        queryFunction(param) {
+            delete param.pageSize;
+            delete param.pageNum;
            if (this.hasTeachingDataManage()) {
-                const params = {
-                    ...param
-                };
-                delete params.pageSize;
-                delete params.pageNum;
-                return getAllPublishTrainingList(params);
-            } else if (param.mapId) {
-                if (param.type == 'single') {
-                    return getPublishSingleList(param.mapId);
-                } else if (param.type == 'scene') {
-                    return getPublishScenesList(param.mapId);
-                }
+                return getAllPublishTrainingList(param);
            } else {
-                return new Promise((resolve, reject)=>{
-                    const result = {data:[]};
-                    resolve(result);
-                });
+                return getPublishTrainingListInOrg(param);
            }
        },
        getLabelJson(row) {
--- a/src/views/publish/publishMap/editSubsystem.vue
+++ b/src/views/publish/publishMap/editSubsystem.vue
@ -111,6 +111,7 @@ import { getPassengerFlowData } from '@/api/simulation';
 import { queryPaperList } from '@/api/management/exam';
 import { getTrainingDetailNew } from '@/api/jmap/training';
 import ChooseTraining from './chooseTraining';
+import { ClientList, TrainingTypeList } from '@/scripts/ConstDic';

 export default {
    name: 'EditSubsystem',
@ -118,33 +119,8 @@ export default {
        ChooseTraining
    },
    data() {
-        const clientList = [
-            { label: '中心ATS工作站', value: 'dispatchWork' },
-            { label: '中心ATS大屏', value: 'bigScreen' },
-            { label: '现地ATS工作站', value: 'localWork' },
-            { label: 'ISCS', value: 'iscsView' },
-            { label: 'IBP', value: 'ibp' },
-            { label: 'PSL', value: 'psl' },
-            { label: '列车驾驶', value: 'drivingPlan' },
-            { label: 'CCTV', value: 'cctvView' },
-            { label: '设备视图', value: 'jl3dModle' },
-            { label: '数字沙盘', value: 'digitalStand' },
-            { label: '车务终端', value: 'trafficTerminal' },
-            { label: '车务管理终端', value: 'trafficManageTerminal' },
-            { label: '调度命令', value: 'dispatchingCommand' },
-            { label: '调度计划', value: 'schedulingPlan' },
-            { label: '大客流策略', value: 'largePassengerStrategy' },
-            { label: '大客流视图', value: 'largePassengerView' },
-            { label: '行调台', value: 'dispatcherManage' },
-            { label: '派班工作站', value: 'scheduleWork' },
-            { label: '应急调度', value: 'emergency' },
-            { label: '运行图加载', value: 'diagramLoad' },
-            { label: '运行图预览', value: 'diagramPreview' },
-            { label: '运行图编制', value: 'diagramEdit' }
-        ];
        return {
            visible: false,
-            clientList: clientList,
            title: '',
            trainingName: '',
            mapSystemId: '',
@ -154,8 +130,9 @@ export default {
            frontTableData: [
                { key: 'singleMember', label: '是否单角色', value: false, type: 'checkbox' },
                { key: 'singleClient', label: '是否单客户端', value: false, type: 'checkbox' },
-                { key: 'client', label: '初始客户端', value: '', type: 'select', optionList: clientList},
+                { key: 'client', label: '初始客户端', value: '', type: 'select', optionList: ClientList},
                { key: 'hasTraining', label: '是否有实训', value: false, type: 'checkbox'},
+                { key: 'trainingType', label: '实训类型', value: '', type: 'select', optionList: TrainingTypeList },
                { key: 'hasExam', label: '是否有考试', value: false, type: 'checkbox' },
                { key: 'trainingDesign', label: '是否实训设计', value: false, type: 'checkbox' },
                { key: 'hasLpf', label: '是否有大客流', value: false, type: 'checkbox' },
@ -363,8 +340,9 @@ export default {
            this.frontTableData = [
                { key: 'singleMember', label: '是否单角色', value: false, type: 'checkbox' },
                { key: 'singleClient', label: '是否单客户端', value: false, type: 'checkbox' },
-                { key: 'client', label: '初始客户端', value: '', type: 'select', optionList: this.clientList},
+                { key: 'client', label: '初始客户端', value: '', type: 'select', optionList: ClientList},
                { key: 'hasTraining', label: '是否有实训', value: false, type: 'checkbox'},
+                { key: 'trainingType', label: '实训类型', value: '', type: 'select', optionList: TrainingTypeList },
                { key: 'hasExam', label: '是否有考试', value: false, type: 'checkbox' },
                { key: 'trainingDesign', label: '是否实训设计', value: false, type: 'checkbox' },
                { key: 'hasLpf', label: '是否有大客流', value: false, type: 'checkbox' },