From 2c33340bb9041fdd19c332f55b4c0cde924c94ed Mon Sep 17 00:00:00 2001 From: dai <851733175@qq.com> Date: Thu, 11 Nov 2021 14:05:14 +0800 Subject: [PATCH 1/2] ss --- src/assets/scss/pages/loginWork.scss | 27 +++++++++++++++++++++++++++ src/views/pages/login.vue | 2 +- 2 files changed, 28 insertions(+), 1 deletion(-) diff --git a/src/assets/scss/pages/loginWork.scss b/src/assets/scss/pages/loginWork.scss index 6c0f695e..ad12fc67 100644 --- a/src/assets/scss/pages/loginWork.scss +++ b/src/assets/scss/pages/loginWork.scss @@ -165,3 +165,30 @@ } } } + +.div_row { + height: 50px; + text-align: center; + line-height: 50px; + + /* width: 100px; */ + /* background-color: rgb(241, 241, 241); */ + + &:hover { + color: rgb(2, 119, 173); + font-weight: bold; + text-decoration: underline; + } + + .i_icon { + width: 15px; + height: 15px; + margin-right: 10px; + float: left; + } + .span_name { + font-size: 18px; + cursor: pointer; + /* color: rgb(37, 156, 235); */ + } +} diff --git a/src/views/pages/login.vue b/src/views/pages/login.vue index 5874b2b9..d08988d7 100644 --- a/src/views/pages/login.vue +++ b/src/views/pages/login.vue @@ -75,7 +75,6 @@ :width="30" :top="'120px'" @cancel="diaCancel"> -
@@ -87,6 +86,7 @@
+ + + + + + + \ No newline at end of file diff --git a/src/views/modules/visual/basicinfo/basicInfoMain.vue b/src/views/modules/visual/basicinfo/basicInfoMain.vue index e9544ca5..0867c30e 100644 --- a/src/views/modules/visual/basicinfo/basicInfoMain.vue +++ b/src/views/modules/visual/basicinfo/basicInfoMain.vue @@ -6,7 +6,8 @@
{{item.name}}> {{orgData.name}} @@ -15,16 +16,22 @@
-
+ + +
+ v-model="searchName"> 搜索
-
+ +
+ +
+ +
分类列表
+
+ +
+
+
+
+ +
+
{{colItem.label}}
+
{{colItem.count}}
+
+ +
+
+
+
+ +
+ +
+
@@ -57,7 +96,7 @@ import { Circle as CircleStyle, Fill, Stroke, Style, Text } from 'ol/style.js'; import { mapGetters } from "vuex"; import { Loading } from 'element-ui'; //引入Loading服务 import { requestPost } from "@/js/dai/request"; - +import BasicInfoCommunity from "./basicInfoCommunity"; let loading;//加载动画 @@ -72,7 +111,6 @@ let polygonLayer;//变电站标注图层 let polygonSource;//变电站标注多边形 let select;//选中标注 - //变电站标注的文字样式 var createTextStyle = function (feature) { return new Text({ @@ -123,12 +161,102 @@ const vueGis = { selPolygonId: '',//选择的多边形id selPolygon: {}, + //右侧搜索 + searchName: "", + //右侧列表 - name: "", + listData: [],//得到的数据 + listDatashow: [],//处理成一行两列的数据 + listData1: [ + { + id: "1", + label: "党员", + count: 300, + dataIcon: require('../../../../assets/img/modules/visual/dabing.png') + }, + { + id: "2", + label: "低保人员", + count: 30000, + dataIcon: '' + }, + { + id: "3", + label: "保障房人员", + count: 3, + dataIcon: '' + }, + { + id: "4", + label: "失业人员", + count: 300, + dataIcon: require('../../../../assets/img/modules/visual/dibao.png') + }, + { + id: "5", + label: "失业人员", + count: 300, + dataIcon: require('../../../../assets/img/modules/visual/dibao.png') + }, + { + id: "6", + label: "失业人员", + count: 300, + dataIcon: require('../../../../assets/img/modules/visual/dibao.png') + }, + { + id: "7", + label: "失业人员", + count: 300, + dataIcon: require('../../../../assets/img/modules/visual/dibao.png') + }, + { + id: "8", + label: "失业人员", + count: 300, + dataIcon: require('../../../../assets/img/modules/visual/dibao.png') + }, + { + id: "9", + label: "失业人员", + count: 300, + dataIcon: require('../../../../assets/img/modules/visual/dibao.png') + }, + { + id: "10", + label: "失业人员", + count: 300, + dataIcon: require('../../../../assets/img/modules/visual/dibao.png') + }, + { + id: "11", + label: "失业人员", + count: 300, + dataIcon: require('../../../../assets/img/modules/visual/dibao.png') + }, + { + id: "12", + label: "失业人员", + count: 300, + dataIcon: require('../../../../assets/img/modules/visual/dibao.png') + }, + { + id: "13", + label: "失业人员3", + count: 300, + dataIcon: require('../../../../assets/img/modules/visual/dibao.png') + }, + { + id: "14", + label: "失业人员2", + count: 300, + dataIcon: require('../../../../assets/img/modules/visual/dibao.png') + }, + ], //下钻层级记录 runNum: 0, - runAgency: [], + runAgencyArray: [], } }, @@ -136,6 +264,11 @@ const vueGis = { //加载组织数据 await this.loadOrgData() + this.$nextTick(() => { + // ref_tree 元素的ref value 绑定的node-key + this.$refs.ref_community.initData('', '南山111小区'); + }); + //初始化地图 this.initMap() @@ -145,14 +278,81 @@ const vueGis = { //加载当前园区的标注 this.loadPolygon(this.subAgencyArray) + await this.loadList() + }, methods: { handleSearch () { + }, + //获取右侧infolist数据 + async loadList () { + // const url = "/epmetuser/statsresiwarn/list" + const url = "http://yapi.elinkservice.cn/mock/245/epmetuser/statsresiwarn/list" + let params = { + id: this.orgId, + level: this.orgLevel + } + + const { data, code, msg } = await requestPost(url, params) + + if (code === 0) { + // this.listData = data + this.listData = this.listData1 + this.listDatashow = [] + let itemArray = [] + this.listData.forEach((item, index) => { + if (!item.dataIcon) { + item.dataIcon = require('../../../../assets/img/modules/visual/dibao.png') + } + + if (index % 2 === 0) {//偶数 + itemArray.push(item) + } else { + itemArray.push(item) + this.listDatashow.push(itemArray) + itemArray = [] + } + + }); + + + } else { + this.$message.error(msg) + } + }, + + //下钻到下一级 + async toSubAgency (e) { + //点击小区neighborHood显示楼栋，点击非小区，进入下一级地图 + this.runNum++ + this.runAgencyArray.push(this.orgData) + + this.subAgencyArray.forEach(item => { + if (item.id === e.selected[0].id_) { + this.selPolygonId = item.id + this.selPolygon = item + this.orgId = item.id + this.orgLevel = item.level + this.orgData = item + } + }); + + console.log(this.runNum) + console.log(this.runAgencyArray) + // debugger + if (this.orgLevel === 'neighborHood') { + + } else { + this.refreshMap(true) + } + + }, //刷新地图 async refreshMap (isRefreshView) { + //加载组织数据 await this.loadOrgData() @@ -165,26 +365,38 @@ const vueGis = { mapView.setCenter(this.centerPoint); mapView.setZoom(this.zoom); } + + await this.loadList() + }, - //返回上一级组织 - handleBack () { - this.runNum-- - this.runAgency.pop() - if (this.runNum === 0) { - this.orgId = '' - this.orgLevel = '' - } else { - this.orgId = this.runAgency[this.runAgency.length - 1].id - this.orgLevel = this.runAgency[this.runAgency.length - 1].level + //返回所选组织 + handleClickAgency (index) { + + const cutNum = this.runAgencyArray.length - index//要减去的长度 + this.runNum = this.runNum - cutNum + this.orgData = this.runAgencyArray[index] + for (let i = 0; i < cutNum; i++) { + this.runAgencyArray.pop() } - this.refreshMap(true) + this.orgId = this.orgData.id + this.orgLevel = this.orgData.level + + console.log(this.runAgencyArray) + console.log(this.orgData) + + if (this.orgLevel === 'neighborHood') {//显示小区 + + } else { + this.refreshMap(true) + } }, //加载组织数据 async loadOrgData () { + const url = "/gov/org/agency/maporg" let params = { orgId: this.orgId, @@ -194,10 +406,15 @@ const vueGis = { const { data, code, msg } = await requestPost(url, params) if (code === 0) { + this.orgData = data + this.orgId = this.orgData.id + this.orgLevel = this.orgData.level if (data.children && data.children.length > 0) { this.subAgencyArray = data.children + } else { + this.subAgencyArray = [] } } else { @@ -265,27 +482,6 @@ const vueGis = { }, - //下钻到下一级 - toSubAgency (e) { - console.log(e) - - this.subAgencyArray.forEach(item => { - if (item.id === e.selected[0].id_) { - this.selPolygonId = item.id - this.selPolygon = item - this.orgId = item.id - this.orgLevel = item.level - - } - }); - - this.runNum++ - this.runAgency.push(this.selPolygon) - - this.refreshMap(true) - - }, - //设置地图定位的中心点和缩放级别 setMapLocation () { this.centerPoint = [] @@ -431,10 +627,10 @@ const vueGis = { }, props: { - vueFlag: { - type: String, - default: "alarm" - } + // vueFlag: { + // type: String, + // default: "alarm" + // } }, computed: { @@ -458,7 +654,7 @@ const vueGis = { ...mapGetters(["clientHeight"]) }, - components: {}, + components: { BasicInfoCommunity }, } export default vueGis; @@ -486,4 +682,7 @@ export default vueGis; color: #ffffff; opacity: 0.7; } +.el-scrollbar__wrap { + overflow-x: hidden !important; +} \ No newline at end of file