{template nheader.html}
<link href="{THEME_PATH}admin/weixin/home/css/base.css" rel="stylesheet">
<link href="{THEME_PATH}admin/weixin/home/css/module.css" rel="stylesheet">
<link href="{THEME_PATH}admin/weixin/home/css/wei.css" rel="stylesheet">
<script type="text/javascript" src="{THEME_PATH}admin/weixin/static/bootstrap/js/bootstrap.min.js"></script>
<script type="text/javascript" src="{THEME_PATH}admin/weixin/static/uploadify/jquery.uploadify.min.js"></script>
<script type="text/javascript" src="{THEME_PATH}admin/weixin/static/zclip/ZeroClipboard.min.js"></script>
<script type="text/javascript" src="{THEME_PATH}admin/weixin/home/js/dialog.js"></script>
<script type="text/javascript" src="{THEME_PATH}admin/weixin/home/js/admin_common.js"></script>
<script type="text/javascript" src="{THEME_PATH}admin/weixin/home/js/admin_image.js"></script>
<script type="text/javascript" src="{THEME_PATH}admin/weixin/static/masonry/masonry.pkgd.min.js"></script>
<script type="text/javascript" src="{THEME_PATH}admin/weixin/static/jquery.dragsort-0.5.2.min.js"></script>
<script type="text/javascript">
    var  IMG_PATH = "{THEME_PATH}admin/weixin/Home/images";
    var  STATIC = "{THEME_PATH}admin/weixin/static";
    var  ROOT = "{SITE_URL}";
    var  UPLOAD_FILE = "{dr_url('weixin/ajaxload')}";
</script>
<style>
    .textarea { width: 100%;}
