1、选择今天以及今天以前的范围:
<el-date-picker
v-model="value1"
type="date"
placeholder="选择日期"
:picker-options="pickerOptions0">
</el-date-picker>
data (){
return {
pickerOptions0: {
disabledDate(time) {
return time.getTime() > Date.now() - 8.64e6
}
},
}
}
2、分页
(1)data的值是在父组件中通过axios获取的
(2)在data变化之后,我们需要对子组件进行分页的处理
改变table绑定的data值:
<el-table :data="data_error"
border
height="600"
style="width: 100%"
:data="data_error.slice((currentPage-1)*pagesize,currentPage*pagesize)">
加入分页组件
<el-pagination
@size-change="handleSizeChange($event, "error")"
@current-change="handleCurrentChange"
:current-page="currentPage"
:page-sizes="[5, 10, 20, 40]"
:page-size="pagesize"
layout="total, sizes, prev, pager, next, jumper"
:total="data_error.length">
</el-pagination>
script:
methods:{
handleSizeChange: function (size, type) {
if (type=="trans"){
this.pagesize_trans = size;
}
else{
this.pagesize_error = size;
}
console.log(this.pagesize_trans)
console.log(this.pagesize_error)
},
handleCurrentChange: function(currentPage, type){
if (type=="trans"){
this.currentPage_trans = currentPage;
}
else{
this.currentPage_error = currentPage;
}
console.log(currentPage)
},
}
通过javascript来分条件改变相关参数
3、汇总数据
打算的是在后端返回的时候直接返回汇总的数据:
在view添加:
'sum_data': all_day_filter.aggregate(trans_count=Sum('count'), success_count=Sum('count', filter=Q(error_code=0)),
succ_rate=(Sum('count', filter=Q(error_code=0), output_field=FloatField()) / Sum(F('count'), output_field=FloatField()))*100,
trans_efficiency=(Sum('total_trans_duration', output_field=FloatField()) / Sum('total_inputfile_duration', output_field=FloatField()))*100,
)
一开始使用的是annotate,出现了id unknown的错误,估计就是没有一个指定的字段作为特殊的字段就不行,所以后来就改成了aggregate就行了,我真是个小机灵鬼
在serializer添加:
sum_data = serializers.DictField()
就好啦
还有问题:
诶就是数据太大传不过来