运营趋势

This commit is contained in:
yanran200730
2023-01-29 10:40:38 +08:00
parent 2193c950d9
commit cfcbef14c5
5 changed files with 328 additions and 211 deletions

View File

@@ -9,6 +9,8 @@ instance.defaults.baseURL = baseURLs[process.env.NODE_ENV]
instance.interceptors.request.use(config => {
if (config.url.startsWith("/node")) {
config.baseURL = "/ns"
} else if (/\/project\/activeAnalysis/.test(location.pathname)) {
config.baseURL = "/analysis"
} else if (/\/project\/beta/.test(location.pathname)) {
config.baseURL = "/wg"
} else if (/\/project\/sass/.test(location.pathname)) {
@@ -27,7 +29,7 @@ instance.interceptors.request.use(config => {
if (["/xsjr", "/omsapi", "/tfx"].includes(config.baseURL)) {
config.url = config.url.replace(/(app|auth|admin|api)\//, "")
}
if (['/qxn'].includes(config.baseURL)) {
if (['/qxn', '/analysis'].includes(config.baseURL)) {
config.url = config.url.replace(/(app|auth|admin)\//, "api/")
}
return config

View File

@@ -13,7 +13,6 @@
export default {
name: 'AppActiveAnalysis',
label: '日活分析',
props: {
instance: Function,
dict: Object

View File

@@ -3,18 +3,23 @@
<template slot="title">
<ai-title title="日活分析" isShowBottomBorder>
<template #rightBtn>
<el-button type="primary" @click="handleSyncData" :loading="isLoading">同步卫健委数据</el-button>
<ai-import
:instance="instance"
:dict="dict"
type="wxuseruselog"
name="成员日活记录"
@success="getData">
<el-button icon="iconfont iconImport" size="small">导入</el-button>
</ai-import>
</template>
</ai-title>
</template>
<template #left>
<div class="addressBook-left">
<div class="addressBook-left__title">
<h2 @click="tabIndex = 0, search.current = 1, getList()" :class="[tabIndex === 0 ? 'tab-active' : '']">
组织架构</h2>
<h2 @click="tabIndex = 1, search.current = 1, getList()" :class="[tabIndex === 1 ? 'tab-active' : '']">标签</h2>
<h2 class="tab-active">组织架构</h2>
</div>
<div class="addressBook-left__list--title" v-if="tabIndex === 0">
<div class="addressBook-left__list--title">
<el-input
size="mini"
placeholder="请输入部门名称"
@@ -23,19 +28,8 @@
suffix-icon="iconfont iconSearch">
</el-input>
</div>
<div class="addressBook-left__list--title" v-if="tabIndex === 1">
<el-input
class="addressBook-left__list--search"
size="mini"
clearable
style="width: 154px;"
placeholder="请输入标签名称"
v-model="tagName"
suffix-icon="iconfont iconSearch">
</el-input>
</div>
<div class="addressBook-left__list--wrapper">
<div class="addressBook-left__list" v-show="tabIndex === 0">
<div class="addressBook-left__list">
<el-tree
:filter-node-method="filterNode"
ref="tree"
@@ -44,72 +38,96 @@
:expand-on-click-node="false"
:data="unitList"
highlight-current
:current-node-key="search.departmentId"
:current-node-key="departmentId"
:default-expanded-keys="defaultExpanded"
:default-checked-keys="defaultChecked"
@current-change="onTreeChange">
</el-tree>
</div>
<div class="addressBook-left__list" v-show="tabIndex === 1">
<div class="addressBook-left__tags">
<div
@click="changeTag(index)"
class="addressBook-left__tags--item"
:class="[currIndex === index ? 'addressBook-left__tags--item-active' : '']"
v-for="(item, index) in tagsList" :key="index">
<span>{{ item.tagname }}</span>
</div>
</div>
</div>
</div>
</div>
</template>
<template slot="content">
<ai-card title="当天数据统计">
<template #right>
<el-date-picker
v-model="today"
value-format="yyyy-MM-dd"
:clearable="false"
type="date"
size="small"
placeholder="请选择开始日期"
@change="getDtInfo">
</el-date-picker>
<el-button type="text" @click="getActiveList(), isShowList = true">查看明细</el-button>
</template>
<template #content>
<div class="chart1" style="width: 100%; height: 300px"></div>
</template>
</ai-card>
<ai-card title="趋势数据统计">
<template #content>
<div class="chart2" style="width: 100%; height: 400px"></div>
</template>
</ai-card>
<ai-card title="活跃统计">
<template #right>
<div class="right-search">
<div>
<span>数据统计日期范围</span>
<el-input-number v-model="x" size="small" @change="getActiveAnalysStatistics" :min="1" label="请输入"></el-input-number>
</div>
<div>
<span>活跃状态天数指标</span>
<el-input-number v-model="y" size="small" @change="getActiveAnalysStatistics" :min="1" label="请输入"></el-input-number>
</div>
</div>
</template>
<template #content>
<ai-table
:tableData="tableData"
:col-configs="colConfigs"
:isShowPagination="false"
@getList="() => {}">
</ai-table>
</template>
</ai-card>
<ai-dialog
:visible.sync="isShow"
width="590px"
title="数据权限设置"
@close="onClose"
@onConfirm="onConfirm">
<el-form ref="form" :model="form" label-width="110px" label-position="right">
<el-form-item label="卡口登记-卡口" prop="kkdjKk">
:visible.sync="isShowList"
width="1090px"
customFooter
title="成员活跃明细">
<ai-search-bar bottomBorder>
<template #left>
<ai-select
v-model="form.kkdjKk"
v-model="search.status"
clearable
multiple
placeholder="请选择卡口"
:selectList="dictList">
placeholder="请选择活跃状态"
:selectList="statusList"
@change="getActiveList">
</ai-select>
</el-form-item>
<el-form-item label="卡口登记-社区" prop="kkdjSq">
<ai-area-get multiple v-model="form.kkdjSq" :root="user.info.areaId" :instance="instance"></ai-area-get>
</el-form-item>
<el-form-item label="核酸检测" prop="hsjc">
<ai-area-get multiple v-model="form.hsjc" :root="user.info.areaId" :instance="instance"></ai-area-get>
</el-form-item>
<el-form-item label="社区管理" prop="sqgl">
<ai-area-get multiple v-model="form.sqgl" :root="user.info.areaId" :instance="instance"></ai-area-get>
</el-form-item>
</el-form>
</template>
</ai-search-bar>
<ai-table
:tableData="activeList"
:col-configs="activeColConfigs"
:total="search.total"
style="margin-top: 16px;"
:current.sync="search.current"
:size.sync="search.size"
@getList="getActiveList">
</ai-table>
<div class="dialog-footer" slot="footer">
<el-button @click="isShowList = false">关闭</el-button>
</div>
</ai-dialog>
</template>
</ai-list>
</template>
<script>
import {mapState} from 'vuex'
import { mapState } from 'vuex'
import * as echarts from 'echarts'
export default {
name: 'List',
@@ -119,48 +137,45 @@
dict: Object
},
data() {
data () {
return {
users: [],
department: [],
btnLoading: false,
search: {
current: 1,
status: '',
size: 10,
title: '',
tagname: '',
name: '',
tagIds: '',
departmentId: ''
total: 0,
current: 1
},
dictList: [],
form: {
fxdj: [],
sqgl: [],
hsjc: [],
kkdjSq: [],
kkdjKk: []
},
isShow: false,
activeList: [],
loading: false,
isShowList: false,
defaultChecked: [],
defaultExpanded: [],
tabIndex: 0,
currIndex: -1,
defaultProps: {
children: 'children',
label: 'name'
},
colConfigs: [
{ prop: 'name', label: '姓名', align: 'left' },
{ prop: 'department', label: '部门', align: 'center' },
{ prop: 'c', label: '活跃天数', align: 'center' }
],
activeColConfigs: [
{ prop: 'name', label: '姓名', align: 'left' },
{ prop: 'department', label: '部门', align: 'center' },
{ prop: 'status', label: '状态', align: 'center' },
{ prop: 'platform', label: '平台', align: 'center' },
{ prop: 'lastUseTime', label: '最后登录时间', align: 'center' },
{ prop: 'ymd', label: '日期', align: 'center' }
],
unitName: '',
unitList: [],
tagsList: [],
tagName: '',
sourceTagList: [],
tableData: [],
tagId: '',
departmentName: '',
departId: '',
id: ''
department: '',
departmentId: '',
today: '',
x: 30,
y: 18,
statusList: []
}
},
@@ -171,116 +186,214 @@
watch: {
unitName(val) {
this.$refs.tree.filter(val)
},
tagName(val) {
if (!val) {
this.tagsList = this.sourceTagList
}
this.tagsList = this.sourceTagList.filter(v => v.tagname.indexOf(val) > -1)
}
},
mounted() {
this.today = this.$moment().format('YYYY-MM-DD')
this.getTree()
this.getList()
this.getTags()
},
methods: {
toSetting (e) {
this.isShow = true
this.id = e.sysUserId
this.form.fxdj = e.fxdj ? e.fxdj.split(',') : []
this.form.sqgl = e.sqgl ? e.sqgl.split(',') : []
this.form.hsjc = e.hsjc ? e.hsjc.split(',') : []
this.form.kkdjSq = e.kkdjSq ? e.kkdjSq.split(',') : []
this.form.kkdjKk =e.kkdjKk ? e.kkdjKk.split(',') : []
},
changeTag(index) {
this.currIndex = index
this.search.current = 1
onTreeChange (e) {
this.department = e.parentName || e.name
this.$nextTick(() => {
this.getList()
this.getData()
})
},
onClose() {
this.id = ''
this.form.fxdj = []
this.form.sqgl = []
this.form.hsjc = []
this.form.kkdjSq = []
this.form.kkdjKk = []
},
onConfirm() {
this.$refs.form.validate((valid) => {
if (valid) {
this.instance.post(`/app/appepidemicpreventiondatarole/empower`, {
fxdj: this.form.fxdj.join(','),
sqgl: this.form.sqgl.join(','),
hsjc: this.form.hsjc.join(','),
kkdjSq: this.form.kkdjSq.join(','),
kkdjKk: this.form.kkdjKk.join(','),
sysUserIds: this.id ? this.id : this.ids,
kkdjKkStr: this.dictList.filter(v => this.form.kkdjKk.includes(v.dictValue)).map(v => v.dictName).join(',')
}).then(res => {
if (res.code == 0) {
this.isShow = false
this.getList()
this.$message.success('保存成功')
}
})
}
})
},
getTags() {
this.instance.post(`/app/wxcp/wxtag/listAll`).then(res => {
if (res.code == 0) {
this.sourceTagList = res.data.length ? JSON.parse(JSON.stringify(res.data)) : []
this.tagsList = res.data
}
})
},
onTreeChange(e) {
this.departmentName = e.name
this.search.departmentId = e.id || ''
this.search.current = 1
this.$nextTick(() => {
this.getList()
})
},
getList() {
this.loading = true
this.instance.post(`/app/appepidemicpreventiondatarole/list`, null, {
getActiveList () {
this.instance.post(`/app/wxuseruselog/active-log-list`, null, {
params: {
...this.search,
departmentId: this.tabIndex === 0 ? this.search.departmentId : '',
tagIds: this.tabIndex === 1 ? (this.currIndex >= 0 ? this.tagsList[this.currIndex].id : '') : '',
listType: this.tabIndex
ymd: this.today,
status: this.search.status ? this.search.status : (!this.search.status && this.statusList.length) ? this.statusList[0] : ''
}
}).then(res => {
if (res.code == 0) {
this.tableData = res.data.records
this.total = res.data.total
this.$nextTick(() => {
this.loading = false
})
} else {
this.loading = false
if (res.code === 0) {
this.activeList = res.data.records
this.search.total = res.data.total
}
})
},
initBarChart (data) {
let chart = echarts.init(document.querySelector('.chart2'))
const x = data.map(v => v.ymd)
const y = data.length ? Object.keys(data[0]).filter(v => v !== 'ymd') : []
let option = {
tooltip: {
trigger: 'axis'
},
legend: {
type: "plain"
},
grid: {
left: '20px',
right: '38px',
bottom: '14px',
top: '30px',
containLabel: true
},
dataZoom: [
{
type: 'inside',
start: 0,
end: 7,
minValueSpan: 7
},
{
start: 0,
end: 7
}
],
color: ['#2266FF', '#22AA99', '#F8B425'],
xAxis: {
type: 'category',
axisLabel: {
align: 'center',
padding: [2, 0, 0, 0],
interval: 0,
fontSize: 14,
color: '#666666'
},
boundaryGap: false,
axisLine: {
lineStyle: {
color: '#E1E5EF'
}
},
data: x
},
yAxis: {
axisTick: {
length: 0,
show: false
},
splitLine: {
show: true,
lineStyle: {
color: ['#E1E5EF'],
width: 1,
type: 'solid'
}
},
nameTextStyle: {
color: '#666666',
align: 'left'
},
axisLine: {
show: false
},
axisLabel: {
color: '#666666'
},
type: 'value'
},
series: y.map(key => {
return {
data: data.map(v => v[key]),
type: 'bar',
name: key,
tooltip: {
valueFormatter: function (value) {
return value
}
}
}
})
}
chart.setOption(option)
},
initPieChart (data) {
let chart = echarts.init(document.querySelector('.chart1'))
const option = {
tooltip: {},
color: ['#2896FF', '#09DBFE', '#61FDB9', '#FFBB69', '#8429FF', '#ea7ccc'],
legend: {
right: '5%',
top: 'center',
orient: 'vertical',
formatter: function(name) {
let data = option.series[0].data
let total = 0
let tarValue = 0
for (let i = 0, l = data.length; i < l; i++) {
total += data[i].value
if (data[i].name == name) {
tarValue = data[i].value
}
}
let p = total === 0 ? 0 : (tarValue / total * 100).toFixed(0)
return name + '' + tarValue + ' ' + p + '%'
}
},
series: [
{
type: 'pie',
radius: '50%',
data: data.map(v => {
return {
value: v.c,
name: v.status
}
}),
label : {
normal : {
formatter: '{b}({d}%)',
textStyle : {
fontWeight : 'normal',
fontSize : 15
}
}
}
}
]
}
chart.setOption(option)
},
getData () {
this.getDtInfo()
this.getActiveAnalysisTrend()
this.getActiveAnalysStatistics()
},
getDtInfo () {
this.instance.post(`/app/wxuseruselog/active-analysis-today?department=${this.department}&ymd=${this.today}`).then(res => {
if (res.code === 0) {
this.initPieChart(res.data)
if (res.data.length) {
this.statusList = res.data.map(v => {
return {
dictName: v.status,
dictValue: v.status
}
})
} else {
this.search.status = ''
this.statusList = []
}
}
})
},
getActiveAnalysStatistics () {
this.instance.post(`/app/wxuseruselog/active-analysis-statistics?department=${this.department}&x=${this.x}&y=${this.y}`).then(res => {
if (res.code === 0) {
this.tableData = res.data
}
})
},
getActiveAnalysisTrend () {
this.instance.post(`/app/wxuseruselog/active-analysis-trend?department=${this.department}`).then(res => {
if (res.code === 0) {
this.initBarChart(res.data)
}
}).catch(() => {
this.loading = false
})
},
@@ -289,15 +402,6 @@
return data.name.indexOf(value) !== -1
},
changeTab(id, index) {
this.currIndex = index
this.search.areaId = id
this.$nextTick(() => {
this.getList()
})
},
getTree() {
this.instance.post(`/app/wxcp/wxdepartment/listAll?unitName=${this.unitName}`).then(res => {
if (res.code === 0) {
@@ -309,14 +413,16 @@
}).filter(e => !e.parentid)[0]
this.defaultExpanded = [parent.id]
this.defaultChecked = [parent.id]
this.search.departmentId = parent.id
this.departmentName = parent.name
this.departmentId = parent.id
this.department = parent.name
this.addChild(parent, res.data)
this.unitList = [parent]
this.$nextTick(() => {
this.$refs.tree.setCurrentKey(parent.id)
})
this.getData()
}
})
},
@@ -325,6 +431,7 @@
for (let i = 0; i < list.length; i++) {
if (list[i].parentid === parent.id) {
list[i].i = parent.children.length
list[i].parentName = `${parent.parentName || parent.name}/${list[i].name}`
parent.children.push(list[i])
}
}
@@ -338,17 +445,6 @@
if (list.length > 0) {
parent['children'].map(v => this.addChild(v, list))
}
},
toAdd(id) {
this.$emit('change', {
type: 'Add',
params: {
id: id || '',
departmentId: this.search.departmentId || '',
departmentName: this.departmentName || ''
}
})
}
}
}
@@ -356,6 +452,26 @@
<style lang="scss" scoped>
.AppActiveAnalysis {
.right-search {
display: flex;
align-items: center;
div {
display: flex;
align-items: center;
}
span {
margin-right: 10px;
font-size: 14px;
color: #686868;
}
div:first-child {
margin-right: 20px;
}
}
:deep( .ai-list__content--right-wrapper ) {
padding: 0!important;
background: transparent!important;
@@ -386,14 +502,6 @@
}
}
.table-avatar {
width: 40px;
height: 40px;
margin-top: 3px;
border-radius: 2px;
border: 1px solid #CCCCCC;
}
.el-button--mini, .el-button--mini.is-round {
height: 28px;
line-height: 28px;

View File

@@ -30,13 +30,13 @@
</template>
</ai-search-bar>
<ai-table
:tableData="tableData"
:col-configs="colConfigs"
:total="total"
style="margin-top: 6px;"
:current.sync="search.current"
:size.sync="search.size"
@getList="getList">
:tableData="tableData"
:col-configs="colConfigs"
:total="total"
style="margin-top: 6px;"
:current.sync="search.current"
:size.sync="search.size"
@getList="getList">
<el-table-column slot="options" width="140px" fixed="right" label="操作" align="center">
<template slot-scope="{ row }">
<div class="table-options">

View File

@@ -64,6 +64,14 @@ module.exports = {
'^/lan': '/'
}
},
'/analysis': {
target: 'http://192.168.1.87:22001',
changeOrigin: true,
pathRewrite: {
//地址重写
'^/analysis': '/'
}
},
'/test': {
target: 'http://192.168.1.105:9000',
changeOrigin: true,