diff --git a/module-article/src/main/java/ink/wgink/module/article/controller/api/content/ContentController.java b/module-article/src/main/java/ink/wgink/module/article/controller/api/content/ContentController.java
index 7e786af8..11b5544f 100644
--- a/module-article/src/main/java/ink/wgink/module/article/controller/api/content/ContentController.java
+++ b/module-article/src/main/java/ink/wgink/module/article/controller/api/content/ContentController.java
@@ -102,7 +102,7 @@ public class ContentController extends DefaultBaseController {
     @ApiOperation(value = "文章内容列表", notes = "文章内容列表接口")
     @ApiResponses({@ApiResponse(code = 400, message = "请求失败", response = ErrorResult.class)})
     @ApiImplicitParams({
-            @ApiImplicitParam(name = "articleCategoryId", value = "文章目录", paramType = "query", dataType = "String")
+            @ApiImplicitParam(name = "categoryId", value = "文章目录", paramType = "query", dataType = "String")
     })
     @GetMapping("list")
     public List<ContentDTO> list() {
@@ -117,7 +117,7 @@ public class ContentController extends DefaultBaseController {
             @ApiImplicitParam(name = "keywords", value = "关键字", paramType = "query", dataType = "String"),
             @ApiImplicitParam(name = "startTime", value = "开始时间", paramType = "query", dataType = "String"),
             @ApiImplicitParam(name = "endTime", value = "结束时间", paramType = "query", dataType = "String"),
-            @ApiImplicitParam(name = "articleCategoryId", value = "文章目录", paramType = "query", dataType = "String")
+            @ApiImplicitParam(name = "categoryId", value = "文章目录", paramType = "query", dataType = "String")
     })
     @ApiResponses({@ApiResponse(code = 400, message = "请求失败", response = ErrorResult.class)})
     @GetMapping("listpage")
@@ -129,7 +129,7 @@ public class ContentController extends DefaultBaseController {
 
     @ApiOperation(value = "统计文章数量", notes = "统计文章数量接口")
     @ApiImplicitParams({
-            @ApiImplicitParam(name = "articleCategoryId", value = "文章目录", paramType = "query", dataType = "String")
+            @ApiImplicitParam(name = "categoryId", value = "文章目录", paramType = "query", dataType = "String")
     })
     @ApiResponses({@ApiResponse(code = 400, message = "请求失败", response = ErrorResult.class)})
     @GetMapping("count")
diff --git a/module-article/src/main/java/ink/wgink/module/article/controller/route/content/ContentRouteController.java b/module-article/src/main/java/ink/wgink/module/article/controller/route/content/ContentRouteController.java
index da626b25..3b70005e 100644
--- a/module-article/src/main/java/ink/wgink/module/article/controller/route/content/ContentRouteController.java
+++ b/module-article/src/main/java/ink/wgink/module/article/controller/route/content/ContentRouteController.java
@@ -29,6 +29,11 @@ public class ContentRouteController {
     @Autowired
     private ICategoryService categoryService;
 
+    @GetMapping("get")
+    public ModelAndView get() {
+        return new ModelAndView("content/get");
+    }
+
     @GetMapping("list")
     public ModelAndView list() {
         return new ModelAndView("content/list");
diff --git a/module-article/src/main/java/ink/wgink/module/article/pojo/dtos/content/ContentDTO.java b/module-article/src/main/java/ink/wgink/module/article/pojo/dtos/content/ContentDTO.java
index a7eb6927..1bedf3ba 100644
--- a/module-article/src/main/java/ink/wgink/module/article/pojo/dtos/content/ContentDTO.java
+++ b/module-article/src/main/java/ink/wgink/module/article/pojo/dtos/content/ContentDTO.java
@@ -43,6 +43,8 @@ public class ContentDTO {
     private String categorySummary;
     @ApiModelProperty(name = "gmtCreate", value = "创建时间")
     private String gmtCreate;
+    @ApiModelProperty(name = "coverPhotos", value = "封面图")
+    private String coverPhotos;
 
     public String getContentId() {
         return contentId == null ? "" : contentId;
@@ -163,4 +165,12 @@ public class ContentDTO {
     public void setGmtCreate(String gmtCreate) {
         this.gmtCreate = gmtCreate;
     }
+
+    public String getCoverPhotos() {
+        return coverPhotos == null ? "" : coverPhotos;
+    }
+
+    public void setCoverPhotos(String coverPhotos) {
+        this.coverPhotos = coverPhotos;
+    }
 }
diff --git a/module-article/src/main/java/ink/wgink/module/article/pojo/vos/content/ContentVO.java b/module-article/src/main/java/ink/wgink/module/article/pojo/vos/content/ContentVO.java
index 9ece5659..120d815f 100644
--- a/module-article/src/main/java/ink/wgink/module/article/pojo/vos/content/ContentVO.java
+++ b/module-article/src/main/java/ink/wgink/module/article/pojo/vos/content/ContentVO.java
@@ -40,6 +40,8 @@ public class ContentVO {
     private String sort;
     @ApiModelProperty(name = "categoryId", value = "文章类别")
     private String categoryId;
+    @ApiModelProperty(name = "coverPhotos", value = "封面图")
+    private String coverPhotos;
 
     public String getTitle() {
         return title == null ? "" : title;
@@ -129,4 +131,11 @@ public class ContentVO {
         this.categoryId = categoryId;
     }
 
+    public String getCoverPhotos() {
+        return coverPhotos == null ? "" : coverPhotos;
+    }
+
+    public void setCoverPhotos(String coverPhotos) {
+        this.coverPhotos = coverPhotos;
+    }
 }
diff --git a/module-article/src/main/resources/mybatis/mapper/content/content-mapper.xml b/module-article/src/main/resources/mybatis/mapper/content/content-mapper.xml
index 6b845518..6478cfe0 100644
--- a/module-article/src/main/resources/mybatis/mapper/content/content-mapper.xml
+++ b/module-article/src/main/resources/mybatis/mapper/content/content-mapper.xml
@@ -20,6 +20,7 @@
         <result column="category_title" property="categoryTitle"/>
         <result column="category_summary" property="categorySummary"/>
         <result column="gmt_create" property="gmtCreate"/>
+        <result column="cover_photos" property="coverPhotos"/>
     </resultMap>
 
     <!-- 建表 -->
@@ -35,6 +36,7 @@
             `author` varchar(255) DEFAULT NULL COMMENT '作者',
             `publish_date` varchar(40) DEFAULT NULL COMMENT '发布时间',
             `is_publish` int(11) DEFAULT NULL COMMENT '是否发布',
+            `cover_photos` varchar(255) DEFAULT NULL COMMENT '封面图片',
             `content` longtext COMMENT '正文',
             `category_id` char(36) DEFAULT NULL COMMENT '文章类别',
             `sort` varchar(255) DEFAULT NULL COMMENT '文章排序',
@@ -60,6 +62,7 @@
             author,
             publish_date,
             is_publish,
+            cover_photos,
             content,
             sort,
             category_id,
@@ -78,6 +81,7 @@
             #{author},
             #{publishDate},
             #{isPublish},
+            #{coverPhotos},
             #{content},
             #{sort},
             #{categoryId},
@@ -133,6 +137,9 @@
         <if test="isPublish != null">
             is_publish = #{isPublish},
         </if>
+        <if test="coverPhotos != null and coverPhotos != ''">
+            cover_photos = #{coverPhotos},
+        </if>
         <if test="content != null and content != ''">
             content = #{content},
         </if>
@@ -156,6 +163,7 @@
             t1.author,
             t1.publish_date,
             t1.is_publish,
+            t1.cover_photos,
             t1.content,
             t1.category_id,
             t1.sort,
@@ -180,6 +188,7 @@
             t1.author,
             t1.publish_date,
             t1.is_publish,
+            t1.cover_photos,
             t1.content,
             t1.category_id,
             jt1.title category_title,
diff --git a/module-article/src/main/resources/templates/content/get.html b/module-article/src/main/resources/templates/content/get.html
new file mode 100644
index 00000000..1b523cc6
--- /dev/null
+++ b/module-article/src/main/resources/templates/content/get.html
@@ -0,0 +1,68 @@
+<!doctype html>
+<html lang="en" xmlns:th="http://www.thymeleaf.org">
+<head>
+    <base th:href="${#request.getContextPath() + '/'} ">
+    <meta charset="utf-8">
+    <meta name="renderer" content="webkit">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
+    <link rel="stylesheet" href="assets/fonts/font-awesome/css/font-awesome.css"/>
+    <link rel="stylesheet" href="assets/layuiadmin/layui/css/layui.css" media="all">
+    <link rel="stylesheet" href="assets/layuiadmin/style/admin.css" media="all">
+    <style>
+        #contentTemplateBox img {max-width: 100%;}
+        #contentTemplateBox video {max-width: 100%}
+    </style>
+</head>
+<body>
+<div class="layui-anim layui-anim-fadein">
+    <div class="layui-card">
+        <div class="layui-card-body" style="padding: 15px;">
+            <div id="contentTemplateBox"></div>
+            <script id="contentTemplate" type="text/html">
+                {{d.content}}
+            </script>
+        </div>
+    </div>
+</div>
+<script src="assets/layuiadmin/layui/layui.js"></script>
+<script>
+    layui.config({
+        base: 'assets/layuiadmin/' //静态资源所在路径
+    }).extend({
+        index: 'lib/index' //主入口模块
+    }).use(['index', 'form', 'laydate', 'laytpl'], function(){
+        var $ = layui.$;
+        var form = layui.form;
+        var laytpl = layui.laytpl;
+        var laydate = layui.laydate;
+        var contentId = top.restAjax.params(window.location.href).contentId;
+
+        function closeBox() {
+            parent.layer.close(parent.layer.getFrameIndex(window.name));
+        }
+
+        // 初始化内容
+        function initData() {
+            var loadLayerIndex;
+            top.restAjax.get(top.restAjax.path('api/content/get/{contentId}', [contentId]), {}, null, function(code, data) {
+                laytpl(document.getElementById('contentTemplate').innerHTML).render(data, function(html) {
+                    document.getElementById('contentTemplateBox').innerHTML = html;
+                });
+            }, function(code, data) {
+                top.dialog.msg(data.msg);
+            }, function() {
+                loadLayerIndex = top.dialog.msg(top.dataMessage.loading, {icon: 16, time: 0, shade: 0.3});
+            }, function() {
+                top.dialog.close(loadLayerIndex);
+            });
+        }
+        initData();
+
+        $('.close').on('click', function() {
+            closeBox();
+        });
+    });
+</script>
+</body>
+</html>
\ No newline at end of file
diff --git a/module-article/src/main/resources/templates/content/list-category.html b/module-article/src/main/resources/templates/content/list-category.html
index ff3204bf..3e96ad09 100644
--- a/module-article/src/main/resources/templates/content/list-category.html
+++ b/module-article/src/main/resources/templates/content/list-category.html
@@ -134,6 +134,11 @@
                                 return '<button class="layui-btn layui-btn-sm layui-btn-normal" lay-event="publishEvent">确定发布</button>';
                             }
                         },
+                        {field: 'view', width: 80, title: '操作', align:'center', fixed: 'right',
+                            templet: function(row) {
+                                return '<button class="layui-btn layui-btn-sm" lay-event="viewEvent">预览</button>';
+                            }
+                        },
                     ]
                 ],
                 page: true,
@@ -278,6 +283,14 @@
                updatePublishStatus(data.contentId, 1);
            } else if(layEvent === 'unPublishEvent') {
                updatePublishStatus(data.contentId, 0);
+           } else if(layEvent === 'viewEvent') {
+               top.dialog.open({
+                   url: top.restAjax.path('route/content/get?contentId={contentId}', [data.contentId]),
+                   title: '文章预览',
+                   width: '600px',
+                   height: '80%',
+                   onClose: function() {}
+               });
            }
         });
     });
