<div class="layui-card">
    <div class="layui-card-header">
        <h2 class="header-title">医生模板</h2>
        <span class="layui-breadcrumb pull-right">
            <a href="#!home_console">首页</a>
            <a><cite>医生模板</cite></a>
        </span>
    </div>
    <div class="layui-card-body">
        <div class="layui-form toolbar">
            <select id="templeteType" placeholder="话术类型">
                <option value="">-请选择-</option>
                <option value="0">结论</option>
                <option value="1">建议</option>
                <option value="2">方案</option>
            </select>
            <select id="publicType" placeholder="开放类型">
                <option value="">-请选择-</option>
                <option value="0">公开-</option>
                <option value="1">私有</option>
            </select>
            <input name="templeteTitle" id="templeteTitle" placeholder="按标题" type="text"
                class="layui-input search-input" maxlength="20" />
            <button id="app-btn-search" class="layui-btn icon-btn"><i class="layui-icon">&#xe615;</i>搜索</button>
            <button id="docto-templete-btn-add" class="layui-btn icon-btn permissions" permissions="doctortemplete-edit"><i class="layui-icon">&#xe654;</i>添加</button>
        </div>

        <!-- 数据表格 -->
        <table class="layui-table permissions" permissions="doctortemplete-list" id="app-table" lay-filter="app-table"></table>
    </div>
</div>

<!-- 表格操作列 -->
<script type="text/html" id="doctor-templete-table-bar">
    <a class="layui-btn layui-btn-primary layui-btn-xs permissions" permissions="doctortemplete-edit"  lay-event="edit">修改</a>
    <a class="layui-btn layui-btn-xs permissions" permissions="doctortemplete-del"  lay-event="del">删除</a>
</script>
<!-- 表格状态列 -->
<script type="text/html" id="doctor-templete-tpl-state">
    <input type="checkbox" lay-filter="doctor-templete-tpl-state" value="{{d.id}}" lay-skin="switch" lay-text="正常|锁定"
           {{d.enabled==true?'checked':''}} class="permissions" permissions="doctortemplete-enable"/>
</script>

<!-- 表单弹窗 -->
<script type="text/html" id="app-model">
    <form id="app-form" lay-filter="app-form" class="layui-form model-form">
        <input name="id" type="hidden"/>
        <div class="layui-form-item">
            <label class="layui-form-label">标题</label>
            <div class="layui-input-block">
                <input name="templeteTitle" type="text" class="layui-input" maxlength="20"
                       lay-verify="required" required/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">话术类型</label>
            <div class="layui-input-block">
                <select name="templeteType" placeholder="话术类型" lay-verify="required" required>
                    <option value="">-请选择-</option>
                    <option value="0">结论</option>
                    <option value="1">建议</option>
                    <option value="2">方案</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">开放类型</label>
            <div class="layui-input-block">
                <select id="publicType-add" name="publicType" placeholder="开放类型" lay-verify="required" required>
                    <option value="">-请选择-</option>
                    <option value="1">公开</option>
                    <option value="0">私有</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">说明：</label>
            <div class="layui-input-block">
                <textarea name="templeteNote" placeholder="请输入内容" class="layui-textarea"></textarea>
              </div>
        </div>
        <div class="layui-form-item model-form-footer">
            <button class="layui-btn layui-btn-primary"  ew-event="closeDialog" type="button">取消</button>
            <button class="layui-btn" id="sure" lay-filter="user-form-submit" permissions="	
            doctortemplete-edit" lay-submit>保存</button>
        </div>
    </form>
</script>


