20.1.cms添加轮播图后台逻辑代码完成
(1)apps/models.py
from exts import db from datetime import datetime class BannerModel(db.Model): __tablename__ = ‘banner‘ id = db.Column(db.Integer, primary_key=True, autoincrement=True) name = db.Column(db.String(255), nullable=False) img_url = db.Column(db.String(255), nullable=False) link_url = db.Column(db.String(255), nullable=False) priority = db.Column(db.Integer, default=0) create_time = db.Column(db.DateTime, default=datetime.now)
(2)manage.py
from apps.models import BannerModel
(3)生成到数据库
python manage.py db migrate
python manage.py db upgrade
(4)cms/forms.py
class AddBannerForm(BaseForm): name=StringField(validators=[InputRequired(message=‘请输入轮播图名称‘)]) img_url=StringField(validators=[InputRequired(message=‘请输入轮播图链接‘)]) link_url=StringField(validators=[InputRequired(message=‘请输入轮播图跳转链接‘)]) priority=IntegerField(validators=[InputRequired(message=‘请输入轮播图优先级‘)])
(5)cms/views.py
@bp.route(‘/abanner/‘,methods=[‘POST‘]) def abanner(): form=AddBannerForm(request.form) if form.validate(): name=form.name.data img_url=form.img_url.data link_url=form.link_url.data priority=form.priority.data banner=BannerModel(name=name,img_url=img_url,link_url=link_url,priority=priority) db.session.add(banner) db.session.commit() return restful.success() else: return restful.params_error(message=form.get_error())
20.2.cms添加轮播图前台逻辑完成
(1)cms/js/banner.js
$(function () { $(‘#save_banner_btn‘).click(function (event) { event.preventDefault(); var dialog = $(‘#banner-dialog‘); var nameInput = $("input[name=‘name‘]"); var imgInput = $("input[name=‘img_url‘]"); var linkInput = $("input[name=‘link_url‘]"); var priorityInput = $("input[name=‘priority‘]"); var name = nameInput.val(); var img_url = imgInput.val(); var link_url = linkInput.val(); var priority = priorityInput.val(); if (!name || !img_url || !link_url || !priority) { zlalert.alertInfo(‘请输入完整的轮播图数据‘); return; } zlajax.post({ ‘url‘: ‘/cms/abanner/‘, ‘data‘: { ‘name‘: name, ‘img_url‘: img_url, ‘link_url‘: link_url, ‘priority‘: priority }, ‘success‘: function (data) { if (data[‘code‘] == 200) { dialog.modal(‘hide‘); window.location.reload() } else { zlalert.alertInfo(data[‘message‘]); } }, ‘fail‘: function (error) { zlalert.alertNetworkError() } }); }); });
(2)cms/cms_banners.html
{% from ‘common/_macros.html‘ import static %} <script src="{{ static(‘cms/js/banners.js‘) }}"></script>
(3)cms/views.py
@bp.route(‘/banners/‘) @login_required def banners(): banners = BannerModel.query.all() return render_template(‘cms/cms_banners.html‘,banners=banners)
(4)cms_banners.html
<tbody> {% for banner in banners %} <tr> <td>{{ banner.name }}</td> <td><a href="{{ banner.img_url }}" target="_blank">{{ banner.img_url }}</a></td> <td><a href="{{ banner.link_url }}" target="_blank">{{ banner.link_url }}</a></td> <td>{{ banner.priority }}</td> <td>{{ banner.create_time }}</td> <td> <button class="btn btn-default btn-xs edit-banner-btn">编辑</button> <button class="btn btn-danger btn-xs delete-banner-btn">删除</button> </td> </tr> {% endfor %} </tbody>