@{
    ViewBag.Title = "公告管理";
    Layout = "~/Areas/Theme/Views/Shared/wechatmaster.cshtml";
}
<script src="../../../../bstrap/b2/js/bootstrap.min.js"></script>
<link href="../../Scripts/jqrmgrid/css/ui.jqrmgrid.css" rel="stylesheet" />
<script src="../../Scripts/jqrmgrid/js/jquery.jqRmGrid.js?v=1.1"></script>
<link href="../../../../Scripts/jqrmgrid/js/ui.jqrmgrid_ex.css" rel="stylesheet" />
@*<link href="/bstrap/b3/css/bootstrap.css" rel="stylesheet" />*@
<style>
    .areas {
        width: 210px;
    }
</style>


<div id="table" class="panel panel-default">
    <div class="panel-heading" style="text-align: right; padding: 10px;">
        <button type="button" onclick="AddAction()" class="btn btn-primary">添加</button>
    </div>
    <div class="panel-body">
        <table class="blueglasshead" id="tablelist"></table>
    </div>
</div>

<div id="detail" style="display: none">
    <div class="form-horizontal" style="padding-top: 20px;" id="info">
        <div class="row-fluid">
            <div class="span8">
                <div class="control-group">
                    <label class="control-label control-label-search" for="Sort">状态</label>
                    <div class="controls controls-search">
                        <label>
                            <input type="checkbox" id="isenable" name="" value="" />
                            启用
                        </label>
                    </div>
                </div>
            </div>
        </div>
        <div class="row-fluid">
            <div class="span8">
                <div class="control-group">
                    <label class="control-label control-label-search" for="title">标题</label>
                    <div class="controls controls-search">
                        <input id="title" class="input-xlarge required" type="text" value="" name="title" placeholder="标题">
                    </div>
                </div>
            </div>
        </div>
        <div class="row-fluid">
            <div class="span8">
                <div class="control-group">
                    <label class="control-label control-label-search" for="content">公告内容</label>
                    <div class="controls controls-search">
                        <textarea id="content" style="height: 232px; width: 60%;"> </textarea>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <hr />
    <div class="row-fluid" style="margin-left: 100px;">
        <div class="span8">
            <div class="control-group">
                <label class="control-label control-label-search" for=""></label>
                <div class="controls controls-search">
                    <button class="btn btn-primary" onclick="save()" type="button" id="btnSave">保存 </button>
                    <button class="btn" onclick="Toggle()" type="button">返回 </button>
                </div>
            </div>
        </div>
    </div>
</div>
@{
    if (false)
    {<script src="../../../../Scripts/jquery-1.5.1-vsdoc.js"></script>}
}

<script type="text/javascript">
    var projectgrid = "#tablelist";
    var noticeid;
    $(function () {
        $(projectgrid).rmGrid({
            url: 'GetNoticeData',
            colNames: ['标题', '公告内容', '时间', '状态', '管理'],
            colModel: [
                { name: 'Title', width: 30, title: "", align: "center" },
                { name: 'Content', width: 30, title: "", align: "center" },
                { name: 'CreateDate', width: 30, title: "", align: "center" },
                { name: 'IsEnable', width: 30, title: "", align: "center" },
                { name: 'Operate', width: 30, align: "center" }
            ],
            rowNum: 30,
            isPage: true,
            zebraCrossing: false,
            width: "auto",
            gridComplete: function () {
                var ids = $(projectgrid).rmGrid('getDataIDs');
                for (var i = 0; i < ids.length; i++) {
                    var id = ids[i];
                    var model = $(projectgrid).rmGrid('getRowData', id);
                    var operateHtml =
                        '<button type="button"  onclick="EditAction(\'' + id + '\')" class="btn btn-small"><i class="icon-edit"></i>编辑</button>&nbsp;' +
                        '<button type="button"  onclick="Del(\'' + id + '\')" class="btn btn-small"><i class="icon-remove"></i>删除</button>&nbsp;';

                    var IsEnable = model.IsEnable ? '<span class="badge badge-success">是</span>' : '<span class="badge badge-important">否</span>';
                    if (model.IsEnable == true) {
                        operateHtml += '<button type="button"  onclick="Enable(\'' + id + '\',\'false\')" class="btn btn-small"><i class="icon-remove"></i>关闭</button>';
                    }
                    else {
                        operateHtml += '<button type="button"  onclick="Enable(\'' + id + '\',\'true\')" class="btn btn-small"><i class="icon-remove"></i>启用</button>';
                    }

                    $(projectgrid).rmGrid('setRowData', id, {
                        IsEnable: IsEnable,
                        Operate: operateHtml
                    });
                }

            }
        });
    });
    var AddAction = function () {
        $('#title').val('');
        $('#content').val('');
        $('#isenable').attr('');
        noticeid = '';
        Toggle();
    };
    var EditAction = function (id) {
        noticeid = id;
        var model = $(projectgrid).rmGrid('getRowData', id);
        $('#title').val(model.Title);
        $('#content').val(model.Content);
        $('#isenable').attr('checked', model.IsEnable);
        Toggle();
    };

    var Toggle = function () {
        $('#table,#detail').slideToggle();
    }
    var Enable = function (id, state) {
        $.ajax({
            url: "EnableNotice",
            type: "post",
            data: { id: id, isenable: state },
            success: function (context) {
                if (context.Result == "OK") {
                    $(projectgrid).rmGrid('setGridParam', { page: 1 }).reloadGrid()
                    layer.msg('设置成功', { icon: 1, time: 1000 });
                }
                else {
                    layer.alert(context.Msg, { icon: 2 });
                }
            }
        });
    }
    var Del = function (id) {
        layer.confirm('您确定要删除吗?', {
            btn: ['是', '否'], //按钮
        }, function (index) {
            $.ajax({
                url: "DelNotice",
                type: "post",
                data: { noticeid: id },
                success: function (context) {
                    if (context.Result == "OK") {
                        $(projectgrid).rmGrid('setGridParam', { page: 1 }).reloadGrid()
                        layer.msg('删除成功', { icon: 1, time: 1000 });
                    }
                    else {
                        layer.alert(context.Msg, { icon: 2 });
                    }
                    layer.closeAll(index);
                }
            });
        });

    }
    var save = function () {
        var data = {
            noticeid: noticeid,
            title: $('#title').val(),
            content: $('#content').val(),
            isenable: $('#isenable').attr('checked') == 'checked' ? "true" : "false"
        };

        if (data.title == '') {
            layer.msg('标题不能为空', { icon: 1, time: 1000 }); return false;
        }
        if (data.content == '') {
            layer.msg('内容不能为空', { icon: 1, time: 1000 }); return false;
        }

        $.ajax({
            url: "SaveNotice",
            type: "post",
            data: data,
            beforeSend: function () {
                layer.load(2);
            },
            error: function () {
                layer.closeAll();
            },
            success: function (s) {
                layer.closeAll();
                if (s.Result === "OK") {
                    layer.alert('保存成功', { icon: 1, time: 2000 });
                    $(projectgrid).rmGrid("setGridParam", { page: $(projectgrid).rmGrid('getGridParam', 'page') }).reloadGrid();
                    Toggle();
                } else {
                    layer.alert(context.Msg, { icon: 2 });
                }
            }
        });
    }
</script>
