|
|
@@ -17,13 +17,11 @@
|
|
|
<a-spin :spinning="baseInfoLoading">
|
|
|
<div class="wrap">
|
|
|
<p class="mb"
|
|
|
- >交付状态：<span class="big">{{ filter_Null_format(baseInfo.deliveryProgress) }}</span>
|
|
|
- </p
|
|
|
- >
|
|
|
+ >交付状态：<span class="big">{{ filter_Null_format(baseInfo.deliveryProgress) }}</span>
|
|
|
+ </p>
|
|
|
<p
|
|
|
- >运行状态：<span v-if="baseInfo.runStatus == 0">创建失败</span><span
|
|
|
- v-if="baseInfo.runStatus == 1">正常运行</span
|
|
|
- ><span v-if="baseInfo.runStatus == 2">运行异常</span>
|
|
|
+ >运行状态：<span v-if="baseInfo.runStatus == 0">创建失败</span><span v-if="baseInfo.runStatus == 1">正常运行</span
|
|
|
+ ><span v-if="baseInfo.runStatus == 2">运行异常</span>
|
|
|
<span v-if="baseInfo.runStatus == 3">站点停止</span>
|
|
|
</p>
|
|
|
<p>网站运行：{{ filter_Null_format(baseInfo.runDays) }}天</p>
|
|
|
@@ -179,21 +177,15 @@
|
|
|
|
|
|
<a-row class="r5-1">
|
|
|
<div class="fl">
|
|
|
- <a-button :type="timeChooseIndex == 7 ? 'primary' : ''" @click="changeTime(7)">
|
|
|
- 最近7天
|
|
|
- </a-button>
|
|
|
- <a-button :type="timeChooseIndex == 30 ? 'primary' : ''" @click="changeTime(30)">
|
|
|
- 最近30天
|
|
|
- </a-button>
|
|
|
- <a-button :type="timeChooseIndex == 180 ? 'primary' : ''"
|
|
|
- @click="changeTime(180)">最近六个月
|
|
|
- </a-button>
|
|
|
+ <a-button :type="timeChooseIndex == 7 ? 'primary' : ''" @click="changeTime(7)"> 最近7天 </a-button>
|
|
|
+ <a-button :type="timeChooseIndex == 30 ? 'primary' : ''" @click="changeTime(30)"> 最近30天 </a-button>
|
|
|
+ <a-button :type="timeChooseIndex == 180 ? 'primary' : ''" @click="changeTime(180)">最近六个月 </a-button>
|
|
|
</div>
|
|
|
<a-col :span="24">
|
|
|
<div class="fr" v-if="coreDataChart.x.length > 0">
|
|
|
- <span><i style="background: #544BEB;"></i>访客数（UV）</span>
|
|
|
- <span><i style="background: #F0B358;"></i>浏览量（PV）</span>
|
|
|
- <span><i style="background: #58CCA8;"></i>询盘数</span>
|
|
|
+ <span><i style="background: #544beb"></i>访客数（UV）</span>
|
|
|
+ <span><i style="background: #f0b358"></i>浏览量（PV）</span>
|
|
|
+ <span><i style="background: #58cca8"></i>询盘数</span>
|
|
|
</div>
|
|
|
<a-spin :spinning="chartsLoading" style="float: left; width: 100%">
|
|
|
<area-chart v-if="coreDataChart.x.length > 0" :dataSource="coreDataChart" />
|
|
|
@@ -256,420 +248,420 @@
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts" setup name="Adweb3Home">
|
|
|
-import areaChart from "../../../adweb/data/chart/areaChart.vue";
|
|
|
-import { getAction } from "/@/api/manage/manage";
|
|
|
-import { useUserStore } from "/@/store/modules/user";
|
|
|
-import selectSite from "/@/components/Adweb/selectSite.vue";
|
|
|
-import "/@/assets/less/home.less";
|
|
|
-import { useMessage } from "/@/hooks/web/useMessage";
|
|
|
-import { onMounted, reactive, ref } from "vue";
|
|
|
-
|
|
|
-const { createMessage } = useMessage();
|
|
|
-
|
|
|
-const columns = [
|
|
|
- {
|
|
|
- title: "指标",
|
|
|
- dataIndex: "targetName"
|
|
|
- },
|
|
|
- {
|
|
|
- title: "今日",
|
|
|
- dataIndex: "todayCount"
|
|
|
- },
|
|
|
- {
|
|
|
- title: "昨日",
|
|
|
- dataIndex: "yesterdayCount",
|
|
|
- scopedSlots: { customRender: "yesterdayCount" }
|
|
|
- },
|
|
|
- {
|
|
|
- title: "本周",
|
|
|
- dataIndex: "currentWeekCount",
|
|
|
- scopedSlots: { customRender: "currentWeekCount" }
|
|
|
- },
|
|
|
- {
|
|
|
- title: "上周",
|
|
|
- dataIndex: "lastWeekCount"
|
|
|
- },
|
|
|
- {
|
|
|
- title: "本月",
|
|
|
- dataIndex: "currentMonthCount"
|
|
|
- },
|
|
|
- {
|
|
|
- title: "上月",
|
|
|
- dataIndex: "lastMonthCount"
|
|
|
- },
|
|
|
- {
|
|
|
- title: "全部",
|
|
|
- dataIndex: "totalCount"
|
|
|
- }
|
|
|
-];
|
|
|
-
|
|
|
-const userRole = ref("");
|
|
|
-const timeChooseIndex = ref(7);
|
|
|
-//网站概况
|
|
|
-
|
|
|
-let selectSiteInfo = reactive<any>({});
|
|
|
-const siteCode = ref("");
|
|
|
-const siteStatus = ref(0);
|
|
|
-let baseInfo = reactive<any>({});
|
|
|
-const baseInfoLoading = ref(false);
|
|
|
-
|
|
|
-//物料完成情况
|
|
|
-// TODO
|
|
|
-
|
|
|
-//核心数据
|
|
|
-const coreInfoLoading = ref(false);
|
|
|
-const coreDetailLoading = ref(false);
|
|
|
-const chartsLoading = ref(false);
|
|
|
-const achievePercent = ref(0);
|
|
|
-const appointWordCount = ref(0);
|
|
|
-const currentAchieveCount = ref(0);
|
|
|
-const currentMonthEnquiryCount = ref(0);
|
|
|
-const currentWeekEnquiryCount = ref(0);
|
|
|
-const totalEnquiryCount = ref(0);
|
|
|
-let flowIndicator = ref({});
|
|
|
-let coreDataTable = ref([]);
|
|
|
-const coreDataChart = ref({
|
|
|
- x: [],
|
|
|
- uv: [],
|
|
|
- pv: [],
|
|
|
- enquiry: []
|
|
|
-});
|
|
|
-const averageVisit = ref(0);
|
|
|
-const averageVisitDuration = ref(0);
|
|
|
-const averageVisitPage = ref(0);
|
|
|
-const bounceRate = ref(0);
|
|
|
-const conversionRate = ref(0);
|
|
|
-
|
|
|
-const isShow = ref(false);
|
|
|
-
|
|
|
-onMounted(() => {
|
|
|
- userRole.value = useUserStore().roleList;
|
|
|
-});
|
|
|
-
|
|
|
-//改变站点
|
|
|
-function changeUser(selectedParamSiteInfo: any) {
|
|
|
- siteCode.value = selectedParamSiteInfo.code;
|
|
|
-
|
|
|
- siteStatus.value = selectedParamSiteInfo.status;
|
|
|
-
|
|
|
- getAllInfo();
|
|
|
-}
|
|
|
-
|
|
|
-function filter_Null_format(value) {
|
|
|
- if (value === "" || value === null || value === undefined) {
|
|
|
- return "--";
|
|
|
- } else {
|
|
|
- return value;
|
|
|
+ import areaChart from '/@/views/adweb/data/chart/areaChart.vue';
|
|
|
+ import { getAction } from '/@/api/manage/manage';
|
|
|
+ import { useUserStore } from '/@/store/modules/user';
|
|
|
+ import selectSite from '/@/components/Adweb/selectSite.vue';
|
|
|
+ import '/@/assets/less/home.less';
|
|
|
+ import { useMessage } from '/@/hooks/web/useMessage';
|
|
|
+ import { onMounted, reactive, ref } from 'vue';
|
|
|
+
|
|
|
+ const { createMessage } = useMessage();
|
|
|
+
|
|
|
+ const columns = [
|
|
|
+ {
|
|
|
+ title: '指标',
|
|
|
+ dataIndex: 'targetName',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '今日',
|
|
|
+ dataIndex: 'todayCount',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '昨日',
|
|
|
+ dataIndex: 'yesterdayCount',
|
|
|
+ scopedSlots: { customRender: 'yesterdayCount' },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '本周',
|
|
|
+ dataIndex: 'currentWeekCount',
|
|
|
+ scopedSlots: { customRender: 'currentWeekCount' },
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '上周',
|
|
|
+ dataIndex: 'lastWeekCount',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '本月',
|
|
|
+ dataIndex: 'currentMonthCount',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '上月',
|
|
|
+ dataIndex: 'lastMonthCount',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ title: '全部',
|
|
|
+ dataIndex: 'totalCount',
|
|
|
+ },
|
|
|
+ ];
|
|
|
+
|
|
|
+ const userRole = ref('');
|
|
|
+ const timeChooseIndex = ref(7);
|
|
|
+ //网站概况
|
|
|
+
|
|
|
+ let selectSiteInfo = reactive<any>({});
|
|
|
+ const siteCode = ref('');
|
|
|
+ const siteStatus = ref(0);
|
|
|
+ let baseInfo = reactive<any>({});
|
|
|
+ const baseInfoLoading = ref(false);
|
|
|
+
|
|
|
+ //物料完成情况
|
|
|
+ // TODO
|
|
|
+
|
|
|
+ //核心数据
|
|
|
+ const coreInfoLoading = ref(false);
|
|
|
+ const coreDetailLoading = ref(false);
|
|
|
+ const chartsLoading = ref(false);
|
|
|
+ const achievePercent = ref(0);
|
|
|
+ const appointWordCount = ref(0);
|
|
|
+ const currentAchieveCount = ref(0);
|
|
|
+ const currentMonthEnquiryCount = ref(0);
|
|
|
+ const currentWeekEnquiryCount = ref(0);
|
|
|
+ const totalEnquiryCount = ref(0);
|
|
|
+ let flowIndicator = ref({});
|
|
|
+ let coreDataTable = ref([]);
|
|
|
+ const coreDataChart = ref({
|
|
|
+ x: [],
|
|
|
+ uv: [],
|
|
|
+ pv: [],
|
|
|
+ enquiry: [],
|
|
|
+ });
|
|
|
+ const averageVisit = ref(0);
|
|
|
+ const averageVisitDuration = ref(0);
|
|
|
+ const averageVisitPage = ref(0);
|
|
|
+ const bounceRate = ref(0);
|
|
|
+ const conversionRate = ref(0);
|
|
|
+
|
|
|
+ const isShow = ref(false);
|
|
|
+
|
|
|
+ onMounted(() => {
|
|
|
+ userRole.value = useUserStore().roleList;
|
|
|
+ });
|
|
|
+
|
|
|
+ //改变站点
|
|
|
+ function changeUser(selectedParamSiteInfo: any) {
|
|
|
+ siteCode.value = selectedParamSiteInfo.code;
|
|
|
+
|
|
|
+ siteStatus.value = selectedParamSiteInfo.status;
|
|
|
+
|
|
|
+ getAllInfo();
|
|
|
}
|
|
|
-}
|
|
|
-
|
|
|
-//保证先获取到站点列表，获取到siteCode及siteId后再进行此方法
|
|
|
-function getAllInfo() {
|
|
|
- getBaseInfo();
|
|
|
- getCoreData();
|
|
|
- getCoreDataChart();
|
|
|
-}
|
|
|
-
|
|
|
-//获取基础信息
|
|
|
-function getBaseInfo() {
|
|
|
- let d = {
|
|
|
- siteCode: siteCode.value
|
|
|
- };
|
|
|
- baseInfoLoading.value = true;
|
|
|
- getAction("/adweb/adwebSiteManage/siteBasicInfo", d).then(function(res) {
|
|
|
- baseInfoLoading.value = false;
|
|
|
- if (res.code == 200) {
|
|
|
- baseInfo = res.result;
|
|
|
- isShow.value = true;
|
|
|
+
|
|
|
+ function filter_Null_format(value) {
|
|
|
+ if (value === '' || value === null || value === undefined) {
|
|
|
+ return '--';
|
|
|
} else {
|
|
|
- createMessage.error("获取站点基础信息失败，请刷新重试");
|
|
|
+ return value;
|
|
|
}
|
|
|
- });
|
|
|
-}
|
|
|
-
|
|
|
-const yesterdayData = ref({});
|
|
|
-const todayData = ref({});
|
|
|
-const thisWeekData = ref({});
|
|
|
-const lastWeekData = ref({});
|
|
|
-const thisMonthData = ref({});
|
|
|
-const lastMonthData = ref({});
|
|
|
-const allTimeData = ref({});
|
|
|
-
|
|
|
-//获取核心数据
|
|
|
-function getCoreData() {
|
|
|
- let d = {
|
|
|
- siteCode: siteCode.value
|
|
|
- };
|
|
|
- coreInfoLoading.value = true;
|
|
|
- getAction("/dmp-data/site-periodic/stats", d).then(function(res) {
|
|
|
- coreInfoLoading.value = false;
|
|
|
+ }
|
|
|
+
|
|
|
+ //保证先获取到站点列表，获取到siteCode及siteId后再进行此方法
|
|
|
+ function getAllInfo() {
|
|
|
+ getBaseInfo();
|
|
|
+ getCoreData();
|
|
|
+ getCoreDataChart();
|
|
|
+ }
|
|
|
+
|
|
|
+ //获取基础信息
|
|
|
+ function getBaseInfo() {
|
|
|
+ let d = {
|
|
|
+ siteCode: siteCode.value,
|
|
|
+ };
|
|
|
+ baseInfoLoading.value = true;
|
|
|
+ getAction('/adweb/adwebSiteManage/siteBasicInfo', d).then(function (res) {
|
|
|
+ baseInfoLoading.value = false;
|
|
|
+ if (res.code == 200) {
|
|
|
+ baseInfo = res.result;
|
|
|
+ isShow.value = true;
|
|
|
+ } else {
|
|
|
+ createMessage.error('获取站点基础信息失败，请刷新重试');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ const yesterdayData = ref({});
|
|
|
+ const todayData = ref({});
|
|
|
+ const thisWeekData = ref({});
|
|
|
+ const lastWeekData = ref({});
|
|
|
+ const thisMonthData = ref({});
|
|
|
+ const lastMonthData = ref({});
|
|
|
+ const allTimeData = ref({});
|
|
|
+
|
|
|
+ //获取核心数据
|
|
|
+ function getCoreData() {
|
|
|
+ let d = {
|
|
|
+ siteCode: siteCode.value,
|
|
|
+ };
|
|
|
+ coreInfoLoading.value = true;
|
|
|
+ getAction('/dmp-data/site-periodic/stats', d).then(function (res) {
|
|
|
+ coreInfoLoading.value = false;
|
|
|
+ if (res.code == 200) {
|
|
|
+ yesterdayData.value = res.result.yesterday;
|
|
|
+ todayData.value = res.result.today;
|
|
|
+ thisWeekData.value = res.result.thisWeek;
|
|
|
+ lastWeekData.value = res.result.lastWeek;
|
|
|
+ thisMonthData.value = res.result.thisMonth;
|
|
|
+ lastMonthData.value = res.result.lastMonth;
|
|
|
+ allTimeData.value = res.result.allTime;
|
|
|
+ // achievePercent.value = res.data.achievePercent;
|
|
|
+ // appointWordCount.value = res.data.appointWordCount;
|
|
|
+ // currentAchieveCount.value = res.data.currentAchieveCount;
|
|
|
+ // currentMonthEnquiryCount.value = res.data.currentMonthEnquiryCount;
|
|
|
+ // currentWeekEnquiryCount.value = res.data.currentWeekEnquiryCount;
|
|
|
+ // totalEnquiryCount.value = res.data.totalEnquiryCount;
|
|
|
+ // flowIndicator = res.data.flowIndicator;
|
|
|
+ currentWeekEnquiryCount.value = thisWeekData.value.enquires;
|
|
|
+ currentMonthEnquiryCount.value = thisMonthData.value.enquires;
|
|
|
+ totalEnquiryCount.value = allTimeData.value.enquires;
|
|
|
+ coreDataTable.value = [];
|
|
|
+ coreDataTable.value.push(
|
|
|
+ {
|
|
|
+ targetName: '访客数(UV)',
|
|
|
+ todayCount: todayData.value.totalUsers,
|
|
|
+ yesterdayCount: yesterdayData.value.totalUsers,
|
|
|
+ currentWeekCount: thisWeekData.value.totalUsers,
|
|
|
+ lastWeekCount: lastWeekData.value.totalUsers,
|
|
|
+ currentMonthCount: thisMonthData.value.totalUsers,
|
|
|
+ lastMonthCount: lastMonthData.value.totalUsers,
|
|
|
+ totalCount: allTimeData.value.totalUsers,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ targetName: '访问量(PV)',
|
|
|
+ todayCount: todayData.value.pageViews,
|
|
|
+ yesterdayCount: yesterdayData.value.pageViews,
|
|
|
+ currentWeekCount: thisWeekData.value.pageViews,
|
|
|
+ lastWeekCount: lastWeekData.value.pageViews,
|
|
|
+ currentMonthCount: thisMonthData.value.pageViews,
|
|
|
+ lastMonthCount: lastMonthData.value.pageViews,
|
|
|
+ totalCount: allTimeData.value.pageViews,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ targetName: '询盘数',
|
|
|
+ todayCount: todayData.value.enquires,
|
|
|
+ yesterdayCount: yesterdayData.value.enquires,
|
|
|
+ currentWeekCount: thisWeekData.value.enquires,
|
|
|
+ lastWeekCount: lastWeekData.value.enquires,
|
|
|
+ currentMonthCount: thisMonthData.value.enquires,
|
|
|
+ lastMonthCount: lastMonthData.value.enquires,
|
|
|
+ totalCount: allTimeData.value.enquires,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ targetName: '询盘转化率',
|
|
|
+ todayCount: todayData.value.enquiryConversionRate,
|
|
|
+ yesterdayCount: yesterdayData.value.enquiryConversionRate,
|
|
|
+ currentWeekCount: thisWeekData.value.enquiryConversionRate,
|
|
|
+ lastWeekCount: lastWeekData.value.enquiryConversionRate,
|
|
|
+ currentMonthCount: thisMonthData.value.enquiryConversionRate,
|
|
|
+ lastMonthCount: lastMonthData.value.enquiryConversionRate,
|
|
|
+ totalCount: allTimeData.value.enquiryConversionRate,
|
|
|
+ }
|
|
|
+ );
|
|
|
+ } else {
|
|
|
+ createMessage.error('获取核心数据信息失败，请刷新重试');
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+ //改变图表的时间维度
|
|
|
+ function changeTime(time) {
|
|
|
+ console.log(time);
|
|
|
+ timeChooseIndex.value = time;
|
|
|
+ getCoreDataChart();
|
|
|
+ }
|
|
|
+
|
|
|
+ //核心数据的面积图
|
|
|
+ const getCoreDataChart = async () => {
|
|
|
+ let d = {
|
|
|
+ siteCode: siteCode.value,
|
|
|
+ dateType: timeChooseIndex.value,
|
|
|
+ };
|
|
|
+ chartsLoading.value = true;
|
|
|
+ const res = await getAction('/dmp-data/site-overview/stats', d);
|
|
|
if (res.code == 200) {
|
|
|
- yesterdayData.value = res.result.yesterday;
|
|
|
- todayData.value = res.result.today;
|
|
|
- thisWeekData.value = res.result.thisWeek;
|
|
|
- lastWeekData.value = res.result.lastWeek;
|
|
|
- thisMonthData.value = res.result.thisMonth;
|
|
|
- lastMonthData.value = res.result.lastMonth;
|
|
|
- allTimeData.value = res.result.allTime;
|
|
|
- // achievePercent.value = res.data.achievePercent;
|
|
|
- // appointWordCount.value = res.data.appointWordCount;
|
|
|
- // currentAchieveCount.value = res.data.currentAchieveCount;
|
|
|
- // currentMonthEnquiryCount.value = res.data.currentMonthEnquiryCount;
|
|
|
- // currentWeekEnquiryCount.value = res.data.currentWeekEnquiryCount;
|
|
|
- // totalEnquiryCount.value = res.data.totalEnquiryCount;
|
|
|
- // flowIndicator = res.data.flowIndicator;
|
|
|
- currentWeekEnquiryCount.value = thisWeekData.value.enquires;
|
|
|
- currentMonthEnquiryCount.value = thisMonthData.value.enquires;
|
|
|
- totalEnquiryCount.value = allTimeData.value.enquires;
|
|
|
- coreDataTable.value = [];
|
|
|
- coreDataTable.value.push(
|
|
|
- {
|
|
|
- targetName: "访客数(UV)",
|
|
|
- todayCount: todayData.value.totalUsers,
|
|
|
- yesterdayCount: yesterdayData.value.totalUsers,
|
|
|
- currentWeekCount: thisWeekData.value.totalUsers,
|
|
|
- lastWeekCount: lastWeekData.value.totalUsers,
|
|
|
- currentMonthCount: thisMonthData.value.totalUsers,
|
|
|
- lastMonthCount: lastMonthData.value.totalUsers,
|
|
|
- totalCount: allTimeData.value.totalUsers
|
|
|
- },
|
|
|
- {
|
|
|
- targetName: "访问量(PV)",
|
|
|
- todayCount: todayData.value.pageViews,
|
|
|
- yesterdayCount: yesterdayData.value.pageViews,
|
|
|
- currentWeekCount: thisWeekData.value.pageViews,
|
|
|
- lastWeekCount: lastWeekData.value.pageViews,
|
|
|
- currentMonthCount: thisMonthData.value.pageViews,
|
|
|
- lastMonthCount: lastMonthData.value.pageViews,
|
|
|
- totalCount: allTimeData.value.pageViews
|
|
|
- },
|
|
|
- {
|
|
|
- targetName: "询盘数",
|
|
|
- todayCount: todayData.value.enquires,
|
|
|
- yesterdayCount: yesterdayData.value.enquires,
|
|
|
- currentWeekCount: thisWeekData.value.enquires,
|
|
|
- lastWeekCount: lastWeekData.value.enquires,
|
|
|
- currentMonthCount: thisMonthData.value.enquires,
|
|
|
- lastMonthCount: lastMonthData.value.enquires,
|
|
|
- totalCount: allTimeData.value.enquires
|
|
|
- },
|
|
|
- {
|
|
|
- targetName: "询盘转化率",
|
|
|
- todayCount: todayData.value.enquiryConversionRate,
|
|
|
- yesterdayCount: yesterdayData.value.enquiryConversionRate,
|
|
|
- currentWeekCount: thisWeekData.value.enquiryConversionRate,
|
|
|
- lastWeekCount: lastWeekData.value.enquiryConversionRate,
|
|
|
- currentMonthCount: thisMonthData.value.enquiryConversionRate,
|
|
|
- lastMonthCount: lastMonthData.value.enquiryConversionRate,
|
|
|
- totalCount: allTimeData.value.enquiryConversionRate
|
|
|
+ let r = res.result == null ? {} : res.result;
|
|
|
+ averageVisit.value = r.dailyTotalUsers == null ? '0' : r.dailyTotalUsers;
|
|
|
+ averageVisitDuration.value = r.avgTimeOnPage == null ? '0' : r.avgTimeOnPage;
|
|
|
+ averageVisitPage.value = r.pageViewsPerSession == null ? '0' : r.pageViewsPerSession;
|
|
|
+ bounceRate.value = r.bounceRate == null ? '0' : r.bounceRate;
|
|
|
+ conversionRate.value = r.enquiryConversionRate == null ? '0' : r.enquiryConversionRate;
|
|
|
+ let x = [],
|
|
|
+ pv = [],
|
|
|
+ uv = [],
|
|
|
+ enquiry = [];
|
|
|
+ if (r.dailyStats != null && r.dailyStats.length > 0) {
|
|
|
+ for (let i in r.dailyStats) {
|
|
|
+ x.push(r.dailyStats[i].date);
|
|
|
+ pv.push(r.dailyStats[i].pageViews);
|
|
|
+ uv.push(r.dailyStats[i].totalUsers);
|
|
|
+ enquiry.push(r.dailyStats[i].enquires);
|
|
|
}
|
|
|
- );
|
|
|
+ }
|
|
|
+ coreDataChart.value.x = x;
|
|
|
+ coreDataChart.value.pv = pv;
|
|
|
+ coreDataChart.value.uv = uv;
|
|
|
+ coreDataChart.value.enquiry = enquiry;
|
|
|
} else {
|
|
|
- createMessage.error("获取核心数据信息失败，请刷新重试");
|
|
|
+ averageVisit.value = 0;
|
|
|
+ averageVisitDuration.value = 0;
|
|
|
+ averageVisitPage.value = 0;
|
|
|
+ bounceRate.value = 0;
|
|
|
+ coreDataChart.value.x = [];
|
|
|
+ coreDataChart.value.pv = [];
|
|
|
+ coreDataChart.value.uv = [];
|
|
|
+ coreDataChart.value.enquiry = [];
|
|
|
+ createMessage.error('获取核心数据图表信息失败，请刷新重试');
|
|
|
}
|
|
|
- });
|
|
|
-}
|
|
|
-
|
|
|
-//改变图表的时间维度
|
|
|
-function changeTime(time) {
|
|
|
- console.log(time);
|
|
|
- timeChooseIndex.value = time;
|
|
|
- getCoreDataChart();
|
|
|
-}
|
|
|
-
|
|
|
-//核心数据的面积图
|
|
|
-const getCoreDataChart = async () => {
|
|
|
- let d = {
|
|
|
- siteCode: siteCode.value,
|
|
|
- dateType: timeChooseIndex.value
|
|
|
+ chartsLoading.value = false;
|
|
|
};
|
|
|
- chartsLoading.value = true;
|
|
|
- const res = await getAction("/dmp-data/site-overview/stats", d);
|
|
|
- if (res.code == 200) {
|
|
|
- let r = res.result == null ? {} : res.result;
|
|
|
- averageVisit.value = r.dailyTotalUsers == null ? "0" : r.dailyTotalUsers;
|
|
|
- averageVisitDuration.value = r.avgTimeOnPage == null ? "0" : r.avgTimeOnPage;
|
|
|
- averageVisitPage.value = r.pageViewsPerSession == null ? "0" : r.pageViewsPerSession;
|
|
|
- bounceRate.value = r.bounceRate == null ? "0" : r.bounceRate;
|
|
|
- conversionRate.value = r.enquiryConversionRate == null ? "0" : r.enquiryConversionRate;
|
|
|
- let x = [],
|
|
|
- pv = [],
|
|
|
- uv = [],
|
|
|
- enquiry = [];
|
|
|
- if (r.dailyStats != null && r.dailyStats.length > 0) {
|
|
|
- for (let i in r.dailyStats) {
|
|
|
- x.push(r.dailyStats[i].date);
|
|
|
- pv.push(r.dailyStats[i].pageViews);
|
|
|
- uv.push(r.dailyStats[i].totalUsers);
|
|
|
- enquiry.push(r.dailyStats[i].enquires);
|
|
|
- }
|
|
|
- }
|
|
|
- coreDataChart.value.x = x;
|
|
|
- coreDataChart.value.pv = pv;
|
|
|
- coreDataChart.value.uv = uv;
|
|
|
- coreDataChart.value.enquiry = enquiry;
|
|
|
- } else {
|
|
|
- averageVisit.value = 0;
|
|
|
- averageVisitDuration.value = 0;
|
|
|
- averageVisitPage.value = 0;
|
|
|
- bounceRate.value = 0;
|
|
|
- coreDataChart.value.x = [];
|
|
|
- coreDataChart.value.pv = [];
|
|
|
- coreDataChart.value.uv = [];
|
|
|
- coreDataChart.value.enquiry = [];
|
|
|
- createMessage.error("获取核心数据图表信息失败，请刷新重试");
|
|
|
- }
|
|
|
- chartsLoading.value = false;
|
|
|
-};
|
|
|
</script>
|
|
|
|
|
|
<style lang="less">
|
|
|
-.home {
|
|
|
- .ant-select {
|
|
|
- color: #fff;
|
|
|
+ .home {
|
|
|
+ .ant-select {
|
|
|
+ color: #fff;
|
|
|
|
|
|
- .ant-select-selection {
|
|
|
- background-color: transparent;
|
|
|
- }
|
|
|
+ .ant-select-selection {
|
|
|
+ background-color: transparent;
|
|
|
+ }
|
|
|
|
|
|
- .ant-select-arrow {
|
|
|
- color: #fff;
|
|
|
+ .ant-select-arrow {
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
</style>
|
|
|
|
|
|
<style scoped lang="less">
|
|
|
-p,
|
|
|
-span {
|
|
|
- color: #000;
|
|
|
- margin: 0;
|
|
|
-}
|
|
|
-
|
|
|
-.theme-color {
|
|
|
- color: @primary-color;
|
|
|
-}
|
|
|
-
|
|
|
-.title {
|
|
|
- font-size: 18px;
|
|
|
- color: #000;
|
|
|
-}
|
|
|
+ p,
|
|
|
+ span {
|
|
|
+ color: #000;
|
|
|
+ margin: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .theme-color {
|
|
|
+ color: @primary-color;
|
|
|
+ }
|
|
|
+
|
|
|
+ .title {
|
|
|
+ font-size: 18px;
|
|
|
+ color: #000;
|
|
|
+ }
|
|
|
</style>
|
|
|
|
|
|
<style lang="less">
|
|
|
-.pop-wrap {
|
|
|
- .ant-popover-inner-content {
|
|
|
- padding: 0;
|
|
|
- }
|
|
|
+ .pop-wrap {
|
|
|
+ .ant-popover-inner-content {
|
|
|
+ padding: 0;
|
|
|
+ }
|
|
|
|
|
|
- .wrap {
|
|
|
- width: 400px;
|
|
|
- padding: 20px 20px;
|
|
|
- background: url('../../../../assets/home/pop-bg.svg') no-repeat;
|
|
|
- background-position: bottom right;
|
|
|
+ .wrap {
|
|
|
+ width: 400px;
|
|
|
+ padding: 20px 20px;
|
|
|
+ background: url('../../../../assets/home/pop-bg.svg') no-repeat;
|
|
|
+ background-position: bottom right;
|
|
|
|
|
|
- p {
|
|
|
- line-height: 1.8;
|
|
|
+ p {
|
|
|
+ line-height: 1.8;
|
|
|
|
|
|
- i {
|
|
|
- color: @primary-color;
|
|
|
- margin-right: 10px;
|
|
|
+ i {
|
|
|
+ color: @primary-color;
|
|
|
+ margin-right: 10px;
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- .name {
|
|
|
- font-size: 18px;
|
|
|
- margin-bottom: 20px;
|
|
|
- }
|
|
|
+ .name {
|
|
|
+ font-size: 18px;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ }
|
|
|
|
|
|
- .job {
|
|
|
- font-size: 15px;
|
|
|
- color: #9f9f9f;
|
|
|
- }
|
|
|
+ .job {
|
|
|
+ font-size: 15px;
|
|
|
+ color: #9f9f9f;
|
|
|
+ }
|
|
|
|
|
|
- .ant-col-8 {
|
|
|
- text-align: right;
|
|
|
+ .ant-col-8 {
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
|
|
|
-.faban {
|
|
|
- .ant-modal {
|
|
|
- .ant-modal-content {
|
|
|
- background-color: transparent;
|
|
|
- box-shadow: none;
|
|
|
+ .faban {
|
|
|
+ .ant-modal {
|
|
|
+ .ant-modal-content {
|
|
|
+ background-color: transparent;
|
|
|
+ box-shadow: none;
|
|
|
|
|
|
- .ant-modal-close {
|
|
|
- top: 70px;
|
|
|
- right: -10px;
|
|
|
+ .ant-modal-close {
|
|
|
+ top: 70px;
|
|
|
+ right: -10px;
|
|
|
|
|
|
- .ant-modal-close-x {
|
|
|
- width: auto;
|
|
|
- height: auto;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .self-close {
|
|
|
- i {
|
|
|
- color: #fff;
|
|
|
- border: 1px solid #fff;
|
|
|
- width: 25px;
|
|
|
- height: 25px;
|
|
|
- display: block;
|
|
|
- line-height: 25px;
|
|
|
+ .ant-modal-close-x {
|
|
|
+ width: auto;
|
|
|
+ height: auto;
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- .ant-modal-body {
|
|
|
- .top-bg {
|
|
|
- background: url('../../../../assets/home/faban/topbg.png') no-repeat;
|
|
|
- min-height: 242px;
|
|
|
- background-size: 100% 100%;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- align-items: flex-end;
|
|
|
- font-size: 38px;
|
|
|
- padding-bottom: 60px;
|
|
|
-
|
|
|
- p {
|
|
|
+ .self-close {
|
|
|
+ i {
|
|
|
color: #fff;
|
|
|
+ border: 1px solid #fff;
|
|
|
+ width: 25px;
|
|
|
+ height: 25px;
|
|
|
+ display: block;
|
|
|
+ line-height: 25px;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- .info-wrap {
|
|
|
- background: #fff;
|
|
|
- padding: 0 40px;
|
|
|
- overflow: hidden;
|
|
|
- border-bottom-left-radius: 15px;
|
|
|
- border-bottom-right-radius: 15px;
|
|
|
- margin-top: -1px;
|
|
|
-
|
|
|
- p {
|
|
|
- position: relative;
|
|
|
- padding-left: 30px;
|
|
|
- margin-bottom: 5px;
|
|
|
- letter-spacing: 1px;
|
|
|
-
|
|
|
- &:before {
|
|
|
- content: '';
|
|
|
- position: absolute;
|
|
|
- left: 0;
|
|
|
- width: 15px;
|
|
|
- height: 15px;
|
|
|
- background: url('../../../../assets/home/faban/dot.svg');
|
|
|
- background-repeat: no-repeat;
|
|
|
- top: 3px;
|
|
|
+ .ant-modal-body {
|
|
|
+ .top-bg {
|
|
|
+ background: url('../../../../assets/home/faban/topbg.png') no-repeat;
|
|
|
+ min-height: 242px;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: flex-end;
|
|
|
+ font-size: 38px;
|
|
|
+ padding-bottom: 60px;
|
|
|
+
|
|
|
+ p {
|
|
|
+ color: #fff;
|
|
|
}
|
|
|
}
|
|
|
|
|
|
- img {
|
|
|
- width: 70px;
|
|
|
- float: right;
|
|
|
- padding: 40px 0;
|
|
|
+ .info-wrap {
|
|
|
+ background: #fff;
|
|
|
+ padding: 0 40px;
|
|
|
+ overflow: hidden;
|
|
|
+ border-bottom-left-radius: 15px;
|
|
|
+ border-bottom-right-radius: 15px;
|
|
|
+ margin-top: -1px;
|
|
|
+
|
|
|
+ p {
|
|
|
+ position: relative;
|
|
|
+ padding-left: 30px;
|
|
|
+ margin-bottom: 5px;
|
|
|
+ letter-spacing: 1px;
|
|
|
+
|
|
|
+ &:before {
|
|
|
+ content: '';
|
|
|
+ position: absolute;
|
|
|
+ left: 0;
|
|
|
+ width: 15px;
|
|
|
+ height: 15px;
|
|
|
+ background: url('../../../../assets/home/faban/dot.svg');
|
|
|
+ background-repeat: no-repeat;
|
|
|
+ top: 3px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ img {
|
|
|
+ width: 70px;
|
|
|
+ float: right;
|
|
|
+ padding: 40px 0;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
-}
|
|
|
</style>
|
chenpeiqing
