{layout name="layout" /}

<nav class="breadcrumb">
    <span><a href="/">首页</a></span>
    <span>&gt;</span>
    <span><a href="/seller/index">销售员</a></span>
    <span>&gt;</span>
    <span><a href="javascript:void(0);">部门管理</a></span>
</nav>

<div class="content">
    <div class="row" style="margin: 0;">
        <div class="col-md-3 btn-top-box">
            <!-- <a href="javascript:;" class="btn btn-danger radius" onClick="del_all()">批量删除</a> -->
            <a href="javascript:save(0);" class="btn btn-success radius" >新增</a>
            <a href="/seller/index" class="btn btn-default radius" >返回</a>
        </div>
    </div>
    <div class="col-md-8 mt-20">
        <table class=" table table-hover table-bordered">
            <thead>
                <tr>
                    <th width="25">
                        <input type="checkbox" value="" name="">
                    </th>
                    <th class="text-center">id</th>
                    <th class="text-center">部门名称</th>
                    <th class="text-center">主管</th>
                    <th class="text-center">操作</th>
                </tr>
            </thead>
            <tbody>
                {foreach $list as $value}
                <tr>
                    <td>
                        <input type="checkbox" value="{$value.id}" name="checkbox[]">
                    </td>
                    <td class="text-center">{$value.id}</td>
                    <td class="text-center">{$value.name}</td>
                    <td class="text-center">{$value.director}</td>
                    <td class="text-center td-manager">
                        <a href="javascript:void(0);" onClick="save('{$value.id}')">修改</a>
                        <a href="javascript:void(0);" onClick="del('{$value.id}', this)" class="ml-10">删除</a>
                    </td>
                </tr>
                {/foreach}
            </tbody>
        </table>
    </div>
</div>

<div class="modal" tabindex="-1" role="dialog" data-backdrop="false" id="myModal" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
      <div class="modal-content">
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
          <h4 class="modal-title">销售部门</h4>
        </div>
        <div class="modal-body">
            <form role="form" id="form-department">
                <input type="hidden" name="id" id="id" value="0">
                <div class="row">
                    <div class="col-md-4">
                        <div class="form-group">
                            <label for="name">名称</label>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            <input type="text" class="form-control" name="name" id="name" placeholder="部门名称">
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-4">
                        <div class="form-group">
                            <label for="director">主管</label>
                        </div>
                    </div>
                    <div class="col-md-4">
                        <div class="form-group">
                            <input type="text" class="form-control" name="director" id="director" placeholder="主管">
                        </div>
                    </div>
                </div>
            </form>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-default"  onclick="closeModel()">Close</button>
          <button type="button" class="btn btn-success" onclick="doSave()">Save</button>
        </div>
      </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
  </div><!-- /.modal -->



<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript">
     function save(id) {
        // console.log(id);
        if (id) {
            $.get('/department/info', {
                'id': id,
            }, function(res) {
                if (res.code == 2) {
                    var data = res.data;
                    $("#id").val(data.id);
                    $("#name").val(data.name);
                    $("#director").val(data.director);
                }
            }, 'json');
        } else {
            $("#id").val(0);
            $("#name").val('');
        }
        $('#myModal').modal('show');
    }

    function closeModel() {
        $("#form-department")[0].reset();
        $('#myModal').modal('hide');
    }

    function doSave() {
        var data = $("#form-department").serializeArray();
        $.post('/department/save', data, function(res) {
            if (res.code == 2) {
                alert('保存成功');
                $("#form-department")[0].reset();
                $('#myModal').modal('hide');
                window.location.reload();
            } else {
                alert(res.msg);
            }
            return false;
        }, 'json');
        return false;
    }

    function del(id, obj) {
        $.post('/department/delete', {
            'id': id
        }, function (res) {
            if (res.code == 2) {
                $(obj).parents("tr").remove();
                alert('删除成功!');
            } else {
                alert('删除失败, 请稍后重试.');
                return false;
            }
        }, 'json');
    }
</script>
<!--请在上方写此页面业务相关的脚本-->