Browse Source

Merge branch 'dev-shuju' into test

shibei_master
13176889840 4 years ago
parent
commit
cd7b6cfc92
  1. 38
      src/assets/scss/modules/visual/heart.scss
  2. 5
      src/assets/scss/modules/visual/incident-info.scss
  3. 8
      src/assets/scss/modules/visual/issue-info.scss
  4. 3
      src/assets/scss/modules/visual/processAnalyze.scss
  5. 32
      src/views/modules/visual/communityGovern/cpt/issue-info.vue
  6. 29
      src/views/modules/visual/communityGovern/cpt/project-info.vue
  7. 43
      src/views/modules/visual/communityGovern/processAnalyze.vue
  8. 10
      src/views/modules/visual/communityGovern/resibuzz.vue
  9. 10
      src/views/modules/visual/communityGovern/typeAnalyze.vue
  10. 3
      src/views/modules/visual/components/screen-echarts-frame/index.vue
  11. 173
      src/views/modules/visual/components/screen-map/index.vue
  12. 2
      src/views/modules/visual/cpts/analyse.vue
  13. 130
      src/views/modules/visual/heart/index.vue
  14. 16
      src/views/modules/visual/measure/service.vue
  15. 113
      src/views/modules/visual/measure/volunteer.vue

38
src/assets/scss/modules/visual/heart.scss

@ -8,6 +8,42 @@
justify-content: space-between;
margin-top: 5px;
}
.m-sizer {
width: 195px;
margin: 10px 0;
margin-left: auto;
> span {
font-size: 16px;
font-family: PingFang SC;
font-weight: 400;
color: #ffffff;
}
::v-deep .el-input {
width: 140px;
height: 36px;
.el-input__inner {
height: 100%;
padding: 0 10px;
color: #fff;
line-height: 36px;
background: #06186d;
border: 1px solid #1a64cc;
}
.el-icon-arrow-up:before {
content: "\e78f";
}
}
::v-deep .el-date-editor {
.el-input__prefix {
left: unset;
right: 5px;
}
}
}
.m-tb {
width: 33%;
.title {
@ -28,7 +64,7 @@
}
}
.tb {
height: calc(100vh - 180px);
height: calc(100vh - 230px);
overflow-y: auto;
@include scrollBar;
}

5
src/assets/scss/modules/visual/incident-info.scss

