refactor: 优化审批弹框列表过长，现添加自动下拉到底部的功能

app/view/change/info_modal.ejs

@@ -789,3 +789,13 @@
     </div>
 </div>
 <% } %>
+<script>
+    $('.modal').on('shown.bs.modal', function () {
+        const height = $(this)[0].scrollHeight
+        const scrollBox = $('div[class="col-8 modal-height-500"]')
+        // 450是modal没有滚动条时的最大高度，超过则出现滚动条，需要自动下拉到底部
+        if (scrollBox.length && scrollBox[0].scrollHeight > 450) {
+            scrollBox.scrollTop(height);
+        }
+    });
+</script>

app/view/material/audit_modal.ejs

@@ -867,6 +867,12 @@
 <% } %>
 
 <script>
-    const au = JSON.parse('<%- JSON.stringify(ctx.material.auditHistory) %>');
-    console.log(au);
+    $('.modal').on('shown.bs.modal', function () {
+        const height = $(this)[0].scrollHeight
+        const scrollBox = $('div[class="col-8 modal-height-500"]')
+        // 450是modal没有滚动条时的最大高度，超过则出现滚动条，需要自动下拉到底部
+        if (scrollBox.length && scrollBox[0].scrollHeight > 450) {
+            scrollBox.scrollTop(height);
+        }
+    });
 </script>

app/view/stage/audit_modal.ejs

@@ -104,7 +104,7 @@
                                     </ul>
                                 </div>
                             </div>
-                            <div class="col-8 modal-height-500" style="overflow: auto">
+                            <div class="col-8 modal-height-500" style="overflow: auto" >
                                 <% for (const ah of ctx.stage.auditHistory) { %>
                                     <div class="card mt-3">
                                         <ul class="list-group list-group-flush">
@@ -413,7 +413,7 @@
         </div>
     <% } else { %>
         <!--审批流程/结果-->
-        <div class="modal fade" id="sp-list" data-backdrop="static">
+        <div class="modal fade" id="sp-list" data-backdrop="static" >
             <div class="modal-dialog modal-lg" role="document">
                 <div class="modal-content">
                     <div class="modal-header">
@@ -439,7 +439,7 @@
                                     </ul>
                                 </div>
                             </div>
-                            <div class="col-8 modal-height-500" style="overflow: auto">
+                            <div class="col-8 modal-height-500" style="overflow: auto" >
                                 <% for (const ah of ctx.stage.auditHistory) { %>
                                     <div class="card mt-3">
                                         <ul class="list-group list-group-flush">
@@ -593,7 +593,7 @@
                                 </ul>
                             </div>
                         </div>
-                        <div class="col-8 modal-height-500" style="overflow: auto">
+                        <div class="col-8 modal-height-500" style="overflow: auto" id="scroll-box">
                             <% for (const ah of ctx.stage.auditHistory) { %>
                                 <div class="card mt-3">
                                     <ul class="list-group list-group-flush">
@@ -1563,4 +1563,12 @@
         $('#hide-all').hide();
         return false;
     });
+    $('.modal').on('shown.bs.modal', function () {
+        const height = $(this)[0].scrollHeight
+        const scrollBox = $('div[class="col-8 modal-height-500"]')
+        // 450是modal没有滚动条时的最大高度，超过则出现滚动条，需要自动下拉到底部
+        if (scrollBox.length && scrollBox[0].scrollHeight > 450) {
+            scrollBox.scrollTop(height);
+        }
+    });
 </script>