修改三维课程联控菜单位置,修改三维模型添加bug,修改移动模型指示器,修改操作切换,修改模型场景中显示移除逻辑,修改事件触发器逻辑

This commit is contained in:
sunzhenyu 2021-05-20 17:06:28 +08:00
parent a8d89df500
commit 5392755eda
22 changed files with 1778 additions and 123 deletions

View File

@ -51,10 +51,10 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) {
let assetModelManager = new AssetModelManager(scene,controlManager);
assetModelManager.lessonAssetsLoader(lessonData.assetList,lessonData.modelList).then((result) => {
animateManager.initAnimation(assetModelManager);
controlManager.init(animateManager.actions);
controlManager.init(animateManager.actions,assetModelManager);
if(lessonData.lessonProgress[lessonIndex].action.length>0){
controlManager.changeIndexEvent(lessonData.lessonProgress[lessonIndex].action,assetModelManager.lessonTriggerList);
controlManager.changeIndexEvent(lessonData.lessonProgress[lessonIndex].action,true,assetModelManager.lessonTriggerList);
}
startLesson();
@ -66,19 +66,33 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) {
this.actionModelControl = function(actionType,actionModel){
console.log(actionType);
console.log(actionModel);
if(actionType == "remove"){
assetModelManager.otherModel.remove(actionModel);
}else if(actionType == "changeIndex"){
actionModel.visible = true;
assetModelManager.otherModel.add(actionModel);
}
}
this.actionRemove = function(actionModel){
assetModelManager.otherModel.remove(actionModel);
}
this.changeIndex = function(nowIndex){
lessonIndex = nowIndex;
controlManager.changeIndexEvent(lessonData.lessonProgress[lessonIndex].action);
if(lessonData.lessonProgress[lessonIndex].roleName == nowRole){
controlManager.initRoleMode(true);
controlManager.initControlMode(lessonIndex);
controlManager.initRoleMode(true,nowRole);
controlManager.changeIndexEvent(lessonData.lessonProgress[lessonIndex].action,true);
}else{
controlManager.initRoleMode(false);
controlManager.initRoleMode(false,nowRole);
controlManager.changeIndexEvent(lessonData.lessonProgress[lessonIndex].action,false);
}
}
@ -89,6 +103,7 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) {
this.initNowRole = function(role){
nowRole = role;
controlManager.initControlMode(lessonIndex);
if(lessonData.lessonProgress[lessonIndex].roleName == nowRole){
controlManager.initRoleMode(true);
}else{
@ -104,6 +119,9 @@ export function Lesson3dPlayer(dom,lessonData,lessonIndex) {
if(controlManager.controlMode == "fps"){
controlManager.updateFpsControl();
}
if(controlManager.controlMode == "non"){
controlManager.updateOrbitControl();
}
animateManager.updateAnimation();
requestAnimationFrame(animate);

View File

@ -68,6 +68,7 @@ export function AssetModelManager(scene) {
//场景中可触发事件模型
this.lessonTriggerList = [];
//加载课程资源
this.lessonAssetsLoader = function(assetList,modelList){
let initlist = [];
@ -95,6 +96,7 @@ export function AssetModelManager(scene) {
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;
@ -106,7 +108,9 @@ export function AssetModelManager(scene) {
newModelTrigger.rotation.x = modelList[i].rot.x;
newModelTrigger.rotation.y = modelList[i].rot.y;
newModelTrigger.rotation.z = modelList[i].rot.z;
scope.otherModel.add(newModelTrigger);
if(modelList[i].visible == true){
scope.otherModel.add(newModelTrigger);
}
scope.lessonTriggerList.push(newModelTrigger);
}
@ -122,6 +126,9 @@ export function AssetModelManager(scene) {
}
this.addActionModel = function(actionModel){
scope.otherModel.add(actionModel);
}
// <el-option label="车站" value="standstation"></el-option>
// <el-option label="停车场" value="stopstation"></el-option>

View File

@ -13,7 +13,7 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
this.controls = {};
this.nowCamera = null;
this.eventHitMode = false;
let nowRole = "";
let roleMode = false;
let eventBoxs = [];
let raycasterBoxs = [];
@ -49,7 +49,7 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
let attachBox = new THREE.Mesh(
new THREE.BoxGeometry(1, 5, 1),
new THREE.MeshBasicMaterial({color: 0xff00000})//RED box
new THREE.MeshBasicMaterial({color: 0xff00000,transparent: true,opacity: 0 })//RED box
);
let hitBox = new THREE.Box3(new THREE.Vector3(), new THREE.Vector3());
hitBox.setFromObject(attachBox);
@ -62,7 +62,7 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
const SPHERE_RADIUS = 0.1;
const sphereGeometry = new THREE.SphereGeometry( SPHERE_RADIUS, 16, 16 );
const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0x888855, roughness: 0.8, metalness: 0.5 } );
const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0x888855, roughness: 0.8, metalness: 0.5, } );
const spheres = [];
let sphereIdx = 0;
@ -78,15 +78,6 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
}
scope.controlMode = lessonData.lessonProgress[lessonIndex].controlMode;
// scope.controls = oribitControl;
if(scope.controlMode == "free"){
scope.nowCamera = orbitCamera;
scope.controls.enabled = true;
}else if(scope.controlMode == "fps"){
scope.nowCamera = fpsCamera;
scope.controls.enabled = false;
}
let loaderObj = new THREE.OBJLoader();
let pengzhuang;
@ -111,25 +102,27 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
}
);
this.initRoleMode = function(rMode){
this.initRoleMode = function(rMode,role){
roleMode = rMode;
nowRole = role;
console.log(roleMode);
};
const worldOctree = new Octree();
const playerCollider = new Capsule( new THREE.Vector3( 0, 10, 0 ), new THREE.Vector3( 0, 11.9, 0 ), 1 );
playerCollider.set(
new THREE.Vector3(
lessonData.lessonProgress[lessonIndex].cameraPosition.x,
lessonData.lessonProgress[lessonIndex].cameraPosition.y,
lessonData.lessonProgress[lessonIndex].cameraPosition.z),
new THREE.Vector3(
lessonData.lessonProgress[lessonIndex].cameraPosition.x,
lessonData.lessonProgress[lessonIndex].cameraPosition.y+1.5,
lessonData.lessonProgress[lessonIndex].cameraPosition.z ), 1);
attachBox.position.x = lessonData.lessonProgress[lessonIndex].cameraPosition.x;
attachBox.position.y = lessonData.lessonProgress[lessonIndex].cameraPosition.y ;
attachBox.position.z = lessonData.lessonProgress[lessonIndex].cameraPosition.z;
// playerCollider.set(
// new THREE.Vector3(
// lessonData.lessonProgress[lessonIndex].cameraPosition.x,
// lessonData.lessonProgress[lessonIndex].cameraPosition.y,
// lessonData.lessonProgress[lessonIndex].cameraPosition.z),
// new THREE.Vector3(
// lessonData.lessonProgress[lessonIndex].cameraPosition.x,
// lessonData.lessonProgress[lessonIndex].cameraPosition.y+1.5,
// lessonData.lessonProgress[lessonIndex].cameraPosition.z ), 1);
// attachBox.position.x = lessonData.lessonProgress[lessonIndex].cameraPosition.x;
// attachBox.position.y = lessonData.lessonProgress[lessonIndex].cameraPosition.y ;
// attachBox.position.z = lessonData.lessonProgress[lessonIndex].cameraPosition.z;
@ -145,6 +138,7 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
this.updateOrbitControl = function(){
oribitControl.update();
render(orbitCamera);
};
this.updateFpsControl = function(){
@ -173,6 +167,8 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
if(eventBoxs[i].action.actionMode == "jump"){
jumpEvent("action",eventBoxs[i].action);
actionEvent("remove",eventBoxs[i].action,eventBoxs[i].mesh);
}
console.log("slice");
eventBoxs.splice(i,1);
@ -196,16 +192,14 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
// }
}
render();
render(fpsCamera);
};
this.init = function(actions){
// worldOctree.fromGraphNode( object.getObjectByName("Object173") );
worldOctree.fromGraphNode( pengzhuang );
actionList = actions;
// scope.controlMode = lessonData.lessonProgress[lessonIndex].controlMode;
}
this.updatePos = function(pos){
@ -270,10 +264,6 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
}
}
}
} );
@ -458,17 +448,51 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
}
function render(){
if(scope.nowCamera){
renderer.render( scene, scope.nowCamera );
}
function render(camera){
renderer.render( scene, camera );
}
window.onresize = function () {
renderer.setSize(dom.offsetWidth,dom.offsetHeight);
}
this.changeIndexEvent = function(actions,lessonTriggerList){
this.initControlMode = function(nowLessonIndex){
scope.controlMode = lessonData.lessonProgress[nowLessonIndex].controlMode;
if(lessonData.lessonProgress[nowLessonIndex].changeCamera == true){
if(scope.controlMode == "free" || scope.controlMode == "non"){
scope.nowCamera = orbitCamera;
oribitControl.enabled = true;
orbitCamera.position.x = lessonData.lessonProgress[nowLessonIndex].cameraPosition.x;
orbitCamera.position.y = lessonData.lessonProgress[nowLessonIndex].cameraPosition.y;
orbitCamera.position.z = lessonData.lessonProgress[nowLessonIndex].cameraPosition.z;
oribitControl.target = new THREE.Vector3(lessonData.lessonProgress[nowLessonIndex].cameraTarget.x,lessonData.lessonProgress[nowLessonIndex].cameraTarget.y,lessonData.lessonProgress[nowLessonIndex].cameraTarget.z);
scope.updateOrbitControl();
if(scope.controlMode == "non"){
oribitControl.enabled = false;
}
}else if(scope.controlMode == "fps"){
scope.nowCamera = fpsCamera;
oribitControl.enabled = false;
playerCollider.set(
new THREE.Vector3(
lessonData.lessonProgress[nowLessonIndex].cameraPosition.x,
lessonData.lessonProgress[nowLessonIndex].cameraPosition.y,
lessonData.lessonProgress[nowLessonIndex].cameraPosition.z),
new THREE.Vector3(
lessonData.lessonProgress[nowLessonIndex].cameraPosition.x,
lessonData.lessonProgress[nowLessonIndex].cameraPosition.y+1.5,
lessonData.lessonProgress[nowLessonIndex].cameraPosition.z ), 1);
attachBox.position.x = lessonData.lessonProgress[nowLessonIndex].cameraPosition.x;
attachBox.position.y = lessonData.lessonProgress[nowLessonIndex].cameraPosition.y ;
attachBox.position.z = lessonData.lessonProgress[nowLessonIndex].cameraPosition.z;
}
}
}
this.changeIndexEvent = function(actions,rMode,lessonTriggerList){
if(lessonTriggerList){
eventTrigger = lessonTriggerList;
scope.eventHitMode = true;
@ -477,8 +501,9 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
// let newEventBoxs = [];
// eventBoxs = newEventBoxs;
raycasterBoxs = [];
if(actions.length>0){
roleMode = rMode;
console.log(roleMode);
if(actions.length>0 && roleMode){
for(let i=0;i<actions.length;i++){
if(actions[i].actionType == "auto"){
if(actions[i].actionMode == "play"){
@ -499,11 +524,12 @@ export function ControlManager(dom,scene,lessonData,lessonIndex) {
for(let j=0;j<eventTrigger.length;j++){
if(eventTrigger[j].label == actions[i].actionModel){
let eventTestBox = new THREE.Box3(new THREE.Vector3(), new THREE.Vector3());
eventTestBox.setFromObject(eventTrigger[j]);
eventTestBox.mesh = eventTrigger[j];
eventTestBox.action = actions[i];
eventBoxs.push(eventTestBox);
console.log("changeindex");
actionEvent("changeIndex",eventBoxs[i].action,eventTestBox.mesh);
}
}
}

View File

@ -211,6 +211,29 @@ export function JobPaneData() {
},
],
},
{
name:"厅巡岗",
value:"txg",
text:"",
picurl:"",
controlList:[
//联控
{
name:"联控",
data:[],
},
//动作
{
name:"动作",
data:[],
},
//口呼
{
name:"口呼",
data:[],
},
],
},
{
name:"平台岗",
value:"ptg",

View File

@ -167,7 +167,16 @@ export function AssetModelManager(scene) {
});
}
this.deleteAsset = function(selectModel){
scope.otherModel.remove(selectModel);
for(let i=0;i<scope.lessonTriggerList.length;i++){
if(scope.lessonTriggerList[i].uuid == selectModel.uuid){
scope.lessonTriggerList.splice(i,1);
updateTriggerList(scope.lessonTriggerList);
break;
}
}
}
// <el-option label="车站" value="standstation"></el-option>
// <el-option label="停车场" value="stopstation"></el-option>
@ -200,11 +209,12 @@ export function AssetModelManager(scene) {
//动态加载资源
this.lessonAssetsNewLoader = function(assetData,pos){
let isLoaded = false;
var rand = Math.floor(Math.random () * 900) + 100;
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.label = assetData.packageName +rand;
newModelTrigger.position.copy(pos);
scope.otherModel.add(newModelTrigger);
scope.lessonTriggerList.push(newModelTrigger);
@ -212,7 +222,7 @@ export function AssetModelManager(scene) {
}else{
scope.loadAsset[assetData.id] = {
modelId:assetData.id,
packageName:assetData.packageName,
packageName:assetData.packageName +rand,
url:assetData.url,
mesh:"",
assetType:'loadModel',
@ -220,12 +230,16 @@ export function AssetModelManager(scene) {
resourceType:"三维课程",
};
console.log("new");
fbxpromise(scope.loadAsset[assetData.id]).then(function(object){
console.log(scope.loadAsset[assetData.id].mesh);
let newModelTrigger = scope.loadAsset[assetData.id].mesh.clone(true);
newModelTrigger.showType = "loadModel";
newModelTrigger.modelId = assetData.id;
newModelTrigger.label = assetData.packageName;
newModelTrigger.label = assetData.packageName+rand;
newModelTrigger.position.copy(pos);
scope.otherModel.add(newModelTrigger);
scope.lessonTriggerList.push(newModelTrigger);

File diff suppressed because it is too large Load Diff

View File

@ -12,12 +12,11 @@ import { SkeletonUtils } from '@/jlmap3d/main/utils/SkeletonUtils.js';
import { AssetModelManager } from '@/jlmap3d/lesson3dedit/assetmodelmanager/assetmodelmanager.js';
import { StationManagerControls } from '@/jlmap3d/jl3dstationmanager/controls/TransformControls';
import { TransformControls } from '@/jlmap3d/lesson3dedit/controls/TransformControls';
//动画播放相关
let clock = new THREE.Clock();
let delta;
let scene;
export function Lesson3dEditor(dom,lessonData) {
@ -88,7 +87,6 @@ export function Lesson3dEditor(dom,lessonData) {
assetModelManager.lessonAssetsLoader();
}
animate();
@ -137,4 +135,9 @@ export function Lesson3dEditor(dom,lessonData) {
this.attachModel = function(selectModel){
transcontrol.attach(selectModel);
}
this.deleteModel = function(selectModel){
transcontrol.detach();
assetModelManager.deleteAsset(selectModel);
}
}

View File

@ -211,6 +211,29 @@ export function JobPaneData() {
},
],
},
{
name:"厅巡岗",
value:"txg",
text:"",
picurl:"",
controlList:[
//联控
{
name:"联控",
data:[],
},
//动作
{
name:"动作",
data:[],
},
//口呼
{
name:"口呼",
data:[],
},
],
},
{
name:"平台岗",
value:"ptg",

View File

@ -2,9 +2,9 @@ export function getBaseUrl() {
let BASE_API;
if (process.env.NODE_ENV === 'development') {
// BASE_API = 'https://joylink.club/jlcloud';
// BASE_API = 'https://test.joylink.club/jlcloud';
BASE_API = 'https://test.joylink.club/jlcloud';
// BASE_API = 'http://192.168.8.107:9000'; // 袁琪
BASE_API = 'http://192.168.3.83:9000'; // 旭强 有线
// BASE_API = 'http://192.168.3.83:9000'; // 旭强 有线
// BASE_API = 'http://192.168.8.114:9000'; // 旭强 无线
// BASE_API = 'http://192.168.3.120:9000'; // 张赛
// BASE_API = 'http://192.168.8.140:9000'; // 杜康

View File

@ -176,7 +176,6 @@ export default {
},
handleDelete(index, row) {
console.log(row);
deleteAssetData(row.id).then(netdata => {
this.tableData.splice(index, 1);
console.log(netdata);

View File

@ -312,8 +312,12 @@
value:"null",
},
{
name:"跳转",
name:"总是跳转",
value:"jump",
},
{
name:"条件跳转",
value:"limitjump",
}
],
}

View File

@ -273,7 +273,7 @@
this.jl3d.attachModel(selectedModel);
},
deleteModel(selectedModel){
this.jl3d.deleteModel(selectedModel);
},
setupclick(){

View File

@ -1,8 +1,8 @@
<template>
<div class="explainpanediv" v-if="lessonData.lessonData.lessonProgress[lessonEditIndex]" @click="selectTool">
<div class="explainpanetittle" >
<!-- <div class="explainpanetittle" >
{{lessonData.lessonData.lessonProgress[lessonEditIndex].explainPane.tittle}}
</div>
</div> -->
<div class="explainpanepic" :style="{'background-image': 'url('+localStatic+lessonData.lessonData.lessonProgress[lessonEditIndex].explainPane.picurl+')'}" >
</div>
@ -12,7 +12,7 @@
<div class="nextbuttondiv"
:style="{'background-image': 'url('+staticImg+'/lesson3d/nextbutton.png)'}"
v-if="lessonData.lessonData.lessonProgress[lessonEditIndex].explainPane.explainPaneType=='jump'"></div>
v-if="lessonData.lessonData.lessonProgress[lessonEditIndex].explainPane.explainPaneType=='jump' || (lessonData.lessonData.lessonProgress[lessonEditIndex].explainPane.explainPaneType == 'limitjump' && lessonData.lessonData.lessonProgress[lessonEditIndex].value == 'zbzz')"></div>
</div>
</template>

View File

@ -83,7 +83,7 @@
addjob(index){
this.selectedJob.controlList[index].data.push({
cname:this.generateUUID(),
text:"123",
text:"内容",
explainRole:"角色",
nextNode:"null",
sceneId:this.lessonData.lessonData.lessonProgress[this.lessonEditIndex].id,
@ -117,10 +117,9 @@
position: absolute;
// height: 500px;
min-width: 100px;
right:0;
top:0;
left:0;
bottom:0;
// border:solid 2px #000;
z-index:1;
}
@ -128,8 +127,8 @@
position: absolute;
width:100px;
height:50px;
right:0;
top:0;
left:0;
bottom:0;
border:solid 2px #000;
background-color: #fff;
}
@ -138,8 +137,8 @@
position: absolute;
width:100px;
height:450px;
right:0;
top:50px;
left:0;
bottom:50px;
border:solid 2px #000;
overflow-y: auto;
overflow-x: hidden;
@ -159,8 +158,8 @@
.jobtab{
position: absolute;
right:100px;
top:50px;
left:100px;
bottom:50px;
width: 300px;
height:450px;
background-color: #fff;

View File

@ -131,8 +131,8 @@
position: absolute;
width: 240px;
height: 80px;
left:0;
bottom:0;
right:0;
top:0;
border-radius:10px;
border:solid 2px #000;
// background-color: #fff;
@ -150,8 +150,8 @@
.toolbarguides{
position: absolute;
bottom: 80px;
left:0;
top: 80px;
right:0;
width:100px;
height:350px;
overflow-y: auto;

View File

@ -193,7 +193,7 @@
for(let i=0;i<this.jobPaneData.dataList.length;i++){
if(job == this.jobPaneData.dataList[i].name){
this.nowRole = this.jobPaneData.dataList[i].value;
console.log(this.nowRole);
console.log(this.nowRole);
this.jl3d.initNowRole(this.nowRole);
}
}
@ -229,18 +229,15 @@
if(type == "jump"){
this.lessonPlayIndex = action.nextNode;
}
console.log(type);
console.log(action);
this.jl3d.changeIndex(this.lessonPlayIndex);
},
actionEvent(type,action,mesh){
if(type == "remove"){
this.jl3d.actionRemove(mesh);
}
this.jl3d.actionModelControl(type,mesh);
// this.jl3d.actionRemove(mesh);
},
updateTriggerList(newTriggerList){
this.triggerList = newTriggerList;
console.log(this.triggerList);
},
changeCameraPos(pos){
this.jl3d.changeCameraPos(pos);

View File

@ -3,9 +3,9 @@
v-if="lessonData.lessonData.lessonProgress[lessonPlayIndex]"
:style="{'background-image': 'url('+lessonbg+')'}">
<div class="explainpanetittle" >
<!-- <div class="explainpanetittle" >
{{lessonData.lessonData.lessonProgress[lessonPlayIndex].explainPane.tittle}}
</div>
</div> -->
<div class="explainpanepic" :style="{'background-image': 'url('+localStatic+lessonData.lessonData.lessonProgress[lessonPlayIndex].explainPane.picurl+')'}" >
</div>
@ -14,7 +14,7 @@
</div>
<div class="nextbuttondiv"
:style="{'background-image': 'url('+staticImg+'/lesson3d/nextbutton.png)'}"
v-if="lessonData.lessonData.lessonProgress[lessonPlayIndex].explainPane.explainPaneType=='jump' "
v-if="lessonData.lessonData.lessonProgress[lessonPlayIndex].explainPane.explainPaneType=='jump'|| (lessonData.lessonData.lessonProgress[lessonPlayIndex].explainPane.explainPaneType == 'limitjump' && lessonData.lessonData.lessonProgress[lessonPlayIndex].value == nowRole) "
@click="explainJump"></div>
</div>
</template>
@ -54,7 +54,7 @@
// lesson3dSelect('toolproperty','explainpane');
// },
explainJump(){
if(this.lessonData.lessonData.lessonProgress[this.lessonPlayIndex].explainPane.explainPaneType == "jump"){
if(this.lessonData.lessonData.lessonProgress[this.lessonPlayIndex].explainPane.explainPaneType == "jump" || (this.lessonData.lessonData.lessonProgress[this.lessonPlayIndex].explainPane.explainPaneType == "limitjump")){
this.$emit('jumpEvent','jump',this.lessonData.lessonData.lessonProgress[this.lessonPlayIndex].explainPane);
}
},
@ -80,7 +80,7 @@
.explainpanetittle{
// height:15%;
text-align: center;
font-size: 20px;
font-size: 25px;
}
.explainpanepic{
@ -96,7 +96,7 @@
position:relative;
left:5%;
width:90%;
font-size: 14px;
font-size: 20px;
// height:20%;
}

View File

@ -116,8 +116,8 @@
position: absolute;
// height: 500px;
min-width: 100px;
right:0;
top:0;
left:0;
bottom:0;
// border:solid 2px #000;
z-index:1;
}
@ -134,8 +134,8 @@
position: absolute;
width:100px;
height:50px;
right:0;
top:0;
left:0;
bottom:0;
border:solid 2px #000;
text-align: center;
// background-color: #fff;
@ -148,8 +148,8 @@
position: absolute;
width:100px;
height:450px;
right:0;
top:50px;
left:0;
bottom:50px;
border:solid 2px #000;
overflow-y: auto;
overflow-x: hidden;
@ -175,8 +175,8 @@
.jobtab{
position: absolute;
right:100px;
top:50px;
left:100px;
bottom:50px;
width: 300px;
height:450px;
color:#fff;

View File

@ -5,7 +5,7 @@
<el-tabs type="border-card"
:style="{'background-image': 'url('+lessonbg+')'}">
<el-tab-pane label="进程" style="overflow-y:auto;">
<div id="tabdiv" class = "tabdiv">
<div id="tabdiv1" class = "tabdiv1">
<div class="processtext" v-for="(processItem,index) in processTexts">
{{processItem.text}}
</div>
@ -16,7 +16,7 @@
</el-tab-pane>
<el-tab-pane label="日志" >
<div id="tabdiv" class = "tabdiv">
<div id="tabdiv2" class = "tabdiv2">
<div class="logtext" v-for="(logItem,index) in logTexts">
{{logItem.text}}
</div>
@ -52,13 +52,18 @@
watch: {
'lessonPlayIndex': {
handler: function (newVal, oldVal) {
if (newVal != oldVal) {
this.logTexts.push(this.lessonData.lessonData.lessonProgress[oldVal].stepTipsData);
this.processTexts.push(this.lessonData.lessonData.lessonProgress[oldVal].stepTipsData);
this.nowProcessText = this.lessonData.lessonData.lessonProgress[newVal].stepTipsData.text;
var div = document.getElementById('tabdiv');
div.scrollTop = div.scrollHeight;
var div1 = document.getElementById('tabdiv1');
// div.scrollIntoView();
div1.scrollTop = div1.scrollHeight;
var div2 = document.getElementById('tabdiv2');
// div.scrollIntoView();
div2.scrollTop = div2.scrollHeight;
}
}
},
@ -83,38 +88,45 @@
@import "src/styles/mixin.scss";
.processlogdiv {
position: absolute;
width: 450px;
height: 250px;
width: 550px;
height: 350px;
right:0;
bottom:0;
border-radius:10px;
z-index:1;
}
.tabdiv{
.tabdiv1{
width:100%;
height:175px;
height:275px;
position: relative;
overflow-y: auto;
}
.tabdiv2{
width:100%;
height:275px;
position: relative;
overflow-y: auto;
}
.processtext{
font-size: 16px;
font-size: 20px;
color:#00ff00;
border:solid 2px #fff;
margin-top: 5px;
margin-top: 10px;
}
.processtextnow{
font-size: 16px;
font-size: 20px;
color:#ff0000;
border:solid 2px #fff;
margin-top: 5px;
margin-top: 10px;
}
.logtext{
font-size: 16px;
font-size: 20px;
color:#00ff00;
border:solid 2px #fff;
margin-top: 5px;
margin-top: 10px;
}

View File

@ -70,10 +70,10 @@
}
.stepstipstittle{
text-align: center;
font-size: 20px;
font-size: 25px;
}
.stepstipstext{
font-size: 16px;
font-size: 20px;
}

View File

@ -12,7 +12,8 @@
</div>
<div class="toolbarbutton"
:style="{'background-image': 'url('+localstatic+'/lesson3d/back.png)'}">
:style="{'background-image': 'url('+localstatic+'/lesson3d/back.png)'}"
@click="openBack">
</div>
<div class="toolbarguides"
@ -84,6 +85,9 @@
this.showBag = false;
}
},
openBack(){
history.go(-1);
},
changeCameraPos(guide){
this.$emit('changeCameraPos',guide.pos);
},
@ -179,8 +183,8 @@
position: absolute;
width: 240px;
height: 80px;
left:0;
bottom:0;
right:0;
top:0;
border-radius:10px;
border:solid 2px #000;
z-index:1;
@ -198,8 +202,8 @@
.toolbarguides{
position: absolute;
bottom: 80px;
left:0;
top: 80px;
right:0;
width:100px;
height:350px;
overflow-y: auto;
@ -222,8 +226,8 @@
.toolbarbag{
position: absolute;
bottom: 80px;
left:0;
top: 80px;
right:0;
width:240px;
height:320px;
overflow-y: auto;

Binary file not shown.