cm-cloud/cloud-common-article/src/main/resources/templates/articlecontent/update-articlecontent.html
2020-06-17 19:26:15 +08:00

284 lines
13 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!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">
</head>
<body>
<div class="layui-fluid layui-anim layui-anim-fadein">
<div class="layui-card">
<div class="layui-card-header">
<span class="layui-breadcrumb" lay-filter="breadcrumb" style="visibility: visible;">
<a class="close" href="javascript:void(0);">上级列表</a><span lay-separator="">/</span>
<a href="javascript:void(0);"><cite>编辑内容</cite></a>
</span>
</div>
<div class="layui-card-body" style="padding: 15px;">
<form class="layui-form layui-form-pane" lay-filter="dataForm">
<div class="layui-form-item">
<label class="layui-form-label">文章类别</label>
<div class="layui-input-block layui-form" id="articleCategoryIdJoinTemplateBox" lay-filter="articleCategoryIdJoinTemplateBox"></div>
<script id="articleCategoryIdJoinTemplate" type="text/html">
<select name="articleCategoryId" lay-verify="required" lay-search>
<option value="">选择文章类别</option>
{{# for(var i = 0, item; item = d[i++];) { }}
<option value="{{item.articleCategoryId}}">{{item.title}}</option>
{{# } }}
</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>
</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>
</div>
<div class="layui-form-item layui-form-text">
<label class="layui-form-label">概述</label>
<div class="layui-input-block">
<textarea id="summary" name="summary" class="layui-textarea" placeholder="请输入概述"></textarea>
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">外链地址</label>
<div class="layui-input-block">
<input type="text" id="link" name="link" class="layui-input" value="" placeholder="请输入外链地址http或https开头列表点击跳转到对应页面。">
</div>
</div>
<div class="layui-row">
<div class="layui-col-xs12 layui-col-sm6 layui-col-md3">
<div class="layui-form-item">
<label class="layui-form-label">来源</label>
<div class="layui-input-block">
<input type="text" id="source" name="source" class="layui-input" value="" placeholder="请输入来源" >
</div>
</div>
</div>
<div class="layui-col-xs12 layui-col-sm6 layui-col-md3">
<div class="layui-form-item">
<label class="layui-form-label">作者</label>
<div class="layui-input-block">
<input type="text" id="author" name="author" class="layui-input" value="" placeholder="请输入作者" >
</div>
</div>
</div>
<div class="layui-col-xs12 layui-col-sm6 layui-col-md3">
<div class="layui-form-item">
<label class="layui-form-label">发布时间</label>
<div class="layui-input-block">
<input type="text" id="publishDate" name="publishDate" class="layui-input" value="" placeholder="请选择发布时间" readonly style="cursor: pointer;" lay-verify="required">
</div>
</div>
</div>
<div class="layui-col-xs12 layui-col-sm6 layui-col-md3">
<div class="layui-form-item" pane>
<label class="layui-form-label">是否发布</label>
<div class="layui-input-block">
<input type="radio" name="isPublish" value="1" title="是">
<input type="radio" name="isPublish" value="0" title="否">
</div>
</div>
</div>
</div>
<div class="layui-form-item layui-form-text">
<div class="layui-input-block">
<script id="content" name="content" type="text/plain"></script>
</div>
</div>
<div class="layui-form-item layui-layout-admin">
<div class="layui-input-block">
<div class="layui-footer" style="left: 0;">
<button type="button" class="layui-btn" lay-submit lay-filter="submitForm">提交编辑</button>
<button type="button" class="layui-btn layui-btn-primary close">返回上级</button>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
<script src="assets/js/vendor/ueditor/ueditor.config.js"></script>
<script src="assets/js/vendor/ueditor/ueditor.all.js"></script>
<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 articleContentId = top.restAjax.params(window.location.href).articleContentId;
var ueEditorObj = {};
function closeBox() {
parent.layer.close(parent.layer.getFrameIndex(window.name));
}
function refreshDownloadTemplet(fileName, file) {
var dataRander = {};
dataRander[fileName] = file;
laytpl(document.getElementById(fileName +'FileDownload').innerHTML).render(dataRander, function(html) {
document.getElementById(fileName +'FileBox').innerHTML = html;
});
}
// 初始化文件列表
function initFileList(fileName, ids, callback) {
var dataForm = {};
dataForm[fileName] = ids;
form.val('dataForm', dataForm);
if(!ids) {
refreshDownloadTemplet(fileName, []);
if(callback) {
callback(fileName, []);
}
return;
}
top.restAjax.get(top.restAjax.path('api/file/listfilebyfileid', []), {
ids: ids
}, null, function(code, data) {
refreshDownloadTemplet(fileName, data);
if(callback) {
callback(fileName, data);
}
}, function(code, data) {
top.dialog.msg(data.msg);
});
}
// 初始化视频
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/downloadfile/true/'+ item.fileId,
type: 'video/mp4'
}
});
}
}
// 初始化发布时间日期
function initPublishDateDate() {
laydate.render({
elem: '#publishDate',
type: 'date',
value: new Date(),
trigger: 'click'
});
}
// 初始化正文富文本
function initContentRichText(value) {
var editor = UE.getEditor('content');
editor.ready(function() {
editor.setHeight(400);
editor.setContent(value);
});
ueEditorObj['content'] = editor;
}
// 初始化文章类别联表
function initArticleCategoryIdJoinTable(joinValue){
top.restAjax.get(top.restAjax.path('api/articlecategory/listarticlecategory', []), {}, null, function(code, data) {
laytpl(document.getElementById('articleCategoryIdJoinTemplate').innerHTML).render(data, function(html) {
document.getElementById('articleCategoryIdJoinTemplateBox').innerHTML = html;
});
form.render('select', 'articleCategoryIdJoinTemplateBox');
// 初始化选择
var formSelectData = {};
formSelectData['articleCategoryId'] = joinValue;
form.val('dataForm', formSelectData);
}, function(code, data) {
top.dialog.msg(data.msg);
});
}
// 初始化内容
function initData() {
var loadLayerIndex;
top.restAjax.get(top.restAjax.path('api/articlecontent/getarticlecontentbyid/{articleContentId}', [articleContentId]), {}, null, function(code, data) {
var dataFormData = {};
for(var i in data) {
dataFormData[i] = data[i] +'';
}
form.val('dataForm', dataFormData);
form.render(null, 'dataForm');
initPublishDateDate();
initContentRichText(data['content']);
initArticleCategoryIdJoinTable(data['articleCategoryId']);
}, 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();
// 提交表单
form.on('submit(submitForm)', function(formData) {
top.dialog.confirm(top.dataMessage.commit, function(index) {
top.dialog.close(index);
var loadLayerIndex;
formData.field['content'] = ueEditorObj['content'].getContent();
top.restAjax.put(top.restAjax.path('api/articlecontent/updatearticlecontent/{articleContentId}', [articleContentId]), formData.field, null, function(code, data) {
var layerIndex = top.dialog.msg(top.dataMessage.updateSuccess, {
time: 0,
btn: [top.dataMessage.button.yes, top.dataMessage.button.no],
shade: 0.3,
yes: function(index) {
top.dialog.close(index);
window.location.reload();
},
btn2: function() {
closeBox();
}
});
}, function(code, data) {
top.dialog.msg(data.msg);
}, function() {
loadLayerIndex = top.dialog.msg(top.dataMessage.committing, {icon: 16, time: 0, shade: 0.3});
}, function() {
top.dialog.close(loadLayerIndex);
});
});
return false;
});
$('.close').on('click', function() {
closeBox();
});
// 校验
form.verify({
});
});
</script>
</body>
</html>