1、项目介绍

技术：Python语言、Flask框架、MySQL数据库、HTML

❖ 具备首页商品图片轮播展示功能；
❖ 具备首页商品展示功能， 包括展示最新上架商品、 打折商品和热门商品等功能；
❖ 具备查看商品详情功能， 可以用于展示商品的详细信息；
❖ 具备加入购物车功能， 用户可以将商品添加至购物车，
❖ 具备查看购物车功能， 用户可以查看购物车中的所有商品， 可以更改购买商品的数量、 清空
❖ 具备填写订单功能， 用尸可以填写地址信息， 用于接收商品，
❖ 具备提交订单功能， 用户提交订单后， 可以显现支付宝收款的二维码；
❖ 具备查看订单功能， 用尸提交订单后可以查看订单详情；
❖ 具备会员管理功能， 包括用户注册、 登录和退出等，
❖ 具备后台管理商品功能， 包括新增商品、 编抖商品、 删除商品和查看商品排行等，
❖ 具备后台管理会员功能， 包括查看会员信息等；
❖ 具备后台管理订单功能， 包括查看订单信息等．

2、项目界面

（1）系统首页

（2）商品详情页

（3）商品分类

（4）购物车功能

（6）系统注册登录功能

（7）后台数据管理登录

（8）后台数据管理

3、项目说明

技术：Python语言、Flask框架、MySQL数据库、HTML

❖ 具备首页商品图片轮播展示功能；
❖ 具备首页商品展示功能， 包括展示最新上架商品、 打折商品和热门商品等功能；
❖ 具备查看商品详情功能， 可以用于展示商品的详细信息；
❖ 具备加入购物车功能， 用户可以将商品添加至购物车，
❖ 具备查看购物车功能， 用户可以查看购物车中的所有商品， 可以更改购买商品的数量、 清空
❖ 具备填写订单功能， 用尸可以填写地址信息， 用于接收商品，
❖ 具备提交订单功能， 用户提交订单后， 可以显现支付宝收款的二维码；
❖ 具备查看订单功能， 用尸提交订单后可以查看订单详情；
❖ 具备会员管理功能， 包括用户注册、 登录和退出等，
❖ 具备后台管理商品功能， 包括新增商品、 编抖商品、 删除商品和查看商品排行等，
❖ 具备后台管理会员功能， 包括查看会员信息等；
❖ 具备后台管理订单功能， 包括查看订单信息等．

1、 会员注册模块
会员注册模块主要用于实现新用户注册成为网站的会员功能。 在会员注册页面中， 用户盆要坟
写会员信息， 然后单击 “ 同意协议并注册 ” 按钮， 程序将自动验证输入的账户信息是否唯一， 如果
的会员信息保存到数据库中， 否则提示需要修改成唯 后， 方可的信息是否合法， 例如， 不能输入中文的账户名称等。

2、会员登录模块主要用于实现网站的会员登录功能，在该页面中，填写会员账户、密码和验证码
（如果验证码看不清楚，可以单击验证码图片刷新该验证码），单击“登录”按钮，即可实现会员登
录。如果没有输入账户、密码或者验证码，则将给予提示。另外，在验证码输入错误时也将给予提
示。

3、创建会员登录页面
在会员登录页面，需要用户填写账户名、密码和验证码。账户名和密码的表单字段与注册页面
相同，这里不再赞述，我们重点介绍一下与验证码相关的内容。
1.生成验证码
登录页面的验证码是一个图片验证码，也就是在一张图片上显示数字0～9，小写字母a～z
和大写字母A～Z的随机组合。这里可以使用string模块的ascilettersO和digitsO方法实现，其
中，ascileters可以生成所有英文字母（包括a～z和A～Z），digits可以生成所有数字，然后使
用PIL（图像处理标准库）来生成图片。实现代码如下：

2.显示验证码
接下来将显示验证码。定义路由“lcode”，首先在该路由下调用getverif_codeO方法来生成验
证码，然后生成一个jpeg格式的图片，最后需要将图片显示在路由下。为了节省内存空间，返回一
张gif图片。