diff --git a/module-article/src/main/resources/templates/content/list.html b/module-article/src/main/resources/templates/content/list.html
index 28c543ab..9205fdb0 100644
--- a/module-article/src/main/resources/templates/content/list.html
+++ b/module-article/src/main/resources/templates/content/list.html
@@ -161,6 +161,11 @@
                                 return '<button class="layui-btn layui-btn-sm layui-btn-normal" lay-event="publishEvent">确定发布</button>';
                             }
                         },
+                        {field: 'view', width: 80, title: '操作', align:'center', fixed: 'right',
+                            templet: function(row) {
+                                return '<button class="layui-btn layui-btn-sm" lay-event="viewEvent">预览</button>';
+                            }
+                        },
                     ]
                 ],
                 page: true,
@@ -306,6 +311,14 @@
                updatePublishStatus(data.contentId, 1);
            } else if(layEvent === 'unPublishEvent') {
                updatePublishStatus(data.contentId, 0);
+           } else if(layEvent === 'viewEvent') {
+               top.dialog.open({
+                   url: top.restAjax.path('route/content/get?contentId={contentId}', [data.contentId]),
+                   title: '文章预览',
+                   width: '600px',
+                   height: '80%',
+                   onClose: function() {}
+               });
            }
         });
     });
diff --git a/module-article/src/main/resources/templates/content/save-category.html b/module-article/src/main/resources/templates/content/save-category.html
index 1c8f15c7..9f69acd5 100644
--- a/module-article/src/main/resources/templates/content/save-category.html
+++ b/module-article/src/main/resources/templates/content/save-category.html
@@ -9,6 +9,7 @@
     <link rel="stylesheet" href="assets/fonts/font-awesome/css/font-awesome.css"/>
     <link rel="stylesheet" href="assets/layuiadmin/layui/css/layui.css" media="all">
     <link rel="stylesheet" href="assets/layuiadmin/style/admin.css" media="all">