</style>

    <div class="page-bar">
        <ul class="page-breadcrumb mylink">
            {$menu.link}
        </ul>
        <ul class="page-breadcrumb myname">
            {$menu.name}
        </ul>

    </div>

    <h3 class="page-title">
        <small></small>
    </h3>
    <div class="portlet light bordered myfbody">

        <div class="portlet-title">
            <div class="caption">
                <span class="caption-subject font-green sbold uppercase">图文素材</span>
            </div>
        </div>
        <div class="portlet-body">



                    <div id="form" action="{dr_now_url()}" class="form-horizontal form-center">
                        <div class="material_form">
                            <div class="preview_area">
                                {if $data}
                                {loop $data $i $t}
                                <form data-index='{$i}' class="appmsg_item edit_item editing">
                                    <p class="time">{dr_date($t.inputtime)}</p>
                                    <div class="main_img">
                                        <img src="{dr_get_file($t.thumb)}" data-coverid="{$t.thumb}"/>
                                        <h6 class="title">{$main.title}</h6>
                                    </div>
                                    <p class="intro">{$t.description}</p>
                                    <input type="hidden" name="id" value="{$t.id}"/>
                                    <input type="hidden" name="title" value="{$t.title}" />
                                    <input type="hidden" name="cover_id" value="{$t.thumb}"/>
                                    <input type="hidden" name="intro" value="{$t.description}"/>
                                    <input type="hidden" name="author" value="{$t.author}"/>
                                    <input type="hidden" name="link" value="{$t.linkurl}"/>
                                    <textarea style="display:none" name="content">{$t.content}</textarea>
                                    <div class="hover_area"><a href="javascript:;" onClick="editItem(this)">编辑</a>{if $i>0}<a href="javascript:;" onClick="deleteItem(this)">删除</a>{/if}</div>
                                </form>
                                {/loop}
                                {else}
                                <form data-index='0' class="appmsg_item edit_item editing">
                                    <p class="time"></p>
                                    <div class="main_img">
                                        <img src="{THEME_PATH}admin/weixin/home/images/no_cover_pic.png" data-coverid="0"/>
                                        <h6 class="title">这是标题</h6>
                                    </div>
                                    <p class="intro"></p>
                                    <input type="hidden" name="title" placeholder="这是标题" />
                                    <input type="hidden" name="cover_id" value="0"/>
                                    <input type="hidden" name="intro" placeholder="这是摘要描述"/>
                                    <input type="hidden" name="author" placeholder="作者"/>
                                    <input type="hidden" name="link" placeholder="外链"/>
                                    <textarea style="display:none" name="content"></textarea>
                                    <div class="hover_area"><a href="javascript:;" onClick="editItem(this)">编辑</a></div>
                                </form>
                                {/if}
                                <div class="appmsg_edit_action">
                                    <a href="javascript:;" onClick="addMsg();">添加</a>
                                </div>
                            </div>
                            <div class="edit_area">
                                <em class="area_arrow"></em>
                                <div class="">
                                    <ul class="tab-pane in appmsg_edit_group">
                                        <li class="form-item cf">
                                            <label class="item-label"><span class="need_flag">*</span>标题<span class="check-tips"></span></label>
                                            <div class="controls">
                                                <input type="text" class="form-control " name="p_title" value="">
                                            </div>
                                        </li>
                                        <li class="form-item cf">
                                            <label class="item-label">作者<span class="check-tips"></span></label>
                                            <div class="controls">
                                                <input type="text" class="form-control " name="p_author" value="">
                                            </div>
                                        </li>
                                        <li class="form-item cf">
                                            <label class="item-label"><span class="need_flag">*</span>封面图片<span class="check-tips">图片900X500</span></label>
                                            <div class="controls uploadrow2" title="点击修改图片" rel="p_cover">
                                                <input type="file" id="upload_picture_p_cover">
                                                <input type="hidden" name="p_cover" id="cover_id_p_cover" data-callback="uploadImgCallback" value=""/>
                                                <div class="upload-img-box" rel="img" style="display:none">
                                                    <div class="upload-pre-item2"><img width="100" height="100" src=""/></div>
                                                    <em class="edit_img_icon">&nbsp;</em>
                                                </div>
                                            </div>
                                        </li>
                                        <li class="form-item cf">
                                            <label class="item-label">摘要<span class="check-tips"></span></label>
                                            <div class="controls">
                                                <label class="textarea ">
                                                    <textarea class="form-control " name="p_intro" ></textarea>
                                                </label>
                                            </div>
                                        </li>
                                        <li class="form-item cf">
                                            <label class="item-label"><span class="need_flag">*</span>正文<span class="check-tips"></span></label>
                                            <div class="controls">
                                                <label class="textarea">
                                                    {dr_field_input('content', 'Ueditor', array('option' => array( 'mode' => 1, 'height' => 300, 'width' => '100%')), '')}
                                                </label>
                                            </div>
                                        </li>
                                        <li class="form-item cf">
                                            <label class="item-label">外链<span class="check-tips"></span></label>
                                            <div class="controls">
                                                <input type="text" class="form-control " name="p_link" value="">
                                            </div>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>




            </div>
        </div>
    </div>

    <div class="myfooter">
        <div class="row">
            <div class="portlet-body form">
                <div class="form-body">
                    <div class="form-actions">
                        <div class="row">
                            <div class="col-md-12 text-center">
                                <button type="submit" class="btn green ajax-post" id="submit"> <i class="fa fa-save"></i> {fc_lang('保存')}</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>


