elink-star
/
screen-shibei-new
12
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

差党支部地图数据

master
mk 2 years ago
parent
d5549c12c0
commit
5542047e9a
10 changed files with 691 additions and 2304 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 3
      .gitignore
  2. BIN
      src/assets/back.png
  3. 199
      src/components/screen-popup-ydzl/index.vue
  4. 47
      src/views/screenCenter/screenCenter.vue
  5. 2569
      src/views/screenCenter/shibei1.json
  6. 11
      src/views/screenContent.vue
  7. 8
      src/views/screenLeft/left1.vue
  8. 111
      src/views/screenLeft/left2.vue
  9. 4
      src/views/screenLeft/left3.vue
  10. 1
      src/views/screenRight/right2.vue

3
.gitignore
View File

@ -2,7 +2,7 @@
.DS_Store .DS_Store
node_modules node_modules
/dist /dist
/ring-screen
# local env files # local env files
.env.local .env.local
@ -23,3 +23,4 @@ pnpm-debug.log*
*.sln *.sln
*.sw? *.sw?
dist.zip dist.zip
ring-screen.zip

BIN
src/assets/back.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.5 KiB

After

Width:  |  Height:  |  Size: 7.2 KiB

199
src/components/screen-popup-ydzl/index.vue
View File

@ -4,23 +4,54 @@
opacity: popupVisible ? '1' : '0', opacity: popupVisible ? '1' : '0',
'--left': left, '--left': left,
'--top': top, '--top': top,
'--width': width, // '--width': width,
'--fontSize': fontSize '--fontSize': fontSize
}" v-show="popupVisible == '1'"> }" v-show="popupVisible == '1'">
<!-- <div style=" display: flex;justify-content: space-around;">
<span v-for="(item,index) in header" >{{item}}</span>
</div>
<div class="screen-popup-ydzl-border " :style="{ overflowX: 'hidden' }"> <div class="screen-popup-ydzl-border " :style="{ overflowX: 'hidden' }">
<div class="screen-popup-ydzl-content" v-if="memberInfo"> <div class="screen-popup-ydzl-content" style="display: flex;justify-content: space-around;" v-if="memberInfo">
<div>1</div>
<div>{{ memberInfo.name }}</div> <div>{{ memberInfo.name }}</div>
<div>{{ memberInfo.phone }}</div> <div>{{ memberInfo.phone }}</div>
</div> </div>
<div v-if="!memberInfo && memberArr" > <div v-if="!memberInfo && memberArr" >
<div v-for="item in memberArr"> <div v-for="item in memberArr" style="display:flex">
<div>{{ item.name }}</div> <div style="width: 90px;text-align:right;">{{ item.name }}：</div>
<div>{{ item.phone }}</div> <div style="margin-right:20px; width: 130px;text-align:left;">{{ item.phone }}</div>
<div v-if="item.property">人员属性：{{ item.property }}</div> <div v-if="item.property">人员属性：{{ item.property }}</div>
</div> </div>
</div> </div>
</div> -->
<ul>
<li class="table-header" :style="{ height: headerHeight }">
<div class="table-td" v-for="(item, index) in header" :style="{
width: Object.prototype.toString.call(item) == '[object Object]' ? item.width : '100%',
fontSize: headerFontSize,
cursor: Object.prototype.toString.call(item) == '[object Object]' ? item.sort ? 'pointer' : 'default' : 'default'
}" :key="index">{{ Object.prototype.toString.call(item) == '[object Object]' ?
item.title : item }}
<svg-icon icon-class="paixu" v-if="item.sort">
</svg-icon>
</div>
</li>
<li class="table-body" v-if="memberArr.length > 0">
<div class="scroll-view" id="scroll-view">
<div class="table-tr" :style="{
// '--isChangeColor': isChangeColor
}" v-for="(item, index) in memberArr" :key="index">
<div class="table-td" :style="{
width: Object.prototype.toString.call(header[order]) == '[object Object]' ? header[order].width : '100%',
fontSize: 18
}" v-for="(td, order) in item" :key="order" v-html="td" @click="handelClickItem(td, item)"></div>
<!-- <img src="./../../assets/icon/xjph-table.png" /> -->
</div> </div>
</div>
</li>
<div v-else class="no-data">暂无数据~</div>
</ul>
<!-- // -->
</div> </div>
</template> </template>
@ -53,7 +84,7 @@ export default {
}, },
fontSize: { fontSize: {
type: String, type: String,
default: '20px' default: '18px'
}, },
memberInfo: { memberInfo: {
type: Object, type: Object,
@ -61,8 +92,25 @@ export default {
}, },
memberArr: { memberArr: {
type: Array, type: Array,
required: true,
default: () => [] default: () => []
} },
header: {
type: Array,
default: () => []
},
headerColor: {
type: String,
default: '#fff'
},
headerFontSize: {
type: String,
default: '#fff'
},
headerHeight: {
type: String,
default: '35px'
},
}, },
watch: { watch: {
@ -92,16 +140,23 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
ul,
li {
padding: 0;
margin: 0;
list-style: none;
}
.screen-popup-ydzl { .screen-popup-ydzl {
width: var(--width); width: var(--width);
border: 1px solid #006a90;
position: absolute; position: absolute;
background: linear-gradient(to bottom, rgba(0, 53, 75, 0.96), rgba(0, 106, 144, 0.96));
// box-shadow: 0 2px 12px 0 #5c7bc7; // box-shadow: 0 2px 12px 0 #5c7bc7;
border: 1px solid #00a4b9; // border: 1px solid #00a4b9;
color: #fff; color: #fff;
line-height: 30px; line-height: 30px;
font-size: var(--fontSize); font-size: var(--fontSize);
background: rgb(9, 67, 85);
z-index: 100000; z-index: 100000;
left: var(--left); left: var(--left);
top: var(--top); top: var(--top);
@ -143,4 +198,124 @@ export default {
} }
} }
} }
</style>
ul {
width: 100%;
height: 100%;
.table-header {
height: 35px;
width: 100%;
display: flex;
align-items: center;
justify-content: space-around;
color: #fff;
font-size: 15px;
background-image: url("./../../assets/icon/headerBg.png");
background-size: 100% 100%;
.table-td {
width: 100%;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
text-align: center;
padding: 0 5px;
}
}
.table-body {
display: block;
width: 100%;
max-height: 140px;
min-height: 140px;
overflow-y: auto;
position: relative;
&::-webkit-scrollbar {
/*滚动条整体样式*/
width: 6px;
/*高宽分别对应横竖滚动条的尺寸*/
height: 1px;
}
&::-webkit-scrollbar-thumb {
/*滚动条里面小方块*/
background: linear-gradient(-90deg, #09b8e5 0%, #09f0e3 99%);
border-radius: 3px;
}
&::-webkit-scrollbar-track {
/*滚动条里面轨道*/
// box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.2);
background: #428ba2;
border-radius: 3px;
}
.scroll-view {
width: 100%;
height: 100%;
position: absolute;
left: 0px;
top: 0px;
.table-tr {
width: 100%;
box-sizing: border-box;
// height: calc(100% / var(--pageSize));
height: 30px;
display: flex;
align-items: center;
justify-content: space-around;
margin-top: 19px;
position: relative;
.table-td {
padding: 0 5px;
width: 100%;
height: 100%;
text-align: center;
// display: flex;
align-items: start;
justify-content: center;
color: #fff;
font-size: 14px;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
line-height: 18px;
cursor: pointer;
}
&+.table-tr {
border-top: 1px solid #47556f9b;
}
// &:hover {
// background: rgba(255, 255, 255, 0.1);
// }
>img {
position: absolute;
bottom: 0px;
width: 591px;
height: 10px;
}
}
}
}
.loading-box {
width: 100%;
height: calc(100% - 35px);
}
.no-data {
width: 100%;
height: calc(100% - 35px);
display: flex;
align-items: center;
justify-content: center;
color: rgba(255, 255, 255, 0.8);
font-size: 18px;
}
}</style>

47
src/views/screenCenter/screenCenter.vue
View File

@ -1,7 +1,7 @@
<template> <template>
<div class="screen-center"> <div class="screen-center">
<div id="map" style="height: 100%;width: 100%;position: relative;min-width:1000px"> <div id="map" style="height: 100%;width: 100%;position: relative;min-width:1000px">
<div @click="initialization" style="position: absolute;left: 100px;bottom: 100px;cursor: pointer;z-index: 100;"> <div @click="initialization" style="position: absolute;left: 34px;top: 34px;cursor: pointer;z-index: 100;">
<el-image style="width: 50px; height: 50px;" :src="require('../../assets/back.png')" fit="fill"></el-image> <el-image style="width: 50px; height: 50px;" :src="require('../../assets/back.png')" fit="fill"></el-image>
</div> </div>
<div <div
@ -173,6 +173,8 @@ import * as turf from '@turf/turf';
import axios from 'axios'; import axios from 'axios';
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
import shibeiJson from './shibei.json'; import shibeiJson from './shibei.json';
import shibeiJson1 from './shibei1.json';
import maskJson from './markerJson.json'; import maskJson from './markerJson.json';
import { getScreenHouseStatistics, getScreenUserStatistics, getScreenHouseList, getScreenUserList } from "../../api/hulianApi" import { getScreenHouseStatistics, getScreenUserStatistics, getScreenHouseList, getScreenUserList } from "../../api/hulianApi"
const md5 = require('blueimp-md5'); const md5 = require('blueimp-md5');
@ -193,6 +195,7 @@ let searchBgLayer;
let numMarker; let numMarker;
let pointMarker; let pointMarker;
let prop; let prop;
let lineLayerBig;
export default { export default {
name: "screen-center", name: "screen-center",
data() { data() {
@ -509,7 +512,7 @@ export default {
.setLnglat([issueLongitude, issueLatitude]) .setLnglat([issueLongitude, issueLatitude])
.setHTML(` <div> .setHTML(` <div>
<div class="eventTitle">典型案例 <span id="close">x</span></div> <div class="eventTitle">典型案例 <span id="close">x</span></div>
<div style="width: 450px;padding: 0 20px;box-sizing: border-box;overflow-x: clip; text-overflow:ellipsis;white-space: nowrap;"> <div style="width: 450px;padding: 0 20px;box-sizing: border-box;overflow-x: clip; text-overflow:ellipsis;">
<div style="margin-top:15px">${itemContent}</div> <div style="margin-top:15px">${itemContent}</div>
<div style="margin-top:15px"><span>时间：</span> ${distributeTime}</div> <div style="margin-top:15px"><span>时间：</span> ${distributeTime}</div>
<div style="margin-top:15px"><span>地点：</span> ${issueAddress}</div> <div style="margin-top:15px"><span>地点：</span> ${issueAddress}</div>
@ -875,6 +878,24 @@ export default {
if (this.mapStyleType == "light") { if (this.mapStyleType == "light") {
styleConfig = lightStyle; styleConfig = lightStyle;
} }
lineLayerBig = new LineLayer({
zIndex: 6,
name: "line2",
})
.source(shibeiJson1)
.shape("wall")
.size(50)
.color('rgb(163, 255, 245)')
.style({
opacity: 1,
raisingHeight: 600,
sourceColor:'rgb(0, 153, 188,0.5)',
targetColor:'rgb(0, 153, 188)',
linearDir:'algin',
})
// scene.addLayer(lineLayerBig);
// 画区域面积 // 画区域面积
polygonLayer = new PolygonLayer({ polygonLayer = new PolygonLayer({
autoFit: true, autoFit: true,
@ -886,14 +907,14 @@ export default {
// .shape("fill") // .shape("fill")
.style({ .style({
opacityLinear: { opacityLinear: {
enable: false, // true - false enable: true, // true - false
dir: "in", // in - out dir: "out", // in - out
}, },
opacity: 0.8, opacity: 0.8,
heightfixed: true, heightfixed: true,
raisingHeight: 300, raisingHeight: 300,
sourceColor: "#348aa6", sourceColor:'#4ee8fc',
targetColor: "rgba(16, 64, 99, 0.5)", targetColor:'#00284e',
}); });
scene.addLayer(polygonLayer); scene.addLayer(polygonLayer);
@ -1032,6 +1053,7 @@ export default {
name: "index", name: "index",
features: e.data.data.agencyDistribution features: e.data.data.agencyDistribution
} }
console.log(e.data.data);
obj.features.forEach(f => { obj.features.forEach(f => {
f.type = "Feature" f.type = "Feature"
f.properties = {} f.properties = {}
@ -1081,9 +1103,6 @@ export default {
background-size: 100% 100%; background-size: 100% 100%;
} }
::v-deep .mapboxgl-ctrl { ::v-deep .mapboxgl-ctrl {
display: none !important; display: none !important;
} }
@ -1097,16 +1116,15 @@ export default {
} }
::v-deep .l7-popup-content { ::v-deep .l7-popup-content {
background: rgba(3, 31, 73, 0.72); background: transparent;
opacity: 0.9; opacity: 0.9;
border-radius: 5px; border-radius: 5px;
color: #fff; color: #fff;
height: 431px; height: auto;
width: 440px; width: 440px;
padding: 20px !important; padding: 20px !important;
background-image: url("@/assets/images/map/popupBg.png"); background-image: url("@/assets/images/map/popupBg.png");
background-size: cover; background-size: 100% 100%;
/* 或者使用 contain，根据需要选择 */
background-repeat: no-repeat; background-repeat: no-repeat;
} }
@ -1184,6 +1202,9 @@ export default {
.el-pagination.is-background .el-pager li { .el-pagination.is-background .el-pager li {
background-color: #1e7b9d; background-color: #1e7b9d;
} }
::v-deep .l7-popup .l7-popup-content .l7-popup-content__panel{
white-space: initial;
}
::v-deep .el-pagination.is-background .btn-prev { ::v-deep .el-pagination.is-background .btn-prev {
background-color: #1e7b9d; background-color: #1e7b9d;

2569
src/views/screenCenter/shibei1.json
View File

File diff suppressed because it is too large

11
src/views/screenContent.vue
View File

@ -1,3 +1,12 @@
<!--
* @Author: mk 2403457699@qq.com
* @Date: 2023-11-21 14:30:01
* @LastEditors: mk 2403457699@qq.com
* @LastEditTime: 2023-12-07 17:00:51
* @Description: 介绍一下改动了什么
*
*
-->
<template> <template>
<div class="screen-content"> <div class="screen-content">
<div class="screen-content-left"> <div class="screen-content-left">
@ -37,7 +46,7 @@ export default {
.screen-content { .screen-content {
box-sizing: border-box; box-sizing: border-box;
position: relative; position: relative;
padding: 18px 0 0; padding: 18px 0 30px;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;

8
src/views/screenLeft/left1.vue
View File

@ -65,13 +65,13 @@
<div class="tudi" v-else-if="active == 1"> <div class="tudi" v-else-if="active == 1">
<div class="item"><img src="../../assets/icon/yjcz.png" alt=""> <span>公园</span><img src="" alt=""> <span><b <div class="item"><img src="../../assets/icon/yjcz.png" alt=""> <span>公园</span><img src="" alt=""> <span><b
style="color:#FFBF36;">27</b>个</span></div> style="color:#FFBF36;">20</b>个</span></div>
<div class="item"><img src="../../assets/icon/ansc.png" alt=""> <span>医院</span><img src="" alt=""> <span><b <div class="item"><img src="../../assets/icon/ansc.png" alt=""> <span>医院</span><img src="" alt=""> <span><b
style="color:#FD7000;">27</b>个</span></div> style="color:#FD7000;">14</b>个</span></div>
<div class="item"><img src="../../assets/icon/csgl.png" alt=""> <span>学校</span><img src="" alt=""> <span><b <div class="item"><img src="../../assets/icon/csgl.png" alt=""> <span>学校</span><img src="" alt=""> <span><b
style="color: #0bdbc0;;">27</b>个</span></div> style="color: #0bdbc0;;">50</b>个</span></div>
<div class="item"><img src="../../assets/icon/csgl.png" alt=""> <span>健身活动</span><img src="" alt=""> <span><b <div class="item"><img src="../../assets/icon/csgl.png" alt=""> <span>健身活动</span><img src="" alt=""> <span><b
style="color: #0bdbc0;;">27</b>个</span></div> style="color: #0bdbc0;;">62</b>个</span></div>
</div> </div>
<div class="table" v-else> <div class="table" v-else>
<screen-custom-table :headerColor="'#BDE8FF'" :headerHeight="'36px'" :bodyTdColor="'#FFFFFF'" <screen-custom-table :headerColor="'#BDE8FF'" :headerHeight="'36px'" :bodyTdColor="'#FFFFFF'"

111
src/views/screenLeft/left2.vue
View File

@ -13,20 +13,22 @@
</div> </div>
<div class="frame-arrow"> <div class="frame-arrow">
<img src="./../../assets/icon/arrow.png" /> <img src="./../../assets/icon/arrow.png" />
</div> </div>
<div class="frame-multirow"> <div class="frame-multirow">
<div class="multirowitem" ref="showClgb" @click="clickItem('showClgb')"> {{ '处理干部包联社区' }} <div class="multirowitem" ref="showClgb" @click="clickItem('showClgb')"> {{ '处理干部包联社区' }}
<screen-popup-ydzl :top="top" :left="left" :memberInfo="clgbMemberInfo" :visible.sync="showObj['showClgb']"> <screen-popup-ydzl :top="top" :left="left" :memberArr="clgbMemberInfo" :header="nameAndMobile"
:visible.sync="showObj['showClgb']">
</screen-popup-ydzl> </screen-popup-ydzl>
</div> </div>
<div class="multirowitem" ref="showYxgz" @click="clickItem('showYxgz')"> {{ '一线工作组' }} <div class="multirowitem" ref="showYxgz" @click="clickItem('showYxgz')"> {{ '一线工作组' }}
<screen-popup-ydzl :top="top" :left="left" :memberArr="memberInfoYxgz" :visible.sync="showObj['showYxgz']"> <screen-popup-ydzl :top="top" :left="left" :memberArr="memberInfoYxgz" :header="nameAndMobile"
:visible.sync="showObj['showYxgz']">
</screen-popup-ydzl> </screen-popup-ydzl>
</div> </div>
<div class="multirowitem" ref="showDjzd" @click="clickItem('showDjzd')"> {{ '党建指导员' }} <div class="multirowitem" ref="showDjzd" @click="clickItem('showDjzd')"> {{ '党建指导员' }}
<screen-popup-ydzl :top="top" :left="left" :memberInfo="memberInfoDjzd" :visible.sync="showObj['showDjzd']"> <screen-popup-ydzl :top="top" :left="left" :memberArr="memberInfoDjzd" :header="nameAndMobile"
:visible.sync="showObj['showDjzd']">
</screen-popup-ydzl> </screen-popup-ydzl>
</div> </div>
</div> </div>
@ -35,15 +37,18 @@
</div> </div>
<div class="frame-multirow"> <div class="frame-multirow">
<div class="multirowitem" ref="showSqsj" @click="clickItem('showSqsj')"> {{ '社区书记' }} <div class="multirowitem" ref="showSqsj" @click="clickItem('showSqsj')"> {{ '社区书记' }}
<screen-popup-ydzl :top="top" :left="left" :memberInfo="memberInfoSqsj" :visible.sync="showObj['showSqsj']"> <screen-popup-ydzl :top="top" :left="left" :memberArr="memberInfoSqsj" :header="nameAndMobile"
:visible.sync="showObj['showSqsj']">
</screen-popup-ydzl> </screen-popup-ydzl>
</div> </div>
<div class="multirowitem" ref="showSqfsj" @click="clickItem('showSqfsj')"> {{ '社区副书记' }} <div class="multirowitem" ref="showSqfsj" @click="clickItem('showSqfsj')"> {{ '社区副书记' }}
<screen-popup-ydzl :top="top" :left="left" :memberInfo="memberInfoSqfs" :visible.sync="showObj['showSqfsj']"> <screen-popup-ydzl :top="top" :left="left" :memberArr="memberInfoSqfs" :header="nameAndMobile"
:visible.sync="showObj['showSqfsj']">
</screen-popup-ydzl> </screen-popup-ydzl>
</div> </div>
<div class="multirowitem" ref="showDwwy" @click="clickItem('showDwwy')"> {{ '党委委员' }} <div class="multirowitem" ref="showDwwy" @click="clickItem('showDwwy')"> {{ '党委委员' }}
<screen-popup-ydzl :top="top" :left="left" :memberInfo="memberInfoDwwy" :visible.sync="showObj['showDwwy']"> <screen-popup-ydzl :top="top" :left="left" :memberArr="memberInfoDwwy" :header="nameAndMobile"
:visible.sync="showObj['showDwwy']">
</screen-popup-ydzl> </screen-popup-ydzl>
</div> </div>
</div> </div>
@ -74,8 +79,8 @@
</div> </div>
<div class="frame-onerow"> <div class="frame-onerow">
<div class="rowitem" ref="showWgzb" @click="clickItem('showWgzb')"> {{ '网格支部书记' }} <div class="rowitem" ref="showWgzb" @click="clickItem('showWgzb')"> {{ '网格支部书记' }}
<screen-popup-ydzl :top="top" :left="left" :width="width" :memberInfo="memberInfo" <screen-popup-ydzl :top="top" :left="left" :memberArr="memberInfoWgzb"
:visible.sync="showObj['showWgzb']"> :visible.sync="showObj['showWgzb']" :header="nameAndMobile">
</screen-popup-ydzl> </screen-popup-ydzl>
</div> </div>
@ -85,8 +90,8 @@
</div> </div>
<div class="frame-onerow" ref="showWgz" @click="clickItem('showWgz')"> <div class="frame-onerow" ref="showWgz" @click="clickItem('showWgz')">
<div class="rowitem"> {{ '网格长' }} <div class="rowitem"> {{ '网格长' }}
<screen-popup-ydzl :top="top" :left="left" :width="width" :memberInfo="memberInfo" <screen-popup-ydzl :top="top" :left="left" :memberArr="memberInfoWgz"
:visible.sync="showObj['showWgz']"> :visible.sync="showObj['showWgz']" :header="nameAndMobile">
</screen-popup-ydzl> </screen-popup-ydzl>
</div> </div>
</div> </div>
@ -98,7 +103,7 @@
</div> </div>
<div class="grid-member"> <div class="grid-member">
<div class="grid-member-title" @click="clickItem('showZzwgy')">{{ '专职网格员' }}</div> <div class="grid-member-title" @click="clickItem('showZzwgy')">{{ '专职网格员' }}</div>
<screen-popup-ydzl :top="tops" :width="width" :left="left" :memberArr="memberInfoZzwgy" <screen-popup-ydzl :top="tops" :width="width" :header="zzwgyheader" :left="left" :memberArr="memberInfoZzwgy"
:visible.sync="showObj['showZzwgy']"> :visible.sync="showObj['showZzwgy']">
</screen-popup-ydzl> </screen-popup-ydzl>
</div> </div>
@ -109,8 +114,8 @@
</div> </div>
<div class="grid-member"> <div class="grid-member">
<div class="grid-member-title" @click="clickItem('showBssb')">{{ '"北尚诉办"专职终端网格员' }}</div> <div class="grid-member-title" @click="clickItem('showBssb')">{{ '"北尚诉办"专职终端网格员' }}</div>
<screen-popup-ydzl :top="topss" :left="left" :memberInfo="memberInfoBssb" <screen-popup-ydzl :top="tops" :left="left" :memberArr="memberInfoBssb" :visible.sync="showObj['showBssb']"
:visible.sync="showObj['showBssb']"> :header="nameAndMobile">
</screen-popup-ydzl> </screen-popup-ydzl>
</div> </div>
</div> </div>
@ -120,7 +125,8 @@
</div> </div>
<div class="grid-member"> <div class="grid-member">
<div class="grid-member-title" @click="clickItem('showZywg')">{{ '专业网格管理员' }}</div> <div class="grid-member-title" @click="clickItem('showZywg')">{{ '专业网格管理员' }}</div>
<screen-popup-ydzl :top="tops" :left="left" :memberArr="memberInfoZywg" :visible.sync="showObj['showZywg']"> <screen-popup-ydzl :top="tops" :header="zzwgyheader" :left="left" :memberArr="memberInfoZywg"
:visible.sync="showObj['showZywg']">
</screen-popup-ydzl> </screen-popup-ydzl>
</div> </div>
</div> </div>
@ -130,7 +136,8 @@
</div> </div>
<div class="grid-member"> <div class="grid-member">
<div class="grid-member-title" @click="clickItem('showJzwg')">{{ '兼职网格管理员' }}</div> <div class="grid-member-title" @click="clickItem('showJzwg')">{{ '兼职网格管理员' }}</div>
<screen-popup-ydzl :top="tops" :left="left" :memberArr="memberInfoJzwg" :visible.sync="showObj['showJzwg']"> <screen-popup-ydzl :top="tops" :header="zzwgyheader" :left="left" :memberArr="memberInfoJzwg"
:visible.sync="showObj['showJzwg']">
</screen-popup-ydzl> </screen-popup-ydzl>
</div> </div>
@ -181,7 +188,7 @@ export default {
tops: '-143px', tops: '-143px',
topss: '-33px', topss: '-33px',
left: '0px', left: '0px',
width: '578px', width: '550px',
showObj: { showObj: {
showClgb: false, showClgb: false,
showYxgz: false, showYxgz: false,
@ -204,24 +211,22 @@ export default {
}, },
memberInfo: { clgbMemberInfo: [],
duty: '职务',
name: '张三',
phone: '15999999999'
},
clgbMemberInfo: {},
memberInfoYxgz: [], memberInfoYxgz: [],
memberInfoDjzd: {}, memberInfoDjzd: [],
memberInfoDwwy: {}, memberInfoDwwy: [],
memberInfoSqfs: {}, memberInfoSqfs: [],
memberInfoSqsj: {}, memberInfoSqsj: [],
memberLeftList: [], memberLeftList: [],
memberInfoZzwgy: [], memberInfoZzwgy: [],
memberInfoBssb: {}, memberInfoBssb: [],
memberInfoZywg: [], memberInfoZywg: [],
memberInfoJzwg: [], memberInfoJzwg: [],
memberInfoWgzb: [],
memberInfoWgz: [],
nameAndMobile: ['序号', '姓名', { title: '电话', width: '300px' }],
zzwgyheader:[{title:'序号',width:'50px'},{ title: '姓名', width: '100px' }, { title: '电话', width: '200px' }, { title: '职位', width: '250px' }],
memberRightList: [], memberRightList: [],
showLeftMember: [], showLeftMember: [],
showRightMember: [], showRightMember: [],
@ -337,7 +342,7 @@ export default {
let params = { let params = {
communityId: this.shibeiAId,//this.shibeiAId communityId: this.shibeiAId,//this.shibeiAId
} }
const { data, code, msg } = await getListForGrid(params) const { data, code, msg } = await getCommunityStatistics(params)
if (code == 0) { if (code == 0) {
this.wgzbTotal = data.girdNum || 0; this.wgzbTotal = data.girdNum || 0;
this.wgzbsjTotal = data.girdShujiNum || 0; this.wgzbsjTotal = data.girdShujiNum || 0;
@ -349,6 +354,7 @@ export default {
console.error(err) console.error(err)
} }
}, },
// 社区人员架构
async getListForCommnity(type) { async getListForCommnity(type) {
try { try {
let params = { let params = {
@ -357,6 +363,12 @@ export default {
} }
const { data, code, msg } = await getListForCommnity(params) const { data, code, msg } = await getListForCommnity(params)
if (code == 0) { if (code == 0) {
this.clgbMemberInfo = []
this.memberInfoYxgz = []
this.memberInfoDjzd= []
this.memberInfoSqsj= []
this.memberInfoSqfs= []
this.memberInfoDwwy= []
const typeMap = { const typeMap = {
'1': 'clgbMemberInfo', '1': 'clgbMemberInfo',
'2': 'memberInfoYxgz', '2': 'memberInfoYxgz',
@ -367,34 +379,39 @@ export default {
}; };
const propertyName = typeMap[type]; const propertyName = typeMap[type];
if (propertyName) { if (propertyName) {
this[propertyName] = (type === '2') ? data.map(item => ({ name: item.name, phone: item.mobile })) : { this[propertyName] = (type === '2') ? data.map((item, index) => ([index + 1, item.name, item.mobile])) : [[1, data[0].name, data[0].mobile]];
name: data[0].name,
phone: data[0].mobile
};
} }
} }
} catch (err) { } catch (err) {
console.error(err) console.error(err)
} }
}, },
// 网格人员架构
async getListForGrid(type) { async getListForGrid(type) {
try { try {
let params = { let params = {
gridId: this.shibeiAId,//'1224237268259110914' gridId: this.selectGrid.value,//'1224237268259110914'
type: type - 6 type: type - 6
} }
const { data, code, msg } = await getListForGrid(params) const { data, code, msg } = await getListForGrid(params)
if (code == 0) { if (code == 0) {
this.memberInfoZzwgY = [];
this.memberInfoBssb= [];
this.memberInfoZywg= [];
this.memberInfoJzwg= [];
this.memberInfoWgzb= [];
this.memberInfoWgz= [];
const typeMap = { const typeMap = {
'1': 'memberInfoZzwgy', '1': 'memberInfoZzwgy',
'2': 'memberInfoBssb', '2': 'memberInfoBssb',
'3': 'memberInfoZywg', '3': 'memberInfoZywg',
'4': 'memberInfoJzwg' '4': 'memberInfoJzwg',
'5': 'memberInfoWgzb',
'6': 'memberInfoWgz'
}; };
const propertyName = typeMap[type - 6]; const propertyName = typeMap[type - 6];
console.log(propertyName);
if (propertyName) { if (propertyName) {
this[propertyName] = (type === '8') ? { name: data[0].name, phone: data[0].mobile } : data.map(item => ({ name: item.name, phone: item.mobile, property: item.property })); this[propertyName] = (type === '8' || type === '11' || type === '12') ? [[1, data[0].name, data[0].mobile]] : data.map((item, index) => ([index + 1, item.name, item.mobile, item.property]));
} }
} }
} catch (err) { } catch (err) {
@ -410,10 +427,9 @@ export default {
const { data, code, msg } = await getGridoption(params) const { data, code, msg } = await getGridoption(params)
if (code == 0) { if (code == 0) {
if (data) { if (data) {
this.gridList = data.map(item => ({ label: item.label, id: item.value })) this.gridList = data.map(item => ({ label: item.label, value: item.value }))
this.selectGrid = { label: this.gridList[0].label, id: this.gridList[0].value } this.selectGrid = { label: this.gridList[0].label, value: this.gridList[0].value }
this.gridName = this.selectGrid.label this.gridName = this.selectGrid.label
console.log(this.gridList);
} }
} }
} catch (err) { } catch (err) {
@ -433,6 +449,9 @@ export default {
'showBssb': '8', 'showBssb': '8',
'showZywg': '9', 'showZywg': '9',
'showJzwg': '10', 'showJzwg': '10',
'showWgzb': '11',
'showWgz': '12',
}; };
const selectedType = typeMap[type]; const selectedType = typeMap[type];
if (selectedType && Number(selectedType) < 7) { if (selectedType && Number(selectedType) < 7) {
@ -450,12 +469,10 @@ export default {
this.gridDropMenuVisible = !this.gridDropMenuVisible this.gridDropMenuVisible = !this.gridDropMenuVisible
}, },
onChooseGrid(gridItem) { onChooseGrid(gridItem) {
console.log(gridItem, '选中id'); this.selectGrid = { value: gridItem.value, label: gridItem.label }
this.selectGrid = gridItem
this.gridName = this.selectGrid.label this.gridName = this.selectGrid.label
}, },
clickLeftMemberItem(index) { clickLeftMemberItem(index) {
const position = (index + 1) % 3//计算在每一行第几个，确定popup的位置 const position = (index + 1) % 3//计算在每一行第几个，确定popup的位置
console.log(position) console.log(position)
if (position === 1) {//左1 if (position === 1) {//左1
@ -489,10 +506,8 @@ export default {
<style lang="scss" src="style/left2.scss" scoped></style> <style lang="scss" src="style/left2.scss" scoped></style>
<style lang="scss" src="style/agencySelect.scss" scoped></style> <style lang="scss" src="style/agencySelect.scss" scoped></style>
<style lang="scss" scoped> <style lang="scss" scoped>.frame-arrow {
.frame-arrow {
img { img {
height: 53px; height: 53px;
} }
} }</style>
</style>

4
src/views/screenLeft/left3.vue
View File

@ -10,12 +10,12 @@
<div class="chartsGl" id="charts"></div> <div class="chartsGl" id="charts"></div>
<!-- 饼图下面的底座 --> <!-- 饼图下面的底座 -->
<div class="buttomCharts"></div> <div class="buttomCharts"></div>
<!-- <div class="legend"> <div class="legend">
<div class="legend-item" v-for="(item, index) in optionData" :key="index"> <div class="legend-item" v-for="(item, index) in optionData" :key="index">
<div class="item-icon" :style="{ background: item.itemStyle.color }"></div> <div class="item-icon" :style="{ background: item.itemStyle.color }"></div>
<div class="item-name">{{ item.name }}</div> <div class="item-name">{{ item.name }}</div>
</div> </div>
</div> --> </div>
</div> </div>
</div> </div>
<div class='b-ljhd'> <div class='b-ljhd'>

1
src/views/screenRight/right2.vue
View File

@ -213,6 +213,7 @@ export default {
if (res.code == 0) { if (res.code == 0) {
this.dataListResult = [] this.dataListResult = []
this.dataListResult = res.data.map((item, index) => [index + 1, item.deptName, item.closedRatio, item.responseRatio, item.satisfiedRatio]) this.dataListResult = res.data.map((item, index) => [index + 1, item.deptName, item.closedRatio, item.responseRatio, item.satisfiedRatio])
console.log(this.dataListResult );
if (this.dataListResult.length === 0) { if (this.dataListResult.length === 0) {
this.noData = true this.noData = true
} }

Write Preview
Loading…
Cancel
Save