Skip to content

S
smart_gov_platform
Commit 42350a72 authored by 姬鋆屾's avatar 姬鋆屾
Browse files
Options

tui

parent d48cf76e
Show whitespace changes
Inline Side-by-side
Showing with 264 additions and 239 deletions
portal-manager-ui/admin/src/views/dataActuary/behaviour/pageanalyse/pageAnalyse.vue
View file @ 42350a72
<template>
<!-- 页面分析 -->
<div class="page">
<a-form-model :model="queryform" :label-col="labelCol" :wrapper-col="wrapperCol" layout="inline">
<a-form-model
:model="queryform"
:label-col="labelCol"
:wrapper-col="wrapperCol"
layout="inline"
>
<a-form-model-item>
<a-select v-model="queryform.productId" style="width: 200px" placeholder="选择产品">
<a-select-option :value="item.id" v-for="(item,index) in product" :key="index">
{{item.title}}
<a-select
v-model="queryform.productId"
style="width: 200px"
placeholder="选择产品"
>
<a-select-option
:value="item.id"
v-for="(item, index) in product"
:key="index"
>
{{ item.title }}
</a-select-option>
</a-select>
</a-form-model-item>
<a-form-model-item>
<a-range-picker valueFormat="yyyy-MM-DD" v-model="time" style="width: 300px" :allowClear="false"/>
<a-range-picker
valueFormat="yyyy-MM-DD"
v-model="time"
style="width: 300px"
:allowClear="false"
/>
</a-form-model-item>
<a-form-model-item>
<a-button type="primary" class="addclass" @click="getData">
......@@ -23,11 +41,11 @@
<div>页面访问指标趋势</div>
<div class="txt-dv">
<div>
<div class="num">{{data ? data.accessSum : 0}}</div>
<div class="num">{{ data ? data.accessSum : 0 }}</div>
<div>页面累计访问次数</div>
</div>
<div>
<div class="num">{{data ? data.dayAccessAvg : 0}}</div>
<div class="num">{{ data ? data.dayAccessAvg : 0 }}</div>
<div>日均访问次数</div>
</div>
</div>
......@@ -37,11 +55,11 @@
<div class="page-box">
<div class="page-dv">
<div>人均访问深度</div>
<div class="page-num">{{data ? data.depthAvg : 0}}页</div>
<div class="page-num">{{ data ? data.depthAvg : 0 }}页</div>
</div>
<div class="page-dv">
<div>次均访问深度</div>
<div class="page-num">{{data ? data.singleDepth : 0}}页</div>
<div class="page-num">{{ data ? data.singleDepth : 0 }}页</div>
</div>
</div>
<div class="chatrs-dv">
......@@ -54,139 +72,146 @@
</template>
<script>
import product from "../mixins/product"
import * as echarts from 'echarts'
import {getAccessAnalyse} from '@/api/dataActuary.js'
import moment from 'moment';
export default {
mixins:[product],
import product from "../mixins/product";
import * as echarts from "echarts";
import { getAccessAnalyse } from "@/api/dataActuary.js";
import moment from "moment";
export default {
mixins: [product],
data() {
return {
queryform: {
productId: 1,
dateTimeStart:moment().format('yyyy-MM-DD'),
dateTimeEnd:moment().format('yyyy-MM-DD')
dateTimeStart: moment().format("yyyy-MM-DD"),
dateTimeEnd: moment().format("yyyy-MM-DD"),
},
time:[moment().format('yyyy-MM-DD'),moment().format('yyyy-MM-DD')],
product:[{
title:'排队机',
id:1
}],
time: [moment().format("yyyy-MM-DD"), moment().format("yyyy-MM-DD")],
product: [
{
title: "排队机",
id: 1,
},
],
labelCol: {
span: 1
span: 1,
},
wrapperCol: {
span: 14
span: 14,
},
data:null
}
data: null,
};
},
mounted() {
this.getData()
this.getData();
},
methods: {
getData() {
this.queryform.dateTimeStart = this.time ? this.time[0] : null
this.queryform.dateTimeStart = this.time ? this.time[1] : null
getAccessAnalyse(this.queryform).then(res=>{
this.data = res.data
let lineX = res.data.accessTrend.map(item=>item.accessDay)
let lineY = res.data.accessTrend.map(item=>item.accessCount)
let barX = res.data.pageAccessTop.map(item=>item.accessCount)
let barY = res.data.pageAccessTop.map(item=>item.pageName)
this.initLine(lineX,lineY)
this.initBar(barX,barY)
})
this.queryform.dateTimeStart = this.time ? this.time[0] : null;
this.queryform.dateTimeEnd = this.time ? this.time[1] : null;
getAccessAnalyse(this.queryform).then((res) => {
this.data = res.data;
let lineX = res.data.accessTrend.map((item) => item.accessDay);
let lineY = res.data.accessTrend.map((item) => item.accessCount);
let barX = res.data.pageAccessTop.map((item) => item.accessCount);
let barY = res.data.pageAccessTop.map((item) => item.pageName);
this.initLine(lineX, lineY);
this.initBar(barX, barY);
});
},
initBar(barX,barY) {
let chartDom = document.getElementById('pages')
initBar(barX, barY) {
let chartDom = document.getElementById("pages");
let myChart = echarts.init(chartDom);
myChart.setOption({
legend: {
bottom: 0,
itemWidth:10,
itemHeight:10
itemWidth: 10,
itemHeight: 10,
},
tooltip: {
trigger: 'axis',
trigger: "axis",
axisPointer: {
type: 'shadow'
}
type: "shadow",
},
},
color:['#29D090'],
color: ["#29D090"],
grid: {
top:'3%',
left: '3%',
right: '3%',
bottom: '10%',
containLabel: true
top: "3%",
left: "3%",
right: "3%",
bottom: "10%",
containLabel: true,
},
xAxis: {
type: 'value',
boundaryGap: [0, 0.01]
type: "value",
boundaryGap: [0, 0.01],
},
yAxis: {
type: 'category',
type: "category",
data: barY,
axisTick: {
show: false
}
show: false,
},
series: [{
name: '访问次数',
type: 'bar',
},
series: [
{
name: "访问次数",
type: "bar",
data: barX,
barWidth:10
}
]
})
barWidth: 10,
},
],
});
},
initLine(lineX,lineY) {
let chartDom = document.getElementById('number')
initLine(lineX, lineY) {
let chartDom = document.getElementById("number");
let myChart = echarts.init(chartDom);
myChart.setOption({
legend: {
bottom: 0
bottom: 0,
},
grid: {
left: '10%',
left: "10%",
rigth: 0,
top: '5%',
bottom: '15%'
top: "5%",
bottom: "15%",
},
xAxis: {
type: 'category',
type: "category",
data: lineX,
axisTick: {
show: false
}
show: false,
},
},
yAxis: {
type: 'value'
type: "value",
},
series: [{
name: '页面访问次数',
series: [
{
name: "页面访问次数",
data: lineY,
type: 'line',
type: "line",
markLine: {
data: [{
type: 'average',
name: '均值'
}],
data: [
{
type: "average",
name: "均值",
},
],
label: {
position: 'insideStartTop',
formatter: '{b}:{c}'
}
}
}]
})
}
}
};
position: "insideStartTop",
formatter: "{b}:{c}",
},
},
},
],
});
},
},
};
</script>
<style lang="less" scoped>
.page {
.page {
height: calc(100% - 50px);
/deep/.ant-form {
......@@ -233,7 +258,7 @@
.page-dv {
width: calc(50% - 15px);
height: 140px;
background-color: #F5FAFF;
background-color: #f5faff;
padding: 30px;
box-sizing: border-box;
......@@ -246,7 +271,7 @@
.chatrs-dv {
padding: 20px;
background-color: #F6FBF7;
background-color: #f6fbf7;
}
#pages {
......@@ -254,5 +279,5 @@
}
}
}
}
}
</style>
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