Merge branch 'master' of 81.70.119.104:guangyin/hbt-training-ui

.env.development

@@ -16,4 +16,4 @@ VUE_APP_ALL_MENU = false
 # 微前端地址
 VUE_APP_REMOTES_URL="http://119.45.158.12/common/"
 # 当前应用部署地址
-VUE_APP_EXPOSES_URL=""
+VUE_APP_EXPOSES_URL="http://192.168.2.72:8081/"

.env.developmentGY

@@ -0,0 +1,19 @@
+
+#开发环境
+NODE_ENV:"development"
+# 页面标题
+VUE_APP_TITLE = 汉邦唐消防训练基地
+# 网关地址
+VUE_APP_GATEWAY_URL="/dev-api"
+# UE4服务地址
+VUE_APP_PALYER_URL="192.168.1.66:8080"
+# 服务地址
+VUE_APP_BASE_API_URL="http://192.168.2.3:8081"
+# 服务前-- 请严格遵守格式  不允许换行
+VUE_APP_SERVICE_PREFIX= '{"knowledge":"/knowledge","system":"/system"}'
+# 是否显示全部菜单
+VUE_APP_ALL_MENU = false
+# 微前端地址
+VUE_APP_REMOTES_URL="http://119.45.158.12/common/"
+# 当前应用部署地址
+VUE_APP_EXPOSES_URL="http://192.168.2.72:8081/"

package.json

