From 86a328000080107b3914b218b74e9513fa9f53aa Mon Sep 17 00:00:00 2001 From: dushusir <1414556676@qq.com> Date: Wed, 10 Mar 2021 15:40:26 +0800 Subject: [PATCH] fix(toolbar): toolbar 1.Optimized the toolbar position of the toolbar and more buttons when Luckysheet does not occupy the full screen 2.Add sponsors fix #414 --- README-zh.md | 4 +++- README.md | 4 +++- docs/about/sponsor.md | 3 +++ docs/zh/about/sponsor.md | 5 ++++- src/controllers/resize.js | 38 +++++++++++++++++++++++++++++++++++--- 5 files changed, 48 insertions(+), 6 deletions(-) diff --git a/README-zh.md b/README-zh.md index 7f642c5..a1e15f5 100644 --- a/README-zh.md +++ b/README-zh.md @@ -136,7 +136,6 @@ npm run build ## 合作项目 - [鲁班h5](https://github.com/ly525/luban-h5) -- [excelize](https://github.com/360EntSecGroup-Skylar/excelize) - [h5-Dooring](https://github.com/MrXujiang/h5-Dooring) - [Furion](https://gitee.com/monksoul/Furion) @@ -195,6 +194,9 @@ Luckysheet是MIT许可的开源项目，其持续稳定的开发离不开这些 - Quentin ¥ 20 - 周宇凡 ¥ 100 - *超 ¥ 10 +- 维宁 ¥ 100 +- hyy ¥ 20 +- 雨亭寒江月 ¥ 50 ## 贡献者和感谢 diff --git a/README.md b/README.md index c5393bc..728a1ba 100644 --- a/README.md +++ b/README.md @@ -129,7 +129,6 @@ npm run build ## Partner project - [luban-h5](https://github.com/ly525/luban-h5) -- [excelize](https://github.com/360EntSecGroup-Skylar/excelize) - [h5-Dooring](https://github.com/MrXujiang/h5-Dooring) - [Furion](https://gitee.com/monksoul/Furion) @@ -179,6 +178,9 @@ Funds donated via Patreon go directly to support mengshukeji's work on Luckyshee - Quentin ¥ 20 - 周宇凡 ¥ 100 - *超 ¥ 10 +- 维宁 ¥ 100 +- hyy ¥ 20 +- 雨亭寒江月 ¥ 50 ## Authors and acknowledgment diff --git a/docs/about/sponsor.md b/docs/about/sponsor.md index 35f7c43..365a3d5 100644 --- a/docs/about/sponsor.md +++ b/docs/about/sponsor.md @@ -46,3 +46,6 @@ Funds donated via Patreon go directly to support mengshukeji's work on Luckyshee - Quentin ¥ 20 - 周宇凡 ¥ 100 - *超 ¥ 10 +- 维宁 ¥ 100 +- hyy ¥ 20 +- 雨亭寒江月 ¥ 50 diff --git a/docs/zh/about/sponsor.md b/docs/zh/about/sponsor.md index 00cc9a7..9324f0e 100644 --- a/docs/zh/about/sponsor.md +++ b/docs/zh/about/sponsor.md @@ -45,4 +45,7 @@ Luckysheet是MIT许可的开源项目，其持续稳定的开发离不开这些 - *旭 ¥ 10 - Quentin ¥ 20 - 周宇凡 ¥ 100 -- *超 ¥ 10 \ No newline at end of file +- *超 ¥ 10 +- 维宁 ¥ 100 +- hyy ¥ 20 +- 雨亭寒江月 ¥ 50 \ No newline at end of file diff --git a/src/controllers/resize.js b/src/controllers/resize.js index 2883312..631e53a 100644 --- a/src/controllers/resize.js +++ b/src/controllers/resize.js @@ -5,6 +5,7 @@ import Store from '../store'; import locale from '../locale/locale'; import sheetmanage from './sheetmanage'; import tooltip from '../global/tooltip' +import { $$ } from "../utils/util"; let gridW = 0, gridH = 0; @@ -100,13 +101,15 @@ export default function luckysheetsizeauto(isRefreshCanvas=true) { `, - morediv = '
'; + // Add style left:$$('.luckysheet') left, when the worksheet does not fill the full screen + morediv = '
'; if($("#luckysheet-icon-morebtn-div").length == 0){ $("body").append(morediv); } - $("#luckysheet-icon-morebtn-div").hide(); + // $("#luckysheet-icon-morebtn-div").hide(); + $$("#luckysheet-icon-morebtn-div").style.visibility = 'hidden'; // $("#luckysheet-icon-morebtn-div > div").appendTo($("#luckysheet-wa-editor")); $("#luckysheet-icon-morebtn-div > div").each(function(){ @@ -158,8 +161,31 @@ export default function luckysheetsizeauto(isRefreshCanvas=true) { $("#luckysheet-wa-editor").append(morebtn); $("#luckysheet-icon-morebtn").click(function(){ + + //When resize, change the width of the more button container in real time + $$('#luckysheet-icon-morebtn-div').style.left = '';//reset + + const containerLeft = $$('#luckysheet').getBoundingClientRect().left; + const morebtnLeft = $$('#luckysheet-icon-morebtn-div').getBoundingClientRect().left;//get real left info + + if(morebtnLeft < containerLeft){ + $$('#luckysheet-icon-morebtn-div').style.left = containerLeft + 'px'; + } + let right = $(window).width() - $("#luckysheet-icon-morebtn").offset().left - $("#luckysheet-icon-morebtn").width()+ $("body").scrollLeft(); - $("#luckysheet-icon-morebtn-div").toggle().css("right", right < 0 ? 0 : right); + + + // $("#luckysheet-icon-morebtn-div").toggle().css("right", right < 0 ? 0 : right); + + // use native js operation + $$('#luckysheet-icon-morebtn-div').style.right = right < 0 ? 0 : right + 'px'; + + // change to visibility,morebtnLeft will get the actual value + if($$('#luckysheet-icon-morebtn-div').style.visibility === 'hidden'){ + $$('#luckysheet-icon-morebtn-div').style.visibility = 'visible'; + }else{ + $$('#luckysheet-icon-morebtn-div').style.visibility = 'hidden'; + } let $txt = $(this).find(".luckysheet-toolbar-menu-button-caption"); if($txt.text().indexOf(locale_toolbar.toolMore) > -1){ @@ -558,6 +584,12 @@ export function menuToolBarWidth() { } }); + + //If the container does not occupy the full screen, we need to subtract the left margin + const containerLeft = $('#' + Store.container).offset().left; + toobarWidths.forEach((item,i)=>{ + toobarWidths[i] -= containerLeft; + }) }