From 6855e40251f40035d58dc69a842da60a7e5e6b65 Mon Sep 17 00:00:00 2001 From: chenchenzai Date: Fri, 25 Nov 2022 14:16:13 +0800 Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E4=BF=AE=E6=94=B9=E7=9A=84=E6=96=87?= =?UTF-8?q?=E4=BB=B6=E5=90=8D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../area/components/ImportantAreaPop.vue | 727 +---------- .../area/components/ImportantAreaPop1.vue | 1132 +++++++++++++++++ .../area/components/ImportantAreaPopBack.vue | 511 -------- .../area/components/ImportantAreaPopNew.vue | 1132 +++++++++++++++++ .../components/EventListDetailsPop.vue | 309 +---- .../components/EventListDetailsPop1.vue | 459 +++++++ .../components/EventListDetailsPopBack.vue | 202 --- .../components/EventListDetailsPopNew.vue | 459 +++++++ 8 files changed, 3261 insertions(+), 1670 deletions(-) create mode 100644 src/views/pages/area/components/ImportantAreaPop1.vue delete mode 100644 src/views/pages/area/components/ImportantAreaPopBack.vue create mode 100644 src/views/pages/area/components/ImportantAreaPopNew.vue create mode 100644 src/views/pages/civilizedCity/components/EventListDetailsPop1.vue delete mode 100644 src/views/pages/civilizedCity/components/EventListDetailsPopBack.vue create mode 100644 src/views/pages/civilizedCity/components/EventListDetailsPopNew.vue diff --git a/src/views/pages/area/components/ImportantAreaPop.vue b/src/views/pages/area/components/ImportantAreaPop.vue index 433b9f7..df87287 100644 --- a/src/views/pages/area/components/ImportantAreaPop.vue +++ b/src/views/pages/area/components/ImportantAreaPop.vue @@ -2,49 +2,17 @@
- 重点区域详情 + {{ feature.data.areaName || "" }}
-
-
-

- 区域名称： - {{ feature.data.areaName || "" }} -

-

- 位置： - {{ feature.data.location || "" }} -

-
-
-

- 管理单位： - {{ feature.data.management || "" }} -

-

- 区域简介： - {{ getAbout(feature.data.about)}} -

-
-
-

- 负责人： - 张三 -

-

- 联系方式： - 13360907765 -

-
+
{{ feature.data.location || "" }}
-
-
-
- {{item.menuName}} -
+
+
+
管理单位：{{ feature.data.management || "" }}
+ +
景区简介：{{ getAbout(feature.data.about)}}
+
-
-
-
当前人数
@@ -58,6 +26,20 @@
外地人数
{{ feature.data.nonlocalNums || "0" }}人
+
@@ -72,20 +54,26 @@
-
-
- 月累计人数： - 123112 -
-
- 月累计同比： - -1.5% -
+ +
+ + + 暂无图片
-

人员聚集明细

+

周边监控

