1

src/pages/ConsumptionReport/ConsumptionReport.vue

@@ -38,15 +38,15 @@
 					<view class="consumption-report-card-one-item">
 						<view class="consumption-total-number">
 							<view class="consumption-total-number-item">
-								650.80
+								{{weekConsumerAmout.consumerAmount}}
 							</view>
 							<view class="consumption-total-number-trend">
 								<view class="consumption-total-number-trend-item">
-									+142.50
+									{{condition+weekConsumerAmout.compareAmount}}
 								</view>
 								<view
 									class="consumption-total-number-trend-item consumption-total-number-trend-percent">
-									20%
+									{{weekConsumerAmout.rate+'%'}}
 								</view>
 							</view>
 						</view>
@@ -59,7 +59,7 @@
 									环比上周
 								</view>
 								<view class="consumption-total-text-contrast-img">
-									<image class="consumption-total-text-trend-img" src="../../static/images/trend.png">
+									<image class="consumption-total-text-trend-img" :src="trendimg">
 									</image>
 								</view>
 							</view>
@@ -103,11 +103,13 @@
 					<view class="average-daily-consumption">
 						<view class="average-daily-consumption-item">
 							<text>¥</text>
-							<text class="average-daily-consumption-item-num">{{dayConsumerTrend.userWeekAvgAmount}}</text>
+							<text
+								class="average-daily-consumption-item-num">{{dayConsumerTrend.userWeekAvgAmount}}</text>
 						</view>
 						<view class="average-daily-consumption-item average-daily-consumption-item-orange">
 							<text>¥</text>
-							<text class="average-daily-consumption-item-num">{{dayConsumerTrend.classWeekAvgAmount}}</text>
+							<text
+								class="average-daily-consumption-item-num">{{dayConsumerTrend.classWeekAvgAmount}}</text>
 						</view>
 					</view>
 					<view class="average-daily-consumption-contrast">
@@ -175,7 +177,7 @@
 										</view>
 									</view>
 									<view class="consumption-preferences-list-item-text-cash">
-										￥{{consumptionPreferencesData[0]}}
+										￥{{consumptionPreferencesData.canteenAmount}}
 									</view>
 								</view>
 								<view class="consumption-preferences-list-item-proportion">
@@ -203,7 +205,7 @@
 										</view>
 									</view>
 									<view class="consumption-preferences-list-item-text-cash">
-										￥{{consumptionPreferencesData[1]}}
+										￥{{consumptionPreferencesData.supermarketAmount}}
 									</view>
 								</view>
 								<view class="consumption-preferences-list-item-proportion">
@@ -230,7 +232,7 @@
 										</view>
 									</view>
 									<view class="consumption-preferences-list-item-text-cash">
-										￥{{consumptionPreferencesData[2]}}
+										￥{{consumptionPreferencesData.otherAmount}}
 									</view>
 								</view>
 								<view class="consumption-preferences-list-item-proportion">
