{template nheader.html}
<script>
function dr_send_type(id) {
    $('.send_type').hide();
    $('.send_type_'+id).show();
}
function dr_clear_user() {
    $("#user_result").html("");
}
function dr_clear_sc() {
    $(".sc_result").html("");
    $(".wz_result").val("");
}
function dr_tab(i) {
    if (i == 0) {
        $('input[name="msg_type"]').val('news');
    } else if (i==1) {
        $('input[name="msg_type"]').val('image');
    } else if (i==2) {
        $('input[name="msg_type"]').val('text');
    } else if (i==3) {
        $('input[name="msg_type"]').val('voice');
    } else if (i==4) {
        $('input[name="msg_type"]').val('video');
    }
    $(".sc_result").html("");
    $(".wz_result").val("");
}

function dr_add_user() {
    art.dialog.open("{dr_url('wsms/ajax_user')}", {
        title: "选择粉丝",
        opacity: 0.1,
        width: 700,
        height: 400,
        ok: function () {
            var iframe = this.iframe.contentWindow;
            if (!iframe.document.body) {
                alert("iframe loading")
                return false;
            };
            var id;
            var value;
            var select = iframe.document.getElementsByName("ids[]");

            for (var i=0; i < select.length; i++) {
                if (select[i].checked) {
                    id = select[i].value;
                    value = iframe.document.getElementById("dr_row_"+id).value;
                    $('#user_result').append('<input type="hidden" name="userid[]" value="'+id+'"><span class="badge badge-success">'+value+'</span>');
                }
            }
        },
        cancel: true
    });
}
function dr_add_sc(type, width) {
    art.dialog.open("{dr_url('wsms/ajax_sc')}&type="+type, {
        title: "选择素材",
        opacity: 0.1,
        width: width,
        height: 400,
        ok: function () {
            var iframe = this.iframe.contentWindow;
            if (!iframe.document.body) {
                alert("iframe loading")
                return false;
            };
            var id;
            var value;
            var select = iframe.document.getElementsByName("dr_select");
            for (var i=0; i < select.length; i++) {
                if (select[i].checked) {
                    id = select[i].value;
                    value = iframe.document.getElementById("dr_row_"+id).innerHTML;
                    $('.sc_result').html('<input type="hidden" name="sc" value="'+id+'">'+value+'');
                    $('.wz_result').val(value);
                }
            }
        },
        cancel: true
    });
}
</script>
<style>
    #user_result .badge{
        margin-top: 10px;margin-right: 10px;
    }
    .sc_result img {
        width: 200px;
        height: 200px;
    }
