新增拖动更改大小并保存对应比例，刷新后读取比例

web/building_saas/css/main.css

@@ -317,3 +317,8 @@ body {
 .dropdown-item.disabled, .dropdown-item:disabled{
     pointer-events:none
 }
+.resize-line{
+    cursor: s-resize;
+    height: 4px;
+    background: #f7f7f9;
+}

web/building_saas/glj/html/glj_index.html

@@ -12,12 +12,13 @@
 </div>
 <div class="container-fluid">
     <div class="row">
-        <div class="col-lg-12 p-0">
+        <div class="col-lg-12 p-0" id="glj-main">
             <div class="top-content">
                 <div class="main-data-top" id="project-glj">
                     <p style="text-align: center; margin-top: 30px;">正在加载数据</p>
                 </div>
             </div>
+            <div class="resize-line"></div>
             <div class="bottom-content">
                 <ul class="nav nav-tabs" role="tablist">
                     <li class="nav-item">

web/building_saas/glj/js/project_glj.js

@@ -32,6 +32,10 @@ $(document).ready(function () {
         init();
     });
 
+    slideResize($("#glj-main"), function() {
+        projectGLJSpread.sheetObj.spread.refresh();
+    });
+
     // 单价文件切换弹框
     $('#change-dj').on('shown.bs.modal', function () {
         // 获取当前建设项数据
@@ -285,6 +289,10 @@ function spreadInit() {
             projectGLJSheet.filterData('unit_price.type', []);
         }
     });
+
+    loadSize("glj-main", function() {
+        projectGLJSpread.sheetObj.spread.refresh();
+    });
 }
 
 /**

web/building_saas/js/global.js

@@ -17,17 +17,21 @@ function autoFlashHeight(){
     $(".poj-list").height($(window).height()-headerHeight-toolsbarHeight);
     $(".form-view").height($(window).height()-headerHeight-ftoolsbarHeight);
     $(".form-list").height($(window).height()-headerHeight-50 );
+    // 读取本地存储的高度
+    loadSize("main", function() {
+        refreshSubSpread();
+    });
 };
 $(window).resize(autoFlashHeight);
 /*全局自适应高度结束*/
-$(function(){
-/*侧滑*/
-$(".open-sidebar").click(function(){
-    $(".slide-sidebar").animate({width:"800"}).addClass("open");
-});
-$("body").click(function(event){
+$(function () {
+    /*侧滑*/
+    $(".open-sidebar").click(function () {
+        $(".slide-sidebar").animate({width: "800"}).addClass("open");
+    });
+    $("body").click(function (event) {
         var e = event || window.event; //浏览器兼容性
-        if(!$(event.target).is('a')) {
+        if (!$(event.target).is('a')) {
             var elem = event.target || e.srcElement;
             while (elem) { //循环判断至跟节点，防止点击的是div子元素
                 if (elem.className == "open-sidebar" || elem.className == 'slide-sidebar open') {
@@ -35,13 +39,14 @@ $("body").click(function(event){
                 }
                 elem = elem.parentNode;
             }
-            $(".slide-sidebar").animate({width:"0"}).removeClass("open")// 关闭处理
+            $(".slide-sidebar").animate({width: "0"}).removeClass("open")// 关闭处理
         }
 
     });
-/*侧滑*/
-/*工具提示*/
-$(function () {
-  $('[data-toggle="tooltip"]').tooltip()
-});
+    /*侧滑*/
+    /*工具提示*/
+    $(function () {
+        $('[data-toggle="tooltip"]').tooltip()
+    });
+
 });

web/building_saas/main/html/main.html

@@ -80,10 +80,11 @@
               </div>
               <div class="container-fluid">
                   <div class="row">
-                      <div class="main-content col-lg-12 p-0">
+                      <div class="main-content col-lg-12 p-0" id="main">
                           <div class="top-content">
                               <div class="main-data-top" id="billsSpread"></div>
                           </div>
+                          <div class="resize-line"></div>
                           <div class="bottom-content">
                               <ul class="nav nav-tabs" role="tablist">
                                   <li class="nav-item">

web/building_saas/main/js/main.js

@@ -19,4 +19,93 @@ $(function () {
         // do something
     });
 
-});
+    slideResize($("#main"), function() {
+        projectObj.mainSpread.refresh();
+        refreshSubSpread();
+    });
+});
+
+/**
+ * 拖动更改div大小
+ *
+ * @param {Object} rootElement - 最顶层div
+ * @param {function} callback - 成功后执行
+ * @return {void}
+ */
+function slideResize(rootElement, callback) {
+    let startY = 0;
+    let drag = false;
+    const element = rootElement.find('.resize-line');
+    const topContentEle = rootElement.find(".top-content");
+    const bottomContentEle = rootElement.find(".bottom-content");
+    let topContentHeight = 0;
+    let bottomContentHeight = 0;
+    let navHeight = 0;
+    let topChangeHeight = 0;
+    let bottomChangeHeight = 0;
+
+    // 鼠标点下时
+    element.mousedown(function(e) {
+        drag = true;
+        startY = e.clientY;
+        // 获取上部分的高度
+        topContentHeight = topContentEle.height();
+        // 获取下部分的高度
+        bottomContentHeight = bottomContentEle.height();
+        // nav高度部分
+        navHeight = bottomContentEle.children('ul.nav').height();
+    });
+
+    // 鼠标移动
+    $("body").mousemove(function(e) {
+        if (drag) {
+            let moveHeight = e.clientY - startY;
+            // 判断拖动范围不能超出
+            topChangeHeight = topContentHeight + moveHeight;
+            topChangeHeight = topChangeHeight < 150 ? 150 : topChangeHeight;
+            topChangeHeight = topChangeHeight > 700 ? 700 : topChangeHeight;
+            topContentEle.children(".main-data-top").height(topChangeHeight);
+
+            bottomChangeHeight = bottomContentHeight - moveHeight;
+            bottomChangeHeight = bottomChangeHeight < 150 ? 150 : bottomChangeHeight;
+            bottomChangeHeight = bottomChangeHeight > 700 ? 700 : bottomChangeHeight;
+            bottomContentEle.children().find(".main-data-bottom").height(bottomChangeHeight - navHeight);
+        }
+    });
+
+    // 鼠标弹起
+    $("body").mouseup(function(e) {
+        if (drag) {
+            callback();
+            drag = false;
+            // 存入本地缓存
+            const storage = window.localStorage;
+            if (storage) {
+                const id = rootElement.attr('id');
+                storage.setItem('topHeight:' + id, topChangeHeight);
+                storage.setItem('bottomHeight:' + id, bottomChangeHeight);
+            }
+        }
+    });
+}
+
+/**
+ * 读取设置的高度
+ *
+ * @param {String} tag - 顶层div的id
+ * @param {function} callback - 回调函数
+ * @return {void}
+ */
+function loadSize(tag, callback) {
+    const storage = window.localStorage;
+    if (!storage || tag === '') {
+        return;
+    }
+    const topHeight = storage.getItem('topHeight:' + tag);
+    const bottomHeight = storage.getItem('bottomHeight:' + tag);
+    const navHeight = $("#"+ tag +" .bottom-content").children('ul.nav').height();
+    $("#"+ tag +" .main-data-top").height(topHeight);
+    $("#"+ tag +" .main-data-bottom").height(bottomHeight - navHeight);
+    $("#"+ tag +" .bottom-content").height(bottomHeight);
+    callback();
+}