访问量接口完成

src/api/data.js

@@ -38,4 +38,28 @@ export function getManagementProfile() {
 		url: '/idcgetSumData.action',
 		method: 'get'
 	})
+}
+
+// 今日访问量
+export function getIdcvisitsToday() {
+	return request({
+		url: '/idcvisitsToday.action',
+		method: 'post'
+	})
+}
+
+// 访问量趋势
+export function getIdcvisitsDiyQuery(param) {
+	let data = new FormData();
+	data.append('type', param.type);
+	if (param.startTime !== undefined && param.endTime !== undefined) {
+		data.append('startTime', param.startTime);
+		data.append('endTime', param.endTime);
+	}
+
+	return request({
+		url: '/idcvisitsDiyQuery.action',
+		method: 'post',
+		data
+	})
 }

src/views/data/index.vue

@@ -79,7 +79,8 @@
 												@click="toggleVisitButton('activeVisitButton3')">本月</el-button>
 										</el-button-group>
 										<el-date-picker ref="datePickerRef" v-model="visit_date" type="daterange" align="right" unlink-panels
-											range-separator="～" start-placeholder="开始日期" end-placeholder="结束日期" class="custom-date-picker">
+											range-separator="～" @change="visit_date_change" start-placeholder="开始日期" end-placeholder="结束日期"
+											class="custom-date-picker" format="yyyy-MM-dd" value-format="yyyy-MM-dd">
 										</el-date-picker>
 									</div>
 								</div>
@@ -187,7 +188,9 @@
 		getHomestayStatistics,
 		getOrderVolumeRanking,
 		getQuerySalesRankings,
-		getManagementProfile
+		getManagementProfile,
+		getIdcvisitsToday,
+		getIdcvisitsDiyQuery
 	} from '@/api/data';
 
 	import {
@@ -204,8 +207,8 @@
 				sales_are_higher_today_than_yesterday: '0.00',
 				order_quantity_today: 0,
 				todays_order_volume_is_higher_than_yesterday: 0,
-				tableOrderData: [], // 订单量排行
-				tableSellData: [], // 销售量排行
+				tableOrderData: [], // 订单量排行数据
+				tableSellData: [], // 销售量排行数据
 				chartOrderPieData: [], // 订单状态占比数据
 				chartUserPieData: [{
 						value: 335,
@@ -216,32 +219,8 @@
 						name: '女'
 					}
 				],
-				chartBarData: [{
-						value: 335,
-						name: '中源乡'
-					},
-					{
-						value: 310,
-						name: '中源乡1'
-					},
-					{
-						value: 234,
-						name: '中源乡2'
-					},
-					{
-						value: 135,
-						name: '中源乡3'
-					},
-					{
-						value: 1548,
-						name: '中源乡4'
-					},
-					{
-						value: 1548,
-						name: '中源乡5'
-					}
-				],
-				chartUserBarData: [{
+				chartBarData: [], // 民宿统计数据
+				chartUserBarData: [{ // 用户画像数据
 						value: 335,
 						name: '24岁及以下'
 					},
@@ -270,6 +249,7 @@
 				activeUserButton: 'activeUserButton2',
 				activeOrderButton: 'activeOrderButton2',
 				activeSellButton: 'activeSellButton2',
+				index_visit: 2 // 访问量趋势按钮位置，1当日，2本周，3本月
 			}
 		},
 		created() {
@@ -286,10 +266,13 @@
 			this.getQuerySalesRankings(2)
 			// 查询经营概况
 			this.getManagementProfile()
+			// 今日访问量
+			this.getIdcvisitsToday()
+			// 访问量趋势
+			this.getIdcvisitsDiyQuery()
 
 			this.pieUser()
 			this.barUser()
-			this.area()
 			// 自适应窗口大小
 			window.addEventListener('resize', () => {
 				this.chartPie.resize();
@@ -297,7 +280,53 @@
 			});
 		},
 		methods: {
+			visit_date_change() {
+				this.index_visit = 4
+				this.getIdcvisitsDiyQuery()
+			},
+			// 日访问量
+			getIdcvisitsToday() {
+				getIdcvisitsToday().then((res) => {
+					this.todays_traffic = res.data.todayCount
+					this.more_traffic_today_than_yesterday = res.data.compare
+				}).catch((err) => {
+					this.$message.error(err.message);
+				})
+			},
+			// 访问趋势
+			getIdcvisitsDiyQuery() {
+				var data = {
+					type: this.index_visit
+				}
+				if (this.visit_date && this.index_visit == 4) {
+					data.startTime = this.visit_date[0]
+					data.endTime = this.visit_date[1]
+				}
+				getIdcvisitsDiyQuery(data).then((res) => {
+					var dataDate = [];
+					var dataData = [];
+					for (var i = 0; i < res.data.length; i++) {
+						dataDate.push(res.data[i].day.substring(5))
+						dataData.push(res.data[i].visitNumber)
+					}
+					this.area(dataDate, dataData)
+				}).catch((err) => {
+					this.$message.error(err.message);
+				})
+			},
 			toggleVisitButton(buttonName) {
+				if (buttonName === 'activeVisitButton1') {
+					this.index_visit = 1
+					this.getIdcvisitsDiyQuery()
+				} else if (buttonName === 'activeVisitButton2') {
+					this.index_visit = 2
+					this.getIdcvisitsDiyQuery()
+				} else if (buttonName === 'activeVisitButton3') {
+					this.index_visit = 3
+					this.getIdcvisitsDiyQuery()
+				} else {
+					this.$message.error('未知时间')
+				}
 				this.activeVisitButton = buttonName;
 			},
 			toggleUserButton(buttonName) {
@@ -330,9 +359,6 @@
 						const tempdata = res.data
 
 						this.total_number_of_accommodation = tempdata.hotelSum // 民宿总数
-						// 访问量
-						this.todays_traffic = 0
-						this.more_traffic_today_than_yesterday = 0
 						// 销售额
 						this.todays_sales = tempdata.salesAmountDay // 今日销售量 
 						this.sales_are_higher_today_than_yesterday = tempdata.salesAmountGrowth.toFixed(2) // 销售量增长量
@@ -602,7 +628,7 @@
 					},
 					title: {
 						text: '客户性别占比',
-						left:'center',
+						left: 'center',
 						textAlign: 'left',
 						textStyle: {
 							fontSize: 14
@@ -652,7 +678,7 @@
 					},
 					title: {
 						text: '人群年龄占比',
-						left:'center',
+						left: 'center',
 						textStyle: {
 							fontSize: 14
 						}
@@ -690,7 +716,7 @@
 				});
 			},
 			// 面积图
-			area() {
+			area(dataDate, dataData) {
 				this.chartArea = echarts.init(this.$refs.chartArea);
 
 				this.chartArea.setOption({
@@ -711,7 +737,7 @@
 					},
 					xAxis: {
 						type: 'category',
-						data: ['08-01', '08-02', '08-03', '08-04', '08-05', '08-06', '08-07'],
+						data: dataDate,
 					},
 					yAxis: {
 						type: 'value',
@@ -719,7 +745,7 @@
 					series: [{
 						type: 'line',
 						areaStyle: {},
-						data: [65, 59, 80, 81, 56, 55, 40],
+						data: dataData,
 						itemStyle: {
 							color: '#4CBAFF'
 						}