diff --git a/src/assets/boy.png b/src/assets/boy.png new file mode 100644 index 0000000..1ca72f8 Binary files /dev/null and b/src/assets/boy.png differ diff --git a/src/assets/female.png b/src/assets/female.png new file mode 100644 index 0000000..4959eec Binary files /dev/null and b/src/assets/female.png differ diff --git a/src/assets/girl.png b/src/assets/girl.png new file mode 100644 index 0000000..a08736c Binary files /dev/null and b/src/assets/girl.png differ diff --git a/src/assets/grandfather.png b/src/assets/grandfather.png new file mode 100644 index 0000000..b4b474d Binary files /dev/null and b/src/assets/grandfather.png differ diff --git a/src/assets/grandmother.png b/src/assets/grandmother.png new file mode 100644 index 0000000..87669b9 Binary files /dev/null and b/src/assets/grandmother.png differ diff --git a/src/assets/male.png b/src/assets/male.png new file mode 100644 index 0000000..acc8781 Binary files /dev/null and b/src/assets/male.png differ diff --git a/src/views/jsc/components/echartsMap.vue b/src/views/jsc/components/echartsMap.vue index f46c691..5fc4bdb 100644 --- a/src/views/jsc/components/echartsMap.vue +++ b/src/views/jsc/components/echartsMap.vue @@ -12,12 +12,42 @@ mapData: { type: Array, default: [] + }, + streetList:{ + type: Array, + default: [] } }, data() { return { myChart: null, - hookToolTip: {}, + hookToolTip: {}, + streetlist:[], + streetNameList:[{ + name:'开发区', + coord:[119.59,31.77] + },{ + name:'指前镇', + coord:[119.45,31.62] + },{ + name:'尧塘镇', + coord:[119.62,31.69] + },{ + name:'儒林镇', + coord:[119.58,31.61] + },{ + name:'金城镇', + coord:[119.5,31.75] + },{ + name:'薛埠镇', + coord:[119.32,31.77] + },{ + name:'直溪镇', + coord:[119.44,31.84] + },{ + name:'朱林镇', + coord:[119.42,31.72] + }] // mapData:[] } }, @@ -30,13 +60,14 @@ }, watch: { hookToolTip: { - handler(newVal, oldVal) { - let tooltipButton = document.querySelector(".mapsshow" + newVal.data.id) - let that = this - tooltipButton.addEventListener('click', function() { - that.showInfo(newVal.data.id) + handler(newVal, oldVal) { + let name = newVal.name==='尧塘镇'?'西城街道':newVal.name + this.$router.push({ + path: "/record/map", + query: { + street: name + } }) - } }, }, @@ -53,13 +84,35 @@ this.myChart.resize() }, drawChart() { - let that = this - this.mapData.forEach((m, index) => { - if (!m.coord) { - m.coord = ['', ''] - } - }) - // 基于准备好的dom,初始化echarts实例 + let that = this + // console.log("this.mapData",this.mapData) + // this.mapData.forEach((m, index) => { + // if (!m.coord) { + // m.coord = ['', ''] + // } + // }) + let _streetlist = [] + this.streetNameList.map(item=>{ + this.streetList.map(item1=>{ + if(item.name===item1.name){ + _streetlist.push({ + name:item1.name, + value:item1.value, + coord:item.coord + }) + } + if(item1.name==='西城街道' && item.name==='尧塘镇'){ + _streetlist.push({ + name:item1.name, + value:item1.value, + coord:item.coord + }) + } + }) + }) + this.streetlist = _streetlist + // 基于准备好的dom,初始化echarts实例 + console.log("streetList",this.streetList) this.myChart = echarts.init(document.getElementById('chart')) echarts.registerMap('GX', jtmap); // 绘制图表 @@ -72,11 +125,11 @@ triggerOn: 'click', formatter: function(val) { that.hookToolTip = val; - if (!val.data) { - return - } - return '

' + val.data.name + - '

查看详情

' + // if (!val.data) { + // return + // } + // return '

' + val.data.name + + // '

查看详情

' } }, geo: { @@ -199,30 +252,30 @@ ] }, series: [{ - name: "一户一档", type: "map", mapType: "china", geoIndex: 0, markPoint: { - symbol: 'image://' + require('@/assets/logo-mini.png'), // 自定义图片路径 - symbolSize: [50, 40], // 图片大小 - symbolOffset: [0, -30], + // symbol: 'image://' + require('@/assets/logo-mini.png'), // 自定义图片路径 + symbol: '', // 自定义图片路径 + symbolSize: [10, 10], // 图片大小 + symbolOffset: [0, 0], label: { - position: 'bottom', + position: 'center', color: "#fff", textAlign: "center", - padding: [4, 7], - borderWidth: 2, // 图形描边的宽度。 + padding: [5, 10], + borderWidth: 1, // 图形描边的宽度。 borderColor: "#fff", // 边框颜色 backgroundColor: 'green', // 背景色 formatter(val) { - return val.name + return val.data.name+":"+val.data.value+"人" } }, - // coord数组存放地址坐标 - data: this.mapData + // data:this.streetList + data:this.streetlist } }], }) diff --git a/src/views/jsc/components/echartsMap1.vue b/src/views/jsc/components/echartsMap1.vue index 970bf8b..b20c87a 100644 --- a/src/views/jsc/components/echartsMap1.vue +++ b/src/views/jsc/components/echartsMap1.vue @@ -1,49 +1,255 @@ - - - - - diff --git a/src/views/jsc/index.vue b/src/views/jsc/index.vue index 34a8ee7..2dda8e8 100644 --- a/src/views/jsc/index.vue +++ b/src/views/jsc/index.vue @@ -60,7 +60,7 @@
- +
@@ -350,6 +350,10 @@ } } this.mapList = _data + if(_nolng.length==0){ + this.showMap = true + return + } var geocoder = null let that = this AMap.plugin("AMap.Geocoder", function() { diff --git a/src/views/record/map.vue b/src/views/record/map.vue index f0c20d8..aea3b32 100644 --- a/src/views/record/map.vue +++ b/src/views/record/map.vue @@ -64,7 +64,8 @@ makerList: [], infoWindow: null, openData: [], - // markerList: [], + // markerList: [], + ispage:false, mapList: [], fullscreenLoading: false, streetList: [], @@ -112,8 +113,14 @@ this.$nextTick(function() { this.mapInit() }) + if (this.$route.query?.street) { + this.select.street = this.$route.query.street + this.openSearch = true + this.getindex() + }else{ + this.getindex() + } - this.getindex() }, methods: { // openFullScreen() { @@ -289,7 +296,8 @@ }) }, pageChange(e) { - this.select.page = e + this.select.page = e + this.ispage = true this.getindex() }, movetoperson(row, index) { @@ -304,7 +312,10 @@ } }, - async getindex() { + async getindex() { + if(!this.ispage){ + this.select.page = 1 + } this.fullscreenLoading = true; this.mapList = [] // this.map.remove(this.marker) @@ -332,6 +343,7 @@ }], }) this.select.total = res.total + this.ispage = false if(res.data.length<1){ Message({ @@ -369,10 +381,10 @@ // result中对应详细地理坐标信息 k.longitude = result.geocodes[0].location.lng k.latitude = result.geocodes[0].location.lat - save({ - table_name: that.select.table_name, - ...k - }) + // save({ + // table_name: that.select.table_name, + // ...k + // }) } if (index == _nolng.length - 1) { that.mapList.push(..._nolng) diff --git a/src/views/record/personinfo.vue b/src/views/record/personinfo.vue index 200a4ec..86c20de 100644 --- a/src/views/record/personinfo.vue +++ b/src/views/record/personinfo.vue @@ -51,7 +51,32 @@ recordId:"", viewRecordId:"", allTable:[], - formDialoger: [], + formDialoger: [], + imgs:[{ + type:'children', + sex:'男', + url:require('@/assets/boy.png') + },{ + type:'children', + sex:'女', + url:require('@/assets/girl.png') + },{ + type:'adult', + sex:'男', + url:require('@/assets/male.png') + },{ + type:'adult', + sex:'女', + url:require('@/assets/female.png') + },{ + type:'old', + sex:'男', + url:require('@/assets/grandfather.png') + },{ + type:'old', + sex:'女', + url:require('@/assets/grandmother.png') + }], urlList: { fuels: '/book_cars', reforms: '/book_reform', @@ -166,10 +191,26 @@ const res = await show({ id: id, table_name: 'records' + }) + + let age = this.getAge(res.idcard) + let sex = res.sex + let imgType = age<16?'children':(age>60?'old':'adult') + let imgUrl='' + + this.imgs.map(item=>{ + if(sex===item.sex){ + console.log(imgType==item.type,item.url) + if(imgType==item.type){ + imgUrl = item.url + } + + } }) - let names = `
${res.name}
` + let names = `
${res.name}
` let contents = - `

姓名:${res.name}

性别:${res.sex}

联系方式:${res.mobile}

残疾类别:${res.disabilitytype}

残疾等级:${res?.disabilitylevel}

现居住地:${res.reside}

` + `

姓名:${res.name}

性别:${res.sex}

年龄:${age}

联系方式:${res.mobile}

残疾类别:${res.disabilitytype}

残疾等级:${res?.disabilitylevel}

现居住地:${res.reside}

` + let views = '' let workflows = '' this.idcard = res.idcard @@ -265,6 +306,27 @@ const val2 = b[property]; return val1 - val2; } + }, + getAge(iden) { + let val = iden.length; + let myDate = new Date(); + let month = myDate.getMonth() + 1; + let day = myDate.getDate(); + let age = 0; + + if (val === 18) { + age = myDate.getFullYear() - iden.substring(6, 10) - 1; + + if (iden.substring(10, 12) < month || iden.substring(10, 12) == month && iden.substring(12, 14) <= day) age++; + + } + if (val === 15) { + age = myDate.getFullYear() - iden.substring(6, 8) - 1901; + + if (iden.substring(8, 10) < month || iden.substring(8, 10) == month && iden.substring(10, 12) <= day) age++; + } + + return age }, @@ -397,7 +459,13 @@ width: 150px; background: #ddd; border-radius: 100%; - line-height: 150px; - margin: 35px auto; + /* line-height: 150px; */ + margin: 35px auto; + text-align: center; + padding-top: 10px; + } + /deep/ .avue-flow__node-body .persons img{ + display:inline-block; + width:50% }