From 2d4e3633a59e69bcf2ce6b3997c8e5b4bd9f02d8 Mon Sep 17 00:00:00 2001
From: guanqb <18720758508@163.com>
Date: Mon, 06 Feb 2023 20:07:50 +0800
Subject: [PATCH] 社区建筑3D高亮动态显示，社区定位问题，点位查询定位播放和树数据样式修改
---
src/components/map/index.vue | 89 ++++++-
src/views/house/index.vue | 470 +++++++++++++++++++++++++++++++-----------
src/views/video/list.vue | 68 +++--
3 files changed, 450 insertions(+), 177 deletions(-)
diff --git a/src/components/map/index.vue b/src/components/map/index.vue
index 4156614..f32d21a 100644
--- a/src/components/map/index.vue
+++ b/src/components/map/index.vue
@@ -81,6 +81,8 @@
sdTilesetLayer: null
}
+let flootEntitysEntites = null
+
import mapPopup from './components/mapPopup.vue'
export default {
@@ -243,10 +245,10 @@
console.log(e, 989999)
})
- let positions = [[117.9514788, 28.4478968, 0], [117.9514698, 28.4478947, 0], [117.9513974, 28.4476981, 0], [117.9515047, 28.4476748, 0], [117.9515289, 28.4476939, 0], [117.9515508, 28.447755, 0], [117.9516278, 28.4477353, 0], [117.9516623, 28.4478497, 0], [117.9514788, 28.4478968, 0]]
+ // let positions = [[117.9514788, 28.4478968, 0], [117.9514698, 28.4478947, 0], [117.9513974, 28.4476981, 0], [117.9515047, 28.4476748, 0], [117.9515289, 28.4476939, 0], [117.9515508, 28.447755, 0], [117.9516278, 28.4477353, 0], [117.9516623, 28.4478497, 0], [117.9514788, 28.4478968, 0]]
// let positions = [[117.951478782, 28.447896798, 0], [117.951469798, 28.447894686, 0], [117.951397357, 28.447698099, 0], [117.951505114, 28.447674695, 0], [117.951485465, 28.447619271, 0], [117.951706955, 28.447558541, 0], [117.951722755, 28.447611995, 0], [117.951834021, 28.447588427, 0], [117.951896863, 28.447789523, 0], [117.951478782, 28.447896798, 0]]
-
+ let positions = [[117.951478782, 28.447896798, 0], [117.951469798, 28.447894686, 0], [117.951397357, 28.447698099, 0], [117.951505114, 28.447674695, 0], [117.951485465, 28.447619271, 0], [117.951706955, 28.447558541, 0], [117.951722755, 28.447611995, 0], [117.951834021, 28.447588427, 0], [117.951896863, 28.447789523, 0], [117.951478782, 28.447896798, 0]]
let MIN_F_H = positions.map(item => {
item[2] = 70
return item
@@ -260,25 +262,29 @@
// 原生Cesium加载多边体
let floorEntitysLayers = new global.DC.Namespace.Cesium.CustomDataSource("floorEntitysLayers")
global.viewer.dataSources.add(floorEntitysLayers)
- let flootEntitysEntites = floorEntitysLayers.entities
+ flootEntitysEntites = floorEntitysLayers.entities
- let floorPositions = positions.reduce((prev, curr, index, arr) => {
- curr.forEach(item => {
- prev.push(item)
- })
- return prev
- }, [])
+ // let floorPositions = positions.reduce((prev, curr, index, arr) => {
+ // curr.forEach(item => {
+ // prev.push(item)
+ // })
+ // return prev
+ // }, [])
- flootEntitysEntites.add({
- polygon: {
- hierarchy: global.DC.Namespace.Cesium.Cartesian3.fromDegreesArrayHeights(floorPositions),
- heightReference: global.DC.Namespace.Cesium.HeightReference.RELATIVE_TO_GROUND,
- extrudedHeightReference: global.DC.Namespace.Cesium.HeightReference.RELATIVE_TO_GROUND,
- height: 70,
- extrudedHeight: 80,
- material: global.DC.Namespace.Cesium.Color.RED.withAlpha(0.5),
- }
- })
+ // flootEntitysEntites.add({
+ // polygon: {
+ // hierarchy: global.DC.Namespace.Cesium.Cartesian3.fromDegreesArrayHeights(floorPositions),
+ // heightReference: global.DC.Namespace.Cesium.HeightReference.RELATIVE_TO_GROUND,
+ // extrudedHeightReference: global.DC.Namespace.Cesium.HeightReference.RELATIVE_TO_GROUND,
+ // height: 70,
+ // extrudedHeight: 80,
+ // material: global.DC.Namespace.Cesium.Color.RED.withAlpha(0.5),
+ // }
+ // })
+
+
+
+
// console.log(floorPositions)
@@ -401,6 +407,14 @@
that.flytoLayer(params.polygonName, params.duration)
})
+ this.$EventBus.$on('showHouse3D', (params) => {
+ that.showHouse3D(params.positions, params.minHeight, params.maxHeight)
+ })
+
+ this.$EventBus.$on('clearHouse3D', () => {
+ that.clearHouse3D()
+ })
+
// 重写定位方法
const homeCenter = [117.99311892441567, 28.46938164123123]
this.$nextTick(() => {
@@ -424,6 +438,7 @@
this.$router.push({ path: '/layout/house', query: { searchName: 'xxx小区' } })
}
},
+
switchImg () {
// 天地图 影像
this.imgtype = 0
@@ -439,6 +454,7 @@
)
this.showImgBtn = false
},
+
switchElec () {
// 天地图 矢量
this.imgtype = 1
@@ -454,6 +470,7 @@
)
this.showImgBtn = false
},
+
/**
* @description: 全屏控制
* @return {*} 无返回值
@@ -486,6 +503,7 @@
this.isFullscreen = true
}
},
+
/**
* 在图层中添加实体(点)
* @param {*} item 图标
@@ -732,6 +750,39 @@
tilesetObject[titlesetName] = null
}
},
+
+ /**
+ * 建筑高亮显示
+ * @param {*} positions 建筑范围坐标
+ * @param {*}
+ */
+ showHouse3D (positions, minHeight, maxHeight) {
+ flootEntitysEntites.removeAll()
+ let housePositions = JSON.parse(positions).coordinates[0]
+
+ let floorPositions = housePositions.reduce((prev, curr) => {
+ curr.forEach(item => {
+ prev.push(item)
+ })
+ return prev
+ }, [])
+
+ flootEntitysEntites.add({
+ polygon: {
+ hierarchy: global.DC.Namespace.Cesium.Cartesian3.fromDegreesArrayHeights(floorPositions),
+ heightReference: global.DC.Namespace.Cesium.HeightReference.RELATIVE_TO_GROUND,
+ extrudedHeightReference: global.DC.Namespace.Cesium.HeightReference.RELATIVE_TO_GROUND,
+ height: minHeight,
+ extrudedHeight: maxHeight,
+ material: global.DC.Namespace.Cesium.Color.RED.withAlpha(0.5),
+ }
+ })
+ },
+
+ // 清除建筑3D
+ clearHouse3D () {
+ flootEntitysEntites.removeAll()
+ },
},
}
diff --git a/src/views/house/index.vue b/src/views/house/index.vue
index 7ffbe63..a717cea 100644
--- a/src/views/house/index.vue
+++ b/src/views/house/index.vue
@@ -13,21 +13,50 @@
<div class="house-page container">
<div v-show="boxShow" class="container-content">
<div v-show="contentShow" class="search-box">
- <el-popover ref="popover" placement="bottom" trigger="manual" v-model="searchTreeShowFlag"
- popper-class="tree-search-popup" @mousedown.native="preventFocusLost">
- <el-tree v-show="searchLazyFlag == true" ref="popupTree" style="overflow: auto;"
- class="select-tree-box" :load="loadNode" :lazy="true" :props="props"
- @current-change="currentChangeHandle" @mousedown.native="preventFocusLost"></el-tree>
+ <el-popover
+ ref="popover"
+ placement="bottom"
+ trigger="manual"
+ v-model="searchTreeShowFlag"
+ popper-class="tree-search-popup"
+ @mousedown.native="preventFocusLost"
+ >
+ <el-tree
+ v-show="searchLazyFlag == true"
+ ref="popupTree"
+ style="overflow: auto;"
+ class="select-tree-box"
+ :load="loadNode"
+ :lazy="true"
+ :props="props"
+ @current-change="currentChangeHandle"
+ @mousedown.native="preventFocusLost"
+ ></el-tree>
- <el-tree v-show="searchLazyFlag == false" :empty-text="treeEmptyText" ref="popupTree"
- style="overflow: auto;" class="select-tree-box" :data="searchTreeData" :props="defaultProps"
- :default-expand-all="true" @current-change="currentChangeHandle"
- @mousedown.native="preventFocusLost"></el-tree>
+ <el-tree
+ v-show="searchLazyFlag == false"
+ :empty-text="treeEmptyText"
+ ref="popupTree"
+ style="overflow: auto;"
+ class="select-tree-box"
+ :data="searchTreeData"
+ :props="defaultProps"
+ :default-expand-all="true"
+ @current-change="currentChangeHandle"
+ @mousedown.native="preventFocusLost"
+ ></el-tree>
</el-popover>
- <el-input ref="searchTreeInput" v-model="searchTreeName" @input="searchInputTree"
- @focus="searchTreeShowFlag = true" @blur="searchTreeShowFlag = false" v-popover:popover
- placeholder="请输入搜索条件" style="cursor: pointer;"></el-input>
+ <el-input
+ ref="searchTreeInput"
+ v-model="searchTreeName"
+ @input="searchInputTree"
+ @focus="searchTreeShowFlag = true"
+ @blur="searchTreeShowFlag = false"
+ v-popover:popover
+ placeholder="请输入搜索条件"
+ style="cursor: pointer;"
+ ></el-input>
</div>
<div v-show="contentShow" class="result-content" ref="resultContentBox">
@@ -39,9 +68,15 @@
<div class="housing-bg">
<div class="block">
<el-carousel height="150px">
- <el-carousel-item v-for="(item, index) in villageInfo.pic_url_list" :key="index">
- <el-image style=" height: 100%" :src="item"
- :preview-src-list="villageInfo.pic_url_list"></el-image>
+ <el-carousel-item
+ v-for="(item, index) in villageInfo.pic_url_list"
+ :key="index"
+ >
+ <el-image
+ style=" height: 100%"
+ :src="item"
+ :preview-src-list="villageInfo.pic_url_list"
+ ></el-image>
</el-carousel-item>
</el-carousel>
</div>
@@ -67,16 +102,42 @@
</div>
<div class="nav-tab" ref="navTabBox">
- <div class="nav" :class="navType == 0 ? 'choosed' : ''" @click="navClick" data-type="0">基本信息</div>
- <div class="nav" :class="navType == 1 ? 'choosed' : ''" @click="navClick" data-type="1">报警信息</div>
+ <div
+ class="nav"
+ :class="navType == 0 ? 'choosed' : ''"
+ @click="navClick"
+ data-type="0"
+ >基本信息</div>
+ <div
+ class="nav"
+ :class="navType == 1 ? 'choosed' : ''"
+ @click="navClick"
+ data-type="1"
+ >报警信息</div>
</div>
<div class="base-info" v-show="navType == 0">
<div class="sub-nav-list">
- <div class="sub-nav" :class="{ on: subNavType == 1 }" @click="subNavType = 1">楼栋</div>
- <div class="sub-nav" :class="{ on: subNavType == 2 }" @click="subNavType = 2">出入口</div>
- <div class="sub-nav" :class="{ on: subNavType == 3 }" @click="subNavType = 3">停车场</div>
- <div class="sub-nav" :class="{ on: subNavType == 4 }" @click="subNavType = 4">商业</div>
+ <div
+ class="sub-nav"
+ :class="{ on: subNavType == 1 }"
+ @click="subNavType = 1"
+ >楼栋</div>
+ <div
+ class="sub-nav"
+ :class="{ on: subNavType == 2 }"
+ @click="subNavType = 2"
+ >出入口</div>
+ <div
+ class="sub-nav"
+ :class="{ on: subNavType == 3 }"
+ @click="subNavType = 3"
+ >停车场</div>
+ <div
+ class="sub-nav"
+ :class="{ on: subNavType == 4 }"
+ @click="subNavType = 4"
+ >商业</div>
</div>
<div class="floor-content" v-show="subNavType == 1">
@@ -87,20 +148,30 @@
<div class="build-outBox" ref="BuildOutBox">
<div class="build-box" style="left: 0px;">
<!-- :style="{ width: `calc(${Math.ceil(buildingList.length / 10)} * (356 / 1920) * 100vw` }" -->
- <div class="ridgepole-list" v-for="index of Math.ceil(buildingList.length / 10)"
- :key="index">
- <div v-for="(item, index) in buildingList.slice((index - 1) * 10, index * 10)"
- :key="index" @click="buildingClick(item)"
- :class="{ on: buildingChoosed.name == item.name }" :title="item.name">
+ <div
+ class="ridgepole-list"
+ v-for="index of Math.ceil(buildingList.length / 10)"
+ :key="index"
+ >
+ <div
+ v-for="(item, index) in buildingList.slice((index - 1) * 10, index * 10)"
+ :key="index"
+ @click="buildingClick(item)"
+ :class="{ on: buildingChoosed.name == item.name }"
+ :title="item.name"
+ >
{{
- item.name
+ item.name
}}
</div>
</div>
</div>
</div>
<div class="nextBtn rightBtn" @click="nextBtn">
- <i v-show="buildingList.length > 10 && nextBtnShow" class="el-icon-caret-right"></i>
+ <i
+ v-show="buildingList.length > 10 && nextBtnShow"
+ class="el-icon-caret-right"
+ ></i>
</div>
</div>
@@ -180,9 +251,19 @@
<div class="condo">
<div class="type">选择单元</div>
<div class="type-select">
- <el-select size="small" v-model="unitValue" placeholder="请选择" @change="chooseUnit">
- <el-option v-for="item in unitOptions" :key="item.value" :label="item.label"
- :value="item.value" class="unit-option"></el-option>
+ <el-select
+ size="small"
+ v-model="unitValue"
+ placeholder="请选择"
+ @change="chooseUnit"
+ >
+ <el-option
+ v-for="item in unitOptions"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value"
+ class="unit-option"
+ ></el-option>
</el-select>
</div>
</div>
@@ -230,38 +311,60 @@
</div>
</div>
</div>-->
- <el-main v-loading="pictLoading" element-loading-background="rgba(17, 38, 163, 0.1)"
- element-loading-text="数据正在加载中" element-loading-spinner="el-icon-loading"
- v-show="isShowHouseBox">
+ <el-main
+ v-loading="pictLoading"
+ element-loading-background="rgba(17, 38, 163, 0.1)"
+ element-loading-text="数据正在加载中"
+ element-loading-spinner="el-icon-loading"
+ v-show="isShowHouseBox"
+ >
<div class="floor-outBox">
- <div @click="lastFloorBtn" class="floorBtn" v-show="lastFloorShow">
+ <div
+ @click="lastFloorBtn"
+ class="floorBtn"
+ v-show="lastFloorShow"
+ >
<i class="el-icon-caret-left"></i>
</div>
<div class="floor-box">
<div class="floor-num" style="left: 0">
- <div :class="{ on: floorsType == index }" @click="floorsType = index"
- v-for="index in Math.ceil(unitHouseChoosed.length / 5)" :key="index">
+ <div
+ :class="{ on: floorsType == index }"
+ @click="floorsType = index"
+ v-for="index in Math.ceil(unitHouseChoosed.length / 5)"
+ :key="index"
+ >
{{ unitHouseChoosed[index * 5 - 5].floor_num }}-{{
- unitHouseChoosed[index *
- 5
- - 1]? unitHouseChoosed[index * 5
- - 1].floor_num : unitHouseChoosed[unitHouseChoosed.length - 1].floor_num
+ unitHouseChoosed[index *
+ 5
+ - 1]? unitHouseChoosed[index * 5
+ - 1].floor_num : unitHouseChoosed[unitHouseChoosed.length - 1].floor_num
}}层
</div>
</div>
</div>
- <div @click="nextFloorBtn" class="floorBtn rightFloorBtn" v-show="nextFloorShow">
+ <div
+ @click="nextFloorBtn"
+ class="floorBtn rightFloorBtn"
+ v-show="nextFloorShow"
+ >
<i class="el-icon-caret-right"></i>
</div>
</div>
<div class="floor-detail">
- <div v-for="(item, index) in unitHouseChoosed.slice((floorsType - 1) * 5, floorsType * 5)"
- :key="index">
+ <div
+ v-for="(item, index) in unitHouseChoosed.slice((floorsType - 1) * 5, floorsType * 5)"
+ :key="index"
+ >
<div class="title">{{ item.floor_num }}层：</div>
<div class="detail">
- <div v-for="(value, index) in item.floor_house" :key="index"
- @click="residentDetailsClick(value)">
+ <div
+ v-for="(value, index) in item.floor_house"
+ :key="index"
+ @click="residentDetailsClick(value)"
+ :class="{ on: floorChoosed.house_num == value.house_num }"
+ >
<!-- :class="[{ 'chuzu': value.houseType == '出租' }, { 'zizhu': value.houseType == '自住' }, { 'kongzhi': value.houseType == '空置' }, { 'shangye': value.houseType == '商业' }]" -->
{{ value.house_num }}
<!-- <div class="flow"></div>
@@ -276,36 +379,60 @@
</div>
<div class="come-out-content" v-show="subNavType == 2">
- <el-table :data="comeOutData" style="width: 100%"
+ <el-table
+ :data="comeOutData"
+ style="width: 100%"
:header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
:cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
- :row-class-name="tableRowClassName" @row-click="deepDataRowClick($event, 'comeOut')">
- <el-table-column prop="name" label="名称" width="180"
- :show-overflow-tooltip="true"></el-table-column>
+ :row-class-name="tableRowClassName"
+ @row-click="deepDataRowClick($event, 'comeOut')"
+ >
+ <el-table-column
+ prop="name"
+ label="名称"
+ width="180"
+ :show-overflow-tooltip="true"
+ ></el-table-column>
<el-table-column prop="x" label="经度" width="100"></el-table-column>
<el-table-column prop="y" label="纬度" width="100"></el-table-column>
</el-table>
</div>
<div class="park-content" v-show="subNavType == 3">
- <el-table :data="parkingLotData" style="width: 100%"
+ <el-table
+ :data="parkingLotData"
+ style="width: 100%"
:header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
:cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
- :row-class-name="tableRowClassName" @row-click="deepDataRowClick($event, 'park')">
- <el-table-column prop="name" label="名称" width="180"
- :show-overflow-tooltip="true"></el-table-column>
+ :row-class-name="tableRowClassName"
+ @row-click="deepDataRowClick($event, 'park')"
+ >
+ <el-table-column
+ prop="name"
+ label="名称"
+ width="180"
+ :show-overflow-tooltip="true"
+ ></el-table-column>
<el-table-column prop="x" label="经度" width="100"></el-table-column>
<el-table-column prop="y" label="纬度" width="100"></el-table-column>
</el-table>
</div>
<div class="business-content" v-show="subNavType == 4">
- <el-table :data="businessData" style="width: 100%"
+ <el-table
+ :data="businessData"
+ style="width: 100%"
:header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
:cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
- :row-class-name="tableRowClassName" @row-click="deepDataRowClick($event, 'business')">
- <el-table-column prop="name" label="名称" width="180"
- :show-overflow-tooltip="true"></el-table-column>
+ :row-class-name="tableRowClassName"
+ @row-click="deepDataRowClick($event, 'business')"
+ >
+ <el-table-column
+ prop="name"
+ label="名称"
+ width="180"
+ :show-overflow-tooltip="true"
+ ></el-table-column>
<el-table-column prop="x" label="经度" width="100"></el-table-column>
<el-table-column prop="y" label="纬度" width="100"></el-table-column>
</el-table>
@@ -313,35 +440,62 @@
</div>
<div class="police-info" v-if="navType == 1" ref="policeTableBox">
- <el-table :data="callPoliceData" style="width: 100%" :height="currentTableHeight"
+ <el-table
+ :data="callPoliceData"
+ style="width: 100%"
+ :height="currentTableHeight"
:header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
:cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
- :row-class-name="tableRowClassName" @row-click="clickData">
- <el-table-column prop="JJDWMC" :show-overflow-tooltip="true" label="接警单位"
- min-width="34%"></el-table-column>
+ :row-class-name="tableRowClassName"
+ @row-click="clickData"
+ >
+ <el-table-column
+ prop="JJDWMC"
+ :show-overflow-tooltip="true"
+ label="接警单位"
+ min-width="34%"
+ ></el-table-column>
<el-table-column label="报警时间" min-width="26%">
<template slot-scope="scope">
<span>{{ scope.row.BJSJ.substring(0, 10) }}</span>
</template>
</el-table-column>
- <el-table-column prop="JJYXM" :show-overflow-tooltip="true" label="接警员"
- min-width="20%"></el-table-column>
- <el-table-column prop="BJRXM" :show-overflow-tooltip="true" label="报警人"
- min-width="20%"></el-table-column>
+ <el-table-column
+ prop="JJYXM"
+ :show-overflow-tooltip="true"
+ label="接警员"
+ min-width="20%"
+ ></el-table-column>
+ <el-table-column
+ prop="BJRXM"
+ :show-overflow-tooltip="true"
+ label="报警人"
+ min-width="20%"
+ ></el-table-column>
</el-table>
<div class="pages" ref="ElPagination">
- <el-pagination background layout="prev, pager, next" :page-size="callPolicePage.pageSize"
- :page-count="callPolicePage.count" :current-page="callPolicePage.currentPage"
- @current-change="handleCurrentChange"></el-pagination>
+ <el-pagination
+ background
+ layout="prev, pager, next"
+ :page-size="callPolicePage.pageSize"
+ :page-count="callPolicePage.count"
+ :current-page="callPolicePage.currentPage"
+ @current-change="handleCurrentChange"
+ ></el-pagination>
</div>
</div>
</div>
</div>
<!-- <transition name="special-animal"></transition>-->
<div class="search-content">
- <input v-model="searchExtensivelyValue" @input="searchExtensivelyChange" @focus="searchExtensivelyFocus"
- type="text" placeholder="请输入搜索条件" />
+ <input
+ v-model="searchExtensivelyValue"
+ @input="searchExtensivelyChange"
+ @focus="searchExtensivelyFocus"
+ type="text"
+ placeholder="请输入搜索条件"
+ />
<div class="clear" v-show="isShowClearBtn" @click="clearSearchValue" title="清空">
<img src="../../../public/img/icon/clear.png" alt />
</div>
@@ -349,13 +503,23 @@
</div>
<div v-show="searchExtensivelyValBoxShow" class="searchExtensively-val-box">
<div>
- <div @click="searchExtensivelyVlaClick(item)" v-for="(item, index) in searchExtensivelyArray"
- :key="index">{{ item.name }}</div>
+ <div
+ @click="searchExtensivelyVlaClick(item)"
+ v-for="(item, index) in searchExtensivelyArray"
+ :key="index"
+ >{{ item.name }}</div>
</div>
</div>
- <el-dialog title="报警信息" :modal="true" :visible.sync="policeSituationVisible" :append-to-body="true"
- :before-close="policeSituationBeforeClose" :close-on-click-modal="true" class="policeSituation-details-box">
+ <el-dialog
+ title="报警信息"
+ :modal="true"
+ :visible.sync="policeSituationVisible"
+ :append-to-body="true"
+ :before-close="policeSituationBeforeClose"
+ :close-on-click-modal="true"
+ class="policeSituation-details-box"
+ >
<div class="box">
<div class="item">
<div>接警单位编号:</div>
@@ -416,19 +580,34 @@
</div>
</el-dialog>
- <el-dialog :title="residentDetailsTitle" :modal="false" :visible.sync="residentDetailsShow"
- :before-close="residentDetailsClose" :close-on-click-modal="true" class="resident-details-box" width="30%">
- <el-table :data="houseDate"
+ <el-dialog
+ :title="residentDetailsTitle"
+ :modal="false"
+ :visible.sync="residentDetailsShow"
+ :before-close="residentDetailsClose"
+ :close-on-click-modal="true"
+ class="resident-details-box"
+ width="30%"
+ >
+ <el-table
+ :data="houseDate"
:header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
- :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }">
+ :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75' }"
+ >
<el-table-column prop="realName" label="姓名"></el-table-column>
<el-table-column prop="phone" label="电话"></el-table-column>
<el-table-column prop="cardNo" label="身份证号"></el-table-column>
</el-table>
</el-dialog>
- <el-dialog :title="keyPersonTitle" :modal="false" :visible.sync="keyPersonVisible"
- :before-close="keyPersonBeforeClose" :close-on-click-modal="true" class="keyPerson-details-box">
+ <el-dialog
+ :title="keyPersonTitle"
+ :modal="false"
+ :visible.sync="keyPersonVisible"
+ :before-close="keyPersonBeforeClose"
+ :close-on-click-modal="true"
+ class="keyPerson-details-box"
+ >
<div class="header">
<div>
姓名：
@@ -439,11 +618,18 @@
<input type="text" v-model="callPhone" placeholder="请输入联系电话" />
</div>
<el-button type="primary" icon="el-icon-search" @click="searchPeopleDetail">搜索</el-button>
- <el-button type="primary" icon="el-icon-delete" @click="clearPeopleDetailSearchValue">清空</el-button>
+ <el-button
+ type="primary"
+ icon="el-icon-delete"
+ @click="clearPeopleDetailSearchValue"
+ >清空</el-button>
</div>
- <el-table :data="personDetailArr" style="width: 100%"
+ <el-table
+ :data="personDetailArr"
+ style="width: 100%"
:header-cell-style="{ 'text-align': 'center', 'background-color': '#203c60', 'borderColor': '#324e75' }"
- :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }">
+ :cell-style="{ 'text-align': 'center', 'borderColor': '#324e75', 'cursor': 'pointer' }"
+ >
<el-table-column label="序号" type="index" width="50" align="center">
<template slot-scope="scope">
<span>{{(peoplePage.currentPage - 1) * peoplePage.pageSize + scope.$index + 1}}</span>
@@ -458,9 +644,14 @@
<el-table-column prop="areaName" label="所属责任区"></el-table-column>
</el-table>
<div class="pages" ref="tablePagination">
- <el-pagination background layout="prev, pager, next" :page-size="peoplePage.pageSize"
- :total="peoplePage.total" :current-page="peoplePage.currentPage"
- @current-change="peopleHandleCurrentChange"></el-pagination>
+ <el-pagination
+ background
+ layout="prev, pager, next"
+ :page-size="peoplePage.pageSize"
+ :total="peoplePage.total"
+ :current-page="peoplePage.currentPage"
+ @current-change="peopleHandleCurrentChange"
+ ></el-pagination>
</div>
</el-dialog>
</div>
@@ -575,6 +766,7 @@
callPhone: '',
pictLoading: false,
isShowHouseBox: true,
+ floorChoosed: {},
}
},
@@ -623,13 +815,13 @@
// titlesetUrl: '/sd/tileset.json'
// })
- this.$EventBus.$emit('toPosition', {
- siteJd: 116.027212,
- siteWd: 28.678499,
- siteGd: 600,
- siteHeading: -3,
- sitePitch: -45
- })
+ // this.$EventBus.$emit('toPosition', {
+ // siteJd: 116.027212,
+ // siteWd: 28.678499,
+ // siteGd: 600,
+ // siteHeading: -3,
+ // sitePitch: -45
+ // })
if (wallLayer == null) {
wallLayer = new global.DC.VectorLayer('wallLayer')
@@ -799,7 +991,11 @@
// 楼栋单元楼层户室查询
getHouses (build_id, adcode) {
getHouses(build_id, adcode).then(res => {
- console.log(3333, res.data.data, res.data.data == null)
+ // let maxHeight = res.data.data.floor_num * 2.8
+ let maxHeight = 98
+ console.log(3333, res.data.data)
+ this.$EventBus.$emit('showHouse3D', { positions: res.data.data.geom, minHeight: 0, maxHeight: maxHeight })
+
if (res.data.data != null) {
let unitData = res.data.data.unit[this.unitValue - 1].house
this.floorInfo.house_num = unitData.length
@@ -835,10 +1031,13 @@
return 'rows'
},
+ // 点击户室
residentDetailsClick (params) {
+ this.floorChoosed = params
this.getVillagePersonInfo(params.house_id)
this.residentDetailsTitle = `${params.house_num}住户信息`
this.residentDetailsShow = true
+ this.$EventBus.$emit('showHouse3D', { positions: params.geom, minHeight: params.minHeight, maxHeight: params.minHeight + params.floor_h })
},
residentDetailsClose () {
@@ -1188,6 +1387,7 @@
layerName: 'deepDataLayer',
type: 'VectorLayer'
})
+ this.$EventBus.$emit('clearHouse3D')
wallLayer.clear()
window.removeEventListener('resize', this.setTableHeight)
@@ -1268,7 +1468,7 @@
border-radius: 10px;
overflow: hidden;
- &>div {
+ & > div {
height: 100%;
overflow-y: auto;
@@ -1303,9 +1503,11 @@
left: 10px;
right: 10px;
bottom: 4px;
- background: linear-gradient(135deg,
- rgb(33 150 243 / 74%),
- rgb(254 254 254 / 0%));
+ background: linear-gradient(
+ 135deg,
+ rgb(33 150 243 / 74%),
+ rgb(254 254 254 / 0%)
+ );
z-index: -1;
}
}
@@ -1316,7 +1518,7 @@
}
.housing-introduce {
- &>div {
+ & > div {
padding: 0 10px;
display: flex;
@@ -1379,7 +1581,7 @@
}
}
- &>.floor-content {
+ & > .floor-content {
.build-info {
display: flex;
position: relative;
@@ -1428,7 +1630,7 @@
flex-wrap: wrap;
width: 356px;
- &>div {
+ & > div {
display: flex;
align-items: center;
justify-content: center;
@@ -1462,7 +1664,7 @@
.content {
display: flex;
- &>div {
+ & > div {
height: 26px;
line-height: 26px;
flex: 1;
@@ -1470,11 +1672,11 @@
justify-content: center;
border-right: 1px solid #50555f;
- &>div {
+ & > div {
cursor: pointer;
}
- &>div:last-child {
+ & > div:last-child {
margin-left: 14px;
font-size: 18px;
font-weight: bold;
@@ -1482,11 +1684,11 @@
}
}
- &>div:first-child {
+ & > div:first-child {
width: 30%;
}
- &>div:last-child {
+ & > div:last-child {
border: none;
}
}
@@ -1511,10 +1713,10 @@
display: flex;
justify-content: space-around;
- &>div {
+ & > div {
flex: 1;
- &>div:first-child {
+ & > div:first-child {
height: 30px;
line-height: 30px;
font-size: 18px;
@@ -1522,7 +1724,7 @@
color: #499d99;
}
- &>div:last-child {
+ & > div:last-child {
height: 26px;
line-height: 26px;
}
@@ -1537,8 +1739,8 @@
justify-content: space-around;
background: rgba(8, 56, 185, 0.5);
- &>div {
- &>div:first-child {
+ & > div {
+ & > div:first-child {
height: 30px;
line-height: 30px;
font-size: 18px;
@@ -1576,7 +1778,6 @@
}
.house-element-info {
-
.condo,
.legend {
display: flex;
@@ -1599,12 +1800,12 @@
display: flex;
flex: 1;
- &>div {
+ & > div {
flex: 1;
display: flex;
align-items: center;
- &>span {
+ & > span {
margin: 0 10px;
width: 14px;
height: 8px;
@@ -1671,7 +1872,7 @@
left: 0;
transition: all 1s;
- &>div {
+ & > div {
margin: 0 4px;
display: flex;
justify-content: center;
@@ -1684,7 +1885,7 @@
border: 0.0925925926vh solid #fff;
}
- &>.on {
+ & > .on {
border: 1px solid orange;
color: orange;
}
@@ -1696,7 +1897,7 @@
margin-top: 14px;
height: 220px;
- &>div {
+ & > div {
margin: 8px;
height: 36px;
line-height: 36px;
@@ -1710,7 +1911,7 @@
flex: 1;
display: flex;
- &>div {
+ & > div {
margin: 0 4px;
position: relative;
width: 68px;
@@ -1734,29 +1935,38 @@
}
.focus {
- top: calc((100% - 18px) / 4 * 2 + 6px);
+ top: calc(
+ (100% - 18px) / 4 * 2 + 6px
+ );
background: rgb(255, 121, 108);
}
.warning {
- top: calc((100% - 18px) / 4 * 3 + 12px);
+ top: calc(
+ (100% - 18px) / 4 * 3 + 12px
+ );
background: rgb(254, 172, 4);
}
}
- &>.chuzu {
+ & > .on {
+ color: orange;
+ border-color: orange !important;
+ }
+
+ & > .chuzu {
border: 1px solid #3a8b3a;
}
- &>.zizhu {
+ & > .zizhu {
border: 1px solid #2c77bb;
}
- &>.kongzhi {
+ & > .kongzhi {
border: 1px solid #5c6169;
}
- &>.shangye {
+ & > .shangye {
border: 1px solid #cc9456;
}
}
@@ -1877,7 +2087,7 @@
border-radius: 10px;
overflow: hidden;
- &>div {
+ & > div {
height: 100%;
overflow-y: auto;
@@ -1907,9 +2117,11 @@
height: 100%;
overflow: hidden;
border-radius: 2px;
- background: linear-gradient(135deg,
- rgba(252, 252, 252, 0.108),
- rgb(254, 254, 254));
+ background: linear-gradient(
+ 135deg,
+ rgba(252, 252, 252, 0.108),
+ rgb(254, 254, 254)
+ );
animation: prog 3s ease infinite;
}
diff --git a/src/views/video/list.vue b/src/views/video/list.vue
index 153e20a..7018fa9 100644
--- a/src/views/video/list.vue
+++ b/src/views/video/list.vue
@@ -195,11 +195,12 @@
props: {
label: 'name',
children: 'zones',
- isLeaf: (data, node) => {
- if (node.level === 4) {
- return true
- }
- }
+ isLeaf: true
+ // isLeaf: (data, node) => {
+ // if (node.level === 4) {
+ // return true
+ // }
+ // }
},
}
},
@@ -273,6 +274,7 @@
sitePitch: -90
})
},
+
async siteClick (e) {
if (this.flvPlayer != null) {
@@ -612,32 +614,40 @@
async treeClick (node) {
if (node.parent == false) {
- console.log(node, node.name, node.id, node.basicData.channelId)
- let flvUrl = ''
- await this.getDevices(node.id).then(res => {
- flvUrl = res
+ console.log(node, node.name, node.id, node.basicData.channelId, node.basicData.longitude, node.basicData.latitude)
+ this.$EventBus.$emit('toPosition', {
+ siteJd: node.basicData.longitude,
+ siteWd: node.basicData.latitude,
+ siteGd: 600,
})
- console.log(flvUrl, 111)
- if (typeof flvUrl === 'object') {
- this.$message.error(flvUrl.msg)
- return
- }
- this.dialogVisible = true
+ this.$EventBus.$emit('mapClearLayer', {
+ layerName: 'searchLayer',
+ type: 'VectorLayer'
+ })
+ this.$EventBus.$emit('layerPointAdd', {
+ layerName: 'searchLayer',
+ type: 'label',
+ params: {
+ lng: node.basicData.longitude,
+ lat: node.basicData.latitude,
+ alt: 0,
+ text: node.name
+ }
+ })
+ this.$EventBus.$emit('layerPointAdd', {
+ layerName: 'searchLayer',
+ type: "billboard",
+ params: {
+ name: node.name,
+ lng: node.basicData.longitude,
+ lat: node.basicData.latitude,
+ alt: 100,
+ url: '/img/icon/video.png',
+ channelId: node.id
+ },
+ incident: this.siteClick
+ })
- if (flvjs.isSupported()) {
- this.$nextTick(() => {
- var videoElement = document.getElementById('videoElement')
- this.flvPlayer = flvjs.createPlayer({
- type: 'flv',
- isLive: true,
- hasAudio: false,
- url: flvUrl
- })
- this.flvPlayer.attachMediaElement(videoElement)
- this.flvPlayer.load()
- this.flvPlayer.play()
- })
- }
}
},
},
--
Gitblit v1.9.3