+    <link rel="stylesheet" href="assets/js/vendor/viewer/viewer.min.css" media="all">
 </head>
 <body>
 <div class="layui-fluid layui-anim layui-anim-fadein">
@@ -25,16 +26,22 @@
                     <input type="hidden" id="categoryId" name="categoryId" th:value="${categoryId}">
                     <blockquote class="layui-elem-quote" th:text="${categoryTitle}"></blockquote>
                 </div>
-                <div class="layui-form-item">
-                    <label class="layui-form-label">标题</label>
-                    <div class="layui-input-block">
-                        <input type="text" id="title" name="title" class="layui-input" value="" placeholder="请输入标题" lay-verify="required">
+                <div class="layui-row">
+                    <div class="layui-col-xs12 layui-col-sm6 layui-col-md6">
+                        <div class="layui-form-item">
+                            <label class="layui-form-label">标题</label>
+                            <div class="layui-input-block">
+                                <input type="text" id="title" name="title" class="layui-input" value="" placeholder="请输入标题" lay-verify="required">
+                            </div>
+                        </div>
                     </div>
-                </div>
-                <div class="layui-form-item">
-                    <label class="layui-form-label">子标题</label>
-                    <div class="layui-input-block">
-                        <input type="text" id="subTitle" name="subTitle" class="layui-input" value="" placeholder="请输入子标题" >
+                    <div class="layui-col-xs12 layui-col-sm6 layui-col-md6">
+                        <div class="layui-form-item">
+                            <label class="layui-form-label">子标题</label>
+                            <div class="layui-input-block">
+                                <input type="text" id="subTitle" name="subTitle" class="layui-input" value="" placeholder="请输入子标题" >
+                            </div>
+                        </div>
                     </div>
                 </div>
                 <div class="layui-form-item layui-form-text">
@@ -84,6 +91,36 @@
                         </div>
                     </div>
                 </div>
