flask 上传图片和修改图片和分页和搜索

本文介绍了使用 Flask 框架进行图片上传、修改、分页和搜索功能的实现。通过创建 modules 文件夹和相关子文件夹,设置静态文件夹存放上传的图片,并在 templates 文件夹中创建不同页面如首页、添加商品和商品详情页。同时,详细阐述了 models.py 中的表结构设计,以及配置文件 setting.py、程序入口 start.py 的作用。在数据库中添加图片字段,提供默认图片,并在 apps.py 中实例化应用。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

flask 上传图片和修改图片和分页和搜索

from apps import *


# 商品分类表
class Cate(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(30))


# 商品表
class Goods(db.Model):
    id = db.Column(db.Integer, primary_key=True)
    name = db.Column(db.String(30))
    pic = db.Column(db.String(100), default='default.jpg')
    content = db.Column(db.Text)

    cate_id = db.Column(db.Integer, db.ForeignKey(Cate.id))

setting.py 配置文件

DEBUG = True
SQLALCHEMY_DATABASE_URI = 'mysql+pymysql://root:@127.0.0.1:3306/exam1?charset=utf8'
# SQLALCHEMY_ECHO = True
SECRET_KEY = 'abc'
SQLALCHEMY_TRACK_MODIFICATIONS = False
SQLALCHEMY_COMMIT_ON_TEARDOWN = True
PER_PAGE_NUM=2

start.py 程序入口

from models import *
from modules.web.index import index_blue

app.register_blueprint(index_blue)

# 钩子函数,获取分类信息
@app.before_request
def g_cates_data():
    cates = Cate.query.all()
    g.cates = cates

if __name__ == '__main__':
    # db.drop_all()
    # db.create_all()
    app.run(port=9996)

在表结构添加图片字段
默认图片default.jpg

pic = db.Column(db.String(100), default='default.jpg')

apps.py实力化app

from flask import Flask, Blueprint, render_template, request, flash, redirect, url_for, session, make_response, g, current_app, jsonify
from flask_sqlalchemy import SQLAlchemy
from sqlalchemy import and_
import sys, os
from flask_uploads import UploadSet, IMAGES, configure_uploads #插入图片需要导入的包


app = Flask(__name__)

app.config.from_object('setting')
#导入图片需要配置的东西
enter = getattr(sys.modules['__main__'], '__file__')
root_path = os.path.dirname(enter)+'/static/upload'  #路径必须与图片储存路径一致
app.config['UPLOADED_XINS_DEST'] = root_path
app.config['UPLOADED_XINS_ALLOW'] = IMAGES
xins = UploadSet('XINS')
configure_uploads(app, xins)

db = SQLAlchemy(app=app)

base.html(模板)

{% block top %}
    <a href="{{ url_for('index.index') }}">首页</a>
    <a href="{{ url_for('index.add_cates') }}">添加</a>
    <a href="{{ url_for('index.add_goods') }}">添加商品</a>

{% endblock top %}

{% block content %}

{% endblock content %}

index.py

from models import *

index_blue = Blueprint('index', __name__)


@index_blue.route('/')
def index():
    # 最简单的,获取所有数据
    # goodss = Goods.query.all()
    # return render_template('web/index.html', goodss=goodss)

    # 分页
    kw = request.args.get('kw', '') #搜索
    goodss = Goods.query.filter(Goods.name.like('%'+kw+'%')).all() #搜索
    page = int(request.args.get('page', 1))
    goodss = Goods.query.paginate(page, 2)
    # goodss.items 商品数据
    # goodss.pages 总页数
    # goods.page 当前页
    return render_template('web/index.html', goodss=goodss,kw=kw)
	#kw=kw是搜索
    # 搜索
    # kw = request.args.get('kw', '')
    # goodss = Goods.query.filter(Goods.name.like('%'+kw+'%')).all()
    # return render_template('web/index.html', goodss=goodss, kw=kw)

# 添加分类
@index_blue.route('/add_cates',methods=['GET','POST'])
def add_cates():
    # one_cate1 = Cate(name='男装')
    # one_cate2 = Cate(name='女装')
    # db.session.add_all([one_cate1, one_cate2])
    name_a = ''
    if request.method == 'POST':
        name=request.form.get('name')
        # data_id=request.form.get('id')
        name_a=Cate(name=name)
        db.session.add(name_a)

    return render_template('web/add_cates.html',name_a=name_a)

