flask 上传图片和修改图片和分页和搜索
- 创建modules 文件夹下创建web文件夹index.py
- 创建static文件夹下创建upload文件夹下创建web文件夹
- 创建templates文件夹下创建add_goods。html。。。。。。。
- 创建utils文件夹
- apps.py
- models.py
- setting.py
- start.py
models.py 创建表结构
models.py (表的结构)
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 %}
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>