4、保存会员登录状态
当用户填写登录信息后，除了要判断验证码是否正确，还需要验证用户名是否存在，以及用户
名和密码是否匹配等内容。如果验证全部通过，需要将user_id和user_name写入到Session中，为
后面判断用户是否登录做准备。此外，我们还需要在用户访问“/login”路由时，判断用户是否已经
登录，如果用户之前已经登录过，则不需要再次登录，而是直接跳转到商城首页。

当用户访问商城时，首先进入的便是前台首页。前台首页设计的美观程度将直接影响用户的
购买欲望。在商城的前台首页中，用户不但可以查看最新上架、打折的商品等信息，还可以及时
了解大家喜爱的热门商品，以及商城推出的最新活动和广告

5、实现显示最新上架商品功能
最新上架商品数据来源于goods（商品表）中is_new字段为1的记录。由于数据较多，所以在
商城首页中，根据商品的addtime（添加时间）进行降序排序，筛选出12条记录。然后在模板中遍

6、实现显示打折商品功能
打折商品数据来源于goods（商品表）中is_sale字段为1的记录。由于数据较多，所以在商城
首页中，根据商品的addtime（添加时间）进行降序排序，筛选出12条记录。然后在模板中，遍历数据，显示商品信息。

7、实现显示热门商品功能
热门商品数据来源于goods（商品表）中views_cout字段值较高的记录。由于页面布局限制，
我们只根据views_count字段降序筛选2条记录。然后在模板中遍历数据，显示商品信息。

8、购物车模块概述
在中，购物车流程。在首页或商品详情页单击某个商品可以进入到显示
商品的详细信息页面在该页面中，单击“添加到购物车”按钮，即可将相应商品
添加到购物车，然后填写物流信息，17.22所示。单击“结账”按钮，支付对话框。最后单击“支付”按钮，模拟提交支付并生成订单。

9、实现显示商品详细信息功能
在首页单击任何商品名称或者商品图片时，都将显示该商品的详细信息页面。在商品详细信息
页面中除显示商品的信息外，还需要显示左侧的热门商品和底部的推荐商品。
对于商品的详细信息，我们需要根据商品ID，使用get_or_404（id）方法来获取。
对于左侧的热门商品，我们需要获取该商品的同一个子类别下的商品。例如，我们正在访问的
商品子类别是音箱，那么左侧热门商品就是与音箱相关的产品，并且根据浏览量从高到低进行排序，筛选出5条记录。
对于底部的推荐商品，与热门商品类似。只需根据商品添加时间从高到低排序筛选出5条记录。

10、实现添加购物车功能
在中，有2种添加购物车的方法：商品详情页添加购物车和商品列表页添加购物车。它
们之间的区别在于商品详情页添加购物车时可以选择购买商品的数量（大于或等于1），而在商品列
表页添加购物车时则默认购买数量为1。
基于以上分析，我们可以通过设置标签的方式来添加购物车。下面分别介绍这两种情况。
（1）在商品详情页面中，填写购买商品数量后，单击“添加到购物车”按钮时，需要判断用户
是否登录。如果没有登录，页面跳转到登录页；如果已经登录，则执行加入购物车操作。模板关键

11、实现保存订单功能
当商品加入购物车后，需要填写物流信息，包括“收货人姓名”“收货人手机”和“收货人地
址”等。然后单击“结账”按钮，弹出支付二维码。由于调用支付宝接口需要注册支付宝企业账
户，并且完成实名认证，所以在本项目中，我们只是来模拟一下支付功能。当单击弹窗右下角的
“支付”按钮后默认支付完成，此时需要保存订单。
使用orders表和orders_detail表实现保存订单功能，它们是一对多的关系，如在一个订单中可
以有多个订单明细。orders表用于记录收货人的姓名、电话和地址等信息，而orders_detail表用于记
录该订单中的商品信息。所以在添加订单时需要同时添加到orders表和orders_detail表中。

