joylink/rt-sim-training-client
6
0
Fork 0
Code Issues 3 Pull Requests Actions Packages Projects Releases Wiki Activity

修改三维单体设备信号机亮灯逻辑，修改三维课程编辑播放器

Browse Source
This commit is contained in:
sunzhenyu 2021-04-16 13:18:59 +08:00
parent 2412aac899
commit 72d0bb084f
13 changed files with 1092 additions and 115 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

78
src/jlmap3d/jl3ddevice/jl3ddeviceNew.js
View File

@ -509,26 +509,28 @@ export function Jl3ddeviceNew(dom,group,token,skinCode) {
}
if (data.type == "SIGNAL") {//从上往下红绿黄
if(data.red == 1){
scope.modelmanager.signalmodel.mesh.children[0].material.map = scope.signallights["red"];
scope.modelmanager.signalmodel.mesh.children[0].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d001").material.map = scope.signallights["red"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d001").material.map.needsUpdate = true;
}else{
scope.modelmanager.signalmodel.mesh.children[0].material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.children[0].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d001").material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d001").material.map.needsUpdate = true;
}
if(data.yellow == 1){
scope.modelmanager.signalmodel.mesh.children[2].material.map = scope.signallights["yellow"];
scope.modelmanager.signalmodel.mesh.children[2].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d002").material.map = scope.signallights["yellow"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d002").material.map.needsUpdate = true;
}else{
scope.modelmanager.signalmodel.mesh.children[2].material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.children[2].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map.needsUpdate = true;
}
if(data.green == 1){
scope.modelmanager.signalmodel.mesh.children[1].material.map = scope.signallights["green"];
scope.modelmanager.signalmodel.mesh.children[1].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map = scope.signallights["green"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map.needsUpdate = true;
}else{
scope.modelmanager.signalmodel.mesh.children[1].material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.children[1].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map.needsUpdate = true;
}
}
@ -541,7 +543,7 @@ export function Jl3ddeviceNew(dom,group,token,skinCode) {
scope.modelmanager.standmodel.action.time = 0;
scope.modelmanager.standmodel.action.timeScale = 1;
scope.modelmanager.standmodel.action.play();
console.log(data);
localVoicePlay("开往"+psdVoiceStationList[data.code].finlStationName+"方向的列车进站了！");
}
@ -562,12 +564,12 @@ export function Jl3ddeviceNew(dom,group,token,skinCode) {
this.deviceFaultSet = function (data) {
if (data.type == "SIGNAL") {//从上往下红绿黄
scope.modelmanager.signalmodel.mesh.children[0].material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.children[0].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.children[2].material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.children[2].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.children[1].material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.children[1].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d001").material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d001").material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d002").material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d002").material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map.needsUpdate = true;
}
if (data.type == "PSD" || data.type == "STAND") {
scope.modelmanager.standmodel.screenDoorOpenStatus = "0";
@ -653,35 +655,37 @@ export function Jl3ddeviceNew(dom,group,token,skinCode) {
}
if (data._type == "Signal") {
if(data.logicLight == 0){
if(data.redOpen == 1){
scope.modelmanager.signalmodel.mesh.children[0].material.map = scope.signallights["red"];
scope.modelmanager.signalmodel.mesh.children[0].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d001").material.map = scope.signallights["red"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d001").material.map.needsUpdate = true;
}else{
scope.modelmanager.signalmodel.mesh.children[0].material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.children[0].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d001").material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d001").material.map.needsUpdate = true;
}
if(data.yellowOpen == 1){
scope.modelmanager.signalmodel.mesh.children[2].material.map = scope.signallights["yellow"];
scope.modelmanager.signalmodel.mesh.children[2].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d002").material.map = scope.signallights["yellow"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d002").material.map.needsUpdate = true;
}else{
scope.modelmanager.signalmodel.mesh.children[2].material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.children[2].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d002").material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d002").material.map.needsUpdate = true;
}
if(data.greenOpen == 1){
scope.modelmanager.signalmodel.mesh.children[1].material.map = scope.signallights["green"];
scope.modelmanager.signalmodel.mesh.children[1].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map = scope.signallights["green"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map.needsUpdate = true;
}else{
scope.modelmanager.signalmodel.mesh.children[1].material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.children[1].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map.needsUpdate = true;
}
}else{
scope.modelmanager.signalmodel.mesh.children[0].material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.children[0].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.children[1].material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.children[1].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.children[2].material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.children[2].material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d001").material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d001").material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d002").material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d002").material.map.needsUpdate = true;
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map = scope.signallights["black"];
scope.modelmanager.signalmodel.mesh.getObjectByName("d3d003").material.map.needsUpdate = true;
}
}

