-
+
微网格长：{{ microgridObj.leader }}
-
+
性别：{{ microgridObj.gender }}
-
+
电话：{{ microgridObj.phone }}
-
+
住址：{{ microgridObj.address }}
+ style="background: linear-gradient(to right, rgba(6, 227, 218,1), rgba(6, 227, 218,0));display: flex;justify-content: space-between;flex-direction: row;padding: 12px;margin-bottom: 15px;">
{{ microgridObj.secondTitle || "--" }}
@@ -81,9 +81,9 @@
+ style="width: 484px;;overflow-x: clip; text-overflow:ellipsis;white-space: nowrap;padding: 0 20px;box-sizing: border-box;">
+ style="margin-bottom: 15px;cursor: pointer;" :title="item.label">
{{ item.value }}
@@ -100,6 +100,67 @@
+
+
+
+
+
人员信息 x
+
+
+
+ {{ index + 1 }}
+
+
+ {{ item.name }}
+
+
+ {{ item.mobile }}
+
+
+
+
+ 暂无数据~
+
+
+
+
+
+
+
+
+
+
+
房屋 x
+
+
+
+ {{ index + 1 }}
+
+
+ {{ item.fullName }}
+
+
+
+
+ 暂无数据~
+
+
+
+
+
+
+
+
@@ -112,6 +173,8 @@ import * as turf from '@turf/turf';
import axios from 'axios';
import { mapGetters } from "vuex";
import shibeiJson from './shibei.json';
+import maskJson from './markerJson.json';
+import { getScreenHouseStatistics, getScreenUserStatistics, getScreenHouseList, getScreenUserList } from "../../api/hulianApi"
const md5 = require('blueimp-md5');
let myMap;
@@ -123,11 +186,13 @@ let posLayer;
let circleLayer;
let dotLayer;
let dotBgLayer;
+let dotLayerBto;
let dotLayer2;
let searchMarker;
let searchBgLayer;
let numMarker;
let pointMarker;
+let prop;
export default {
name: "screen-center",
data() {
@@ -136,32 +201,6 @@ export default {
attrAndColor: [],
hoveredStateId: null,
- // topNum: [
- // {
- // label: "用户总数",
- // value: 330195
- // },
- // {
- // label: "党员总数",
- // value: 74830
- // },
- // {
- // label: "党群总数",
- // value: 9501
- // },
- // {
- // label: "话题总数",
- // value: 286508
- // },
- // {
- // label: "议题总数",
- // value: 223829
- // },
- // {
- // label: "诉求总数",
- // value: 215450
- // }
- // ],
buttonPiece: [
{
value: 1,
@@ -420,7 +459,7 @@ export default {
polygonColor: [
// "rgba(255, 100, 60, 0.5)",
// "rgba(43, 231, 253, 0.35)",
- "rgba(0, 127, 241, .3)",
+ "rgba(0, 127, 241, .5)",
// "rgba(255, 255, 50, 0.35)",
],
lineColor: [
@@ -443,32 +482,64 @@ export default {
],
textStrokeColor: "#fff",
},
+ total: 0,
+ pageNo: 1,
+ pageSize: 10,
+ agencyId: "",
+ level: "",
+ selAgency: [],
+ showResiTable: false,
+ resiList: [],
+ showHouseTable: false,
+ houseList: []
}
},
mounted() {
window._AMapSecurityConfig = {
securityJsCode: "92ea2c965c6cf1ba7ee3a8fe01449ef2",
};
+ this.$EventBus.$on('handleClickEvent', (val) => {
+ const { issueLongitude, issueLatitude, itemContent, itemStateName, distributeTime, issueAddress } = val
+ if (issueLongitude && issueLatitude) {
+ scene.setCenter([issueLongitude, issueLatitude])
+ prop = new Popup({
+ // offsets: [0, -0],
+ closeButton: false,
+ })
+ .setLnglat([issueLongitude, issueLatitude])
+ .setHTML(`
+
典型案例 x
+
+
${itemContent}
+
时间： ${distributeTime}
+
地点： ${issueAddress}
+
状态： ${itemStateName}
+
+
`);
+ scene.addPopup(prop);
+ this.$nextTick(() => {
+ const closeElement = document.getElementById('close');
+ if (closeElement) {
+ console.log(closeElement);
+ closeElement.addEventListener('click', () => {
+ scene.removePopup(prop);
+ });
+ }
+ })
+ // 给id为 close加一个事件
+
+ }
+ })
this.$nextTick(() => {
this.init()
})
},
computed: {
...mapGetters(['shibeiAId', 'shibeiName', 'shibeiAgencyType']),
- getThousandth() {
- return function (val) {
- if (!val) {
- return "--"
- }
- return val.toLocaleString()
- }
- }
+
},
watch: {
shibeiAId(value) {
- this.topNum.forEach((f, i, arr) => {
- arr[i]["value"] = f.value - 1000
- })
}
},
methods: {
@@ -478,71 +549,271 @@ export default {
// this.makeMarkers(this.markerJson)
// return
// }
- this.buttonIndex = value
- if (this.map.getLayer('text_JSON_layer-num')) {
- this.map.removeLayer('text_JSON_layer-num');
+ if (dotBgLayer) {
+ scene.removeLayer(dotBgLayer);
}
- let json = {
- "type": "FeatureCollection",
- "features": JSON.parse(JSON.stringify(this.markerJson.features)).filter(f => {
- return f.properties.name == label
- })
+ if (dotLayer) {
+ scene.removeLayer(dotLayer);
+ } if (dotLayerBto) {
+ scene.removeLayer(dotLayerBto);
}
+ this.buttonIndex = value
if (value == 1) {
- this.map.addLayer({
- id: "text_JSON_layer-num",
- type: "symbol",
- source: "shibeiPolygonSource",
- // minzoom: 5,
- // maxzoom: 22,
- interactive: true,
- paint: {
- 'text-color': '#fff',
- },
- "layout": {
- "text-field": "{resiNum}",
- 'text-size': 25,
- 'text-offset': [0, -1.5]
- }
- });
+ this.getScreenUserStatistics()
} else if (value == 2) {
- this.map.addLayer({
- id: "text_JSON_layer-num",
- type: "symbol",
- source: "shibeiPolygonSource",
- // minzoom: 5,
- // maxzoom: 22,
- interactive: true,
- paint: {
- 'text-color': '#fff',
- },
- "layout": {
- "text-field": "{houseNum}",
- 'text-size': 25,
- 'text-offset': [0, -1.5]
- }
- });
+ this.getScreenHouseStatistics()
+
} else if (value == 3) {
- this.map.addLayer({
- id: "text_JSON_layer-num",
- type: "symbol",
- source: "shibeiPolygonSource",
- // minzoom: 5,
- // maxzoom: 22,
- interactive: true,
- paint: {
- 'text-color': '#fff',
- },
- "layout": {
- "text-field": "{partNum}",
- 'text-size': 25,
- 'text-offset': [0, -1.5]
- }
+
+ }
+ },
+ initDot(data) {
+ console.log(data, '点位数据');
+ scene.addImage("dotBto", require("../../assets/images/map/dotBg.png"));
+ dotBgLayer = new PointLayer({
+ zIndex: 21,
+ })
+ .source(data)
+ .shape('count', 'text')
+ .color("#fff")
+ .size(16)
+ .style({
+ strokeWidth: 3,
+ strokeOpacity: 0.1,
+ fontWeight: '500',
+ stroke: "#000",
+ textOffset: [0, 45],
+ raisingHeight: 300,
+ heightfixed: true,
+ textAnchor: "center"
});
+ scene.addLayer(dotBgLayer);
+
+ dotLayer = new PointLayer({
+ zIndex: 20,
+ })
+ .source(data)
+ .shape("dotBto")
+ .size(80)
+ .style({
+ // offsets: [15, 260],
+ layerType: "fillImage",
+ raisingHeight: 300,
+ heightfixed: true
+ });
+ scene.addLayer(dotLayer);
+
+ // dotLayerBto = new PointLayer({
+ // zIndex: 22,
+ // })
+ // .source(data)
+ // .shape("dotBto")
+ // .size(35)
+ // .style({
+ // // offsets: [10, 150],/
+ // layerType: "fillImage",
+ // raisingHeight: 300,
+ // heightfixed: true
+ // });
+ // scene.addLayer(dotLayerBto);
+ let popup;
+ dotLayer.on("click", (e) => {
+ console.log(e);
+ this.selAgencyId = e.feature.properties.subId
+ if (e.feature.properties.type == 'resi') {
+ this.getScreenUserList()
+ this.showResiTable = true
+ } else if (e.feature.properties.type == 'house') {
+ this.getScreenHouseList()
+ this.showHouseTable = true
+ }
+ // const htmlString = `
+ //
+ // `;
+ // const popup = new Popup({
+ // offsets: [60, 60],
+ // closeButton: false,
+ // maxWidth: 400,
+ // }).setLnglat(e.lngLat).setHTML(htmlString);
+ // scene.addPopup(popup);
+ });
+
+
+ dotBgLayer.on("mousemove", (e) => {
+ // console.log(e);
+ if (e.feature.properties.content) {
+ const popup = new Popup({
+ offsets: [0, -0],
+ closeButton: false,
+ })
+ .setLnglat(e.feature.geometry.coordinates)
+ .setHTML(`
${e.feature.properties.content}`);
+ scene.addPopup(popup);
+ }
+ });
+
+ dotBgLayer.on("unmousemove", (e) => { });
+ },
+ async getScreenUserList() {
+ let params = {
+ agencyId: this.selAgencyId,
+ level: this.level == 'street' ? 'community' : this.level == 'community' ? 'grid' : 'street',
+ pageSize: this.pageSize,
+ pageNo: this.pageNo
+ }
+ const { data, msg, code } = await getScreenUserList(params)
+ if (code == 0) {
+ this.resiList = data.list
+ this.total = data.total
+ } else {
+ console.log(msg);
+ }
+ },
+ async getScreenHouseList() {
+ let params = {
+ agencyId: this.selAgencyId,
+ level: this.level == 'street' ? 'community' : this.level == 'community' ? 'grid' : 'community',
+ pageSize: this.pageSize,
+ pageNo: this.pageNo
+ }
+ const { data, msg, code } = await getScreenHouseList(params)
+ if (code == 0) {
+ this.houseList = data.list
+ this.total = data.total
+ } else {
+ console.log(msg);
+ }
+ },
+ async getScreenHouseStatistics() {
+ let params = {
+ agencyId: this.agencyId || '1175270520603930625',
+ level: this.level || 'city'
+ }
+ const { data, msg, code } = await getScreenHouseStatistics(params)
+ if (code == 0) {
+ let obj = {
+ type: 'FeatureCollection',
+ features: data,
+ name: 'ccc'
+ }
+ if (this.level) {
+ obj.features.forEach(f => {
+ f.type = 'Feature';
+ f.properties = {};
+ f.geometry = {};
+ f.properties.name = '房屋';
+ f.properties.type = 'house';
+ f.properties.subId = f.agencyId;
+ f.properties.count = `房屋：${f.count || 0}`;
+ f.geometry.type = "Point";
+ const matchingAgency = this.selAgency.find(item => item.subId == f.agencyId);
+ if (matchingAgency) {
+ f.geometry.coordinates = [...JSON.parse(matchingAgency.subCenterMark)[0]];
+ } else {
+ f.geometry.coordinates = [];
+ }
+ delete f.agencyName;
+ delete f.agencyId;
+ delete f.count;
+
+ });
+ } else {
+ obj.features.forEach(f => {
+ f.type = 'Feature';
+ f.properties = {};
+ f.geometry = {};
+ f.properties.name = '房屋';
+ f.properties.type = 'house';
+ f.properties.subId = f.agencyId;
+ f.properties.count = `房屋：${f.count || 0}`;
+ f.geometry.type = "Point";
+ const matchingAgency = shibeiJson.features.find(item => item.properties.adcode == f.agencyId);
+ if (matchingAgency) {
+ f.geometry.coordinates = matchingAgency.properties.center;
+ } else {
+ f.geometry.coordinates = [];
+ }
+ delete f.agencyName;
+ delete f.agencyId;
+ delete f.count;
+
+ });
+ }
+ this.initDot(obj)
+ } else {
+ console.log(msg);
+ }
+ },
+ async getScreenUserStatistics() {
+ let params = {
+ agencyId: this.agencyId || '1175270520603930625',
+ level: this.level || 'city'
+ }
+ const { data, msg, code } = await getScreenUserStatistics(params)
+ if (code == 0) {
+ let obj = {
+ type: 'FeatureCollection',
+ features: data,
+ }
+ if (this.level) {
+ obj.features.forEach(f => {
+ f.type = 'Feature';
+ f.properties = {};
+ f.geometry = {};
+ f.properties.name = '居民';
+ f.properties.type = 'resi';
+ f.properties.subId = f.agencyId;
+ f.properties.count = `居民：${f.count}`;
+ f.geometry.type = "Point";
+ const matchingAgency = this.selAgency.find(item => item.subId == f.agencyId);
+ if (matchingAgency) {
+ f.geometry.coordinates = [...JSON.parse(matchingAgency.subCenterMark)[0]];
+ } else {
+ f.geometry.coordinates = [];
+ }
+ delete f.agencyName;
+ delete f.agencyId;
+ delete f.count;
+ });
+ } else {
+ obj.features.forEach(f => {
+ f.type = 'Feature';
+ f.properties = {};
+ f.geometry = {};
+ f.properties.name = '居民';
+ f.properties.type = 'resi';
+ f.properties.subId = f.agencyId;
+ f.properties.count = `居民：${f.count}`;
+ f.geometry.type = "Point";
+ const matchingAgency = shibeiJson.features.find(item => item.properties.adcode == f.agencyId);
+ if (matchingAgency) {
+ f.geometry.coordinates = matchingAgency.properties.center;
+ } else {
+ f.geometry.coordinates = [];
+ }
+ delete f.agencyName;
+ delete f.agencyId;
+ delete f.count;
+ });
+ }
+ this.initDot(obj)
+ } else {
+ console.log(msg);
}
- this.makeMarkers(json)
},
initialization() {
+ this.agencyId = '';
+ this.level = '';
if (polygonLayer) {
scene.removeLayer(polygonLayer);
}
@@ -552,6 +823,16 @@ export default {
if (textLayer) {
scene.removeLayer(textLayer);
}
+ if (dotBgLayer) {
+ scene.removeLayer(dotBgLayer);
+ }
+ if (dotLayer) {
+ scene.removeLayer(dotLayer);
+ }
+ if (dotLayerBto) {
+ scene.removeLayer(dotLayerBto);
+ }
+ this.buttonIndex = null
this.iniMapGrid(shibeiJson)
},
init() {
@@ -562,7 +843,6 @@ export default {
// if (this.mapStyleType == "light") {
// styleConfig = lightStyle;
// }
- const iniCenter = [116.39743841556731, 39.9088810666821];
myMap = new GaodeMap({
pitch: 47.24716321414439,
mapStyle: "amap://styles/darkblue",
@@ -578,15 +858,7 @@ export default {
doubleClickZoom: false,
showRoad: false,
viewMode: "3D",
- styleJson: [
- {
- "featureType": "road",
- "elementType": "all",
- "stylers": {
- "color": "#fff" // 或者设置为与地图背景相似的颜色
- }
- }
- ]
+
});
scene = new Scene({
id: "map",
@@ -594,56 +866,11 @@ export default {
map: myMap,
});
scene.on("loaded", async () => {
- // this.iniMapBase(scene);
this.iniMapGrid(shibeiJson);
});
},
- // 初始化底图
- iniMapBase(scene) {
- // console.log("-----------------iniMapBase");
- // 底图服务
- const baseLayer = new RasterLayer({
- zIndex: 0,
- });
- baseLayer
- .source("http://t7.tianditu.com/DataServer?T=vec_w&tk=8a08c117ab9ee45d508686b01cc8d397&x={x}&y={y}&l={z}", {
- parser: {
- type: "rasterTile",
- tileSize: 1,
- minZoom: 6,
- maxZoom: 15,
- zoomOffset: 0,
- },
- })
- .style({
- opacity: 0.7,
- });
-
- // 注记服务
- const annotionLayer = new RasterLayer({
- zIndex: 2,
- });
- annotionLayer
- .source("http://t7.tianditu.com/DataServer?T=cva_w&tk=8a08c117ab9ee45d508686b01cc8d397&x={x}&y={y}&l={z}", {
- parser: {
- type: "rasterTile",
- tileSize: 1,
- minZoom: 6,
- maxZoom: 15,
- zoomOffset: 0,
- },
- })
- .style({
- opacity: 0.5,
- });
-
- scene.addLayer(baseLayer);
- scene.addLayer(annotionLayer);
-
- },
iniMapGrid(data) {
const { darkStyle, lightStyle, polygonData, polygonDotData, } = this;
- console.log(data, '初始化网格');
let styleConfig = darkStyle;
if (this.mapStyleType == "light") {
styleConfig = lightStyle;
@@ -652,37 +879,37 @@ export default {
polygonLayer = new PolygonLayer({
autoFit: true,
})
- // .size(0)
+ .size(300)
.source(data)
.color("name", styleConfig.polygonColor)
- // .shape("extrude")
- .shape("fill")
+ .shape("extrude")
+ // .shape("fill")
.style({
opacityLinear: {
enable: false, // true - false
dir: "in", // in - out
},
- opacity: 1,
+ opacity: 0.8,
heightfixed: true,
- pickLight: true,
raisingHeight: 300,
- sourceColor: "#333",
- targetColor: "rgba(255,255,255, 0.5)",
+ sourceColor: "#348aa6",
+ targetColor: "rgba(16, 64, 99, 0.5)",
});
scene.addLayer(polygonLayer);
- // 画区域边
+ // 画区域边
lineLayer = new LineLayer({
zIndex: 2,
name: "line2",
})
.source(data)
.shape("line")
- .size(1)
+ .size(0.8)
.color("name", styleConfig.lineColor)
.style({
opacity: 1,
+ raisingHeight: 600,
})
.animate({
interval: 1, // 间隔
@@ -691,23 +918,23 @@ export default {
});
scene.addLayer(lineLayer);
- // posLayer = new PointLayer({
- // zIndex: 4,
- // name: "gridPoint",
- // visible: false,
- // })
- // .source(polygonDotData)
- // .shape("name", [
- // // "pos-red",
- // "pos-green",
- // // "pos-yellow"
- // ])
- // .size(12)
- // .style({
- // options: this.level === "grid" ? 1 : 0,
- // offsets: [0, 0],
- // });
- // // scene.addLayer(posLayer);
+ posLayer = new PointLayer({
+ zIndex: 4,
+ name: "gridPoint",
+ visible: false,
+ })
+ .source(data)
+ .shape("name", [
+ // "pos-red",
+ "pos-green",
+ // "pos-yellow"
+ ])
+ .size(12)
+ .style({
+ options: this.level === "grid" ? 1 : 0,
+ offsets: [0, 0],
+ });
+ scene.addLayer(posLayer);
// /* if (this.level === 'grid') {
// posLayer.show()
// } else {
@@ -719,7 +946,7 @@ export default {
.source(data)
.color("name", styleConfig.textColor)
.shape("name", "text")
- .size(16)
+ .size(14)
.style({
textAnchor: "center", // 文本相对锚点的位置 center|left|right|top|bottom|top-left
textOffset: [0, 40], // 文本相对锚点的偏移量 [水平, 垂直]
@@ -728,43 +955,21 @@ export default {
stroke: styleConfig.textStrokeColor, // 描边颜色
strokeWidth: 0.1, // 描边宽度
strokeOpacity: 0.8,
+ raisingHeight: 300,
textAllowOverlap: true,
})
.active(true);
scene.addLayer(textLayer);
- let popup;
- // polygonLayer.on("mousemove", (e) => {
- // if (this.level === "grid") {
- // return;
- // }
- // popup = new Popup({
- // offsets: [60, 60],
- // closeButton: false,
- // maxWidth: 400,
- // }).setLnglat(e.lngLat).setHTML(`
- //
- // `);
- // scene.addPopup(popup);
- // });
-
- // polygonLayer.on("mouseout", (e) => {
- // // 如果popup初始化没成功报错导致地图初始化失败
- // if (popup) {
- // popup.remove();
- // }
- // });
+ let _this = this
polygonLayer.on("click", (e) => {
console.log(e);
+ if (e.feature.properties.name.indexOf("党工委") != -1) {
+ _this.level = e.feature.properties.level
+ _this.agencyId = e.feature.properties.adcode
+ } else if (e.feature.properties.name.indexOf("社区") != -1) {
+ _this.level = 'community'
+ _this.agencyId = e.feature.properties.subId
+ }
if (e.feature.properties.name.indexOf("网格") != -1) {
return
}
@@ -777,6 +982,15 @@ export default {
if (textLayer) {
scene.removeLayer(textLayer);
}
+ if (dotBgLayer) {
+ scene.removeLayer(dotBgLayer);
+ }
+ if (dotLayer) {
+ scene.removeLayer(dotLayer);
+ }
+ if (dotLayerBto) {
+ scene.removeLayer(dotLayerBto);
+ }
this.getBoundary(e.feature.properties.adcode || e.feature.properties.subId)
});
// posLayer.on("click", (e) => {
@@ -786,7 +1000,6 @@ export default {
getBoundary(id) {
const ts = Date.now();
const { darkStyle, lightStyle, polygonData, polygonDotData, } = this;
- console.log(shibeiJson, '初始化网格');
let styleConfig = darkStyle;
if (this.mapStyleType == "light") {
styleConfig = lightStyle;
@@ -813,6 +1026,7 @@ export default {
ts
}
}).then(e => {
+ this.selAgency = e.data.data.agencyDistribution.map(original => ({ ...original }));
let obj = {
type: "FeatureCollection",
name: "index",
@@ -832,23 +1046,29 @@ export default {
delete f.subId
delete f.subName
})
-
this.iniMapGrid(obj)
}).catch(f => {
console.log(f);
})
},
- // getPolygonJson(obj) {
- // let shibeiPolyline = JSON.parse(JSON.stringify(obj))
- // for (let i = 0; i < shibeiPolyline.features.length; i++) {
- // shibeiPolyline.features[i].geometry.type = 'MultiLineString' //面转线
- // shibeiPolyline.features[i].geometry.coordinates = this.convertPolygonToPolyline(shibeiPolyline.features[
- // i].geometry.coordinates)
- // }
- // this.addPolygon(obj)
- // this.addPolyline(shibeiPolyline)
-
- // },
+ close() {
+ this.showFirst = false
+ this.showMicrogridDetails = false
+ },
+ microgridDetails(item) {
+ this.showMicrogridDetails = true
+ this.microgridIndex = item.value
+ this.microgridObj.firstTitle = item.label
+ },
+
+ handleCurrentChange(val) {
+ this.pageNo = val
+ if (this.buttonIndex == 1) {
+ this.getScreenUserList()
+ } else if (this.buttonIndex == 2) {
+ this.getScreenHouseList()
+ }
+ },
}
}
@@ -862,6 +1082,8 @@ export default {
}
+
+
::v-deep .mapboxgl-ctrl {
display: none !important;
}
@@ -869,4 +1091,101 @@ export default {
::v-deep .el-pagination.is-background .el-pager li:not(.disabled).active {
background-color: #0aabca;
}
+
+::v-deep .l7-popup-tip {
+ display: none;
+}
+
+::v-deep .l7-popup-content {
+ background: rgba(3, 31, 73, 0.72);
+ opacity: 0.9;
+ border-radius: 5px;
+ color: #fff;
+ height: 431px;
+ width: 440px;
+ padding: 20px !important;
+ background-image: url("@/assets/images/map/popupBg.png");
+ background-size: cover;
+ /* 或者使用 contain，根据需要选择 */
+ background-repeat: no-repeat;
+}
+
+.resiTable {
+ position: absolute;
+ right: 400px;
+ width: 550px;
+ bottom: 199px;
+ z-index: 100;
+ padding: 20px;
+ font-size: 20px;
+ color: #fff;
+ height: 550px;
+ display: flex;
+ padding: 20px 7px;
+ flex-direction: column;
+ background-image: url('@/assets/images/map/popupBg.png');
+ // background-size: cover;
+ background-repeat: no-repeat;
+}
+
+.resiTitle {
+ background: url('@/assets/icon/title-content-half.png');
+ background-size: 67% 100%;
+ background-repeat: no-repeat;
+ font-size: 22px;
+ font-family: MF LangQian (Noncommercial);
+ font-weight: bold;
+ font-style: italic;
+ height: 60px;
+ line-height: 60px;
+ padding-left: 88px;
+ padding-right: 25px;
+
+ span {
+ font-size: 20px;
+ font-style: normal;
+ float: right;
+ cursor: pointer;
+ }
+}
+
+::v-deep .eventTitle {
+ background: url('@/assets/icon/title-content-half.png');
+ background-size: 67% 100%;
+ background-repeat: no-repeat;
+ font-size: 22px;
+ font-family: MF LangQian (Noncommercial);
+ font-weight: bold;
+ font-style: italic;
+ height: 60px;
+ line-height: 60px;
+ padding-left: 88px;
+ padding-right: 25px;
+
+ span {
+ font-size: 20px;
+ font-style: normal;
+ float: right;
+ cursor: pointer;
+ }
+}
+
+::v-deep .el-pagination__total {
+ color: #fff;
+}
+
+::v-deep .el-pagination.is-background .el-pager li {
+ background-color: #005a7c;
+ color: #fff;
+}
+
+::v-deep .el-pagination.is-background .btn-next,
+.el-pagination.is-background .btn-prev,
+.el-pagination.is-background .el-pager li {
+ background-color: #1e7b9d;
+}
+
+::v-deep .el-pagination.is-background .btn-prev {
+ background-color: #1e7b9d;
+}
\ No newline at end of file
diff --git a/src/views/screenCenter/shibei.json b/src/views/screenCenter/shibei.json
index 12129cb..26dac31 100644
--- a/src/views/screenCenter/shibei.json
+++ b/src/views/screenCenter/shibei.json
@@ -9,7 +9,7 @@
"name": "大港街道党工委",
"center": [120.3337627495665, 36.097438422309494],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -1070,7 +1070,7 @@
"name": "即墨路街道党工委",
"center": [120.31935953776099, 36.08052585178],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -1910,7 +1910,7 @@
"name": "辽宁路街道党工委",
"center": [120.3327688259555, 36.079975585938],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -2588,7 +2588,7 @@
"name": "兴隆路街道党工委",
"center": [120.3425374348965, 36.109391004775],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -3468,7 +3468,7 @@
"name": "延安路街道党工委",
"center": [120.345838758681, 36.073510742188],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -4130,7 +4130,7 @@
"name": "湖岛街道党工委",
"center": [120.3477992079, 36.137754991319994],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -5303,7 +5303,7 @@
"name": "登州路街道党工委",
"center": [120.35036159939301, 36.079196370443],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -5679,7 +5679,7 @@
"name": "台东街道党工委",
"center": [120.3543279351135, 36.0859617784295],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -6007,7 +6007,7 @@
"name": "阜新路街道党工委",
"center": [120.362190755209, 36.0997500271275],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -6536,7 +6536,7 @@
"name": "镇江路街道党工委",
"center": [120.365053710938, 36.0876307508685],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -7048,7 +7048,7 @@
"name": "洛阳路街道党工委",
"center": [120.39310519748301, 36.1431841362855],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -7267,7 +7267,7 @@
"name": "浮山新区街道党工委",
"center": [120.416170654297, 36.100919867622],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -8015,7 +8015,7 @@
"name": "四方街道党工委",
"center": [120.360758056641, 36.1133078342015],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -8976,7 +8976,7 @@
"name": "开平路街道党工委",
"center": [120.369328070747, 36.1448555501305],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -9312,7 +9312,7 @@
"name": "宁夏路街道党工委",
"center": [120.36573879665849, 36.0754874674485],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -10039,7 +10039,7 @@
"name": "海伦路街道党工委",
"center": [120.373414306641, 36.1092022026915],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -11139,7 +11139,7 @@
"name": "敦化路街道党工委",
"center": [120.3759648980035, 36.094208306207],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -11892,7 +11892,7 @@
"name": "双山街道党工委",
"center": [120.388498399523, 36.117409667969],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -12734,7 +12734,7 @@
"name": "辽源路街道党工委",
"center": [120.39122328016549, 36.0991404893665],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -13239,7 +13239,7 @@
"name": "河西街道党工委",
"center": [120.40195488823849, 36.130747477214],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -13641,7 +13641,7 @@
"name": "合肥路街道党工委",
"center": [120.4084261067715, 36.1125183105475],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
@@ -14138,7 +14138,7 @@
"name": "水清沟街道党工委",
"center": [120.3701881239155, 36.1290470377605],
"childrenNum": 16,
- "level": "province",
+ "level": "street",
"parent": {
"adcode": 100000
},
diff --git a/src/views/screenLeft/left1.vue b/src/views/screenLeft/left1.vue
index 58f4b80..ce127a5 100644
--- a/src/views/screenLeft/left1.vue
+++ b/src/views/screenLeft/left1.vue
@@ -1,3 +1,4 @@
+
-
+ :isChangeColor=false :rowColor="'rgba(11,68,135,0.16)'" :noData="noDataH" :pageSize="pageSize"
+ :headerList="headerList" @handleLook="handleLook">
-
-
+
+
公园![]()
27个
+
+
+
+
+
+
-
+
+
-
-
-
-
+
+
@@ -409,81 +461,29 @@ export default {
}
}
- .b-dyfc {
- box-sizing: border-box;
- margin-top: 8px;
- margin-left: 1px;
-
- &-scroll {
- overflow: hidden;
- padding: 0 10px;
-
- .dyfc-main {
- margin-top: 16px;
- display: flex;
- justify-content: space-around;
-
- .dyfc-item {
- padding: 10px 11px 18px 11px;
- width: 190px;
- height: 230px;
- background: rgba(68, 216, 243, 0.16);
- // opacity: 0.16;
- margin-left: 10px;
+ .b-zdxx {
+ position: relative;
+
+ .pei-Box {
+ position: absolute;
+ top: -250px;
+ right: -1px;
+ height: 300px;
+ width: 300px;
+ background-color: #015271;
+
+ .title {
+ height: 30px;
+ line-height: 30px;
+ width: 100%;
+ text-align: right;
+ padding-right: 10px;
+ font-size: 14px;
+ color: #fff;
+ box-sizing: border-box;
+
+ span {
cursor: pointer;
-
- >img {
- height: 110px;
- width: 190px;
- display: block;
- }
-
- &-row1 {
- margin-top: 10px;
- display: flex;
- justify-content: space-between;
-
- .item-name {
- font-size: 18px;
- font-family: Alibaba PuHuiTi;
- font-weight: 400;
- color: #ffffff;
- }
-
- .item-type {
- font-size: 14px;
- font-family: Alibaba PuHuiTi;
- font-weight: 300;
- color: #00eccd;
- }
- }
-
- &-row2 {
- margin-top: 10px;
- font-size: 16px;
- font-family: Alibaba PuHuiTi;
- font-weight: 300;
- color: #c1e8ff;
- }
-
- &-row3 {
- position: relative;
- margin-top: 13px;
- font-size: 16px;
- font-family: Alibaba PuHuiTi;
- font-weight: 300;
- color: #ffffff;
- line-height: 24px;
- display: -webkit-box;
- overflow: hidden;
- text-overflow: ellipsis;
- -webkit-line-clamp: 2;
- -webkit-box-orient: vertical;
- }
-
- // &-row3:hover {
- // overflow: visible;
- // }
}
}
}
diff --git a/src/views/screenRight/right1.vue b/src/views/screenRight/right1.vue
index 6dcbb34..e133cce 100644
--- a/src/views/screenRight/right1.vue
+++ b/src/views/screenRight/right1.vue
@@ -25,7 +25,7 @@
@@ -209,6 +209,11 @@ export default {
} else {
return str
}
+ },
+ handelClickItem(td,item){
+ if(td == '查看'){
+ this.$emit('handleLook',item)
+ }
}
}
}
diff --git a/src/components/screen-org-tree/index.vue b/src/components/screen-org-tree/index.vue
new file mode 100644
index 0000000..9febfca
--- /dev/null
+++ b/src/components/screen-org-tree/index.vue
@@ -0,0 +1,438 @@
+
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
+ 
