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

This commit is contained in:
sunzhenyu 2021-04-09 18:21:24 +08:00
parent fb00e1418e
commit cea95f9d92
17 changed files with 99194 additions and 2150 deletions

View File

@ -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 ) {
if(asset.assetType == "default"){
scene.add(object);
}else if(asset.assetType == 'loadModel'){
scope.loadAsset.push(object);
scene.add(object);
}
asset.mesh = object;
resolve();
} );

View File

@ -65,7 +65,12 @@ export function Lesson3dEditor(dom,lessonData) {
lesson3dUpdateControl(scope.controls);
let assetModelManager = new AssetModelManager(scene);
assetModelManager.lessonAssetsLoader();
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();
}
}

View File

@ -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;
}
}

View File

@ -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:[],
},
],
},
];
}

View File

@ -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){
}
}

View File

@ -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="模型信息">

View File

@ -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);
},
},

View File

@ -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>

View File

@ -3,7 +3,7 @@
<div id="propertydiv" class="propertydiv">
<el-tabs v-model="activeName" class="activediv" type="card" @tab-click="handleClick">
<el-tab-pane label="当前场景信息" name="cameraproperty">
<el-form ref="form" class="camerapropertydiv" label-width="130px" size="mini" v-if="selectLesson3dControl">
<el-form ref="form" class="camerapropertydiv" label-width="130px" size="mini" v-if="selectLesson3dControl">
<el-select v-model="lessonData.lessonData.lessonProgress[lessonEditIndex].progressScene" placeholder="请选择场景">
<el-option label="车站" value="standstation"></el-option>
<el-option label="停车场" value="stopstation"></el-option>
@ -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>

View File

@ -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);
},
},

View File

@ -2,17 +2,24 @@
<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>
<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>
<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">
</el-tab-pane>
</el-tabs>
</div>
</div>
</template>
@ -20,9 +27,13 @@
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>

1029
static/three.min.js vendored

File diff suppressed because one or more lines are too long

49188
static/three.module.js Normal file

File diff suppressed because one or more lines are too long

49188
static/three.moduleold.js Normal file

File diff suppressed because one or more lines are too long

1010
static/threeold.min.js vendored

File diff suppressed because one or more lines are too long