Skip to content

X
xzf_uniapp-wechat-web
Commit 1baeb1c2 authored by 李智书's avatar 李智书
Browse files
Options

1.提交更新;

parent ab7fc926
Hide whitespace changes
Inline Side-by-side
Showing with 206 additions and 36 deletions
src/pages/ConsumptionReport/ConsumptionReport.vue
View file @ 1baeb1c2
...@@ -43,7 +43,8 @@ ...@@ -43,7 +43,8 @@
</view> </view>
<view class="consumption-total-number-trend"> <view class="consumption-total-number-trend">
<view class="consumption-total-number-trend-item"> <view class="consumption-total-number-trend-item">
{{condition+weekConsumerAmout.compareAmount}} <text>{{['','+','-'][weekConsumerAmout.compareStatus]}}</text>
{{weekConsumerAmout.compareAmount}}
</view> </view>
<view <view
class="consumption-total-number-trend-item consumption-total-number-trend-percent"> class="consumption-total-number-trend-item consumption-total-number-trend-percent">
...@@ -60,7 +61,14 @@ ...@@ -60,7 +61,14 @@
环比上周 环比上周
</view> </view>
<view class="consumption-total-text-contrast-img"> <view class="consumption-total-text-contrast-img">
<image class="consumption-total-text-trend-img" :src="trendimg"> <image class="consumption-total-text-trend-img"
v-if="weekConsumerAmout.compareStatus==0" src="../../static/images/trend0.png">
</image>
<image class="consumption-total-text-trend-img"
v-if="weekConsumerAmout.compareStatus==1" src="../../static/images/trend.png">
</image>
<image class="consumption-total-text-trend-img"
v-if="weekConsumerAmout.compareStatus==2" src="../../static/images/trend2.png">
</image> </image>
</view> </view>
</view> </view>
...@@ -145,6 +153,10 @@ ...@@ -145,6 +153,10 @@
{{dailyConsumptionDate[index]}} {{dailyConsumptionDate[index]}}
</view> </view>
</view> </view>
<!-- -->
<view class="noConsumptionData" v-if="dailyConsumptionData.length==0">
暂无更多数据
</view>
</view> </view>
</view> </view>
</view> </view>
...@@ -161,6 +173,7 @@ ...@@ -161,6 +173,7 @@
</view> </view>
</view> </view>
<view class="consumption-preferences"> <view class="consumption-preferences">
<!-- 食堂消费 -->
<view class="consumption-preferences-list"> <view class="consumption-preferences-list">
<view class="consumption-preferences-list-img"> <view class="consumption-preferences-list-img">
<image class="consumption-preferences-img" src="../../static/images/canteen.png" <image class="consumption-preferences-img" src="../../static/images/canteen.png"
...@@ -174,7 +187,7 @@ ...@@ -174,7 +187,7 @@
食堂消费 食堂消费
</view> </view>
<view class="consumption-preferences-list-item-text-item-percent"> <view class="consumption-preferences-list-item-text-item-percent">
{{percentArr[0]}} {{percentArr(1,consumptionPreferencesData)}}
</view> </view>
</view> </view>
<view class="consumption-preferences-list-item-text-cash"> <view class="consumption-preferences-list-item-text-cash">
...@@ -183,12 +196,13 @@ ...@@ -183,12 +196,13 @@
</view> </view>
<view class="consumption-preferences-list-item-proportion"> <view class="consumption-preferences-list-item-proportion">
<view class="consumption-preferences-list-item-proportion-active" <view class="consumption-preferences-list-item-proportion-active"
:style="{width:widthArr[0]+'rpx'}"> :style="{width:widthArr(1,consumptionPreferencesData)+'rpx'}">
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<!-- 超市消费 -->
<view class="consumption-preferences-list"> <view class="consumption-preferences-list">
<view class="consumption-preferences-list-img"> <view class="consumption-preferences-list-img">
<image class="consumption-preferences-img" src="../../static/images/supermarket.png" <image class="consumption-preferences-img" src="../../static/images/supermarket.png"
...@@ -202,7 +216,7 @@ ...@@ -202,7 +216,7 @@
超市消费 超市消费
</view> </view>
<view class="consumption-preferences-list-item-text-item-percent"> <view class="consumption-preferences-list-item-text-item-percent">
{{percentArr[1]}} {{percentArr(2,consumptionPreferencesData)}}
</view> </view>
</view> </view>
<view class="consumption-preferences-list-item-text-cash"> <view class="consumption-preferences-list-item-text-cash">
...@@ -211,12 +225,13 @@ ...@@ -211,12 +225,13 @@
</view> </view>
<view class="consumption-preferences-list-item-proportion"> <view class="consumption-preferences-list-item-proportion">
<view class="consumption-preferences-list-item-proportion-active" <view class="consumption-preferences-list-item-proportion-active"
:style="{width:widthArr[1]+'rpx'}"> :style="{width:widthArr(2,consumptionPreferencesData)+'rpx'}">
</view> </view>
</view> </view>
</view> </view>
</view> </view>
<!-- 其他消费 -->
<view class="consumption-preferences-list"> <view class="consumption-preferences-list">
<view class="consumption-preferences-list-img"> <view class="consumption-preferences-list-img">
<image class="consumption-preferences-img" src="../../static/images/other.png" mode=""> <image class="consumption-preferences-img" src="../../static/images/other.png" mode="">
...@@ -229,7 +244,7 @@ ...@@ -229,7 +244,7 @@
其他消费 其他消费
</view> </view>
<view class="consumption-preferences-list-item-text-item-percent"> <view class="consumption-preferences-list-item-text-item-percent">
{{percentArr[2]}} {{percentArr(2,consumptionPreferencesData)}}
</view> </view>
</view> </view>
<view class="consumption-preferences-list-item-text-cash"> <view class="consumption-preferences-list-item-text-cash">
...@@ -238,7 +253,7 @@ ...@@ -238,7 +253,7 @@
</view> </view>
<view class="consumption-preferences-list-item-proportion"> <view class="consumption-preferences-list-item-proportion">
<view class="consumption-preferences-list-item-proportion-active" <view class="consumption-preferences-list-item-proportion-active"
:style="{width:widthArr[2]+'rpx'}"> :style="{width:widthArr(3,consumptionPreferencesData)+'rpx'}">
</view> </view>
</view> </view>
...@@ -471,6 +486,10 @@ ...@@ -471,6 +486,10 @@
} }
// 时间处理模块 // 时间处理模块
import dayjs from 'dayjs' import dayjs from 'dayjs'
import {
Dialog,
Toast
} from 'vant';
export default { export default {
name: 'ConsumptionReport', name: 'ConsumptionReport',
data() { data() {
...@@ -486,11 +505,16 @@ ...@@ -486,11 +505,16 @@
condition: '', condition: '',
trendimg: '', trendimg: '',
// 日期范围列表 // 日期范围列表
dataRangeArr: ['12月06日~12月12日', '11月29日~12月05日', '11月22日~11月28日'], dataRangeArr: [{
week: "",
startDate: "",
endDate: ""
}],
// 日消费趋势图表数据 // 日消费趋势图表数据
dailyConsumptionData: [], dailyConsumptionData: [],
dailyConsumptionDate: [], dailyConsumptionDate: [],
consumptionPreferencesData: [], // 消费偏好数据 // 消费偏好数据
consumptionPreferencesData: {},
} }
}, },
computed: { computed: {
...@@ -498,14 +522,61 @@ ...@@ -498,14 +522,61 @@
return this.dailyConsumptionData.map(data => data / Math.max(...this.dailyConsumptionData) * 266) return this.dailyConsumptionData.map(data => data / Math.max(...this.dailyConsumptionData) * 266)
}, },
percentArr() { percentArr() {
return this.consumptionPreferencesData.map(data => ((data / this.consumptionPreferencesData.grossAmount * // return this.consumptionPreferencesData.map(data => ((data / this.consumptionPreferencesData.grossAmount *
10000) / 100).toFixed(1) + '%') // 10000) / 100).toFixed(1) + '%')
return function(type, data2) {
if (!data2.grossAmount) {
return '';
}
let {
canteenAmount,
grossAmount,
supermarketAmount,
otherAmount
} = data2
switch (type) {
case 1:
return (Math.round((canteenAmount / grossAmount) * 100)) + '%'
break;
case 2:
return (Math.round((supermarketAmount / grossAmount) * 100)) + '%'
break;
case 3:
return (Math.round((otherAmount / grossAmount) * 100)) + '%'
break;
default:
return ''
break;
}
}
}, },
widthArr() { widthArr() {
var consumptionPreferencesTotal = this.consumptionPreferencesData.reduce((preValue, curValue) => preValue + return function(type, data2) {
curValue) if (!data2.grossAmount) {
return this.consumptionPreferencesData.map(data => (Math.round(data / consumptionPreferencesTotal * return '';
10000) / 100).toFixed(1) / 100 * 472) }
let {
canteenAmount,
grossAmount,
supermarketAmount,
otherAmount
} = data2
switch (type) {
case 1:
return ((canteenAmount / grossAmount)) * 472
break;
case 2:
return ((supermarketAmount / grossAmount)) * 472
break;
case 3:
return ((otherAmount / grossAmount)) * 472
break;
default:
return ''
break;
}
}
} }
}, },
mounted() { mounted() {
...@@ -513,6 +584,7 @@ ...@@ -513,6 +584,7 @@
this.queryDayConsumerTrend() this.queryDayConsumerTrend()
this.queryWeekConsumerAmout() this.queryWeekConsumerAmout()
this.queryStudentConsumerPreference() this.queryStudentConsumerPreference()
this.queryNotRepastDetails()
}) })
this.getDataRangeArr() this.getDataRangeArr()
...@@ -524,7 +596,7 @@ ...@@ -524,7 +596,7 @@
// console.warn("一周开始-----", dayjs().subtract(i, 'week').startOf('week').add(1, 'day').format("YYYY年MM月DD日")) // console.warn("一周开始-----", dayjs().subtract(i, 'week').startOf('week').add(1, 'day').format("YYYY年MM月DD日"))
// console.warn("一周结束-----", dayjs().subtract(i, 'week').endOf('week').add(1, 'day').format("YYYY年MM月DD日")) // console.warn("一周结束-----", dayjs().subtract(i, 'week').endOf('week').add(1, 'day').format("YYYY年MM月DD日"))
tmpArr.push({ tmpArr.push({
week: (startWeek.format("YYYY年MM月DD日")) + '~' + (endWeek.format("YYYY年MM月DD日")), week: (startWeek.format("MM月DD日")) + '~' + (endWeek.format("MM月DD日")),
startDate: startWeek.format("YYYY-MM-DD"), startDate: startWeek.format("YYYY-MM-DD"),
endDate: endWeek.format("YYYY-MM-DD") endDate: endWeek.format("YYYY-MM-DD")
}) })
...@@ -536,10 +608,16 @@ ...@@ -536,10 +608,16 @@
this.consumerNameIndex = e.target.value this.consumerNameIndex = e.target.value
this.specifiedConsumerInfo = this.consumerInfo[this.consumerNameIndex] this.specifiedConsumerInfo = this.consumerInfo[this.consumerNameIndex]
this.queryDayConsumerTrend() this.queryDayConsumerTrend()
this.queryWeekConsumerAmout()
this.queryStudentConsumerPreference()
this.queryNotRepastDetails()
}, },
dataRangeChange(e) { dataRangeChange(e) {
this.dataRangeIndex = e.target.value this.dataRangeIndex = e.target.value
this.queryDayConsumerTrend() this.queryDayConsumerTrend()
this.queryWeekConsumerAmout()
this.queryStudentConsumerPreference()
this.queryNotRepastDetails()
}, },
// 获取当前日期 // 获取当前日期
getNowFormatDate() { getNowFormatDate() {
...@@ -588,6 +666,92 @@ ...@@ -588,6 +666,92 @@
}) })
}) })
}, },
// 查询未就餐详情
async queryNotRepastDetails() {
let this_ = this
try {
await new Promise((resolve, reject) => {
$.ajax({
url: gHost +
'/report-push/student-consumer-report/queryNotRepastDetails',
type: 'get',
dataType: 'json',
contentType: 'application/x-www-form-urlencoded',
data: {
userId: this_.specifiedConsumerInfo.id || "",
schoolId: this_.specifiedConsumerInfo.schoolid || "",
startDate: this_.dataRangeArr[this_.dataRangeIndex] ? this_
.dataRangeArr[this_.dataRangeIndex].startDate : "",
endDate: this_.dataRangeArr[this_.dataRangeIndex] ? this_.dataRangeArr[
this_.dataRangeIndex].endDate : "",
},
success: function(res) {
if (res.code == 200) {
if (!res.obj) {
reject(res.msg)
return
}
return
}
reject(res.msg)
},
error: function(error) {
reject(error)
}
})
})
} catch (e) {
console.warn(e)
Dialog({
title: '系统提示',
message: e.message || e
});
}
},
// 查询学生消费偏好类型
async queryStudentConsumerPreference() {
let this_ = this
try {
await 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: this_.dataRangeArr[this_.dataRangeIndex] ? this_
.dataRangeArr[this_.dataRangeIndex].startDate : "",
endDate: this_.dataRangeArr[this_.dataRangeIndex] ? this_.dataRangeArr[
this_.dataRangeIndex].endDate : "",
},
success: function(res) {
if (res.code == 200) {
if (!res.obj) {
reject(res.msg)
return
}
this_.consumptionPreferencesData = res.obj
resolve()
return
}
reject(res.msg)
},
error: function(error) {
reject(error)
}
})
})
} catch (e) {
console.warn(e)
Dialog({
title: '系统提示',
message: e.message || e
});
}
},
// 查询周要点，消费金额 // 查询周要点，消费金额
async queryWeekConsumerAmout() { async queryWeekConsumerAmout() {
let this_ = this let this_ = this
...@@ -608,19 +772,15 @@ ...@@ -608,19 +772,15 @@
}, },
success: function(res) { success: function(res) {
if (res.code == 200) { if (res.code == 200) {
this_.dayConsumerTrend = res.obj if (!res.obj) {
this_.dailyConsumptionData = Object.values(this_ reject(res.msg)
.dayConsumerTrend return
.dayConsumerMap).reverse() }
this_.dailyConsumptionDate = Object.keys(this_.dayConsumerTrend this_.weekConsumerAmout = res.obj
.dayConsumerMap).map(element => element.substr(5)
.replace(
'-',
'/')).reverse()
resolve() resolve()
return return
} }
reject(res.message) reject(res.msg)
}, },
error: function(error) { error: function(error) {
reject(error) reject(error)
...@@ -629,10 +789,10 @@ ...@@ -629,10 +789,10 @@
}) })
} catch (e) { } catch (e) {
console.warn(e) console.warn(e)
//TODO handle the exception Dialog({
uni.showModal({ title: '系统提示',
content: e.message message: e.message || e
}) });
} }
}, },
// 日消费趋势 // 日消费趋势
...@@ -655,6 +815,10 @@ ...@@ -655,6 +815,10 @@
}, },
success: function(res) { success: function(res) {
if (res.code == 200) { if (res.code == 200) {
if (!res.obj) {
reject(res.msg)
return
}
this_.dayConsumerTrend = res.obj this_.dayConsumerTrend = res.obj
this_.dailyConsumptionData = Object.values(this_ this_.dailyConsumptionData = Object.values(this_
.dayConsumerTrend .dayConsumerTrend
...@@ -667,7 +831,7 @@ ...@@ -667,7 +831,7 @@
resolve() resolve()
return return
} }
reject(res.message) reject(res.msg)
}, },
error: function(error) { error: function(error) {
reject(error) reject(error)
...@@ -676,10 +840,10 @@ ...@@ -676,10 +840,10 @@
}) })
} catch (e) { } catch (e) {
console.warn(e) console.warn(e)
//TODO handle the exception Dialog({
uni.showModal({ title: '系统提示',
content: e.message message: e.message || e
}) });
} }
}, },
// 消费偏好百分比 // 消费偏好百分比
...@@ -1333,5 +1497,11 @@ ...@@ -1333,5 +1497,11 @@
} }
} }
.noConsumptionData {
width: 100%;
text-align: center;
line-height: 260rpx;
}
} }
</style> </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