hbt-training-ui/src/views/overview.component.html

59 lines
2.9 KiB
HTML

<div class="overview-container">
<!--<MapComponent id="map" @onLoaded="getMap" @onHandleChange="handleChange"></MapComponent>-->
<div class="bg-box left animate__animated">
<div class="panel-container">
<!-- 首页-->
<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>
<!-- 运营管理-->
<ManageLeftComponent v-if="currentNav === 'manage'" class="animate__animated animate__fadeInLeft"></ManageLeftComponent>
</div>
</div>
<div class="bg-box right main animate__animated" :class="showBackGround">
<div class="panel-container">
<!-- 首页-->
<HomeRightComponent v-if="currentNav === 'home' && !waringRightShow"
class="animate__animated animate__fadeInRight"></HomeRightComponent>
<!-- 导览-->
<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>
<!--告警详情-->
<WarningDetailComponent @changeClose="changeClose" @changePoint="changePoint" :info="info" v-if="waringRightShow && currentNav === 'home'" class="animate__animated animate__fadeInRight"></WarningDetailComponent>
</div>
</div>
<div class="fixed-btn" @click="resetMap">
<hbt-svg name="fixed"></hbt-svg>
</div>
<div class="layer-btn-box" :style="{height:openLayerDrawer?(currentLayers.length+1) * 50+'px':'50px'}">
<div class="layer-btn" :class="{active:item.selected}" v-show="openLayerDrawer"
v-for="(item,index) in currentLayers" :key="index">
<el-tooltip effect="dark" :content="item.name" placement="left">
<hbt-svg :name="item.value" @click="toggleLayer(item)"></hbt-svg>
</el-tooltip>
</div>
<div class="layer-btn">
<hbt-svg name="layer" @click="toggleHeight"></hbt-svg>
</div>
</div>
<div class="top-bg" :style="{top:hideAllPanel?'-90px':0}">
<HeaderComponent @onDrawer="drawerChange($event)" @onNavChanged="navChange($event)"></HeaderComponent>
</div>
<div class="exitFullScreen" :style="{top:!hideAllPanel?'-90px':0}" >
<div class="top-btn" @click="toggleAllPanel">
<i class="el-icon-close">退出自由导览</i>
</div>
</div>
</div>