layui.use(['form', 'layer', 'table', 'laytpl', 'jquery'], function () {
    var form = layui.form,
        layer = parent.layer === undefined ? layui.layer : top.layer,
        $ = layui.$,
        laytpl = layui.laytpl,
        table = layui.table;

    // 缓存常用DOM元素
    var $searchBtn = $(".search_btn"),
        $roleName = $("#roleName"),
        $roleType = $("#roleType"),
        $enabled = $("#enabled"),
        $addBtn = $(".add_btn"),
        $delAllBtn = $(".delAll_btn"),
        $allotBtn = $(".allot_btn"),
        $resetBtn = $(".reset_btn");

    // 配置常量
    var TABLE_CONFIG = {
        elem: '#list',
        url: '/upms/sysrole/queryPage',
        method: 'POST',
        dataType: 'json',
        contentType: 'application/json;charset=utf-8',
        headers: { token: '' },
        cellMinWidth: 95,
        page: true,
        height: "full-125",
        limits: [10, 15, 20, 25],
        limit: 15,
        id: "listTable",
        request: {
            pageName: "pageNo",
            limitName: "pageRows"
        },
        response: {
            statusName: 'code',
            statusCode: 200,
            msgName: 'msg',
            countName: 'totalRows',
            dataName: 'data'
        },
        parseData: function (res) {
            return {
                "code": res.code,
                "msg": res.msg,
                "totalRows": res.data.totalRows,
                "data": res.data.dataList
            };
        }
    };

    // 表格列配置
    var TABLE_COLS = [[
        { type: "checkbox", fixed: "left", width: 50 },
        { field: 'roleName', title: '角色名称', minWidth: 100, align: "center" },
        { field: 'roleDesc', title: '角色详情', minWidth: 100, align: "center" },
        {
            field: 'roleType', title: '角色类型', align: 'center', templet: function (d) {
                var roleTypeMap = {
                    "0": "默认角色",
                    "1": "普通管理员",
                    "2": "系统管理员",
                    "3": "区域管理员",
                    "9": "超级管理员"
                };
                return roleTypeMap[d.roleType] || "异常角色";
            }
        },
        {
            field: 'createTime', title: '创建时间', minWidth: 100, align: "center",
            templet: function (d) { return formatDateTime(d.createTime); }
        },
        {
            field: 'updateTime', title: '更新时间', align: 'center', minWidth: 150,
            templet: function (d) { return formatDateTime(d.updateTime); }
        },
        { title: '操作', minWidth: 175, templet: '#listBar', fixed: "right", align: "center" }
    ]];

    // 初始化表格
    var tableIns = table.render(Object.assign({}, TABLE_CONFIG, {
        cols: TABLE_COLS
    }));
    // 刷新
    $('.refresh').click(() => location.reload());
    // 事件绑定
    function bindEvents() {
        // 搜索功能
        $searchBtn.on("click", handleSearch);

        // 重置功能
        if ($resetBtn.length > 0) {
            $resetBtn.on("click", handleReset);
        }

        // 添加角色
        $addBtn.click(function () {
            openDialog("添加角色", "/upms/role/edit.html");
        });

        // 批量删除
        $delAllBtn.click(handleBatchDelete);

        // 分配权限
        $allotBtn.click(handleAllotPermission);

        // 表格行操作
        table.on('tool(list)', handleTableRowAction);
    }

    // 搜索处理
    function handleSearch() {
        const keyword = $roleName.val().trim();
        const roleType = $roleType.val();
        const enabled = $enabled.val();

        table.reload("listTable", {
            page: { curr: 1 },
            where: { roleName: keyword,
                roleType: roleType,
                enabled: enabled
            }
        });
    }

    // 重置处理
    function handleReset() {
        // 1. 清空搜索框
        $roleName.val('');

        // 2. 重置表单元素（如果有其他表单元素）
        resetFormElements();

        // 3. 可选：显示重置成功提示
        //layui.layer.msg("搜索条件已重置", { icon: 1, time: 1000 });
    }

    // 重置表单元素
    function resetFormElements() {
        // 重置下拉框
        $("select").each(function() {
            var $select = $(this);
            var defaultValue = $select.data('default-value') || $select.find("option:first").val();
            $select.val(defaultValue);
        });

        // 重置单选/复选框
        $("input[type='radio'], input[type='checkbox']").each(function() {
            var $input = $(this);
            if ($input.prop('defaultChecked')) {
                $input.prop('checked', true);
            } else {
                $input.prop('checked', false);
            }
        });

        // 重置其他输入框
        $("input[type='text'], input[type='number'], textarea").not(".searchVal").each(function() {
            var $input = $(this);
            var defaultValue = $input.data('default-value') || '';
            $input.val(defaultValue);
        });

        // 重新渲染表单
        form.render();
    }

    // 批量删除处理
    function handleBatchDelete() {
        var checkStatus = table.checkStatus('listTable');
        const { data } = checkStatus;

        if (data.length === 0) {
            layer.msg('请选择需要删除的角色');
            return;
        }

        const idsArr = data.map(item => BigInt(item.id).toString());

        layer.confirm('确定删除选中的角色？', {
            icon: 3,
            title: '提示信息'
        }, function (index) {
            $.ajax({
                url: '/upms/sysrole/deleteByIds',
                type: 'POST',
                dataType: 'json',
                contentType: 'application/json;charset=UTF-8',
                data: JSON.stringify({ idsArr }),
                success: function (res) {
                    if (res.code === 200) {
                        layer.msg('删除成功');
                        tableIns.reload();
                    } else {
                        layer.msg(res.msg || '删除失败');
                    }
                    layer.close(index);
                },
                error: function () {
                    layer.msg('请求失败，请稍后重试');
                    layer.close(index);
                }
            });
        });
    }

    // 分配权限处理
    function handleAllotPermission() {
        var checkStatus = table.checkStatus('listTable');
        var data = checkStatus.data;

        if (data.length === 0) {
            layer.msg("请选择需要分配权限的角色");
            return;
        }

        var ids = data.map(function (item) {
            return item.id;
        });

        openDialog('分配权限', "/upms/sysrole/allot?ids=" + ids.join(','));
    }

    // 表格行操作处理
    function handleTableRowAction(obj) {
        var layEvent = obj.event,
            data = obj.data;

        switch (layEvent) {
            case 'edit':
                openDialog("编辑角色", "/upms/sysrole/update", data);
                break;
            case 'del':
                deleteRole(data.id);
                break;
            case 'usable':
                toggleUserStatus($(this), data.id);
                break;
        }
    }

    /**
     * 单个删除用户
     * @param {Object} id - 角色id
     */
    function deleteRole(id) {
        layer.confirm('确定删除此用户？', {
            icon: 3,
            title: '提示信息'
        }, function (index) {
            $.ajax({
                url: '/upms/sysrole/delete/'+id,
                type: 'GET',
                data: { id: id },
                success: function (res) {
                    if (res.code === 200) {
                        layer.msg('删除成功');
                        tableIns.reload();
                    } else {
                        layer.msg(res.msg || '删除失败');
                    }
                    layer.close(index);
                },
                error: function () {
                    layer.msg('请求失败，请稍后重试');
                    layer.close(index);
                }
            });
        });
    }

    // 通用弹窗函数
    function openDialog(title, url, data) {
        var index = layui.layer.open({
            title: title,
            type: 2,
            content: url,
            area: ['100%', '100%'],
            maxmin: true,
            success: function (layero, index) {
                // 如果有数据，传递给子窗口
                if (data) {
                    var body = layui.layer.getChildFrame('body', index);
                    // 这里可以根据实际需要传递数据给子页面
                    // body.find(...).val(...);
                }

                // 添加关闭提示
                setTimeout(function () {
                    layer.tips('点击此处返回角色列表', '.layui-layer-setwin .layui-layer-close', {
                        tips: 3
                    });
                }, 500);
            },
            end: function () {
                // 对话框关闭后刷新表格
                tableIns.reload();
            }
        });
    }

    // 删除角色（支持批量）
    function deleteRoles(ids, layerIndex) {
        $.ajax({
            url: "/upms/sysrole/deleteByIds",
            type: "POST",
            dataType: "json",
            contentType: 'application/json;charset=UTF-8',
            data: JSON.stringify({ ids }),
        })
            .done(function (res) {
                if (res.code === 200) {
                    layer.msg(res.msg || "删除成功", { icon: 1 });
                    tableIns.reload();
                } else {
                    layer.msg(res.msg || "删除失败", { icon: 2 });
                }
            })
            .fail(function (xhr, status, error) {
                layer.msg("请求失败: " + error, { icon: 2 });
            })
            .always(function () {
                if (layerIndex) layer.close(layerIndex);
            });
    }

    // 确认删除单个
    function confirmDelete(id) {
        layer.confirm('确定删除此角色？', {
            icon: 3,
            title: '提示信息'
        }, function (index) {
            deleteRoles(id, index);
        });
    }

    // 切换用户状态
    function toggleUserStatus($element, userId) {
        var currentText = $element.text();
        var confirmText = currentText === "已禁用" ?
            "是否确定启用此用户？" : "是否确定禁用此用户？";

        layer.confirm(confirmText, {
            icon: 3,
            title: '系统提示'
        }, function (index) {
            // 这里应该发送AJAX请求更新状态
            // $.post('/upms/user/toggleStatus', {id: userId}, function(res) {...});

            $element.text(currentText === "已禁用" ? "已启用" : "已禁用");
            layer.close(index);
        });
    }

    // 格式化时间
    function formatDateTime(timestamp) {
        if (!timestamp) return '';

        var date = new Date(timestamp);

        // 检查日期是否有效
        if (isNaN(date.getTime())) return '';

        var pad = function (num) {
            return num < 10 ? '0' + num : num;
        };

        return date.getFullYear() + '-' +
            pad(date.getMonth() + 1) + '-' +
            pad(date.getDate()) + ' ' +
            pad(date.getHours()) + ':' +
            pad(date.getMinutes()) + ':' +
            pad(date.getSeconds());
    }

    // 防抖函数（用于搜索优化）
    function debounce(func, wait) {
        var timeout;
        return function () {
            var context = this,
                args = arguments;
            clearTimeout(timeout);
            timeout = setTimeout(function () {
                func.apply(context, args);
            }, wait);
        };
    }

    // 初始化
    $(function () {
        bindEvents();

        // 添加搜索框回车事件
        $roleName.on('keypress', function (e) {
            if (e.which === 13) {
                handleSearch();
            }
        });

        // 可选：添加搜索防抖（500ms）
        // $searchVal.on('input', debounce(handleSearch, 500));
    });
});