+                <div class="layui-form-item layui-form-text">
+                    <label class="layui-form-label">封面图片</label>
+                    <div class="layui-input-block">
+                        <input type="hidden" id="coverPhotos" name="coverPhotos">
+                        <div class="layui-btn-container" id="coverPhotosFileBox" style="border: 1px solid #e6e6e6;"></div>
+                        <script id="coverPhotosFileDownload" type="text/html">
+                            {{# var fileName = 'coverPhotos'; }}
+                            {{# if(d[fileName].length > 0) { }}
+                            {{#    var files = d[fileName];}}
+                            {{#    for(var i = 0, item = files[i]; item = files[i++];) { }}
+                            <div class="upload-image-box">
+                                <span class="upload-image-span">
+                                    <img src="route/file/download/false/{{item.fileId}}" align="加载失败">
+                                </span>
+                                <a class="layui-btn layui-btn-xs layui-btn-danger text-danger remove-image" href="javascript:void(0);" lay-form-button data-id="{{item.fileId}}" data-name="{{fileName}}" lay-filter="coverPhotosRemoveFile">
+                                    <i class="fa fa-trash-o"></i>
+                                </a>
+                            </div>
+                            {{#    } }}
+                            {{# } }}
+                            {{# if(d[fileName].length < 3) { }}
+                            <div class="upload-image-box" style="width: auto; height: auto; padding: 5px;">
+                                <a href="javascript:void(0);" lay-form-button data-explain="封面图片" data-name="coverPhotos" lay-filter="coverPhotosUploadFile">
+                                    <i class="fa fa-plus-square-o" style="font-size: 70px;"></i>
+                                </a>
+                            </div>
+                            {{# } }}
+                        </script>
+                    </div>
+                </div>
                 <div class="layui-form-item layui-form-text">
                     <div class="layui-input-block">
                         <script id="content" name="content" type="text/plain"></script>
@@ -103,6 +140,7 @@
 </div>
 <script src="assets/js/vendor/ueditor/ueditor.config.js"></script>
 <script src="assets/js/vendor/ueditor/ueditor.all.js"></script>
+<script src="assets/js/vendor/viewer/viewer.min.js"></script>
 <script src="assets/layuiadmin/layui/layui.js"></script>
 <script>
     layui.config({
@@ -115,6 +153,7 @@
         var laytpl = layui.laytpl;
         var laydate = layui.laydate;
         var ueEditorObj = {};
+        var viewerObj = {};
 
         function closeBox() {
             parent.layer.close(parent.layer.getFrameIndex(window.name));
@@ -155,20 +194,58 @@
             });
         }
 
-        // 初始化视频
-        function initVideo(fileName, data) {
-            for(var i = 0, item; item = data[i++];) {
-                var player = new ckplayer({
-                    container: '#'+ fileName + i,
-                    variable: 'player',
-                    flashplayer: false,
-                    video: {
-                        file: 'route/file/download/true/'+ item.fileId,
-                        type: 'video/mp4'
+        // 初始化封面图片上传
+        function initCoverPhotosUploadFile() {
+            var files = $('#coverPhotos').val();
+            initFileList('coverPhotos', files, function(fileName) {
+                var viewer = new Viewer(document.getElementById(fileName +'FileBox'), {navbar: false});
+                viewerObj[fileName] = viewer;
+            });
+
+            form.on('button(coverPhotosUploadFile)', function(obj) {
+                var name = this.dataset.name;
+                var explain = this.dataset.explain;
+                top.dialog.file({
+                    type: 'image',
+                    title: '上传'+ explain,
+                    width: '400px',
+                    height: '420px',
+                    maxFileCount: '1',
+                    onClose: function() {
+                        var uploadFileArray = top.dialog.dialogData.uploadFileArray;
+                        if(typeof(uploadFileArray) != 'undefined' && uploadFileArray.length > 0) {
+                            var files = $('#'+ name).val();
+                            for(var j = 0, file = uploadFileArray[j]; file = uploadFileArray[j++];) {
+                                if(files.length > 0) {
+                                    files += ',';
+                                }
+                                files += file.data;
+                            }
+                            initFileList(name, files, function(fileName) {
+                                viewerObj[fileName].update();
+                            });
+                        }
                     }
                 });
-            }
+            });
+
+            form.on('button(coverPhotosRemoveFile)', function(obj) {
+                var name = this.dataset.name;
+                var id = this.dataset.id;
+                var files = $('#'+ name).val().replace(id, '');
+                files = files.replace(/\,+/g, ',');
+                if(files.charAt(0) == ',') {
+                    files = files.substring(1);
+                }
+                if(files.charAt(files.length - 1) == ',') {
+                    files = files.substring(0, files.length - 1);
+                }
+                initFileList(name, files, function(fileName) {
+                    viewerObj[fileName].update();
+                });
+            });
         }
+        initCoverPhotosUploadFile();
 
         // 初始化发布时间日期
         function initPublishDateDate() {
@@ -182,7 +259,7 @@
 
         // 初始化正文富文本
         function initContentRichText() {
-            var editor = UE.getEditor('content');
+            var editor = UE.getEditor('content', {autoHeightEnabled: false});
             editor.ready(function() {
                 editor.setHeight(400);
             });
diff --git a/module-article/src/main/resources/templates/content/save.html b/module-article/src/main/resources/templates/content/save.html
index 4463c30c..f6173bfe 100644
--- a/module-article/src/main/resources/templates/content/save.html
+++ b/module-article/src/main/resources/templates/content/save.html
@@ -9,6 +9,7 @@
     <link rel="stylesheet" href="assets/fonts/font-awesome/css/font-awesome.css"/>
     <link rel="stylesheet" href="assets/layuiadmin/layui/css/layui.css" media="all">
     <link rel="stylesheet" href="assets/layuiadmin/style/admin.css" media="all">
+    <link rel="stylesheet" href="assets/js/vendor/viewer/viewer.min.css" media="all">
 </head>
 <body>
 <div class="layui-fluid layui-anim layui-anim-fadein">
@@ -33,16 +34,22 @@
                         </select>
                     </script>
                 </div>
-                <div class="layui-form-item">
-                    <label class="layui-form-label">标题</label>
-                    <div class="layui-input-block">
-                        <input type="text" id="title" name="title" class="layui-input" value="" placeholder="请输入标题" lay-verify="required">
+                <div class="layui-row">
+                    <div class="layui-col-xs12 layui-col-sm6 layui-col-md6">
+                        <div class="layui-form-item">
+                            <label class="layui-form-label">标题</label>
+                            <div class="layui-input-block">
+                                <input type="text" id="title" name="title" class="layui-input" value="" placeholder="请输入标题" lay-verify="required">
+                            </div>
+                        </div>
                     </div>
-                </div>
-                <div class="layui-form-item">
-                    <label class="layui-form-label">子标题</label>
-                    <div class="layui-input-block">
-                        <input type="text" id="subTitle" name="subTitle" class="layui-input" value="" placeholder="请输入子标题" >
+                    <div class="layui-col-xs12 layui-col-sm6 layui-col-md6">
+                        <div class="layui-form-item">
+                            <label class="layui-form-label">子标题</label>
+                            <div class="layui-input-block">
+                                <input type="text" id="subTitle" name="subTitle" class="layui-input" value="" placeholder="请输入子标题" >
+                            </div>
+                        </div>
                     </div>
                 </div>
                 <div class="layui-form-item layui-form-text">
@@ -92,6 +99,36 @@
                         </div>
                     </div>
                 </div>
+                <div class="layui-form-item layui-form-text">
+                    <label class="layui-form-label">封面图片</label>
+                    <div class="layui-input-block">
+                        <input type="hidden" id="coverPhotos" name="coverPhotos">
+                        <div class="layui-btn-container" id="coverPhotosFileBox" style="border: 1px solid #e6e6e6;"></div>
+                        <script id="coverPhotosFileDownload" type="text/html">
+                            {{# var fileName = 'coverPhotos'; }}
+                            {{# if(d[fileName].length > 0) { }}
+                            {{#    var files = d[fileName];}}
+                            {{#    for(var i = 0, item = files[i]; item = files[i++];) { }}
+                            <div class="upload-image-box">
+                                <span class="upload-image-span">
+                                    <img src="route/file/download/false/{{item.fileId}}" align="加载失败">
+                                </span>
+                                <a class="layui-btn layui-btn-xs layui-btn-danger text-danger remove-image" href="javascript:void(0);" lay-form-button data-id="{{item.fileId}}" data-name="{{fileName}}" lay-filter="coverPhotosRemoveFile">
+                                    <i class="fa fa-trash-o"></i>
+                                </a>
+                            </div>
+                            {{#    } }}
+                            {{# } }}
+                            {{# if(d[fileName].length < 3) { }}
+                            <div class="upload-image-box" style="width: auto; height: auto; padding: 5px;">
+                                <a href="javascript:void(0);" lay-form-button data-explain="封面图片" data-name="coverPhotos" lay-filter="coverPhotosUploadFile">
+                                    <i class="fa fa-plus-square-o" style="font-size: 70px;"></i>
+                                </a>
+                            </div>
+                            {{# } }}
+                        </script>
+                    </div>
+                </div>
                 <div class="layui-form-item layui-form-text">
                     <div class="layui-input-block">
                         <script id="content" name="content" type="text/plain"></script>
@@ -111,6 +148,7 @@
 </div>
 <script src="assets/js/vendor/ueditor/ueditor.config.js"></script>
 <script src="assets/js/vendor/ueditor/ueditor.all.js"></script>
+<script src="assets/js/vendor/viewer/viewer.min.js"></script>
 <script src="assets/layuiadmin/layui/layui.js"></script>
 <script>
     layui.config({
@@ -123,6 +161,7 @@
         var laytpl = layui.laytpl;
         var laydate = layui.laydate;
         var ueEditorObj = {};
+        var viewerObj = {};
 
         function closeBox() {
             parent.layer.close(parent.layer.getFrameIndex(window.name));
@@ -163,20 +202,58 @@
             });
         }
 
-        // 初始化视频
-        function initVideo(fileName, data) {
-            for(var i = 0, item; item = data[i++];) {
-                var player = new ckplayer({
-                    container: '#'+ fileName + i,
-                    variable: 'player',
-                    flashplayer: false,
-                    video: {
-                        file: 'route/file/download/true/'+ item.fileId,
-                        type: 'video/mp4'
+        // 初始化封面图片上传
+        function initCoverPhotosUploadFile() {
+            var files = $('#coverPhotos').val();
+            initFileList('coverPhotos', files, function(fileName) {
+                var viewer = new Viewer(document.getElementById(fileName +'FileBox'), {navbar: false});
+                viewerObj[fileName] = viewer;
+            });
+
+            form.on('button(coverPhotosUploadFile)', function(obj) {
+                var name = this.dataset.name;
+                var explain = this.dataset.explain;
+                top.dialog.file({
+                    type: 'image',
+                    title: '上传'+ explain,
+                    width: '400px',
+                    height: '420px',
+                    maxFileCount: '1',
+                    onClose: function() {
+                        var uploadFileArray = top.dialog.dialogData.uploadFileArray;
+                        if(typeof(uploadFileArray) != 'undefined' && uploadFileArray.length > 0) {
+                            var files = $('#'+ name).val();
+                            for(var j = 0, file = uploadFileArray[j]; file = uploadFileArray[j++];) {
+                                if(files.length > 0) {
+                                    files += ',';
+                                }
+                                files += file.data;
+                            }
+                            initFileList(name, files, function(fileName) {
+                                viewerObj[fileName].update();
+                            });
+                        }
                     }
                 });
-            }
+            });
+
+            form.on('button(coverPhotosRemoveFile)', function(obj) {
+                var name = this.dataset.name;
+                var id = this.dataset.id;
+                var files = $('#'+ name).val().replace(id, '');
+                files = files.replace(/\,+/g, ',');
+                if(files.charAt(0) == ',') {
+                    files = files.substring(1);
+                }
+                if(files.charAt(files.length - 1) == ',') {
+                    files = files.substring(0, files.length - 1);
+                }
+                initFileList(name, files, function(fileName) {
+                    viewerObj[fileName].update();
+                });
+            });
         }
+        initCoverPhotosUploadFile();
 
         // 初始化发布时间日期
         function initPublishDateDate() {
@@ -190,7 +267,7 @@
 
         // 初始化正文富文本
         function initContentRichText() {
-            var editor = UE.getEditor('content');
+            var editor = UE.getEditor('content', {autoHeightEnabled: false});
             editor.ready(function() {
                 editor.setHeight(400);
             });
diff --git a/module-article/src/main/resources/templates/content/update-category.html b/module-article/src/main/resources/templates/content/update-category.html
index 067d8b3b..078654c9 100644
--- a/module-article/src/main/resources/templates/content/update-category.html
+++ b/module-article/src/main/resources/templates/content/update-category.html
@@ -9,6 +9,7 @@
     <link rel="stylesheet" href="assets/fonts/font-awesome/css/font-awesome.css"/>
     <link rel="stylesheet" href="assets/layuiadmin/layui/css/layui.css" media="all">
     <link rel="stylesheet" href="assets/layuiadmin/style/admin.css" media="all">
+    <link rel="stylesheet" href="assets/js/vendor/viewer/viewer.min.css" media="all">
 </head>
 <body>
 <div class="layui-fluid layui-anim layui-anim-fadein">
@@ -25,16 +26,22 @@
                     <input type="hidden" id="categoryId" name="categoryId" th:value="${categoryId}">
                     <blockquote class="layui-elem-quote" th:text="${categoryTitle}"></blockquote>
                 </div>
-                <div class="layui-form-item">
-                    <label class="layui-form-label">标题</label>
-                    <div class="layui-input-block">
-                        <input type="text" id="title" name="title" class="layui-input" value="" placeholder="请输入标题" lay-verify="required">
+                <div class="layui-row">
+                    <div class="layui-col-xs12 layui-col-sm6 layui-col-md6">
+                        <div class="layui-form-item">
+                            <label class="layui-form-label">标题</label>
+                            <div class="layui-input-block">
+                                <input type="text" id="title" name="title" class="layui-input" value="" placeholder="请输入标题" lay-verify="required">
+                            </div>
+                        </div>
                     </div>
-                </div>
-                <div class="layui-form-item">
-                    <label class="layui-form-label">子标题</label>
-                    <div class="layui-input-block">
-                        <input type="text" id="subTitle" name="subTitle" class="layui-input" value="" placeholder="请输入子标题" >
+                    <div class="layui-col-xs12 layui-col-sm6 layui-col-md6">
+                        <div class="layui-form-item">
+                            <label class="layui-form-label">子标题</label>
+                            <div class="layui-input-block">
+                                <input type="text" id="subTitle" name="subTitle" class="layui-input" value="" placeholder="请输入子标题" >
+                            </div>
+                        </div>
                     </div>
                 </div>
                 <div class="layui-form-item layui-form-text">
@@ -84,6 +91,36 @@
                         </div>
                     </div>
                 </div>
+                <div class="layui-form-item layui-form-text">
+                    <label class="layui-form-label">封面图片</label>
+                    <div class="layui-input-block">
+                        <input type="hidden" id="coverPhotos" name="coverPhotos">
+                        <div class="layui-btn-container" id="coverPhotosFileBox" style="border: 1px solid #e6e6e6;"></div>
+                        <script id="coverPhotosFileDownload" type="text/html">
+                            {{# var fileName = 'coverPhotos'; }}
+                            {{# if(d[fileName].length > 0) { }}
+                            {{#    var files = d[fileName];}}
+                            {{#    for(var i = 0, item = files[i]; item = files[i++];) { }}
+                            <div class="upload-image-box">
+                                <span class="upload-image-span">
+                                    <img src="route/file/download/false/{{item.fileId}}" align="加载失败">
+                                </span>
+                                <a class="layui-btn layui-btn-xs layui-btn-danger text-danger remove-image" href="javascript:void(0);" lay-form-button data-id="{{item.fileId}}" data-name="{{fileName}}" lay-filter="coverPhotosRemoveFile">
+                                    <i class="fa fa-trash-o"></i>
+                                </a>
+                            </div>
+                            {{#    } }}
+                            {{# } }}
+                            {{# if(d[fileName].length < 3) { }}
+                            <div class="upload-image-box" style="width: auto; height: auto; padding: 5px;">
+                                <a href="javascript:void(0);" lay-form-button data-explain="封面图片" data-name="coverPhotos" lay-filter="coverPhotosUploadFile">
+                                    <i class="fa fa-plus-square-o" style="font-size: 70px;"></i>
+                                </a>
+                            </div>
+                            {{# } }}
+                        </script>
+                    </div>
+                </div>
                 <div class="layui-form-item layui-form-text">
                     <div class="layui-input-block">
                         <script id="content" name="content" type="text/plain"></script>
@@ -103,6 +140,7 @@
 </div>
 <script src="assets/js/vendor/ueditor/ueditor.config.js"></script>
 <script src="assets/js/vendor/ueditor/ueditor.all.js"></script>
+<script src="assets/js/vendor/viewer/viewer.min.js"></script>
 <script src="assets/layuiadmin/layui/layui.js"></script>
 <script>
     layui.config({
@@ -117,6 +155,7 @@
         var contentId = top.restAjax.params(window.location.href).contentId;
 
         var ueEditorObj = {};
+        var viewerObj = {};
 
         function closeBox() {
             parent.layer.close(parent.layer.getFrameIndex(window.name));
@@ -157,19 +196,56 @@
             });
         }
 
-        // 初始化视频
-        function initVideo(fileName, data) {
-            for(var i = 0, item; item = data[i++];) {
-                var player = new ckplayer({
-                    container: '#'+ fileName + i,
-                    variable: 'player',
-                    flashplayer: false,
-                    video: {
-                        file: 'route/file/download/true/'+ item.fileId,
-                        type: 'video/mp4'
+        // 初始化封面图片上传
+        function initCoverPhotosUploadFile() {
+            var files = $('#coverPhotos').val();
+            initFileList('coverPhotos', files, function(fileName) {
+                var viewer = new Viewer(document.getElementById(fileName +'FileBox'), {navbar: false});
+                viewerObj[fileName] = viewer;
+            });
+
+            form.on('button(coverPhotosUploadFile)', function(obj) {
+                var name = this.dataset.name;
+                var explain = this.dataset.explain;
+                top.dialog.file({
+                    type: 'image',
+                    title: '上传'+ explain,
+                    width: '400px',
+                    height: '420px',
+                    maxFileCount: '1',
+                    onClose: function() {
+                        var uploadFileArray = top.dialog.dialogData.uploadFileArray;
+                        if(typeof(uploadFileArray) != 'undefined' && uploadFileArray.length > 0) {
+                            var files = $('#'+ name).val();
+                            for(var j = 0, file = uploadFileArray[j]; file = uploadFileArray[j++];) {
+                                if(files.length > 0) {
+                                    files += ',';
+                                }
+                                files += file.data;
+                            }
+                            initFileList(name, files, function(fileName) {
+                                viewerObj[fileName].update();
+                            });
+                        }
                     }
                 });
-            }
+            });
+
+            form.on('button(coverPhotosRemoveFile)', function(obj) {
+                var name = this.dataset.name;
+                var id = this.dataset.id;
+                var files = $('#'+ name).val().replace(id, '');
+                files = files.replace(/\,+/g, ',');
+                if(files.charAt(0) == ',') {
+                    files = files.substring(1);
+                }
+                if(files.charAt(files.length - 1) == ',') {
+                    files = files.substring(0, files.length - 1);
+                }
+                initFileList(name, files, function(fileName) {
+                    viewerObj[fileName].update();
+                });
+            });
         }
 
         // 初始化发布时间日期
@@ -184,7 +260,7 @@
 
         // 初始化正文富文本
         function initContentRichText(value) {
-            var editor = UE.getEditor('content');
+            var editor = UE.getEditor('content', {autoHeightEnabled: false});
             editor.ready(function() {
                 editor.setHeight(400);
                 editor.setContent(value);
@@ -220,6 +296,7 @@
                 }
                 form.val('dataForm', dataFormData);
                 form.render(null, 'dataForm');
+                initCoverPhotosUploadFile();
                 initPublishDateDate();
                 initContentRichText(data['content']);
                 initArticleCategoryIdJoinTable(data['categoryId']);
diff --git a/module-article/src/main/resources/templates/content/update.html b/module-article/src/main/resources/templates/content/update.html
index 19de4b40..0fcc1da9 100644
--- a/module-article/src/main/resources/templates/content/update.html
+++ b/module-article/src/main/resources/templates/content/update.html
@@ -9,6 +9,7 @@
     <link rel="stylesheet" href="assets/fonts/font-awesome/css/font-awesome.css"/>
     <link rel="stylesheet" href="assets/layuiadmin/layui/css/layui.css" media="all">
     <link rel="stylesheet" href="assets/layuiadmin/style/admin.css" media="all">
+    <link rel="stylesheet" href="assets/js/vendor/viewer/viewer.min.css" media="all">
 </head>
 <body>
 <div class="layui-fluid layui-anim layui-anim-fadein">
@@ -33,16 +34,22 @@
                         </select>
                     </script>
                 </div>
-                <div class="layui-form-item">
-                    <label class="layui-form-label">标题</label>
-                    <div class="layui-input-block">
-                        <input type="text" id="title" name="title" class="layui-input" value="" placeholder="请输入标题" lay-verify="required">
+                <div class="layui-row">
+                    <div class="layui-col-xs12 layui-col-sm6 layui-col-md6">
+                        <div class="layui-form-item">
+                            <label class="layui-form-label">标题</label>
+                            <div class="layui-input-block">
+                                <input type="text" id="title" name="title" class="layui-input" value="" placeholder="请输入标题" lay-verify="required">
+                            </div>
+                        </div>
                     </div>
-                </div>
-                <div class="layui-form-item">
-                    <label class="layui-form-label">子标题</label>
-                    <div class="layui-input-block">
-                        <input type="text" id="subTitle" name="subTitle" class="layui-input" value="" placeholder="请输入子标题" >
+                    <div class="layui-col-xs12 layui-col-sm6 layui-col-md6">
+                        <div class="layui-form-item">
+                            <label class="layui-form-label">子标题</label>
+                            <div class="layui-input-block">
+                                <input type="text" id="subTitle" name="subTitle" class="layui-input" value="" placeholder="请输入子标题" >
+                            </div>
+                        </div>
                     </div>
                 </div>
                 <div class="layui-form-item layui-form-text">
@@ -92,6 +99,36 @@
                         </div>
                     </div>
                 </div>
+                <div class="layui-form-item layui-form-text">
+                    <label class="layui-form-label">封面图片</label>
+                    <div class="layui-input-block">
+                        <input type="hidden" id="coverPhotos" name="coverPhotos">
+                        <div class="layui-btn-container" id="coverPhotosFileBox" style="border: 1px solid #e6e6e6;"></div>
+                        <script id="coverPhotosFileDownload" type="text/html">
+                            {{# var fileName = 'coverPhotos'; }}
+                            {{# if(d[fileName].length > 0) { }}
+                            {{#    var files = d[fileName];}}
+                            {{#    for(var i = 0, item = files[i]; item = files[i++];) { }}
+                            <div class="upload-image-box">
+                                <span class="upload-image-span">
+                                    <img src="route/file/download/false/{{item.fileId}}" align="加载失败">
+                                </span>
+                                <a class="layui-btn layui-btn-xs layui-btn-danger text-danger remove-image" href="javascript:void(0);" lay-form-button data-id="{{item.fileId}}" data-name="{{fileName}}" lay-filter="coverPhotosRemoveFile">
+                                    <i class="fa fa-trash-o"></i>
+                                </a>
+                            </div>
+                            {{#    } }}
+                            {{# } }}
+                            {{# if(d[fileName].length < 3) { }}
+                            <div class="upload-image-box" style="width: auto; height: auto; padding: 5px;">
+                                <a href="javascript:void(0);" lay-form-button data-explain="封面图片" data-name="coverPhotos" lay-filter="coverPhotosUploadFile">
+                                    <i class="fa fa-plus-square-o" style="font-size: 70px;"></i>
+                                </a>
+                            </div>
+                            {{# } }}
+                        </script>
+                    </div>
+                </div>
                 <div class="layui-form-item layui-form-text">
                     <div class="layui-input-block">
                         <script id="content" name="content" type="text/plain"></script>
@@ -111,6 +148,7 @@
 </div>
 <script src="assets/js/vendor/ueditor/ueditor.config.js"></script>
 <script src="assets/js/vendor/ueditor/ueditor.all.js"></script>
+<script src="assets/js/vendor/viewer/viewer.min.js"></script>
 <script src="assets/layuiadmin/layui/layui.js"></script>
 <script>
     layui.config({
@@ -125,6 +163,7 @@
         var contentId = top.restAjax.params(window.location.href).contentId;
 
         var ueEditorObj = {};
+        var viewerObj = {};
 
         function closeBox() {
             parent.layer.close(parent.layer.getFrameIndex(window.name));
@@ -165,19 +204,56 @@
             });
         }
 
-        // 初始化视频
-        function initVideo(fileName, data) {
-            for(var i = 0, item; item = data[i++];) {
-                var player = new ckplayer({
-                    container: '#'+ fileName + i,
-                    variable: 'player',
-                    flashplayer: false,
-                    video: {
-                        file: 'route/file/download/true/'+ item.fileId,
-                        type: 'video/mp4'
+        // 初始化封面图片上传
+        function initCoverPhotosUploadFile() {
+            var files = $('#coverPhotos').val();
+            initFileList('coverPhotos', files, function(fileName) {
+                var viewer = new Viewer(document.getElementById(fileName +'FileBox'), {navbar: false});
+                viewerObj[fileName] = viewer;
+            });
+
+            form.on('button(coverPhotosUploadFile)', function(obj) {
+                var name = this.dataset.name;
+                var explain = this.dataset.explain;
+                top.dialog.file({
+                    type: 'image',
+                    title: '上传'+ explain,
+                    width: '400px',
+                    height: '420px',
+                    maxFileCount: '1',
+                    onClose: function() {
+                        var uploadFileArray = top.dialog.dialogData.uploadFileArray;
+                        if(typeof(uploadFileArray) != 'undefined' && uploadFileArray.length > 0) {
+                            var files = $('#'+ name).val();
+                            for(var j = 0, file = uploadFileArray[j]; file = uploadFileArray[j++];) {
+                                if(files.length > 0) {
+                                    files += ',';
+                                }
+                                files += file.data;
+                            }
+                            initFileList(name, files, function(fileName) {
+                                viewerObj[fileName].update();
+                            });
+                        }
                     }
                 });
-            }
+            });
+
+            form.on('button(coverPhotosRemoveFile)', function(obj) {
+                var name = this.dataset.name;
+                var id = this.dataset.id;
+                var files = $('#'+ name).val().replace(id, '');
+                files = files.replace(/\,+/g, ',');
+                if(files.charAt(0) == ',') {
+                    files = files.substring(1);
+                }
+                if(files.charAt(files.length - 1) == ',') {
+                    files = files.substring(0, files.length - 1);
+                }
+                initFileList(name, files, function(fileName) {
+                    viewerObj[fileName].update();
+                });
+            });
         }
 
         // 初始化发布时间日期
@@ -192,7 +268,7 @@
 
         // 初始化正文富文本
         function initContentRichText(value) {
-            var editor = UE.getEditor('content');
+            var editor = UE.getEditor('content', {autoHeightEnabled: false});
             editor.ready(function() {
                 editor.setHeight(400);
                 editor.setContent(value);
@@ -228,6 +304,7 @@
                 }
                 form.val('dataForm', dataFormData);
                 form.render(null, 'dataForm');
+                initCoverPhotosUploadFile();
                 initPublishDateDate();
                 initContentRichText(data['content']);
                 initArticleCategoryIdJoinTable(data['categoryId']);