7
src/router/index.js
View File

@ -14,6 +14,8 @@ const AuthorList = () => import('@/views/authorization/list');
const Jlmap3dedit = () => import('@/views/jlmap3d/edit/jlmap3dedit');
const Jlmap3dAssetManager = () => import('@/views/jlmap3d/jl3dassetmanager/assetmanager');
const Jlmap3dLesson3dEdit = () => import('@/views/jlmap3d/lesson3dedit/lesson3dedit');
const Jlmap3dLesson3dPlayer = () => import('@/views/jlmap3d/lesson3dplayer/lesson3dplayer');
const Jlmap3d = () => import('@/views/jlmap3d/drive/jl3ddrive');
const Jlmap3dSandbox = () => import('@/views/jlmap3d/simulation/jl3dsimulation');
const Jlmap3dPassFlow = () => import('@/views/jlmap3d/passflow/jl3dpassflow');
@ -259,6 +261,11 @@ export const constantRoutes = [
component: Jlmap3dLesson3dEdit,
hidden: true
},
{
path: '/design/jlmap3d/lesson3dplayer',
component: Jlmap3dLesson3dPlayer,
hidden: true
},
{
path: '/data2json',
component: () => import('@/views/planMonitor/data2json/page.vue'),

75
src/views/jlmap3d/lesson3d/lesson3dshow.vue
View File

@ -1,75 +0,0 @@
<template>
<div id="lesson3ddiv" class="lesson3ddiv">
<div id="lesson3ddraw" class="lesson3ddraw">
</div>
<canvas id="canvastexture" width="128px" height="64px"></canvas>
</div>
</template>
<script>
import Vue from 'vue';
import localStore from 'storejs';
var train;
export default {
name: 'Lesson3dEdit',
components: {
},
data() {
return {
}
},
computed: {
},
watch: {
},
mounted() {
},
beforeDestroy() {
},
methods: {
},
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
* {
touch-action: none;
}
.lesson3ddiv {
width: 100%;
height: 100%;
}
.lesson3ddraw {
float: left;
//left:20%;
position: absolute;
width: 100%;
height: 100%;
z-inde: -1;
}
</style>

10
src/views/jlmap3d/lesson3dedit/component/property.vue
View File

@ -49,8 +49,8 @@
</el-option>
</el-select>
<el-button v-if="selectLesson3dControl" @click="">重置镜头位置</el-button>
<el-button v-if="selectLesson3dControl" @click="">记录初始镜头位置</el-button>
<el-button v-if="selectLesson3dControl" @click="resetCamera">重置镜头位置</el-button>
<el-button v-if="selectLesson3dControl" @click="recordCamera">记录初始镜头位置</el-button>
</el-form>
</el-tab-pane>
@ -273,6 +273,12 @@
},
updateData(){
// this.lessonData.lessonData.lessonProgress[this.lessonEditIndex].stepTipsData;
},
resetCamera(){
},
recordCamera(){
},
lesson3dUpdatePicurl(picAsset){
if(this.selectType == "explainpane"){

6
src/views/jlmap3d/lesson3dedit/lesson3dedit.vue
View File

@ -58,7 +58,7 @@
<el-button @click="setupclick">课程设置</el-button>
</el-row>
<el-row>
<el-button>预览课程</el-button>
<el-button @click="jumpPlayer">预览课程</el-button>
</el-row>
<el-row>
<el-button @click="saveLesson3dData">保存当前课程</el-button>
@ -252,6 +252,10 @@
this.triggerList = newTriggerList;
console.log(this.triggerList);
},
jumpPlayer(){
this.$router.push({ path: '/design/jlmap3d/lesson3dplayer', query: {lessonId: this.$route.query.lessonId} });
},
},
}