<script type="text/javascript">
    $('#submit').click(function(){
        var postUrl = $('#form').attr('action');
        var dataJson = [];
        $('.edit_item').each(function(index, element) {
            dataJson.push($(this).serializeArray());
        });
        $(this).addClass('disabled');
        //console.log(dataJson);
        //console.log(JSON.stringify(dataJson));
        //提交数组字符串 php解析后进行保存
        $.post(postUrl,{'dataStr':JSON.stringify(dataJson)},function(data){
            $('#submit').removeClass('disabled');
            if(data.status==1){
                dr_tips(data.code,3, 1);
                setTimeout(function(){
                    location.href="{dr_url('wmaterial/tw')}";
                },100);
            }else{
                dr_tips(data.code);
            }
        }, 'json')
        return false;
    });
    $(function(){
        //初始化上传图片插件
        initUploadImg();

        showTab();

        $('.toggle-data').each(function(){
            var data = $(this).attr('toggle-data');
            if(data=='') return true;

            if($(this).is(":selected") || $(this).is(":checked")){
                change_event(this)
            }
        });

        $('select').change(function(){
            $('.toggle-data').each(function(){
                var data = $(this).attr('toggle-data');
                if(data=='') return true;

                if($(this).is(":selected") || $(this).is(":checked")){
                    change_event(this)
                }
            });
        });

        //动态预览
        $('input[name="p_title"]').keyup(function(){
            $('.editing').find('.title').text($(this).val());
            $('.editing').find('input[name="title"]').val($(this).val());
        });
        $('input[name="p_author"]').keyup(function(){
            $('.editing').find('.author').text($(this).val());
            $('.editing').find('input[name="author"]').val($(this).val());
        });
        $('input[name="p_link"]').keyup(function(){
            $('.editing').find('.link').text($(this).val());
            $('.editing').find('input[name="link"]').val($(this).val());
        });
        $('textarea[name="p_intro"]').keyup(function(){
            $('.editing').find('.intro').text($(this).val());
            $('.editing').find('input[name="intro"]').val($(this).val());
        });
        editor.addListener("contentChange",function(){
            $('.editing').find('textarea[name="content"]').val(editor.getContent());
        });
        editor.addListener("ready", function () {
            initForm($('.edit_item').eq(0));
        });


    });
    function addMsg(){
        var curCount = $('.edit_item').size();
        if(curCount>=8){
            updateAlert('你最多只可以增加8条图文信息');
            return false;
        }
        //console.log(curCount);
        var addHtml = $('<form data-index="'+curCount+'" class="appmsg_sub_item edit_item">'+
                '<p class="title"></p>'+
                '<div class="main_img">'+
                '<img src="{THEME_PATH}admin/weixin/home/images/no_cover_pic_s.png" data-coverid="0"/>'+
                '</div>'+
                '<input type="hidden" name="title" placeholder="这是标题"/>'+
                '<input type="hidden" name="cover_id" value="0"/>'+
                '<input type="hidden" name="intro" placeholder="这是摘要描述"/>'+
                '<input type="hidden" name="author" placeholder="作者"/>'+
                '<input type="hidden" name="link" placeholder="外链"/>'+
                '<textarea style="display:none" name="content"></textarea>'+
                '<div class="hover_area"><a href="javascript:;" onClick="editItem(this)">编辑</a><a href="javascript:;" onClick="deleteItem(this)">删除</a></div>'+
                '</form>');
        addHtml.insertBefore($('.appmsg_edit_action'));
    }
    function editItem(_this){
        $(_this).parents('.edit_item').addClass('editing');
        $(_this).parents('.edit_item').siblings().removeClass('editing');
        var index = $(_this).parents('.edit_item').data('index');
        if(index==0){
            $('.edit_area').css('margin-top',0);
        }else{
            $('.edit_area').css('margin-top',index*110+120);
        }
        initForm($(_this).parents('.edit_item'));
    }
    function deleteItem(_this){
        if(!confirm('确认删除？')) return false;

        var item_id = $(_this).parents('.edit_item').find('input[name="id"]').val();
        if(item_id){
            $.post("{dr_url('wmaterial/tw', array('action'=> 'del'))}",{id:item_id});
        }

        $(_this).parents('.edit_item').remove();
        var curCount = $('.edit_item').size();
        if(curCount==1){
            $('.edit_area').css('margin-top',0);
        }else{
            $('.edit_area').css('margin-top',(curCount-1)*110+120);
        }
        initForm($('.edit_item').eq(curCount-1));
    }
    function uploadImgCallback(name,id,src){
        $('.editing img').attr('src',src);
        $('.editing input[name="cover_id"]').val(id);
    }
    function initForm(_item){
        var title = $(_item).find('input[name="title"]').val();
        var author = $(_item).find('input[name="author"]').val();
        var link = $(_item).find('input[name="link"]').val();
        var intro = $(_item).find('input[name="intro"]').val();
        var content = $(_item).find('textarea[name="content"]').val();
        var src = $(_item).find('img').attr('src');
        $('input[name="p_title"]').val(title);
        $('input[name="p_author"]').val(author);
        $('input[name="p_link"]').val(link);
        $('textarea[name="p_intro"]').val(intro);
        if(!content)content=" ";
        if(content){
            editor.setContent(content);
        }
        $('.upload-img-box').show().find('img').attr('src',src);
    }
</script>
{template nfooter.html}