<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>添加人员</title>
    <link rel="stylesheet" th:href="@{/lib/layui/css/layui.css}" media="all">
    <link rel="stylesheet" th:href="@{/css/public.css}" media="all">
    <link rel="stylesheet" th:href="@{/lib/font-awesome-4.7.0/css/font-awesome.min.css}" media="all">
    <style>
        body {
            background-color: #ffffff;
        }
    </style>
</head>
<body>
<form class="layui-form" action="" lay-filter="formDemo">
    <div class="layui-form layuimini-form">
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label required" style="width: 80px">公司/单位</label>
            <div class="layui-input-inline" style="width: 450px">
                <input type="hidden" name="dw" id="dw" th:value="${basePerson.dw}">
                <input type="text" id="dwmc" name="dwmc" class="layui-input" th:value="${basePerson.dwmc}" readonly>
            </div>
            <label class="layui-form-label" style="width: 80px">部门</label>
            <div class="layui-input-inline" style="width: 260px">
                <input type="hidden" id="bm" name="bm" th:value="${basePerson.bm}" class="layui-input">
                <input type="text" id="bmmc" name="bmmc" class="layui-input" readonly>
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label required" style="width: 80px">姓名</label>
            <div class="layui-input-inline" style="width: 250px">
                <input type="hidden" name="id" th:value="${basePerson.id}" class="layui-input">
                <input type="text" id="xm" name="xm" class="layui-input" autocomplete="off" th:value="${basePerson.xm}">
            </div>
            <label class="layui-form-label" style="width: 30px">性别</label>
            <div class="layui-input-inline" style="width: 130px">
                <input type="hidden" id="xbmc" name="xbmc" th:value="${basePerson.xb}" class="layui-input">
                <select name="xb" id="xb">
                    <option value="男">男</option>
                    <option value="女">女</option>
                </select>
            </div>
            <label class="layui-form-label" style="width: 80px">民族</label>
            <div class="layui-input-inline" style="width: 260px">
                <input type="hidden" id="mzmc" name="mzmc" th:value="${basePerson.mz}" class="layui-input">
                <select name="mz" id="mz" lay-search="">
                    <option value="">直接选择或搜索选择</option>
                    <option th:each="item:${mzList}" th:text="${item.name}" th:value="${item.code}"></option>
                </select>
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 80px">出生地址</label>
            <div class="layui-input-inline" style="width: 450px">
                <input type="text" id="csdz" name="csdz" th:value="${basePerson.csdz}" class="layui-input">
            </div>
            <label class="layui-form-label required" style="width: 80px">出生日期</label>
            <div class="layui-input-inline" style="width: 260px">
                <input type="text" name="csrq" id="csrq" lay-verify="required|date" lay-reqtext="出生日期不能为空"
                       autocomplete="off" th:value="${basePerson.csrq}" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 80px">党派</label>
            <div class="layui-input-inline" style="width: 450px">
                <input type="hidden" id="dpmc" name="dpmc" th:value="${basePerson.dpmc}" class="layui-input">
                <select name="dp" id="dp">
                    <option value="">请选择</option>
                    <option th:each="item:${dpList}" th:text="${item.name}" th:value="${item.code}"></option>
                </select>
            </div>

            <label class="layui-form-label" style="width: 80px">何国华侨</label>
            <div class="layui-input-inline" style="width: 260px">
                <input type="hidden" id="hghqmc" name="hghqmc" class="layui-input" th:value="${basePerson.hghqmc}">
                <select name="hghq" id="hghq" lay-search="">
                    <option value="">直接选择或搜索选择</option>
                    <option th:each="item:${gjList}" th:text="${item.name}" th:value="${item.code}"></option>
                </select>
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 80px">家庭住址</label>
            <div class="layui-input-inline" style="width: 450px">
                <input type="text" id="jtzz1" name="jtzz1" th:value="${basePerson.jtzz1}" class="layui-input">
            </div>
            <label class="layui-form-label" style="width: 80px">固定电话</label>
            <div class="layui-input-inline" style="width: 260px">
                <input type="text" id="gddh" name="gddh" maxlength="12" autocomplete="off" th:value="${basePerson.gddh}"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 80px">通讯地址</label>
            <div class="layui-input-inline" style="width: 450px">
                <input type="text" id="txdz1" name="txdz1" th:value="${basePerson.txdz1}" class="layui-input">
            </div>
            <label class="layui-form-label" style="width: 80px">移动电话</label>
            <div class="layui-input-inline" style="width: 260px">
                <input type="text" id="yddh" name="yddh" maxlength="11" autocomplete="off" th:value="${basePerson.yddh}"
                       class="layui-input">
            </div>
        </div>

        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 80px">电子邮件</label>
            <div class="layui-input-inline" style="width: 450px">
                <input type="text" id="dzyj" name="dzyj" autocomplete="off" th:value="${basePerson.dzyj}"
                       class="layui-input">
            </div>
            <label class="layui-form-label" style="width: 80px">住宅电话</label>
            <div class="layui-input-inline" style="width: 260px">
                <input type="text" id="zzdh" name="zzdh" maxlength="12" autocomplete="off" th:value="${basePerson.zzdh}"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 80px">传真</label>
            <div class="layui-input-inline" style="width: 450px">
                <input type="text" id="cz" name="cz" maxlength="12" th:value="${basePerson.cz}" class="layui-input">
            </div>
            <label class="layui-form-label" style="width: 80px">邮政编码</label>
            <div class="layui-input-inline" style="width: 260px">
                <input type="text" id="yzbm" name="yzbm" maxlength="6" th:value="${basePerson.yzbm}"
                       class="layui-input">
            </div>
        </div>

        <ul class="layui-tab-title" style="padding-left: 15px; padding-top: 10px">
            <li class="layui-this">主要研究领域</li>
        </ul>
        <div class="layui-form-item layui-inline" style="width: 100%; padding-top: 15px">
            <label class="layui-form-label" style="width: 140px; margin-left: -10px">国家科技部学科领域</label>
            <div class="layui-input-inline" style="width: 300px">
                <input type="hidden" id="gjkjbxkly" name="gjkjbxkly" th:value="${basePerson.gjkjbxkly}"
                       class="layui-input">
                <input type="text" id="gjkjbxklymc" name="gjkjbxklymc" class="layui-input" readonly>
            </div>
            <label class="layui-form-label" style="width: 140px">国家基金委学科领域</label>
            <div class="layui-input-inline" style="width: 300px">
                <input type="hidden" id="gjjjwxkly" name="gjjjwxkly" th:value="${basePerson.gjjjwxkly}"
                       class="layui-input">
                <input type="text" id="gjjjwxklymc" name="gjjjwxklymc" class="layui-input" readonly>
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 80px">毕业学校</label>
            <div class="layui-input-inline" style="width: 250px">
                <input type="hidden" id="byxx" name="byxx" th:value="${basePerson.byxx}" class="layui-input">
                <input type="text" id="byxxmc" name="byxxmc" class="layui-input" readonly>
            </div>
            <label class="layui-form-label" style="width: 70px">学历</label>
            <div class="layui-input-inline" style="width: 180px">
                <input type="hidden" id="xlmc" name="xlmc" th:value="${basePerson.xlmc}" class="layui-input">
                <select name="xl" id="xl" lay-reqtext="学历不能为空">
                    <option value="">请选择</option>
                    <option th:each="item:${xlList}" th:text="${item.name}" th:value="${item.code}"></option>
                </select>
            </div>
            <label class="layui-form-label" style="width: 70px">学位</label>
            <div class="layui-input-inline" style="width: 180px">
                <input type="hidden" id="xwmc" name="xwmc" th:value="${basePerson.xwmc}" class="layui-input">
                <select name="xw" id="xw" lay-filter="status">
                    <option value="">请选择</option>
                    <option th:each="item:${xwList}" th:text="${item.name}" th:value="${item.code}"></option>
                </select>
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 80px">授予国别</label>
            <div class="layui-input-inline" style="width: 250px">
                <input type="hidden" id="sygbmc" name="sygbmc" class="layui-input" th:value="${basePerson.sygbmc}">
                <select name="sygb" id="sygb" lay-search="">
                    <option value="">直接选择或搜索选择</option>
                    <option th:each="item:${gjList}" th:text="${item.name}" th:value="${item.code}"></option>
                </select>
            </div>
            <label class="layui-form-label" style="width: 70px">授予年份</label>
            <div class="layui-input-inline" style="width: 180px">
                <input type="number" id="synf" name="synf" maxlength="4" min="1900" th:value="${basePerson.synf}"
                       class="layui-input">
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 80px">职称</label>
            <div class="layui-input-inline" style="width: 250px">
                <input type="hidden" id="zc" name="zc" class="layui-input" th:value="${basePerson.zc}">
                <input type="text" id="zcmc" name="zcmc" class="layui-input">
            </div>
            <label class="layui-form-label" style="width: 70px">专业/专长</label>
            <div class="layui-input-inline" style="width: 180px">
                <input type="text" id="zyzc" name="zyzc" autocomplete="off" th:value="${basePerson.zyzc}"
                       style="position: absolute; z-index: 2; margin:5px 0px 0px 5px; width: 85%; height: 80%; border: none"
                       class="layui-input">
                <select name="zyzcmc" id="zyzcmc" lay-search="" lay-filter="zyzc">
                    <option value="">选择或输入专业专长</option>
                    <option th:each="item:${zyzcList}" th:text="${item.name}" th:value="${item.name}"></option>
                </select>
            </div>
            <label class="layui-form-label required" style="width: 70px">毕业时间</label>
            <div class="layui-input-inline" style="width: 180px">
                <input type="text" id="bysj" name="bysj" lay-verify="required|date" lay-reqtext="毕业时间不能为空"
                       th:value="${basePerson.bysj}" class="layui-input" readonly>
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 80px">外语语种</label>
            <div class="layui-input-inline" style="width: 250px">
                <input type="hidden" id="wyyzmc" name="wyyzmc" th:value="${basePerson.wyyzmc}" class="layui-input">
                <select name="wyyz" id="wyyz" lay-filter="status">
                    <option value="">请选择</option>
                    <option th:each="item:${wyyzList}" th:text="${item.name}" th:value="${item.code}"></option>
                </select>
            </div>
            <label class="layui-form-label" style="width: 70px">熟练程度</label>
            <div class="layui-input-inline" style="width: 180px">
                <input type="hidden" id="slcdmc" name="slcdmc" th:value="${basePerson.slcd}" class="layui-input">
                <select name="slcd" id="slcd" lay-filter="status">
                    <option value="">请选择</option>
                    <option th:each="item:${slcdList}" th:text="${item.name}" th:value="${item.name}"></option>
                </select>
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 80px">院士</label>
            <div class="layui-input-inline" style="width: 250px">
                <input type="hidden" id="ysmc" name="ysmc" th:value="${basePerson.ys}" class="layui-input">
                <select name="ys" id="ys">
                    <option value="">请选择</option>
                    <option th:each="item:${ysList}" th:text="${item.name}" th:value="${item.name}"></option>
                </select>
            </div>
            <label class="layui-form-label" style="width: 70px">博士后</label>
            <div class="layui-input-inline" style="width: 180px">
                <input type="hidden" id="sfbsh" name="sfbsh" th:value="${basePerson.bsh}" class="layui-input">
                <select name="bsh" id="bsh">
                    <option value="">请选择</option>
                    <option value="是">是</option>
                    <option value="否">否</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item layui-inline" style="width: 100%">
            <label class="layui-form-label" style="width: 90px; margin-left: -10px">曾获奖奖励及<br>荣誉称号情况</label>
            <div class="layui-input-inline" style="width: 830px">
                <textarea id="chjljrychqk" name="chjljrychqk" th:text="${basePerson.chjljrychqk}" class="layui-textarea"
                          style="width: 100%;height: 100px"></textarea>
            </div>
        </div>
        <!-- 右侧悬浮按钮 -->
        <div class="right-bottom-btn">
            <button class="layui-btn" lay-submit lay-filter="saveBtn">
                <i class="layui-icon layui-icon-ok"></i>保存
            </button>
            <button class="layui-btn" lay-filter="cancleBtn">
                <i class="layui-icon layui-icon-close"></i>取消
            </button>
        </div>
    </div>