241
src/views/jlmap3d/lesson3dplayer/lesson3dplayer.vue Normal file
View File

@ -0,0 +1,241 @@
<template>
<div id="lesson3ddiv" class="lesson3ddiv">
<div class="lesson3dplayer">
<Step-Tips
:lessonData='lessonData'
:lessonEditIndex='lessonEditIndex'
v-show="lessonTools[0].isShow && lessonData.lessonData.lessonProgress[lessonEditIndex].progressScene == 'standstation'">
</Step-Tips>
<Process-Log
v-show="lessonTools[1].isShow && lessonData.lessonData.lessonProgress[lessonEditIndex].progressScene == 'standstation'">
</Process-Log>
<Explain-Pane
:lessonData='lessonData'
:lessonEditIndex='lessonEditIndex'
v-show="lessonTools[2].isShow && lessonData.lessonData.lessonProgress[lessonEditIndex].progressScene == 'standstation'">
</Explain-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">
</div>
</div>
<canvas id="canvastexture" width="128px" height="64px"></canvas>
</div>
</template>
<script>
import Vue from 'vue';
import localStore from 'storejs';
// import AssetsModel from '@/views/jlmap3d/lesson3dedit/component/assetsmodel';
import StepTips from '@/views/jlmap3d/lesson3dplayer/tools/stepstips';
import ProcessLog from '@/views/jlmap3d/lesson3dplayer/tools/processlog';
import ExplainPane from '@/views/jlmap3d/lesson3dplayer/tools/explainpane';
import JobPane from '@/views/jlmap3d/lesson3dplayer/tools/jobpane';
import ToolBar from '@/views/jlmap3d/lesson3dplayer/tools/toolbar';
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 {
name: 'Lesson3dPlayer',
components: {
// AssetsModel,
StepTips,
ProcessLog,
ExplainPane,
JobPane,
ToolBar
},
data() {
return {
jl3d: null,
netData:{
name:'',
type:'',
data:{},
},
triggerList:[],
lessonData:{
lessonData:{
lessonProgress:[
]
}
},
jobPaneData:{},
lessonEditIndex:0,
lessonTools:[
{
name:"步骤组件",
isShow:false,
},
{
name:"步骤进程日志",
isShow:false,
},
{
name:"步骤提示组件",
isShow:false,
},
{
name:"岗位联络操作",
isShow:false,
},
{
name:"导航工具栏",
isShow:false,
},
],
}
},
computed: {
},
watch: {
},
mounted() {
window.updateTriggerList = this.updateTriggerList;
this.init(this.$route.query.lessonId);
},
beforeDestroy() {
},
methods: {
init(lessonId){
getLesson3dData(lessonId).then(data => {
this.netData.name = data.data.name;
this.netData.type = data.data.type;
let dom = document.getElementById('lesson3ddraw');
this.lessonData = new LessonData();
this.jobPaneData = new JobPaneData();
let loadData;
if(data.data.data){
loadData = JSON.parse(data.data.data);
console.log(loadData);
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);
}
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 => {
console.log(data);
}).catch(() => {
});
},
updateTriggerList(newTriggerList){
this.triggerList = newTriggerList;
console.log(this.triggerList);
},
},
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
* {
touch-action: none;
}
.lesson3ddiv {
width: 100%;
height: 100%;
}
.lesson3dplayer{
width:100%;
height:100%;
position: absolute;
// top: 0;
// left:15%;
// border:solid 2px #000;
}
.lesson3ddraw {
float: left;
//left:20%;
position: absolute;
width: 100%;
height: 100%;
z-inde: -1;
}
.activediv{
position: absolute;
width: 15%;
height:100%;
left:0;
border-radius:10px;
border:solid 2px #000;
}
.lessonsetup {
position: absolute;
width: 15%;
height: 20%;
right:0;
top:0;
border-radius:10px;
border:solid 2px #000;
text-align:center;
}
.el-tabs__content{
position: absolute;
}
</style>

71
src/views/jlmap3d/lesson3dplayer/tools/actiontips.vue Normal file
View File

@ -0,0 +1,71 @@
<template>
<div class="stepstipsdiv" >
<div class="stepstipstittle" >
{{tipsTittle}}
</div>
<div class="stepstipstext" >
{{tipsText}}
</div>
</div>
</template>
<script>
import Vue from 'vue';
import localStore from 'storejs';
import { JL3D_LOCAL_STATIC } from '@/api/jlmap3d/assets3d.js';
//操作提示
export default {
name: 'ActionTips',
components: {
},
data() {
return {
tipsTittle:"步骤一",
tipsText:"步骤一",
}
},
computed: {
},
watch: {
},
mounted() {
},
beforeDestroy() {
},
methods: {
},
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.stepstipsdiv {
position: absolute;
width: 20%;
height: 20%;
left:0;
top:0;
border-radius:10px;
border:solid 2px #000;
background-color: #fff;
z-index:1;
}
.stepstipstittle{
text-align: center;
font-size: 20px;
}
.stepstipstext{
font-size: 16px;
}
</style>

71
src/views/jlmap3d/lesson3dplayer/tools/errortips.vue Normal file
View File

@ -0,0 +1,71 @@
<template>
<div class="stepstipsdiv" >
<div class="stepstipstittle" >
{{tipsTittle}}
</div>
<div class="stepstipstext" >
{{tipsText}}
</div>
</div>
</template>
<script>
import Vue from 'vue';
import localStore from 'storejs';
import { JL3D_LOCAL_STATIC } from '@/api/jlmap3d/assets3d.js';
//报错警告提示
export default {
name: 'ErrorTips',
components: {
},
data() {
return {
tipsTittle:"步骤一",
tipsText:"步骤一",
}
},
computed: {
},
watch: {
},
mounted() {
},
beforeDestroy() {
},
methods: {
},
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.stepstipsdiv {
position: absolute;
width: 20%;
height: 20%;
left:0;
top:0;
border-radius:10px;
border:solid 2px #000;
background-color: #fff;
z-index:1;
}
.stepstipstittle{
text-align: center;
font-size: 20px;
}
.stepstipstext{
font-size: 16px;
}
</style>

84
src/views/jlmap3d/lesson3dplayer/tools/explainpane.vue Normal file
View File

@ -0,0 +1,84 @@
<template>
<div class="explainpanediv" v-if="lessonData.lessonData.lessonProgress[lessonEditIndex]" @click="selectTool">
<div class="explainpanetittle" >
{{lessonData.lessonData.lessonProgress[lessonEditIndex].explainPane.tittle}}
</div>
<div class="explainpanepic" :style="{'background-image': 'url('+localStatic+lessonData.lessonData.lessonProgress[lessonEditIndex].explainPane.picurl+')'}" >
</div>
<div class="explainpanetext" >
{{lessonData.lessonData.lessonProgress[lessonEditIndex].explainPane.text}}
</div>
</div>
</template>
<script>
import Vue from 'vue';
import localStore from 'storejs';
import { JL3D_LOCAL_STATIC,BASE_ASSET_API } from '@/api/jlmap3d/assets3d.js';
export default {
name: 'ExplainPane',
props:['lessonData','lessonEditIndex'],
components: {
},
data() {
return {
localStatic:BASE_ASSET_API,
}
},
computed: {
},
watch: {
},
mounted() {
},
beforeDestroy() {
},
methods: {
selectTool(){
lesson3dSelect('toolproperty','explainpane');
},
},
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.explainpanediv {
position: absolute;
width: 25%;
height: 25%;
left:20%;
top:0;
border-radius:10px;
border:solid 2px #000;
background-color: #fff;
z-index:1;
}
.explainpanetittle{
// height:15%;
text-align: center;
font-size: 20px;
}
.explainpanepic{
height:65%;
border:solid 2px #000;
background-size: 100%;
}
.explainpanetext{
font-size: 14px;
// height:20%;
}
</style>

206
src/views/jlmap3d/lesson3dplayer/tools/jobpane.vue Normal file
View File

@ -0,0 +1,206 @@
<template>
<div class="jobpanediv">
<div class="jobshowbutton" @click="openList">岗位联络</div>
<div class="joblistdiv" v-show="showJobList">
<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>
</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: {
},
data() {
return {
jobList:[],
showJobList:false,
showJob:false,
selectedJob:null,
}
},
computed: {
},
watch: {
},
mounted() {
// this.initJobList();
},
beforeDestroy() {
},
methods: {
openList(){
if(this.showJobList ==false){
this.showJobList = true;
// this.showJob = true;
}else{
this.showJobList = false;
this.selectedJob = null;
}
},
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);
},
},
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.jobpanediv {
position: absolute;
// height: 500px;
min-width: 100px;
right:0;
top:0;
// border:solid 2px #000;
z-index:1;
}
.jobshowbutton{
position: absolute;
width:100px;
height:50px;
right:0;
top:0;
border:solid 2px #000;
background-color: #fff;
}
.joblistdiv{
position: absolute;
width:100px;
height:450px;
right:0;
top:50px;
border:solid 2px #000;
overflow-y: auto;
overflow-x: hidden;
background-color: #fff;
}
.jobdiv{
width:75px;
height:75px;
margin-top: 5px;
margin-left: 2px;
border:solid 2px #000;
background-color: #fff;
}
.jobtab{
position: absolute;
right:100px;
top:50px;
width: 300px;
height:450px;
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>

82
src/views/jlmap3d/lesson3dplayer/tools/processlog.vue Normal file
View File

@ -0,0 +1,82 @@
<template>
<div class="processlogdiv" >
<el-tabs type="border-card">
<el-tab-pane label="进程">
<div class="processtext" >
{{processText}}
</div>
</el-tab-pane>
<el-tab-pane label="日志">
<div class="logtext" >
{{logText}}
</div>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import Vue from 'vue';
import localStore from 'storejs';
import { JL3D_LOCAL_STATIC } from '@/api/jlmap3d/assets3d.js';
//进程日志
export default {
name: 'ProcessLog',
components: {
},
data() {
return {
processText:"",
logText:"",
}
},
computed: {
},
watch: {
},
mounted() {
},
beforeDestroy() {
},
methods: {
},
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.processlogdiv {
position: absolute;
width: 28%;
height: 25%;
right:0;
bottom:0;
// border-radius:10px;
border:solid 2px #000;
background-color: #fff;
z-index:1;
}
.processtext{
font-size: 16px;
}
.logtext{
font-size: 16px;
}
</style>

75
src/views/jlmap3d/lesson3dplayer/tools/stepstips.vue Normal file
View File

@ -0,0 +1,75 @@
<template>
<div class="stepstipsdiv" v-if="lessonData.lessonData.lessonProgress[lessonEditIndex]" @click="selectTool">
<div class="stepstipstittle" >
{{lessonData.lessonData.lessonProgress[lessonEditIndex].stepTipsData.tittle}}
</div>
<div class="stepstipstext" >
{{lessonData.lessonData.lessonProgress[lessonEditIndex].stepTipsData.text}}
</div>
</div>
</template>
<script>
import Vue from 'vue';
import localStore from 'storejs';
import { JL3D_LOCAL_STATIC } from '@/api/jlmap3d/assets3d.js';
//步骤提示
export default {
name: 'StepTips',
props:['lessonData','lessonEditIndex'],
components: {
},
data() {
return {
}
},
computed: {
},
watch: {
},
mounted() {
},
beforeDestroy() {
},
methods: {
selectTool(){
lesson3dSelect('toolproperty','stepTips');
},
},
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.stepstipsdiv {
position: absolute;
width: 20%;
height: 20%;
left:0;
top:0;
border-radius:10px;
border:solid 2px #000;
background-color: #fff;
z-index:1;
}
.stepstipstittle{
text-align: center;
font-size: 20px;
}
.stepstipstext{
font-size: 16px;
}
</style>

201
src/views/jlmap3d/lesson3dplayer/tools/toolbar.vue Normal file
View File

@ -0,0 +1,201 @@
<template>
<div class="toolbardiv" >
<div class="toolbarbutton" @click="openGuide"></div>
<div class="toolbarbutton" @click="openBag"></div>
<div class="toolbarbutton" ></div>
<div class="toolbarguides" v-show="showGuide">
<div class="toolbarguide" v-for="(guide,index) in guideList">
{{guide.name}}
</div>
</div>
<div class="toolbarbag" v-show="showBag">
<div class="toolbarplaid" v-for="(tool,index) in toolsList"></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: 'ToolBar',
components: {
},
data() {
return {
tipsTittle:"步骤一",
tipsText:"步骤一",
guideList:[],
toolsList:[],
showGuide:false,
showBag:false,
}
},
computed: {
},
watch: {
},
mounted() {
this.initList();
},
beforeDestroy() {
},
methods: {
openGuide(){
if(this.showGuide == false){
this.showGuide = true;
this.showBag = false;
}else{
this.showGuide = false;
this.showBag = false;
}
},
openBag(){
if(this.showBag == false){
this.showGuide = false;
this.showBag = true;
}else{
this.showGuide = false;
this.showBag = false;
}
},
initList(){
for(let i=0;i<12;i++){
this.toolsList.push(
{
name:"",
picrul:"",
uesmode:"",
}
);
}
this.guideList=[
{
name:"站台",
pos:"",
},
{
name:"站厅",
pos:"",
},
{
name:"车控台",
pos:"",
},
{
name:"票务室",
pos:"",
},
{
name:"站长室",
pos:"",
},
{
name:"备品间",
pos:"",
},
{
name:"电梯",
pos:"",
},
{
name:"上行站台",
pos:"",
},
{
name:"下行站台",
pos:"",
},
];
},
},
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
@import "src/styles/mixin.scss";
.toolbardiv {
position: absolute;
width: 240px;
height: 80px;
left:0;
bottom:0;
border-radius:10px;
border:solid 2px #000;
background-color: #fff;
z-index:1;
}
.toolbarbutton{
float:left;
width: 74px;
height: 74px;
border-radius:10px;
border:solid 2px #000;
margin: 2px;
}
.toolbarguides{
position: absolute;
bottom: 80px;
left:0;
width:100px;
height:350px;
overflow-y: auto;
overflow-x: hidden;
border-radius:10px;
border:solid 2px #000;
}
.toolbarguide{
width: 90px;
height: 30px;
border-radius:10px;
border:solid 2px #000;
margin: 5px;
}
.toolbarbag{
position: absolute;
bottom: 80px;
left:0;
width:240px;
height:320px;
overflow-y: auto;
border-radius:10px;
border:solid 2px #000;
}
.toolbarplaid{
float:left;
width: 74px;
height: 74px;
border-radius:10px;
border:solid 2px #000;
margin: 2px;
}
.stepstipstittle{
text-align: center;
font-size: 20px;
}
.stepstipstext{
font-size: 16px;
}
</style>