Commit a66d06f6 authored by 吴春's avatar 吴春

看板信息数据统计

parent 37ab6802
<template>
<div class="full-box">
<div class="data-box" style="padding-bottom: 20px;">
<div class="row items-center" style="margin-bottom: 20px;">
<div class="data-box" style="padding-bottom: 20px">
<div class="row items-center" style="margin-bottom: 20px">
<div class="page-title col">平台数据</div>
<div class="row items-center">
<el-select v-model="parameters.CusType" style="width:100px; margin-right: 20px;height:40px" @change="handleDateChange()">
<el-option v-for="(x,i) in platforms" :key="i" :label="x.Name" :value="x.Id" ></el-option>
<el-select
v-model="parameters.CusType"
style="width: 100px; margin-right: 20px; height: 40px"
@change="handleDateChange()"
>
<el-option
v-for="(x, i) in platforms"
:key="i"
:label="x.Name"
:value="x.Id"
></el-option>
</el-select>
<template v-if="userInfo.RB_Branch_id==0||userInfo.RB_Branch_id==49">
<template
v-if="userInfo.RB_Branch_id == 0 || userInfo.RB_Branch_id == 49"
>
<el-select
v-model="parameters.branchId"
style="margin-right: 20px;height:40px"
@change="getDepartment(),parameters.RB_Department_Id=null,getEmpList(),parameters.empIdList=[],handleDateChange()"
style="margin-right: 20px; height: 40px"
@change="
getDepartment(),
(parameters.RB_Department_Id = null),
getEmpList(),
(parameters.empIdList = []),
handleDateChange()
"
>
<el-option
v-for="(x, i) in branchs"
......@@ -21,11 +38,19 @@
></el-option>
</el-select>
</template>
<treeselect style="margin-right: 20px;width:200px;" class="radius-input" :options="departmentList" v-model="parameters.RB_Department_Id"
:label="$t('pub.unlimitedSel')" :normalizer="normalizer" @select="changeDepart" placeholder="请选择部门" />
<treeselect
style="margin-right: 20px; width: 200px"
class="radius-input"
:options="departmentList"
v-model="parameters.RB_Department_Id"
:label="$t('pub.unlimitedSel')"
:normalizer="normalizer"
@select="changeDepart"
placeholder="请选择部门"
/>
<el-select
v-model="parameters.empId"
style="margin-right: 20px;height: 40px;"
style="margin-right: 20px; height: 40px"
@change="handleDateChange()"
filterable
clearable
......@@ -38,7 +63,7 @@
:value="x.empId"
></el-option>
</el-select>
<el-date-picker
v-model="parameters.dateRange"
type="daterange"
......@@ -66,9 +91,9 @@
{{ x.title }}
</div>
</div>
<div class="sub-title q-my-md">今日实时数据 </div>
<div class="sub-title q-my-md">今日实时数据</div>
<div class="card rounded big">
<div style="margin: 0 12px;">
<div style="margin: 0 12px">
<div class="sub-title">今日客户数据</div>
<div class="">
<span class="dot"></span>
......@@ -78,24 +103,24 @@
<div class="q-mt-md row items-center">
<div class="data-items col NumCursorP" @click="goUrl(1)">
<div>客户总数</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum" style="">
<template v-if="customerObj">
{{ customerObj.TotalCustomerCount }}
</template>
<template v-if="customerObj">
{{ customerObj.TotalCustomerCount }}
</template>
</span>
<span ></span>
<span></span>
<span></span>
</div>
<div class="text-info">&nbsp;</div>
</div>
<el-divider
direction="vertical"
style="margin: 0 12px;height: 80%;"
style="margin: 0 12px; height: 80%"
></el-divider>
<div class="data-items col NumCursorP" @click="goUrl(2)">
<div>今日新增客户</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">
<template v-if="customerObj">
{{ customerObj.TodayCustomerCount }}
......@@ -107,22 +132,22 @@
<span>较昨日</span>
<template v-if="customerObj">
<template v-if="customerObj.CustomerPercent > 0">
<span class="green" style="margin:0 12px 0 5px;">
<span class="green" style="margin: 0 12px 0 5px">
{{ customerObj.CustomerPercent }}%</span
>
</template>
<template v-else>
<span class="red" style="margin-left: 5px;"
<span class="red" style="margin-left: 5px"
>{{ customerObj.CustomerPercent }}%</span
>
</template>
</template>
</div>
</div>
<el-divider direction="vertical" style="margin: 0 12px;"></el-divider>
<el-divider direction="vertical" style="margin: 0 12px"></el-divider>
<div class="data-items col NumCursorP" @click="goUrl(3)">
<div>小程序激活数</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">
<template v-if="customerObj">
{{ customerObj.TotalActivationCount }}
......@@ -133,10 +158,10 @@
<div class="text-info">&nbsp;</div>
</div>
<el-divider direction="vertical" style="margin: 0 12px;"></el-divider>
<el-divider direction="vertical" style="margin: 0 12px"></el-divider>
<div class="data-items col NumCursorP" @click="goUrl(4)">
<div>今日激活数</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum"
><template v-if="customerObj">
{{ customerObj.TodayActivationCount }}
......@@ -148,12 +173,12 @@
<span>较昨日</span>
<template v-if="customerObj">
<template v-if="customerObj.ActivationPrecent > 0">
<span class="green" style="margin:0 12px 0 5px;">
<span class="green" style="margin: 0 12px 0 5px">
{{ customerObj.ActivationPrecent }}%</span
>
</template>
<template v-else>
<span class="red" style="margin-left: 5px;">
<span class="red" style="margin-left: 5px">
{{ customerObj.ActivationPrecent }}%</span
>
</template>
......@@ -163,21 +188,25 @@
</div>
</div>
<div class="card rounded big q-mt-md">
<div style="margin: 0 12px;">
<div style="margin: 0 12px">
<div class="sub-title">客户数据走势</div>
<div class="">
<span class="dot"></span>
<span class="text-info">{{ parameters.dateRange.join("-") }}</span>
</div>
</div>
<div style="height: 320px;">
<Customer :chartData="customerObj" v-if="customerObj" :cusType="parameters.CusType"></Customer>
<div style="height: 320px">
<Customer
:chartData="customerObj"
v-if="customerObj"
:cusType="parameters.CusType"
></Customer>
</div>
</div>
<div class="sub-title q-my-md green">交易核心数据</div>
<div class="card rounded big">
<div class="row items-center">
<div style="margin: 0 12px;" class="col">
<div style="margin: 0 12px" class="col">
<div class="sub-title">客户交易数据</div>
<div class="">
<span class="dot"></span>
......@@ -187,13 +216,14 @@
</div>
</div>
</div>
<div class="q-mt-md row items-center">
<div class="q-mt-md " style="padding: 5px 10px;margin-bottom:12px;border-radius:10px;background:#EEE;color:#999;font-size:13px;display:inline-block">全平台数据</div>
<div class="row items-center">
<div class="data-items col NumCursorP" @click="goUrl(5)">
<div>交易金额</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">
<template v-if="customerObj">
{{customerObj.OrderTotalPreferPrice}}
{{ customerObj.OrderTotalPreferPrice }}
</template>
</span>
<span></span>
......@@ -201,45 +231,96 @@
</div>
<el-divider
direction="vertical"
style="margin: 0 12px;height: 80%;"
style="margin: 0 12px; height: 80%"
></el-divider>
<div class="data-items col NumCursorP" @click="goUrl(6)">
<div>收客人数</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">
<template v-if="customerObj">
{{customerObj.OrderTotalGuestNum}}
<template v-if="customerObj">
{{ customerObj.OrderTotalGuestNum }}
</template>
</span>
<span></span>
</div>
</div>
<el-divider direction="vertical" style="margin: 0 12px;"></el-divider>
<el-divider direction="vertical" style="margin: 0 12px"></el-divider>
<div class="data-items col NumCursorP" @click="goUrl(7)">
<div>订单数</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">
<template v-if="customerObj">
{{customerObj.OrderTotalCount}}
<template v-if="customerObj">
{{ customerObj.OrderTotalCount }}
</template>
</span>
<span></span>
</div>
</div>
<el-divider direction="vertical" style="margin: 0 12px;"></el-divider>
<el-divider direction="vertical" style="margin: 0 12px"></el-divider>
<div class="data-items col NumCursorP">
<div></div>
<div class="num" style="margin: 6px 0">
<span class="datanum"> </span>
<span></span>
</div>
</div>
</div>
<div class="q-mt-md" style="padding: 5px 10px;margin-bottom:12px;border-radius:10px;background:#EEE;color:#999;font-size:13px;display:inline-block">{{parameters.CusType==0?"旅小友":"和平国旅优选"}}平台数据</div>
<div class="row items-center">
<div class="data-items col NumCursorP" @click="goUrl(5)">
<div>小程序交易金额</div>
<div class="num" style="margin: 6px 0">
<span class="datanum">
<template v-if="customerObj">
{{ customerObj.OrderTotalPreferPriceM }}
</template>
</span>
<span></span>
</div>
</div>
<el-divider
direction="vertical"
style="margin: 0 12px; height: 80%"
></el-divider>
<div class="data-items col NumCursorP" @click="goUrl(6)">
<div>小程序收客人数</div>
<div class="num" style="margin: 6px 0">
<span class="datanum">
<template v-if="customerObj">
{{ customerObj.OrderTotalGuestNumeM }}
</template>
</span>
<span></span>
</div>
</div>
<el-divider direction="vertical" style="margin: 0 12px"></el-divider>
<div class="data-items col NumCursorP" @click="goUrl(7)">
<div>小程序订单数</div>
<div class="num" style="margin: 6px 0">
<span class="datanum">
<template v-if="customerObj">
{{ customerObj.OrderTotalCounteM }}
</template>
</span>
<span></span>
</div>
</div>
<el-divider direction="vertical" style="margin: 0 12px"></el-divider>
<div class="data-items col NumCursorP" @click="goUrl(8)">
<div>用券订单数</div>
<div class="num" style="margin: 6px 0;">
<span class="datanum"> <template v-if="customerObj">
{{customerObj.OrderTotalUseCoupinCount}}
</template></span>
<div class="num" style="margin: 6px 0">
<span class="datanum">
<template v-if="customerObj">
{{ customerObj.OrderTotalUseCoupinCount }}
</template></span
>
<span></span>
</div>
</div>
</div>
</div>
<div class="card rounded big q-mt-md">
<div style="margin: 0 12px;">
<div style="margin: 0 12px">
<div class="sub-title">交易趋势图</div>
<div class="">
<span class="dot"></span>
......@@ -248,14 +329,18 @@
}}</span>
</div>
</div>
<div style="height: 320px;">
<Tradecount :chartData="customerObj" v-if="customerObj" :cusType="parameters.CusType"></Tradecount>
<div style="height: 320px">
<Tradecount
:chartData="customerObj"
v-if="customerObj"
:cusType="parameters.CusType"
></Tradecount>
</div>
</div>
<div class="sub-title q-my-md green">访问核心数据</div>
<div class="card rounded big">
<div style="margin: 0 12px;">
<div style="margin: 0 12px">
<div class="sub-title">用户活跃概况</div>
<div class="">
<span class="dot"></span>
......@@ -267,7 +352,7 @@
<div class="q-mt-md row items-center">
<div class="data-items col">
<div>小程序累计用户数</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">{{ baseWechatData.Visit_Total }}</span>
<span></span>
</div>
......@@ -276,9 +361,9 @@
<span
:class="{
red: baseWechatData.Visit_TotalYRate < 0,
green: baseWechatData.Visit_TotalYRate >= 0
green: baseWechatData.Visit_TotalYRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.Visit_TotalYRate > 0 ? "+" : "" }}
{{ baseWechatData.Visit_TotalYRate }}%</span
>
......@@ -286,9 +371,9 @@
<span
:class="{
red: baseWechatData.Visit_TotalSRate < 0,
green: baseWechatData.Visit_TotalSRate >= 0
green: baseWechatData.Visit_TotalSRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.Visit_TotalSRate > 0 ? "+" : "" }}
{{ baseWechatData.Visit_TotalSRate }}%</span
>
......@@ -296,11 +381,11 @@
</div>
<el-divider
direction="vertical"
style="margin: 0 12px;height: 80%;"
style="margin: 0 12px; height: 80%"
></el-divider>
<div class="data-items col">
<div>日访问人数</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">{{ baseWechatData.Visit_UV }}</span>
<span></span>
</div>
......@@ -309,9 +394,9 @@
<span
:class="{
red: baseWechatData.Visit_UVYRate < 0,
green: baseWechatData.Visit_UVYRate >= 0
green: baseWechatData.Visit_UVYRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.Visit_UVYRate > 0 ? "+" : "" }}
{{ baseWechatData.Visit_UVYRate }}%</span
>
......@@ -319,18 +404,18 @@
<span
:class="{
red: baseWechatData.Visit_UVSRate < 0,
green: baseWechatData.Visit_UVSRate >= 0
green: baseWechatData.Visit_UVSRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.Visit_UVSRate > 0 ? "+" : "" }}
{{ baseWechatData.Visit_UVSRate }}%</span
>
</div>
</div>
<el-divider direction="vertical" style="margin: 0 12px;"></el-divider>
<el-divider direction="vertical" style="margin: 0 12px"></el-divider>
<div class="data-items col">
<div>日打开次数</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">{{ baseWechatData.Session_CNT }}</span>
<span></span>
</div>
......@@ -339,9 +424,9 @@
<span
:class="{
red: baseWechatData.Session_CNTYRate < 0,
green: baseWechatData.Session_CNTYRate >= 0
green: baseWechatData.Session_CNTYRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.Session_CNTYRate > 0 ? "+" : "" }}
{{ baseWechatData.Session_CNTYRate }}%</span
>
......@@ -349,19 +434,19 @@
<span
:class="{
red: baseWechatData.Session_CNTSRate < 0,
green: baseWechatData.Session_CNTSRate >= 0
green: baseWechatData.Session_CNTSRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.Session_CNTSRate > 0 ? "+" : "" }}
{{ baseWechatData.Session_CNTSRate }}%</span
>
</div>
</div>
<el-divider direction="vertical" style="margin: 0 12px;"></el-divider>
<el-divider direction="vertical" style="margin: 0 12px"></el-divider>
<div class="data-items col">
<div>日转发人数</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">{{ baseWechatData.Share_UV }}</span>
<span></span>
</div>
......@@ -370,9 +455,9 @@
<span
:class="{
red: baseWechatData.Share_UVYRate < 0,
green: baseWechatData.Share_UVYRate >= 0
green: baseWechatData.Share_UVYRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.Share_UVYRate > 0 ? "+" : "" }}
{{ baseWechatData.Share_UVYRate }}%</span
>
......@@ -380,9 +465,9 @@
<span
:class="{
red: baseWechatData.Share_UVSRate < 0,
green: baseWechatData.Share_UVSRate >= 0
green: baseWechatData.Share_UVSRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.Share_UVSRate > 0 ? "+" : "" }}
{{ baseWechatData.Share_UVSRate }}%</span
>
......@@ -392,17 +477,19 @@
</div>
<div class="q-mt-md row items-center">
<div class="card rounded big col q-mr-md">
<div style="margin: 0 12px;">
<div style="margin: 0 12px">
<div class="sub-title">新增用户概况</div>
<div class="">
<span class="dot"></span>
<span class="text-info">数据更新:{{ parameters.dateRange[1] }}</span>
<span class="text-info"
>数据更新:{{ parameters.dateRange[1] }}</span
>
</div>
</div>
<div class="q-mt-md row items-center">
<div class="data-items col">
<div>日新增用户</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">{{ baseWechatData.Visit_UV_New }}</span>
<span></span>
</div>
......@@ -411,9 +498,9 @@
<span
:class="{
red: baseWechatData.Visit_UV_NewYRate < 0,
green: baseWechatData.Visit_UV_NewYRate >= 0
green: baseWechatData.Visit_UV_NewYRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.Visit_UV_NewYRate > 0 ? "+" : "" }}
{{ baseWechatData.Visit_UV_NewYRate }}%</span
>
......@@ -421,9 +508,9 @@
<span
:class="{
red: baseWechatData.Visit_UV_NewSRate < 0,
green: baseWechatData.Visit_UV_NewSRate >= 0
green: baseWechatData.Visit_UV_NewSRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.Visit_UV_NewSRate > 0 ? "+" : "" }}
{{ baseWechatData.Visit_UV_NewSRate }}%</span
>
......@@ -431,11 +518,11 @@
</div>
<el-divider
direction="vertical"
style="margin: 0 12px;height: 80%;"
style="margin: 0 12px; height: 80%"
></el-divider>
<div class="data-items col">
<div>人均停留时长</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">{{ baseWechatData.Stay_Time_UV }}</span>
<span></span>
</div>
......@@ -444,9 +531,9 @@
<span
:class="{
red: baseWechatData.Stay_Time_UVYRate < 0,
green: baseWechatData.Stay_Time_UVYRate >= 0
green: baseWechatData.Stay_Time_UVYRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.Stay_Time_UVYRate > 0 ? "+" : "" }}
{{ baseWechatData.Stay_Time_UVYRate }}%</span
>
......@@ -454,9 +541,9 @@
<span
:class="{
red: baseWechatData.Stay_Time_UVSRate < 0,
green: baseWechatData.Stay_Time_UVSRate >= 0
green: baseWechatData.Stay_Time_UVSRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.Stay_Time_UVSRate > 0 ? "+" : "" }}
{{ baseWechatData.Stay_Time_UVSRate }}%</span
>
......@@ -465,7 +552,7 @@
</div>
</div>
<div class="card rounded big col">
<div style="margin: 0 12px;">
<div style="margin: 0 12px">
<div class="sub-title">小程序留存概况</div>
<div class="">
<span class="dot"></span>
......@@ -477,7 +564,7 @@
<div class="q-mt-md row items-center">
<div class="data-items col">
<div>新增用户留存</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">{{ baseWechatData.NewVisitUV }}</span>
<span></span>
</div>
......@@ -486,9 +573,9 @@
<span
:class="{
red: baseWechatData.NewVisitUVYRate < 0,
green: baseWechatData.NewVisitUVYRate >= 0
green: baseWechatData.NewVisitUVYRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.NewVisitUVYRate > 0 ? "+" : "" }}
{{ baseWechatData.NewVisitUVYRate }}%</span
>
......@@ -496,9 +583,9 @@
<span
:class="{
red: baseWechatData.NewVisitUVSRate < 0,
green: baseWechatData.NewVisitUVSRate >= 0
green: baseWechatData.NewVisitUVSRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.NewVisitUVSRate > 0 ? "+" : "" }}
{{ baseWechatData.NewVisitUVSRate }}%</span
>
......@@ -506,11 +593,11 @@
</div>
<el-divider
direction="vertical"
style="margin: 0 12px;height: 80%;"
style="margin: 0 12px; height: 80%"
></el-divider>
<div class="data-items col">
<div>活跃用户留存数</div>
<div class="num" style="margin: 6px 0;">
<div class="num" style="margin: 6px 0">
<span class="datanum">{{ baseWechatData.VisitUV }}</span>
<span></span>
</div>
......@@ -519,9 +606,9 @@
<span
:class="{
red: baseWechatData.VisitUVYRate < 0,
green: baseWechatData.VisitUVYRate >= 0
green: baseWechatData.VisitUVYRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.VisitUVYRate > 0 ? "+" : "" }}
{{ baseWechatData.VisitUVYRate }}%</span
>
......@@ -529,9 +616,9 @@
<span
:class="{
red: baseWechatData.VisitUVSRate < 0,
green: baseWechatData.VisitUVSRate >= 0
green: baseWechatData.VisitUVSRate >= 0,
}"
style="margin:0 12px 0 5px;"
style="margin: 0 12px 0 5px"
>{{ baseWechatData.VisitUVSRate > 0 ? "+" : "" }}
{{ baseWechatData.VisitUVSRate }}%</span
>
......@@ -542,7 +629,7 @@
</div>
<div class="card rounded big q-mt-md">
<div style="margin: 0 12px; " class="row items-center">
<div style="margin: 0 12px" class="row items-center">
<div class="col">
<div class="sub-title">访问核心指标趋势</div>
<div class="">
......@@ -551,25 +638,37 @@
}}</span>
</div>
</div>
<el-select v-model="coreId" style="width: 140px; text-align: right;" @change="formatCoreTrend()">
<el-select
v-model="coreId"
style="width: 140px; text-align: right"
@change="formatCoreTrend()"
>
<el-option
v-for="(x, i) in coreLists"
:key="i"
:label="x.Name"
:value="x.Id"
></el-option>
</el-select>
</div>
<div class="text-small q-my-md" style="padding:0 12px;" v-if="currentCoreObj">平均:{{ currentCoreObj.avg }}{{ currentCoreObj.unit }}</div>
<div style="height: 320px; padding:0 12px">
<Coreview :chart-data="currentCoreObj" v-if="currentCoreObj"></Coreview>
<div
class="text-small q-my-md"
style="padding: 0 12px"
v-if="currentCoreObj"
>
平均:{{ currentCoreObj.avg }}{{ currentCoreObj.unit }}
</div>
<div style="height: 320px; padding: 0 12px">
<Coreview
:chart-data="currentCoreObj"
v-if="currentCoreObj"
></Coreview>
</div>
</div>
<div class="q-mt-md row">
<div class="card rounded big col">
<div style="margin: 0 12px; " class="row items-center">
<div style="margin: 0 12px" class="row items-center">
<div class="col">
<div class="sub-title">页面访问Top10</div>
<div class="">
......@@ -578,7 +677,11 @@
}}</span>
</div>
</div>
<el-select v-model="metricsId" style="width: 140px;" @change="formatPageData">
<el-select
v-model="metricsId"
style="width: 140px"
@change="formatPageData"
>
<el-option
v-for="(x, i) in metrics"
:key="i"
......@@ -587,12 +690,15 @@
></el-option>
</el-select>
</div>
<div style="height: 320px; padding:0 12px;" class="q-mt-md">
<Pagecount :chart-data="currentPageObj" v-if="currentPageObj"></Pagecount>
<div style="height: 320px; padding: 0 12px" class="q-mt-md">
<Pagecount
:chart-data="currentPageObj"
v-if="currentPageObj"
></Pagecount>
</div>
</div>
<div class="card rounded big col q-ml-md">
<div style="margin: 0 12px; " class="row items-center">
<div style="margin: 0 12px" class="row items-center">
<div class="col">
<div class="sub-title">客户分布占比</div>
<div class="">
......@@ -601,7 +707,11 @@
}}</span>
</div>
</div>
<el-select v-model="areaId" style="width: 140px;" @change="formatAreaData">
<el-select
v-model="areaId"
style="width: 140px"
@change="formatAreaData"
>
<el-option
v-for="(x, i) in areas"
:key="i"
......@@ -610,8 +720,11 @@
></el-option>
</el-select>
</div>
<div style="height: 320px; padding:0 12px;" class="q-mt-md">
<Citiescount v-if="currentAreaObj" :chart-data="currentAreaObj"></Citiescount>
<div style="height: 320px; padding: 0 12px" class="q-mt-md">
<Citiescount
v-if="currentAreaObj"
:chart-data="currentAreaObj"
></Citiescount>
</div>
</div>
</div>
......@@ -648,7 +761,7 @@ export default {
start.setTime(start.getTime() - 3600 * 1000 * 24 * 8);
end.setTime(end.getTime());
picker.$emit("pick", [start, end]);
}
},
},
{
text: "最近一个月",
......@@ -658,7 +771,7 @@ export default {
start.setTime(start.getTime() - 3600 * 1000 * 24 * 31);
end.setTime(end.getTime());
picker.$emit("pick", [start, end]);
}
},
},
{
text: "最近三个月",
......@@ -668,30 +781,30 @@ export default {
start.setTime(start.getTime() - 3600 * 1000 * 24 * 91);
end.setTime(end.getTime());
picker.$emit("pick", [start, end]);
}
}
},
},
],
disabledDate(time) {
return time.getTime() > new Date(Date.now() );
}
return time.getTime() > new Date(Date.now());
},
},
menus: [
{
title: "客户数据",
path: "coreData"
path: "coreData",
},
{
title: "交易数据",
path: "realTimeData"
path: "realTimeData",
},
{
title: "访问分析",
path: "accessAnalysis"
path: "accessAnalysis",
},
{
title: "产品统计",
path: "productStatistics"
}
path: "productStatistics",
},
],
branchs: [],
parameters: {
......@@ -699,10 +812,10 @@ export default {
dateRange: [],
StartDate: "",
EndDate: "",
RB_Department_Id:null,
empIdList:[],
empId:"",
CusType:0,//客户类型(0-同行(旅小友小程序),1-直客(和平国旅小程序))
RB_Department_Id: null,
empIdList: [],
empId: "",
CusType: 0, //客户类型(0-同行(旅小友小程序),1-直客(和平国旅小程序))
},
normalizer(node) {
var obj = {
......@@ -714,75 +827,75 @@ export default {
}
return obj;
},
departmentList:[],//部门列表
empList:[],//员工列表
departmentList: [], //部门列表
empList: [], //员工列表
coreId: 1,
coreLists: [
{
Id: 1,
value: "Visit_Total",
Name: "累计用户数",
Unit:'人'
Unit: "人",
},
{
Id: 2,
value:"Visit_UV",
value: "Visit_UV",
Name: "日访问人数",
Unit:'人'
Unit: "人",
},
{
Id: 3,
value: "Session_CNT",
Name: "日打开次数",
Unit:'次'
Unit: "次",
},
{
Id: 4,
value: "Share_UV",
Name: "转发人数",
Unit:'人'
Unit: "人",
},
{
Id: 5,
value: "Visit_UV_New",
Name: "日新增用户",
Unit:'人'
Unit: "人",
},
{
Id: 9,
value: "VisitUV",
Name: "活跃日留存",
Unit:'人'
Unit: "人",
},
{
Id: 10,
value: "NewVisitUV",
Name: "新增日留存",
Unit:'人'
Unit: "人",
},
{
Id: 11,
value: "Stay_Time_UV",
Name: "人均停留时长",
Unit:'秒'
Unit: "秒",
},
{
Id: 12,
value: "Share_UV",
Name: "转发次数",
Unit:'次'
Unit: "次",
},
{
Id: 13,
value: "Visit_Depth",
Name: "平均访问深度",
Unit:'层'
Unit: "层",
},
{
Id: 14,
value: "Stay_Time_Session",
Name: "次均停留时长",
Unit:'秒'
Unit: "秒",
},
],
metrics: [
......@@ -790,86 +903,85 @@ export default {
id: 1,
name: "访问次数",
value: "PageVisitPV",
unit:'次'
unit: "次",
},
{
id: 2,
name: "访问人数",
value: 'PageVisitUV',
unit:'人'
value: "PageVisitUV",
unit: "人",
},
{
id: 3,
name: "次均停留时长",
value: "PageStaytimePv",
unit:'秒'
unit: "秒",
},
{
id: 4,
name: "进入页次数",
value:'EntrypagePv',
unit:'次'
value: "EntrypagePv",
unit: "次",
},
{
id: 5,
name: "退出页次数",
value:'ExitpagePv',
unit:'次'
value: "ExitpagePv",
unit: "次",
},
{
id: 6,
name: "转发次数",
value: 'PageSharePv',
unit:'次'
value: "PageSharePv",
unit: "次",
},
{
id: 7,
name: "转发人数",
value:'PageShareUV',
unit:'人'
}
value: "PageShareUV",
unit: "人",
},
],
metricsId: 2,
areas: [
{
Id: 1,
Name: "省份",
Value: 'province'
Value: "province",
},
{
Id: 2,
Name: "城市",
Value: 'city'
}
Value: "city",
},
],
platforms: [
{
Id: 0,
Name: "同业"
Name: "同业",
},
{
Id: 1,
Name: "直客"
}
Name: "直客",
},
],
platformId: 1,
areaId: 1,
customerObj: null,
baseWechatData: {},
trendData:{},
currentCoreObj:null,
pageData:{},
currentPageObj:null,
areaData:{},
currentAreaObj:null,
userInfo:{},
trendData: {},
currentCoreObj: null,
pageData: {},
currentPageObj: null,
areaData: {},
currentAreaObj: null,
userInfo: {},
};
},
created() {
this.userInfo=this.getLocalStorage();
if(this.userInfo.RB_Branch_id!=0&&this.userInfo.RB_Branch_id!=49)
{
this.parameters.branchId=this.userInfo.RB_Branch_id;
this.userInfo = this.getLocalStorage();
if (this.userInfo.RB_Branch_id != 0 && this.userInfo.RB_Branch_id != 49) {
this.parameters.branchId = this.userInfo.RB_Branch_id;
}
this.getCompanyList();
this.getDepartment();
......@@ -880,113 +992,110 @@ export default {
end.setTime(end.getTime());
this.parameters.dateRange = [
start.toLocaleString().split(" ")[0],
end.toLocaleString().split(" ")[0]
end.toLocaleString().split(" ")[0],
];
this.getHomeChat();
this.getCustomerStatic();
this.getPageData()
this.getAreaData()
this.getPageData();
this.getAreaData();
},
mounted() {},
methods: {
goUrl(type) {
if(this.parameters.CusType==1&&(type==1||type==2)) {
var CStartTime="";
var CEndDate="";
if(type==2){
if (this.parameters.CusType == 1 && (type == 1 || type == 2)) {
var CStartTime = "";
var CEndDate = "";
if (type == 2) {
// 创建当前日期对象
const today = new Date();
// 获取年份、月份和日期,并补零处理
const year = today.getFullYear();
const month = String(today.getMonth() + 1).padStart(2, '0'); // 月份从0开始,需加1
const day = String(today.getDate()).padStart(2, '0');
const today = new Date();
// 获取年份、月份和日期,并补零处理
const year = today.getFullYear();
const month = String(today.getMonth() + 1).padStart(2, "0"); // 月份从0开始,需加1
const day = String(today.getDate()).padStart(2, "0");
// 组合成YYYY-MM-DD格式
const formattedDate = `${year}/${month}/${day}`;
// 组合成YYYY-MM-DD格式
const formattedDate = `${year}/${month}/${day}`;
console.log(this.parameters.dateRange[0],"66666"); // 输出例如:2023-10-05
var CStartTime=formattedDate;//this.parameters.dateRange[0];
var CEndDate=formattedDate;//this.parameters.dateRange[1];
console.log(this.parameters.dateRange[0], "66666"); // 输出例如:2023-10-05
var CStartTime = formattedDate; //this.parameters.dateRange[0];
var CEndDate = formattedDate; //this.parameters.dateRange[1];
}
let query = {
CStartTime: CStartTime,
CEndDate: CEndDate,
// EnterTime:this.parameters,
BranchId: this.parameters.branchId + "",
// RB_Department_Id:this.parameters.RB_Department_Id,
EnterID: this.parameters.empId,
blank: "y",
};
this.OpenNewPage("/directCustomerList", query);
} else {
let query = {
CStartDate: this.parameters.dateRange[0],
CEndDate: this.parameters.dateRange[1],
BranchId: this.parameters.branchId,
RB_Department_Id: this.parameters.RB_Department_Id,
EmployeeId: this.parameters.empId,
blank: "y",
};
if (this.parameters.CusType == 0) {
this.OpenNewPage("/salesVolumeRank", query);
}
let query= {
CStartTime: CStartTime,
CEndDate: CEndDate,
// EnterTime:this.parameters,
BranchId: this.parameters.branchId+"",
// RB_Department_Id:this.parameters.RB_Department_Id,
EnterID:this.parameters.empId,
blank: "y",
}
this.OpenNewPage('/directCustomerList',query);
}
else{
let query= {
CStartDate: this.parameters.dateRange[0],
CEndDate: this.parameters.dateRange[1],
BranchId: this.parameters.branchId,
RB_Department_Id:this.parameters.RB_Department_Id,
EmployeeId:this.parameters.empId,
blank: "y",
}
if(this.parameters.CusType==0){
this.OpenNewPage('/salesVolumeRank',query);
}
}
},
changeDepart(node, instanceId){
this.parameters.RB_Department_Id=node.DepartmentId;
this.parameters.empIdList=[];
this.parameters.empId="";
changeDepart(node, instanceId) {
this.parameters.RB_Department_Id = node.DepartmentId;
this.parameters.empIdList = [];
this.parameters.empId = "";
this.getEmpList();
this.handleDateChange();
},
//获取部门列表
getDepartment() {
let postMsg = {
RB_Group_Id: this.userInfo.RB_Group_id,
RB_Branch_Id: "-1",
Status: "0",
};
this.departmentList=[];
postMsg.RB_Branch_Id=this.parameters.branchId;
this.apipost(
"admin_Get_GetDepartmentTreeForReceiveQuery",
postMsg,
(res) => {
if (res.data.resultCode == 1) {
this.departmentList = res.data.data;
} else {
this.Error(res.data.message);
}
});
getDepartment() {
let postMsg = {
RB_Group_Id: this.userInfo.RB_Group_id,
RB_Branch_Id: "-1",
Status: "0",
};
this.departmentList = [];
postMsg.RB_Branch_Id = this.parameters.branchId;
this.apipost(
"admin_Get_GetDepartmentTreeForReceiveQuery",
postMsg,
(res) => {
if (res.data.resultCode == 1) {
this.departmentList = res.data.data;
} else {
this.Error(res.data.message);
}
}
);
},
getEmpList(){
this.empList=[];
let userMsg = {
RB_Group_id: this.userInfo.RB_Group_id,
RB_Branch_id: "-1",
departmentId: "0",
IsLeave: "-1",
};
if(this.parameters.RB_Department_Id){
userMsg.departmentId=this.parameters.RB_Department_Id;
getEmpList() {
this.empList = [];
let userMsg = {
RB_Group_id: this.userInfo.RB_Group_id,
RB_Branch_id: "-1",
departmentId: "0",
IsLeave: "-1",
};
if (this.parameters.RB_Department_Id) {
userMsg.departmentId = this.parameters.RB_Department_Id;
}
userMsg.RB_Branch_id = this.parameters.branchId;
this.apipost("app_get_employeeInfo_v2", userMsg, (res) => {
if (res.data.resultCode == 1) {
this.empList = res.data.data;
}
userMsg.RB_Branch_id=this.parameters.branchId;
this.apipost(
"app_get_employeeInfo_v2", userMsg,
(res) => {
if (res.data.resultCode == 1) {
this.empList = res.data.data;
}
});
});
},
handleDateChange() {
this.getCustomerStatic();
this.getHomeChat();
this.getPageData()
this.getAreaData()
this.getPageData();
this.getAreaData();
},
handleCompanyChange() {
this.getCustomerStatic();
......@@ -998,7 +1107,7 @@ console.log(this.parameters.dateRange[0],"66666"); // 输出例如:2023-10-05
this.parameters.EndDate = tempArray[1];
}
var that = this;
that.apipost("erp_post_GetCustomerStatic", that.parameters, res => {
that.apipost("erp_post_GetCustomerStatic", that.parameters, (res) => {
if (res.data.resultCode == 1) {
this.customerObj = res.data.data;
} else {
......@@ -1015,146 +1124,145 @@ console.log(this.parameters.dateRange[0],"66666"); // 输出例如:2023-10-05
const msg = {
Status: 0,
is_show: 0,
RB_Group_Id: RB_Group_id
RB_Group_Id: RB_Group_id,
};
this.apipost(
"admin_get_BranchGetList",
msg,
res => {
(res) => {
if (res.data.resultCode == 1) {
this.branchs = [
{
Id: -1,
BName: "全部"
}
BName: "全部",
},
];
this.branchs = this.branchs.concat(res.data.data);
}
},
err => {}
(err) => {}
);
},
getHomeChat() {
const msg = {
StartDate: this.parameters.dateRange[0],
EndDate: this.parameters.dateRange[1],
WechatType:this.parameters.CusType
WechatType: this.parameters.CusType,
};
this.apipost(
"wechatstatistics_post_HomeWechatStatisticsList",
msg,
res => {
(res) => {
if (res.data.resultCode == 1) {
this.baseWechatData = res.data.data;
this.getTrendWechatData()
this.getTrendWechatData();
}
},
err => {}
(err) => {}
);
},
getTrendWechatData(){
const msg = {
StartDate: this.parameters.dateRange[0],
EndDate: this.parameters.dateRange[1],
WechatType:this.parameters.CusType,
};
this.apipost(
"wechatstatistics_post_WechatStatisticsList",
msg,
res => {
if (res.data.resultCode == 1) {
this.trendData = res.data.data;
this.formatCoreTrend()
}
},
err => {}
);
getTrendWechatData() {
const msg = {
StartDate: this.parameters.dateRange[0],
EndDate: this.parameters.dateRange[1],
WechatType: this.parameters.CusType,
};
this.apipost(
"wechatstatistics_post_WechatStatisticsList",
msg,
(res) => {
if (res.data.resultCode == 1) {
this.trendData = res.data.data;
this.formatCoreTrend();
}
},
(err) => {}
);
},
getPageData(){
const msg = {
StartDate: this.parameters.dateRange[0],
EndDate: this.parameters.dateRange[1],
WechatType:this.parameters.CusType
};
this.apipost(
"wechatstatistics_post_PageVisitStatisticsList",
msg,
res => {
if (res.data.resultCode == 1) {
this.pageData = res.data.data;
this.formatPageData()
}
},
err => {}
);
getPageData() {
const msg = {
StartDate: this.parameters.dateRange[0],
EndDate: this.parameters.dateRange[1],
WechatType: this.parameters.CusType,
};
this.apipost(
"wechatstatistics_post_PageVisitStatisticsList",
msg,
(res) => {
if (res.data.resultCode == 1) {
this.pageData = res.data.data;
this.formatPageData();
}
},
(err) => {}
);
},
getAreaData() {
const msg = {
StartDate: this.parameters.dateRange[0],
EndDate: this.parameters.dateRange[1],
WechatType: this.parameters.CusType,
};
this.apipost(
"wechatstatistics_post_UserPortraitStatisticsList",
msg,
(res) => {
if (res.data.resultCode == 1) {
this.areaData = res.data.data;
this.formatAreaData();
}
},
(err) => {}
);
},
getAreaData(){
const msg = {
StartDate: this.parameters.dateRange[0],
EndDate: this.parameters.dateRange[1],
WechatType:this.parameters.CusType
formatAreaData() {
if (!this.areaData) return;
const filed = this.areas.find((x) => x.Id == this.areaId);
let seriesData = this.areaData[filed.Value].map((x) => {
return {
name: x.DateStr,
value: x.UserPortraitValue,
};
this.apipost(
"wechatstatistics_post_UserPortraitStatisticsList",
msg,
res => {
if (res.data.resultCode == 1) {
this.areaData = res.data.data;
this.formatAreaData()
}
},
err => {}
);
});
this.currentAreaObj = {
name: filed.Name + "分布占比",
pieData: seriesData,
};
},
formatAreaData(){
if(!this.areaData) return
const filed = this.areas.find(x=>x.Id == this.areaId)
let seriesData = this.areaData[filed.Value].map(x=> {
return {
name:x.DateStr,
value:x.UserPortraitValue
}
})
this.currentAreaObj = {
name:filed.Name+"分布占比",
pieData:seriesData
}
formatPageData() {
if (!this.pageData) return;
const filed = this.metrics.find((x) => x.id == this.metricsId);
const unit = filed.unit;
let xAxisData = this.pageData[filed.value].map((x) => x.DateStr);
let seriesData = this.pageData[filed.value].map((x) => x[filed.value]);
this.currentPageObj = {
unit: unit,
xAxisData: xAxisData,
barData: {
name: filed.name,
data: seriesData,
},
};
},
formatPageData(){
if(!this.pageData) return
const filed = this.metrics.find(x=>x.id == this.metricsId)
const unit = filed.unit
let xAxisData = this.pageData[filed.value].map(x=>x.DateStr)
let seriesData = this.pageData[filed.value].map(x=>x[filed.value])
this.currentPageObj = {
unit:unit,
xAxisData:xAxisData,
barData:{
name:filed.name,
data:seriesData
}
}
formatCoreTrend() {
if (!this.trendData) return;
const filed = this.coreLists.find((x) => x.Id == this.coreId);
const avg = this.trendData[filed.value];
const unit = filed.Unit;
const xAxisData = this.trendData.List.map((x) => x.CreateDayStr);
const seriesData = this.trendData.List.map((x) => x[filed.value]);
if (!xAxisData || !seriesData) return;
this.currentCoreObj = {
avg: avg,
unit: unit,
xAxisData: xAxisData,
lineData: {
name: filed.Name,
data: seriesData,
},
};
},
formatCoreTrend(){
if(!this.trendData) return
const filed = this.coreLists.find(x=>x.Id == this.coreId)
const avg = this.trendData[filed.value]
const unit = filed.Unit
const xAxisData = this.trendData.List.map(x=>x.CreateDayStr)
const seriesData = this.trendData.List.map(x=>x[filed.value])
if(!xAxisData || !seriesData) return
this.currentCoreObj = {
avg:avg,
unit:unit,
xAxisData:xAxisData,
lineData:{
name:filed.Name,
data:seriesData
}
}
}
}
},
};
</script>
<style>
......@@ -1337,14 +1445,13 @@ console.log(this.parameters.dateRange[0],"66666"); // 输出例如:2023-10-05
color: rgba(0, 0, 0, 0.9) !important;
font-weight: bolder;
}
.radius-input .vue-treeselect__control{
.radius-input .vue-treeselect__control {
height: 40px;
border-radius: 12px !important;
border:none !important;
border: none !important;
overflow: hidden;
}
.radius-input .vue-treeselect__single-value{
.radius-input .vue-treeselect__single-value {
height: 40px;
line-height: 40px;
}
......
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