Django开发收银系统三

实现前台收银

1.模块介绍
本章流程

实现的页面如下：

生成流水单号并展示
使用面向对象写法，在shop的文件夹下创建myclass文件夹，直接调用myclass里的函数，是代码简洁。

在myclass里创建文件shop_cashier.py,设计的流水单号如下。

生成时间戳，引入时间函数和随机数函数

import pymysql
from supermarket.settings import *
from django.http import HttpResponse
from datetime import datetime
import random

class Customer:
    # 构造函数
    def __init__(self):
        self.serialnum = ""  # 存储生成的流水单号
    def get_serialnum(self):
        """
        生成流水单号
        :return: 
        """
        # 获取当前的系统时间
        dt = datetime.now()
        # 生成流水单号
        self.serialnum = '%04d%02d%02d%02d%02d%02d' % (dt.year, dt.month, dt.day, dt.hour, dt.minute, dt.second)
        # 生成4位的随机数
        temp = random.randint(0, 9999)
        # 附加到流水单号的尾部
        self.serialnum += '%04d' % temp

在views.py下进行实例化

from .myclass import shop_cashier

# =========实例化收银模块的对象=======
current_customer = shop_cashier.Customer()

从url中获取用户名在前端显示

def cashier(request):
    """
    收银页面
    :param request: 
    :return: 
    """
    # 获取URL中的用户名
    username = request.GET.get("username")
    if username:
        if len(current_customer.serialnum) == 0:
            # 自动生成
            current_customer.get_serialnum()
        # 统计数量和金额
        current_customer.get_total_info()
        # 加载页面
        return render(request, 'cashier.html', context={
   'customer': current_customer,
                                                        'username': username})
    else:
        return redirect(reverse('login'))

修改收银的前端为后台生成的流水单号

<div id="title" style="font-size:18px;color:white;font-weight: bold;background-color: #204d74">
        <div id="left">流水单号：{
  { customer.serialnum }}</div>
        <div id="right" >欢迎光临！ {
  { username }} | <a href="{% url 'login' %}">退出</a></div>
    </div>

商品二维码
扫描商品条形码，自动添加商品到后台，并显示在表格中

采用js,jquery的事件，扫描自带回车，当有回车事件的发生时，显示二维码。

<script src="{% static 'js/jquery.min.js' %}"></script>
 <script>
        $(function () {
   
            $('#productbarcode').on("keydown",function (event) {
   
                var keyCode = event.keyCode || event.which;
                if(keyCode == '13'){
   
                    // 获取商品的条形码
                    barcode =