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

feat:右侧弹出告警详情

wuyanfu
guangyin 2023-05-18 17:11:05 +08:00
parent e3bc8cd3d9
commit c7c09b5ca9
4 changed files with 48 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/warningDetail.component.vue
View File

@ -54,7 +54,7 @@
</el-table-column> </el-table-column>
</el-table> </el-table>
<el-button class="pop-btn-style margin-top-30" @click="deal">处理</el-button> <!-- <el-button class="pop-btn-style margin-top-30" @click="deal">处理</el-button>-->
</div> </div>
</div> </div>

46
src/mock/index.ts
View File

@ -649,12 +649,12 @@ export class MockData{
public static getWaringList(){ public static getWaringList(){
/* { /* {
type:"fire", type:"normal",
id:new Date().getTime()+"", id:new Date().getTime()+"",
typeName:"火灾", typeName:"泄露",
position:[13312990.72, 4098613.12, 0.51], position:[13312990.72, 4098613.12, 0.51],
reporter:"张三", reporter:"张三",
content:"北京汉邦唐化工厂区发生火灾" content:"北京汉邦唐化工厂区发生泄露"
}*/ }*/
const data = [ const data = [
@ -850,12 +850,12 @@ export class MockData{
public static getEventList(){ public static getEventList(){
/* { /* {
type:"fire", type:"normal",
id:new Date().getTime()+"", id:new Date().getTime()+"",
typeName:"火灾", typeName:"泄露",
position:[13312990.72, 4098613.12, 0.51], position:[13312990.72, 4098613.12, 0.51],
reporter:"张三", reporter:"张三",
content:"北京汉邦唐化工厂区发生火灾" content:"北京汉邦唐化工厂区发生泄露"
}*/ }*/
const data = [ const data = [
@ -871,15 +871,15 @@ export class MockData{
content:"物体高空坠落" content:"物体高空坠落"
} }
, { , {
title: '火灾告警', title: '罐体破裂',
info: '北京汉邦唐化工厂区发生火灾', info: '北京汉邦唐化工厂区发生泄露',
time: '2023年1月20日 14:33:33', time: '2023年1月20日 14:33:33',
level: '1', level: '1',
type:"fire", type:"normal",
typeName:"火灾", typeName:"泄露",
reporter:"李四", reporter:"李四",
tel:"13985412541", tel:"13985412541",
content:"北京汉邦唐化工厂区发生火灾" content:"北京汉邦唐化工厂区发生泄露"
}, { }, {
title: '坍塌事故', title: '坍塌事故',
info: '建筑坍塌及时处理', info: '建筑坍塌及时处理',
@ -901,34 +901,32 @@ export class MockData{
tel:"13337542569", tel:"13337542569",
content:"NO气体泄露" content:"NO气体泄露"
}, { }, {
title: '火灾爆炸', title: '罐体破裂',
info: '富土康厂区火灾爆炸', info: '富土康厂区罐体破裂',
time: '2023年1月20日 14:33:33', time: '2023年1月20日 14:33:33',
level: '2', level: '2',
type:"normal", type:"normal",
typeName:"火灾爆炸", typeName:"罐体破裂",
reporter:"张三", reporter:"张三",
tel:"13337542569", tel:"13337542569",
content:"富土康厂区火灾爆炸" content:"富土康厂区罐体破裂"
}, { }, {
title: '火灾爆炸', title: '罐体破裂',
info: '北京汉邦唐化工厂区发生火灾', info: '北京汉邦唐化工厂区发生泄露',
time: '2023年1月20日 14:33:33', time: '2023年1月20日 14:33:33',
level: '1', level: '1',
type:"fire", type:"normal",
typeName:"火灾", typeName:"泄露",
reporter:"李四", reporter:"李四",
tel:"13985412541", tel:"13985412541",
content:"北京汉邦唐化工厂区发生火灾" content:"北京汉邦唐化工厂区发生泄露"
}, },
].map((item:any)=>{ ].map((item:any)=>{
item.id = Mock.mock("@id"); item.id = Mock.mock("@id");
if (item.type === 'normal'){ if (item.type === 'normal'){
item.position=turf.randomPosition([ item.position=turf.randomPosition([
13312995.84, 11660757, 3692398.75,
4098177.2800000003, 11661124, 3692643.5
13313096.96,
4098754.88,
]); ]);
}else if(item.type === 'fire'){ }else if(item.type === 'fire'){
item.position= [13312990.72, 4098613.12, 0.51] item.position= [13312990.72, 4098613.12, 0.51]

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

@ -1,29 +1,38 @@
<div class="overview-container"> <div class="overview-container">
<!--<MapComponent id="map" @onLoaded="getMap" @onHandleChange="handleChange"></MapComponent>--> <MapComponent id="map" @onLoaded="getMap" @onHandleChange="handleChange"></MapComponent>
<div class="bg-box left animate__animated"> <div class="bg-box left animate__animated">
<div class="panel-container"> <div class="panel-container">
<!-- 首页--> <!-- 首页-->
<HomeLeftComponent @getItem="getItem" v-if="currentNav === 'home'" class="animate__animated animate__fadeInLeft"></HomeLeftComponent> <HomeLeftComponent @getItem="getItem" v-if="currentNav === 'home'"
<!-- 导览--> class="animate__animated animate__fadeInLeft"></HomeLeftComponent>
<ViewLeftComponent @showView="showView" @playView="playView" @showViewRight="showViewRight" v-if="currentNav === 'view'" class="animate__animated animate__fadeInLeft"></ViewLeftComponent> <!-- 导览-->
<ViewLeftComponent @showView="showView" @playView="playView" @showViewRight="showViewRight"
v-if="currentNav === 'view'"
class="animate__animated animate__fadeInLeft"></ViewLeftComponent>
<!-- 运营管理--> <!-- 运营管理-->
<ManageLeftComponent v-if="currentNav === 'manage'" class="animate__animated animate__fadeInLeft"></ManageLeftComponent> <ManageLeftComponent v-if="currentNav === 'manage'"
class="animate__animated animate__fadeInLeft"></ManageLeftComponent>
</div> </div>
</div> </div>
<div class="bg-box right main animate__animated" :class="showBackGround"> <div class="bg-box right main animate__animated" :class="showBackGround">
<div class="panel-container"> <div class="panel-container">
<!-- 首页--> <!-- 首页-->
<HomeRightComponent v-if="currentNav === 'home' && !waringRightShow" <HomeRightComponent v-if="currentNav === 'home' && !waringRightShow"
class="animate__animated animate__fadeInRight"></HomeRightComponent> class="animate__animated animate__fadeInRight"></HomeRightComponent>
<!-- 导览--> <!-- 导览-->
<ViewRightComponent @closeRight="closeRight" :viewRightData="viewRightData" @showDetail="showDetail" v-if="currentNav === 'view' && viewRightShow" class="animate__animated animate__fadeInRight"></ViewRightComponent> <ViewRightComponent @closeRight="closeRight" :viewRightData="viewRightData" @showDetail="showDetail"
v-if="currentNav === 'view' && viewRightShow"
class="animate__animated animate__fadeInRight"></ViewRightComponent>
<!-- 运营管理--> <!-- 运营管理-->
<ManageRightComponent v-if="currentNav === 'manage'" class="animate__animated animate__fadeInRight"></ManageRightComponent> <ManageRightComponent v-if="currentNav === 'manage'"
class="animate__animated animate__fadeInRight"></ManageRightComponent>
<!--告警详情--> <!--告警详情-->
<WarningDetailComponent @changeClose="changeClose" @changePoint="changePoint" :info="info" v-if="waringRightShow && currentNav === 'home'" class="animate__animated animate__fadeInRight"></WarningDetailComponent> <WarningDetailComponent @changeClose="changeClose" @changePoint="changePoint" :info="info"
v-if="waringRightShow && currentNav === 'home'"
class="animate__animated animate__fadeInRight"></WarningDetailComponent>
</div> </div>
</div> </div>
@ -44,11 +53,10 @@
</div> </div>
<div class="top-bg" :style="{top:hideAllPanel?'-90px':0}"> <div class="top-bg" :style="{top:hideAllPanel?'-90px':0}">
<HeaderComponent @onDrawer="drawerChange($event)" @onNavChanged="navChange($event)"></HeaderComponent> <HeaderComponent @onDrawer="drawerChange($event)" @onNavChanged="navChange($event)"></HeaderComponent>
</div> </div>
<div class="exitFullScreen" :style="{top:!hideAllPanel?'-90px':0}" > <div class="exitFullScreen" :style="{top:!hideAllPanel?'-90px':0}">
<div class="top-btn" @click="toggleAllPanel"> <div class="top-btn" @click="toggleAllPanel">
<i class="el-icon-close">退出自由导览</i> <i class="el-icon-close">退出自由导览</i>
</div> </div>

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

@ -213,7 +213,7 @@ export default class OverViewComponent extends BaseComponent {
//获取点击的信息 //获取点击的信息
getItem(item) { getItem(item) {
// this.addWarnning(item) this.addWarnning(item)
this.info = item this.info = item
this.waringRightShow = true this.waringRightShow = true
} }
@ -224,6 +224,7 @@ export default class OverViewComponent extends BaseComponent {
//关闭告警详情 //关闭告警详情
changeClose(){ changeClose(){
this.waringRightShow = false this.waringRightShow = false
this.player.api.customObject.delete(this.currentWanning.id)
} }
//进入自由导览 //进入自由导览
async showView (){ async showView (){