@ -120,6 +120,11 @@
margin: 10px 0;
display: flex;
padding-left: 15px;
.info-title-2 {
width: 70px;
flex: 0 0 1;
font-size: 14px;
}
> span,
> div {

8
src/assets/scss/modules/visual/issue-info.scss

@ -73,10 +73,14 @@
margin: 10px 0;
display: flex;
padding-left: 15px;
.info-title-2 {
width: 90px;
flex: 0 0 1;
font-size: 14px;
}
.info-pics {
display: flex;
margin: 20px 0;
margin: 10px 0;
img {
display: block;
width: 32%;

3
src/assets/scss/modules/visual/processAnalyze.scss

@ -122,6 +122,7 @@
}
.echart-line {
margin-top: 10px;
height: 100%;
}
}
.g-count {
@ -244,7 +245,7 @@
text-align: center;
position: relative;
width: 500px;
// height: 100%;
height: 100%;
box-sizing: border-box;
}

32
src/views/modules/visual/communityGovern/cpt/issue-info.vue

@ -15,46 +15,48 @@
<div class="m-info">
<div class="info-prop">
<span>议题标题</span>
<span class="info-title-2">议题标题</span>
<span>{{ info.issueTitle }}</span>
</div>
<div class="info-prop">
<span>议题建议</span>
<span class="info-title-2">议题建议</span>
<span>{{ info.issueSuggestion }}</span>
</div>
<div class="info-prop">
<span>话题内容</span>
<div>{{ info.topicInfo.topicContent }}</div>
<div v-if="info.topicInfo.topicImgs&&info.topicInfo.topicImgs.length>0"
class="info-pics">
<img :src="src"
:key="src"
v-for="src in info.topicInfo.topicImgs" />
<span class="info-title-2">话题内容</span>
<div>
<div>{{ info.topicInfo.topicContent }}</div>
<div v-if="info.topicInfo.topicImgs&&info.topicInfo.topicImgs.length>0"
class="info-pics">
<img :src="src"
:key="src"
v-for="src in info.topicInfo.topicImgs" />
</div>
</div>
</div>
<div class="info-prop">
<span>转议题时间</span>
<span class="info-title-2">转议题时间</span>
<span>{{ info.shiftIssueTime}}</span>
</div>
<div class="info-prop">
<span>所属网格</span>
<span class="info-title-2">所属网格</span>
<span>{{ info.belongsGridName}}</span>
</div>
<div class="info-prop">
<span>话题发表人</span>
<span class="info-title-2">话题发表人</span>
<span>{{ info.topicInfo.publishedUser}}</span>
</div>
<div class="info-prop">
<span>议题发起人</span>
<span class="info-title-2">议题发起人</span>
<span>{{ info.issueInitiator}}</span>
</div>
<div class="info-prop">
<span>话题来源</span>
<span class="info-title-2">话题来源</span>
<span>{{ info.topicInfo.groupName}}</span>
</div>
<div class="info-prop">
<span>话题发表时间</span>
<span class="info-title-2">话题发表时间</span>
<span>{{ info.topicInfo.publishedTimeShow}}</span>
</div>
</div>

29
src/views/modules/visual/communityGovern/cpt/project-info.vue

@ -193,20 +193,25 @@
@click="watchImg(src)" />
</div>
<div class="info-prop">
<span>提交时间</span>
<span class="info-title-2">提交时间</span>
<span>{{ info.eventTime }}</span>
</div>
<div class="info-prop">
<span>报事人</span>
<span class="info-title-2">报事人</span>
<span>{{ info.eventPeopleName }}</span>
</div>
<div class="info-prop">
<span>所属网格</span>
<span class="info-title-2">所属网格</span>
<span>{{ info.gridName }}</span>
</div>
<div class="info-prop">
<span>提报给</span>
<span>{{ info.eventPerson.join("、") || "--" }}</span>
<span class="info-title-2">提报给</span>
<div>
<div>{{ info.eventPersonShow}}</div>
<div>{{ info.eventOrgShow}}</div>
</div>
<!-- <span>{{ info.eventPerson.join("、") || "--" }}</span> -->
</div>
</div>
@ -530,7 +535,15 @@ export default {
});
if (code === 0) {
this.info = data;
if (data.eventOrg && data.eventOrg.length > 0) {
data.eventOrgShow = data.eventOrg.join('、')
}
if (data.eventPerson && data.eventPerson.length > 0) {
data.eventPersonShow = data.eventPerson.join('、')
}
this.info = { ...data };
} else {
this.$message.error(msg);
}
@ -581,7 +594,7 @@ export default {
const { data, code, msg } = await requestPost(url, {
categoryCodeList: this.categoryCodes,
userId: this.userId,
projectId: this.projectIdCopy
});
if (code === 0) {
@ -592,7 +605,7 @@ export default {
let array1 = []
let array2 = []
// debugger
//
if (data.groupProjectList && data.groupProjectList.length > 0 && data.eventProjectList && data.eventProjectList.length > 0) {
this.yanPan.hasEvent = true

43
src/views/modules/visual/communityGovern/processAnalyze.vue

@ -163,14 +163,14 @@ export default {
legendArray: [
{
name: '未结案',
count: 120,
percent: '25.0%',
count: 0,
percent: '0%',
url: require('../../../../assets/img/shuju/measure/huang@2x.png')
},
{
name: '已结案',
count: 351,
percent: '50.0%',
count: 0,
percent: '0%',
url: require('../../../../assets/img/shuju/measure/lv@2x.png')
}
],
@ -249,6 +249,8 @@ export default {
await this.getLineChart()
await this.loadProjectlist()
this.assignData()
},
assignData () {
@ -319,17 +321,29 @@ export default {
this.projectTotal = data.projectTotal
this.dateIncr = data.dateIncr
this.monthIncr = data.monthIncr
this.legendArray = [
{
name: '未结案',
count: data.pendingTotal,
percent: data.pendingRatio,
url: require('../../../../assets/img/shuju/measure/huang@2x.png')
},
{
name: '已结案',
count: data.closedTotal,
percent: data.closedRatio,
url: require('../../../../assets/img/shuju/measure/lv@2x.png')
}
]
this.pieData = [
{
name: "未结案",
value: data.pendingTotal,
selected: true,
},
{
name: "已结案",
value: data.pendingTotal
value: data.closedTotal,
}
]
@ -485,6 +499,7 @@ export default {
},
assignLineChart () {
this.lineOption = lineOption()
this.$refs.lineChart.setOption(this.lineOption, true)
this.$refs.lineChart.setOption({
@ -509,19 +524,27 @@ export default {
async assignPieChart () {
this.pieTotal = 0
let maxIndex = 0
let maxValue = this.pieData[0].value
const _that = this
// pieChart
this.pieOption = pieOption(this.pieChartS)
this.pieData.forEach(item => {
this.pieData.forEach((item, index) => {
this.pieTotal = this.pieTotal + item.value
if (item.value > maxValue) {
maxValue = item.value
maxIndex = index
item.selected = true
} else if (index !== 0) {
item.selected = false
}
});
this.pieOption.title.text = this.pieTotal
this.clickPie(0)
this.clickPie(maxIndex)
let fun = function (params) {
_that.clickPie(params.dataIndex)

10
src/views/modules/visual/communityGovern/resibuzz.vue

@ -31,12 +31,11 @@
<div class="g-cpt-resi">
<div class="g-l">
<screen-echarts-frame v-if="!pieNoData && !dataLoading"
<screen-echarts-frame v-if=" !dataLoading"
class="echart-wr"
@myChartMethod="pieInitOk"
ref="pieChart"></screen-echarts-frame>
<screen-nodata class="nodata"
v-if="pieNoData && !dataLoading"></screen-nodata>
<div class="table-status"
v-if="dataLoading">
<screen-loading>加载中</screen-loading>
@ -92,7 +91,6 @@ export default {
data () {
return {
dataLoading: true,
pieNoData: false,
pieChartS: null,
pieChart: '',
@ -365,7 +363,7 @@ export default {
this.pieTotal = 0
if (this.pieData.length > 0) {
this.pieNoData = false
this.$refs.pieChart.setNoData(false)
const _that = this
let maxIndex = 0
let maxValue = this.pieData[0].count
@ -402,7 +400,7 @@ export default {
}
this.$refs.pieChart.handleClick(fun)
} else {
this.pieNoData = true
this.$refs.pieChart.setNoData(true)
}
},

10
src/views/modules/visual/communityGovern/typeAnalyze.vue

@ -247,8 +247,9 @@ export default {
},
handleChangeDate (value) {
async handleChangeDate (value) {
this.dateIdShow = value
await this.getPieChart()
this.getPie()
},
@ -267,7 +268,6 @@ export default {
}
const url = "/data/aggregator/project/projectcategorylist";
// const url = "http://yapi.elinkservice.cn/mock/245/data/aggregator/project/projectcategorylist";
let params = {
@ -340,7 +340,6 @@ export default {
}
}
let fun = function (params) {
_that.clickPie(params.dataIndex)
@ -392,10 +391,11 @@ export default {
this.getTable()
},
handleChangeAgency (value) {
async handleChangeAgency (value) {
this.agencyName = this.$refs["myCascader"].getCheckedNodes()[0].label
this.agencyId = this.agencyIdArray.length > 0 ? this.agencyIdArray[this.agencyIdArray.length - 1] : ''
await this.getPieChart()
this.getPie()
console.log(this.agencyIdArray)
},
@ -419,7 +419,7 @@ export default {
if (code === 0) {
this.demand.total = data.total;
this.tableList = data.list
if (data.list.length > 0) {
if (data.list && data.list.length > 0) {
this.demand.list = data.list.map((item) => {
//:issue :agency :resi_event
item.originShow = item.origin === 'issue' ? '楼院小组' : item.origin === 'agency' ? '项目立项' : '事件上报'

3
src/views/modules/visual/components/screen-echarts-frame/index.vue

@ -3,7 +3,7 @@
<div v-show="!noData"
class="screenEchartsFrame"
ref="screenEchartsFrame"></div>
<screen-nodata v-if="noData"
<screen-nodata v-show="noData"
class="nodata"></screen-nodata>
</div>
</template>
@ -56,6 +56,7 @@ export default {
},
//
setNoData (nodata) {
this.noData = nodata
},

173
src/views/modules/visual/components/screen-map/index.vue

@ -3,8 +3,15 @@
<div class="div_map"
id="map"
ref="map">
<!-- <div id="map"
class="map"></div> -->
</div>
<div id="popup"
style="display: none;"
class="ol-popup">
<a href="#"
id="popup-closer"
class="ol-popup-closer"></a>
<div id="popup-content"
class="popup-content"></div>
</div>
</div>
</template>
@ -28,6 +35,7 @@ import { getDistance } from 'ol/sphere';
import { mapGetters } from "vuex";
import { Loading } from 'element-ui'; //Loading
import { requestPost } from "@/js/dai/request";
@ -81,7 +89,8 @@ const vueGis = {
centerPoint: [],//
zoom: 14,//14
minZoom: 1,//
overlay: null,
showPopup: false,
mapInfo: {
},
@ -172,6 +181,13 @@ const vueGis = {
this.loadIcon()
}
if (this.isAddOpenlay) {
//icon
this.addOverlay()
}
this.addMapClick()
},
@ -365,8 +381,6 @@ const vueGis = {
return (distance < max || distance === max)
// debugger
// return
// var wgs84Sphere = new ol.Sphere(6378137);
@ -405,21 +419,8 @@ const vueGis = {
//map
})
let that = this
map.on('singleclick', function (e) {
const feature = map.forEachFeatureAtPixel(e.pixel, function (feature) {
return feature;
});
if (feature) {
console.log(feature)
that.$emit('clickFeature', feature)
}
})
//
const dblClickInteraction = map
.getInteractions()
@ -454,7 +455,6 @@ const vueGis = {
},
//
initPolygonLayer () {
polygonSource = new VectorSource({
@ -542,6 +542,83 @@ const vueGis = {
// });
},
//
addOverlay () {
// 使 DOM
var container = document.getElementById("popup");
var closer = document.getElementById("popup-closer");
var content = document.getElementById("popup-content");
// Overlay
this.overlay = new Overlay({
element: container, // Overlay DOM
autoPan: true, //
autoPanAnimation: {
duration: 250 // 9
},
zIndex: 100
});
// map
map.addOverlay(this.overlay);
let _that = this;
/**
* 为弹窗添加一个响应关闭的函数
*/
closer.onclick = function () {
_that.overlay.setPosition(undefined);
closer.blur();
return false;
};
},
//
addMapClick () {
let _that = this
map.on("click", function (evt) {
const feature = map.forEachFeatureAtPixel(evt.pixel, function (feature) {
return feature;
});
if (feature) {
console.log(feature)
if (_that.clickType === 'back') {
_that.$emit('clickFeature', feature)
} else if (_that.clickType === 'popup') {
_that.$emit('clickFeature', feature)
// _that.overlay.getElement().parentNode.style.display = 'block'
// _that.overlay.getElement().parentNode.parentNode.style.display = 'block'
// content.innerHTML = `
// <p></p>
// <p><p><code> </code> <p>
// <p></p>X&nbsp;&nbsp; Y: `;
// _that.overlay.setPosition(evt.coordinate); // overlay x,y
} else {
console.log('此处没有标注')
}
}
});
},
handleShowPopup (showData, coordinate) {
console.log(this.overlay.getElement())
this.overlay.getElement().style.display = 'block'
this.overlay.getElement().parentNode.style.display = 'block'
this.overlay.getElement().parentNode.parentNode.style.display = 'block'
var content = document.getElementById("popup-content");
content.innerHTML = showData;
this.overlay.setPosition(coordinate); // overlay x,y
},
//
getRndBetween (lowerLimit, upperLimit) {
@ -582,6 +659,17 @@ const vueGis = {
showIconLayer: {
type: Boolean,
default: false
},
//
isAddOpenlay: {
type: Boolean,
default: false
},
//,back:popup:
clickType: {
type: String,
default: 'back'
}
},
@ -623,4 +711,51 @@ export default vueGis;
.ol-overlaycontainer-stopevent {
display: none;
}
.ol-popup {
position: absolute;
background-color: #1257c9;
-webkit-filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
filter: drop-shadow(0 1px 4px rgba(0, 0, 0, 0.2));
padding: 15px;
border-radius: 10px;
border: 1px solid #1257c9;
bottom: 12px;
left: -50px;
text-align: left;
}
.ol-popup:after,
.ol-popup:before {
top: 100%;
border: solid transparent;
content: " ";
height: 0;
width: 0;
position: absolute;
pointer-events: none;
}
.ol-popup:after {
border-top-color: 1257c9;
border-width: 10px;
left: 48px;
margin-left: -10px;
}
.ol-popup:before {
border-top-color: #1257c9;
border-width: 11px;
left: 48px;
margin-left: -11px;
}
.ol-popup-closer {
text-decoration: none;
position: absolute;
top: 2px;
right: 8px;
}
.popup-content {
width: 300px;
}
.ol-popup-closer:after {
content: "✖";
color: rgba(1, 17, 104, 1);
}
</style>

2
src/views/modules/visual/cpts/analyse.vue

@ -297,6 +297,7 @@ export default {
<style lang="scss" scoped>
.analyse-container {
color: #fff;
.analyse-wr {
display: flex;
align-items: center;
@ -552,6 +553,7 @@ export default {
justify-content: center;
align-items: center;
height: 100%;
color: #fff;
text-align: center;
line-height: 100%;
}

130
src/views/modules/visual/heart/index.vue

@ -1,60 +1,75 @@
<template>
<div class="g-cpt">
<div class="m-tb">
<cpt-card>
<div class="title">
<img src="@/assets/img/shuju/title-tip.png" />
<span>公益达人</span>
</div>
<div class="tb">
<cpt-tb
:highlight-top3="true"
:col-list="tb3.colList"
:loading="tb3.loading"
:header="tb3.header"
:list="tb3.list"
></cpt-tb>
</div>
</cpt-card>
<div>
<div class="m-sizer">
<span>时间</span>
<el-date-picker
v-model="monthId"
type="month"
:clearable="false"
prefix-icon="el-icon-caret-bottom"
placeholder="选择日期"
value-format="yyyyMM"
>
</el-date-picker>
</div>
<div class="m-tb">
<cpt-card>
<div class="title">
<img src="@/assets/img/shuju/title-tip.png" />
<span>党员先锋</span>
</div>
<div class="g-cpt">
<div class="m-tb">
<cpt-card>
<div class="title">
<img src="@/assets/img/shuju/title-tip.png" />
<span>公益达人</span>
</div>
<div class="tb">
<cpt-tb
:highlight-top3="true"
:col-list="tb2.colList"
:loading="tb2.loading"
:header="tb2.header"
:list="tb2.list"
></cpt-tb>
</div>
</cpt-card>
</div>
<div class="tb">
<cpt-tb
:highlight-top3="true"
:col-list="tb3.colList"
:loading="tb3.loading"
:header="tb3.header"
:list="tb3.list"
></cpt-tb>
</div>
</cpt-card>
</div>
<div class="m-tb">
<cpt-card>
<div class="title">
<img src="@/assets/img/shuju/title-tip.png" />
<span>党员先锋</span>
</div>
<div class="tb">
<cpt-tb
:highlight-top3="true"
:col-list="tb2.colList"
:loading="tb2.loading"
:header="tb2.header"
:list="tb2.list"
></cpt-tb>
</div>
</cpt-card>
</div>
<div class="m-tb">
<cpt-card>
<div class="title">
<img src="@/assets/img/shuju/title-tip.png" />
<span>动力网格</span>
</div>
<div class="m-tb">
<cpt-card>
<div class="title">
<img src="@/assets/img/shuju/title-tip.png" />
<span>动力网格</span>
</div>
<div class="tb">
<cpt-tb
:highlight-top3="true"
:col-list="tb1.colList"
:loading="tb1.loading"
:header="tb1.header"
:list="tb1.list"
></cpt-tb>
</div>
</cpt-card>
<div class="tb">
<cpt-tb
:highlight-top3="true"
:col-list="tb1.colList"
:loading="tb1.loading"
:header="tb1.header"
:list="tb1.list"
></cpt-tb>
</div>
</cpt-card>
</div>
</div>
</div>
</template>
@ -64,6 +79,7 @@ import { Loading } from "element-ui"; //引入Loading服务
import { requestPost } from "@/js/dai/request";
import cptCard from "@/views/modules/visual/cpts/card";
import cptTb from "@/views/modules/visual/cpts/tb";
import nextTick from "dai-js/tools/nextTick";
export default {
name: "heart",
@ -72,6 +88,8 @@ export default {
agencyId: "",
areaCode: "",
monthId: "",
// /
tb1: {
loading: true,
@ -160,10 +178,15 @@ export default {
cptTb,
},
watch: {},
watch: {
monthId() {
this.getApiData();
},
},
async mounted() {
this.userId = this.uid;
await nextTick(100);
this.getApiData();
},
@ -202,6 +225,7 @@ export default {
let params = {
agencyId,
areaCode,
monthId: this.monthId,
orgType: "agency",
topNum: 50,
};
@ -226,6 +250,7 @@ export default {
let params = {
orgId: agencyId,
areaCode,
monthId: this.monthId,
orgType: "agency",
topNum: 50,
};
@ -255,6 +280,7 @@ export default {
let params = {
orgId: agencyId,
areaCode,
monthId: this.monthId,
orgType: "agency",
topNum: 50,
};

16
src/views/modules/visual/measure/service.vue

@ -278,7 +278,19 @@ export default {
type: 'category',
axisLabel: {
color: '#fff',
interval: 0
interval: 0,
formatter: function(params) {
// const index = params.indexOf('#')
// const newParams = params.slice(0, index)
let newParamsName = params.length > 6 ? params.substring(0, 6) + '...' : params
return newParamsName
}
},
splitLine: {
show: false
},
splitArea: {
show: false
},
axisTick: {
interval: 0
@ -330,7 +342,7 @@ export default {
show: false
},
emphasis: {
focus: 'series'
focus: 'none'
},
data: categoryList.map(n => {
return n.detail[index].serviceDemandTotal

113
src/views/modules/visual/measure/volunteer.vue

@ -74,8 +74,10 @@
<div class="card-map">
<screen-map class="map"
ref="map"
@clickFeature="clickProject"
:showIconLayer="true"></screen-map>
@clickFeature="clickMapVolunteer"
:showIconLayer="true"
:clickType="'popup'"
:isAddOpenlay="true"></screen-map>
</div>
<div class="map-tips">
@ -293,34 +295,34 @@ export default {
if (code === 0) {
console.log('data-ddd', data)
this.vInfo = data
const arr = [{
const arr = [{
name: '党员数量',
value: data.partyTotal,
itemStyle: {
color: 'rgba(26, 178, 255, 1)'
}
}, {
}, {
name: '居民数量',
value: data.resiTotal,
itemStyle: {
color: 'rgba(250, 193, 38, 1)'
}
}]
const arr1 = [{
const arr1 = [{
name: '党员数量',
value: data.partyServiceTotal,
itemStyle: {
color: 'rgba(26, 178, 255, 1)'
}
}, {
}, {
name: '居民数量',
value: data.resiServiceTotal,
temStyle: {
color: 'rgba(250, 193, 38, 1)'
}
}]
this.vPersonal = [ ...arr ]
this.vCount = [ ...arr1 ]
this.vPersonal = [...arr]
this.vCount = [...arr1]
this.vpTotal = data.volunteerTotal
this.vcTotal = data.serviceTotal
this.initCharts(data.volunteerTotal, arr)
@ -438,8 +440,88 @@ export default {
},
//
clickProject (feature) {
async clickMapVolunteer (feature) {
console.log('标注信息', feature.values_.properties)
if (!feature.values_.properties.info.icResiUserId) {
return false
}
const info = feature.values_.properties.info
const url = "/epmetuser/icresiuser/resi-brief/" + info.icResiUserId
// const url = "http://yapi.elinkservice.cn/mock/245/heart/icpartyunit/distribution"
let params = {}
const { data, code, msg } = await requestPost(url, params)
if (code === 0) {
let coordinate = [info.longitude, info.latitude]
data.gridName = data.gridName ? data.gridName : '--'
data.villageName = data.villageName ? data.villageName : '--'
data.icUserName = data.icUserName ? data.icUserName : '--'
data.mobile = data.mobile ? data.mobile : '--'
data.idCard = data.idCard ? data.idCard : '--'
data.birthday = data.birthday ? data.birthday : '--'
data.contacts = data.contacts ? data.contacts : '--'
data.contactsMobile = data.contactsMobile ? data.contactsMobile : '--'
data.isBdhjShow = data.isBdhj ? data.isBdhj === '0' ? '否' : '是' : '--'
data.genderShow = data.gender ? data.gender === '0' ? '女' : '男' : '--'
let categoriesArray = []
for (let key in data.volunteerCategories) {
categoriesArray.push(data.volunteerCategories[key])
}
if (categoriesArray.length > 0) {
data.categories = categoriesArray.join(',')
} else {
data.categories = '--'
}
let showData = `
<div style='font-size:16px; color:#FFFFFF;'>居民信息</div>
<div style='font-size:12px; color:#FFFFFF;margin-top:10px'>所属网格
<span>`+ data.gridName + `</span>
</div>
<div style='font-size:12px; color:#FFFFFF;margin-top:5px'>所属小区
<span>`+ data.villageName + `</span>
</div>
<div style='font-size:12px; color:#FFFFFF;margin-top:5px'>本地户籍
<span>`+ data.isBdhjShow + `</span>
</div>
<div style='font-size:12px; color:#FFFFFF;margin-top:5px'>姓名
<span>`+ data.icUserName + `</span>
</div>
<div style='font-size:12px; color:#FFFFFF;margin-top:5px'>手机
<span>`+ data.mobile + `</span>
</div>
<div style='font-size:12px; color:#FFFFFF;margin-top:5px'>性别
<span>`+ data.genderShow + `</span>
</div>
<div style='font-size:12px; color:#FFFFFF;margin-top:5px'>身份证号
<span>`+ data.idCard + `</span>
</div>
<div style='font-size:12px; color:#FFFFFF;margin-top:5px'>出生日期
<span>`+ data.birthday + `</span>
</div>
<div style='font-size:12px; color:#FFFFFF;margin-top:5px'>联系人
<span>`+ data.contacts + `</span>
</div>
<div style='font-size:12px; color:#FFFFFF;margin-top:5px'>联系人手机
<span>`+ data.contactsMobile + `</span>
</div>
<div style='font-size:12px; color:#FFFFFF;margin-top:5px'>志愿者类别
<span>`+ data.categories + `</span>
</div>
`
// console.log(showData)
this.$refs.map.handleShowPopup(showData, coordinate)
} else {
this.$message.error(msg)
}
},
},
};
@ -566,12 +648,15 @@ export default {
}
.map-tips {
width: 700px;
width: 100%;
display: flex;
// justify-content: start;
// justify-content: center;
align-items: center;
flex-wrap: wrap;
padding-top: 10px;
padding-bottom: 20px;
box-sizing: border-box;
padding: 6px 0 0 100px;
// padding-top: 10px;
// padding-bottom: 10px;
.map-tips-item {
display: flex;
@ -596,7 +681,7 @@ export default {
}
.card-wr-map {
height: calc(100vh - 150px);
// height: calc(100vh - 120px);
text-align: center;
.card-map {

Loading…
Cancel
Save