Skip to content

S
smart_gov_platform
Commit 73805b72 authored by 王启林's avatar 王启林
Browse files
Options

优化画像图谱+人物分析对接

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