</style>
<form class="form-horizontal" action="" method="post" id="myform" name="myform">
    <input type="hidden" name="msg_type" value="appmsg">
    <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 ">

        <div class="portlet-title">
            <div class="caption">
                <span class="caption-subject font-green sbold">群发对象</span>
            </div>
        </div>
        <div class="portlet-body">

            <div class="row">
                <div class="portlet-body " style="padding-left:20px">

                    <div class="form-group">
                        <div class="col-md-9">
                            <div class="radio-list">
                                <label class="radio-inline"><input onclick="dr_send_type(1)" name="send_type" type="radio" value="1">全部粉丝</label>
                                <label class="radio-inline"><input onclick="dr_send_type(2)" name="send_type" type="radio" value="2">分组群发</label>
                                <label class="radio-inline"><input onclick="dr_send_type(3)" name="send_type" type="radio" value="3">指定粉丝【至少选择两个粉丝】</label>
                            </div>
                        </div>
                    </div>
                    <div class="form-group send_type send_type_2" style="display:none">
                        <div class="col-md-9">
                            <div class="radio-list">
                                {loop $groups $i $group}
                                <label class="radio-inline"><input name="group_id" type="radio" value="{$i}">{$group.name} ({$group.count})</label>
                                {/loop}
                            </div>
                        </div>
                    </div>
                    <div class="form-group send_type send_type_3" style="display:none">
                        <div class="col-md-12" style="padding-left:20px">
                            <a href="javascript:dr_add_user();"><i class="fa fa-plus-circle"></i> 选择粉丝</a>
                            &nbsp;&nbsp;&nbsp;&nbsp;
                            <a href="javascript:dr_clear_user();" ><i class="fa fa-trash"></i> 清空</a>
                        </div>
                        <div class="col-md-12" id="user_result" style="padding-top: 10px;padding-left: 20px;">
                        </div>
                    </div>


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

    <div class="portlet light bordered myfbody">

        <div class="portlet-title tabbable-line">
            <ul class="nav nav-tabs" style="float:left;">
                <li class="active">
                    <a href="#tab_0" onclick="dr_tab(0)" data-toggle="tab"> <i class="fa fa-file-image-o"></i> 图文 </a>
                </li>
                <li>
                    <a href="#tab_1" onclick="dr_tab(1)" data-toggle="tab"> <i class="fa fa-file-image-o"></i> 图片 </a>
                </li>
                <li>
                    <a href="#tab_2" onclick="dr_tab(2)" data-toggle="tab"> <i class="fa fa-file-text"></i> 文字 </a>
                </li>
                <li>
                    <a href="#tab_3" onclick="dr_tab(3)" data-toggle="tab"> <i class="fa fa-file-sound-o"></i> 语音 </a>
                </li>
                <li>
                    <a href="#tab_4" onclick="dr_tab(4)" data-toggle="tab"> <i class="fa fa-file-video-o"></i> 视频 </a>
                </li>
            </ul>
        </div>
        <div class="portlet-body">
            <div class="tab-content">

                <div class="tab-pane active" id="tab_0">

                    <div class="form-body">

                        <div class="form-group">
                            <label class="col-md-1 control-label"></label>
                            <div class="col-md-9">
                                <a href="javascript:dr_add_sc('tw', 1000);"><i class="fa fa-plus-circle"></i> 选择素材</a>
                                &nbsp;&nbsp;&nbsp;&nbsp;
                                <a href="javascript:dr_clear_sc();" ><i class="fa fa-trash"></i> 清空</a>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-1 control-label"></label>
                            <div class="col-md-9 sc_result">

                            </div>
                        </div>

                    </div>

                </div>
                <div class="tab-pane " id="tab_1">

                    <div class="form-body">

                        <div class="form-group">
                            <label class="col-md-1 control-label"></label>
                            <div class="col-md-9">
                                <a href="javascript:dr_add_sc('tp', 900);"><i class="fa fa-plus-circle"></i> 选择素材</a>
                                &nbsp;&nbsp;&nbsp;&nbsp;
                                <a href="javascript:dr_clear_sc();" ><i class="fa fa-trash"></i> 清空</a>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-1 control-label"></label>
                            <div class="col-md-9 sc_result">

                            </div>
                        </div>

                    </div>


                </div>
                <div class="tab-pane " id="tab_2">

                    <div class="form-body">

                        <div class="form-group">
                            <label class="col-md-1 control-label"></label>
                            <div class="col-md-9">
                                <a href="javascript:dr_add_sc('wz', 700);"><i class="fa fa-plus-circle"></i> 选择素材</a>
                                &nbsp;&nbsp;&nbsp;&nbsp;
                                <a href="javascript:dr_clear_sc();" ><i class="fa fa-trash"></i> 清空</a>
                            </div>
                        </div>

                        <div class="form-group">
                            <label class="col-md-1 control-label"></label>
                            <div class="col-md-9">
                                <div class="sc_result" style="display: none;"></div>
                                <textarea name="content" style="height: 200px" class="wz_result form-control"></textarea>
                            </div>
                        </div>

                    </div>


                </div>
                <div class="tab-pane " id="tab_3">

                    <div class="form-body">

                        <div class="form-group">
                            <label class="col-md-1 control-label"></label>
                            <div class="col-md-9">
                                <a href="javascript:dr_add_sc('yy', 700);"><i class="fa fa-plus-circle"></i> 选择素材</a>
                                &nbsp;&nbsp;&nbsp;&nbsp;
                                <a href="javascript:dr_clear_sc();" ><i class="fa fa-trash"></i> 清空</a>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-1 control-label"></label>
                            <div class="col-md-9 sc_result">

                            </div>
                        </div>

                    </div>


                </div>
                <div class="tab-pane " id="tab_4">

                    <div class="form-body">

                        <div class="form-group">
                            <label class="col-md-1 control-label"></label>
                            <div class="col-md-9">
                                <a href="javascript:dr_add_sc('sp', 700);"><i class="fa fa-plus-circle"></i> 选择素材</a>
                                &nbsp;&nbsp;&nbsp;&nbsp;
                                <a href="javascript:dr_clear_sc();" ><i class="fa fa-trash"></i> 清空</a>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-1 control-label"></label>
                            <div class="col-md-9 sc_result">

                            </div>
                        </div>

                    </div>


                </div>
                <div class="form-body">
                    <div class="form-group">
                        <label class="col-md-2 control-label">群发方式: </label>
                        <div class="col-md-9">
                            <div class="radio-list">
                                <label class="radio-inline"><input checked name="type" type="radio" value="0"> 客服群发</label>
                                <label class="radio-inline"><input name="type" type="radio" value="1"> 高级群发</label>
                            </div>
                            <span class="help-block">客服群发: 在48小时内给用户回复信息的客户才能收到</span>
                            <span class="help-block">高级群发: 每月只能发布四次</span>
                        </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"> <i class="fa fa-send"></i> 立即群发 </button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>

{template nfooter.html}