~admin/srs-police-affairs.git

			@@ -20,7 +20,7 @@
			@click="personTabClick(0)"
			>
			<div class="tab-title-small">户籍人口:</div>
			<div class="tab-title-small">164.57万人</div>
			<div class="tab-title-small">{{policeStationPersonInfo.total}}人</div>
			</div>
			<div
			class="tab"
			@@ -28,7 +28,7 @@
			@click="personTabClick(1)"
			>
			<div class="tab-title-small">重点人员:</div>
			<div class="tab-title-small">1人</div>
			<div class="tab-title-small">{{policeStationPersonInfo.emphasisNum}}人</div>
			</div>
			<!-- <div class="tab3" :class="{ 'select-on-tab': tabType == 2 }" @click="personTabClick(2)">
			<div class="num">91995人</div>
			@@ -189,6 +189,7 @@
			<script>
			import { fontSize } from '@/utils/fontSize.js'
			import { getAreaStatisticInfo } from "@/api/home/index.js"
			import { getVillagePersonStatisticInfo, getVillagePersonStatisticInfoByPoliceStationId } from "@/api/dept"

			let homePersonmyChart
			let houseMyChart
			@@ -309,6 +310,8 @@
			villageNum: '',
			areaOptionData: [],
			villageOptionData: [],
			policeStationPersonInfo: {},
			villagePersonStatisticInfoList: [],
			}
			},

			@@ -319,9 +322,8 @@

			mounted () {
			this.initLandEcharts()
			this.initPersonEcharts()
			this.getPoliceStationInfo()
			this.inithouseEcharts()
			this.clickPeopleChart()
			this.clickLandChart()

			this.$nextTick(() => {
			@@ -339,7 +341,19 @@
			initPersonEcharts () {
			var chartDom = document.getElementById('PersonEcharts')
			homePersonmyChart = this.$echarts.init(chartDom)
			homePersonmyChart.setOption(this.initPersonOptions(['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所'], [881, 2211, 6414, 4321, 1232, 881, 2211, 6414, 4321, 1232], ['#06B5D7', '#44C0C1', '#71C8B1']))

			var xDate = [], yDate = []
			//传入x,y轴数据
			this.policeStationPersonInfo.data.forEach(e => {
			xDate.push(e.name.replace('派出', ''))
			yDate.push({
			value: e.num,
			id: e.id,
			type: 'policeStation',
			name: e.name
			})
			})
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, ['#06B5D7', '#44C0C1', '#71C8B1']))
			},

			initPersonOptions (xDate, yDate, colors) {
			@@ -362,7 +376,7 @@
			color: "#fff",
			interval: 0,
			rotate: 45,
			fontSize: fontSize(14)
			fontSize: fontSize(12)
			},
			axisLine: {
			lineStyle: {
			@@ -385,6 +399,10 @@
			data: yDate,
			type: 'bar',
			barWidth: '40%',
			emphasis: {
			disabled: true,
			focus: 'none'
			},
			itemStyle: {
			normal: {
			color: function (params) {
			@@ -433,10 +451,10 @@
			this.initPersonEcharts()
			homePersonmyChart.off('click')
			this.clickPeopleChart()
			xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所']
			yDate = [881, 2211, 6414, 4321, 1232, 881, 2211, 6414, 4321, 1232]
			colors = ['#06B5D7', '#44C0C1', '#71C8B1']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			// xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所']
			// yDate = [881, 2211, 6414, 4321, 1232, 881, 2211, 6414, 4321, 1232]
			// colors = ['#06B5D7', '#44C0C1', '#71C8B1']
			// homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (type == 1) {
			this.peopleTabClick(type)
			}
			@@ -523,7 +541,7 @@
			// show: true,
			// type: 'bar',
			// barGap: '-100%',
			// barWidth: '35%', //统计条宽度
			// barWidth: '35%', //统计条宽度
			// itemStyle: {
			// normal: {
			// color: 'rgba(102, 102, 102,0.5)'
			@@ -651,7 +669,7 @@
			// end: 40,
			// zoomOnMouseWheel: false, // 关闭滚轮缩放
			// moveOnMouseWheel: true, // 开启滚轮平移
			// moveOnMouseMove: true // 鼠标移动能触发数据窗口平移
			// moveOnMouseMove: true // 鼠标移动能触发数据窗口平移
			// }
			// ]
			}
			@@ -691,85 +709,11 @@

			clickPeopleChart () {
			homePersonmyChart.on('click', params => {
			let xDate, yDate, colors
			this.dataDeep = 2
			if (params.name == '车站所') {
			xDate = ['责任区1', '责任区2', '责任区3', '责任区4', '责任区5']
			yDate = [88, 221, 641, 432, 123]
			colors = ['#ccf9d0', '#f9d888', '#f7857e']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '沙溪所') {
			xDate = ['责任区1', '责任区2', '责任区3', '责任区4', '责任区5']
			yDate = [641, 423, 221, 123, 88]
			colors = ['#102129', '#1f3942', '#2a4f5f']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '灵溪所') {
			xDate = ['责任区1', '责任区2', '责任区3', '责任区4', '责任区5']
			yDate = [111, 531, 211, 431, 64]
			colors = ['#23b9e9', '#c76ee0', '#f05265']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '北门所') {
			xDate = ['责任区1', '责任区2', '责任区3', '责任区4', '责任区5']
			yDate = [887, 234, 452, 321, 154]
			colors = ['#b22d2b', '#614976', '#4c3042']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '江光所') {
			xDate = ['责任区1', '责任区2', '责任区3', '责任区4', '责任区5']
			yDate = [400, 500, 200, 450, 245]
			colors = ['#3089bf', '#77d8f9', '#f4fcfe']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '湖北') {
			xDate = ['武汉市', '黄石市', '宜昌市', '鄂州市', '荆门市']
			yDate = [88, 221, 641, 432, 123]
			colors = ['#2b5144', '#5a987f', '#94ebc1']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '上海') {
			xDate = ['黄浦区', '长宁区', '静安区', '虹口区', '闵行区']
			yDate = [641, 423, 221, 123, 88]
			colors = ['#f750c2', '#d6369a', '#bc1f76']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '北京') {
			xDate = ['东城区', '西城区', '海淀区', '昌平区', '大兴区']
			yDate = [111, 531, 211, 431, 64]
			colors = ['#7e81d5', '#86abe6', '#8fe5e3']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '广东') {
			xDate = ['珠海市', '东菀市', '佛山市', '中山市', '惠州市']
			yDate = [887, 234, 452, 321, 154]
			colors = ['#ba1432', '#6b0e33', '#2a0b35']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '浙江') {
			xDate = ['杭州市', '舟山市', '宁波市', '嘉兴市', '绍兴市']
			yDate = [400, 300, 200, 450, 245]
			colors = ['#f12e10', '#f36c15', '#f4a818']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '日本') {
			xDate = ['东京都', '北海道', '大阪府', '京都府', '43县']
			yDate = [88, 221, 641, 432, 123]
			colors = ['#6e978f', '#ad885a', '#e97b27']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '美国') {
			xDate = ['加利福尼亚州', '德克萨斯州', '纽约州', '俄亥俄州']
			yDate = [641, 423, 221, 123, 88]
			colors = ['#d54956', '#9f976e', '#73d781']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '俄罗斯') {
			xDate = ['西北联邦', '中央联邦', '南方联邦', '伏尔加联邦']
			yDate = [111, 531, 211, 431, 64]
			colors = ['#7d65c0', '#a47db4', '#e0a8c5']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '英国') {
			xDate = ['英格兰', '威尔士', '苏格兰', '北爱尔兰']
			yDate = [887, 234, 452, 321, 154]
			colors = ['#584d7b', '#9b836a', '#f8ce52']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			} else if (params.name == '印度') {
			xDate = ['德里', '哈里亚纳邦', '旁遮普邦', '喜马偕尔邦', '北方邦']
			yDate = [400, 300, 200, 450, 245]
			colors = ['#0f97f2', '#7d629d', '#e1344f']
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			if (params.data.type == 'policeStation') {
			this.getVillagePersonStatisticInfoByPoliceStationId(params.data.name, params.data.id)
			} else {
			this.$emit('showpeopledetail', params.name)
			this.$emit('showpeopledetail', params.data.id, params.data.name)
			}
			})
			},
			@@ -923,21 +867,22 @@

			backBegin () {
			this.dataDeep = 1
			let xDate, yDate, colors
			if (this.tabType == 0) {
			xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所']
			yDate = [881, 2211, 6414, 4321, 1232, 881, 2211, 6414, 4321, 1232]
			colors = ['#06B5D7', '#44C0C1', '#71C8B1']
			} else if (this.tabType == 1) {
			xDate = ['湖北', '上海', '北京', '广东', '浙江']
			yDate = [6414, 4231, 2211, 1231, 881]
			colors = ['#ef9faa', '#f7bfc6', '#fedade']
			} else if (this.tabType == 2) {
			xDate = ['日本', '美国', '俄罗斯', '英国', '印度']
			yDate = [881, 1231, 2211, 4321, 6414]
			colors = ['#7d65c0', '#a47db4', '#e0a8c5']
			}
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			this.initPersonEcharts()
			// let xDate, yDate, colors
			// if (this.tabType == 0) {
			// xDate = ['车站所', '沙溪所', '灵溪所', '北门所', '江光所', '水南所', '秦峰所', '茅家岭所', '西市所', '朝阳所']
			// yDate = [881, 2211, 6414, 4321, 1232, 881, 2211, 6414, 4321, 1232]
			// colors = ['#06B5D7', '#44C0C1', '#71C8B1']
			// } else if (this.tabType == 1) {
			// xDate = ['湖北', '上海', '北京', '广东', '浙江']
			// yDate = [6414, 4231, 2211, 1231, 881]
			// colors = ['#ef9faa', '#f7bfc6', '#fedade']
			// } else if (this.tabType == 2) {
			// xDate = ['日本', '美国', '俄罗斯', '英国', '印度']
			// yDate = [881, 1231, 2211, 4321, 6414]
			// colors = ['#7d65c0', '#a47db4', '#e0a8c5']
			// }
			// homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			},

			getKeyPersonCount (arr) {
			@@ -1020,7 +965,36 @@
			})
			},

			//获取各个派出所的人口数量
			getPoliceStationInfo () {
			getVillagePersonStatisticInfo().then(res => {
			if (res.data.code == 200) {
			this.policeStationPersonInfo = res.data.data
			//异步，因此放进接口方法内部
			this.initPersonEcharts()
			this.clickPeopleChart()
			}
			})
			},

			//获取该派出所下的辖区
			getVillagePersonStatisticInfoByPoliceStationId (name, policeStationId) {
			getVillagePersonStatisticInfoByPoliceStationId(name, policeStationId).then(res => {
			if (res.data.code == 200) {
			this.villagePersonStatisticInfoList = res.data.data
			var xDate = [], yDate = [], colors = ['#ccf9d0', '#f9d888', '#f7857e']
			this.villagePersonStatisticInfoList.forEach(e => {
			xDate.push(e.name.replace('居民委员会', ''))
			yDate.push({
			value: e.num,
			name: e.name,
			id: e.id
			})
			})
			homePersonmyChart.setOption(this.initPersonOptions(xDate, yDate, colors), true)
			}
			})
			}



			@@ -1242,4 +1216,4 @@
			stroke-dashoffset: 888;
			}
			}
			</style>
			</style>