<script>
    layui.use(['form', 'table', 'laydate', 'util', 'config', 'admin'], function () {
        var form = layui.form;
        var table = layui.table;
        var config = layui.config;
        var layer = layui.layer;
        var util = layui.util;
        var admin = layui.admin;

        // 添加按钮点击事件
        $('#docto-templete-btn-add').click(function () {
            showEditModel(undefined, 1);
        });
        //// 刷新
        $('#docto-templete-btn-update').click(function () {
            table.reload('app-table', { where: {} });
        });

        // 渲染表格
        table.render({
            elem: '#app-table',
            url: config.base_server + 'api-opration/doctortemplete',
            method: 'GET',
            headers: { 'Authorization': 'Bearer ' + config.getToken().access_token },
            page: true,
            cols: [[
                { type: 'numbers' },
                { field: 'templeteTitle', width: 180, sort: true, title: '标题' },
                {
                    field: 'publicType', width: 200, sort: true, title: '开放类型', templet: function (d) {
                        return d.publicType ==true ? "私有" : "公开"
                    }
                },
                {
                    field: 'templeteType', width: 180, sort: true, title: '话术类型', templet: function (d) {
                        if (d.templeteType == 0) {
                            return "结论";
                        } else if (d.templeteType == 1) {
                            return "建议";
                        } else if (d.templeteType == 2) {
                            return "方案";
                        }
                    }
                },
                { field: 'createUserName', width: 300, sort: true, title: '创建者' },
                { field: 'createTime', width: 250, sort: true, title: '创建时间', templet: "<div>{{layui.util.toDateString(d.createTime, 'yyyy/MM/dd HH:mm')}}</div>" },
                { field: 'enabled', width: 100, sort: true, templet: '#doctor-templete-tpl-state', title: '状态' },
                { field: 'recordTitle', width: 300, toolbar: '#doctor-templete-table-bar', sort: true, title: '操作' },
            ]],
            done:function(res){
                permissionsInput(res,config);
            }
        });

        // 工具条点击事件
        table.on('tool(app-table)', function (obj) {
            var data = obj.data;
            var layEvent = obj.event;
            if (layEvent === 'edit') { // 查看详情
                showEditModel(data, 2);
            }else if(layEvent === 'del'){
                layer.confirm('确定删除此用户吗？', function (i) {
                    layer.close(i);
                    layer.load(2);
                    admin.req('api-opration/doctortemplete/' + obj.data.id, {}, function (data) {
                        layer.closeAll('loading');
                        if (data.code == 0) {
                            layer.msg(data.msg, { icon: 1, time: 2000 });
                            table.reload('app-table', {});
                        } else {
                            layer.msg(data.msg, { icon: 2, time: 2000 });
                        }
                    }, 'delete');
                });
            }
        });

        // 搜索按钮点击事件
        $('#app-btn-search').click(function () {
            var templeteType = $('#templeteType').val();
            var publicType = $('#publicType').val();
            var templeteTitle = $('#templeteTitle').val();
            table.reload('app-table', { where: { templeteType: templeteType, publicType: publicType, templeteTitle: templeteTitle } });
        });

        // 修改user状态
        form.on('switch(doctor-templete-tpl-state)', function (obj) {
            layer.load(2);
            admin.req('api-opration/doctortemplete/updateEnabled', {
                id: obj.elem.value,
                enabled: obj.elem.checked ? true : false
            }, function (data) {
                layer.closeAll('loading');
                if (data.code == 0) {
                    layer.msg(data.msg, { icon: 1, time: 2000 });
                    table.reload('app-table', {});
                } else {
                    layer.msg(data.msg, { icon: 2, time: 2000 });
                    $(obj.elem).prop('checked', !obj.elem.checked);
                    form.render('checkbox');
                }
            }, 'GET');
        });

        // 表单提交事件
        form.on('submit(user-form-submit)', function (data) {
            layer.load(2);
            if(data.field.publicType==1){
                data.field.publicType=true;
            }else if (data.field.publicType==0){
                data.field.publicType=false;
            }
            admin.req('api-opration/doctortemplete', JSON.stringify(data.field), function (data) {
                layer.closeAll('loading');
                if (data.code == 0) {
                    // layer.msg(data.msg, { icon: 1, time: 2000 });
                    layer.closeAll();
                    table.reload('app-table', {});
                } else {
                    layer.msg(data.msg, { icon: 2, time: 2000 });
                }
            }, "POST");
            return false;
        });
        // // 显示编辑弹窗
        var showEditModel = function (data, index) {
            var title = "";
            if (index == 1) {
                title = "新增";
            } else if (index == 2) {
                title = "修改";
            }
            layer.open({
                type: 1,
                title: title,
                area: '450px',
                offset: '120px',
                content: $('#app-model').html(),
                success: function () {
                    $('#app-form')[0].reset();
                    $('#app-form').attr('method', 'POST');
                    if (data) {
                        if(index==1){
                            $('#sure').hide();
                        }
                        form.val('app-form', data);
                        $('#publicType-add').val(data.publicType == true ? 1 : 0);
                    }
                }
            });
        };
    });
</script>