guangyin
/
hbt-training-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat:修改依赖信息 

feat:增加演示视频
wuyanfu
guangyin 2023-06-08 11:00:45 +08:00
parent f025491cb6
commit 753e4ee6aa
12 changed files with 237 additions and 151 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.env.development
View File

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

19
.env.developmentGY 100644
View File

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

1
package.json
View File

@ -4,6 +4,7 @@
"private": true,
"scripts": {
"serve": "vue-cli-service serve --mode development",
"serveGY": "vue-cli-service serve --mode developmentGY",
"build": "vue-cli-service build --mode production",
"test": "vue-cli-service build --mode test",
"lint": "vue-cli-service lint"

BIN
src/assets/video/化工工艺步骤.mp4 100644
View File

Binary file not shown.

BIN
src/assets/video/外浮顶罐.mp4 100644
View File

Binary file not shown.

BIN
src/assets/video/工艺流程.mp4 100644
View File

Binary file not shown.

BIN
src/assets/video/常减压装置.mp4 100644
View File

Binary file not shown.

BIN
src/assets/video/球罐.mp4 100644
View File

Binary file not shown.

4
src/components/view/right/viewRight.component.html
View File

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

50
src/mock/treeData.ts
View File

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

4
src/views/base.component.ts
View File

@ -151,8 +151,8 @@ export default class BaseComponent extends Vue {
if(!layer.ids.length){
const options = layer.data.map((item,index)=>{
const option = {} as any
if(item.hasPop){
option.popupURL = "http://192.168.1.20:8081/#/popup?"+new URLSearchParams(layer.popData)
if(item.hasPop && !item.model){
option.popupURL = "http://192.168.1.66:8084/#/popup?"+new URLSearchParams(layer.popData)
}
return Object.assign(option,{
id:item.id,

34
src/views/overview.component.ts
View File

@ -14,7 +14,6 @@ import PermitPopUpComponent from "@/components/permitPopUp.component.vue";
import WarningDetailComponent from "@/components/warningDetail.component.vue";
@Component({
components: {
HomeLeftComponent,
@ -61,20 +60,24 @@ export default class OverViewComponent extends BaseComponent {
public showLoading = true
public viewLayer = {} as any;
async created() {
// this.currentLayers = this.getCurrentLayers();
}
public upDateEventList() {
const eventList = MockData.getEventList().data
this.$store.commit("upDateEventList", eventList)
}
public getHiddenDangrous() {
this.parkService.getHiddenDangrous().then((res: any) => {
this.dataList["hidden-dangrous"] = res.data;
this.$store.commit("setHiddenDangrousList", res.data)
})
}
// 地图初始化后
public getMap(store: any) {
this.player = store;
@ -108,7 +111,7 @@ export default class OverViewComponent extends BaseComponent {
this.emitCarPop(currentData)
}
if (data.GroupID === "video") {
this.openVideo(currentData)
// this.openVideo(currentData)
}
}
}
@ -126,6 +129,7 @@ export default class OverViewComponent extends BaseComponent {
}, 2000)
}, 1000)
}
//展示车辆详情
emitCarPop(item) {
this.resetMap();
@ -138,6 +142,7 @@ export default class OverViewComponent extends BaseComponent {
}, 2000)
}, 1000)
}
closeCarPersonPop() {
this.currentCarPeople = null;
}
@ -243,15 +248,18 @@ export default class OverViewComponent extends BaseComponent {
)
}
//定位坐标
changePoint(item) {
this.addWarnning(item)
}
//关闭告警详情
changeClose() {
this.waringRightShow = false
this.player.api.customObject.delete(this.currentWanning.id)
}
//进入自由导览
async showView() {
this.toggleAllPanel();
@ -271,6 +279,7 @@ export default class OverViewComponent extends BaseComponent {
//todo 进入自由导览
}
//展开导览右侧
showViewRight(data) {
if (data.area) {
@ -285,9 +294,9 @@ export default class OverViewComponent extends BaseComponent {
this.viewRightShow = true
})
}
//右侧详情点击事件
showDetail(item) {
debugger
if (this.currentEvent) {
if (this.currentEvent.id === item.id) {
return
@ -299,7 +308,7 @@ export default class OverViewComponent extends BaseComponent {
}
if (item.type === 'video') {
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 {
if (!this.viewLayer[item.id]) {
const data = [] as any;
@ -359,8 +368,10 @@ export default class OverViewComponent extends BaseComponent {
}
}
mounted() {
}
get showBackGround() {
let flag = this.currentNav === 'view' && !this.viewRightShow
return flag ? 'none' : ''
@ -398,6 +409,7 @@ export default class OverViewComponent extends BaseComponent {
this.showPlay = true
this.player.api.cameraTour.play(item.id)
}
closeRight() {
this.viewRightShow = false;
const dom = document.querySelector('div.is-current') as any;
@ -410,13 +422,15 @@ export default class OverViewComponent extends BaseComponent {
this.currentEvent = null;
}
}
//暂停继续
playAction(type) {
this.player.api.cameraTour[type]()
}
// 打开摄像头
openVideo(item) {
this.resetMap();
// this.resetMap();
setTimeout(() => {
// this.player.api.marker.focus(item.id,20,2)
if (item.model === 'video') {
@ -429,7 +443,7 @@ export default class OverViewComponent extends BaseComponent {
<video src="${item.info}" controls style="width:100%" autoplay></video>
</div>`
})
},2000)
}, 500)
} else {
setTimeout(() => {
layer.open({
@ -448,14 +462,16 @@ style="
>${item.info}</div></div>`
})
},2000)
}
}, 1000)
}
}, 100)
}
deactivated() {
//
}
beforeDestory() {
if (this.player) {
this.player = null