Tenlion/wg-basic
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

新增封面图片

Browse Source
This commit is contained in:
wanggeng888 2021-04-15 17:46:22 +08:00
parent 98829d5fbf
commit 3c4bf16087
12 changed files with 522 additions and 87 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
module-article/src/main/java/ink/wgink/module/article/controller/api/content/ContentController.java
View File

@ -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")

5
module-article/src/main/java/ink/wgink/module/article/controller/route/content/ContentRouteController.java
View File

@ -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");

10
module-article/src/main/java/ink/wgink/module/article/pojo/dtos/content/ContentDTO.java
View File

@ -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;
}
}

9
module-article/src/main/java/ink/wgink/module/article/pojo/vos/content/ContentVO.java
View File

@ -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;
}
}

9
module-article/src/main/resources/mybatis/mapper/content/content-mapper.xml
View File

@ -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,

68
module-article/src/main/resources/templates/content/get.html Normal file
View File

@ -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>

13
module-article/src/main/resources/templates/content/list-category.html
View File

@ -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() {}
});
}
});
});

13
module-article/src/main/resources/templates/content/list.html
View File

@ -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() {}
});
}
});
});

119
module-article/src/main/resources/templates/content/save-category.html
View File

@ -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);
});

119
module-article/src/main/resources/templates/content/save.html
View File

@ -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);
});

119
module-article/src/main/resources/templates/content/update-category.html
View File

@ -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']);

119
module-article/src/main/resources/templates/content/update.html
View File

@ -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']);