💄 更新“发布文章”页面

上级 cf1f817c
......@@ -43,8 +43,8 @@ public class RestTagController {
@PostMapping(value = "/add")
@BussinessLog("添加标签")
public ResponseVO add(Tags tags) {
tagsService.insert(tags);
return ResultUtil.success("标签添加成功!新标签 - " + tags.getName());
tags = tagsService.insert(tags);
return ResultUtil.success("标签添加成功!新标签 - " + tags.getName(), tags);
}
@RequiresPermissions(value = {"tag:batchDelete", "tag:delete"}, logical = Logical.OR)
......
......@@ -2940,7 +2940,7 @@ ul.timeline li {
color: #fff !important
}
.tag:after {
/*.tag:after {
content: " ";
height: 30px;
width: 0;
......@@ -2952,7 +2952,7 @@ ul.timeline li {
border-top: 14px solid transparent;
border-bottom: 14px solid transparent;
border-left: 11px solid #1ABB9C
}
}*/
.timeline h2.title {
position: relative;
......@@ -5038,4 +5038,23 @@ ul, menu, dir {
text-overflow: ellipsis;
overflow: hidden;
}
/* 滚条消息通知 */
\ No newline at end of file
/* 滚条消息通知 */
.bootstrap-tagsinput.focus{
border-color: #3c763d;
-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
}
.tags-list li{
display: block;
float: left;
margin: 5px 5px 0 0;
padding: 5px 10px;
font-size: 12px;
color: #545c63;
line-height: 16px;
background: rgba(84,92,99,.1);
border-radius: 12px;
cursor: pointer;
}
\ No newline at end of file
/*
* SmartWizard 3.3.1 plugin
* jQuery Wizard control Plugin
* by Dipu
*
* Refactored and extended:
* https://github.com/mstratman/jQuery-Smart-Wizard
*
* Original URLs:
* http://www.techlaboratory.net
* http://tech-laboratory.blogspot.com
*/
function SmartWizard(target, options) {
this.target = target;
this.options = options;
this.curStepIdx = options.selected;
this.steps = $(target).children("ul").children("li").children("a"); // Get all anchors
this.contentWidth = 0;
this.msgBox = $('<div class="msgBox"><div class="content"></div><a href="#" class="close">X</a></div>');
this.elmStepContainer = $('<div></div>').addClass("stepContainer");
this.loader = $('<div>Loading</div>').addClass("loader");
this.buttons = {
next : $('<a>'+options.labelNext+'</a>').attr("href","#").addClass("buttonNext"),
previous : $('<a>'+options.labelPrevious+'</a>').attr("href","#").addClass("buttonPrevious"),
finish : $('<a>'+options.labelFinish+'</a>').attr("href","#").addClass("buttonFinish")
};
/*
* Private functions
*/
var _init = function($this) {
var elmActionBar = $('<div></div>').addClass("actionBar");
elmActionBar.append($this.msgBox);
$('.close',$this.msgBox).click(function() {
$this.msgBox.fadeOut("normal");
return false;
});
var allDivs = $this.target.children('div');
$this.target.children('ul').addClass("anchor");
allDivs.addClass("content");
// highlight steps with errors
if($this.options.errorSteps && $this.options.errorSteps.length>0){
$.each($this.options.errorSteps, function(i, n){
$this.setError({ stepnum: n, iserror:true });
});
}
$this.elmStepContainer.append(allDivs);
elmActionBar.append($this.loader);
$this.target.append($this.elmStepContainer);
elmActionBar.append($this.buttons.finish)
.append($this.buttons.next)
.append($this.buttons.previous);
$this.target.append(elmActionBar);
this.contentWidth = $this.elmStepContainer.width();
$($this.buttons.next).click(function() {
$this.goForward();
return false;
});
$($this.buttons.previous).click(function() {
$this.goBackward();
return false;
});
$($this.buttons.finish).click(function() {
if(!$(this).hasClass('buttonDisabled')){
if($.isFunction($this.options.onFinish)) {
var context = { fromStep: $this.curStepIdx + 1 };
if(!$this.options.onFinish.call(this,$($this.steps), context)){
return false;
}
}else{
var frm = $this.target.parents('form');
if(frm && frm.length){
frm.submit();
}
}
}
return false;
});
$($this.steps).bind("click", function(e){
if($this.steps.index(this) == $this.curStepIdx){
return false;
}
var nextStepIdx = $this.steps.index(this);
var isDone = $this.steps.eq(nextStepIdx).attr("isDone") - 0;
if(isDone == 1){
_loadContent($this, nextStepIdx);
}
return false;
});
// Enable keyboard navigation
// by zhyd . 2018-06-09 10:54 禁用掉键盘左右键切换tab的功能。PS.该功能严重影响到了文章的编辑!
/*if($this.options.keyNavigation){
$(document).keyup(function(e){
if(e.which==39){ // Right Arrow
$this.goForward();
}else if(e.which==37){ // Left Arrow
$this.goBackward();
}
});
}*/
// Prepare the steps
_prepareSteps($this);
// Show the first slected step
_loadContent($this, $this.curStepIdx);
};
var _prepareSteps = function($this) {
if(! $this.options.enableAllSteps){
$($this.steps, $this.target).removeClass("selected").removeClass("done").addClass("disabled");
$($this.steps, $this.target).attr("isDone",0);
}else{
$($this.steps, $this.target).removeClass("selected").removeClass("disabled").addClass("done");
$($this.steps, $this.target).attr("isDone",1);
}
$($this.steps, $this.target).each(function(i){
$($(this).attr("href").replace(/^.+#/, '#'), $this.target).hide();
$(this).attr("rel",i+1);
});
};
var _step = function ($this, selStep) {
return $(
$(selStep, $this.target).attr("href").replace(/^.+#/, '#'),
$this.target
);
};
var _loadContent = function($this, stepIdx) {
var selStep = $this.steps.eq(stepIdx);
var ajaxurl = $this.options.contentURL;
var ajaxurl_data = $this.options.contentURLData;
var hasContent = selStep.data('hasContent');
var stepNum = stepIdx+1;
if (ajaxurl && ajaxurl.length>0) {
if ($this.options.contentCache && hasContent) {
_showStep($this, stepIdx);
} else {
var ajax_args = {
url: ajaxurl,
type: "POST",
data: ({step_number : stepNum}),
dataType: "text",
beforeSend: function(){
$this.loader.show();
},
error: function(){
$this.loader.hide();
},
success: function(res){
$this.loader.hide();
if(res && res.length>0){
selStep.data('hasContent',true);
_step($this, selStep).html(res);
_showStep($this, stepIdx);
}
}
};
if (ajaxurl_data) {
ajax_args = $.extend(ajax_args, ajaxurl_data(stepNum));
}
$.ajax(ajax_args);
}
}else{
_showStep($this,stepIdx);
}
};
var _showStep = function($this, stepIdx) {
var selStep = $this.steps.eq(stepIdx);
var curStep = $this.steps.eq($this.curStepIdx);
if(stepIdx != $this.curStepIdx){
if($.isFunction($this.options.onLeaveStep)) {
var context = { fromStep: $this.curStepIdx+1, toStep: stepIdx+1 };
if (! $this.options.onLeaveStep.call($this,$(curStep), context)){
return false;
}
}
}
// zyd 取消动态加载stepContainer高度
// $this.elmStepContainer.height(_step($this, selStep).outerHeight());
var prevCurStepIdx = $this.curStepIdx;
$this.curStepIdx = stepIdx;
if ($this.options.transitionEffect == 'slide'){
_step($this, curStep).slideUp("fast",function(e){
_step($this, selStep).slideDown("fast");
_setupStep($this,curStep,selStep);
});
} else if ($this.options.transitionEffect == 'fade'){
_step($this, curStep).fadeOut("fast",function(e){
_step($this, selStep).fadeIn("fast");
_setupStep($this,curStep,selStep);
});
} else if ($this.options.transitionEffect == 'slideleft'){
var nextElmLeft = 0;
var nextElmLeft1 = null;
var nextElmLeft = null;
var curElementLeft = 0;
if(stepIdx > prevCurStepIdx){
nextElmLeft1 = $this.contentWidth + 10;
nextElmLeft2 = 0;
curElementLeft = 0 - _step($this, curStep).outerWidth();
} else {
nextElmLeft1 = 0 - _step($this, selStep).outerWidth() + 20;
nextElmLeft2 = 0;
curElementLeft = 10 + _step($this, curStep).outerWidth();
}
if (stepIdx == prevCurStepIdx) {
nextElmLeft1 = $($(selStep, $this.target).attr("href"), $this.target).outerWidth() + 20;
nextElmLeft2 = 0;
curElementLeft = 0 - $($(curStep, $this.target).attr("href"), $this.target).outerWidth();
} else {
$($(curStep, $this.target).attr("href"), $this.target).animate({left:curElementLeft},"fast",function(e){
$($(curStep, $this.target).attr("href"), $this.target).hide();
});
}
_step($this, selStep).css("left",nextElmLeft1).show().animate({left:nextElmLeft2},"fast",function(e){
_setupStep($this,curStep,selStep);
});
} else {
_step($this, curStep).hide();
_step($this, selStep).show();
_setupStep($this,curStep,selStep);
}
return true;
};
var _setupStep = function($this, curStep, selStep) {
$(curStep, $this.target).removeClass("selected");
$(curStep, $this.target).addClass("done");
$(selStep, $this.target).removeClass("disabled");
$(selStep, $this.target).removeClass("done");
$(selStep, $this.target).addClass("selected");
$(selStep, $this.target).attr("isDone",1);
_adjustButton($this);
if($.isFunction($this.options.onShowStep)) {
var context = { fromStep: parseInt($(curStep).attr('rel')), toStep: parseInt($(selStep).attr('rel')) };
if(! $this.options.onShowStep.call(this,$(selStep),context)){
return false;
}
}
if ($this.options.noForwardJumping) {
// +2 == +1 (for index to step num) +1 (for next step)
for (var i = $this.curStepIdx + 2; i <= $this.steps.length; i++) {
$this.disableStep(i);
}
}
};
var _adjustButton = function($this) {
if (! $this.options.cycleSteps){
if (0 >= $this.curStepIdx) {
$($this.buttons.previous).addClass("buttonDisabled");
if ($this.options.hideButtonsOnDisabled) {
$($this.buttons.previous).hide();
}
}else{
$($this.buttons.previous).removeClass("buttonDisabled");
if ($this.options.hideButtonsOnDisabled) {
$($this.buttons.previous).show();
}
}
if (($this.steps.length-1) <= $this.curStepIdx){
$($this.buttons.next).addClass("buttonDisabled");
if ($this.options.hideButtonsOnDisabled) {
$($this.buttons.next).hide();
}
}else{
$($this.buttons.next).removeClass("buttonDisabled");
if ($this.options.hideButtonsOnDisabled) {
$($this.buttons.next).show();
}
}
}
// Finish Button
if (! $this.steps.hasClass('disabled') || $this.options.enableFinishButton){
$($this.buttons.finish).removeClass("buttonDisabled");
if ($this.options.hideButtonsOnDisabled) {
$($this.buttons.finish).show();
}
}else{
$($this.buttons.finish).addClass("buttonDisabled");
if ($this.options.hideButtonsOnDisabled) {
$($this.buttons.finish).hide();
}
}
};
/*
* Public methods
*/
SmartWizard.prototype.goForward = function(){
var nextStepIdx = this.curStepIdx + 1;
if (this.steps.length <= nextStepIdx){
if (! this.options.cycleSteps){
return false;
}
nextStepIdx = 0;
}
_loadContent(this, nextStepIdx);
};
SmartWizard.prototype.goBackward = function(){
var nextStepIdx = this.curStepIdx-1;
if (0 > nextStepIdx){
if (! this.options.cycleSteps){
return false;
}
nextStepIdx = this.steps.length - 1;
}
_loadContent(this, nextStepIdx);
};
SmartWizard.prototype.goToStep = function(stepNum){
var stepIdx = stepNum - 1;
if (stepIdx >= 0 && stepIdx < this.steps.length) {
_loadContent(this, stepIdx);
}
};
SmartWizard.prototype.enableStep = function(stepNum) {
var stepIdx = stepNum - 1;
if (stepIdx == this.curStepIdx || stepIdx < 0 || stepIdx >= this.steps.length) {
return false;
}
var step = this.steps.eq(stepIdx);
$(step, this.target).attr("isDone",1);
$(step, this.target).removeClass("disabled").removeClass("selected").addClass("done");
}
SmartWizard.prototype.disableStep = function(stepNum) {
var stepIdx = stepNum - 1;
if (stepIdx == this.curStepIdx || stepIdx < 0 || stepIdx >= this.steps.length) {
return false;
}
var step = this.steps.eq(stepIdx);
$(step, this.target).attr("isDone",0);
$(step, this.target).removeClass("done").removeClass("selected").addClass("disabled");
}
SmartWizard.prototype.currentStep = function() {
return this.curStepIdx + 1;
}
SmartWizard.prototype.showMessage = function (msg) {
$('.content', this.msgBox).html(msg);
this.msgBox.show();
}
SmartWizard.prototype.hideMessage = function () {
this.msgBox.fadeOut("normal");
}
SmartWizard.prototype.showError = function(stepnum) {
this.setError(stepnum, true);
}
SmartWizard.prototype.hideError = function(stepnum) {
this.setError(stepnum, false);
}
SmartWizard.prototype.setError = function(stepnum,iserror) {
if (typeof stepnum == "object") {
iserror = stepnum.iserror;
stepnum = stepnum.stepnum;
}
if (iserror){
$(this.steps.eq(stepnum-1), this.target).addClass('error')
}else{
$(this.steps.eq(stepnum-1), this.target).removeClass("error");
}
}
SmartWizard.prototype.fixHeight = function(){
var height = 0;
var selStep = this.steps.eq(this.curStepIdx);
var stepContainer = _step(this, selStep);
stepContainer.children().each(function() {
height += $(this).outerHeight();
});
// These values (5 and 20) are experimentally chosen.
stepContainer.height(height + 5);
this.elmStepContainer.height(height + 20);
}
_init(this);
};
(function($){
$.fn.smartWizard = function(method) {
var args = arguments;
var rv = undefined;
var allObjs = this.each(function() {
var wiz = $(this).data('smartWizard');
if (typeof method == 'object' || ! method || ! wiz) {
var options = $.extend({}, $.fn.smartWizard.defaults, method || {});
if (! wiz) {
wiz = new SmartWizard($(this), options);
$(this).data('smartWizard', wiz);
}
} else {
if (typeof SmartWizard.prototype[method] == "function") {
rv = SmartWizard.prototype[method].apply(wiz, Array.prototype.slice.call(args, 1));
return rv;
} else {
$.error('Method ' + method + ' does not exist on jQuery.smartWizard');
}
}
});
if (rv === undefined) {
return allObjs;
} else {
return rv;
}
};
// Default Properties and Events
$.fn.smartWizard.defaults = {
selected: 0, // Selected Step, 0 = first step
keyNavigation: true, // Enable/Disable key navigation(left and right keys are used if enabled)
enableAllSteps: false,
transitionEffect: 'fade', // Effect on navigation, none/fade/slide/slideleft
contentURL:null, // content url, Enables Ajax content loading
contentCache:true, // cache step contents, if false content is fetched always from ajax url
cycleSteps: false, // cycle step navigation
enableFinishButton: false, // make finish button enabled always
hideButtonsOnDisabled: false, // when the previous/next/finish buttons are disabled, hide them instead?
errorSteps:[], // Array Steps with errors
labelNext:'Next',
labelPrevious:'Previous',
labelFinish:'Finish',
noForwardJumping: false,
onLeaveStep: null, // triggers when leaving a step
onShowStep: null, // triggers when showing a step
onFinish: null // triggers when Finish button is clicked
};
})(jQuery);
......@@ -31,9 +31,74 @@ var zhyd = window.zhyd || {
}
}
});
});
$('ul[target=combox], ol[target=combox]').each(function (e) {
var $this = $(this);
var url = $this.data("url");
if (!url) {
return false;
}
var method = $this.data("method") || "get";
$.ajax({
url: url,
type: method,
success: function (json) {
if (json && json.status == 200) {
var liTpl = '{{#data}}<li data-value="{{id}}">{{name}}</li>{{/data}}';
var html = Mustache.render(liTpl, json);
$this.html(html);
}
}
});
})
}
},
tagsInput: {
init: function () {
setTimeout(function () {
$('select[target="tagsinput"], input[target="tagsinput"]').each(function () {
var $this = $(this);
var $bindBox = $this.data("bind-box");
if(!$bindBox || $bindBox.length <= 0) {
return ;
}
$this.tagsinput({
itemValue: 'id',
itemText: 'name',
maxTags: 3,
maxChars: 10,
trimValue: true,
focusClass: 'focus'
});
function add(){
var thisId = $(this).data("value");
var thisText = $(this).text().trim();
$this.tagsinput('add', {"id": thisId, "name": thisText}, {add: false});
}
$($bindBox).find("li").each(function () {
var $li = $(this);
$li.bind('click', add);
});
$this.on('itemAdded', function (event) {
var tag = event.item;
if (!event.options) {
$.post('/tag/add', {name: tag, description: tag}, function (response) {
if (response.status !== 200) {
$this.tagsinput('remove', tag, {del: false});
} else {
var data = response.data;
$('<li data-value="' + data.id + '">' + data.name + '</li>').bind('click', add).appendTo($($bindBox));
}
});
}
});
})
}, 500);
}
},
initCommentNotify: function () {
$.ajax({
cache: false,
......@@ -116,7 +181,7 @@ var zhyd = window.zhyd || {
// 关闭粘贴样式的过滤
editor.customConfig.pasteFilterStyle = false;
editor.customConfig.zIndex = 100;
if(config.textareaName) {
if (config.textareaName) {
$('<textarea class="wangeditor-textarea" id="' + config.textareaName + '" name="' + config.textareaName + '" style="display: none" required="required"></textarea>').insertAfter($(config.container));
}
var $contentBox = $('textarea[name=' + config.textareaName + ']');
......@@ -125,7 +190,7 @@ var zhyd = window.zhyd || {
$contentBox.val(html);
};
// 注册上传文件插件
zhyd.wangEditor.plugins.registerUpload(editor, config.uploadUrl, config.uploadFileName, config.uploadType, function(result, curEditor) {
zhyd.wangEditor.plugins.registerUpload(editor, config.uploadUrl, config.uploadFileName, config.uploadType, function (result, curEditor) {
// 图片上传并返回结果,自定义插入图片的事件(而不是编辑器自动插入图片!!!)
// insertImg 是插入图片的函数,editor 是编辑器对象,result 是服务器端返回的结果
if (result.status == 200) {
......@@ -142,7 +207,7 @@ var zhyd = window.zhyd || {
// 注册全屏插件
zhyd.wangEditor.plugins.registerFullscreen(config.container);
if(config.customCss) {
if (config.customCss) {
// 自定义编辑器的样式
for (var key in config.customCss) {
var value = config.customCss[key];
......@@ -155,10 +220,10 @@ var zhyd = window.zhyd || {
var E = zhyd.wangEditor._instance;
// 全屏插件
E.fullscreen = {
init: function(editorBox) {
init: function (editorBox) {
$(editorBox + " .w-e-toolbar").append('<div class="w-e-menu"><a class="_wangEditor_btn_fullscreen" href="###" onclick="window.wangEditor.fullscreen.toggleFullscreen(\'' + editorBox + '\')" data-toggle="tooltip" data-placement="bottom" title data-original-title="全屏编辑"><i class="fa fa-expand"></i></a></div>')
},
toggleFullscreen: function(editorSelector) {
toggleFullscreen: function (editorSelector) {
$(editorSelector).toggleClass('fullscreen-editor');
var $a = $(editorSelector + ' ._wangEditor_btn_fullscreen');
var $i = $a.find("i:first-child");
......@@ -174,7 +239,7 @@ var zhyd = window.zhyd || {
// 初始化全屏插件
var n = arguments.length;
for(var i = 0; i < n; i ++){
for (var i = 0; i < n; i++) {
E.fullscreen.init(arguments[i]);
}
},
......@@ -204,7 +269,7 @@ var zhyd = window.zhyd || {
$.alert.error("请求超时");
},
customInsert: function (insertImg, result, editor) {
if(callback) {
if (callback) {
callback(result, editor);
} else {
console.log('upload callback:' + insertImg, result, editor);
......@@ -376,6 +441,7 @@ $(document).ready(function () {
}
});
zhyd.combox.init();
zhyd.tagsInput.init();
/**
* 针对shiro框架中, ajax请求时session过期后的页面跳转
......
......@@ -6,64 +6,6 @@
*/
var $publishForm = $("#publishForm");
// 加载所有分类
function loadType(){
$.ajax({
type: "post",
url: "/type/listAll",
success: function (json) {
$.alert.ajaxSuccess(json);
var data = '';
if(data = json.data){
var tpl = '<option value="">选择分类</option>{{#data}}<option value="{{id}}">{{name}}</option>{{#nodes}}<option value="{{id}}"> -- {{name}}</option>{{/nodes}}{{/data}}';
var html = Mustache.render(tpl, json);
$("select#typeId").html(html);
}
$("#refressType").removeClass("fa-spin");
},
error: $.alert.ajaxError
});
}
// 加载所有标签
function loadTag() {
$.ajax({
type: "post",
url: "/tag/listAll",
success: function (json) {
$.alert.ajaxSuccess(json);
var data = '';
if (data = json.data) {
var tagHtml = '';
for (var i = 0, len = data.length; i < len; i++) {
var tag = data[i];
tagHtml += '<li>'
+ '<input type="checkbox" class="square ignore" name="tags" value="' + tag.id + '"> ' + tag.name
+ '</li>';
}
$("#tag-list").html(tagHtml);
$("input[type=checkbox], input[type=radio]").iCheck({
checkboxClass: 'icheckbox_square-green',
radioClass: 'iradio_square-green',
increaseArea: '20%' // optional
});
}
$("#refressTag").removeClass("fa-spin");
},
error: $.alert.ajaxError
});
}
$("#refressType").click(function () {
$(this).addClass("fa-spin");
loadType();
});
$("#refressTag").click(function () {
$(this).addClass("fa-spin");
loadTag();
});
loadTag();
loadType();
if(articleId){
setTimeout(function () {
$.ajax({
......@@ -72,12 +14,14 @@ if(articleId){
success: function (json) {
$.alert.ajaxSuccess(json);
var info = json.data;
// 标签
var tags = info.tags;
for(var i = 0, len = tags.length; i < len ; i ++){
var tag = tags[i];
$("input[name=tags][value=" + tag.id + "]").iCheck('check');
}
// 标签, 因为标签初始化是有延迟的,所以这而赋值的时候为了防止赋值失败,亦采用延迟处理
setTimeout(function () {
var tags = info.tags;
for(var i = 0, len = tags.length; i < len ; i ++){
var tag = tags[i];
$('input[target="tagsinput"]').tagsinput('add', {"id": tag.id, "name": tag.name}, {add: false});
}
}, 600);
if($('input[name=original]')){
$('input[name=original]').iCheck(info.original ? 'check' : 'uncheck');
}
......@@ -110,13 +54,36 @@ if(articleId){
}, 1000);
}
$(".to-choose-info").click(function () {
if(validator.checkAll($publishForm)) {
$("#publishModal").modal('show');
}
})
// 点击保存
$(".publishBtn").click(function () {
if(validator.checkAll($publishForm)) {
if(!$publishForm.find("input[name='tags']").val()) {
$.alert.error("请至少选择一个标签");
return;
}
if(!$("#description").val() || !$("#keywords").val()) {
$.alert.error("请填写下SEO相关的内容,填写后更容易被收录哦");
return;
}
var isMarkdown = $("input[name=isMarkdown]").val();
if(isMarkdown == 1 || isMarkdown == 'true'){
$("#contentMd").val(simplemde.value());
$("#content").val(simplemde.markdown(simplemde.value()));
}
$publishForm.ajaxSubmit({
type: "post",
url: "/article/save",
success: function (json) {
if(isMarkdown == 1) {
$.tool.delCache("smde_" + op.uniqueId);
}
$.alert.ajaxSuccessConfirm(json, function () {
window.location.href = '/articles';
});
......
......@@ -227,7 +227,7 @@ function clearText($this, type, info) {
var thisValue = info[thisName];
if (type == 'radio') {
var _typeof = (typeof thisValue);
if (_typeof == "boolean") {
if (_typeof == "boolean" || _typeof == "number") {
$this.iCheck(((thisValue && 1 == $this.val()) || (!thisValue && 0 == $this.val())) ? 'check' : 'uncheck')
} else if (_typeof == "string") {
$this.iCheck(((thisValue == '1' && 1 == $this.val()) || (thisValue != '1' && 0 == $this.val())) ? 'check' : 'uncheck')
......
......@@ -2,8 +2,7 @@
<@header>
</@header>
<div class="">
<div class="clearfix"></div>
<form id="publishForm" class="form-horizontal form-label-left" novalidate onkeydown="if(event.keyCode==13){return false;}">
<div class="row">
<div class="col-md-12 col-sm-12 col-xs-12">
<@breadcrumb>
......@@ -19,103 +18,127 @@
<div class="clearfix"></div>
</div>
<div class="x_content">
<form id="publishForm" class="form-horizontal form-label-left" novalidate>
<input type="hidden" name="isMarkdown" value="0">
<input type="hidden" name="id">
<div class="item form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12" for="title">标题 <span class="required">*</span></label>
<div class="col-md-8 col-sm-8 col-xs-12">
<input type="text" class="form-control col-md-7 col-xs-12" name="title" id="title" required="required" placeholder="请输入标题"/>
</div>
<div class="col-md-1 col-sm-1 col-xs-12">
<div class="checkbox">
<label>
<input type="checkbox" class="square" name="original"> 原创
</label>
</div>
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12" for="title">封面 <span class="required">*</span></label>
<div class="col-md-3 col-sm-3 col-xs-12">
<div class="choose-local-img">
<button type="button" class="btn btn-success" id="file-upload-btn">上传图片</button>
<input id="cover-img-file" type="file" name="file" style="display: none">
<input id="cover-img-input" type="hidden" name="coverImage">
<div class="preview" class="fa-2x">
<img class="coverImage" src="" alt="">
</div>
</div>
</div>
<input type="hidden" name="isMarkdown" value="0">
<input type="hidden" name="id">
<div class="item form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12" for="title">标题 <span class="required">*</span></label>
<div class="col-md-8 col-sm-8 col-xs-12">
<input type="text" class="form-control col-md-7 col-xs-12" name="title" id="title" required="required" placeholder="请输入标题"/>
</div>
<div class="item form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12" for="password">内容 <span class="required">*</span></label>
<div class="col-md-11 col-sm-11 col-xs-12">
<div id="editor" style="width: 100%;height: 150px;"></div>
<div class="col-md-1 col-sm-1 col-xs-12">
<div class="checkbox">
<label>
<input type="checkbox" class="square" name="original"> 原创
</label>
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12" for="nickname"><i class="fa fa-refresh fa-fw fa-1x pointer" id="refressType"></i>分类 <span class="required">*</span></label>
<div class="col-md-11 col-sm-11 col-xs-12">
<div class="input-group">
<select class="form-control" name="typeId" id="typeId">
</select>
</div>
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12" for="mobile"><i class="fa fa-refresh fa-fw fa-1x pointer" id="refressTag"></i>标签 <span class="required">*</span></label>
<div class="col-md-11 col-sm-11 col-xs-12">
<ul class="list-unstyled list-inline" id="tag-list" style="line-height: 30px;">
</ul>
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12" for="password">内容 <span class="required">*</span></label>
<div class="col-md-11 col-sm-11 col-xs-12">
<div id="editor" style="width: 100%;height: 150px;"></div>
</div>
<div class="item form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12" for="mobile">状态 <span class="required">*</span></label>
<div class="col-md-11 col-sm-11 col-xs-12 fixed-radio-checkbox">
<ul class="list-unstyled list-inline">
<li><input type="radio" class="square" checked name="status" value="1"> 发布</li>
<li><input type="radio" class="square" name="status" value="0"> 草稿</li>
</ul>
</div>
</div>
<div class="form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12"></label>
<div class="col-md-10 col-sm-10 col-xs-12">
<button type="button" class="btn btn-success to-choose-info"><i class="fa fa-pencil"> 发布文章</i></button>
</div>
<div class="item form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12" for="comment">开启评论 <span class="required">*</span></label>
<div class="col-md-11 col-sm-11 col-xs-12 fixed-radio-checkbox">
<input type="checkbox" class="square" name="comment" id="comment">
</div>
</div>
</div>
</div>
</div>
<div class="modal fade" id="publishModal" tabindex="-1" role="dialog" aria-labelledby="publishLabel" data-backdrop="static">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-body">
<div class="" role="tabpanel" data-example-id="togglable-tabs">
<ul id="myTab" class="nav nav-tabs bar_tabs" role="tablist">
<li role="presentation" class="active">
<a href="#article" id="article-tab" role="tab" data-toggle="tab" aria-expanded="true">文章属性</a>
</li>
<li role="presentation" class="">
<a href="#seo" role="tab" id="seo-tab" data-toggle="tab" aria-expanded="false">SEO</a>
</li>
</ul>
<div id="" class="tab-content">
<div role="tabpanel" class="tab-pane fade active in" id="article" aria-labelledby="article-tab">
<div class="row">
<div class="col col-md-3">
<div class="item form-group">
<div class="col-md-12 col-sm-12 col-xs-12">
<div class="choose-local-img" style="text-align: center;">
<input id="cover-img-file" type="file" name="file" style="display: none">
<input id="cover-img-input" type="hidden" name="coverImage">
<div class="preview fa-2x" style="width: 100%;height: 186.98px;background: #f8fafc;border-radius: 5px;text-align: center;">
<img class="coverImage" src="" alt="">
</div>
<button type="button" class="btn btn-round btn-info" id="file-upload-btn" style="margin-top: 10px;">上传图片</button>
</div>
</div>
</div>
</div>
<div class="col col-md-9">
<div class="item form-group">
<label class="control-label col-md-2 col-sm-2 col-xs-12" for="nickname">分类 <span class="required">*</span></label>
<div class="col-md-8 col-sm-8 col-xs-12">
<div class="input-group">
<select class="form-control" name="typeId" id="typeId" target="combox" data-url="/type/listAll" data-method="post" required="required"></select>
</div>
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-2 col-sm-2 col-xs-12" for="mobile">标签(*3) <span class="required">*</span></label>
<div class="col-md-9 col-sm-9 col-xs-12">
<input type="text" name="tags" target="tagsinput" data-bind-box="#tags-list">
<ul class="list-unstyled list-inline tags-list" id="tags-list" target="combox" data-url="/tag/listAll" data-method="post" style="max-height: 150px;overflow-y: scroll;"></ul>
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-2 col-sm-2 col-xs-12" for="mobile">状态 <span class="required">*</span></label>
<div class="col-md-10 col-sm-10 col-xs-12 fixed-radio-checkbox">
<ul class="list-unstyled list-inline">
<li><input type="radio" class="square" checked name="status" value="1"> 发布</li>
<li><input type="radio" class="square" name="status" value="0"> 草稿</li>
</ul>
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-2 col-sm-2 col-xs-12" for="comment">开启评论 </label>
<div class="col-md-10 col-sm-10 col-xs-12 fixed-radio-checkbox">
<input type="checkbox" class="square" name="comment" id="comment">
</div>
</div>
</div>
</div>
</div>
</div>
<div class="custom-panel">
<h2 class="x_title custom-dropdown">其他录入项 <small> - 方便SEO收录</small> <i class="pull-right fa fa-angle-double-up"></i></h2>
<div class="custom-container">
<div role="tabpanel" class="tab-pane fade" id="seo" aria-labelledby="seo-tab">
<div class="item form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12" for="password">摘要 <span class="required">*</span></label>
<div class="col-md-10 col-sm-10 col-xs-12">
<label class="control-label col-md-2 col-sm-2 col-xs-12" for="password">摘要 <span class="required">*</span></label>
<div class="col-md-8 col-sm-8 col-xs-12">
<textarea class="form-control col-md-7 col-xs-12" id="description" name="description" required="required"></textarea>
</div>
</div>
<div class="item form-group">
<label class="control-label col-md-1 col-sm-1 col-xs-12" for="password">关键词 <span class="required">*</span></label>
<div class="col-md-10 col-sm-10 col-xs-12">
<label class="control-label col-md-2 col-sm-2 col-xs-12" for="password">关键词 <span class="required">*</span></label>
<div class="col-md-8 col-sm-8 col-xs-12">
<textarea class="form-control col-md-7 col-xs-12" id="keywords" name="keywords" required="required"></textarea>
</div>
</div>
</div>
</div>
<div class="ln_solid"></div>
<div class="form-group">
<div class="col-md-10 col-sm-10 col-xs-12">
<button type="button" class="btn btn-success publishBtn"><i class="fa fa-pencil"> 发布文章</i></button>
<button type="reset" class="btn btn-primary"><i class="fa fa-undo"> 重置</i></button>
</div>
</div>
</form>
</div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal"><i class="fa fa-close"> 返回修改</i></button>
<button type="button" class="btn btn-success publishBtn"><i class="fa fa-hand-o-up"> 确定发布</i></button>
</div>
</div>
</div>
</div>
</div>
<!--上传图片弹框-->
</form>
<div class="modal fade" id="chooseImg" tabindex="-1" role="dialog" aria-labelledby="addroleLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
......@@ -154,7 +177,6 @@
</div>
</div>
</div>
<!--上传图片弹框-->
<@footer>
<script>
articleId = '${id}';
......
......@@ -21,6 +21,8 @@
<link href="https://cdn.bootcss.com/bootstrap-datetimepicker/4.17.47/css/bootstrap-datetimepicker.min.css" rel="stylesheet">
<link href="https://cdn.bootcss.com/zTree.v3/3.5.29/css/metroStyle/metroStyle.min.css" rel="stylesheet">
<link href="https://cdn.bootcss.com/switchery/0.8.2/switchery.min.css" rel="stylesheet">
<link href="https://cdn.bootcss.com/bootstrap-tagsinput/0.8.0/bootstrap-tagsinput-typeahead.css" rel="stylesheet">
<link href="https://cdn.bootcss.com/bootstrap-tagsinput/0.8.0/bootstrap-tagsinput.css" rel="stylesheet">
<#--
<link href="https://cdn.bootcss.com/pnotify/3.2.1/pnotify.css" rel="stylesheet">
<link href="https://cdn.bootcss.com/pnotify/3.2.1/pnotify.buttons.css" rel="stylesheet">
......
......@@ -35,6 +35,7 @@
<script src="https://cdn.bootcss.com/zTree.v3/3.5.29/js/jquery.ztree.excheck.min.js"></script>
<script src="https://cdn.bootcss.com/switchery/0.8.2/switchery.min.js"></script>
<script src="https://unpkg.com/wangeditor@3.1.1/release/wangEditor.js" type="text/javascript"></script>
<script src="https://cdn.bootcss.com/bootstrap-tagsinput/0.8.0/bootstrap-tagsinput.js"></script>
<#--
<script src="https://cdn.bootcss.com/pnotify/3.2.1/pnotify.js"></script>
<script src="https://cdn.bootcss.com/pnotify/3.2.1/pnotify.buttons.js"></script>
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册