Commit 9050bcae authored by 赵啸非's avatar 赵啸非

Merge remote-tracking branch 'origin/master'

parents e5ec3eb5 524b4aa8
......@@ -48,3 +48,12 @@ export function ageRate(params) {
export function TopNationStatistic(params) {
return http.get(`${baseURL}/inter/statistic/TopNationStatistic`, params);
}
//用户列表
export function peopelList(params) {
return http.get(`${baseURL}/inter/Personas/peopelList`, params);
}
//用户分析
export function userAnalysis(params) {
return http.get(`${baseURL}/inter/Personas/userAnalysis`, params);
}
<template>
<div>
<div :id="id" :style="{height: this.height+'px', width: this.width+'px'}"></div>
</div>
<div>
<div :id="id" :style="{ height: this.height + 'px', width: this.width + 'px' }"></div>
</div>
</template>
<script >
import * as echarts from 'echarts'
let myChart= null
let myChart = null
export default {
props: {
props: {
id: {
type: String
},
height:{
height: {
type: String | Number,
},
width:{
width: {
type: String | Number,
},
datas: Object
},
data() {
return {
},
data() {
return {
}
},
watch:{
datas: function(obj){
if(obj){
this.pieInit(obj.data)
},
watch: {
datas: function (obj) {
if (obj) {
this.pieInit(obj.data, obj.nameArr)
}
}
},
methods: {
pieInit(data) {
methods: {
pieInit(data, nameArr) {
console.log(data)
let total = 0
data[0].value.forEach(i => {
total += parseInt(i)
})
console.log(total)
let arrType = {
yycount: '在线预约',
qhcount: '现场取号',
pjcount: '评价次数',
comcount: '意见建议',
imcount: '办不成事',
}
let arr = nameArr.map(i => {
return { name: arrType[i], max: total }
})
console.log(arr)
myChart = echarts.init(document.getElementById(this.id))
let option = {
radar: {
// shape: 'circle',
indicator: [
{ name: '在线预约', max: 100 },
{ name: '现场取号', max: 100 },
{ name: '个人申报', max: 100 },
{ name: '评价次数', max: 100 },
{ name: '意见建议', max: 100 },
{ name: '办不成事', max: 100 }
]
indicator: arr
},
series: [
{
......@@ -51,15 +61,14 @@ export default {
data: data
}
]
};
myChart.setOption(option)
// 让图表跟随屏幕自动的去适应
window.addEventListener('resize', function () {
myChart.resize()
})
}
}
};
myChart.setOption(option)
// 让图表跟随屏幕自动的去适应
window.addEventListener('resize', function () {
myChart.resize()
})
}
}
}
</script>
<style lang="less" scoped>
</style>
\ No newline at end of file
<style lang="less" scoped></style>
\ No newline at end of file
<template>
<div class="Container">
<div class="main">
<div class="first_card">
<div class="breadMenu">
<Breadcrumb/>
<div class="main">
<div class="first_card">
<div class="breadMenu">
<Breadcrumb />
</div>
<div class="searchBox">
<a-select show-search placeholder="请输入群众名称搜索" style="width: 35.625rem"
:default-active-first-option="false" :show-arrow="false" :filter-option="false" allowClear
:not-found-content="null" :options="peopleArr" @search="peopelListFn"
@change="handleChange"></a-select>
<!-- <a-input v-model="peopleName" placeholder="请输入群众名称搜索" style="width: 35.625rem"></a-input> -->
<a-button type="primary" class="addclass" v-if="!btnShow" @click="startAnalysis()">开始分析</a-button>
<a-button type="primary" class="addclass" v-else @click="backBase()">返回</a-button>
</div>
</div>
<div class="searchBox">
<a-input v-model="peopleName" placeholder="请输入群众名称搜索" style="width: 35.625rem"></a-input>
<a-button type="primary" class="addclass" @click="startAnalysis()">开始分析</a-button>
<a-button type="primary" class="addclass" v-if="btnShow" @click="backBase()">返回</a-button>
<div class="content_view">
<router-view keep-alive />
</div>
</div>
<div class="content_view">
<router-view />
</div>
</div>
</div>
</template>
<script>
import Breadcrumb from "./breadcrumb/index.vue";
export default {
components:{
<script>
import Breadcrumb from "./breadcrumb/index.vue";
import { peopelList } from '@/api/userPortrait'
export default {
components: {
Breadcrumb
},
data() {
return {
// 搜索框
peopleName: '',
btnShow: false,
}
return {
// 搜索框
peopleId: '',
peopleArr: [],
btnShow: false,
}
},
methods:{
methods: {
//输入框回显
peopelListFn(val) {
this.peopleArr = []
peopelList({ siteid: localStorage.getItem('siteId'), name: val }).then(res => {
if (res.code == 1) {
res.data.forEach(r => {
this.peopleArr.push({
value: r.id,
label: r.idcard_Name + '    ' + r.idcard_IDCardNo,
});
});
}
})
},
handleChange(val) {
this.peopleId = val;
},
startAnalysis() {
this.peopleName= ''
this.$router.push({ path: 'portrayalAnalysis'})
this.btnShow= true
if (this.peopleId) {
this.$router.push({ path: 'portrayalAnalysis', query: { peopleid: this.peopleId } })
this.btnShow = true
} else {
this.$message.warning('请选择群众后搜索')
}
},
backBase() {
this.peopleName= ''
this.$router.push({ path: 'portrayalBase'})
this.btnShow= false
this.peopleArr = []
this.$router.push({ path: 'portrayalBase' })
this.btnShow = false
},
}
}
</script>
}
</script>
<style lang="less" scoped>
@headerH: 4.5rem;
.Container {
<style lang="less" scoped>
@headerH: 4.5rem;
.Container {
height: 100% !important;
// background: #fac;
background: #f5f5f5;
display: flex;
flex-direction: column;
.main {
// background: #afc;
border-radius: 6px;
flex: 1;
overflow-y: auto;
overflow-x: hidden;
// background: #afc;
border-radius: 6px;
flex: 1;
overflow-y: auto;
overflow-x: hidden;
}
&::before {
content: "";
display: block;
width: 100%;
height: @headerH;
background: rgb(59, 135, 255);
background: -moz-linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
background: -webkit-linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
background: linear-gradient(
174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%
);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b87ff",endColorstr="#6c35f7",GradientType=1);
content: "";
display: block;
width: 100%;
height: @headerH;
background: rgb(59, 135, 255);
background: -moz-linear-gradient(174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%);
background: -webkit-linear-gradient(174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%);
background: linear-gradient(174deg,
rgba(59, 135, 255, 1) 24%,
rgba(108, 53, 247, 1) 85%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b87ff", endColorstr="#6c35f7", GradientType=1);
}
/deep/.ant-tabs-nav {
.ant-tabs-tab {
margin: 0 !important;
}
.ant-tabs-tab {
margin: 0 !important;
}
}
/deep/.ant-tabs-tab {
font-size: 14px !important;
& + .ant-tabs-tab {
margin: 0 !important;
margin-left: 0.7rem !important;
}
font-size: 14px !important;
&+.ant-tabs-tab {
margin: 0 !important;
margin-left: 0.7rem !important;
}
}
/deep/.ant-tabs-bar{
/deep/.ant-tabs-bar {
margin: 0;
}
}
.first_card{
}
.first_card {
background: #FFF;
margin-bottom: .9375rem;
}
.breadMenu{
}
.breadMenu {
height: 2.8125rem;
line-height: 2.8125rem;
padding: 0 5rem;
border-bottom: 1px solid rgba(226, 226, 226, 1);
}
.searchBox{
}
.searchBox {
height: 6.25rem;
display: flex;
justify-content: center;
align-items: center;
}
.content_view{
}
.content_view {
padding: 0 5rem;
}
</style>
}
</style>
\ No newline at end of file
......@@ -10,63 +10,67 @@
<a-col :span="8">
<div class="inside_card">
<div class="head_title mb_15">用户信息</div>
<a-form layout="horizontal" :model="formState" :label-col="{span: 4}" :wrapper-col="{span: 20}">
<a-form-item label="openID:">{{ formState.openId }}</a-form-item>
<a-form-item label="微信昵称:">{{ formState.name }}</a-form-item>
<a-form-item label="城市:">{{ formState.city }}</a-form-item>
<a-form-item label="联系电话:">{{ formState.phone }}</a-form-item>
<a-form-item label="身份证号:">{{ formState.ID }}</a-form-item>
<a-form-item label="注册时间:">{{ formState.registerTime }}</a-form-item>
<a-form-item label="注册来源:">{{ formState.source }}</a-form-item>
<a-form-item label="户籍地址:">{{ formState.address }}</a-form-item>
<a-form layout="horizontal" :model="formState" :label-col="{ span: 4 }" :wrapper-col="{ span: 20 }">
<a-form-item label="openID:">{{ formState.openid || '--' }}</a-form-item>
<a-form-item label="姓名:">{{ formState.idcard_Name || '--' }}</a-form-item>
<a-form-item label="城市:">{{ formState.city || '--' }}</a-form-item>
<a-form-item label="联系电话:">{{ formState.phone || '--' }}</a-form-item>
<a-form-item label="身份证号:">{{ formState.idcard_IDCardNo || '--' }}</a-form-item>
<a-form-item label="注册时间:">{{ formState.update_time || '--' }}</a-form-item>
<a-form-item label="注册来源:">{{ regType[formState.register_type] || '--' }}</a-form-item>
<a-form-item label="户籍地址:">{{ formState.idcard_Address || '--' }}</a-form-item>
</a-form>
</div>
<div class="inside_card">
<div class="head_title mb_15">关键数据</div>
<a-form layout="horizontal" :model="formState" :label-col="{span: 4}" :wrapper-col="{span: 20}">
<a-form-item label="预约最多:">{{ formState.appointment.name }}({{ formState.appointment.value }})</a-form-item>
<a-form-item label="取号最多:">{{ formState.appointment.name }}({{ formState.appointment.value }})</a-form-item>
<a-form-item label="申报最多:">{{ formState.appointment.name }}({{ formState.appointment.value }})</a-form-item>
<a-form-item label="小程序最多:">{{ formState.appointment.name }}({{ formState.appointment.value }})</a-form-item>
<a-form layout="horizontal" :model="formState" :label-col="{ span: 4 }" :wrapper-col="{ span: 20 }">
<a-form-item label="预约最多:" v-if="formState.yymax">{{ formState.yymax ? formState.yymax.name : ''
}}<span style="color: #FF5F5F;">({{ formState.yymax ? formState.yymax.count :
'' }})</span></a-form-item>
<a-form-item label="取号最多:" v-if="formState.qhmax">{{ formState.qhmax ? formState.qhmax.name : ''
}} <span style="color: #FF5F5F;">({{ formState.qhmax ? formState.qhmax.count : '' }})</span>
</a-form-item>
<!-- <a-form-item label="申报最多:">{{ formState.appointment.name }}({{ formState.appointment.value
}})</a-form-item>
<a-form-item label="小程序最多:">{{ formState.appointment.name }}({{ formState.appointment.value
}})</a-form-item> -->
</a-form>
<div class="evaluate_box">
<div class="evaluate_box" v-if="formState.pjdata">
<div class="good_box">
<div class="good_title">{{ formState.good.value }}({{ formState.good.percent }}%)</div>
<div class="good_title">{{ formState.pjdata.good_count }}({{ formState.pjdata.good_lv }}%)
</div>
<div class="good_desc">好评次数</div>
</div>
<div class="bad_box">
<div class="bad_title">{{ formState.bad.value }}({{ formState.bad.percent }}%)</div>
<div class="bad_title">{{ formState.pjdata.bad_count }}({{ formState.pjdata.bad_lv }}%)
</div>
<div class="bad_desc">差评次数</div>
</div>
</div>
</div>
</a-col>
<a-col :span="8" class="f_center">
<img src="http://sy.scsmile.cn/YX-4.0/03-02YHHXTP/images/%E7%BE%A4%E4%BC%97%E5%88%86%E6%9E%90/u1433.png" alt="" style="height: 31.25rem">
<img src="@/assets/images/man.png" alt="" style="height: 31.25rem" v-if="formState.idcard_Sex == '男'">
<img src="@/assets/images/woman.png" alt="" style="height: 31.25rem" v-else>
<div class="information">
<div class="info_name">
神奇小伙<a-tag color="green" class="info_tag">实名认证</a-tag>
{{ formState.idcard_Name }}<a-tag color="green" class="info_tag">实名认证</a-tag>
</div>
<a-row>
<a-col :span="8">年龄:18</a-col>
<a-col :span="8">性别:未知</a-col>
<a-col :span="8">民族:氪族</a-col>
<a-col :span="8">年龄:{{ formState.idcard_Name }}</a-col>
<a-col :span="8">性别:{{ formState.idcard_Sex || '--' }}</a-col>
<a-col :span="8">民族:{{ formState.idcard_Nation }}</a-col>
</a-row>
<div>点击查看区块链信息</div>
<div> </div>
</div>
</a-col>
<a-col :span="8">
<div class="inside_card">
<Radar
:id="`radar`"
:height="350"
:width="500"
:datas="radarData"
/>
<Radar :id="`radar`" :height="350" :width="500" :datas="radarData" />
</div>
<div>
</div>
</a-col>
</a-row>
......@@ -76,168 +80,212 @@
<script >
import Radar from "../../business/Component/radar/index.vue";
export default {
components: {
Radar
},
data(){
return{
options:[
{
value: '0',
label: '今天',
},
{
value: '1',
label: '近7日',
},
{
value: '2',
label: '近30日',
},
{
value: '3',
label: '近3个月',
},
{
value: '4',
label: '本年度',
},
],
radarData: {},
useNumber: '0',
formState: {
openId: '4568782121245',
name: '张张那个张',
city: '四川省成都市',
phone: '13088088888',
ID: '513822199302034567',
registerTime: '2023-03-01 10:00:00',
source: '排队叫号系统',
address: '四川省宜宾市叙州区林南路23号',
appointment: {name: '机动车违章业务办理', value: '25'},
good: {value: '36', percent: '20'},
bad: {value: '2', percent: '10'}
}
import { userAnalysis } from "@/api/userPortrait"
export default {
components: {
Radar
},
data() {
return {
options: [
{
value: '0',
label: '今天',
},
{
value: '1',
label: '近7日',
},
{
value: '2',
label: '近30日',
},
{
value: '3',
label: '近3个月',
},
{
value: '4',
label: '本年度',
},
],
radarData: {},
useNumber: '0',
formState: {
openId: '4568782121245',
name: '张张那个张',
city: '四川省成都市',
phone: '13088088888',
ID: '513822199302034567',
registerTime: '2023-03-01 10:00:00',
source: '排队叫号系统',
address: '四川省宜宾市叙州区林南路23号',
appointment: { name: '机动车违章业务办理', value: '25' },
good: { value: '36', percent: '20' },
bad: { value: '2', percent: '10' }
},
regType: {
Applets: '小程序',
wechat: '公众号',
app: '自助服务终端'
}
},
mounted(){
this.getRadarData()
},
methods: {
handleChange() {},
getRadarData() {
this.radarData= {
}
},
mounted() {
this.getRadarData()
this.userAnalysisFn(this.$route.query.peopleid)
},
methods: {
async userAnalysisFn(peopleid) {
let res = await userAnalysis({ siteid: localStorage.getItem('siteId'), peopleid })
// console.log(res)
if (res.code == 1) {
this.formState = res.data
// console.log(this.formState.xwph)
let arr = Object.values(this.formState.xwph)
let nameArr = Object.keys(this.formState.xwph)
// console.log(arr, nameArr)
// console.log(arr)
this.radarData = {
nameArr,
data: [
{
value: [42, 30, 20, 35, 50, 18],
value: arr,
name: '偏好',
areaStyle: {
color: '#a6c5fc'
}
},
]
],
}
} else {
this.$message.error('查询失败')
this.$router.push({ path: 'portrayalBase' })
}
},
}
handleChange() { },
getRadarData() {
}
},
}
</script>
<style lang="less" scoped>
/deep/ .ant-form-item{
/deep/ .ant-form-item {
margin-bottom: 0
}
.head{
.head {
display: flex;
justify-content: flex-start;
align-items: center;
align-items: center;
}
.head_title{
.head_title {
font-weight: 700;
font-style: normal;
font-size: 1.125rem;
color: #0595FD;
margin-right: 1.25rem;
}
.head_desc{
.head_desc {
font-weight: 400;
font-style: normal;
font-size: 14px;
color: #888888;
}
.inside_card{
.inside_card {
background: #f3faff;
margin: .9375rem;
padding: .9375rem;
}
.evaluate_box{
.evaluate_box {
display: flex;
justify-content: space-around;
align-items: center;
align-items: center;
margin-top: 1.25rem;
}
.good_box{
.good_box {
width: 10rem;
background: #d0f3ee;
text-align: center;
padding: .9375rem;
.good_title{
.good_title {
font-size: 1.25rem;
font-weight: 400;
font-style: normal;
color: #04CA8F;
margin-bottom: .625rem;
}
.good_desc{
.good_desc {
font-size: .875rem;
font-weight: 400;
font-style: normal;
color: #04CA8F;
}
}
.bad_box{
.bad_box {
width: 10rem;
background: #f5e3e7;
text-align: center;
padding: .9375rem;
.bad_title{
.bad_title {
font-size: 1.25rem;
font-weight: 400;
font-style: normal;
color: #FF5F5F;
margin-bottom: .625rem;
}
.bad_desc{
.bad_desc {
font-size: .875rem;
font-weight: 400;
font-style: normal;
color: #FF5F5F;
}
}
.information{
.information {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: space-around;
height: 200px;
flex-direction: column;
flex-wrap: nowrap;
justify-content: space-around;
height: 200px;
}
.info_name{
.info_name {
position: relative;
font-size: 2.5rem;
}
.info_tag{
.info_tag {
position: absolute;
top: .9375rem;
margin-left: .9375rem;
}
.mb_15{
.mb_15 {
margin-bottom: .9375rem;
}
.f_40{
.f_40 {
font-size: 2.5rem;
}
.f_center{
.f_center {
text-align: center;
}
</style>
\ No newline at end of file
......@@ -11,7 +11,7 @@
<a-col :span="4">
<div class="f_40 f_center warning">{{ massCount }}</div>
<div class="f_center">群众注册总量</div>
<div class="f_center primary" @click="toTable">点击查看报表</div>
<!-- <div class="f_center primary" @click="toTable">点击查看报表</div> -->
</a-col>
<a-col :span="20">
<lineChart :id="`one_line`" :title="`近30日注册情况分析`" :datas="oneLineData" :height="200" :width="1420" />
......@@ -106,7 +106,7 @@ import mapChart from "../../business/Component/map/index.vue"
import moment from "moment"
import {
peopleQs, registerProvince, registerBwd, registerSex, registerAge, registerNation, provinceCase, bwdStatistic,
provinceStatistic, genderRateType, ageRate, TopNationStatistic
provinceStatistic, genderRateType, ageRate, TopNationStatistic,
} from "@/api/userPortrait.js"
export default {
components: {
......@@ -235,11 +235,13 @@ export default {
massCount: '0',//群众总量
timeArr: [],//群众注册时间
doTotal: 0
doTotal: 0,
}
},
created() {
},
mounted() {
this.getPeopleQs()
this.getRegisterProvince()
this.getRegisterBwd()
......@@ -253,290 +255,259 @@ export default {
this.getGenderRateType()
this.getAgeRate()
this.getTopNationStatistic()
},
mounted() {
this.nowDate = moment(new Date()).format('YYYY-MM-DD h:mm:ss')
},
methods: {
handleChange() { },
toTable() {
this.$router.push({ path: 'register' })
},
//整体情况
getPeopleQs() {
peopleQs({ siteid: localStorage.getItem('siteId') }).then(res => {
if (res.code == 1 && res.data) {
this.massCount = res.data.count
let time = res.data.list.map(i => { //循环获取时间
return moment(i.datetime).format('MM-DD')
})
let take = []
res.data.list.forEach(i => { //循环获取排号机注册情况
i.row.forEach(j => {
if (j.register_type == 'take') {
return take.push(j.count)
}
})
})
let app = []
res.data.list.forEach(i => { //循环获取自助终端注册情况
i.row.forEach(j => {
if (j.register_type == 'app') {
return app.push(j.count)
}
})
})
let Applets = []
res.data.list.forEach(i => { //循环获取微官网注册情况
i.row.forEach(j => {
if (j.register_type == 'Applets') {
return Applets.push(j.count)
}
})
async getPeopleQs() {
let res = await peopleQs({ siteid: localStorage.getItem('siteId') })
if (res.code == 1) {
this.massCount = res.data.count
let time = res.data.list?.map(i => { //循环获取时间
return moment(i.datetime).format('MM-DD')
})
let take = []
let app = []
let Applets = []
res.data.list?.forEach(i => {
i.row.forEach(j => {
if (j.register_type == 'take') {//循环获取排号机注册情况
return take.push(j.count)
}
if (j.register_type == 'app') {//循环获取自助终端注册情况
return app.push(j.count)
}
if (j.register_type == 'Applets') {//循环获取微官网注册情况
return Applets.push(j.count)
}
})
this.oneLineData = {
title: '近30日注册情况分析:',
legend: ['自助服务系统注册人数', '微官网注册人数', '排队系统注册人数'],
xData: time,
dataList: [
{ name: '自助服务系统注册人数', data: app },
{ name: '微官网注册人数', data: Applets },
{ name: '排队系统注册人数', data: take },
]
}
})
this.oneLineData = {
title: '近30日注册情况分析:',
legend: ['自助服务系统注册人数', '微官网注册人数', '排队系统注册人数'],
xData: time,
dataList: [
{ name: '自助服务系统注册人数', data: app },
{ name: '微官网注册人数', data: Applets },
{ name: '排队系统注册人数', data: take },
]
}
})
}
},
//区域注册情况
getRegisterProvince() {
registerProvince({ siteid: localStorage.getItem('siteId') }).then(res => {
let arr2 = res.data.sort(function (a, b) {
return b.count - a.count;
})
let arr = arr2.map((i, j) => {
i.id = j + 1
i.name = i.province
i.value = i.count
return i
})
// console.log(arr)
this.oneMapData = {
title: "注册用户地域分析",
data: arr
}
this.provinces = arr
this.onePieData = {
title: '',
type: 'scroll',
legend: arr.forEach(i => { return i.province }),
data: arr
}
async getRegisterProvince() {
let res = await registerProvince({ siteid: localStorage.getItem('siteId') })
let arr2 = res.data.sort(function (a, b) {
return b.count - a.count;
})
},
//注册分布情况
getRegisterBwd() {
registerBwd({ siteid: localStorage.getItem('siteId') }).then(res => {
this.twoPieData = {
title: '本地人与外地人注册分布',
pieName: '分布详情',
firstName: '宜宾市本地人注册占比',
firstVal: res.data.bd_lv,
firstTotal: 1,
secondName: '外地人注册占比',
secondVal: res.data.wd_lv,
secondTotal: 1,
}
let arr = arr2.map((i, j) => {
i.id = j + 1
i.name = i.province
i.value = i.count
return i
})
// console.log(arr)
this.oneMapData = {
title: "注册用户地域分析",
data: arr
}
this.provinces = arr
this.onePieData = {
title: '',
type: 'scroll',
legend: arr.forEach(i => { return i.province }),
data: arr
}
},
//注册性别分布情况
getRegisterSex() {
registerSex({ siteid: localStorage.getItem('siteId') }).then(res => {
// console.log(res)
if (res.data) {
let man = res.data[0].row
let woman = res.data[1].row
this.oneBarData = {
title: '性别分布',
xData: ['', ''],
data: [
{ name: '自助服务系统注册人数', type: 'bar', data: [man[1].count, woman[1].count] },
{ name: '微官网注册人数', type: 'bar', data: [man[2].count, woman[2].count] },
{ name: '排队系统注册人数', type: 'bar', data: [man[0].count, woman[0].count] },
]
}
}
//注册分布情况
async getRegisterBwd() {
let res = await registerBwd({ siteid: localStorage.getItem('siteId') })
this.twoPieData = {
title: '本地人与外地人注册分布',
pieName: '分布详情',
firstName: '宜宾市本地人注册占比',
firstVal: res.data.bd_lv,
firstTotal: 1,
secondName: '外地人注册占比',
secondVal: res.data.wd_lv,
secondTotal: 1,
}
})
},
//注册年龄分布情况
getRegisterAge() {
registerAge({ siteid: localStorage.getItem('siteId') }).then(res => {
// console.log(res)
let age_area = res.data.map(i => {
return i.age_area
})
let total = 0
let count = res.data.map(i => {
total += i.nums
return i.nums
})
// console.log(total)
let zb = count.map(i => {
return parseFloat((i / total * 10000).toFixed(2))
})
// console.log(zb)
this.twoBarData = {
title: '年龄分布',
xData: age_area,
//注册性别分布情况
async getRegisterSex() {
let res = await registerSex({ siteid: localStorage.getItem('siteId') })
// console.log(res)
if (res.data ? res.data.length > 0 : '') {
let man = res.data[0].row
let woman = res.data[1].row
this.oneBarData = {
title: '性别分布',
xData: ['', ''],
data: [
{ name: '办理次数', type: 'bar', data: count },
{ name: '占比', type: 'line', data: zb },
{ name: '自助服务系统注册人数', type: 'bar', data: [man[1].count, woman[1].count] },
{ name: '微官网注册人数', type: 'bar', data: [man[2].count, woman[2].count] },
{ name: '排队系统注册人数', type: 'bar', data: [man[0].count, woman[0].count] },
]
}
}
},
//注册年龄分布情况
async getRegisterAge() {
let res = await registerAge({ siteid: localStorage.getItem('siteId') })
// console.log(res)
let age_area = res.data.map(i => {
return i.age_area
})
let total = 0
let count = res.data.map(i => {
total += i.nums
return i.nums
})
// console.log(total)
let zb = count.map(i => {
return parseFloat((i / total * 10000).toFixed(2))
})
// console.log(zb)
this.twoBarData = {
title: '年龄分布',
xData: age_area,
data: [
{ name: '办理次数', type: 'bar', data: count },
{ name: '占比', type: 'line', data: zb },
]
}
},
//注册民族分布情况
getRegisterNation() {
registerNation({ siteid: localStorage.getItem('siteId') }).then(res => {
// console.log(res)
res.data.forEach(i => {
i.name = i.idcard_Nation
i.value = i.count
})
// console.log(res.data)
this.threePieData = {
title: '民族分布',
type: '',
legend: res.data,
data: res.data
}
async getRegisterNation() {
let res = await registerNation({ siteid: localStorage.getItem('siteId') })
// console.log(res)
res.data.forEach(i => {
i.name = i.idcard_Nation
i.value = i.count
})
// console.log(res.data)
this.threePieData = {
title: '民族分布',
type: '',
legend: res.data,
data: res.data
}
},
//办件用户地域分析
getProvinceCase() {
provinceCase({ siteid: localStorage.getItem('siteId'), selected: 2 }).then(res => {
// console.log(res)
let arr2 = res.data.sort(function (a, b) {
return b.nums - a.nums;
})
let arr = arr2.map((i, j) => {
i.id = j + 1
i.province = i.name
i.value = i.nums
this.doTotal += i.nums
return i
})
arr.forEach(i => {
i.nums_val = i.nums / this.doTotal
})
// console.log(arr)
this.oneMapData2 = {
title: "办件用户地域分析",
data: arr
}
this.provinces2 = arr
// this.onePieData2 = {
// title: '',
// type: 'scroll',
// legend: arr.forEach(i => { return i.province }),
// data: arr
// }
async getProvinceCase() {
let res = await provinceCase({ siteid: localStorage.getItem('siteId'), selected: 2 })
// console.log(res)
let arr2 = res.data.sort(function (a, b) {
return b.nums - a.nums;
})
let arr = arr2.map((i, j) => {
i.id = j + 1
i.province = i.name
i.value = i.nums
this.doTotal += i.nums
return i
})
arr.forEach(i => {
i.nums_val = i.nums / this.doTotal
})
// console.log(arr)
this.oneMapData2 = {
title: "办件用户地域分析",
data: arr
}
this.provinces2 = arr
},
//办件用户地域分析
getProvinceStatistic() {
provinceStatistic({ siteid: localStorage.getItem('siteId'), selected: 2, province: '四川省' }).then(res => {
// console.log(res)
res.data.forEach(i => {
i.value = i.count
})
this.onePieData2 = {
title: '',
type: 'scroll',
legend: res.data,
data: res.data
}
async getProvinceStatistic() {
let res = await provinceStatistic({ siteid: localStorage.getItem('siteId'), selected: 2, province: '四川省' })
// console.log(res)
res.data.forEach(i => {
i.value = i.count
})
this.onePieData2 = {
title: '',
type: 'scroll',
legend: res.data,
data: res.data
}
},
//本外地分析
getBwdStatistic() {
bwdStatistic({ siteid: localStorage.getItem('siteId'), selected: 2 }).then(res => {
// console.log(res)
this.twoPieData2 = {
title: '本地人与外地人办件分布',
pieName: '分布详情',
firstName: '宜宾市本地人办件占比',
firstVal: res.data.bd_lv,
firstTotal: 1,
secondName: '外地人办件占比',
secondVal: res.data.wd_lv,
secondTotal: 1,
}
})
async getBwdStatistic() {
let res = await bwdStatistic({ siteid: localStorage.getItem('siteId'), selected: 2 })
// console.log(res)
this.twoPieData2 = {
title: '本地人与外地人办件分布',
pieName: '分布详情',
firstName: '宜宾市本地人办件占比',
firstVal: res.data.bd_lv,
firstTotal: 1,
secondName: '外地人办件占比',
secondVal: res.data.wd_lv,
secondTotal: 1,
}
},
//性别办件分析
getGenderRateType() {
genderRateType({ siteid: localStorage.getItem('siteId'), selected: 2 }).then(res => {
if (res.data) {
let man = res.data[0].row
let woman = res.data[1].row
this.oneBarData2 = {
title: '性别分布',
xData: ['', ''],
data: [
{ name: '自助服务系统注册人数', type: 'bar', data: [man[1].nums, woman[1].nums] },
{ name: '微官网注册人数', type: 'bar', data: [man[2].nums, woman[2].nums] },
{ name: '排队系统注册人数', type: 'bar', data: [man[0].nums, woman[0].nums] },
]
}
}
})
},
//办件年龄分析
getAgeRate() {
ageRate({ siteid: localStorage.getItem('siteId'), selected: 2 }).then(res => {
// console.log(res)
// console.log(res)
let age_area = res.data.list.map(i => {
return i.age_area
})
let total = 0
let count = res.data.list.map(i => {
total += i.nums
return i.nums
})
// console.log(total)
let zb = count.map(i => {
return parseFloat((i / total * 10000).toFixed(2))
})
// console.log(zb)
this.twoBarData2 = {
title: '年龄分布',
xData: age_area,
async getGenderRateType() {
let res = await genderRateType({ siteid: localStorage.getItem('siteId'), selected: 2 })
if (res.data ? res.data.length > 0 : '') {
let man = res.data[0].row
let woman = res.data[1].row
this.oneBarData2 = {
title: '性别分布',
xData: ['', ''],
data: [
{ name: '办理次数', type: 'bar', data: count },
{ name: '占比', type: 'line', data: zb },
{ name: '自助服务系统注册人数', type: 'bar', data: [man[1].nums, woman[1].nums] },
{ name: '微官网注册人数', type: 'bar', data: [man[2].nums, woman[2].nums] },
{ name: '排队系统注册人数', type: 'bar', data: [man[0].nums, woman[0].nums] },
]
}
}
},
//办件年龄分析
async getAgeRate() {
let res = await ageRate({ siteid: localStorage.getItem('siteId'), selected: 2 })
// console.log(res)
// console.log(res)
let age_area = res.data.list.map(i => {
return i.age_area
})
let total = 0
let count = res.data.list.map(i => {
total += i.nums
return i.nums
})
// console.log(total)
let zb = count.map(i => {
return parseFloat((i / total * 10000).toFixed(2))
})
// console.log(zb)
this.twoBarData2 = {
title: '年龄分布',
xData: age_area,
data: [
{ name: '办理次数', type: 'bar', data: count },
{ name: '占比', type: 'line', data: zb },
]
}
},
getTopNationStatistic() {
TopNationStatistic({ siteid: localStorage.getItem('siteId'), selected: 2 }).then(res => {
console.log(res)
res.data.forEach(i => {
i.name = i.idcard_Nation
i.value = i.count
})
// console.log(res.data)
this.threePieData2 = {
title: '民族分布',
type: '',
legend: res.data,
data: res.data
}
async getTopNationStatistic() {
let res = await TopNationStatistic({ siteid: localStorage.getItem('siteId'), selected: 2 })
// console.log(res)
res.data.forEach(i => {
i.name = i.idcard_Nation
i.value = i.count
})
// console.log(res.data)
this.threePieData2 = {
title: '民族分布',
type: '',
legend: res.data,
data: res.data
}
},
}
}
......
<template>
<div class="station">
<div class="title">
<h3>以客户为中心,以奋斗者为本,永远坚持艰苦奋斗</h3>
<p>“互联网+政务服务”整体解决方案提供商和服务商</p>
<!-- <h3>以客户为中心,以奋斗者为本,永远坚持艰苦奋斗</h3>
<p>“互联网+政务服务”整体解决方案提供商和服务商</p> -->
</div>
<div class="classification">
<div class="modules">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment