sjs AutoTips根据scrollTop值位置变动

app/public/js/change_apply_information.js

@@ -206,8 +206,8 @@ $(document).ready(() => {
             {title: '|金额', colSpan: '|1', rowSpan: '|1', field: 'oa_tp', hAlign: 2, width: 80, type: 'Number', readOnly: true, getValue: 'getValue.oa_tp'},
             {title: '申请变更增(+)减(-)|数量', colSpan: '2|1', rowSpan: '1|1', field: 'camount', hAlign: 2, width: 60, type: 'Number', readOnly: 'readOnly.isEdit', getValue: 'getValue.camount'},
             {title: '|金额', colSpan: '|1', rowSpan: '|1', field: 'ca_tp', hAlign: 2, width: 80, type: 'Number', readOnly: true, getValue: 'getValue.ca_tp'},
-            {title: '备注1', colSpan: '1', rowSpan: '2', field: 'ex_memo1', hAlign: 0, width: 110, formatter: '@', readOnly: 'readOnly.isEdit2'},
-            {title: '备注2', colSpan: '1', rowSpan: '2', field: 'ex_memo2', hAlign: 0, width: 110, formatter: '@', readOnly: 'readOnly.isEdit2'},
+            {title: '备注1', colSpan: '1', rowSpan: '2', field: 'ex_memo1', hAlign: 0, width: 110, formatter: '@', readOnly: 'readOnly.isEdit2', cellType: 'ellipsisAutoTip', scrollHeightClass: '.sjs-height-0'},
+            {title: '备注2', colSpan: '1', rowSpan: '2', field: 'ex_memo2', hAlign: 0, width: 110, formatter: '@', readOnly: 'readOnly.isEdit2', cellType: 'ellipsisAutoTip', scrollHeightClass: '.sjs-height-0'},
         ],
         emptyRows: !readOnly ? 3 : 0,
         headRows: 2,
@@ -807,8 +807,23 @@ $(document).ready(() => {
             // }
         }
     });
+    // let timer = null
+    // const handleScroll = function (e) {
+    //     timer && clearTimeout(timer)
+    //     timer = setTimeout(() => {
+    //         console.log('hello');
+    //
+    //         // SpreadJsObj.initSpreadSettingEvents(changeSpreadSetting, changeCol);
+    //         // SpreadJsObj.initSheet(changeSpreadSheet, changeSpreadSetting);
+    //         // SpreadJsObj.loadSheetData(changeSpreadSheet, SpreadJsObj.DataType.Data, changeList);
+    //         // changeSpreadObj.makeSjsFooter();
+    //     }, 400);
+    // }
+    //
+    // document.querySelector('.sjs-height-0').addEventListener('scroll', handleScroll);
 });
 
+
 /**
  * 校验文件大小、格式
  * @param {Array} files 文件数组

app/public/js/change_plan_information.js

@@ -227,8 +227,8 @@ $(document).ready(() => {
             changeSpreadSetting.cols.push(newColTp);
         }
     }
-    changeSpreadSetting.cols.push({title: '备注1', colSpan: '1', rowSpan: '2', field: 'ex_memo1', hAlign: 0, width: 110, formatter: '@', readOnly: 'readOnly.isEdit2'});
-    changeSpreadSetting.cols.push({title: '备注2', colSpan: '1', rowSpan: '2', field: 'ex_memo2', hAlign: 0, width: 110, formatter: '@', readOnly: 'readOnly.isEdit2'});
+    changeSpreadSetting.cols.push({title: '备注1', colSpan: '1', rowSpan: '2', field: 'ex_memo1', hAlign: 0, width: 110, formatter: '@', readOnly: 'readOnly.isEdit2', cellType: 'ellipsisAutoTip', scrollHeightClass: '.sjs-height-0'});
+    changeSpreadSetting.cols.push({title: '备注2', colSpan: '1', rowSpan: '2', field: 'ex_memo2', hAlign: 0, width: 110, formatter: '@', readOnly: 'readOnly.isEdit2', cellType: 'ellipsisAutoTip', scrollHeightClass: '.sjs-height-0'});
 
     const changeCol = {
         getValue: {

app/public/js/spreadjs_rela/spreadjs_zh.js

@@ -627,7 +627,8 @@ const SpreadJsObj = {
         }
         if(colSetting.cellType === 'ellipsisAutoTip') {
             if (!sheet.extendCellType.ellipsisAutoTip) {
-                sheet.extendCellType.ellipsisAutoTip = this.CellType.getEllipsisTextAutoTipCellType();
+                const scrollHeightClass = colSetting.scrollHeightClass ? colSetting.scrollHeightClass : false;
+                sheet.extendCellType.ellipsisAutoTip = this.CellType.getEllipsisTextAutoTipCellType(scrollHeightClass);
             }
             sheet.getRange(-1, col, -1, 1).cellType(sheet.extendCellType.ellipsisAutoTip);
         }
@@ -1554,7 +1555,7 @@ const SpreadJsObj = {
          * 获取 带悬浮提示的CellType
          * @returns {TipCellType}
          */
-        getTipCellType: function () {
+        getTipCellType: function (scrollHeightClass = false) {
             const maxHintWidth = 200, indent = 15, borderIndent = 10;
             const TipCellType = function () {};
             // 继承 SpreadJs定义的 普通的TextCellType
@@ -1626,12 +1627,13 @@ const SpreadJsObj = {
                         }
                         const validWidth = $(window).width() - (pos.x + hitinfo.x + indent) - borderIndent;
                         const textWidth = this.getTextDisplayWidth(hitinfo, text, "9pt Arial");
+                        const scrollTop = scrollHeightClass ? $(scrollHeightClass).scrollTop() : 0;
                         if (validWidth >= maxHintWidth || textWidth <= validWidth) {
-                            $(div).html(text).css("top", pos.y + hitinfo.y + indent).css("left", pos.x + hitinfo.x + indent);
+                            $(div).html(text).css("top", pos.y + hitinfo.y - scrollTop + indent).css("left", pos.x + hitinfo.x + indent);
                         } else if (textWidth > maxHintWidth) {
-                            $(div).html(text).css("top", pos.y + hitinfo.y + indent).css("left", pos.x + hitinfo.x - indent - maxHintWidth);
+                            $(div).html(text).css("top", pos.y + hitinfo.y - scrollTop + indent).css("left", pos.x + hitinfo.x - indent - maxHintWidth);
                         } else {
-                            $(div).html(text).css("top", pos.y + hitinfo.y + indent).css("left", pos.x + hitinfo.x - indent - textWidth);
+                            $(div).html(text).css("top", pos.y + hitinfo.y - scrollTop + indent).css("left", pos.x + hitinfo.x - indent - textWidth);
                         }
                         this._toolTipElement = div;
                         $(div).show("fast");
@@ -1651,10 +1653,10 @@ const SpreadJsObj = {
 
             return new TipCellType();
         },
-        getAutoTipCellType: function () {
+        getAutoTipCellType: function (scrollHeightClass) {
             const AutoTipCellType = function () {};
             // 继承 TipCellType
-            AutoTipCellType.prototype = SpreadJsObj.CellType.getTipCellType();
+            AutoTipCellType.prototype = SpreadJsObj.CellType.getTipCellType(scrollHeightClass);
             const proto = AutoTipCellType.prototype;
             proto.showTip = function (hitinfo, text) {
                 return text && text !== '' && this.getTextDisplayWidth(hitinfo, text) > hitinfo.cellRect.width;
@@ -2342,10 +2344,10 @@ const SpreadJsObj = {
             };
             return new EllipsisTextCellType();
         },
-        getEllipsisTextAutoTipCellType: function () {
+        getEllipsisTextAutoTipCellType: function (scrollHeightClass) {
             const CellType = function () {};
             // 继承 TipCellType
-            CellType.prototype = SpreadJsObj.CellType.getAutoTipCellType();
+            CellType.prototype = SpreadJsObj.CellType.getAutoTipCellType(scrollHeightClass);
             const proto = CellType.prototype;
             const ellipsisTextCellType = SpreadJsObj.CellType.getEllipsisTextCellType();
             proto.getEllipsisText = ellipsisTextCellType.getEllipsisText;