package role

import (
	"context"

    "management/internal/erpserver/templ/base"
    "management/internal/pkg/mid"
	"management/internal/erpserver/templ/component"
	"management/internal/erpserver/model/view"
)

templ SetMenu(ctx context.Context, item *view.SetMenuView) {
    @base.Base(ctx, setMenuCss(), setMenuJs(ctx)) {
        {{ meuns := mid.GetCurMenus(ctx) }}

        if item.Role.ID == 0 {
            <h3>角色数据错误, 请刷新重试</h3>
            return
        }

        <div class="layui-body layui-bg-white">
            <form class="layui-form">
                <input type="hidden" name="ID" value={ item.Role.ID } />
                if len(item.Menus) > 0 {
                    <div class="layui-collapse" lay-accordion>
                        for _, menu := range item.Menus {
                        <div class="layui-colla-item">
                            <div class="layui-colla-title">{ menu.Name }({ menu.Link })</div>
                            <div class="layui-colla-content">
                                if len(menu.Items) > 0 {
                                    <div class="layui-collapse" lay-accordion>
                                    for _, menu1 := range menu.Items {
                                    <div class="layui-colla-item">
                                        <div class="layui-colla-title">{ menu1.Name }({ menu1.Link })</div>
                                        <div class="layui-colla-content">
                                            if len(menu1.Items) > 0 {
                                            <div class="layui-collapse" lay-accordion>
                                                for _, menu2 := range menu1.Items {
                                                <div class="layui-colla-item">
                                                    <div class="layui-colla-title">{ menu2.Name }({ menu2.Link })</div>
                                                    <div class="layui-colla-content">
                                                        if len(menu2.Items) > 0 {
                                                        <div class="layui-form">
                                                            for _, menu3 := range menu2.Items {
                                                            if menu3.IsSelect {
                                                                <input type="checkbox" name="menus" value={ menu3.ID } lay-text={ menu3.Name }
                                                                    checked>
                                                            } else {
                                                                <input type="checkbox" name="menus" value={ menu3.ID }
                                                                    lay-text={ menu3.Name }>
                                                            }
                                                        }
                                                        </div>
                                                        }
                                                    </div>
                                                </div>
                                                }
                                            </div>
                                            }
                                        </div>
                                    </div>
                                    }
                                </div>
                                }
                            </div>
                        </div>
                        }
                    </div>
                }
                <div class="layui-form-item" style="margin-top:10px;">
                    @component.SubmitBtn(meuns, "set_menu")
                </div>
            </form>
        </div>
    }
}

templ setMenuCss() {
    <style>
        .layui-body {
            padding: 15px;
            left: 0;
        }

        .layui-bg-white {
            background-color: #ffffff;
        }

        .layui-colla-content {
            padding: 10px 15px;
        }

        .layui-collapse {
            margin-bottom: 0;
        }
    </style>
}

templ setMenuJs(ctx context.Context) {
    {{ token := mid.GetCsrfToken(ctx) }}
    <script>
        layui.use(['form', 'jquery', 'iconPicker'], function () {
            let form = layui.form;
            let $ = layui.jquery;
            let iconPicker = layui.iconPicker;

            // 表单提交
            form.on('submit(set_menu)', function (data) {

                // 获取checkbox数据,拼接成字符串!!!!!!
                var menus = "";
                var r = document.getElementsByName("menus");
                for (var i = 0; i < r.length; i++) {
                    if (r[i].checked) {
                        menus += "," + r[i].value;
                    }
                }
                if (menus.length > 0) {
                    menus = menus.substring(1);
                }
                data.field.roleMenu = menus;

                $.ajax({
                    url: '/system/role/set_menu',
                    type: 'post',
                    headers: { 'X-CSRF-Token': '{{ token }}' },
                    dataType: 'json',
                    data: data.field,
                    success: function (result) {
                        if (result.success) {
                            layer.msg(result.msg, { icon: 1, time: 1000 }, function () {
                                parent.layer.close(parent.layer.getFrameIndex(window.name)); // 关闭当前页
                                parent.layui.table.reload("tablelist", {
                                    page: { curr: 1 },
                                });
                            });
                        } else {
                            parent.layer.msg(result.msg, { icon: 2 })
                        }
                    }
                });

                return false;
            });
        });
    </script>
}