项目经费管理所有页面的所有的部门设置成下拉选择

src/main/resources/templates/annualbudget/list.html

@@ -57,8 +57,8 @@
                         </div>
 
                         <div class="layui-inline">
-                            <label class="layui-form-label" style="width: 70px">所属部门</label>
-                            <div class="layui-input-inline" style="width: 140px">
+                            <label class="layui-form-label required" style="width: 70px">所属部门</label>
+                            <div class="layui-input-block">
                                 <input type="text" id="ssbmmc" name="ssbmmc" autocomplete="off" class="layui-input">
                             </div>
                         </div>
@@ -151,11 +151,54 @@
     var updateflag = 0;
     var xmApproval = {};
 
-    layui.use(['form', 'table', 'tableSelect', 'laydate'], function () {
+    layui.use(['form', 'table', 'tableSelect', 'laydate','layCascader'], function () {
         var form = layui.form
         table = layui.table;
         var userId = $("#userId").val();
         var selectedYear = $('#nf').val();
+        layCascader = layui.layCascader;
+
+        var index2 = layer.load(0, {shade: 0.1});
+        AjaxUtil.get({
+            url: AjaxUtil.ctx + 'userinfo/listDeptForSelect',
+            success: function (res) {
+                layer.close(index2);
+
+                var datalist = [];
+                for (let item of res.data) {
+                    item.value = item.deptName;
+                    item.label = item.deptName;
+                    datalist.push(item);
+                }
+                console.log(datalist)
+                // 扁平数据转树
+                var options = arrayToTree(datalist, "0");
+
+                // 初始化cascader实例
+                var cascader = layCascader({
+                    elem: '#ssbmmc',
+                    clearable: true,
+                    showAllLevels: false, // 配置仅显示最后一级
+                    props: {
+                        checkStrictly: true, // 配置选择任意一级选项
+                    },
+                    options: options
+                });
+
+                // 监听cascader变化
+                cascader.changeEvent(function (value, node) {
+                    // 主动关闭面板
+                    cascader.close();
+                    $("#deptId").val(value);
+                    console.log(node);
+                });
+            },
+            error: function (error) {
+                layer.close(index2);
+                Message.error('获取部门信息失败！', 1000);
+            }
+        });
+
         var currTable = table.render({
             elem: '#currentTableId',
             url: AjaxUtil.ctx + 'prjAnnualbudget/list/?nf='+selectedYear,
@@ -694,6 +737,20 @@
     function setUpdateFlag() {
         updateflag = 1;
     }
+    function arrayToTree(data, firstPid) {
+        const result = [];
+        getChildren(data, result, firstPid)
+        return result;
+    }
+    function getChildren(data, result, parentId) {
+        for (const item of data) {
+            if (item.parentId === parentId) {
+                const newItem = {...item, children: []};
+                result.push(newItem);
+                getChildren(data, newItem.children, item.deptId);
+            }
+        }
+    }
 </script>
 </body>
 </html>

src/main/resources/templates/annualbudget/view_record.html

@@ -57,8 +57,8 @@
                     {field: 'fymc', width: '20%', title: '费用名称'},
                     {field: 'nf', width: '10%', title: '年份'},
                     {field: 'xmzys', width: '20%', title: '项目总预算'},
-                    {field: 'sptgysje', width: '20%', title: '审批通过状态'},
-                    {field: 'ysje', width: '20%', title: '现在'},
+                    {field: 'sptgzt', width: '20%', title: '审批通过状态'},
+                    {field: 'xgjlxz', width: '20%', title: '现在'},
                 ]
             ],
             sortName: 'jtsj',

src/main/resources/templates/stafeemanage/list_approving.html

@@ -84,8 +84,8 @@
 
                         <div class="layui-inline">
                             <label class="layui-form-label" style="width: 60px">所属部门</label>
-                            <div class="layui-input-inline" style="width: 200px">
-                                <input type="text" id="ssbmmc" name="ssbmmc" autocomplete="off" class="layui-input">
+                            <div class="layui-input-block">
+                                <input type="text" id="ssbmmc" name="ssbmmc" >
                             </div>
                         </div>
                         <div class="layui-inline">
@@ -167,15 +167,59 @@
     var updateflag = 0;
     var fyApproval = {};
 
-    layui.use(['form', 'table', 'tableSelect', 'laydate'], function () {
+    layui.use(['form', 'table', 'tableSelect', 'laydate','layCascader'], function () {
         var form = layui.form,
             tableSelect = layui.tableSelect,
             laydate = layui.laydate,
             table = layui.table;
+        layCascader = layui.layCascader;
         var userId = $("#userId").val();
 
         var sqsj1 = '',
             sqsj2 = '';
+
+        var index2 = layer.load(0, {shade: 0.1});
+        AjaxUtil.get({
+            url: AjaxUtil.ctx + 'userinfo/listDeptForSelect',
+            success: function (res) {
+                layer.close(index2);
+
+                var datalist = [];
+                for (let item of res.data) {
+                    item.value = item.deptName;
+                    item.label = item.deptName;
+                    datalist.push(item);
+                }
+                console.log(datalist)
+                // 扁平数据转树
+                var options = arrayToTree(datalist, "0");
+
+                // 初始化cascader实例
+                var cascader = layCascader({
+                    elem: '#ssbmmc',
+                    clearable: true,
+                    showAllLevels: false, // 配置仅显示最后一级
+                    props: {
+                        checkStrictly: true, // 配置选择任意一级选项
+                    },
+                    options: options
+                });
+
+                // 监听cascader变化
+                cascader.changeEvent(function (value, node) {
+                    // 主动关闭面板
+                    cascader.close();
+                    $("#deptId").val(value);
+                    console.log(node);
+                });
+            },
+            error: function (error) {
+                layer.close(index2);
+                Message.error('获取部门信息失败！', 1000);
+            }
+        });
+
+
         //申请时间
         laydate.render({
             elem: '#sqsj1',
@@ -720,6 +764,20 @@
     function getXmApproval() {
         return xmApproval;
     }
+    function arrayToTree(data, firstPid) {
+        const result = [];
+        getChildren(data, result, firstPid)
+        return result;
+    }
+    function getChildren(data, result, parentId) {
+        for (const item of data) {
+            if (item.parentId === parentId) {
+                const newItem = {...item, children: []};
+                result.push(newItem);
+                getChildren(data, newItem.children, item.deptId);
+            }
+        }
+    }
 </script>
 </body>
 </html>

src/main/resources/templates/stafeemanage/list_feemanage.html

@@ -70,7 +70,7 @@
                         </div>
                         <div class="layui-inline">
                             <label class="layui-form-label" style="width: 70px">所属部门</label>
-                            <div class="layui-input-inline" style="width: 140px">
+                            <div class="layui-input-block">
                                 <input type="text" id="ssbmmc" name="ssbmmc" autocomplete="off" class="layui-input">
                             </div>
                         </div>
@@ -123,11 +123,54 @@
 <script th:inline="javascript" type="text/javascript">
     AjaxUtil.ctx = /*[[@{/}]]*/'';
 
-    layui.use(['form', 'table', 'tableSelect'], function () {
+    layui.use(['form', 'table', 'tableSelect','layCascader'], function () {
         var form = layui.form,
             table = layui.table,
             tableSelect = layui.tableSelect;
+        layCascader = layui.layCascader;
         var year = document.getElementById('nf').value;
+
+        var index2 = layer.load(0, {shade: 0.1});
+        AjaxUtil.get({
+            url: AjaxUtil.ctx + 'userinfo/listDeptForSelect',
+            success: function (res) {
+                layer.close(index2);
+
+                var datalist = [];
+                for (let item of res.data) {
+                    item.value = item.deptName;
+                    item.label = item.deptName;
+                    datalist.push(item);
+                }
+                console.log(datalist)
+                // 扁平数据转树
+                var options = arrayToTree(datalist, "0");
+
+                // 初始化cascader实例
+                var cascader = layCascader({
+                    elem: '#ssbmmc',
+                    clearable: true,
+                    showAllLevels: false, // 配置仅显示最后一级
+                    props: {
+                        checkStrictly: true, // 配置选择任意一级选项
+                    },
+                    options: options
+                });
+
+                // 监听cascader变化
+                cascader.changeEvent(function (value, node) {
+                    // 主动关闭面板
+                    cascader.close();
+                    $("#deptId").val(value);
+                    console.log(node);
+                });
+            },
+            error: function (error) {
+                layer.close(index2);
+                Message.error('获取部门信息失败！', 1000);
+            }
+        });
+
         var currTable = table.render({
             elem: '#currentTableId',
             url: AjaxUtil.ctx + 'staBudgetapproval/list_feemanage/?nf='+year,
@@ -333,6 +376,20 @@
     function getXmApproval() {
         return xmApproval;
     }
+    function arrayToTree(data, firstPid) {
+        const result = [];
+        getChildren(data, result, firstPid)
+        return result;
+    }
+    function getChildren(data, result, parentId) {
+        for (const item of data) {
+            if (item.parentId === parentId) {
+                const newItem = {...item, children: []};
+                result.push(newItem);
+                getChildren(data, newItem.children, item.deptId);
+            }
+        }
+    }
 </script>
 </body>
 </html>