三维课程编辑器课程组件和数据结构修改，升级threejs版本

src/jlmap3d/lesson3dedit/assetmodelmanager/assetmodelmanager.js

@@ -2,29 +2,195 @@ import { BASE_ASSET_API } from '@/api/jlmap3d/assets3d.js';
 
 export function AssetModelManager(scene) {
   let scope = this;
+
+
   this.assetList = [];
 
+  this.otherModel = new THREE.Group();
+
+  scene.add(this.otherModel);
+
   this.loadAsset = [];
 
+  this.loadAsset['default1'] = {
+    modelId:'default1',
+    packageName:"车站",
+    url:"/MODEL/2021-04-06/1381-54584.FBX",
+    mesh:"",
+    assetType:'default',
+    isUse:true,
+    resourceType:"三维课程",
+  };
+
+  //场景中可触发事件模型
+  this.lessonTriggerList = [];
+
+  this.saveModelList = function(){
+    let modelList = {
+      assetList:[],
+      modelList:[],
+    };
+
+    for(let k in scope.loadAsset){
+      modelList.assetList.push({
+        modelId:scope.loadAsset[k].modelId,
+        packageName:scope.loadAsset[k].packageName,
+        url:scope.loadAsset[k].url,
+        assetType:scope.loadAsset[k].assetType,
+        isUse:scope.loadAsset[k].isUse,
+        resourceType:scope.loadAsset[k].resourceType,
+      });
+    }
+
+    for(let i=0;i<scope.lessonTriggerList.length;i++){
+      if(scope.lessonTriggerList[i].showType != "default"){
+        modelList.modelList.push({
+          name:scope.lessonTriggerList[i].name,
+          modelId:scope.lessonTriggerList[i].modelId,
+          label:scope.lessonTriggerList[i].label,
+          pos:{
+            x:scope.lessonTriggerList[i].position.x,
+            y:scope.lessonTriggerList[i].position.y,
+            z:scope.lessonTriggerList[i].position.z
+          },
+          rot:{
+            x:scope.lessonTriggerList[i].position.x,
+            y:scope.lessonTriggerList[i].position.y,
+            z:scope.lessonTriggerList[i].position.z
+          },
+          showType:scope.lessonTriggerList[i].showType,
+          visible:scope.lessonTriggerList[i].visible,
+
+        });
+      }
+    }
+
+    // console.log(modelList);
+    return modelList;
+  }
+
   //加载课程资源
-  this.lessonAssetsLoader = function(){
-    fbxpromise();
+  this.lessonAssetsLoader = function(assetList,modelList){
+
+
+    let initlist = [];
+    if(assetList){
+      for(let i = 0;i<assetList.length;i++){
+        assetList[i].mesh = "";
+        scope.loadAsset[assetList[i].modelId] = assetList[i];
+
+      }
+    }
+    for(let k in scope.loadAsset){
+      initlist.push(fbxpromise(scope.loadAsset[k]));
+
+    }
+
+
+    return new Promise(function(resolve, reject){
+      Promise.all(initlist).then((result) => {
+
+
+        initTriggerList();
+        for(let i=0;i<modelList.length;i++){
+          console.log(modelList[i]);
+          let newModelTrigger = scope.loadAsset[modelList[i].modelId].mesh.clone(true);
+          newModelTrigger.showType = "loadModel";
+          newModelTrigger.label = modelList[i].label;
+          newModelTrigger.modelId = modelList[i].modelId;
+          newModelTrigger.visible = modelList[i].visible;
+          newModelTrigger.position.copy(modelList[i].pos);
+          newModelTrigger.rotation.copy(modelList[i].rot);
+          scope.otherModel.add(newModelTrigger);
+          scope.lessonTriggerList.push(newModelTrigger);
+        }
+
+        updateTriggerList(scope.lessonTriggerList);
+        resolve("loaderassets");             //['成功了', 'success']
+      }).catch((error) => {
+        //console.log(error);
+      });
+
+    });
+  }
+
+
+
+  // <el-option label="车站" value="standstation"></el-option>
+  // <el-option label="停车场" value="stopstation"></el-option>
+  // <el-option label="单体设备" value="device"></el-option>
+  // <el-option label="线路" value="xl"></el-option>
+  // <el-option label="道岔" value="dc"></el-option>
+  //FT 扶梯
+  //FTAN 扶梯按钮(急停)
+  //FTD 扶梯灯
+  //FTKG 扶梯开关（钥匙孔）
+  //FTTJ 扶梯台阶
+  function initTriggerList(){
+    scope.loadAsset['default1'].mesh.getObjectByName("FTAN").showType = "default";
+    scope.loadAsset['default1'].mesh.getObjectByName("FTAN").label = "扶梯急停按钮";
+    scope.lessonTriggerList.push(scope.loadAsset['default1'].mesh.getObjectByName("FTAN"));
+
+    scope.loadAsset['default1'].mesh.getObjectByName("FTKG").showType = "default";
+    scope.loadAsset['default1'].mesh.getObjectByName("FTKG").label = "扶梯钥匙孔";
+    scope.lessonTriggerList.push(scope.loadAsset['default1'].mesh.getObjectByName("FTKG"));
+
+
+    // console.log(scope.loadAsset['default1'].mesh.getObjectByName("FTKG"));
   }
 
   //动态加载资源
-  this.assetLoader = function(){
+  this.lessonAssetsNewLoader = function(assetData,pos){
+    let isLoaded = false;
+    if(scope.loadAsset[assetData.id]){
+      let newModelTrigger = scope.loadAsset[assetData.id].mesh.clone(true);
+      newModelTrigger.modelId = assetData.id;
+      newModelTrigger.showType = "loadModel";
+      newModelTrigger.label = assetData.packageName;
+      newModelTrigger.position.copy(pos);
+      scope.otherModel.add(newModelTrigger);
+      scope.lessonTriggerList.push(newModelTrigger);
+      updateTriggerList(scope.lessonTriggerList);
+    }else{
+      scope.loadAsset[assetData.id] = {
+        modelId:assetData.id,
+        packageName:assetData.packageName,
+        url:assetData.url,
+        mesh:"",
+        assetType:'loadModel',
+        isUse:true,
+        resourceType:"三维课程",
+      };
+      console.log("new");
+      fbxpromise(scope.loadAsset[assetData.id]).then(function(object){
 
+        let newModelTrigger = scope.loadAsset[assetData.id].mesh.clone(true);
+        newModelTrigger.showType = "loadModel";
+        newModelTrigger.modelId = assetData.id;
+        newModelTrigger.label = assetData.packageName;
+        newModelTrigger.position.copy(pos);
+        scope.otherModel.add(newModelTrigger);
+        scope.lessonTriggerList.push(newModelTrigger);
+
+        updateTriggerList(scope.lessonTriggerList);
+        // resolve("loadednew");
+      });
+    }
   }
 
+
   //fbx模型加载
-  function fbxpromise(){
+  function fbxpromise(asset){
     return new Promise(function(resolve, reject){
       var loader = new THREE.FBXLoader();
-      loader.load( BASE_ASSET_API+"/MODEL/2021-03-25/1370-3193.FBX", function ( object ) {
+      loader.load( BASE_ASSET_API+asset.url, function ( object ) {
 
-
-        scope.loadAsset.push(object);
+        if(asset.assetType == "default"){
           scene.add(object);
+        }else if(asset.assetType == 'loadModel'){
+
+        }
+        asset.mesh = object;
         resolve();
       } );
 

src/jlmap3d/lesson3dedit/lesson3deditor.js

@@ -65,7 +65,12 @@ export function Lesson3dEditor(dom,lessonData) {
   lesson3dUpdateControl(scope.controls);
 
   let assetModelManager = new AssetModelManager(scene);
+	if(lessonData.assetList.length>0 || lessonData.modelList.length>0){
+		assetModelManager.lessonAssetsLoader(lessonData.assetList,lessonData.modelList);
+	}else{
 		assetModelManager.lessonAssetsLoader();
+	}
+
 	animate();
 
 
@@ -83,4 +88,27 @@ export function Lesson3dEditor(dom,lessonData) {
 		scope.renderer.setSize(dom.offsetWidth,dom.offsetHeight);
 	}
 
+	this.createModelTrigger = function(assetData,mousePos){
+
+		var mouse = new THREE.Vector2();
+
+		var raycaster = new THREE.Raycaster();
+
+		mouse.x = ( mousePos.x / window.innerWidth ) * 2 - 1;
+
+		mouse.y = - ( mousePos.y / dom.offsetHeight ) * 2 + 1;
+
+		raycaster.setFromCamera(mouse,scope.camerass) // 也可以给构造函数传参的形式写
+
+		var intersects = raycaster.intersectObjects( scene.children,true );
+
+		if(intersects.length>0){
+			assetModelManager.lessonAssetsNewLoader(assetData,intersects[0].point);
+		}
+
+	}
+
+	this.saveAssetModel = function(){
+		return assetModelManager.saveModelList();
+	}
 }

src/jlmap3d/lesson3dedit/model/lessondata.js

@@ -8,10 +8,13 @@ export function LessonData() {
 	this.lessonStatus = "";
 	this.lessonData = {
 		//资源列表
-		assetmodel:[],
+    assetList:[],
+    //场景交互物体列表
+    modelList:[],
 		//课程组件启用状态
 		lessonTools:[],
 		dataType:"",
+    toolJobPane:[],
 		//课程内容
 		lessonProgress:[
 
@@ -20,6 +23,7 @@ export function LessonData() {
 
   this.initLessonProgress = function(){
     let newLessonProgress = {
+      id:generateUUID(),
       progressName:"",
       roleName:"",
       roleUse:true,
@@ -49,6 +53,10 @@ export function LessonData() {
         picurl:"url",
         text:"内容",
       },
+      action:{
+        actionType:"事件操作类型",
+        actionMode:"触发事件类型",
+      },
     };
 
     scope.lessonData.lessonProgress.push(newLessonProgress);
@@ -59,10 +67,11 @@ export function LessonData() {
     console.log(loadData);
     for(let i=0;i<loadData.length;i++){
       let newLessonProgress = {
+        id:loadData[i].id,
         progressName:loadData[i].progressName,
         roleName:loadData[i].roleName,
         roleUse:loadData[i].roleUse,
-
+        score:loadData[i].roleUse,
         progressScene:loadData[i].progressScene,
         nextCode:loadData[i].nextCode,
         nextNode:loadData[i].nextNode,
@@ -81,6 +90,8 @@ export function LessonData() {
         index:loadData[i].index,
         stepTipsData:loadData[i].stepTipsData,
         explainPane:loadData[i].explainPane,
+        action:loadData[i].action,
+        jobPane:[],
       };
 
       scope.lessonData.lessonProgress.push(newLessonProgress);
@@ -90,10 +101,11 @@ export function LessonData() {
   this.addLessonProgress = function(index){
     let inheirIndex = index - 1;
     let newLessonProgress = {
+      id:generateUUID(),
       progressName:"",
       roleName:scope.lessonData.lessonProgress[inheirIndex].roleName,
       roleUse:scope.lessonData.lessonProgress[inheirIndex].roleUse,
-
+      score:0,
       progressScene:scope.lessonData.lessonProgress[inheirIndex].progressScene,
       nextCode:"",
       nextNode:"",
@@ -122,6 +134,11 @@ export function LessonData() {
         picurl:"url",
         text:"内容",
       },
+      action:{
+        actionType:"事件操作类型",
+        actionMode:"触发事件类型",
+      },
+      jobPane:[],
     };
 
     scope.lessonData.lessonProgress.push(newLessonProgress);
@@ -136,6 +153,18 @@ export function LessonData() {
     scope.lessonData.lessonProgress.splice(index,1);
   }
 
+  function generateUUID() {
+    var d = new Date().getTime();
+    if (window.performance && typeof window.performance.now === "function") {
+        d += performance.now(); //use high-precision timer if available
+    }
+    var uuid = 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
+        var r = (d + Math.random() * 16) % 16 | 0;
+        d = Math.floor(d / 16);
+        return (c == 'x' ? r : (r & 0x3 | 0x8)).toString(16);
+    });
+    return uuid;
+  }
 
 
 }

src/jlmap3d/lesson3dedit/toolsmodel/jobpanedata.js

@@ -0,0 +1,294 @@
+
+export function JobPaneData() {
+  let scope = this;
+
+  // let
+  this.dataList = [
+    {
+      name:"值班站长",
+      text:"执行分公司、部、中心、车站的有关规章制度，加强班组管理，掌握列车运行情况，安排车站行车组织工作",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+    {
+      name:"行车值班员",
+      text:"在本班组值班站长的指挥下开展工作，负责本班组车站综合控制室，负责车站行车工作，监视列车到、发情况及乘客上下车、候车动态，监控设备运作状况。",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+    {
+      name:"客运值班员",
+      text:"在值班站长的领导下，主管车站客运、票务管理，组织站务员从事客运服务工作",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+    {
+      name:"票厅岗",
+      text:"执行分公司、部、中心、车站的有关规章制度，在客运值班员领导下，负责车站售票工作。",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+    {
+      name:"站台岗",
+      text:"",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+    {
+      name:"站长",
+      text:"在站务中心（副）主任领导下，组织领导站内员工开展车站各项工作。负责车站员工的日常管理，定期进行员工教育，掌握员工思想状况。",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+    {
+      name:"分部助理",
+      text:"",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+    {
+      name:"行车调度",
+      text:"",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+    {
+      name:"生产调度",
+      text:"",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+    {
+      name:"厅巡岗",
+      text:"负责站厅乘客服务，设备的巡视、紧急情况下事件的处理等。",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+    {
+      name:"地铁公安",
+      text:"",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+    {
+      name:"120",
+      text:"",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+    {
+      name:"119",
+      text:"",
+      picurl:"",
+      controlList:[
+        //联控
+        {
+          name:"联控",
+          data:[],
+        },
+        //动作
+        {
+          name:"动作",
+          data:[],
+        },
+        //口呼
+        {
+          name:"口呼",
+          data:[],
+        },
+      ],
+    },
+  ];
+}

src/jlmap3d/lesson3dedit/toolsmodel/lessontrigger.js

@@ -0,0 +1,32 @@
+
+export function LessonTrigger() {
+
+  let scope = this;
+
+  this.dataList = [
+
+  ];
+  // let
+  this.triggerList = [
+    {
+      name:"移动触发器",
+      type:"movetrigger",
+      picurl:"",
+    },
+    {
+      name:"置物触发器",
+      type:"placetrigger",
+      picurl:"",
+    },
+
+  ];
+
+  this.createTrigger = function(type){
+
+
+  }
+
+  this.deleteTrigger = function(selected){
+
+  }
+}

src/views/jlmap3d/jl3dassetmanager/component/uploadmodel.vue

@@ -16,6 +16,7 @@
               <el-option label="编辑器默认模型" value="EditModel"></el-option>
               <el-option label="VR模型" value="VrModel"></el-option>
               <el-option label="客流场景" value="客流模型"></el-option>
+              <el-option label="三维课程" value="三维课程"></el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="设备类型">
@@ -42,6 +43,8 @@
               <el-option label="通号设备间" value="MaintainerRoom"></el-option>
 
               <el-option label="静态模型" value="静态模型"></el-option>
+
+              <el-option label="三维课程模型" value="三维课程模型"></el-option>
             </el-select>
           </el-form-item>
           <el-form-item label="模型信息">

src/views/jlmap3d/lesson3dedit/component/lessonprogress.vue

@@ -3,7 +3,7 @@
   <div id="lessonprogressdiv" class="lessonprogressdiv">
     <div class="progressnum">当前课程页数:{{listLength}}</div>
     <el-tabs v-model="activeName" class="activediv" type="card" @tab-click="handleClick">
-      <el-tab-pane label="客运值班员" name="progresslist" >
+      <el-tab-pane label="课程场景" name="progresslist" >
         <draggable v-model="lessonData.lessonData.lessonProgress" group="people" @start="drag=true" @end="drag=false" >
           <div class="progressdiv"  v-for="(element,index) in lessonData.lessonData.lessonProgress">
             <div class="changeprogressdiv" @click="changeProgressView(index)">{{element.assetId}}</div>
@@ -13,6 +13,12 @@
         <div class="progressdiv " icon="el-icon-folder-add" @click="addProgress"></div>
       </el-tab-pane>
 
+      <el-tab-pane label="课程三维资源列表" name="assetlist" >
+        <div class="progressdiv"  v-for="(elementtrigger,indextrigger) in triggerList">
+          {{elementtrigger.label}}
+        </div>
+      </el-tab-pane>
+
     </el-tabs>
 
   </div>
@@ -38,6 +44,7 @@
         progressList:[
 
         ],
+        triggerList:[],
         listLength:0,
         progressIndex:0,
       }
@@ -49,6 +56,8 @@
 
     },
     mounted() {
+      window.updateTriggerList = this.updateTriggerList;
+
       console.log(this.lessonData);
     },
     beforeDestroy() {
@@ -75,6 +84,10 @@
         console.log(viewIndex);
         this.$emit('removeProgress',viewIndex);
       },
+      updateTriggerList(newTriggerList){
+        this.triggerList = newTriggerList;
+        console.log(this.triggerList);
+      },
 
     },
 

src/views/jlmap3d/lesson3dedit/component/lessontoolsmanager.vue

@@ -15,13 +15,20 @@
           </el-switch>
         </div>
       </el-tab-pane>
-      <el-tab-pane label="场景触发器" name="lessonasset">
-        <!-- <Assets-Model></Assets-Model> -->
-      </el-tab-pane>
-      <el-tab-pane label="三维资源" name="modelasset">
+
+      <el-tab-pane label="三维资源" name="modelTrigger">
         <!-- <Assets-Model></Assets-Model> -->
+        <draggable v-model="lessonAssetList" group="lessonAssetList" @start="drag=true" @end="drag=false" >
+          <div class="progressdiv"  v-for="(item,index) in lessonAssetList"  @dragend="createModel($event,item,index)">
+            {{item.packageName}}
+          </div>
+        </draggable>
       </el-tab-pane>
       <el-tab-pane label="图片资源列表" name="picasset">
+        <draggable v-model="triggerList" group="picasset" @start="drag=true" @end="drag=false" >
+          <div class="progressdiv"  v-for="item in triggerList"  @dragend="ondragend(item,index)">
+          </div>
+        </draggable>
         <!-- <Assets-Model></Assets-Model> -->
       </el-tab-pane>
     </el-tabs>
@@ -37,17 +44,24 @@
   import Vue from 'vue';
   import localStore from 'storejs';
 
+  import draggable from 'vuedraggable';
+
+  import { getMap3dModelData } from '@/api/jlmap3d/assets3d.js'
 
   export default {
     name: 'LessonTools',
     props:['lessonTools'],
     components: {
-
+      draggable,
     },
     data() {
       return {
         activeName: 'lessoncomponent',
-
+        lessonAssetList:[],
+        triggerList:[
+          {},
+          {},
+        ],
       }
     },
     computed: {
@@ -57,14 +71,31 @@
 
     },
     mounted() {
-      console.log(this.lessonTools);
+
+      getMap3dModelData("三维课程").then(netdata => {
+        this.lessonAssetList = netdata.data;
+      }).catch(error => {
+        console.log(error);
+      });
     },
     beforeDestroy() {
 
     },
     methods: {
       handleClick(tab, event) {
-        console.log(tab, event);
+        // console.log(tab, event);
+      },
+      ondragend(item, index) {
+
+        // console.log("```用户完成拖出后触发```");
+        // console.log('开始拖动的元素'+item);
+        console.log("拖出的母元素的下标" + index);
+        console.log(item);
+
+      },
+      createModel(event,item, index) {
+        // console.log(event);
+        this.$emit('createModel',item,{x:event.clientX,y:event.clientY});
       },
 
     },
@@ -93,4 +124,14 @@
     border:solid 2px #000;
   }
 
+  .progressdiv{
+    width:100px;
+    height:100px;
+    // display:inline;
+    margin: 20px;
+    float:left;
+    border:solid 2px #000;
+  }
+
+
 </style>

src/views/jlmap3d/lesson3dedit/component/property.vue

@@ -51,10 +51,7 @@
 
            <el-button v-if="selectLesson3dControl" @click="">重置镜头位置</el-button>
             <el-button v-if="selectLesson3dControl" @click="">记录初始镜头位置</el-button>
-
-
         </el-form>
-
       </el-tab-pane>
 
       <el-tab-pane label="组件属性" name="toolproperty" v-if="lessonData.lessonData.lessonProgress[lessonEditIndex]">
@@ -71,11 +68,42 @@
               <el-input v-model="selected.picurl" ></el-input>
           </el-form-item>
 
+          <el-form-item label="跳转节点:"  v-if="selected.nextNode ||selected.nextNode == 0">
+            <el-select v-model="selected.nextNode" placeholder="当前场景镜头控制模式">
+             <el-option
+               v-for="(item,index) in lessonData.lessonData.lessonProgress"
+               :key="index"
+               :label="index"
+               :value="index">
+             </el-option>
+           </el-select>
+          </el-form-item>
+
+          <el-form-item label="触发的场景:"  v-if="selected.sceneIndex ||selected.sceneIndex == 0">
+              <el-input v-model="selected.sceneIndex" ></el-input>
+          </el-form-item>
+
           <el-button @click="updateData">保存修改</el-button>
         </el-form>
       </el-tab-pane>
 
-      <el-tab-pane label="模型属性" name="modelproperty">
+      <el-tab-pane label="场景中事件" name="modelaction" v-if="lessonData.lessonData.lessonProgress[lessonEditIndex]">
+        <div class="actionlistdiv">
+
+        </div>
+        <el-form>
+          <el-select v-model="selectedAction.actionType" placeholder="请选择场景">
+            <el-option label="接触" value="contact"></el-option>
+            <el-option label="自动" value="auto"></el-option>
+            <el-option label="开关" value="switch"></el-option>
+          </el-select>
+
+          <el-select v-model="selectedAction.actionMode" placeholder="请选择场景">
+            <el-option label="播放动画" value="play"></el-option>
+            <el-option label="显示模型" value="show"></el-option>
+            <el-option label="隐藏模型" value="remove"></el-option>
+          </el-select>
+        </el-form>
       </el-tab-pane>
 
 
@@ -102,6 +130,10 @@
         selected:"",
         editSelectTool:"",
         editSelectModel:"",
+        selectedAction:{
+          actionType:"事件操作类型",
+          actionMode:"触发事件类型",
+        },
         cameraMode:[
           {
             value: 'non',
@@ -143,7 +175,7 @@
         console.log("reset");
         this.activeName = 'cameraproperty';
       },
-      lesson3dSelect(mode,type){
+      lesson3dSelect(mode,type,obj){
         this.activeName = mode;
         // console.log(this.lessonData.lessonData.lessonProgress[this.lessonEditIndex].stepTipsData);
         // this.activeName = 'toolproperty';
@@ -156,6 +188,10 @@
           this.selected = this.lessonData.lessonData.lessonProgress[this.lessonEditIndex].explainPane;
         }
 
+        if(type == "jobpane"){
+          this.selected = obj;
+        }
+
       },
       updateData(){
         // this.lessonData.lessonData.lessonProgress[this.lessonEditIndex].stepTipsData;
@@ -189,5 +225,18 @@
     margin: 20px;
   }
 
+  .actionlistdiv{
+    // position: absolute;
+    width:100%;
+    height:500px;
+
+    border:solid 2px #000;
+  }
+
+  .actionpropertydiv{
+    width:100%;
+    // position: absolute;
+    border:solid 2px #000;
+  }
 
 </style>

src/views/jlmap3d/lesson3dedit/lesson3dedit.vue

@@ -2,8 +2,10 @@
 
   <div id="lesson3ddiv" class="lesson3ddiv">
 
-    <LessonTools-Manager  :lessonTools='lessonTools'></LessonTools-Manager>
-
+    <LessonTools-Manager
+    @createModel='createModel'
+    :lessonTools='lessonTools'
+    ></LessonTools-Manager>
 
     <div class="lesson3dedit">
       <Step-Tips
@@ -13,7 +15,6 @@
       </Step-Tips>
 
       <Process-Log
-
         v-show="lessonTools[1].isShow && lessonData.lessonData.lessonProgress[lessonEditIndex].progressScene == 'standstation'">
       </Process-Log>
 
@@ -23,7 +24,14 @@
         v-show="lessonTools[2].isShow && lessonData.lessonData.lessonProgress[lessonEditIndex].progressScene == 'standstation'">
       </Explain-Pane>
 
-      <Job-Pane v-show="lessonTools[3].isShow && lessonData.lessonData.lessonProgress[lessonEditIndex].progressScene == 'standstation'"></Job-Pane>
+      <Job-Pane
+        :jobPaneData='jobPaneData'
+        :lessonData='lessonData'
+        :lessonEditIndex='lessonEditIndex'
+        ref="jobpane"
+        v-show="lessonTools[3].isShow && lessonData.lessonData.lessonProgress[lessonEditIndex].progressScene == 'standstation'">
+      </Job-Pane>
+
       <Tool-Bar v-show="lessonTools[4].isShow && lessonData.lessonData.lessonProgress[lessonEditIndex].progressScene == 'standstation'"></Tool-Bar>
 
       <div id="lesson3ddraw" class="lesson3ddraw">
@@ -31,7 +39,6 @@
     </div>
 
     <Lesson-Progress
-
       :lessonData='lessonData'
       @addProgress="addProgress"
       @changeProgressView="changeProgressView"
@@ -83,6 +90,7 @@
   import { Lesson3dEditor } from '@/jlmap3d/lesson3dedit/lesson3deditor.js';
 
   import { LessonData } from '@/jlmap3d/lesson3dedit/model/lessondata.js';
+  import { JobPaneData } from '@/jlmap3d/lesson3dedit/toolsmodel/jobpanedata.js';
 
   import { getLesson3dData,updateLesson3dData } from '@/api/jmap/lesson3d';
   export default {
@@ -114,7 +122,7 @@
             ]
           }
         },
-
+        jobPaneData:{},
         lessonEditIndex:0,
         lessonTools:[
           {
@@ -162,26 +170,37 @@
           let dom = document.getElementById('lesson3ddraw');
 
           this.lessonData = new LessonData();
+          this.jobPaneData = new JobPaneData();
+          let loadData;
           if(data.data.data){
-            let loadData = JSON.parse(data.data.data);
+            loadData = JSON.parse(data.data.data);
+
+
+            this.jobPaneData.dataList = loadData.toolJobPane;
+            this.$refs.jobpane.initJobList(this.jobPaneData.dataList);
 
             this.lessonTools = loadData.lessonTools;
             this.lessonData.loadLessonProgress(loadData.lessonProgress);
           }else{
             this.lessonData.initLessonProgress();
+            this.$refs.jobpane.initJobList(this.jobPaneData.dataList);
           }
-
-          this.jl3d = new Lesson3dEditor(dom,this.lessonData);
+          console.log("loaddata----------------");
+          console.log(loadData);
+          this.jl3d = new Lesson3dEditor(dom,loadData);
         }).catch(() => {
         });
-
-
-
       },
 
       saveLesson3dData(){
         this.lessonData.lessonData.lessonTools = this.lessonTools;
         let saveData = this.lessonData.lessonData;
+        saveData.toolJobPane = this.jobPaneData.dataList;
+
+        let assetModelData = this.jl3d.saveAssetModel();
+        saveData.assetList = assetModelData.assetList;
+        saveData.modelList = assetModelData.modelList;
+
         this.netData.data = JSON.stringify(saveData);
         // console.log();
         updateLesson3dData(this.$route.query.lessonId,this.netData).then(data => {
@@ -205,7 +224,11 @@
       },
       setupclick(){
 
-      }
+      },
+      createModel(assetData,mousePos){
+        this.jl3d.createModelTrigger(assetData,mousePos);
+      },
+
 
     },
 

src/views/jlmap3d/lesson3dedit/tools/jobpane.vue

@@ -2,27 +2,38 @@
 
   <div class="jobpanediv">
     <div class="jobshowbutton" @click="openList">岗位联络</div>
-
     <div class="joblistdiv" v-show="showJobList">
-      <div class="jobdiv" v-for="(jobitem,index) in jobList" >{{jobitem.name}}</div>
+      <div class="jobdiv" v-for="(jobitem,index) in jobList" @click="selectJob(jobitem)" >{{jobitem.name}}</div>
     </div>
-
-    <el-tabs class="jobtab" v-show="showJob">
-      <el-tab-pane v-for="(item,index) in jobUse" label-width="33%" :key="item.name" :label="item.name">
-
+    <div class="jobtab" v-if="selectedJob">
+      <div class="jobtabmsg" >
+        <div class="jobtabmsgdiv" >{{selectedJob.name}}</div>
+        <div class="jobtabmsgtext" >{{selectedJob.text}}</div>
+      </div>
+      <div class="eltabpaneover" >
+        <el-tabs >
+          <el-tab-pane v-for="(item,index) in selectedJob.controlList" label-width="33%" :key="item.name" :label="item.name" >
+            <div class="addjobdivs" v-for="(itemin,indexin) in selectedJob.controlList[index].data" @click="selsectJobTool(itemin)">{{itemin.text}}</div>
+            <div class="addjobdiv" @click="addjob(index)">添加</div>
           </el-tab-pane>
         </el-tabs>
+      </div>
 
     </div>
+  </div>
 
 </template>
 <script>
   import Vue from 'vue';
   import localStore from 'storejs';
 	import { JL3D_LOCAL_STATIC } from '@/api/jlmap3d/assets3d.js';
+
+
   //岗位
   export default {
     name: 'JobPane',
+    props:['jobPaneData','lessonData','lessonEditIndex'],
+
     components: {
 
     },
@@ -31,17 +42,7 @@
         jobList:[],
         showJobList:false,
         showJob:false,
-        jobUse:[
-          {
-            name:"联控"
-          },
-          {
-            name:"动作"
-          },
-          {
-            name:"口呼"
-          },
-        ],
+        selectedJob:null,
       }
     },
     computed: {
@@ -51,7 +52,7 @@
 
     },
     mounted() {
-      this.initJobList();
+      // this.initJobList();
     },
     beforeDestroy() {
 
@@ -60,71 +61,35 @@
       openList(){
         if(this.showJobList ==false){
           this.showJobList = true;
-          this.showJob = true;
+          // this.showJob = true;
         }else{
           this.showJobList = false;
-          this.showJob = false;
+          this.selectedJob = null;
         }
 
       },
-      initJobList(){
-        this.jobList = [
-          {
-            name:"值班站长",
-            picurl:"",
-          },
-          {
-            name:"行车值班员",
-            picurl:"",
-          },
-          {
-            name:"客运值班员",
-            picurl:"",
-          },
-          {
-            name:"票厅岗",
-            picurl:"",
-          },
-          {
-            name:"站台岗",
-            picurl:"",
-          },
-          {
-            name:"站长",
-            picurl:"",
-          },
-          {
-            name:"分部助理",
-            picurl:"",
-          },
-          {
-            name:"行车调度",
-            picurl:"",
-          },
-          {
-            name:"生产调度",
-            picurl:"",
-          },
-          {
-            name:"厅巡岗",
-            picurl:"",
-          },
-          {
-            name:"地铁公安",
-            picurl:"",
-          },
-          {
-            name:"120",
-            picurl:"",
-          },
-          {
-            name:"119",
-            picurl:"",
-          },
-        ];
+      initJobList(data){
+        this.jobList = data;
+        console.log(data);
       },
+      selectJob(item){
+        console.log(item);
+        this.selectedJob = item;
 
-
+      },
+      addjob(index){
+        this.selectedJob.controlList[index].data.push({
+          cname:"1",
+          text:"123",
+          nextNode:"null",
+          sceneId:this.lessonData.lessonData.lessonProgress[this.lessonEditIndex].id,
+          type:"",
+        });
+      },
+      selsectJobTool(selectTool){
+        lesson3dSelect('toolproperty','jobpane',selectTool);
+        console.log(selectTool);
+      },
     },
 
   }
@@ -175,6 +140,7 @@
     background-color: #fff;
   }
 
+
   .jobtab{
     position: absolute;
 
@@ -185,5 +151,56 @@
     background-color: #fff;
   }
 
+  .eltabpaneover{
+    width:300px;
+    height:350px;
+    overflow-y:auto;
+    overflow-x:hidden;
+  }
+
+  .jobtabmsg{
+    width:300px;
+    height:100px;
+    border:solid 2px #000;
+    // position: relative;
+  }
+
+  .jobtabmsgdiv{
+    width:80px;
+    height:80px;
+    position:absolute;
+    top:10px;
+    left:5px;
+    border:solid 2px #000;
+    background-color: #fff;
+  }
+
+  .jobtabmsgtext{
+    width:200px;
+    height:80px;
+    // margin-top: 5px;
+    // margin-left: 2px;
+    border:solid 2px #000;
+    background-color: #fff;
+    position: absolute;
+    font-size: 12px;
+    right:10px;
+    top:10px;
+  }
+
+  .addjobdivs{
+
+    width:98%;
+    margin: 1%;
+    border:solid 2px #000;
+  }
+
+  .addjobdiv{
+    width:98%;
+    height:50px;
+    margin: 1%;
+    border:solid 2px #000;
+  }
+
 
 </style>