zoukankan      html  css  js  c++  java

  • 报账系统总结(1):路由分配/数据库/主页/注册/登陆

    项目 

    1. 路由分配

    1.1 知识点

    1. 为区分主页index中不同的标签请求，使用正则路由匹配
    2. 路由匹配为空时，从上向下匹配时，若上面没有匹配到，则会执行空对应的路由函数

    1.2 示例代码

    1. urls.py
    1. # filename: urls.py 
    2. from django.contrib import admin 
    3. from django.urls import path 
    4. from django.conf.urls import url 
    5. from app01 import views 
    6.  
    7. urlpatterns = [ 
    8. path('admin/', admin.site.urls), 
    9. # 正则别名 便于取数据 
    10. url(r'^all/(?P<type_id>d+)', views.index), 
    11. url(r'^login/', views.login), 
    12. url(r'^register/', views.register), 
    13. url(r'^check_code/', views.check_code), 
    14. url(r'^upload_avatar/', views.upload_avatar), 
    15. url(r'^', views.index), 
    16. ] 

    2. 数据库

    2.1 知识点

    1. auto_now_add 与 auto_now的区别
    2. ManyToMany 正反向操作
    3. 联合唯一索引与ManyToMany混合使用
    4. OneToOneField的正反向操作
    5. 枚举的使用

    2.2 示例代码

    1. models.py
    1. # filename: models.py 
    2. from django.db import models 
    3.  
    4.  
    5. class UserInfo(models.Model): 
    6. ''' 
    7. 用户信息表 
    8. ''' 
    9. nid = models.BigAutoField(primary_key=True) 
    10. username = models.CharField(verbose_name='用户名', max_length=32, unique=True) 
    11. password = models.CharField(verbose_name='密码', max_length=64) 
    12. nickname = models.CharField(verbose_name='昵称', max_length=32) 
    13. email = models.EmailField(verbose_name='邮箱', unique=True) 
    14. avatar = models.ImageField(verbose_name='头像') 
    15. # 注意创建时间 
    16. create_time = models.DateField(verbose_name='创建时间', auto_now_add=True) 
    17. # U2U 
    18. U2U = models.ManyToManyField(verbose_name='粉丝们', 
    19. to='UserInfo', 
    20. through='UserFans', 
    21. through_fields=('user', 'follwers'), 
    22. related_name='fans', 
    23. ) 
    24.  
    25.  
    26. class UserFans(models.Model): 
    27. ''' 
    28. 互粉关系表 
    29. ''' 
    30. nid = models.BigAutoField(primary_key=True) 
    31. user = models.ForeignKey(verbose_name='博主', to='UserInfo', to_field='nid', related_name='user', on_delete=models.CASCADE) 
    32. follwers = models.ForeignKey(verbose_name='粉丝', to='UserInfo', to_field='nid', related_name='follwers', on_delete=models.CASCADE) 
    33.  
    34. # 联合唯一索引 
    35. class Meta: 
    36. unique_together = [ 
    37. ('user', 'follwers'), 
    38. ] 
    39.  
    40.  
    41. class Blog(models.Model): 
    42. ''' 
    43. 博客信息表 
    44. ''' 
    45. nid = models.BigAutoField(primary_key=True) 
    46. title = models.CharField(verbose_name='个人博客标题', max_length=64) 
    47. theme = models.CharField(verbose_name='个人博客主题', max_length=32) 
    48. site = models.CharField(verbose_name='个人博客域名', max_length=32, unique=True) 
    49. user = models.OneToOneField(verbose_name='博客用户', to='UserInfo', to_field='nid', on_delete=models.CASCADE) 
    50.  
    51.  
    52. class Article(models.Model): 
    53. ''' 
    54. 文章信息表 
    55. ''' 
    56. nid = models.BigAutoField(primary_key=True) 
    57. title = models.CharField(verbose_name='文章标题', max_length=128) 
    58. summary = models.CharField(verbose_name='文章简介', max_length=255) 
    59. create_time = models.DateTimeField(verbose_name='创建时间', auto_now_add=True) 
    60. blog = models.ForeignKey(verbose_name='所属博客', to='Blog', to_field='nid', on_delete=models.CASCADE) 
    61. category = models.ForeignKey(verbose_name='文章类型', to='Category', to_field='nid', null=True, on_delete=models.CASCADE) 
    62.  
    63. # 因为牵扯到多次从数据库中获取，会造成多次查询 故直接将常用信息放到article中 
    64. # 数据冗余 
    65. read_count = models.IntegerField(default=0) 
    66. comment_count = models.IntegerField(default=0) 
    67. up_count = models.IntegerField(default=0) 
    68. down_count = models.IntegerField(default=0) 
    69.  
    70. type_choice = [ 
    71. (1, 'Python'), 
    72. (2, 'Linux'), 
    73. (3, '人工智能'), 
    74. (4, '区块链'), 
    75. (5, 'Golang'), 
    76. ] 
    77.  
    78. # 主页文章分类 
    79. article_type_id = models.IntegerField(choices=type_choice, default=None) 
    80.  
    81. # article to tag 
    82. tags = models.ManyToManyField(verbose_name='标签类型', 
    83. to='Tag', 
    84. through='Article2Tag', 
    85. through_fields=('article', 'tag')) 
    86.  
    87.  
    88. class Category(models.Model): 
    89. ''' 
    90. 个人用户文章分类 
    91. ''' 
    92. nid = models.AutoField(primary_key=True) 
    93. title = models.CharField(verbose_name='分类标题', max_length=32) 
    94. blog = models.ForeignKey(verbose_name='所属博客', to='Blog', to_field='nid', on_delete=models.CASCADE) 
    95.  
    96.  
    97. class Tag(models.Model): 
    98. ''' 
    99. 标签表 
    100. ''' 
    101. nid = models.AutoField(primary_key=True) 
    102. title = models.CharField(verbose_name='标签名称', max_length=32 ) 
    103. blog = models.ForeignKey(verbose_name='所属博客', to='Blog', to_field='nid', on_delete=models.CASCADE) 
    104.  
    105.  
    106. class Article2Tag(models.Model): 
    107. ''' 
    108. 文章to标签 多对多 关系表 
    109. ''' 
    110. nid = models.BigAutoField(primary_key=True) 
    111. article = models.ForeignKey(verbose_name='文章', to='Article', to_field='nid', on_delete=models.CASCADE) 
    112. tag = models.ForeignKey(verbose_name='标签', to='Tag', to_field='nid', on_delete=models.CASCADE) 
    113.  
    114. class Meta: 
    115. unique_together = [ 
    116. ('article', 'tag'), 
    117. ] 
    118.  
    119.  
    120. class ArticleDetail(models.Model): 
    121. ''' 
    122. 文章详细表 
    123. ''' 
    124. content = models.TextField(verbose_name='文章内容') 
    125. article = models.OneToOneField(verbose_name='所属文章', to='Article', to_field='nid', on_delete=models.CASCADE) 
    126.  
    127.  
    128. class UpDown(models.Model): 
    129. ''' 
    130. 文章 顶/踩 
    131. ''' 
    132. article = models.ForeignKey(verbose_name='所属文章', to='Article', to_field='nid', on_delete=models.CASCADE) 
    133. user = models.ForeignKey(verbose_name='顶或踩的用户', to='UserInfo', to_field='nid', on_delete=models.CASCADE) 
    134. up = models.BooleanField(verbose_name='是否赞') 
    135.  
    136. class Meta: 
    137. unique_together = [ 
    138. ('article', 'user'), 
    139. ] 
    140.  
    141.  
    142. class Comment(models.Model): 
    143. ''' 
    144. 文章评论表 
    145. ''' 
    146. nid = models.BigAutoField(primary_key=True) 
    147. content = models.CharField(verbose_name='评论内容', max_length=255) 
    148. create_time = models.DateTimeField(verbose_name='评论时间', auto_now_add=True) 
    149. article = models.ForeignKey(verbose_name='被评论文章', to='Article', to_field='nid', on_delete=models.CASCADE) 
    150. user = models.ForeignKey(verbose_name='评论者', to='UserInfo', to_field='nid', on_delete=models.CASCADE) 
    151. reply = models.ForeignKey(verbose_name='被回复评论', to='self', to_field='nid', null=True, on_delete=models.CASCADE) 

    3. 主页

    3.1 知识点

    1. 获取当前请求request的URL
    2. 数据库操作models.filter(**kwargs)为空字典时，将会获取全部数据
    3. 通过数据库中的枚举，实现显示主页的标签
    4. BootStrap中 class 默认navbar是圆角的 如果不想要 则需自己定制 类 no-radius
    5. container-fluid 表示100%平铺 如果改成container 就可以设置宽度 并且container中包括响应式
    6. 前端可直接调用request
    7. 前端中文字与图片的排版
    8. BootStrap中 class = ‘clearfix’ 相当于在类所在标签的最后增加一个空标签 clear：both 用于清除浮动

    3.2 示例代码

    1. Views.py
    1. # filename： views.py 
    2. def index(request, *args, **kwargs): 
    3. ''' 
    4. 主页 
    5. :param request: 
    6. :param args: 
    7. :param kwargs: 
    8. :return: 
    9. ''' 
    10. result = request.session.get('username') 
    11. if result: 
    12.  
    13. # 分页 
    14. # 获取当前URL request.path_info 
    15. current_page = request.GET.get('page') 
    16. base_url = request.path_info 
    17.  
    18. # 标签分类 
    19. # 基本方式一 
    20. # type_id = int(kwargs.get('type_id')) if kwargs.get('type_id') else None 
    21. # if type_id: 
    22. # article_list = models.Article.objects.filter(article_type_id=type_id) 
    23. # else: 
    24. # article_list = models.Article.objects.all() 
    25.  
    26. # 方式二 
    27. content = {} 
    28. type_id = int(kwargs.get('type_id')) if kwargs.get('type_id') else None 
    29. if type_id: 
    30. content['article_type_id'] = type_id 
    31. # 注意此处 filter条件为空字典的时候获取全部数据 
    32. # ******分页 
    33. all_count = models.Article.objects.filter(**content).count() 
    34. page_info = PageInfo(current_page, all_count, 10, base_url, 11) 
    35. # ******分页 
    36. article_list = models.Article.objects.filter(**content)[page_info.start():page_info.end()] 
    37.  
    38. type_choice = models.Article.type_choice 
    39. login_flag = True 
    40. return render(request, 'index.html', { 
    41. 'type_choice': type_choice, 
    42. 'article_list': article_list, 
    43. 'type_id': type_id, 
    44. 'page_info': page_info, 
    45. 'login_flag': login_flag 
    46. }) 
    47. else: 
    48. return redirect('/login/') 
    1. index.html
    1. <!--filename:index.html --> 
    2. <!DOCTYPE html> 
    3. <html lang="en"> 
    4. <head> 
    5. <meta charset="UTF-8"> 
    6. <meta http-equiv="x-ua-compatible" content="IE=edge"> 
    7. <meta name="viewport" content="width=device-width, initial-scale=1"> 
    8. <title>Title</title> 
    9. <link rel="stylesheet" href="/static/plugins/bootstrap-3.3.7-dist/css/bootstrap.css"> 
    10. <link rel="stylesheet" href="/static/css/commons.css"> 
    11. <link rel="stylesheet" href="/static/plugins/fontawesome-free-5.1.0-web/css/fontawesome.css"> 
    12.  
    13. </head> 
    14.  
    15. <body> 
    16. <!-- 默认navbar是圆角的 如果不想要 则需自己定制 类 no-radius --> 
    17. <nav class="navbar navbar-default no-radius"> 
    18. <!-- ******** --> 
    19. <!-- container-fluid 表示100%平铺 如果改成container 就可以设置宽度 --> 
    20. <!-- 并且container中包括响应式 --> 
    21. <div class="container"> 
    22. <!-- Brand and toggle get grouped for better mobile display --> 
    23. <div class="navbar-header"> 
    24. <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" 
    25. data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> 
    26. <span class="sr-only">Toggle navigation</span> 
    27. <span class="icon-bar"></span> 
    28. <span class="icon-bar"></span> 
    29. <span class="icon-bar"></span> 
    30. </button> 
    31. <a class="navbar-brand" href="/">老子的技术论坛</a> 
    32. </div> 
    33.  
    34. <!-- Collect the nav links, forms, and other content for toggling --> 
    35. <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> 
    36. <ul class="nav navbar-nav"> 
    37. {% if type_id %} 
    38. <li><a href="/">全部</a></li> 
    39. {% else %} 
    40. <li class="active"><a href="/">全部</a></li> 
    41. {% endif %} 
    42. {% for item in type_choice %} 
    43. {% if type_id == item.0 %} 
    44. <li class="active"><a href="/all/{{ item.0 }}/">{{ item.1 }}</a></li> 
    45. {% else %} 
    46. <li><a href="/all/{{ item.0 }}/">{{ item.1 }}</a></li> 
    47. {% endif %} 
    48. {% endfor %} 
    49. </ul> 
    50. <ul class="nav navbar-nav navbar-right"> 
    51. {% if login_flag %} 
    52. <!-- 注意此处--> 
    53. <li><a href="#">{{ request.session.username }}</a></li> 
    54. <li><a href="#">我的博客</a></li> 
    55. <li><a href="#">管理</a></li> 
    56. <li><a href="#">退出</a></li> 
    57.  
    58. {% else %} 
    59. <li><a href="/login/">登陆</a></li> 
    60. <li><a href="#">注册</a></li> 
    61. {% endif %} 
    62. </ul> 
    63. </div><!-- /.navbar-collapse --> 
    64. </div><!-- /.container-fluid --> 
    65. </nav> 
    66.  
    67. <div class="container"> 
    68. <div class="col-md-8"> 
    69. <div class="article-list"> 
    70. {% for article in article_list %} 
    71. <div class="article-item"> 
    72. <h4 class="article-head"><a>{{ article.title }}</a></h4> 
    73. <div class="article-body clearfix"> 
    74. <a class="left"><img src="{{ article.blog.user.avatar }}"></a> 
    75. {{ article.summary }} 
    76. <!-- clearfix相当于在此处增加一个标签 clear:both --> 
    77. </div> 
    78. <div class="article-foot"> 
    79. <a> 
    80. <span class="glyphicon glyphicon-user"></span> 
    81. {{ article.blog.user.username }} 
    82. </a> 
    83. <span> 
    84. 发布于 {{ article.create_time|date:"Y-m-d H:i:s" }} 
    85. </span> 
    86. <a href="#"> 
    87. <span class="glyphicon glyphicon-pencil"></span> 
    88. {{ article.comment_count }} 
    89. </a> 
    90. <a href="#"> 
    91. <span class="glyphicon glyphicon-thumbs-up"></span> 
    92. {{ article.up_count }} 
    93. </a> 
    94. </div> 
    95.  
    96. </div> 
    97. {% endfor %} 
    98. </div> 
    99. <div> 
    100. <nav aria-label="Page navigation"> 
    101. <ul class="pagination"> 
    102. {{ page_info.page|safe}} 
    103. </ul> 
    104. </nav> 
    105. </div> 
    106. </div> 
    107. <div class="col-md-4"> 
    108. <div class="panel panel-default"> 
    109. <div class="panel-heading">Panel heading without title</div> 
    110. <div class="panel-body"> 
    111. <p>123</p> 
    112. <p>123</p> 
    113. <p>123</p> 
    114. <p>123</p> 
    115. <p>123</p> 
    116. </div> 
    117. </div> 
    118.  
    119. <div class="panel panel-default"> 
    120. <div class="panel-heading">Panel heading without title</div> 
    121. <div class="panel-body"> 
    122. Panel content 
    123. </div> 
    124. </div> 
    125. </div> 
    126. </div> 
    127.  
    128. </body> 
    129. </html> 

    4. 注册

    4.1 知识点

    4.2 示例代码

    1. forms.py
    2. register.html
    3. Views.py

    5. 登陆

    5.1 知识点

    5.2 示例代码

    1. login.html
    1. <!DOCTYPE html> 
    2. <html lang="en"> 
    3. <head> 
    4. <meta charset="UTF-8"> 
    5. <meta http-equiv="x-ua-compatible" content="IE=edge"> 
    6. <meta name="viewport" content="width=device-width, initial-scale=1"> 
    7. <title>Title</title> 
    8. <link rel="stylesheet" href="/static/plugins/bootstrap-3.3.7-dist/css/bootstrap.css"> 
    9.  
    10. <style> 
    11. .login { 
    12. margin: 0 auto; 
    13. width: 600px; 
    14. padding: 20px; 
    15. margin-top: 80px; 
    16. } 
    17.  
    18. .head { 
    19. text-align: center; 
    20. padding: 10px; 
    21. margin-bottom: 20px; 
    22. margin-left: 90px; 
    23. margin-top: -60px; 
    24. } 
    25.  
    26. .logined, .register { 
    27. width: 460px; 
    28. } 
    29. </style> 
    30. </head> 
    31.  
    32. <body> 
    33. <div class="login"> 
    34. <div class="head"> 
    35. <h2><a href="/login/">用户登陆</a></h2> 
    36. </div> 
    37.  
    38. <div> 
    39. <form class="form-horizontal" novalidate method="post" action="/login/"> 
    40. {% csrf_token %} 
    41. {% for row in range %} 
    42. <div class="form-group"> 
    43. <label class="col-sm-2 control-label">用户名</label> 
    44. <div class="col-sm-10"> 
    45. <!-- <input type="email" class="form-control" placeholder="用户名">--> 
    46. {{ my_login_form.username }}{{ my_login_form.errors.username.0 }}{{ user_error }} 
    47. </div> 
    48. </div> 
    49. <div class="form-group"> 
    50. <label class="col-sm-2 control-label">密码</label> 
    51. <div class="col-sm-10"> 
    52. <!-- <input type="password" class="form-control" placeholder="密码">--> 
    53. {{ my_login_form.password }}{{ my_login_form.errors.password.0 }} 
    54. </div> 
    55. </div> 
    56. <div class="form-group"> 
    57. <label class="col-sm-2 control-label">验证码</label> 
    58. <div class="col-sm-3"> 
    59. <!-- <input type="text" class="form-control" placeholder="验证码">--> 
    60. {{ my_login_form.code }}{{ my_login_form.errors.code.0 }}{{ code_error }} 
    61. </div> 
    62. <div class="col-sm-5"> 
    63. <!--验证码刷新原理--> 
    64. <!--get方式请求 url后面加东西 不影响访问 但会刷新--> 
    65. <!--/check_code/?--> 
    66. <img id="check_code" style=" 120px;height: 30px" src="/check_code/"> 
    67.  
    68. </div> 
    69. </div> 
    70. <div class="form-group"> 
    71. <div class="col-sm-offset-2 col-sm-10"> 
    72. <button type="submit" class="btn btn-default logined">登陆</button> 
    73. </div> 
    74. </div> 
    75. <div class="form-group"> 
    76. <div class="col-sm-offset-2 col-sm-10"> 
    77. <a href="/register/"> 
    78. <button type="button" class="btn btn-default register">注册</button> 
    79. </a>x 
    80. </div> 
    81. </div> 
    82. </form> 
    83. </div> 
    84. </div> 
    85. <script src="/static/jquery-3.3.1.js"></script> 
    86. <script> 
    87. // 验证码图片刷新 
    88. $('#check_code').click(function () { 
    89. $('#check_code')[0].src = $('#check_code')[0].src + '?' 
    90. }) 
    91.  
    92. </script> 
    93.  
    94. </body> 
    95. </html> 
    1. form.py
    1. # filename: form.py 
    2. class MyLoginForm(Form): 
    3. ''' 
    4. 用户登陆Form 
    5. ''' 
    6. username = fields.CharField(max_length=32, 
    7. error_messages={ 
    8. 'required': '用户名不能为空', 
    9. 'max_length': '用户名最多为32个字符', 
    10. }, 
    11. widget=widgets.TextInput( 
    12. attrs={ 
    13. 'class': "form-control", 
    14. 'placeholder': "用户名", 
    15. } 
    16. )) 
    17. password = fields.CharField( 
    18. max_length=32, 
    19. min_length=6, 
    20. error_messages={ 
    21. 'required': '密码不能为空', 
    22. 'max_length': '密码最多为32个字符', 
    23. 'min_length': '密码最多为6个字符', 
    24. }, 
    25. widget=widgets.PasswordInput( 
    26. attrs={ 
    27. 'name': 'password', 
    28. 'class': "form-control", 
    29. 'placeholder': "密码", 
    30. })) 
    31. code = fields.CharField(max_length=5, min_length=5, 
    32. error_messages={ 
    33. 'required': '验证码不能为空', 
    34. 'max_length': '验证码只能为5个字符', 
    35. 'min_length': '验证码只能为5个字符', 
    36. }, 
    37. widget=widgets.TextInput( 
    38. attrs={ 
    39.  
    40. 'class': "form-control", 
    41. 'placeholder': "验证码", 
    42. } 
    43. )) 
    1. Views.py
    1.  
  • 相关阅读:
    背包问题
    floyed算法
    读Windows编程
    PB串口编程资料(转)
    读TCP-IP详解卷1：协议(1)
    Oracle把两个空格以上的空格，替换为两个空格
    PB中multieditline空间的“~r~n"转"~n"
    PB中掉用Run以后，等Run的程序关闭以后才会执行后边的语句
    一个关于生成随机数的算法
    英语词根
  • 原文地址：https://www.cnblogs.com/sama/p/9285247.html
Copyright © 2011-2022 走看看