TaoLer/view/taoler/index/article/add.html
2022-12-25 17:13:13 +08:00

370 lines
14 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"} {/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('add post')}<!-- 编辑帖子 --></li>
</ul>
<div class="layui-tab-content" id="LAY_ucm" style="padding: 20px 0">
<div class="layui-tab-item layui-show">
{if config('taoler.config.is_post') == 1}
<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">
<div id="CateId" class="xm-select-demo"></div>
</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" style="position:relative;" value=""/>
<input type="hidden" id="L_title_color" name="title_color" autocomplete="off" class="layui-input" />
<input type="hidden" name="user_id" value="{:session('user_id')}" />
<div class="layui-input bdsug layui-hide">
<ul class="wordlist">
</ul>
</div>
</div>
</div>
{if ($user.auth == 1)}
<div class="layui-col-md1">
<div id="color"></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="{:lang('please input the content')}" class="layui-textarea fly-editor"></textarea>
</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="" placeholder="zip,image" title="上传附件" />
</div>
<button type="button" class="layui-btn" id="zip-button"><i class="layui-icon"></i>{:lang('uploads')}</button>
</div>
</div>
{//描述}
<div class="layui-form-item layui-hide">
<label class="layui-form-label">{:lang('description')}</label>
<div class="layui-input-block">
<textarea name="description" class="layui-textarea" placeholder="SEO {:lang('description')}"></textarea>
</div>
</div>
{//关键词}
<div class="layui-form-item layui-hide">
<label class="layui-form-label">{:lang('add keywords')}</label>
<div class="layui-input-block">
<!-- <input type="text" class="layui-input" name="" id="inputTags" value="" placeholder="多个回车添加" title="添加关键词" /> -->
<input type="text" class="layui-input" name="keywords" value="" placeholder="多个用逗号隔开" title="{:lang('add keywords')}" />
</div>
</div>
{//tag}
<div class="layui-form-item">
<label class="layui-form-label">{:lang('add tags')}</label>
<div class="layui-input-block">
<div id="tag"></div>
</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-->
{if config('taoler.config.post_captcha') == 1}
<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 layui-word-aux" style="padding-top: 0px !important">
<img id="captcha" src="{:captcha_src()}" onclick="this.src='{:captcha_src()}?'+Math.random();" style="float: left; cursor: pointer" alt="captcha" />
</div>
</div>
{/if}
<div class="layui-form-item">
<button type="submit" class="layui-btn" lay-filter="article-add" lay-submit id="add">{:lang('post now')}</button>
</div>
</div>
{else /}
<div class="layui-form-item">抱歉,系统维护中,暂时禁止发帖!</div>
{/if}
</div>
</div>
</div>
</div>
</div>
{include file="public/menu" /}
{/block}
{block name="script"}
{:hook('taonyeditor')}
<script src="/static/xm-select.js"></script>
<script>
layui.use(["fly"], function () {
var $ = layui.jquery,
fly = layui.fly,
form = layui.form,
colorpicker = layui.colorpicker,
upload = layui.upload;
//获取百度标签标志tag或者word;
var flag = 'word';
//如果你是采用模版自带的编辑器,你需要开启以下语句来解析。
var taonystatus = "{:hook('taonystatus')}";
// 编辑器插件启用状态
var isShow = taonystatus ? false : true;
if(isShow) {
$('.layui-textarea').each(function(){
var othis = $(this), html = othis.html();
othis.attr(fly.content(html));
})
}
// 分类选择
$(function(){
//这里模拟ajax
$.get("{:url('article/getCateTree')}",function(res){
var cid = "{$cid}";
var data = res.data;
// 渲染下拉树
xmSelect.render({
el: '#CateId',
name: 'cate_id',
height: '250px',
layVerify: 'required',
layVerType: 'tips',
data: data,
initValue: [cid],
model: {label: {type: 'text'}},
prop: {
name: 'catename',
value: 'id'
},
radio: true,
clickClose: true,
tree: {
show: true,
indent: 15,
strict: false,
expandedKeys: true
},
tips: '请选择'
});
});
});
// tag标签
$(function(){
//1.渲染标签
var addTags = xmSelect.render({
el: '#tag',
name: 'tagid',
layVerify: '',
layVerType: 'msg',
paging: true,
pageSize: 5,
data: []
});
//2.动态标签赋值
$.get("{:url('get_all_tag')}",function(res){
if(res.code == 0){
addTags.update({
data: res.data,
autoRow: true,
})
}
});
});
// 通过标题内容自动获取tag的内容
var conf = "{:empty(config('taoler.baidu.client_id'))}";
if (conf !== "1") {
$("#L_title").on("blur", function () {
var title = $(this).val();
var content = $("#L_content").val();
getBdiduWords(flag,title,content);
});
}
// 从详情页自动调用端口过滤,获取描述信息
$("#L_content").mouseleave(function() {
var content = $(this).val().replace(/[\r\n]/g,"").replace(/\n/g, '').replace(/\s/g, '').replace(/\t/g, '');
var title = $("#L_title").val();
$.post("{:url('article/getDescription')}", { content: content }, function(data){
if (data.code == 0) {
$('[name="description"]').val(data.data);
}
});
getBdiduWords(flag,title,content);
});
// 获取百度分词接口的关键词
function getBdiduWords(flag,title,content)
{
// console.log(flag,title,content)
$.post("{:url('article/keywords')}",{ keywords: title, content:content, flag: flag }, function (res) {
if (res.code == 0) {
$("input[name='keywords']").val(res.data.join(','));
}
},
)
}
// 百度词条
(function(){
var baidu_title_switch = "{:config('taoler.config.baidu_title_switch')}";
if(baidu_title_switch == 1) {
$("#L_title").bind('input propertychange',function () {
var title = $(this).val();
var str = '';
if(title.length > 0 ) {
$.post("{:url('article/getWordList')}",{title:title},function(res){
// 动态生成ur>li内容
if (res.code == 0) {
// 显示动态框
$(".bdsug").removeClass('layui-hide');
for (var i = 0; i < res.data.length; i++) {
//str += '<li data-key=' + res.data[i].q + '><b>' + res.data[i].q.replace(title,'') + '</b></li>';
str += '<li data-key=' + res.data[i].q + '><b>' + res.data[i].q + '</b></li>';
}
// 清空ul并追加li
$('.wordlist').empty().append(str);
// 点击李获取li值并复制给#L_title input的value
$(".bdsug li").on('click',function(){
var word = $(this).attr('data-key');
var words = title + '(' + word + ')';
$("#L_title").val(words);
// 关闭动态框
$(".bdsug").addClass('layui-hide');
});
} else {
$(".bdsug").addClass('layui-hide');
}
});
} else {
$(".bdsug").addClass('layui-hide');
}
});
}
}())
//关闭百度词条
$(function(){
$(".bdsug").mouseleave(function(){
$(this).addClass('layui-hide');
// $("#LAY_ucm").click(function(){
// $(this).addClass('layui-hide');
// });
});
});
// 发布文章
form.on("submit(article-add)", function (data) {
var field = data.field;
console.log(field)
var index = layer.load(1);
$.ajax({
type: "post",
url: "{:url('article/add')}",
data: field,
dataType: "json",
success: function (data) {
if (data.code == 0) {
notify.success(data.msg, function () {
location.href = data.url;
});
} else {
notify.error(data.msg);
$("#captcha").attr("src", "{:captcha_src()}?" + Math.random());
}
layer.close(index);
},
});
return false;
});
// 改变标题颜色
colorpicker.render({
elem: "#color",
color: "#393d49",
predefine: true, // 开启预定义颜色
done: function (color) {
//譬如你可以在回调中把得到的 color 赋值给表单
$("#L_title_color").val(color);
$("#L_title").css("color", color);
},
});
//上传附件
upload.render({
elem: "#zip-button",
url: "{:url('article/uploads')}",
data: { type: "zip" },
accept: "file", //普通文件
done: function (res) {
if (res.status == 0) {
$('input[name="upzip"]').val(res.url);
layer.msg("上传成功");
} else {
layer.msg(res.msg);
}
},
});
});
</script>
{/block}