From 255ab84800fd5f7cc1701f7236f574b042b2ba0d Mon Sep 17 00:00:00 2001 From: flowerField Date: Sat, 5 Dec 2020 23:32:41 +0800 Subject: [PATCH] =?UTF-8?q?=E5=A2=9E=E5=8A=A0=E9=85=8D=E7=BD=AE=E9=A1=B9?= =?UTF-8?q?=EF=BC=9A=E9=99=90=E5=88=B6=E5=B7=A5=E4=BD=9C=E8=A1=A8=E5=90=8D?= =?UTF-8?q?=E7=A7=B0=E6=9C=80=E5=A4=A7=E9=95=BF=E5=BA=A6=E5=B9=B6=E8=B0=83?= =?UTF-8?q?=E6=95=B4=E6=A0=B7=E5=BC=8F?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/guide/config.md | 15 +++++++++++++++ docs/zh/guide/config.md | 16 ++++++++++++++++ src/config.js | 3 ++- src/controllers/sheetBar.js | 33 +++++++++++++++++++++++++++++++++ src/core.js | 2 ++ src/css/luckysheet-core.css | 18 ++++++++++++++++-- 6 files changed, 84 insertions(+), 3 deletions(-) diff --git a/docs/guide/config.md b/docs/guide/config.md index b66ace7..56e871f 100644 --- a/docs/guide/config.md +++ b/docs/guide/config.md @@ -508,6 +508,21 @@ Note that you also need to configure `loadUrl` and `loadSheetUrl` to take effect ------------ +### limitSheetNameLength +- Type: Boolean +- Default: true +- Usage：Is the length of the sheet name limited in scenarios such as sheet renaming + +------------ + +### defaultSheetNameMaxLength +- Type：Number +- Default：31 +- Usage：Default maximum allowed sheet name length + +------------ + + ## Hook Function (TODO) When the hook function is used in secondary development, hooks will be implanted in each common mouse or keyboard operation, and the function passed in by the developer will be called to expand the function of Luckysheet. diff --git a/docs/zh/guide/config.md b/docs/zh/guide/config.md index 460bdd1..bdc59ee 100644 --- a/docs/zh/guide/config.md +++ b/docs/zh/guide/config.md @@ -74,6 +74,8 @@ Luckysheet开放了更细致的自定义配置选项，分别有 - 列标题区域的高度 [columnHeaderHeight](#columnHeaderHeight) - 是否显示公式栏 [sheetFormulaBar](#sheetFormulaBar) - 初始化默认字体大小 [defaultFontSize](#defaultFontSize) +- 是否限制工作表名长度 [limitSheetNameLength](#limitSheetNameLength) +- 默认允许工作表名的最大长度 [defaultSheetNameMaxLength](#defaultSheetNameMaxLength) ### container - 类型：String @@ -599,6 +601,20 @@ Luckysheet开放了更细致的自定义配置选项，分别有 ------------ +### limitSheetNameLength +- 类型：Boolean +- 默认值：true +- 作用：工作表重命名等场景下是否限制工作表名称的长度 + +------------ + +### defaultSheetNameMaxLength +- 类型：Number +- 默认值：31 +- 作用：默认允许的工作表名最大长度 + +------------ + ## 钩子函数 钩子函数应用于二次开发时，会在各个常用鼠标或者键盘操作时植入钩子，调用开发者传入的函数，起到扩展Luckysheet功能的作用。 diff --git a/src/config.js b/src/config.js index e7a69b0..7b53de0 100644 --- a/src/config.js +++ b/src/config.js @@ -57,7 +57,8 @@ export default { defaultColWidth:73, defaultRowHeight:19, defaultFontSize:10, - + limitSheetNameLength:true, //是否限制工作表名的长度 + defaultSheetNameMaxLength:31, //默认工作表名称的最大长度 sheetFormulaBar:true, //是否显示公式栏 showtoolbarConfig:{}, //自定义工具栏 showsheetbarConfig:{}, //自定义底部sheet页 diff --git a/src/controllers/sheetBar.js b/src/controllers/sheetBar.js index 9aba9a0..10673a8 100644 --- a/src/controllers/sheetBar.js +++ b/src/controllers/sheetBar.js @@ -225,6 +225,39 @@ export function initialSheetBar(){ luckysheetsheetnameeditor($(this)); }); + let compositionFlag = true; + $("#luckysheet-sheet-area").on("compositionstart", "span.luckysheet-sheets-item-name", ()=> compositionFlag = false); + $("#luckysheet-sheet-area").on("compositionend", "span.luckysheet-sheets-item-name", ()=> compositionFlag = true); + $("#luckysheet-sheet-area").on("input", "span.luckysheet-sheets-item-name", function () { + if(Store.allowEdit===false){ + return; + } + + if(Store.limitSheetNameLength === false){ + return + } + + let maxLength = Store.defaultSheetNameMaxLength; + if(maxLength === 0){ + return + } + + setTimeout( ()=> { + if (compositionFlag) { + + if ($(this).text().length >= maxLength) { /* 检查：值是否越界 */ + setTimeout(() => { + $(this).text($(this).text().substring(0, maxLength)); + + let range = window.getSelection(); + range.selectAllChildren(this); + range.collapseToEnd(); + }, 0); + } + } + }, 0); + }); + $("#luckysheet-sheet-area").on("blur", "span.luckysheet-sheets-item-name", function (e) { if(Store.allowEdit===false){ return; diff --git a/src/core.js b/src/core.js index ebfa392..9ec44a4 100644 --- a/src/core.js +++ b/src/core.js @@ -74,6 +74,8 @@ luckysheet.create = function (setting) { Store.fullscreenmode = extendsetting.fullscreenmode; Store.lang = extendsetting.lang; //language Store.allowEdit = extendsetting.allowEdit; + Store.limitSheetNameLength = extendsetting.limitSheetNameLength; + Store.defaultSheetNameMaxLength = extendsetting.defaultSheetNameMaxLength; Store.fontList = extendsetting.fontList; server.gridKey = extendsetting.gridKey; server.loadUrl = extendsetting.loadUrl; diff --git a/src/css/luckysheet-core.css b/src/css/luckysheet-core.css index 7877f3e..5c7ad45 100644 --- a/src/css/luckysheet-core.css +++ b/src/css/luckysheet-core.css @@ -2329,8 +2329,14 @@ body:not(.ewa-ipad) .luckysheet-rows-h-cell-sel:hover { padding-right: 10px; padding-left: 12px; } - - +#luckysheet-sheet-list .luckysheet-cols-menuitem .luckysheet-cols-menuitem-content { + padding-right: 0px; + max-width: 430px; + min-width: 100px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} .luckysheet-filter-menu div.luckysheet-cols-menuitem { padding-top: 0px; padding-bottom: 0px; @@ -2978,6 +2984,14 @@ fieldset[disabled] .btn-danger.focus { #luckysheet-sheet-list .luckysheet-cols-menuitem .luckysheet-cols-menuitem-content { padding-left: 5px; } +/* +#luckysheet-sheet-list .luckysheet-cols-menuitem .luckysheet-cols-menuitem-content { + max-width: 420px; + min-width: 190px; + overflow: hidden; + text-overflow: ellipsis; + white-space: nowrap; +} */ #luckysheet-sheet-list .icon {