实训设计

2022-10-28 15:20:26 +08:00 · 2022-10-28 15:20:26 +08:00 · 6c1903a6a0
commit 6c1903a6a0
parent f8257cddfe
10 changed files with 189 additions and 82 deletions
--- a/package.json
+++ b/package.json
@ -6,7 +6,7 @@
  "license": "MIT",
  "scripts": {
    "start": "vue-cli-service serve --open",
-    "dev": "node --max_old_space_size=4096 node_modules/@vue/cli-service/bin/vue-cli-service.js serve",
+    "dev": "node --max_old_space_size=4096 node_modules/@vue/cli-service/bin/vue-cli-service.js serve --open",
    "build": "vue-cli-service build --mode production",
    "test": "vue-cli-service build --mode staging",
    "local": "vue-cli-service build --mode",
--- a/src/views/newMap/display/index.vue
+++ b/src/views/newMap/display/index.vue
@ -1,5 +1,5 @@
 <template>
-  <div class="main" :style="{width: canvasWidth+'px'}">
+  <div class="main">
    <transition name="el-zoom-in-bottom">
      <!-- v-show="!specialDispatch"  -->
      <!--      <map-system-draft ref="mapCanvas" @back="back" />-->
@ -143,5 +143,7 @@ export default {
 <style lang="scss" scoped>
 .main{
 	height: 100%;
+	width: 100%;
+	overflow: hidden;
 }
 </style>
--- a/src/views/newMap/display/simulationMenu.vue
+++ b/src/views/newMap/display/simulationMenu.vue
@ -57,6 +57,7 @@
    <training-tip v-if="trainingId" ref="trainingTip" />
    <training-position-tip v-if="trainingId" ref="trainingPositionTip" />
    <training-menu v-if="trainingDetail" ref="trainingMenu" :offset-bottom="offsetBottom" />
+    <TrainingDesign ref="trainingDesign" />

  </div>
 </template>
@ -97,6 +98,7 @@ import TrainingList from './trainingList/index.vue';
 import TrainingTip from './trainingList/trainingTip.vue';
 import TrainingPositionTip from './trainingList/trainingPositionTip.vue';
 import TrainingMenu from './trainingList/trainingMenu';
+import TrainingDesign from '@/views/trainingManage/index.vue';

 export default {
    name: 'SimulationMenu',
@ -128,7 +130,8 @@ export default {
        TrainingList,
        TrainingTip,
        TrainingPositionTip,
-        TrainingMenu
+        TrainingMenu,
+        TrainingDesign
        // StatusIcon
    },
    props: {
@ -431,6 +434,7 @@ 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 },
                {
@ -930,6 +934,9 @@ export default {
        trainingPane() {
            this.$refs.trainingList.doShow();
        },
+        trainingDesign() {
+            this.$refs.trainingDesign.doShow();
+        },
        changeFlowData() {
            this.hideMenuList();
            this.$refs.flowData.doShow();
--- a/src/views/organization/trainingDesign/index.vue
+++ b/src/views/organization/trainingDesign/index.vue
@ -1,6 +1,6 @@
 <template>
  <div style="width: 100%;height: 100%;">
-    <QueryListPage ref="queryListPage" :card-padding="10" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
+    <QueryListPage v-if="showList" ref="queryListPage" :card-padding="10" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
  </div>
 </template>
 <script>
@ -8,14 +8,15 @@ 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, publishTraining } from '@/api/trainingManage';
-import { getTrainingList, getTrainingAll } from '@/api/trainingManage';
+import { deleteTraining } from '@/api/trainingManage';
+import { getTrainingList } from '@/api/trainingManage';
 // getPublishTrainingDetail, loadPublishTraining,
 export default {
    name:'TrainingManage',
    data() {
        return {
            mapList:[],
+            showList: false,
            pagerConfig: {
                pageSize: 'pageSize',
                pageIndex: 'pageNum'
@ -23,7 +24,7 @@ export default {
            queryForm: {
                labelWidth: '100px',
                reset: false,
-                // initLoadCallback: this.initLoadCallback,
+                initLoadCallback: this.initLoadCallback,
                queryObject: {
                    mapId: {
                        type: 'select',
@ -125,32 +126,19 @@ export default {
                this.mapList.push({label:element.name, value:element.id});
            });
            this.queryForm.queryObject.mapId.config.data = [...this.mapList];
-            // this.queryForm.queryObject.mapId.config.default = this.mapList[0].value;
+            this.queryForm.queryObject.mapId.config.default = this.mapList[0].value;
+            this.showList = true;
        });
    },
    methods: {
-        // initLoadCallback(form) {
-        //     if (!form.trainingType) {
-        //         form.trainingType = 'training';
-        //     }
-        //     // if (!form.mapId) {
-        //     //     form.mapId = this.mapList[0].value;
-        //     // }
-        // },
-        // queryFunction(param) {
-        //     if (param.mapId) {
-        //         if (param.trainingType == 'training') {
-        //             return getPublishSingleList(param.mapId);
-        //         } else if (param.trainingType == 'scene') {
-        //             return getPublishScenesList(param.mapId);
-        //         }
-        //     } else {
-        //         return new Promise((resolve, reject)=>{
-        //             const result = {data:[]};
-        //             resolve(result);
-        //         });
-        //     }
-        // },
+        initLoadCallback(form) {
+            if (!form.trainingType) {
+                form.trainingType = 'training';
+            }
+            if (!form.mapId) {
+                form.mapId = this.mapList[0] ? this.mapList[0].value : '';
+            }
+        },
        queryFunction(param) {
            if (param.mapId) {
                return getTrainingList(param);
--- a/src/views/trainingManage/editCondition.vue
+++ b/src/views/trainingManage/editCondition.vue
@ -287,10 +287,10 @@ export default {
 /deep/ .el-dialog__wrapper {
 	width: 1px;
 	height: 1px;
-	top: auto;
-	right: auto;
-	bottom: auto;
-	left: auto;
+	top: 0;
+	right: 0;
+	bottom: 0;
+	left: 0;
 	overflow: visible !important;
 }
 // .conditionTab{
--- a/src/views/trainingManage/editDetails.vue
+++ b/src/views/trainingManage/editDetails.vue
@ -397,10 +397,11 @@ export default {
 </script>
 <style lang="scss" scoped>
 .editContent {
-	position: absolute;
+	position: fixed;
    right: 0;
 	top: 0;
-    height: 100%;
+	bottom: 0;
+    // height: 100%;
 	width: 800px;
 	transform: translateX(800px);
 	transition: all 0.4s;
@ -410,20 +411,12 @@ export default {
 		transform: translateX(0px);
 	}
 }
-/deep/ .el-dialog__wrapper {
-	width: 1px;
-	height: 1px;
-	top: auto;
-	right: auto;
-	bottom: auto;
-	left: auto;
-	overflow: visible !important;
-}
 .editContentTab{
    position: absolute;
    z-index: 10;
 	left: -12px;
-	top: calc(45% + 100px);
+	// top: calc(45% + 200px);
+	top: 200px;
 }
 .editContentTabLable{
    position: absolute;
@ -435,7 +428,7 @@ export default {
    left: 50%;
    transform: translateX(-50%);
    cursor: pointer;
-    top:-28px;
+    top: 0px;
 }
 .tabPaneBox {
 	padding: 0 20px;
--- a/src/views/trainingManage/editOperate.vue
+++ b/src/views/trainingManage/editOperate.vue
@ -1,10 +1,10 @@
 <template>
-  <div>
-    <div class="editContentTab">
+  <div class="operate-main">
+    <!-- <div class="editContentTab">
      <div v-if="dialogVisible" class="editContentTabLable" @click="minisize">
        <span class="titleStyle">{{ $t('trainingManage.editTagTitle') }}</span>
      </div>
-    </div>
+    </div> -->
    <el-dialog :title="title" :visible.sync="dialogVisible" width="500" :modal="false" :close-on-click-modal="false" :show-close="false" center style="margin-left: 200px">
      <el-row style="font-size: 16px;padding: 5px;">
        <el-col :span="4">步骤描述：</el-col>
@ -147,35 +147,37 @@ export default {
 };
 </script>

-<style scoped>
-/deep/ .el-dialog__wrapper {
+<style lang="scss" scoped>
+.operate-main {
+	/deep/ .el-dialog__wrapper {
 		width: 1px;
 		height: 1px;
-	top: auto;
-	right: auto;
-	bottom: auto;
-	left: auto;
+		top: 0;
+		right: 0;
+		bottom: 0;
+		left: 0;
 		overflow: visible !important;
-}
-/deep/ .el-dialog--center{
+	}
+	/deep/ .el-dialog--center{
 		width: 600px;
+	}
 }
-.editContentTab{
-	position: absolute;
-	z-index: 10;
-	right: 12px;
-	top: calc(45% + 100px);
-}
-.editContentTabLable{
-	position: absolute;
-	background: #fff;
-	border-radius: 5px 0 0 5px ;
-	padding: 5px 0;
-	width: 23px;
-	text-align: center;
-	left: 50%;
-	transform: translateX(-50%);
-	cursor: pointer;
-	top:-28px;
-}
+// .editContentTab{
+// 	position: absolute;
+// 	z-index: 10;
+// 	right: 12px;
+// 	top: calc(45% + 100px);
+// }
+// .editContentTabLable{
+// 	position: absolute;
+// 	background: #fff;
+// 	border-radius: 5px 0 0 5px ;
+// 	padding: 5px 0;
+// 	width: 23px;
+// 	text-align: center;
+// 	left: 50%;
+// 	transform: translateX(-50%);
+// 	cursor: pointer;
+// 	top:-28px;
+// }
 </style>
--- a/src/views/trainingManage/index.vue
+++ b/src/views/trainingManage/index.vue
@ -0,0 +1,115 @@
+<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" />
+    <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" />
+  </div>
+</template>
+<script>
+import TrainingList from './trainingList.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';
+
+export default {
+    name:'TrainingIndex',
+    components:{
+        TrainingList,
+        TrackList,
+        EditDetails,
+        EditCondition,
+        EditOperate,
+        GradeRules
+    },
+    props:{
+    },
+    data() {
+        return {
+            hoverBtn: false,
+            btnWidth: -600,
+            materialsList: [],
+            refsList: ['editDetails', 'editCondition', 'trackList'],
+            editData: {}
+        };
+    },
+    computed:{
+        group() {
+            return this.$route.query.group;
+        },
+        mapId() {
+            return this.$route.query.mapId;
+        },
+        lineCode() {
+            return this.$route.query.lineCode;
+        }
+    },
+    mounted() {
+        this.getMaterials();
+    },
+    methods:{
+        publish(data) {
+            this.$refs.trainingList.publishScript(null, data);
+        },
+        preview(data) {
+            this.$refs.trainingList.previewScript(null, data);
+        },
+        editConditionFn(data, index, key) {
+            this.$refs.editDetails.editConditionFn(data, index, key);
+        },
+        backStep() {
+            this.$refs.editDetails.backStep();
+        },
+        handleCondition(index, row, key) {
+            this.$refs.editCondition.doShow(row, index, key);
+        },
+        getMaterials() {
+            getTrainingMaterials().then(res => {
+                this.materialsList = res.data;
+            }).catch(err => {
+                console.log(err, 'Materials----');
+                this.materialsList = [];
+            });
+        },
+        draftTracK(row) {
+            this.$refs.trackList.doShow(row);
+        },
+        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]) {
+                    this.$refs[key].doClose();
+                }
+            });
+        },
+        openEditOperate(data) {
+            this.$refs.editOperate.doShow(data);
+        },
+        backStepList(data) {
+            this.$refs.editDetails.setOperations(data);
+            this.$refs.editDetails.minisize();
+        },
+        gradeRules(data) {
+            this.$refs.gradeRules.doShow(data);
+        }
+    }
+};
+</script>
+<style lang="scss" scoped>
+.main {
+	position: relative;
+	z-index: 2001;
+}
+</style>
--- a/src/views/trainingManage/trackList.vue
+++ b/src/views/trainingManage/trackList.vue
@ -1,5 +1,5 @@
 <template>
-  <el-dialog v-dialogDrag title="草稿发布轨迹" :visible.sync="dialogVisible" width="1050px" :before-close="doClose" center>
+  <el-dialog v-dialogDrag title="草稿发布轨迹" :visible.sync="dialogVisible" append-to-body width="1050px" :before-close="doClose" center>
    <div>
      <QueryListPage ref="queryListPage" :card-padding="10" :pager-config="pagerConfig" :query-form="queryForm" :query-list="queryList" />
    </div>
--- a/src/views/trainingManage/trainingList.vue
+++ b/src/views/trainingManage/trainingList.vue
@ -1,5 +1,5 @@
 <template>
-  <el-dialog v-dialogDrag title="实训管理" :visible.sync="dialogVisible" width="1250px" :before-close="doClose" center>
+  <el-dialog v-dialogDrag title="实训管理" :visible.sync="dialogVisible" append-to-body width="1250px" :before-close="doClose" center>
    <div>
      <div class="trainingHeader">
        <div class="trainingList">实训草稿列表</div>