# 添加商品
@index_blue.route('/add_goods', methods=['GET', 'POST'])
def add_goods():
    if request.method == 'POST':
        name = request.form.get('name')
        cate_id = request.form.get('cate_id')
        content = request.form.get('content')
        pic = request.files.get('pic')  # 注意接收图片的方式不同了
        pic_url = xins.save(pic)  # 保存图片
        new_goods = Goods(name=name, pic=pic_url, content=content, cate_id=cate_id)
        db.session.add(new_goods)
        return redirect(url_for('index.index'))
    return render_template('web/add_goods.html')

# 详情页面
@index_blue.route('/goods_detail')
def goods_detail():
    goods_id = request.args.get('goods_id')  # 接收商品id
    one_goods = Goods.query.get(goods_id)  # 查到商品记录
    return render_template('web/goods_detail.html', one_goods=one_goods)

# 分类下商品
@index_blue.route('/goods_list')
def goods_list():
    cate_id = request.args.get('cate_id')
    goodss = Goods.query.filter(Goods.cate_id == cate_id).all()
    return render_template('web/goods_list.html', goodss=goodss)



**index.html 首页 **

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
</head>
<body>
{% extends 'web/base.html' %}
{% block content %}

        <form action="">  <!--搜索一般用get-->
        <input type="text" value="{{ kw }}" name="kw">
        <input type="submit" value="搜索">
    </form>

{#    {% for goods in goodss %}#}
{#        {{ goods.id }}、#}
{#        <a href="{{ url_for('index.goods_detail', goods_id=goods.id) }}">{{ goods.name }}</a>#}
{#        <img width="60" src="../../static/upload/{{ goods.pic }}">#}
{#    {% endfor %}<br>#}
{#分页1#}
    {% for goods in goodss.items %}
        {{ goods.id }}<a href="{{ url_for('index.goods_detail', goods_id=goods.id) }}">{{ goods.name }}</a>
        <img width="60" src="../../static/upload/{{ goods.pic }}">
    {% endfor %}<br>
    <a href="{{ url_for('index.index', page=1) }}">1</a>
    <a href="{{ url_for('index.index', page=2) }}">2</a>


{#    {% for page in range(1, goodss.pages+1) %}#}
{#        <a href="{{ url_for('index.index', page=page) }}">{{ page }}</a>#}
{#    {% endfo r %}#}
{#    <form action="">  <!--搜索一般用get-->#}
{#        <input type="text" value="" name="page">#}
{#        <input type="submit" value="跳转">#}
{#    </form>#}
{% endblock content %}
</body>
</html>

add——goods.html

<head>
    <meta charset="UTF-8">
    <title>添加商品</title>
    <script src="../../static/web/tinymce/js/tinymce/tinymce.min.js"></script>
    <script src="../../static/web/js/tinymce_setup.js"></script>
</head>
<body>
{% extends 'web/base.html' %}
{% block content %}
    <form action="" method="post" enctype="multipart/form-data"> <!--上传图片注意点一-->
        商品分类:
        <select name="cate_id">
            {% for cate in g.cates %}
                <option value="{{ cate.id }}">{{ cate.name }}</option>
            {% endfor %}
        </select><br>
        商品名称:<input type="text" name="name" value=""> <br>
        商品图片:<input type="file" name="pic"> <br> <!--上传图片注意点二 type="file"-->
        商品内容:<input type="text" name="content" id="rich_content">
        <input type="submit" value="添加商品">
    </form>
{% endblock content %}
</body>
</html>

goods_detail.html ,商品详情页

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>商品详情页</title>
</head>
<body>
    商品标题:{{ one_goods.name }}<br>
    商品图片:<img src="../../static/upload/{{ one_goods.pic }}" /> <br>
    商品内容:{{ one_goods.content | safe }}
</body>
</html>

goods_list.html 商品列表

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>商品列表</title>
</head>
<body>
{% extends 'web/base.html' %}
{% block content %}
    {% for goods in goodss %}
        {{ goods.id }}<a href="{{ url_for('index.goods_detail', goods_id=goods.id) }}">{{ goods.name }}</a> <br>
    {% endfor %}
{% endblock content %}
</body>
</html>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值