12、商品管理模块设计
管理模块主要实现对商品信息的管理，包括分页显示商品信息、添加商品信息、
修改商品信息和删除商品信息等功能。
分页显示商品信息
商品管理模块的首页是分页显示商品信息，主要用于将商品信息表中的商品信息以列表的方式
显示，并为之添加“修改”和“删除”功能，方便用户对商品信息进行修改和删除。商品管理模块

4、核心代码

# _*_ coding: utf-8 _*_
from . import home
from app import db
from app.home.forms import LoginForm,RegisterForm,PasswordForm
from app.models import User ,Goods,Orders,Cart,OrdersDetail
from flask import render_template, url_for, redirect, flash, session, request,make_response
from werkzeug.security import generate_password_hash
from functools import wraps
import random
import string
from PIL import Image, ImageFont, ImageDraw
from io import BytesIO

def rndColor():
    '''随机颜色'''
    return (random.randint(32, 127), random.randint(32, 127), random.randint(32, 127))

def gene_text():
    '''生成4位验证码'''
    return ''.join(random.sample(string.ascii_letters+string.digits, 4))

def draw_lines(draw, num, width, height):
    '''划线'''
    for num in range(num):
        x1 = random.randint(0, width / 2)
        y1 = random.randint(0, height / 2)
        x2 = random.randint(0, width)
        y2 = random.randint(height / 2, height)
        draw.line(((x1, y1), (x2, y2)), fill='black', width=1)

def get_verify_code():
    '''生成验证码图形'''
    code = gene_text()
    # 图片大小120×50
    width, height = 120, 50
    # 新图片对象
    im = Image.new('RGB',(width, height),'white')
    # 字体
    font = ImageFont.truetype('app/static/fonts/arial.ttf', 40)
    # draw对象
    draw = ImageDraw.Draw(im)
    # 绘制字符串
    for item in range(4):
        draw.text((5+random.randint(-3,3)+23*item, 5+random.randint(-3,3)),
                  text=code[item], fill=rndColor(),font=font )
    return im, code


@home.route('/code')
def get_code():
    image, code = get_verify_code()
    # 图片以二进制形式写入
    buf = BytesIO()
    image.save(buf, 'jpeg')
    buf_str = buf.getvalue()
    # 把buf_str作为response返回前端，并设置首部字段
    response = make_response(buf_str)
    response.headers['Content-Type'] = 'image/gif'
    # 将验证码字符串储存在session中
    session['image'] = code
    return response

def user_login(f):
    """
    登录装饰器
    """
    @wraps(f)
    def decorated_function(*args, **kwargs):
        if "user_id" not in session:
            return redirect(url_for("home.login"))
        return f(*args, **kwargs)

    return decorated_function

@home.route("/login/", methods=["GET", "POST"])
def login():
    """
    登录
    """
    if "user_id" in session:        # 如果已经登录，则直接跳转到首页
        return redirect(url_for("home.index"))
    form = LoginForm()              # 实例化LoginForm类
    if form.validate_on_submit():   # 如果提交
        data = form.data            # 接收表单数据
        # 判断验证码
        if session.get('image').lower() != form.verify_code.data.lower():
            flash('验证码错误',"err")
            return render_template("home/login.html", form=form)  # 返回登录页
        # 判断用户名是否存在
        user = User.query.filter_by(username=data["username"]).first()    # 获取用户信息
        if not user :
            flash("用户名不存在！", "err")           # 输出错误信息
            return render_template("home/login.html", form=form)  # 返回登录页
        # 判断用户名和密码是否匹配
        if not user.check_password(data["password"]):     # 调用check_password()方法，检测用户名密码是否匹配
            flash("密码错误！", "err")           # 输出错误信息
            return render_template("home/login.html", form=form)  # 返回登录页

        session["user_id"] = user.id                # 将user_id写入session, 后面用户判断用户是否登录
        session["username"] = user.username                # 将user_id写入session, 后面用户判断用户是否登录
        return redirect(url_for("home.index")) # 登录成功，跳转到首页

    return render_template("home/login.html",form=form) # 渲染登录页面模板