- + - +
-
-
-
- - - - - - - - -
-
- 右 -
-
-
-
- 姓名: - - - 人员类型: - - - - - 查询 -
-
- - - - - - - - - - - - - - - - - -
-
-
-
- 设施类型: - - - - - 位置： - - - 查询 -
-
- - - - - - - - - - - - - - -
-
@@ -246,7 +102,6 @@ import 'viewerjs/dist/viewer.css' import { directive as viewer } from "v-viewer" import * as echarts from 'echarts' import { selectLocalWeekArea, selectLocalMonthArea, selectByAreaImage } from '@/api/area.js' -import { getCameraAll,getCameraLabel,getCameraAllLabel,searchCamera,getCameraAllOrgan,getCameraByParentId,selectByLabelName,selectByChannelName } from '@/api/videoSurveillance/index' export default { name: "", props: { @@ -258,8 +113,7 @@ export default { }, }, mounted() { - this.$nextTick(() => { - selectLocalWeekArea({areaName: this.feature.data.areaName}).then((res) => { + selectLocalWeekArea({areaName: this.feature.data.areaName}).then((res) => { res.data.data.forEach((item) => { this.weekData.time.unshift(item.pushTime) this.weekData.local.unshift(item.localNums) @@ -268,8 +122,6 @@ export default { this.chartData = this.weekData this.initCharts() }) - }) - selectLocalMonthArea({areaName: this.feature.data.areaName}).then((res) => { res.data.data.forEach((item) => { this.monthData.time.unshift(item.pushTime) @@ -287,32 +139,14 @@ export default { }) } }) - getCameraAllLabel().then((res) => { - this.tabList = res.data.data - }); - getCameraAll().then((res) => { - this.cameraAllData = res.data - // this.addResourceTomap('cameraAll',res.data); - }) - getCameraAllOrgan({parentId:'S4NbecfYB1DBH8HNULGS34'}).then((res) => { - this.cameraTree = res.data.data - console.log(this.cameraTree) - res.data.data.forEach((item) => { - this.cameraTreeSingle.push({ - channelName: item.name, - children: [] - }) - }) - }) }, data() { return { filterButton:{ - typeSelect:['当天人流量','近30天人流量',], - typeSelectActive:'当天人流量', + typeSelect:['近7天','近30天',], + typeSelectActive:'近7天', }, cameraData: [], - personnelAggregationData:[], weekData:{ time:[], local:[], @@ -324,30 +158,7 @@ export default { outer:[], }, chartData:{}, - picUrl: '', - selectedIndex:0, - menuList:[{ - menuName:"人流量", - },{ - menuName:"视频监控", - },{ - menuName:"人员", - },{ - menuName:"设施", - }], - peopleTypeOption:[{label:"人员类型",value:"1"}], - peopleDataResource:[{name:"张三",peopleType:"普通",department:"市政府",sex:"男",telePhone:"1334650987"}], - searchNameValue:"",//查询姓名 - selectTypeValue:"",//人员类型 - addressValue:"",//位置 - selectedFacilitiesType:"",//设施类型 - facilitiesTypeOption:[{label:"设施类型",value:"1"}], - facilitiesDataResource:[{facilitiesType:"设施类型1",address:"李沧",manageMan:"张山",telePhone:"1334650987"}], - cameraAllData:[], - cameraTreeIsShow:true, - cameraTreeSingle: [], - checkStatus: '2', - cameraTree:[], + picUrl: '' }; }, methods: { @@ -495,121 +306,6 @@ export default { const viewer = this.$el.querySelector('.images').$viewer viewer.show() }, - //点击上部Tab底部显示不同的内容 - handleCheck(item,index){ - this.selectedIndex = index; - }, - //点击查询按钮查询列表数据 - handleSearch(){ - if(this.selectedIndex ==2){ - console.log('人员类型',this.selectTypeValue); - //this.peopleDataResource(); - }else if(this.selectedIndex ==3){ - console.log('位置',this.selectedFacilitiesType); - //this.peopleDataResource(); - } - }, - searchLabel(value) { - const params = { - labelName:value - } - selectByLabelName(params).then((res) => { - console.log(res) - this.tabList = res.data.data - }) - }, - searchCameraTree(value) { - if(value.length > 0){ - const params = { - channelName:value - } - selectByChannelName(params).then((res) => { - console.log(res) - this.cameraTree = [] - res.data.data.forEach((item) => { - this.cameraTree.push({ - name: item.channelName, - gpsX: item.gpsX, - gpsY: item.gpsY, - channelCode:item.channelCode, - leaf:true, - }) - }) - }) - }else { - getCameraAllOrgan({parentId:'S4NbecfYB1DBH8HNULGS34'}).then((res) => { - this.cameraTree = res.data.data - }) - } - }, - reset() { - this.checkboxGroup = [] - this.checkStatus = "2"; - this.cameraTreeIsShow = true - getCameraAllOrgan({parentId:'S4NbecfYB1DBH8HNULGS34'}).then((res) => { - this.cameraTree = res.data.data - }) - document.getElementById("tree").scrollTop = 0; - }, - loadNode(node, resolve) { - // if (node.level === 0) { - // return resolve([{ name: 'region' }]); - // } - console.log(node) - if (node.level > 0) { - let subData = [] - getCameraAllOrgan({parentId:node.data.id}).then((res) => { - if(res.data.data.length == 0){ - const params = { - parentId:node.data.id, - checkStatus: this.checkStatus=='2'?["0","1"]:this.checkStatus, - } - getCameraByParentId(params).then((res) => { - res.data.data.forEach((item) => { - subData.push({ - name: item.channelName, - gpsX: item.gpsX, - gpsY: item.gpsY, - channelCode:item.channelCode, - checkStatus:item.checkStatus, - leaf:true, - }) - }) - return resolve(subData); - }) - }else{ - subData = res.data.data - return resolve(subData); - } - }) - } - }, - treeCameraClick(data) { - console.log(data) - if(data.channelCode){ - const cameraTree = [{ - latLng: { lat: data.gpsY, lng: data.gpsX }, - data: data, - type:'cameraTree' - }] - this.$parent.hiMapFun.removeLayerByLayerName("cameraTree"); - this.$parent.hiMapFun.openPopupVideoSurveillance(cameraTree[0]) - const arr = [0,0.0,'','0','0.0'] - if(arr.indexOf(data.gpsX) == -1){ - this.$parent.hiMapFun.addResourceOnMapWithoutSuperMapCluster(cameraTree,"poi-red.png", "cameraTree"); - this.$parent.hiMap.mapObj.map.flyTo({ lat: data.gpsY, lng: data.gpsX }); - } - } - }, - filterNode(value, data) { - if (value == "2") return true; - if (value == "0") { - return data.checkStatus == 0; - } - if (value == "1") { - return data.checkStatus == 1; - } - }, }, directives: { viewer: viewer({ @@ -629,8 +325,8 @@ export default { border: 1px solid rgba(50,227,235,.95); } .leaflet-popup-content { - width: 750px !important; - height: 500px; + width: 734px !important; + height: 453px; padding: 12px 16px; .pop-box { width: 100%; @@ -649,9 +345,6 @@ export default { .title{ color: #fff; font-size: 16px; - span:nth-child(1) { - font-weight:bold; - } span:nth-child(2) { display: inline-block; width: 40px; @@ -665,68 +358,18 @@ export default { } } - .site-base-information{ - height: 90px; + .site-address { margin: 6px 0; padding-left: 20px; + background: url(../../../../assets/construction/iconAddress.png) no-repeat left center; color: rgba(255, 255, 255, .6); - padding: 10px; - //line-height: 26px; - .item{ - width: 100%; - height:20px; - //background-color: red; - margin-top: 10px; - display: flex; - flex-wrap: wrap; - &>p{ - margin: 0 !important; - width:50%; - flex:1; - color:#ffffff; - } - - } - .item:first-child{ - margin-top: 0; - } } .site-content { display: flex; - flex-direction: column; - .site-content-title{ - width:100%; - height:30px; - //background-color:red; - border-bottom:solid 1px #fff ; - display: flex; - flex-wrap: wrap; - .item{ - padding-top: 5px; - margin-left: 2px; - //flex:1; - height:30px; - width:100px; - text-align: center; - //background: #abcdef; - line-height: 25px; - cursor: pointer; - } - .is-active{ - text-decoration:underline; - } - } - .site-content-content{ - display: flex; - flex-direction: row; - padding-top: 10px; - .site-content-left { - width: 372px; - margin-right: 15px; - height: 310px; - overflow-y: auto; - overflow-x: hidden; + .site-content-left { + width: 392px; + margin-right: 29px; .left-mid-line { margin: 6px 0; } @@ -773,87 +416,9 @@ export default { height: 206px; } } - .el-input { - width: 328px; - } - .el-input__inner { - border: 1px solid rgba(31,254,253,.9); - color: #fff; - border-radius: unset; - background: rgba($color: #203b5d, $alpha: .8); - &::placeholder { - color: rgba($color: #fff, $alpha: 0.6); - } - } - .el-input__prefix { - color: rgba(31,254,253,.9); - } - - .el-checkbox-group { - height: 316px; - width: 372px; - overflow-y: auto; - margin-top: 6px; - &::-webkit-scrollbar { - width: 8px; - background-color: #10335e; - } - &::-webkit-scrollbar-thumb { - background-color: #446dac !important; - } - } - .el-checkbox-button { - border-radius: 15px; - margin: 10px; - .el-checkbox-button__inner { - height: 30px; - line-height: 6px; - border-radius: 15px; - background: linear-gradient(0deg, rgba($color: #24517b, $alpha: 1) 0, rgba($color: #24517b, $alpha: 0) 100%); - border: 1px solid #1d98a0; - font-size: 16px; - color: #1ffefd; - } - .el-checkbox-button__inner:hover { - border: 1px solid #1ffefd; - background: linear-gradient(0deg, #1577d3 0%, #1251ab 100%); - } - } - .el-checkbox-button.is-checked { - .el-checkbox-button__inner{ - color: #fff; - border: 1px solid #1ffefd; - background: linear-gradient(0deg, #1577d3 0%, #1251ab 100%); - } - } - - .el-tree { - width: 366px; - height: 300px; - overflow-y: auto; - margin-top: 10px; - background: transparent; - color: #fff; - - &::-webkit-scrollbar { - width: 8px; - background-color: #10335e; - } - &::-webkit-scrollbar-thumb { - background-color: #446dac !important; - } - - .el-tree-node__content:hover { - background: rgba(27,255,255,.2); - } - .el-tree-node:focus > .el-tree-node__content { - background-color: rgba(27,255,255,.2); - color: #fff; - } - } } .site-content-right { - width: 400px; + width: 280px; .img-container { width: 280px; height: 158px; @@ -862,22 +427,6 @@ export default { align-items: center; justify-content: center; } - .people-total{ - width: 310px; - height: 60px; - cursor: pointer; - display: -webkit-box; - display: -ms-flexbox; - display: flex; - -webkit-box-align: center; - -ms-flex-align: center; - align-items: center; - -webkit-box-pack: center; - -ms-flex-pack: center; - .year-on-year{ - margin-left: 10px; - } - } .video-table { margin-top: 20px; h4 { @@ -910,176 +459,6 @@ export default { } } } - } - - } - .table-filter{ - width:100%; - height:30px; - //background-color: red; - //text-align: center; - display: flex; - justify-content: "space-between"; - width:700px; - margin-top: 10px; - .span-text{ - line-height: 30px; - margin-right: 10px; - } - .el-input { - width: 200px; - } - .el-input__inner { - width: 160px; - height: 30px; - padding-left:5px; - border: 1px solid rgba(31,254,253,.9); - color: #fff; - background: rgba($color: #203b5d, $alpha: .8); - border-radius: unset; - &::placeholder { - color: rgba($color: #fff, $alpha: 0.6); - } - } - .el-input__prefix { - color: rgba(31,254,253,.9); - left: 130px; - i{ - height: 30px; - line-height: 30px; - } - //width:160px; - } - - .el-select { - // margin-left: 10px; - .el-input { - width: 160px; - } - .el-input__suffix-inner{ - i{line-height: 30px;} - } - } - .el-button{ - position: absolute; - right: 18px; - //height: 30px; - line-height: 0; - background-color: #1fa2fe; - border:solid 1px #1fa2fe ; - color:#ffffff; - } - } - .site-content-people { - display: flex; - flex-direction: column; - .people-table{ - margin-top: 10px; - .el-table { - border: 1px solid #325d94; - width: 100%; - background: transparent; - th,td { - border-right: 1px solid #325d94 !important; - } - // .descending.is-leaf.is-sortable { - // .sort-caret { - // border-top-color: #1dfeff; - // } - // } - } - .cell { - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; - font-size: 16px; - font-weight: normal; - text-align: center; - height: 36px; - line-height: 36px; - } - .el-table th.is-leaf { - border: 1px solid #1f557c; - } - .el-table td { - border: 0; - padding: 5px 0; - } - .el-table th { - padding: 5px 0; - } - .el-table::before { - height: 0px; - } - .el-table__row:nth-of-type(even) > td { - background-color: #113660 !important; - } - .el-table__body-wrapper { - &::-webkit-scrollbar { - width: 8px; - background-color: #10335e; - } - &::-webkit-scrollbar-thumb { - background-color: #446dac !important; - } - } - } - - } - .site-content-facilities { - display: flex; - flex-direction: column; - .facilities-table{ - margin-top: 10px; - .el-table { - border: 1px solid #325d94; - width: 100%; - background: transparent; - th,td { - border-right: 1px solid #325d94 !important; - } - // .descending.is-leaf.is-sortable { - // .sort-caret { - // border-top-color: #1dfeff; - // } - // } - } - .cell { - white-space: nowrap; - text-overflow: ellipsis; - overflow: hidden; - font-size: 16px; - font-weight: normal; - text-align: center; - height: 36px; - line-height: 36px; - } - .el-table th.is-leaf { - border: 1px solid #1f557c; - } - .el-table td { - border: 0; - padding: 5px 0; - } - .el-table th { - padding: 5px 0; - } - .el-table::before { - height: 0px; - } - .el-table__row:nth-of-type(even) > td { - background-color: #113660 !important; - } - .el-table__body-wrapper { - &::-webkit-scrollbar { - width: 8px; - background-color: #10335e; - } - &::-webkit-scrollbar-thumb { - background-color: #446dac !important; - } - } - } } } diff --git a/src/views/pages/area/components/ImportantAreaPop1.vue b/src/views/pages/area/components/ImportantAreaPop1.vue new file mode 100644 index 0000000..433b9f7 --- /dev/null +++ b/src/views/pages/area/components/ImportantAreaPop1.vue @@ -0,0 +1,1132 @@ + + + + diff --git a/src/views/pages/area/components/ImportantAreaPopBack.vue b/src/views/pages/area/components/ImportantAreaPopBack.vue deleted file mode 100644 index df87287..0000000 --- a/src/views/pages/area/components/ImportantAreaPopBack.vue +++ /dev/null @@ -1,511 +0,0 @@ - - - - diff --git a/src/views/pages/area/components/ImportantAreaPopNew.vue b/src/views/pages/area/components/ImportantAreaPopNew.vue new file mode 100644 index 0000000..433b9f7 --- /dev/null +++ b/src/views/pages/area/components/ImportantAreaPopNew.vue @@ -0,0 +1,1132 @@ + + + + diff --git a/src/views/pages/civilizedCity/components/EventListDetailsPop.vue b/src/views/pages/civilizedCity/components/EventListDetailsPop.vue index 055f248..a5be5c3 100644 --- a/src/views/pages/civilizedCity/components/EventListDetailsPop.vue +++ b/src/views/pages/civilizedCity/components/EventListDetailsPop.vue @@ -1,15 +1,11 @@ - diff --git a/src/views/pages/civilizedCity/components/EventListDetailsPop1.vue b/src/views/pages/civilizedCity/components/EventListDetailsPop1.vue new file mode 100644 index 0000000..c12830d --- /dev/null +++ b/src/views/pages/civilizedCity/components/EventListDetailsPop1.vue @@ -0,0 +1,459 @@ + + + diff --git a/src/views/pages/civilizedCity/components/EventListDetailsPopBack.vue b/src/views/pages/civilizedCity/components/EventListDetailsPopBack.vue deleted file mode 100644 index 8e08966..0000000 --- a/src/views/pages/civilizedCity/components/EventListDetailsPopBack.vue +++ /dev/null @@ -1,202 +0,0 @@ - - - diff --git a/src/views/pages/civilizedCity/components/EventListDetailsPopNew.vue b/src/views/pages/civilizedCity/components/EventListDetailsPopNew.vue new file mode 100644 index 0000000..c12830d --- /dev/null +++ b/src/views/pages/civilizedCity/components/EventListDetailsPopNew.vue @@ -0,0 +1,459 @@ + + +