{extend name="public/container"}
{block name="head_top"}
<link href="{__ADMIN_PATH}plug/umeditor/themes/default/css/umeditor.css" type="text/css" rel="stylesheet">
<link href="{__ADMIN_PATH}module/wechat/news/css/style.css" type="text/css" rel="stylesheet">
<link href="{__FRAME_PATH}css/plugins/chosen/chosen.css" rel="stylesheet">
<script type="text/javascript" src="{__ADMIN_PATH}plug/umeditor/third-party/jquery.min.js"></script>
<script type="text/javascript" src="{__ADMIN_PATH}plug/umeditor/third-party/template.min.js"></script>
<script type="text/javascript" charset="utf-8" src="{__ADMIN_PATH}plug/umeditor/umeditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="{__ADMIN_PATH}plug/umeditor/umeditor.min.js"></script>
<script src="{__ADMIN_PATH}frame/js/ajaxfileupload.js"></script>
<script src="{__ADMIN_PATH}plug/validate/jquery.validate.js"></script>
<script src="{__FRAME_PATH}js/plugins/chosen/chosen.jquery.js"></script>
{/block}
{block name="content"}
<div class="row" style="width: 100%">
   <div class="col-sm-12">
       <div class="col-sm-2 panel panel-default news-left">
               <div class="panel-heading">文章列表</div>
               <div class="panel-body news-box type-all" >
                   {if condition="$news['image_input']"}
                   <div class="news-item transition active news-image" style="margin-bottom: 20px;background-image:url({$news['image_input']})">
                   {else/}
                   <div class="news-item transition active news-image" style="margin-bottom: 20px;background-image:url('/public/system/module/wechat/news/images/image.png')">
                   {/if}
                       <input type="hidden" name="new_id" value="{$news.id}" class="new-id">
                   </div>
               </div>
       </div><!-- col-sm-10 panel panel-default news-right -->
       <div class="col-sm-12 panel panel-default" >
               <div class="panel-heading">文章内容编辑</div>
               <div class="panel-body">
                   <form class="form-horizontal" id="signupForm">
                       <div class="form-group">
                           <div class="col-md-12">
                               <div class="input-group">
                                   <span class="input-group-addon">标题</span>
                                   <input maxlength="64" placeholder="请在这里输入标题" name="title" class="layui-input" id="title" value="{$news.title}">
                                   <input type="hidden" name="id" value="{$news.id}">
                               </div>
                           </div>
                       </div>
                       <div class="form-group">
                           <div class="col-md-12">
                               <div class="input-group">
                                   <span class="input-group-addon">作者</span>
                                   <input maxlength="8" placeholder="请输入作者" name="author" class="layui-input" id="author" value="{$news.author}">
                               </div>
                           </div>
                       </div>
                       <div class="form-group">
                           <div class="col-md-12">
                               <div class="input-group">
                                   <span class="input-group-addon">文章分类</span>
                                   <?php if(empty($all)){?>
                                      <select data-placeholder="请先添加文章分类" class="chosen-select" multiple style="width:100%;" tabindex="4" name="type_id">
                                   <?php }else{ ?>
                                      <select data-placeholder="选择文章分类" class="chosen-select" multiple style="width:100%;" tabindex="4" name="type_id" {eq name="$select" value="1"}disabled="disabled"{/eq}>
                                   <?php }?>
                                       {volist name="all" id="vo" key="k"}
                                          {if condition="$key eq $cid"}
                                          <option value="{$key}" selected hassubinfo="true" >{$vo}</option>
                                          {elseif condition="in_array($key,$news['cid'])"}
                                          <option value="{$key}" selected hassubinfo="true" >{$vo}</option>
                                          {else/}
                                          <option value="{$key}" hassubinfo="true" >{$vo}</option>
                                        {/if}
                                       {/volist}
                                   </select></div>
                           </div>
                       </div>
                       <div class="form-group">
                           <div class="col-md-12">
                               <div class="form-control" style="height:auto">
                                   <label style="color:#ccc">图文封面大图片设置</label>
                                   <div class="row nowrap">
                                       <div class="col-xs-3" style="width:160px">
                                           {if condition="$news['image_input']"}
                                           <div class="upload-image-box transition image_img" style="height: 80px;background-repeat:no-repeat;background-size:contain;background-image:url({$news['image_input']})">
                                               <input value="" type="hidden" name="local_url">
                                           </div>
                                           {else/}
                                           <div class="upload-image-box transition image_img" style="height: 80px;background-repeat:no-repeat;background-size:contain;background-image:url('/public/system/module/wechat/news/images/image.png')">
                                               <input value="" type="hidden" name="local_url">
                                           </div>
                                           {/if}
                                       </div>
                                       <div class="col-xs-6">
                                           <input type="file" class="upload" name="image" style="display: none;" id="image" />
                                           <br>
                                           <a class="btn btn-sm add_image upload_span">上传图片</a>
                                           <br>
                                           <br>
                                       </div>
                                   </div>
                                   <input type="hidden" name="image" id="image_input" value="{$news['image_input']}"/>
                                   <p class="help-block" style="margin-top:10px;color:#ccc">封面大图片建议尺寸：900像素 * 500像素</p>
                               </div>
                           </div>
                       </div>
                       <div class="form-group">
                           <div class="col-md-12">
                               <label style="color:#aaa">文章简介</label>
                               <textarea  id="synopsis" name="synopsis" class="layui-input" style="height:80px;resize:none;line-height:20px;color:#333;">{$news.synopsis}</textarea>
                           </div>
                       </div>
                       <div class="form-group">
                           <div class="col-md-12">
                               <label style="color:#aaa">文章内容</label>
                               <textarea type="text/plain" id="myEditor" style="width:100%;">{$news['content']}</textarea>
                           </div>
                       </div>
                       <div class="form-group">
                           <div class="col-md-12">
                               <div class="col-md-6">
                                   <label style="color:#aaa">是否显示banner</label>
                                   <br/>
                                   <input type="radio" name="is_banner" class="layui-radio" value="0" {eq name="news['is_banner']" value="0"}checked{/eq}>否
                                   <input type="radio" name="is_banner" class="layui-radio" value="1" {eq name="news['is_banner']" value="1"}checked{/eq}>是
                               </div>
                               <div class="col-md-6">
                                   <label style="color:#aaa">是否显示热门</label>
                                   <br/>
                                   <input type="radio" name="is_hot" class="layui-radio" value="0" {eq name="news['is_hot']" value="0"}checked{/eq}>否
                                   <input type="radio" name="is_hot" class="layui-radio" value="1" {eq name="news['is_hot']" value="1"}checked{/eq}>是
                               </div>
                           </div>
                       </div>

                       <div class="form-group">
                           <div class="col-md-12">
                               <label style="display:block"><span style="color:#aaa;">原文链接<b>选填</b>，填写之后在图文左下方会出现此链接</span>
                                   <input maxlength="200" name="url" class="layui-input" id="url" value="{$news.url}">
                               </label>
                           </div>
                       </div>
                       <div class="form-actions">
                           <div class="row">
                               <div class="col-md-offset-4 col-md-9">
                                   <button type="button" class="btn btn-w-m btn-info save_news">保存</button>
                               </div>
                           </div>
                       </div>
                   </form>
               </div>
       </div>
   </div>