</form>

<script th:src="@{/lib/jquery-3.4.1/jquery-3.4.1.min.js}" charset="utf-8"></script>
<script th:src="@{/lib/layui/layui.js}" charset="utf-8"></script>
<script th:src="@{/lib/coco-message/coco-message.js}" charset="utf-8"></script>
<script th:src="@{/js/lay-config.js}" charset="utf-8"></script>
<script type="text/javascript" th:inline="javascript">
    AjaxUtil.ctx = /*[[@{/}]]*/'';
    layui.use(['form', 'layer', 'table', 'tableSelect', 'layCascader'], function () {
        var form = layui.form,
            tableSelect = layui.tableSelect,
            layer = layui.layer,
            layCascader = layui.layCascader,
            laydate = layui.laydate;
        var initFlag = 0;

        //日期
        laydate.render({
            elem: '#csrq'
        });
        laydate.render({
            elem: '#bysj'
        });

        //公司/单位
        tableSelect.render({
            elem: '#dwmc',
            checkedKey: 'id',
            searchKey: 'mc',
            searchPlaceholder: '搜索公司/单位',
            table: {
                url: AjaxUtil.ctx + 'baseCompany/dwlist',
                cols: [
                    [
                        {type: 'radio',title: '😊'},
                        {
                            field: '', title: '序号', type: 'numbers', align: 'center',title:'序号', templet: function (d) {
                                return d.LAY_TABLE_INDEX + 1;
                            }
                        },
                        {field: 'mc', width: '40%', title: '名称'},
                        {field: 'dwqc', width: '40%', title: '单位全称'}
                    ]
                ]
            },
            done: function (elem, data) {
                if (initFlag == 0) {
                    elem.val($("#dwmc").val());
                    initFlag = 1;
                } else {
                    var NEWJSON = [];
                    var NEWJSON1 = [];
                    layui.each(data.data, function (index, item) {
                        NEWJSON.push(item.mc);
                        NEWJSON1.push(item.id);
                    })
                    elem.val(NEWJSON.join(","));
                    $("#dw").val(NEWJSON1.join(","));
                }
            }
        });

        //下拉框回显
        function set_select(id, value) {
            let obj = $("#" + id)
            obj.find("option:contains('" + value + "')").attr("selected", true)
            obj.parent().find(".layui-select-title").find("input").val(value)
        }

        if ($("#xbmc").val() != null && $("xbmc").val() != "")
            set_select('xb', $("#xbmc").val());
        if ($("#mzmc").val() != null && $("#mzmc").val() != "")
            set_select('mz', $("#mzmc").val());
        if ($("#xlmc").val() != null && $("#xlmc").val() != "")
            set_select('xl', $("#xlmc").val());
        if ($("#dpmc").val() != null && $("#dpmc").val() != "")
            set_select('dp', $("#dpmc").val());
        if ($("#xwmc").val() != null && $("#xwmc").val() != "")
            set_select('xw', $("#xwmc").val());
        if ($("#wyyzmc").val() != null && $("#wyyzmc").val() != "")
            set_select('wyyz', $("#wyyzmc").val());
        if ($("#slcdmc").val() != null && $("#slcdmc").val() != "")
            set_select('slcd', $("#slcdmc").val());
        if ($("#ysmc").val() != null)
            set_select('ys', $("#ysmc").val());
        if ($("#sfbsh").val() != null && $("#sfbsh").val() != "")
            set_select('bsh', $("#sfbsh").val());
        if ($("#hghqmc").val() != null && $("#hghqmc").val() != "")
            set_select('hghq', $("#hghqmc").val());
        if ($("#sygbmc").val() != null && $("#sygbmc").val() != "")
            set_select('sygb', $("#sygbmc").val());

        //部门
        var index = layer.load(0, {shade: 0.1});
        AjaxUtil.get({
            url: AjaxUtil.ctx + 'deptinfo/list',
            success: function (res) {
                layer.close(index);
                var datalist = [];
                for (let item of res.data) {
                    item.value = item.deptId;
                    item.label = item.deptName;
                    datalist.push(item);
                }
                // 扁平数据转树
                var options = arrayToTree1(datalist, "0");

                // 初始化cascader实例
                cascader = layCascader({
                    elem: '#bmmc',
                    value: $("#bm").val(), // 回显
                    clearable: true,
                    showAllLevels: false, // 配置仅显示最后一级
                    props: {
                        checkStrictly: true // 配置选择任意一级选项
                    },
                    options: options
                });

                // 监听cascader变化
                cascader.changeEvent(function (value, node) {
                    $("#bm").val(value);
                    $("#bmmc").val(node.data.label);
                    // 主动关闭面板
                    cascader.close();
                });
            },
            error: function (error) {
                layer.close(index);
                Message.error('获取部门信息失败！', 1000);
            }
        });
        //国家科技部学科领域
        var index1 = layer.load(0, {shade: 0.1});
        AjaxUtil.get({
            url: AjaxUtil.ctx + 'baseMost/list',
            success: function (res) {
                layer.close(index1);
                var datalist = [];
                for (let item of res.data) {
                    item.value = item.id;
                    item.label = item.name;
                    datalist.push(item);
                }
                // 扁平数据转树
                var options = arrayToTree(datalist, "0");

                // 初始化cascader实例
                cascader = layCascader({
                    elem: '#gjkjbxklymc',
                    value: $("#gjkjbxkly").val(), // 回显
                    clearable: true,
                    showAllLevels: false, // 配置仅显示最后一级
                    props: {
                        checkStrictly: true // 配置选择任意一级选项
                    },
                    options: options
                });

                // 监听cascader变化
                cascader.changeEvent(function (value, node) {
                    $("#gjkjbxkly").val(value);
                    $("#gjkjbxklymc").val(node.data.label);
                    // 主动关闭面板
                    cascader.close();
                });
            },
            error: function (error) {
                layer.close(index1);
                Message.error('获取国家科技部学科领域信息失败！', 1000);
            }
        });
        //国家基金委学科领域
        var index2 = layer.load(0, {shade: 0.1});
        AjaxUtil.get({
            url: AjaxUtil.ctx + 'baseFoundation/list',
            success: function (res) {
                layer.close(index2);
                var datalist = [];
                for (let item of res.data) {
                    item.value = item.id;
                    item.label = item.name;
                    datalist.push(item);
                }
                // 扁平数据转树
                var options = arrayToTree(datalist, "0");

                // 初始化cascader实例
                cascader = layCascader({
                    elem: '#gjjjwxklymc',
                    value: $("#gjjjwxkly").val(), // 回显
                    clearable: true,
                    showAllLevels: false, // 配置仅显示最后一级
                    props: {
                        checkStrictly: true // 配置选择任意一级选项
                    },
                    options: options
                });

                // 监听cascader变化
                cascader.changeEvent(function (value, node) {
                    $("#gjjjwxkly").val(value);
                    $("#gjjjwxklymc").val(node.data.label);
                    // 主动关闭面板
                    cascader.close();
                });
            },
            error: function (error) {
                layer.close(index2);
                Message.error('获取国家基金委学科领域信息失败！', 1000);
            }
        });
        //毕业学校
        var index3 = layer.load(0, {shade: 0.1});
        AjaxUtil.get({
            url: AjaxUtil.ctx + 'baseSchool/list',
            success: function (res) {
                layer.close(index3);
                var datalist = [];
                for (let item of res.data) {
                    item.value = item.id;
                    item.label = item.name;
                    datalist.push(item);
                }
                // 扁平数据转树
                var options = arrayToTree(datalist, "0");
                console.log($("#byxx").val());

                // 初始化cascader实例
                cascader = layCascader({
                    elem: '#byxxmc',
                    value: parseInt($("#byxx").val()), // 回显
                    clearable: true,
                    showAllLevels: true, // 配置仅显示最后一级
                    props: {
                        checkStrictly: false // 配置选择任意一级选项
                    },
                    options: options
                });

                // 监听cascader变化
                cascader.changeEvent(function (value, node) {
                    $("#byxx").val(value);
                    $("#byxxmc").val(node.data.label);
                    // 主动关闭面板
                    cascader.close();
                });
            },
            error: function (error) {
                layer.close(index3);
                Message.error('获取学校信息失败！', 1000);
            }
        });
        //职称
        var index4 = layer.load(0, {shade: 0.1});
        AjaxUtil.get({
            url: AjaxUtil.ctx + 'baseTitle/list',
            success: function (res) {
                layer.close(index4);
                var datalist = [];
                for (let item of res.data) {
                    item.value = item.id;
                    item.label = item.name;
                    datalist.push(item);
                }
                // 扁平数据转树
                var options = arrayToTree(datalist, "0");

                // 初始化cascader实例
                cascader = layCascader({
                    elem: '#zcmc',
                    value: $("#zc").val(), // 回显
                    clearable: true,
                    props: {
                        checkStrictly: false // 配置选择任意一级选项
                    },
                    options: options
                });

                // 监听cascader变化
                cascader.changeEvent(function (value, node) {
                    $("#zc").val(value);
                    $("#zcmc").val(node.data.label);
                    // 主动关闭面板
                    cascader.close();
                });
            },
            error: function (error) {
                layer.close(index4);
                Message.error('获取职称信息失败！', 1000);
            }
        });

        //监听专业专长
        form.on('select(zyzc)', function (data) {
            let text = data.elem.selectedOptions[0].text;
            $("#zyzc").val(text);
        });
        //监听提交
        form.on('submit(saveBtn)', function (data) {
            var loading = layer.load(0, {shade: 0.1}); //0代表加载的风格，支持0-2
            AjaxUtil.post({
                url: AjaxUtil.ctx + "basePerson/doUpdate",
                data: data.field,
                success: function (res) {
                    if (res.code === 0) {
                        layer.close(loading);
                        Message.success(1500, res.message, function () {
                            parent.setUpdateFlag();
                            // 重载表格
                            var iframeIndex = parent.layer.getFrameIndex(window.name);
                            parent.layer.close(iframeIndex);
                        });
                    } else {
                        layer.close(loading);
                        Message.error(res.message, 2000);
                    }
                },
                error: function (error) {
                }
            });
            return false;
        });

        // 监听取消按钮
        $("button[lay-filter='cancleBtn']").click(function () {
            var iframeIndex = parent.layer.getFrameIndex(window.name);
            parent.layer.close(iframeIndex);
        });
    });

    /**
     *  扁平数据转树结构
     * @returns {[]}
     * @param data
     * @param firstPid
     */
    function arrayToTree(data, firstPid) {
        const result = [];
        getChildren(data, result, firstPid);
        return result;
    }

    function arrayToTree1(data, firstPid) {
        const result = [];
        getChildren1(data, result, firstPid);
        return result;
    }

    function getChildren(data, result, parentId) {
        for (const item of data) {
            if (item.pid.toString() === parentId) {
                const newItem = {...item, children: []};
                result.push(newItem);
                getChildren(data, newItem.children, item.id.toString());
            }
        }
    }

    function getChildren1(data, result, parentId) {
        for (const item of data) {
            if (item.parentId === parentId) {
                const newItem = {...item, children: []};
                result.push(newItem);
                getChildren1(data, newItem.children, item.deptId);
            }
        }
    }
</script>
</body>
</html>