@@ -472,17 +474,20 @@
 			return {
 				consumerNameIndex: 0,
 				dataRangeIndex: 0,
-				consumerNameArr: [],	// 学生姓名列表
-				consumerInfo:[],	//家长关联的学生信息
-				specifiedConsumerInfo:{},	//选择学生的信息
-				dayConsumerTrend:{},	//日消费趋势数据
+				consumerNameArr: [], // 学生姓名列表
+				consumerInfo: [], //家长关联的学生信息
+				specifiedConsumerInfo: {}, //选择学生的信息
+				dayConsumerTrend: {}, //日消费趋势数据
+				// 周消费要点数据
+				weekConsumerAmout: {},
+				condition: '',
+				trendimg: '',
 				// 日期范围列表
 				dataRangeArr: ['12月06日~12月12日', '11月29日~12月05日', '11月22日~11月28日'],
 				// 日消费趋势图表数据
 				dailyConsumptionData: [],
 				dailyConsumptionDate: [],
-				// 消费偏好数据
-				consumptionPreferencesData: [372.81, 145.05, 108.34],
+				consumptionPreferencesData: {},	// 消费偏好数据
 			}
 		},
 		computed: {
@@ -490,9 +495,7 @@
 				return this.dailyConsumptionData.map(data => data / Math.max(...this.dailyConsumptionData) * 266)
 			},
 			percentArr() {
-				var consumptionPreferencesTotal = this.consumptionPreferencesData.reduce((preValue, curValue) => preValue +
-					curValue)
-				return this.consumptionPreferencesData.map(data => (Math.round(data / consumptionPreferencesTotal *
+				return this.consumptionPreferencesData.map(data => ((data / this.consumptionPreferencesData.grossAmount *
 					10000) / 100).toFixed(1) + '%')
 			},
 			widthArr() {
@@ -503,43 +506,45 @@
 			}
 		},
 		mounted() {
-			this.queryPatriarchByStudent().then(()=>{
+			this.queryPatriarchByStudent().then(() => {
 				this.queryDayConsumerTrend()
+				this.queryWeekConsumerAmout()
+				this.queryStudentConsumerPreference()
 			})
 			this.getDataRangeArr()
 		},
 		methods: {
 			consumerChange(e) {
 				this.consumerNameIndex = e.target.value
-				this.specifiedConsumerInfo=this.consumerInfo[this.consumerNameIndex]
+				this.specifiedConsumerInfo = this.consumerInfo[this.consumerNameIndex]
 				this.queryDayConsumerTrend()
 			},
 			dataRangeChange(e) {
 				this.dataRangeIndex = e.target.value
 			},
 			// 获取当前日期
-			getNowFormatDate(){
-				var date=new Date()
-				var seperator='-'
-				var year=date.getFullYear()
-				var month=date.getMonth()+1
-				var day=date.getDate()
-				if(month>=1&&month<=9){
-					month='0'+month
+			getNowFormatDate() {
+				var date = new Date()
+				var seperator = '-'
+				var year = date.getFullYear()
+				var month = date.getMonth() + 1
+				var day = date.getDate()
+				if (month >= 1 && month <= 9) {
+					month = '0' + month
 				}
-				if(day>=1&&day<=9){
-					day='0'+day
+				if (day >= 1 && day <= 9) {
+					day = '0' + day
 				}
-				var currentdate=year+seperator+month+seperator+day
+				var currentdate = year + seperator + month + seperator + day
 				return currentdate
 			},
 			// 获取日期范围列表
-			getDataRangeArr(){
+			getDataRangeArr() {
 				console.log(this.getNowFormatDate())
 			},
 			// 查询家长关联的学生
 			queryPatriarchByStudent() {
-				let this_=this
+				let this_ = this
 				return new Promise((resolve, reject) => {
 					$.ajax({
 						url: gHost + '/report-push/student-consumer-report/queryPatriarchByStudent',
@@ -547,13 +552,14 @@
 						dataType: 'json',
 						contentType: 'application/x-www-form-urlencoded',
 						data: {
-							phone:getQueryParams('phone')
+							phone: getQueryParams('phone')
 						},
 						success: function(res) {
-							if(res.code==200){
-								this_.consumerNameArr=res.obj.map(element=>element.name)
-								this_.consumerInfo=res.obj
-								this_.specifiedConsumerInfo=this_.consumerInfo[this_.consumerNameIndex]
+							if (res.code == 200) {
+								this_.consumerNameArr = res.obj.map(element => element.name)
+								this_.consumerInfo = res.obj
+								this_.specifiedConsumerInfo = this_.consumerInfo[this_
+									.consumerNameIndex]
 							}
 							resolve()
 						},
@@ -564,10 +570,53 @@
 				})
 			},
 			// 查询周要点，消费金额
-			
+			queryWeekConsumerAmout() {
+				let this_ = this
+				return new Promise((resolve, reject) => {
+					$.ajax({
+						url: gHost + '/report-push/student-consumer-report/queryWeekConsumerAmout',
+						type: 'get',
+						dataType: 'json',
+						contentType: 'application/x-www-form-urlencoded',
+						data: {
+							userId: this_.specifiedConsumerInfo.id,
+							schoolId: this_.specifiedConsumerInfo.schoolid,
+							startDate: '2021-12-06',
+							endDate: '2021-12-12'
+						},
+						success: function(res) {
+							if (res.code == 200) {
+								this_.weekConsumerAmout = res.obj
+								this_.weekConsumerTrend(this_.weekConsumerAmout.compareStatus)
+							}
+							resolve()
+						},
+						error: function(error) {
+							reject(error)
+						}
+					})
+				})
+			},
+			// 周消费趋势箭头
+			weekConsumerTrend(compareStatus) {
+				switch (compareStatus) {
+					case 0:
+						this.condition = ''
+						this.trendimg = '../../static/images/trend0.png'
+						return
+					case 1:
+						this.condition = '+'
+						this.trendimg = '../../static/images/trend.png'
+						return
+					case 2:
+						this.condition = '-'
+						this.trendimg = '../../static/images/trend2.png'
+						return
+				}
+			},
 			// 日消费趋势
-			queryDayConsumerTrend(){
-				let this_=this
+			queryDayConsumerTrend() {
+				let this_ = this
 				return new Promise((resolve, reject) => {
 					$.ajax({
 						url: gHost + '/report-push/student-consumer-report/queryDayConsumerTrend',
@@ -575,16 +624,46 @@
 						dataType: 'json',
 						contentType: 'application/x-www-form-urlencoded',
 						data: {
-							userId:this_.specifiedConsumerInfo.id,
-							schoolId:this_.specifiedConsumerInfo.schoolid,
-							startDate:'2021-12-06',
-							endDate:'2021-12-12'
+							userId: this_.specifiedConsumerInfo.id,
+							schoolId: this_.specifiedConsumerInfo.schoolid,
+							startDate: '2021-12-06',
+							endDate: '2021-12-12'
+						},
+						success: function(res) {
+							if (res.code == 200) {
+								this_.dayConsumerTrend = res.obj
+								this_.dailyConsumptionData = Object.values(this_.dayConsumerTrend
+									.dayConsumerMap).reverse()
+								this_.dailyConsumptionDate = Object.keys(this_.dayConsumerTrend
+									.dayConsumerMap).map(element => element.substr(5).replace('-',
+									'/')).reverse()
+							}
+							resolve()
+						},
+						error: function(error) {
+							reject(error)
+						}
+					})
+				})
+			},
+			// 查询学生消费偏好类型
+			queryStudentConsumerPreference() {
+				let this_ = this
+				return new Promise((resolve, reject) => {
+					$.ajax({
+						url: gHost + '/report-push/student-consumer-report/queryStudentConsumerPreference',
+						type: 'get',
+						dataType: 'json',
+						contentType: 'application/x-www-form-urlencoded',
+						data: {
+							userId: this_.specifiedConsumerInfo.id,
+							schoolId: this_.specifiedConsumerInfo.schoolid,
+							startDate: '2021-12-06',
+							endDate: '2021-12-12'
 						},
 						success: function(res) {
-							if(res.code==200){
-								this_.dayConsumerTrend=res.obj
-								this_.dailyConsumptionData=Object.values(this_.dayConsumerTrend.dayConsumerMap).reverse()
-								this_.dailyConsumptionDate=Object.keys(this_.dayConsumerTrend.dayConsumerMap).map(element=>element.substr(5).replace('-','/')).reverse()
+							if (res.code == 200) {
+								this_.consumptionPreferencesData=res.obj
 							}
 							resolve()
 						},
@@ -594,6 +673,10 @@
 					})
 				})
 			},
+			// 消费偏好百分比
+			consumerPreferencePercent(num){
+				return (Math.round(num/this.consumptionPreferencesData.grossAmount*10000)/100).toFixed(1)+'%'
+			}
 		}
 	}
 </script>