统计插件,Highcharts,以及modelformset
一.modelfromset组件
1.作用:用于批量处理多个表单
form表单对应的组件是formset
Modelform对应的组件是modelformset
2.引入
From django.forms.models import modelformset_factory
3.参数(没有默认值的)
Model=Studengstudyrecord #对应的模型表
form=Studengstudyrecordmodelform #模型表对应的modelform
Extra=0 #创建几个添加的表单,不用就的美好与0
4.代码:model_formset_cls=modelformset_factory(model=StudentStudyRecord,form=StudentStudyRecordModelForm,extra=0)
5.获取取queryset
queryset = StudentStudyRecord.objects.filter(classstudyrecord=class_study_record_id)
6.构建model formset
formset = model_formset_cls(queryset=queryset)
7.前端页面
return render(request,"record_score.html",locals()) <form method="post" action="">
{% csrf_token %}
{{ formset.management_form }}
#一定要在form表单中添加{{ formset.management_form }}
<table class="table table-bordered">
<thead>
<tr>
<th>姓名</th>
<th>考勤</th>
<th>作业成绩</th>
<th>作业评语</th>
</tr>
</thead>
<tbody>
{% for form in formset %} #每一个学生记录对象
<tr>
{{ form.id }}
<td>{{ form.instance.student }}</td> #对某一个字段,不渲染select标签
<td>{{ form.instance.get_record_display }} </td>
<td>{{ form.score }} </td>
<td>{{ form.homework_note }}</td>
</tr>
{% endfor %}
</tbody>
</table>
<input type="submit" value="保存">
</form>
8.提交之后的处理
def post(self, request,class_study_record_id):
model_formset_cls = modelformset_factory(model=StudentStudyRecord, form=StudentStudyRecordModelForm, extra=0)
queryset = StudentStudyRecord.objects.filter(classstudyrecord=class_study_record_id)
print("request.POST",request.POST)
formset=model_formset_cls(request.POST)
if formset.is_valid():
formset.save() print(formset.errors) return redirect(request.path)
二. 销售额知识点
1.request.GET.get(“date”,today)
获取date,如果date取不到用today
2.datetime模块
Datetime.datetime 以年月日时分秒的格式获取时间
Datetime.date 以年月日的格式获取时间
Datetime.time 以时分秒的格式获取时间
Datetime.timedelta 可以获取时间差
例:
mounth = datetime.datetime.now().date() - datetime.timedelta(weeks=4)
Timedelta的参数:
Days:天
seconds:秒
minutes:分钟
hours:小时
weeks:周
3.统计插件
(1) Highcharts
在产品中心下载,下载的文件中有大量无用的实例,其中的code文件才是核心文件
引用时,引用的是code文件中的highchart.js
图标所放的位置用插件中给出的占位
<div id="container" style="width:400px;height:400px"></div>
核心代码放在script中
<script>
var chart = Highcharts.chart('container', {
chart: {
type: 'column'
},
title: {
text: '成单数'
},
xAxis: {
type: 'category',
labels: {
rotation: -45 // 设置轴标签旋转角度
}
},
yAxis: {
min: 0,
title: {
text: '成单个数'
}
},
legend: {
enabled: false
},
tooltip: {
pointFormat: '成单数: <b>{point.y} 个</b>'
},
series: [{
name: '总人口',
data: [[1],[2],[3]],
dataLabels: {
enabled: true,
rotation: -90,
color: '#FFFFFF',
align: 'right',
format: '{point.y:.1f}', // :.1f 为保留 1 位小数
y: 10
}
}]
});
</script>
注意:插件对数据的格式要求严格,一定要将数据转换成插件所需要的格式
(2)Echarts
原理同highchart
4.将四个视图函数合成一个视图函数(利用字典做条件区分)
condition={
"today":[{"pay_date__gte":now},{"pay_date__lte":now},{"customers__pay_date__gte":now},{"customers__pay_date__lte":now}],
"yesterday":[{"pay_date__gte":now-yesterday},{"pay_date__lte":now-yesterday},{"customers__pay_date__gte":now-yesterday},{"customers__pay_date__lte":now-yesterday}],
"week":[{"pay_date__gte":now-week},{"pay_date__lte":now},{"customers__pay_date__gte":now-week},{"customers__pay_date__lte":now}],
"mounth":[{"pay_date__gte":now-mounth},{"pay_date__lte":now},{"customers__pay_date__gte":now-mounth},{"customers__pay_date__lte":now}],
}
统计插件,Highcharts,以及modelformset的更多相关文章
- 图表插件Highcharts的动态化赋值,实现图表数据的动态化设置显示
在很早之前就介绍过图表插件Highcharts的使用了,在2014年的随笔<基于MVC4+EasyUI的Web开发框架经验总结(4)--使用图表控件Highcharts>,这里基本上都介绍 ...
- 网址访问量统计插件 FlagCounter
网址或博客访问量统计插件 ---> FlagCounter. 网址:http://s01.flagcounter.com/more/ERP2/
- hexo干货系列:(七)hexo安装统计插件
前言 前面介绍了如何让百度和谷歌收录我们的博客,那如何查看自己的博客每天被多少人访问呢~ 这里我介绍下hexo中如何使用统计插件,每天看到自己的博客访问量越来越高也是一种享受. 正文 开启统计功能 我 ...
- Javascript图表插件HighCharts用法案例
最近还在忙着基于ABP的项目,但本篇博客和ABP无关,喜欢ABP框架的朋友请点击传送门. 这不,最近项目基本功能做的差不多了,现在在做一个数据统计的功能,需要绘制区域图(或折线图)和饼图.一开始,楼主 ...
- 图表插件——Highcharts插件的使用(一柱状图)
1.下载Highcharts插件 官方下载网址:http://www.highcharts.com/download 2.引入需要的js文件 <script src="~/Script ...
- Android Studio代码行数统计插件Statistics
Android Studio 是没有提提供统计代码全部行数的功能的,但是对于开发者来说,这个功能确实必备的,Statistic统计代码行数非常方便,也很详细. 1,首先肯定是将插件下载下来,下载地址: ...
- jQuery插件Highcharts
Highcharts 是一个用纯 JavaScript 编写的一个图表库, 能够很简单便捷的在 Web 网站或是 Web 应用程序添加有交互性的图表,并且免费提供给个人学习.个人网站和非商业用途使用. ...
- IDEA07 快捷键统计插件之Key Promoter X
1 官方介绍 该插件会统计你鼠标操作的次数,然后在一个窗口中展示出来 https://plugins.jetbrains.com/plugin/9792-key-promoter-x 2 下载.安装. ...
- 1.前端数据可视化插件:Highcharts、Echarts和D3(区别)
前端数据可视化插件有很多,但我用过的只有Highcharts(https://www.hcharts.cn/).Echarts(http://echarts.baidu.com/)和D3(https: ...
随机推荐
- ckplayer 插件在线视频播放
1. CKplayer 它是一款用于网页上播放视频的插件,支持的格式有:http 协议上的 flv, f4v, mp4格式,同时支持 rtmp 视频流格式播放.使用非常简单. <html> ...
- oc面试攻略
原文出自:http://mobile.51cto.com/iphone-402619.htm 1.Object-C有多继承吗?没有的话用什么代替?cocoa 中所有的类都是NSObject 的子类 多 ...
- jQuery多库共存处理$.noConflict()
如果我们需要同时使用jQuery和其他JavaScript库,我们可以使用 $.noConflict()把$的控制权交给其他库.旧引用的$ 被保存在jQuery的初始化; noConflict() 简 ...
- Android app设置全屏模式
Android中,为APP设置全屏模式,主要有如下几种方式: 在manifest中设置 在项目中找到AndroidManifest.xml配置文件,找到Activity所在的节点,添加theme. & ...
- Adaptive device-initiated polling
A method includes periodically sending a polling call to an enterprise system outside the firewall a ...
- Ueditor 在.net core 中的使用
参考模仿了 https://blog.csdn.net/qq_34220236/article/details/80581811 这篇文章 要注意的是,去ueditor官网下的包,大多不可用. 要自己 ...
- expdp&impdp
1 创建逻辑文件夹,该命令不会在操作系统创建真正的文件夹,最好以system等管理员创建. create directory dpdata1 as '/opt/oracle/dpdata1'; c ...
- go语言刷leetcode - 53 Maximum Subarray
package main import ( "fmt" "math" ) func maxSubArray(nums []int) int { var larg ...
- windows 路径
windows下的路径分隔符是\,而不是/ hosts文件的位置:C:\Windows\system32\drivers\etc 安卓(Android)用户:Android手机hosts文件路径:/s ...
- python3 操作注册表
1.1 读取 import winreg key = winreg.OpenKey(winreg.HKEY_CURRENT_USER,r"Software\Microsoft\Windows ...