@home.route("/register/", methods=["GET", "POST"])
def register():
    """
    注册功能
    """
    if "user_id" in session:
        return redirect(url_for("home.index"))
    form = RegisterForm()           # 导入注册表单
    if form.validate_on_submit():   # 提交注册表单
        data = form.data            # 接收表单数据
        # 为User类属性赋值
        user = User(
            username = data["username"],            # 用户名
            email = data["email"],                  # 邮箱
            password = generate_password_hash(data["password"]),# 对密码加密
            phone = data['phone']
        )
        db.session.add(user) # 添加数据
        db.session.commit()  # 提交数据
        return redirect(url_for("home.login"))  # 登录成功，跳转到首页
    return render_template("home/register.html", form=form) # 渲染模板

@home.route("/logout/")
def logout():
    """
    退出登录
    """
    # 重定向到home模块下的登录。
    session.pop("user_id", None)
    session.pop("username", None)
    return redirect(url_for('home.login'))

@home.route("/modify_password/",methods=["GET","POST"])
@user_login
def modify_password():
    """
    修改密码
    """
    form = PasswordForm()
    if form.validate_on_submit():
        data = form.data
        user = User.query.filter_by(username=session["username"]).first()
        from werkzeug.security import generate_password_hash
        user.password = generate_password_hash(data["password"])
        db.session.add(user)
        db.session.commit()
        return "<script>alert('密码修改成功');location.href='/';</script>"
    return render_template("home/modify_password.html", form=form)

@home.route("/")
def index():
    """
    首页
    """
    # 获取2个热门商品
    hot_goods = Goods.query.order_by(Goods.views_count.desc()).limit(2).all()
    # 获取12个新品
    new_goods = Goods.query.filter_by(is_new=1).order_by(
                    Goods.addtime.desc()
                        ).limit(12).all()
    # 获取12个打折商品
    sale_goods = Goods.query.filter_by(is_sale=1).order_by(
                    Goods.addtime.desc()
                        ).limit(12).all()
    return render_template('home/index.html',new_goods=new_goods,sale_goods=sale_goods,hot_goods=hot_goods) # 渲染模板

@home.route("/goods_list/<int:supercat_id>/")
def goods_list(supercat_id=None):  # supercat_id 为商品大分类ID
    """
    商品页
    """
    page = request.args.get('page', 1, type=int)  # 获取page参数值
    page_data = Goods.query.filter_by(supercat_id=supercat_id).paginate(page=page, per_page=12)
    hot_goods = Goods.query.filter_by(supercat_id=supercat_id).order_by(Goods.views_count.desc()).limit(7).all()
    return render_template('home/goods_list.html',page_data=page_data,hot_goods=hot_goods,supercat_id=supercat_id)

@home.route("/goods_detail/<int:id>/")
def goods_detail(id=None):  # id 为商品ID
    """
    详情页
    """
    user_id = session.get('user_id', 0)  # 获取用户ID,判断用户是否登录
    goods = Goods.query.get_or_404(id) # 根据景区ID获取景区数据，如果不存在返回404
    # 浏览量加1
    goods.views_count += 1
    db.session.add(goods) # 添加数据
    db.session.commit()   # 提交数据
    # 获取左侧热门商品
    hot_goods = Goods.query.filter_by(subcat_id=goods.subcat_id).order_by(Goods.views_count.desc()).limit(5).all()
    # 获取底部相关商品
    similar_goods = Goods.query.filter_by(subcat_id=goods.subcat_id).order_by(Goods.addtime.desc()).limit(5).all()
    return render_template('home/goods_detail.html',goods=goods,hot_goods=hot_goods,similar_goods=similar_goods,user_id=user_id)   # 渲染模板

5、源码获取方式

感兴趣的可以先收藏起来，点赞、关注不迷路，下方查看👇🏻获取联系方式👇🏻