TaoLer/view/taoler/index/article/edit.html

277 lines
10 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.

{extend name="public/base" /}
{block name="title"}编辑帖子{/block}
{block name="link"}<link rel="stylesheet" href="/static/res/css/plyr.css" charset="utf-8">{/block}
{block name="column"}{/block}
{block name="content"}
<div class="layui-container fly-marginTop">
<div class="fly-panel" pad20 style="padding-top: 5px;">
<!--<div class="fly-none">没有权限</div>-->
<div class="layui-form layui-form-pane">
<div class="layui-tab layui-tab-brief" lay-filter="user">
<ul class="layui-tab-title">
<li class="layui-this">{:lang('edit post')}</li>
</ul>
<div class="layui-form layui-tab-content" id="LAY_ucm" style="padding: 20px 0;">
<div class="layui-tab-item layui-show">
<input type="hidden" name="id" value="{$article.id}">
<div class="layui-row layui-col-space15 layui-form-item">
<div class="layui-col-md3">
<label class="layui-form-label">{:lang('special column')}</label>
<div class="layui-input-block">
<select lay-verify="required" name="cate_id" lay-filter="column">
<option></option>
{volist name="cateList" id="cate"}
<option value="{$cate.id}" {if $article.cate_id == $cate.id}selected{/if}>{:cookie('think_lang') == 'en-us' ? $cate.ename : $cate.catename}</option>
{/volist}
</select>
</div>
</div>
<div class="layui-col-md8">
<label for="L_title" class="layui-form-label">{:lang('title')}</label>
<div class="layui-input-block">
<input type="text" id="L_title" name="title" required lay-verify="required" autocomplete="off" class="layui-input" value="{$article.title}">
<input type="hidden" id="L_title_color" name="title_color" autocomplete="off" class="layui-input" value="{$article.title_color}">
<input type="hidden" name="user_id" value="{$article.user_id}">
</div>
</div>
{if ($user.auth == 1)}
<div class="layui-col-md1">
<div id="color"></div>
<div id="test9" style="margin-left: 30px;"></div>
</div>
{/if}
</div>
<div class="layui-row layui-col-space15 layui-form-item layui-hide" id="LAY_quiz">
<div class="layui-col-md3">
<label class="layui-form-label">所属产品</label>
<div class="layui-input-block">
<select name="project">
<option></option>
<option value="layui">layui</option>
<option value="独立版layer">独立版layer</option>
<option value="独立版layDate">独立版layDate</option>
<option value="LayIM">LayIM</option>
<option value="Fly社区模板">Fly社区模板</option>
</select>
</div>
</div>
<div class="layui-col-md3">
<label class="layui-form-label" for="L_version">版本号</label>
<div class="layui-input-block">
<input type="text" id="L_version" value="" name="version" autocomplete="off" class="layui-input">
</div>
</div>
<div class="layui-col-md6">
<label class="layui-form-label" for="L_browser">浏览器</label>
<div class="layui-input-block">
<input type="text" id="L_browser" value="" name="browser" placeholder="浏览器名称及版本IE 11" autocomplete="off" class="layui-input">
</div>
</div>
</div>
<div class="layui-form-item layui-form-text">
<div class="layui-input-block">
<textarea id="L_content" name="content" required lay-verify="required" placeholder="详细描述" class="layui-textarea fly-editor" style="height: 260px;">{$article.content}</textarea>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">悬赏飞吻</label>
<div class="layui-input-inline" style="width: 190px;">
<select name="experience">
<option value="20">20</option>
<option value="30">30</option>
<option value="50">50</option>
<option value="60">60</option>
<option value="80">80</option>
</select>
</div>
<div class="layui-form-mid layui-word-aux">发表后无法更改飞吻</div>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">{:lang('enclosure')}</label>
<div class="layui-input-inline" style="width: 190px;">
<input type="text" class="layui-input" name="upzip" value="{$article.upzip}" placeholder="zip,jpg格式" title="上传附件"/>
</div>
<button type="button" class="layui-btn" id="zip-button"><i class="layui-icon"></i>上传文件</button>
</div>
</div>
<div class="layui-form-item">
<div class="layui-inline">
<label class="layui-form-label">{:lang('add tags')}</label>
<div class="layui-input-inline" style="width: 190px;">
<input type="text" class="layui-input" name="tags" placeholder="多个标签用,号隔开" title="添加标签"/>
</div>
<button type="button" class="layui-btn" id="article-tags-button">{:lang('add')}</button>
</div>
</div>
<div class="layui-form-item">
<div class="layui-btn-container">
{volist name="tags" id="vo" }
<button type="button" class="layui-btn" value="{$vo}">{$vo}</button>
{/volist}
</div>
</div>
<div class="layui-form-item">
<label for="L_vercode" class="layui-form-label">{:lang('captcha')}</label>
<div class="layui-input-inline">
<input type="text" id="L_vercode" name="captcha" required lay-verify="required" placeholder="{:lang('please input the captcha')}" autocomplete="off" class="layui-input">
</div>
<div class="layui-form-mid">
<span style="color: #c00;"><img id="captcha" src="{:captcha_src()}" onclick="this.src='{:captcha_src()}?'+Math.random();" style="float:left; cursor:pointer;" alt="captcha" /></span>
</div>
</div>
<div class="layui-form-item">
<button type="submit" class="layui-btn" lay-filter="article-edit" lay-submit id="edit">{:lang('post now')}</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
{/block}
{block name="script"}
<script>
layui.use(['fly','colorpicker','form','upload','plyr'], function(){
var $ = layui.$
,fly = layui.fly
,colorpicker = layui.colorpicker
,form = layui.form
,upload = layui.upload
,plyr = layui.plyr;
//预定义颜色项
colorpicker.render({
elem: '#color'
,color: '{$article.title_color}'
,predefine: true // 开启预定义颜色
,done: function(color){
//console.log(color);
//譬如你可以在回调中把得到的 color 赋值给表单
$('#L_title_color').val(color);
//改变标题颜色
$('#L_title').css("color", color);
}
});
//指定允许上传的文件类型
upload.render({
elem: '#zip-button'
,url: '{:url('article/upzip')}' //改成您自己的上传接口
,accept: 'file' //普通文件
,done: function(res){
if(res.status == 0){
$('input[name="upzip"]').val(res.url);
layer.msg('上传成功');
} else {
layer.msg(res.msg);
}
}
});
//编辑文章
form.on('submit(article-edit)', function(data){
var field = data.field;
var numArr = new Array();
$('.layui-btn-container').children('button').each(function(){
numArr.push($(this).val());//添加至数组
});
tags = numArr.join(',');
$.ajax({
type:"post",
url:"{:url('article/edit')}",
data:{"id":field.id,"cate_id":field.cate_id,"title":field.title,"title_color":field.title_color,"user_id":field.user_id,"content":field.content,"upzip":field.upzip,"tags":tags,"captcha":field.captcha},
daType:"json",
success:function (data){
if (data.code == 0) {
layer.msg(data.msg,{
icon:6,
time:2000
}, function(){
location.href = data.url;
});
} else {
layer.open({
title:'编辑失败',
content:data.msg,
icon:5,
anim:6
});
layui.jquery('#captcha').attr('src', '{:captcha_src()}?'+Math.random());
};
}
});
return false;
});
//添加tags
$('#article-tags-button').on('click',function(){
var tags = $("input[name='tags']").val();
if(tags == ''){
layer.msg('不能为空');
return false;
}
var numArr = new Array();
$('.layui-btn-container').children('button').each(function(){
numArr.push($(this).val());//添加至数组
});
for(var i=0; i<numArr.length; i++){
if(tags.indexOf(numArr[i])>=0){
layer.msg('不能重复添加'+numArr[i]);
return false;
}
}
//保存tags
$.ajax({
type:"post",
url:"{:url('article/tags')}",
data:{"tags":tags},
daType:"json",
success:function (data){
if (data.code == 0) {
for(var i=0; i<data.data.length; i++){
$('.layui-btn-container').append('<button type="button" class="layui-btn" value='+data.data[i]+'>'+data.data[i]+'</button>');
}
$("input[name='tags']").val("");
} else {
layer.open({
title:'添加失败',
content:data.msg,
icon:5,
anim:6
});
};
}
});
return false;
});
//删除tag
$(document).ready(function(){
$('.layui-btn-container').on('click','button',function(){
$(this).remove();
});
});
//如果你是采用模版自带的编辑器,你需要开启以下语句来解析。
$('.layui-textarea').each(function(){
var othis = $(this), html = othis.html();
othis.attr(fly.content(html));
})
//加载播放器
plyr.setup();
});
</script>
{/block}