一、安装

pip install django-stdimage

安装django-stdimage库

https://github.com/codingjoe/django-stdimage

GitHub主页

二、配置demo/settings.py:

'stdimage',
# django-stdimage

其他的配置不用更改

也没有静态资源文件

三、模型product/models.py:

修改产品图片字段

from ckeditor_uploader.fields import RichTextUploadingField
from django.db import models # Create your models here.
from stdimage import StdImageField class ProductInfo(models.Model):
# 产品表 product_name = models.CharField(max_length=32, verbose_name="产品名称")
# 产品名称 product_picture = StdImageField(
upload_to='pictures/%Y%m%d',
blank=True,
null=True,
variations={
'large': (600, 400),
'thumbnail': (100, 100, True),
'medium': (300, 200),
},
delete_orphans=True,
verbose_name="产品图片"
)
# 产品图片 product_describe = models.CharField(max_length=255, verbose_name="产品描述")
# 产品描述
product_manager = models.CharField(max_length=11, verbose_name="产品经理")
# 产品经理
product_detail = RichTextUploadingField(verbose_name="产品详情", default="")
# 产品详情,带有上传图片功能的富文本编辑器
create_time = models.DateTimeField(auto_now_add=True, verbose_name="创建时间")
# 创建时间
update_time = models.DateTimeField(auto_now=True, blank=True, null=True, verbose_name="修改时间")
# 修改时间 class Meta:
db_table = 'product_info'
# 设置表名,默认表名是:应用名称_模型类名
# 带有应用名的表名太长了 verbose_name = '产品列表'
verbose_name_plural = "产品列表" def product_picture_preview(self):
return '<img src="%s" />' % self.product_picture.thumbnail.url product_picture_preview.short_description = "产品图片"
product_picture_preview.allow_tags = True def __str__(self):
return self.product_name

四、admin注册product/admin.py:

list_display = [
'id',
'product_name',
'product_picture_preview',
# 产品图片,不是product_picture
'product_describe',
'product_manager',
'product_detail',
'create_time',
'update_time',
]
# 要显示的字段列表

五、admin管理后台:

xadmin引入django-stdimage在列表页预览图片的更多相关文章

  1. BookBlock - 效果非常真实的书本翻页预览

    这个名为 BookBlock 的图片预览效果是一个书展示或网上书店的概念,已全屏打开3D页面导航网格的形式显示图书的详细信息.我们可以打开书预览的摘录,其中有一些细节的网格.对于图书预览,我们在使用 ...

  2. activiti自定义流程之自定义表单(三):表单列表及预览和删除

    注:(1)环境配置:activiti自定义流程之自定义表单(一):环境配置 (2)创建表单:activiti自定义流程之自定义表单(二):创建表单 自定义表单创建成功,要拿到activiti中使用,自 ...

  3. django 上传头像并预览 3选1

    注册页面的头像上传 register.html<!DOCTYPE html> <html lang="en"> <head> <meta ...

  4. 【微信小程序】微信小程序wx.previewImage预览图片

    一.小知识 二.例子,配合轮播图使用效果更佳!(如图1) 1.wxml <scroll-view scroll-y="true"> <swiper catchta ...

  5. 微信小程序:点击预览图片

    在开发微信小程序时,开发人员会参考着小程序api来开发小程序,但有的时候根据情况不同很容易出现bug,以下是我在开发小程序时出现的各种bug,在开发时有需要预览图片. 1.xml <view c ...

  6. 上传预览图片的插件jquery-fileupload

    上传预览图片的插件jquery-fileupload github地址:https://github.com/blueimp/jQuery-File-Upload 中文文档:http://www.jq ...

  7. 微信开发中使用微信JSSDK和使用URL.createObjectURL上传预览图片的不同处理对比

    在做微信公众号或者企业微信开发业务应用的时候,我们常常会涉及到图片预览.上传等的处理,往往业务需求不止一张图片,因此相对来说,需要考虑的全面一些,用户还需要对图片进行预览和相应的处理,在开始的时候我使 ...

  8. hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images

    hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images, 本例子主要是使用HTML5 的File API,建立一個可存取到该file的url, 一个空的img标签,ID为img0,把 ...

  9. [js/jquery]移动端手势拖动,放大,缩小预览图片

    摘要 有这样的需求需要在手机端预览图片的时候,实现图片的手势拖动,放大缩小功能.最终通过touch.js这个插件实现了效果. touch.js Touch.js是移动设备上的手势识别与事件库, 由百度 ...

随机推荐

  1. [LeetCode] 241. Different Ways to Add Parentheses 添加括号的不同方式

    Given a string of numbers and operators, return all possible results from computing all the differen ...

  2. 第02组 Alpha事后诸葛亮

    目录 1. 组长博客(2分) 2. 总结思考(27分) 2.1. 设想和目标(2分) 2.2. 计划(5分) 2.3. 资源(3分) 2.4. 变更管理(4分) 2.5. 设计/实现(4分) 2.6. ...

  3. 收藏一份devmem源码

    /* * devmem2.c: Simple program to read/write from/to any location in memory. * * Copyright (C) 2000, ...

  4. 【ASP.NET Core分布式项目实战】(五)Docker制作dotnet core控制台程序镜像

    Docker制作dotnet core控制台程序镜像 基于dotnet SDK 新建控制台程序 mkdir /home/console cd /home/console dotnet new cons ...

  5. intellij idea 解决2019年4月到期延期问题

    56ZS5PQ1RF-eyJsaWNlbnNlSWQiOiI1NlpTNVBRMVJGIiwibGljZW5zZWVOYW1lIjoi5q2j54mI5o6I5p2DIC4iLCJhc3NpZ25lZ ...

  6. git rebase的使用: 合并多次commit记录; rebase一个分支的起点

    合并多次commit记录: good:https://blog.csdn.net/csdlwzy/article/details/83379546 使用 git log 命令查看提交历史: 想要合并前 ...

  7. c#的IDisposable

    尽量在using中使用非托管资源 1.实现Dispose方法 2.提取一个受保护的Dispose虚方法,在该方法中实现具体的释放资源的逻辑 3.添加析构函数 4.添加一个私有的bool类型的字段,作为 ...

  8. Canon MF113W激光打印机双面打印方法

    系统:macOS 10.14.3 打印机:Canon MF113W 黑白激光打印机(不支持自动双面打印) 方法: 1)文件->打印->纸张处理->仅奇数页->倒序->打印 ...

  9. 可落地的DDD(5)-战术设计

    摘要 本篇是DDD的战术篇,也就是关于领域事件.领域对象.聚合根.实体.值对象的讨论.也是DDD系列的完结篇. 这一部分在我们团队争论最多的,也有很多月经贴,比如对资源库的操作应该放在领域服务还是领域 ...

  10. dataGridView1_RowEnter事件与dataGridView1.CurrentRow一起使用错误问题

    在使用DataGridView想在选项行发生改变时获得当前行的,于是使用了RowEnter 但是获得数据却不对,总是获得前一个被选中的行,比如第一次选中谭经理,再选中王海霞,数据得到却是谭经理的 从事 ...