</div>
{/block}
{block name="script"}
<script>
            var editor = document.getElementById('myEditor');
            editor.style.height = '300px';
            //实例化编辑器
            var um = UM.getEditor('myEditor',{
        //        fullscreen:true
            });
            /**
            * 获取编辑器内的内容
            * */
            function getContent() {
                return (UM.getEditor('myEditor').getContent());
            }
            function hasContent() {
                return (UM.getEditor('myEditor').hasContents());
            }
            function createFrame(title,src,opt){
                opt === undefined && (opt = {});
                return layer.open({
                    type: 2,
                    title:title,
                    area: [(opt.w || 700)+'px', (opt.h || 650)+'px'],
                    fixed: false, //不固定
                    maxmin: true,
                    moveOut:false,//true  可以拖出窗外  false 只能在窗内拖
                    anim:5,//出场动画 isOutAnim bool 关闭动画
                    offset:'auto',//['100px','100px'],//'auto',//初始位置  ['100px','100px'] t[ 上 左]
                    shade:0,//遮罩
                    resize:true,//是否允许拉伸
                    content: src,//内容
                    move:'.layui-layer-title'
                });
            }
            function changeIMG(index,pic){
                $(".image_img").css('background-image',"url("+pic+")");
                $(".active").css('background-image',"url("+pic+")");
                $('#image_input').val(pic);
            };
            /**
             * 上传图片
             * */
            $('.upload_span').on('click',function (e) {
//                $('.upload').trigger('click');
                createFrame('选择图片','{:Url('widget.images/index')}?fodder=image');
            })

            /**
             * 编辑器上传图片
             * */
            $('.edui-icon-image').on('click',function (e) {
//                $('.upload').trigger('click');
                createFrame('选择图片','{:Url('widget.images/index')}?fodder=image');
            })

            /**
            * 提交图文
            * */
            $('.save_news').on('click',function(){
                var list = {};
                list.title = $('#title').val();/* 标题 */
                list.author = $('#author').val();/* 作者 */
                list.image_input = $('#image_input').val();/* 图片 */
                list.content = getContent();/* 内容 */
                list.synopsis = $('#synopsis').val();/* 简介 */
                list.url = $('#url').val();/* 原文链接 */
                list.cid = $('.chosen-select').val();
                list.is_hot = $("input[name='is_hot']:checked").val();
                list.is_banner = $("input[name='is_banner']:checked").val();
                var Expression = /http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/;
                var objExp=new RegExp(Expression);
                if(list.title == ''){
                    $eb.message('error','请输入标题');
                    return false;
                }
                if(list.author == ''){
                    $eb.message('error','请输入作者');
                    return false;
                }
                if(list.image_input == ''){
                    $eb.message('error','请添加图片');
                    return false;
                }
                if(list.content == ''){
                    $eb.message('error','请输入内容');
                    return false;
                }
                if(list.synopsis == ''){
                    $eb.message('error','请输入简介');
                    return false;
                }if(list.url != ''){
                    if(objExp.test(list.url) != true){
                        $eb.message('error','网址格式不正确！请重新输入');
                        return false;
                    }
                }
                var id = $('.type-all>.active>.new-id').val();
                if(id != ''){
                    list.id = id;
                }
                var data = {};
                $.ajax({
                    url:"{:Url('add_new')}",
                    data:list,
                    type:'post',
                    dataType:'json',
                    success:function(re){
                        if(re.code == 200){
                            data[re.data] = list;
                            $('.type-all>.active>.new-id').val(re.data);
                            $eb.message('success',re.msg);
                            setTimeout(function (e) {
                                parent.$(".J_iframe:visible")[0].contentWindow.location.reload();
                                parent.layer.close(parent.layer.getFrameIndex(window.name));
                            },600)
                        }else{
                            $eb.message('error',re.msg);
                        }
                    }
                })
            });
            $('.article-add ').on('click',function (e) {
                var num_div = $('.type-all').children('div').length;
                if(num_div > 7){
                  $eb.message('error','一组图文消息最多可以添加8个');
                  return false;
                }
                var url = "/public/system/module/wechat/news/images/image.png";
                html = '';
                html += '<div class="news-item transition active news-image" style=" margin-bottom: 20px;background-image:url('+url+')">'
                    html += '<input type="hidden" name="new_id" value="" class="new-id">';
                    html += '<span class="news-title del-news">x</span>';
                html += '</div>';
                $(this).siblings().removeClass("active");
                $(this).before(html);
            })
            $(document).on("click",".del-news",function(){
                $(this).parent().remove();
            })
            $(document).ready(function() {
                var config = {
                    ".chosen-select": {},
                    ".chosen-select-deselect": {allow_single_deselect: true},
                    ".chosen-select-no-single": {disable_search_threshold: 10},
                    ".chosen-select-no-results": {no_results_text: "沒有找到你要搜索的分类"},
                    ".chosen-select-width": {width: "95%"}
                };
                for (var selector in config) {
                    $(selector).chosen(config[selector])
                }
            })
        </script>
{/block}