@@ -5,6 +5,7 @@
   "scripts": {
     "serve": "vue-cli-service serve --mode development",
     "local": "vue-cli-service serve --mode developmentLocal --port 8084",
+    "serveGY": "vue-cli-service serve --mode developmentGY",
     "build": "vue-cli-service build --mode production",
     "buildProdLocal": "vue-cli-service build --mode prodLocal",
     "buildProd": "vue-cli-service build --mode prod",

src/bootstrap.ts

@@ -4,8 +4,8 @@ import router from './router'
 import store from './store'
 import ElementUI from 'element-ui';
 import 'element-ui/lib/theme-chalk/index.css';
-import SvgComponent from "hbt-common/components/svg.component.vue"
+import SvgComponent from "hbt-common/components/common/svg.component.vue"
-import EchartsComponent from "hbt-common/components/echarts.component.vue"
+import EchartsComponent from "hbt-common/components/common/echarts.component.vue"
 import "@/assets/common/icons";
 import 'animate.css';
 import Mock from "mockjs"

src/components/view/right/viewRight.component.html

@@ -8,7 +8,9 @@
     <div class="text-con  flex-0">
         {{ viewRightData.data.content }}
     </div>
-    <h3 v-show="viewRightData.data.dataList.length>0" class="sub-title  flex-0">模拟火情</h3>
+    <h3 v-show="viewRightData.data.dataList.length>0" class="sub-title  flex-0">
+        {{ viewRightData.data.type==='info'?'设施介绍':'模拟火情' }}
+        </h3>
     <div class="right-view-list view-right">
         <div class="right-view-item d-flex align-items-center" :class="activeItem === i?'flow-light-box':''" @click="clickItem(item,i)"
              v-for="(item,i) in viewRightData.data.dataList">

src/mock/treeData.ts

@@ -933,6 +933,16 @@ export const treeData = [
                         data: {
                             content: '油罐火灾事故处置训练设施是一种专门用于培训和演练消防人员进行油罐火灾事故处置能力的实景模拟设施。这种设施旨在提高消防人员在实际火灾事故中应对油罐火灾的技能和经验。',
                             dataList: [
+                                {
+                                    id: Mock.mock("@id"),
+                                    title: '外浮顶罐介绍',
+                                    remark: '外浮顶罐介绍',
+                                    type: 'video',
+                                    model: 'video',
+                                    img: require('@/assets/img/view/密封圈火.png'),
+                                    info: require('@/assets/video/外浮顶罐.mp4'),
+                                    content: '外浮顶罐介绍'
+                                },
                                 {
                                     id: Mock.mock("@id"),
                                     rate: 1,
@@ -1446,6 +1456,16 @@ export const treeData = [
                         data: {
                             content: '气罐火灾事故处置训练设施是一种专门用于培训和演练消防人员进行气罐火灾事故处置能力的实景模拟设施。这种设施旨在提高消防人员在实际火灾事故中应对油罐火灾的技能和经验。',
                             dataList: [
+                                {
+                                    id: Mock.mock("@id"),
+                                    title: '球罐介绍',
+                                    remark: '球罐介绍',
+                                    type: 'video',
+                                    model: 'video',
+                                    img: require('@/assets/img/view/密封圈火.png'),
+                                    info: require('@/assets/video/球罐.mp4'),
+                                    content: '球罐介绍'
+                                },
                                 {
                                     id: Mock.mock("@id"),
                                     rate: 1,
@@ -2160,8 +2180,36 @@ export const treeData = [
                         ],
                         data: {
                             content: '模拟在密闭建筑物内发生火灾，消防员在高温、浓烟、高噪音的情况下进行火情侦察，寻找被困人员，救出被困人员，灭火抢险等战斗',
+                            type:'info',
                             dataList: [
-
+                                {
+                                    id: Mock.mock("@id"),
+                                    title: '常减压装置',
+                                    remark: '常减压装置',
+                                    type: 'video',
+                                    model: 'video',
+                                    img: require('@/assets/img/view/初馏塔回流罐顶火.png'),
+                                    info: require('@/assets/video/常减压装置.mp4'),
+                                    content: '常减压装置介绍'
+                                },{
+                                    id: Mock.mock("@id"),
+                                    title: '化工工艺步骤',
+                                    remark: '化工工艺步骤',
+                                    type: 'video',
+                                    model: 'video',
+                                    img: require('@/assets/img/view/初馏塔回流罐顶火.png'),
+                                    info: require('@/assets/video/化工工艺步骤.mp4'),
+                                    content: '化工工艺步骤'
+                                },{
+                                    id: Mock.mock("@id"),
+                                    title: '工艺流程',
+                                    remark: '工艺流程',
+                                    type: 'video',
+                                    model: 'video',
+                                    img: require('@/assets/img/view/初馏塔回流罐顶火.png'),
+                                    info: require('@/assets/video/工艺流程.mp4'),
+                                    content: '工艺流程'
+                                },
                             ]
                         },
                         children: []

src/models/index.ts

@@ -6,7 +6,7 @@ interface ActionResult<T> {
     /**
      * message: 错误消息
      */
-    message: string;
+    msg: string;
     /**
      * data: 数据
      */

src/views/overview.component.ts

@@ -33,14 +33,14 @@ export default class OverViewComponent extends BaseComponent {
     // 当前图层
     public warnTimer = {};
     //定时器
-    public timer:any = {};
+    public timer: any = {};
 
     public currentLayers = [] as any;
 
     // 是否展开图层
     public openLayerDrawer = false;
 
-    public currentCarPeople:any = {};
+    public currentCarPeople: any = {};
     //展示导览右侧
     viewRightShow = false;
 
@@ -61,20 +61,24 @@ export default class OverViewComponent extends BaseComponent {
     public showLoading = true
 
     public viewLayer = {} as any;
-    async created(){
+
+    async created() {
         // this.currentLayers = this.getCurrentLayers();
 
     }
-    public upDateEventList(){
+
+    public upDateEventList() {
         const eventList = MockData.getEventList().data
-        this.$store.commit("upDateEventList",eventList)
+        this.$store.commit("upDateEventList", eventList)
     }
-    public getHiddenDangrous(){
+
-        this.parkService.getHiddenDangrous().then((res:any)=>{
+    public getHiddenDangrous() {
+        this.parkService.getHiddenDangrous().then((res: any) => {
             this.dataList["hidden-dangrous"] = res.data;
-            this.$store.commit("setHiddenDangrousList",res.data)
+            this.$store.commit("setHiddenDangrousList", res.data)
         })
     }
+
     // 地图初始化后
     public getMap(store: any) {
         this.player = store;
@@ -99,15 +103,15 @@ export default class OverViewComponent extends BaseComponent {
 
     public handleChange(data) {
         console.log(data)
-        if(data.GroupID){
+        if (data.GroupID) {
-            const currentData = (this.layerData.find(item=>item.value === data.GroupID)as any).data.find(item=>item.id === data.Id)
+            const currentData = (this.layerData.find(item => item.value === data.GroupID) as any).data.find(item => item.id === data.Id)
-            if(data.GroupID==="peo"){
+            if (data.GroupID === "peo") {
                 this.emitPersonPop(currentData)
             }
-            if(data.GroupID==="car"){
+            if (data.GroupID === "car") {
                 this.emitCarPop(currentData)
             }
-            if(data.GroupID==="video"){
+            if (data.GroupID === "video") {
                 // this.openVideo(currentData)
             }
         }
@@ -115,43 +119,45 @@ export default class OverViewComponent extends BaseComponent {
 
 
     //展示人员详情
-    emitPersonPop(item){
+    emitPersonPop(item) {
         this.resetMap();
-        setTimeout(()=>{
+        setTimeout(() => {
             this.currentCarPeople = item;
-            this.player.api.marker.focus(item.id,50,2);
+            this.player.api.marker.focus(item.id, 50, 2);
-            setTimeout(()=>{
+            setTimeout(() => {
                 this.bigPopTitle = '人员信息卡';
                 this.dialogVisibleForBigPop = true
-            },2000)
+            }, 2000)
-        },1000)
+        }, 1000)
     }
+
     //展示车辆详情
-    emitCarPop(item){
+    emitCarPop(item) {
         this.resetMap();
-        setTimeout(()=>{
+        setTimeout(() => {
             this.currentCarPeople = item;
-            this.player.api.marker.focus(item.id,50,2);
+            this.player.api.marker.focus(item.id, 50, 2);
-            setTimeout(()=>{
+            setTimeout(() => {
                 this.bigPopTitle = '车辆信息卡';
                 this.dialogVisibleForBigPop = true
-            },2000)
+            }, 2000)
-        },1000)
+        }, 1000)
     }
-    closeCarPersonPop(){
+
+    closeCarPersonPop() {
         this.currentCarPeople = null;
     }
 
     public navChange(data: string) {
         this.currentNav = data;
-        if(this.player){
+        if (this.player) {
             this.currentLayers = this.getCurrentLayers()
-            if(this.currentEvent ){
+            if (this.currentEvent) {
                 this.viewLayer[this.currentEvent.id].selected = false;
-                this.addCustom(this.viewLayer[this.currentEvent.id],true);
+                this.addCustom(this.viewLayer[this.currentEvent.id], true);
                 this.currentEvent = null;
             }
-            if(this.currentWanning){
+            if (this.currentWanning) {
                 this.player.api.customObject.delete(this.currentWanning.id)
             }
             this.resetMap();
@@ -173,7 +179,7 @@ export default class OverViewComponent extends BaseComponent {
             fixedbtn.style.right = "540px";
             layerBth.style.right = "440px";
             // rightEl.classList.add("animate__slideInRight");
-            rightEl.forEach(item=>{
+            rightEl.forEach(item => {
                 item.classList.remove("animate__slideOutRight");
                 item.classList.add("animate__slideInRight");
             })
@@ -184,36 +190,36 @@ export default class OverViewComponent extends BaseComponent {
             fixedbtn.style.right = "140px";
             layerBth.style.right = "40px";
             // rightEl.classList.add("animate__slideOutRight");
-            rightEl.forEach(item=>{
+            rightEl.forEach(item => {
                 item.classList.remove("animate__slideInRight");
                 item.classList.add("animate__slideOutRight");
             })
         }
     }
 
-    public toggleAllPanel(){
+    public toggleAllPanel() {
         this.hideAllPanel = !this.hideAllPanel;
         this.drawerChange(!this.hideAllPanel)
-        if(!this.hideAllPanel){
+        if (!this.hideAllPanel) {
             this.showPlay = false
             this.player.api.cameraTour.stop();
             this.player.api.settings.setInteractiveMode(0)
         }
     }
 
-    public toggleHeight(){
+    public toggleHeight() {
         this.openLayerDrawer = !this.openLayerDrawer;
     }
 
-    public toggleLayer(layer){
+    public toggleLayer(layer) {
-        if(this.lock){
+        if (this.lock) {
             this.$message.error("视口未加载完成")
             return
         }
         layer.selected = !layer.selected;
-        if(layer.type === "moveMarker"){
+        if (layer.type === "moveMarker") {
-            this.addMarker(layer,true)
+            this.addMarker(layer, true)
-        }else{
+        } else {
             this.toggleArea(layer)
         }
     }
@@ -223,37 +229,40 @@ export default class OverViewComponent extends BaseComponent {
         // this.addWarnning(item)
 
         this.info = item
-        if (this.waringRightShow){
+        if (this.waringRightShow) {
             this.waringRightShow = false
-            setTimeout(()=>{
+            setTimeout(() => {
                 this.waringRightShow = true
             })
-        }else{
+        } else {
             this.waringRightShow = true
         }
         const position = item.position
-       this.player.api.camera.lookAt(
+        this.player.api.camera.lookAt(
-           position[0],
+            position[0],
-           position[1],
+            position[1],
-           position[2],
+            position[2],
             0,
-           position[3], //pitch
+            position[3], //pitch
-           position[4], //yaw
+            position[4], //yaw
             2
         )
 
     }
+
     //定位坐标
-    changePoint(item){
+    changePoint(item) {
         this.addWarnning(item)
     }
+
     //关闭告警详情
-    changeClose(){
+    changeClose() {
         this.waringRightShow = false
         this.player.api.customObject.delete(this.currentWanning.id)
     }
+
     //进入自由导览
-    async showView (){
+    async showView() {
         this.toggleAllPanel();
         await this.player.api.camera.lookAt(
             11660670.518125,
@@ -264,86 +273,87 @@ export default class OverViewComponent extends BaseComponent {
             85.199608,
             2
         )
-        setTimeout(()=>{
+        setTimeout(() => {
             this.player.api.settings.setInteractiveMode(2);
             this.player.api.settings.setMainUIVisibility(false)
-        },2000)
+        }, 2000)
 
         //todo 进入自由导览
     }
+
     //展开导览右侧
-    showViewRight(data){
+    showViewRight(data) {
-        if(data.area){
+        if (data.area) {
             this.addArea(data)
         }
-        if(data.camera){
+        if (data.camera) {
             this.player.api.camera.lookAt(...data.camera)
         }
         this.viewRightData = data;
         this.viewRightShow = false
-        setTimeout(()=>{
+        setTimeout(() => {
             this.viewRightShow = true
         })
     }
+
     //右侧详情点击事件
-    showDetail(item){
+    showDetail(item) {
-        debugger
+        if (this.currentEvent) {
-        if(this.currentEvent){
+            if (this.currentEvent.id === item.id) {
-            if(this.currentEvent.id === item.id){
                 return
-            }else{
+            } else {
                 this.viewLayer[this.currentEvent.id].selected = false;
-                this.addCustom(this.viewLayer[this.currentEvent.id],true);
+                this.addCustom(this.viewLayer[this.currentEvent.id], true);
                 this.currentEvent = null;
             }
         }
-        if(item.type === 'video'){
+        if (item.type === 'video') {
-            const currentData = (this.layerData.find(item=>item.value === "video")as any).data.find(items=>items.remark === item.title)
+            const currentData = (this.layerData.find(item => item.value === "video") as any).data.find(items => items.remark === item.title)
-            this.openVideo(currentData)
+            this.openVideo(currentData ?? item)
-        }else{
+        } else {
-            if(!this.viewLayer[item.id]){
+            if (!this.viewLayer[item.id]) {
                 const data = [] as any;
-                if(item.point>1){
+                if (item.point > 1) {
-                    for(let i = 0;i<item.point;i++){
+                    for (let i = 0; i < item.point; i++) {
                         data.push({
-                            id:item.id+'_'+i,
+                            id: item.id + '_' + i,
-                            position:item.position[i],
+                            position: item.position[i],
-                            rotation:item.rotation || [0,90,0],
+                            rotation: item.rotation || [0, 90, 0],
-                            hasPop:item.hasPop && i===1,
+                            hasPop: item.hasPop && i === 1,
                         })
                     }
-                }else{
+                } else {
                     data.push({
-                        id:item.id,
+                        id: item.id,
-                        position:item.position,
+                        position: item.position,
-                        rotation:item.rotation || [0,90,0],
+                        rotation: item.rotation || [0, 90, 0],
-                        hasPop:item.hasPop
+                        hasPop: item.hasPop
                     })
                 }
                 this.viewLayer[item.id] = {
-                    type:"moveMarker",
+                    type: "moveMarker",
-                    assetPath:item.assetPath || "/JC_CustomAssets/ParticleLibrary/Exhibition/火/火焰_10",
+                    assetPath: item.assetPath || "/JC_CustomAssets/ParticleLibrary/Exhibition/火/火焰_10",
-                    value:"fire",
+                    value: "fire",
-                    popData:item,
+                    popData: item,
-                    selected:true,
+                    selected: true,
-                    scale:item.scale || [1,1,1],
+                    scale: item.scale || [1, 1, 1],
-                    urls:[],
+                    urls: [],
-                    ids:[],
+                    ids: [],
                     data,
 
                 }
                 this.currentEvent = item;
-            }else{
+            } else {
                 this.viewLayer[item.id].selected = !this.viewLayer[item.id].selected;
-                if(this.viewLayer[item.id].selected){
+                if (this.viewLayer[item.id].selected) {
                     this.currentEvent = item;
                 }
             }
-            this.addCustom(this.viewLayer[item.id],item.hasPop);
+            this.addCustom(this.viewLayer[item.id], item.hasPop);
         }
 
-        if(item.needFocus){
+        if (item.needFocus) {
-            if(item.look){
+            if (item.look) {
                 this.player.api.camera.lookAt(
                     item.look[0],
                     item.look[1],
@@ -353,109 +363,116 @@ export default class OverViewComponent extends BaseComponent {
                     item.look[5], //yaw
                     2
                 )
-            }else{
+            } else {
-                this.player.api.customObject.focus(item.id,item.distance,2)
+                this.player.api.customObject.focus(item.id, item.distance, 2)
             }
 
         }
     }
+
     mounted() {
     }
-    get showBackGround(){
+
+    get showBackGround() {
         let flag = this.currentNav === 'view' && !this.viewRightShow
-        return flag?'none':''
+        return flag ? 'none' : ''
     }
 
 
-    public getCurrentLayers(){
+    public getCurrentLayers() {
-        const layers =  [] as any;
+        const layers = [] as any;
-         this.layerData.forEach(async (item:any)=>{
+        this.layerData.forEach(async (item: any) => {
-            if(!item.data){
+            if (!item.data) {
                 item.data = (await item.init()).data
             }
-            if(item.pages.includes(this.currentNav)){
+            if (item.pages.includes(this.currentNav)) {
-                    if(!item.selected){
+                if (!item.selected) {
-                        this.toggleLayer(item)
+                    this.toggleLayer(item)
-                    }
+                }
                 layers.push(item)
-            }else{
+            } else {
-                if(item.selected){
+                if (item.selected) {
                     this.toggleLayer(item)
                 }
             }
-         })
+        })
         return layers
     }
 
     //进入路线导览
-    playView(item){
+    playView(item) {
         this.toggleAllPanel()
-        this.layerData.forEach(item=>{
+        this.layerData.forEach(item => {
-            if(item.selected){
+            if (item.selected) {
                 this.toggleLayer(item)
             }
         })
         this.showPlay = true
         this.player.api.cameraTour.play(item.id)
     }
-    closeRight(){
+
+    closeRight() {
         this.viewRightShow = false;
         const dom = document.querySelector('div.is-current') as any;
-        if (dom){
+        if (dom) {
             dom.classList.remove('is-current')
         }
-        if(this.currentEvent ){
+        if (this.currentEvent) {
             this.viewLayer[this.currentEvent.id].selected = false;
-            this.addCustom(this.viewLayer[this.currentEvent.id],true);
+            this.addCustom(this.viewLayer[this.currentEvent.id], true);
             this.currentEvent = null;
         }
     }
+
     //暂停继续
-    playAction(type){
+    playAction(type) {
         this.player.api.cameraTour[type]()
     }
+
     // 打开摄像头
-    openVideo(item){
+    openVideo(item) {
-        this.resetMap();
+        // this.resetMap();
-        setTimeout(()=>{
+        setTimeout(() => {
             // this.player.api.marker.focus(item.id,20,2)
-            if(item.model === 'video'){
+            if (item.model === 'video') {
-                setTimeout(()=>{
+                setTimeout(() => {
                     layer.open({
-                        type:1,
+                        type: 1,
-                        shade:0,
+                        shade: 0,
-                        title:item.remark,
+                        title: item.remark,
-                        content:`<div class="customClass">
+                        content: `<div class="customClass">
                       <video src="${item.info}" controls style="width:100%" autoplay></video>
                     </div>`
                     })
-                },2000)
+                }, 500)
-            }else{
+            } else {
-                setTimeout(()=>{
+                setTimeout(() => {
                     layer.open({
-                        type:1,
+                        type: 1,
-                        shade:0,
+                        shade: 0,
-                        title:item.remark,
+                        title: item.remark,
-                        content:`<div class="customClass"><div
+                        content: `<div class="customClass"><div
-style="
+                                style="
-    background: #0000008c;
+                                    background: #0000008c;
-    color: #ffffff;
+                                    color: #ffffff;
-    font-size: 12px;
+                                    font-size: 12px;
-    padding: 10px;
+                                    padding: 10px;
-    line-height: 2;
+                                    line-height: 2;
-    white-space: pre-wrap;
+                                    white-space: pre-wrap;
-"
+                                "
->${item.info}</div></div>`
+                                >${item.info}</div></div>`
 
                     })
-                },2000)
+                }, 1000)
             }
 
-        },1000)
+        }, 100)
     }
-    deactivated(){
+
+    deactivated() {
         //
     }
+
     beforeDestory() {
         if (this.player) {
             this.player = null