diff --git a/README-zh.md b/README-zh.md index 0f80f88..bd8d141 100644 --- a/README-zh.md +++ b/README-zh.md @@ -21,10 +21,6 @@ - excel导入导出库: [Luckyexcel](https://github.com/mengshukeji/Luckyexcel) - 图表插件: [chartMix](https://github.com/mengshukeji/chartMix) -## 支持 -Luckysheet是MIT许可的开源项目，其持续的开发完全有赖于许多出色支持者的支持。如果您想加入他们，请考虑： -- [kickstarter](https://www.kickstarter.com/projects/luckysheet/luckysheet) - ## 特性 ### 🛠️格式设置 @@ -206,6 +202,16 @@ npm run build - [@gsw945](https://github.com/gsw945) - [@swen-xiong](https://github.com/swen-xiong) +## 捐赠 + +如果你感觉这个项目对你有用或者有所启发，可以请作者喝杯果汁： + +| 微信 | 支付宝 | +|---|---| +| | | + +[Paypal Me](https://www.paypal.me/wbfsa) + ## 版权信息 [MIT](http://opensource.org/licenses/MIT) diff --git a/README.md b/README.md index 3090b52..d8d9799 100644 --- a/README.md +++ b/README.md @@ -27,10 +27,6 @@ English| [简体中文](./README-zh.md) - Excel import and export library: [Luckyexcel](https://github.com/mengshukeji/Luckyexcel) - Chart plugin: [chartMix](https://github.com/mengshukeji/chartMix) -## Support -Luckysheet is an MIT-licensed open source project with its ongoing development made possible entirely by the support of many awesome backers. If you'd like to join them, please consider: -- [kickstarter](https://www.kickstarter.com/projects/luckysheet/luckysheet) - ## Features ### 🛠️Formatting @@ -203,6 +199,17 @@ Create a table - [@gsw945](https://github.com/gsw945) - [@swen-xiong](https://github.com/swen-xiong) +## Donate + +If you find this project useful, you can buy author a glass of juice: + +| WeChat | Alipay | +|---|---| +| | | + +[Paypal Me](https://www.paypal.me/wbfsa) + + ## License [MIT](http://opensource.org/licenses/MIT) diff --git a/docs/guide/FAQ.md b/docs/guide/FAQ.md index 7e7ba8e..475bf99 100644 --- a/docs/guide/FAQ.md +++ b/docs/guide/FAQ.md @@ -42,6 +42,7 @@ luckysheet.buildGridData(luckysheetfile) ## **Q** Is the remote loading data loadUrl or updateUrl? **A**: [loadUrl](/zh/guide/config.html#loadurl). Configure loadUrl, Luckysheet will request the entire table data through ajax, and updateUrl will be used as the interface address for collaborative editing in real-time saving. +Note: Initial data needs to be configured with loadUrl and loadSheetUrl parameters, while for collaborative editing, in addition to the configuration of loadUrl and loadSheetUrl, updateUrl and allowUpdate must be configured to take effect. ------------ diff --git a/docs/guide/config.md b/docs/guide/config.md index c1622da..97d1e6b 100644 --- a/docs/guide/config.md +++ b/docs/guide/config.md @@ -1,200 +1,935 @@ -# Basic Configuration - -## container +# Overall configuration + +## Basic Structure + +When initializing the workbook, you can set an object configuration string ʻoptions` to customize the configuration of Luckysheet. + +The following is a simple configuration example: + +```js +// Configuration item +const options = { + container:'luckysheet', // set the id of the DOM container + title:'Luckysheet Demo', // set the name of the table + lang:'zh' // set language + + // More other settings... +} + +// Initialize the table +luckysheet.create(options) +``` + +The `options` configuration item here will affect the entire workbook. In particular, the configuration of a single worksheet needs to be set in the `options.data` array to set corresponding more detailed parameters. Refer to [Worksheet Configuration](/zh/guide/sheet.html) + +For personalized needs, in addition to allowing configuration information bar ([showinfobar](#showinfobar)), toolbar ([showtoolbar](#showtoolbar)), bottom sheet bar ([showsheetbar](#showsheetbar)), bottom count bar ([ShowstatisticBar](#showstatisticBar)), +Luckysheet has opened more detailed custom configuration options, which are as follows: + +- Customize the toolbar ([showtoolbarConfig](#showtoolbarConfig)) +- Customize the bottom sheet bar ([showsheetbarConfig](#showsheetbarConfig)) +- Customize the counting bar ([showstatisticBarConfig](#showstatisticBarConfig)) +- Custom add row and back to the top ([sheetBottomConfig](#sheetBottomConfig)) +- Custom cell right-click menu ([cellRightClickConfig](#cellRightClickConfig)) +- Customize the right-click menu of the bottom sheet bar ([sheetRightClickConfig](#sheetRightClickConfig)) + +## Configuration item + +The following are all supported setting parameters + +- Container ID [container](#container) +- Workbook name [title](#title) +- Language [lang](#lang) +- Unique key [gridKey](#gridKey) +- Load the entire workbook [loadUrl](#loadUrl) +- Load other worksheet celldata [loadSheetUrl](#loadSheetUrl) +- Allow updates [allowUpdate](#allowUpdate) +- Update address [updateUrl](#updateUrl) +- Thumbnail update address [updateImageUrl](#updateImageUrl) +- Worksheet configuration [data](#data) +- Plugins [plugins](#plugins) +- Number of columns [column](#column) +- Number of rows [row](#row) +- Billion format [autoFormatw](#autoFormatw) +- Accuracy [accuracy](#accuracy) +- Allow copying [allowCopy](#allowCopy) +- Grid Lines [showGridLines](#showGridLines) +- Toolbar [showtoolbar](#showtoolbar) +- Customize Toolbar [showtoolbarConfig](#showtoolbarConfig) +- Information bar [showinfobar](#showinfobar) +- Bottom sheet bar [showsheetbar](#showsheetbar) +- Customize the bottom sheet bar [showsheetbarConfig](#showsheetbarConfig) +- The bottom count bar [showstatisticBar](#showstatisticBar) +- Custom Count Bar [showstatisticBarConfig](#showstatisticBarConfig) +- Custom add row and back to top [sheetBottomConfig](#sheetBottomConfig) +- Allow editing [allowEdit](#allowEdit) +- Allow adding rows [enableAddRow](#enableAddRow) +- Allow adding columns [enableAddCol](#enableAddCol) +- User Info [userInfo](#userInfo) +- User Information Menu [userMenuItem](#userMenuItem) +- Back button link [myFolderUrl](#myFolderUrl) +- Ratio [devicePixelRatio](#devicePixelRatio) +- Function Button [functionButton](#functionButton) +- Auto-indent interface [showConfigWindowResize](#showConfigWindowResize) +- Load the next page [enablePage](#enablePage) +- Refresh formula [forceCalculation](#forceCalculation) +- Custom cell right-click menu [cellRightClickConfig](#cellRightClickConfig) +- Customize the right-click menu of the bottom sheet bar [sheetRightClickConfig](#sheetRightClickConfig) + +### container - Type: String - Default: "luckysheet" - Usage: Container ID ------------ -## title +### title - Type: String - Default: "Luckysheet Demo" -- Usage: Table's name +- Usage：Workbook name ------------ -## lang +### lang - Type: String - Default: "en" -- Usage: Internationalization settings, allowing to set the language of the table, temporarily supporting Chinese ("zh") and English ("en") +- Usage: Internationalization settings, allowing to set the language of the workbook, supporting Chinese ("zh") and English ("en") ------------ -## gridKey +### gridKey - Type: String - Default: "" -- Usage: Form unique identifier +- Usage: Workbook unique identifier ------------ -## column -- Type: Number -- Default: 60 -- Usage: The default number of columns in an empty table +### loadUrl +- Type: String +- Default: "" +- Usage: Configure the address of `loadUrl` and use it in conjunction with `loadSheetUrl`, which is generally used when the amount of data is large. You can also not use the interface parameters provided by Luckysheet, and use the [data](#data) parameter to prepare all table data for initialization in advance. + + Luckysheet will request the entire workbook data through ajax, and load all `celldata` in the worksheet data with status 1 by default, and load all the fields except the `celldata` field in the rest of the worksheets. However, considering that some formulas, charts and pivot tables will reference data from other worksheets, the front end will add a judgment. If the current worksheet references data from other worksheets, it will request data through the interface address configured by `loadSheetUrl` , And load the data of the related worksheets. Because `loadUrl` is only responsible for the current worksheet data, it is also necessary to configure `loadSheetUrl` as an interface for asynchronously loading data. ------------ -## row -- Type: Number -- Default: 84 -- Usage: The default number of rows in an empty table +### loadSheetUrl +- Type: String +- Default: "" +- Usage: Configure the address of `loadSheetUrl`, the parameters are `gridKey` (workbook primary key) and `index` (worksheet primary key collection, the format is `["sheet_01","sheet_02","sheet_03"]`), the returned data is the `celldata` field data collection of the worksheet. In order to load performance considerations, except for the first load of the celldata data of the current worksheet, the data of the other worksheets will be requested only when the worksheet is switched to that worksheet. ------------ -## data +### allowUpdate +- Type: Boolean +- Default: false +- Usage: Whether to allow back-end update after operating the table, used in conjunction with `updateUrl` + +------------ +### updateUrl +- Type: String +- Default: "" +- Usage: The back-end update address after operating the workbook will be valid only when `allowUpdate` is `true`. This interface is also the interface address for shared editing. + +Note that you also need to configure `loadUrl` and `loadSheetUrl` to take effect. + +------------ +### updateImageUrl +- Type: String +- Default: "" +- Usage: Update address of thumbnail + +------------ +### data - Type: Array - Default: [{ "name": "Sheet1", color: "", "status": "1", "order": "0", "data": [], "config": {}, "index":0 }, { "name": "Sheet2", color: "", "status": "0", "order": "1", "data": [], "config": {}, "index":1 }, { "name": "Sheet3", color: "", "status": "0", "order": "2", "data": [], "config": {}, "index":2 }] -- Usage: Client sheet data `[shee1, sheet2, sheet3]` +- Usage: When `loadUrl` and `loadSheetUrl` are not configured, you need to manually configure all the sheet data passed to the entire client `[shee1, sheet2, sheet3]`. For detailed parameter settings, please refer to [worksheet configuration](/zh/guide/sheet.html) ------------ -## plugins +### plugins - Type: Array - Default: [] -- Usage: Plug-in configuration, support chart: "chart" +- Usage: Configure plug-in, support chart: "chart" + +------------ +### column +- Type: Number +- Default: 60 +- Usage: The default number of columns in an empty workbook ------------ -## autoFormatw +### row +- Type: Number +- Default: 84 +- Usage: The default number of rows in an empty workbook + +------------ +### autoFormatw - Type: Boolean - Default: false -- Usage: Automatically format numbers with more than 4 digits as 'billion format', for example: true or "true" or "TRUE" +- Usage: Automatically format numbers with more than 4 digits into "billion format", for example: true or "true" or "TRUE" ------------ -## accuracy +### accuracy - Type: Number - Default: undefined -- Usage: Set the accuracy,the number of digits after the decimal point. Pass the parameter as a number or numeric string, for example: "0" or 0 +- Usage: Set the precision, the number of digits after the decimal point. The parameter is a number or a string of numbers, for example: "0" or 0 ------------ -## allowCopy +### allowCopy - Type: Boolean - Default: true -- Usage: Whether to allow copying +- Usage: Whether to allow copy ------------ -## showGridLines +### showGridLines - Type: Number - Default: 1 -- Usage: Whether to show grid lines, `1` means show，`0` means hide +- Usage: Whether to display grid lines, `1` means display, `0` means hidden ------------ -## showtoolbar +### showtoolbar - Type: Boolean - Default: true -- Usage: Whether to display the toolbar in the second row - ------------- -## showinfobar +- Usage: Whether to show the toolbar + +------------ +### showtoolbarConfig + +[todo] + +- Type: Object +- Default: {} +- Usage: Custom configuration toolbar +- Format: + ```json + { + undoRedo: false, //Undo redo + paintFormat: false, //Format brush + currencyFormat: false, //currency format + percentageFormat: false, //Percentage format + numberDecrease: false, //'Decrease the number of decimal places' + numberIncrease: false, //'Increase the number of decimal places + moreFormats: false, //'More Formats' + font: false, //'font' + fontSize: false, //'Font size' + bold: false, //'Bold (Ctrl+B)' + italic: false, //'Italic (Ctrl+I)' + strikethrough: false, //'Strikethrough (Alt+Shift+5)' + textColor: false, //'Text color' + fillColor: false, //'Cell color' + border: false, //'border' + mergeCell: false, //'Merge cells' + horizontalAlignMode: false, //'Horizontal alignment' + verticalAlignMode: false, //'Vertical alignment' + textWrapMode: false, //'Wrap mode' + textRotateMode: false, //'Text Rotation Mode' + frozenMode: false, //'freeze mode' + sort: false, //'sort' + filter: false, //'filter' + findAndReplace: false, //'Find and Replace' + function: false, //'formula' + conditionalFormat: false, //'Conditional Format' + postil: false, //'comment' + pivotTable: false, //'PivotTable' + chart: false, //'chart' (the icon is hidden, but if the chart plugin is configured, you can still create a new chart by right click) + screenshot: false, //'screenshot' + splitColumn: false, //'Split column' + } + ``` + +------------ +### showinfobar - Type: Boolean - Default: true -- Usage: Whether to display the top name bar +- Usage: Whether to show the top information bar ------------ -## showsheetbar +### showsheetbar - Type: Boolean - Default: true -- Usage: Whether to display the bottom table name area +- Usage: Whether to show the bottom sheet button ------------ -## showstatisticBar +### showsheetbarConfig + +[todo] + +- Type: Object +- Default: {} +- Usage: Custom configuration bottom sheet button +- 格式： + ```json + { + add: false, //Add worksheet + menu: false, //Worksheet management menu + sheet: false //Worksheet display + } + ``` + +------------ +### showstatisticBar - Type: Boolean - Default: true -- Usage: Whether to display the bottom count bar +- Usage: Whether to show the bottom count bar + +------------ +### showstatisticBarConfig + +[todo] + +- Type: Object +- Default: {} +- Usage: Customize the bottom count bar +- 格式： + ```json + { + count: false, // Count bar + zoom: false // Zoom + } + +------------ +### sheetBottomConfig + +[todo] + +- Type: Object +- Default: {} +- Usage: Add row button and back to top button configuration below the worksheet +- 格式： + ```json + { + addRow: false, // Add row button + backTop: false // Back to the top + } ------------ -## allowEdit +### allowEdit - Type: Boolean - Default: true -- Usage: Whether to allow frontend editing +- Usage: Whether to allow front-end editing ------------ -## enableAddRow +### enableAddRow - Type: Boolean - Default: true -- Usage: Allow add line +- Usage: Allow additional rows ------------ -## enableAddCol +### enableAddCol - Type: Boolean - Default: true -- Usage: Allow add column +- Usage: Allow adding columns ------------ -## userInfo +### userInfo - Type: String - Default: `' rabbit'` - Usage: User information display style in the upper right corner ------------ -## userMenuItem +### userMenuItem - Type: Array -- Default: `[{url:"www.baidu.com", "icon":'', "name":"My Table"}, {url:"www.baidu.com", "icon":'', "name":"Sign Out"}]` -- Usage: The menu, which popped up by clicking the user information in the upper right corner +- Default: `[{url:"www.baidu.com", "icon":'', "name":"我的表格"}, {url:"www.baidu.com", "icon":'', "name":"退出登陆"}]` +- Usage: Click the pop-up menu of user information in the upper right corner ------------ -## myFolderUrl +### myFolderUrl - Type: String - Default: "www.baidu.com" -- Usage: Back button link in the upper left corner +- Usage: The link of the `<` back button in the upper left corner ------------ -## devicePixelRatio +### devicePixelRatio - Type: Number - Default: window.devicePixelRatio -- Usage: Device Pixel Ratio, the larger the ratio, the higher the table resolution +- Usage: Device ratio, the larger the ratio, the higher the resolution of the workbook ------------ -## allowUpdate +### functionButton +- Type: String +- Default: "" +- Usage: Function buttons in the upper right corner, for example:`' '` + +------------ +### showConfigWindowResize +- Type: Boolean +- Default: true +- Usage: The configuration of the chart or pivot table will pop up on the right, set whether the workbook will be automatically indented after popping up + +------------ +### enablePage - Type: Boolean - Default: false -- Usage: Whether to allow back-end update after operating the table, used in conjunction with `updateUrl` +- Usage: Allow to load next page ------------ -## loadUrl -- Type: String -- Default: "" -- Usage: Configure the address of `loadUrl`, Luckysheet will request the table data through ajax. By default, all `data` in the sheet data with status 1 is loaded, and the rest of the sheet loads all fields except the `data` field. +### forceCalculation +- Type: Boolean +- Default: false +- Usage: Force refresh formula. + + By default, in order to improve loading performance, when the table is initialized, cells containing formulas will directly obtain `v` and `m` as data results by default without real-time calculation. + + If the data of the cell associated with the formula has changed, or the result of the cell data where the formula is located has changed, it will cause the calculated result of the associated cell to be inconsistent with the actual displayed result. This requires the formula refresh to be turned on to ensure the data The accuracy of real-time calculations. + + ⚠️Reminder, there will be performance problems when there are more formulas, use it with caution! ------------ -## loadSheetUrl -- Type: String -- Default: "" -- Usage: Configure the address of `loadSheetUrl`, the parameters are `gridKey` (table primary key) and `index` (sheet primary key collection, format is `[1,2,3]`), the returned data is the `data` field set of sheet +### cellRightClickConfig + +[todo] + +- Type: Object +- Default: {} +- Usage: Custom configuration cell right-click menu +- 格式： + ```json + { + copy: false, //Copy + copyAs: false, //Copy as + paste: false, //Paste + insert: false, //Insert + delete: false, //Delete + hide: false, //Hide + deleteCell: false, //Delete cell + clear: false, //Clear content + matrix: false, //Matrix operation selection + sort: false, //Sort selection + filter: false, //Filter selection + chart: false //Chart generation + } ------------ -## updateUrl -- Type: String -- Default: "" -- Usage: The back-end update address after operating the table will only be effective when `allowUpdate` is `true` +### sheetRightClickConfig + +[todo] + +- Type: Object +- Default: {} +- Usage: Customize the right-click menu of the bottom sheet bar +- 格式： + ```json + { + delete: false, //Delete + copy: false, //Copy + rename: false, //Rename + color: false, //Change color + hide: false, //Hide + show: false, //Unhide + left: false, //Move to the left + right: false //Move to the right + } ------------ -## updateImageUrl -- Type: String -- Default: "" -- Usage: Update URL of thumbnail + +## 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. + +The hook functions are uniformly configured under ʻoptions.hook`, and configuration hooks can be created separately for cells, sheet pages, and tables. + +## Cell + +### cellRenderAfter +- Type: Function +- Default: null +- Usage: Triggered after the cell rendering ends +- Parameter: + - {Number} [r]: Row number of cell + - {Number} [c]: Column number of cell + - {Object} [v]: Cell object ------------ -## functionButton -- Type: String -- Default: "" -- Usage: Function buttons in the upper right corner, for example`' '` +### cellHover +- Type: Function +- Default: null +- Usage: Triggered when the mouse moves over the cell (hover) +- Parameter: + - {Number} [r]: Row number of cell + - {Number} [c]: Column number of cell + - {Object} [v]: Cell object ------------ -## showConfigWindowResize -- Type: Boolean -- Default: true -- Usage: The configuration of the chart or pivot table will pop up on the right. Set whether the table will be automatically indented after popping up +### cellEditBefore +- Type: Function +- Default: null +- Usage: Triggered after double-clicking the cell, that is, when double-clicking the cell to edit the content, this method is triggered first +- Parameter: + - {Number} [r]: Row number of cell + - {Number} [c]: Column number of cell + - {Object} [v]: Cell object ------------ -## enablePage -- Type: Boolean -- Default: false -- Usage: Allow next page to load +### cellEditAfter +- Type: Function +- Default: null +- Usage: Triggered after double-clicking the cell, that is, when double-clicking the cell to edit the content, this method is finally triggered +- Parameter: + - {Number} [r]: Row number of cell + - {Number} [c]: Column number of cell + - {Object} [oldV]: Cell object before Modified + - {Object} [newV]: Cell object after Modified + +------------ +### fireMousedown +- Type: Function +- Default: null +- Usage: Customized method of drilling down cell data + +------------ + +## Selected area + +### rangeSelectBefore +- Type: Function +- Default: null +- Usage: Frame selection or trigger before setting selection +- Parameter: + - {Object || Array} [range]: Selection area, may be multiple selection areas + +------------ +### rangeSelectAfter +- Type: Function +- Default: null +- Usage: Frame selection or trigger after setting selection +- Parameter: + - {Object || Array} [range]: Selection area, may be multiple selection areas + +------------ +### rangeMoveBefore +- Type: Function +- Default: null +- Usage: Before moving the selection, include a single cell +- Parameter: + - {Array} [range]: The current selection area, can only be a single selection area + +------------ +### rangeMoveAfter +- Type: Function +- Default: null +- Usage: After moving the selection, include a single cell +- Parameter: + - {Array} [oldRange]: The current selection range before moving, can only be a single selection + - {Array} [newRange]: The current selection range after moving, can only be a single selection + +------------ +### rangeEditBefore +- Type: Function +- Default: null +- Usage: Before the selection +- Parameter: + - {Object || Array} [range]: Selection area, may be multiple selection areas + - {Object} [data]: Data corresponding to the selection area + +------------ +### rangeEditAfter +- Type: Function +- Default: null +- Usage: After the selection is modified +- Parameter: + - {Object || Array} [range]: Selection area, may be multiple selection areas + - {Object} [oldData]: Before modification, the data corresponding to the selection area + - {Object} [newData]: After modification, the data corresponding to the selection area + +------------ +### rangeCopyBefore +- Type: Function +- Default: null +- Usage: Before copying selection +- Parameter: + - {Object || Array} [range]: Selection area, may be multiple selection areas + - {Object} [data]: Data corresponding to the selection area + +------------ +### rangeCopyAfter +- Type: Function +- Default: null +- Usage: After copying selection +- Parameter: + - {Object || Array} [range]: Selection area, may be multiple selection areas + - {Object} [data]: Data corresponding to the selection area ------------ -## beforeCreateDom +### rangePasteBefore - Type: Function - Default: null -- Usage: Custom method before table creation +- Usage: Before pasting the selection +- Parameter: + - {Object || Array} [range]: Selection area, may be multiple selection areas + - {Object} [data]: The data corresponding to the selection area to be pasted ------------ -## fireMousedown +### rangePasteAfter - Type: Function - Default: null -- Usage: Custom method for drilling down cell data +- Usage: After pasting the selection +- Parameter: + - {Object || Array} [range]: Selection area, may be multiple selection areas + - {Object} [originData]: The data corresponding to the selection area to be pasted + - {Object} [pasteData]: Data to paste +------------ +### rangeCutBefore +- Type: Function +- Default: null +- Usage: Before selection cut +- Parameter: + - {Array} [range]: Selection range, can only be a single range + - {Object} [data]: The data corresponding to the selection area to be cut + +------------ +### rangeCutAfter +- Type: Function +- Default: null +- Usage: After selection cut +- Parameter: + - {Array} [range]: Selection range, can only be a single range + - {Object} [data]: The data corresponding to the selection area to be cut + +------------ +### rangeDeleteBefore +- Type: Function +- Default: null +- Usage: Before the selection is deleted +- Parameter: + - {Array} [range]: Selection range, can only be a single range + - {Object} [data]: The data corresponding to the selection area to be deleted + +------------ +### rangeDeleteAfter +- Type: Function +- Default: null +- Usage: After the selection is deleted +- Parameter: + - {Array} [range]: Selection range, can only be a single range + - {Object} [data]: The data corresponding to the selection area to be deleted + +------------ +### rangeClearBefore +- Type: Function +- Default: null +- Usage: Before the selection is cleared +- Parameter: + - {Object || Array} [range]: Selection area, may be multiple selection areas + - {Object} [data]: The data corresponding to the selection area to be cleared + +------------ +### rangeClearAfter +- Type: Function +- Default: null +- Usage: After the selection is cleared +- Parameter: + - {Object || Array} [range]: Selection area, may be multiple selection areas + - {Object} [data]: The data corresponding to the selection area to be cleared + +------------ +### rangePullBefore +- Type: Function +- Default: null +- Usage: Before selection drop down +- Parameter: + - {Array} [range]: The current selection range, can only be a single range + +------------ +### rangePullAfter +- Type: Function +- Default: null +- Usage: After selection drop down +- Parameter: + - {Array} [range]: The selection range after the drop-down can only be a single range + +------------ + +## Worksheet + +### sheetCreatekBefore +- Type: Function +- Default: null +- Usage: Triggered before the worksheet is created, the new worksheet also includes the new pivot table + +------------ +### sheetCreateAfter +- Type: Function +- Default: null +- Usage: Triggered after the worksheet is created, the new worksheet also includes the new pivot table +- Parameter: + - {Object} [sheet]: The configuration of the newly created worksheet + +------------ +### sheetMoveBefore +- Type: Function +- Default: null +- Usage: Before the worksheet is moved +- Parameter: + - {Number} [i]: `index` of current worksheet + - {Number} [order]: `Order` of current worksheet + +------------ +### sheetMoveAfter +- Type: Function +- Default: null +- Usage: After the worksheet is moved +- Parameter: + - {Number} [i]: `index` of current worksheet + - {Number} [oldOrder]: Before modification, the `order` of the current worksheet + - {Number} [newOrder]: After modification, the `order` of the current worksheet + +------------ +### sheetDeleteBefore +- Type: Function +- Default: null +- Usage: Before the worksheet is deleted +- Parameter: + - {Object} [sheet]: Configuration of the worksheet to be deleted + +------------ +### sheetDeleteAfter +- Type: Function +- Default: null +- Usage: After the worksheet is deleted +- Parameter: + - {Object} [sheet]: Configuration of deleted worksheet + +------------ +### sheetEditNameBefore +- Type: Function +- Default: null +- Usage: Before changing the name of the worksheet +- Parameter: + - {Number} [i]: `index` of current worksheet + - {String} [name]: Current worksheet name + +------------ +### sheetEditNameAfter +- Type: Function +- Default: null +- Usage: After changing the name of the worksheet +- Parameter: + - {Number} [i]: `index` of current worksheet + - {String} [oldName]: Before modification, the current worksheet name + - {String} [newName]: After modification, the current worksheet name + +------------ +### sheetEditColorBefore +- Type: Function +- Default: null +- Usage: Before changing the color of the worksheet +- Parameter: + - {Number} [i]: `index` of current worksheet + - {String} [color]: Current worksheet color + +------------ +### sheetEditColorAfter +- Type: Function +- Default: null +- Usage: After changing the color of the worksheet +- Parameter: + - {Number} [i]: `index` of current worksheet + - {String} [oldColor]: Before modification, the current worksheet color + - {String} [newColor]: After modification, the current worksheet color + +------------ + +## Workbook + +### workbookCreateBefore +- Type: Function +- Default: null +- Usage: Triggered before the worksheet is created. The old hook function is called `beforeCreateDom` +- Parameter: + - {Object} [book]:Configuration of the entire workbook (options) + +------------ +### workbookCreateAfter +- Type: Function +- Default: null +- Usage: Triggered after the workbook is created +- Parameter: + - {Object} [book]:Configuration of the entire workbook (options) + +------------ +### workbookDestroyBefore +- Type: Function +- Default: null +- Usage: Triggered before the workbook is destroyed +- Parameter: + - {Object} [book]:Configuration of the entire workbook (options) + +------------ +### workbookDestroyAfter +- Type: Function +- Default: null +- Usage: Triggered after the workbook is destroyed +- Parameter: + - {Object} [book]:Configuration of the entire workbook (options) + +------------ +### updated +- Type: Function +- Default: null +- Usage: The method executed after each operation is updated is executed after the canvas rendering, that is, every time the client performs a workbook operation, Luckysheet saves the operation in the history and triggers it. When undoing and redoing, it is also an operation, of course, the hook function will be triggered. +- Parameter: + - {Object} [operate]: The history information of this operation will have different history records according to different operations. Refer to the source code [History](https://github.com/mengshukeji/Luckysheet/blob/master/src/controllers/controlHistory.js ) + +------------ +### resized +- Type: Function +- Default: null +- Usage: After resize is executed +- Parameter: + - {Object} [size]: The width and height of the entire workbook area + +------------ + +## Image + +### imageInsertBefore +- Type: Function +- Default: null +- Usage: Before the picture is inserted +- Parameter: + - {Object} [url]: Picture address + +------------ +### imageInsertAfter +- Type: Function +- Default: null +- Usage: After the picture is inserted +- Parameter: + - {Object} [item]]: Picture address, width and height, location and other information + +------------ +### imageUpdateBefore +- Type: Function +- Default: null +- Usage: Before the picture is modified, the modified content includes operations such as width and height, position, and cropping +- Parameter: + - {Object} [item]]: Picture address, width and height, location and other information + +------------ +### imageUpdateAfter +- Type: Function +- Default: null +- Usage: After the picture is modified, the modified content includes operations such as width and height, position, and cropping +- Parameter: + - {Object} [oldItem]]: Before modification, the picture address, width and height, location and other information + - {Object} [newItem]]: After modification, the picture address, width and height, location and other information + +------------ +### imageDeleteBefore +- Type: Function +- Default: null +- Usage: Before the picture is deleted +- Parameter: + - {Object} [item]]: Picture address, width and height, location and other information + +------------ +### imageDeleteAfter +- Type: Function +- Default: null +- Usage: After the picture is deleted +- Parameter: + - {Object} [item]]: Picture address, width and height, location and other information + +------------ + +## Comment + +### commentInsertBefore +- Type: Function +- Default: null +- Usage: Before inserting comments +- Parameter: + - {Object} [cell]: The cell information of the comment to be inserted, such as:`{ r:0,c:2,v:{m:'233',v:'233'}}` + +------------ +### commentInsertAfter +- Type: Function +- Default: null +- Usage: After inserting comments +- Parameter: + - {Object} [cell]: The cell information where the comment is inserted, such as:`{ r:0,c:2,v:{m:'233',v:'233'}}`, contains comment information + +------------ +### commentDeleteBefore +- Type: Function +- Default: null +- Usage: Before deleting comments +- Parameter: + - {Object} [cell]: The cell information of the comment to be deleted, such as:`{ r:0,c:2,v:{m:'233',v:'233'}}` + +------------ +### commentDeleteAfter +- Type: Function +- Default: null +- Usage: After deleting the comment +- Parameter: + - {Object} [cell]: The cell information of the deleted comment, such as:`{ r:0,c:2,v:{m:'233',v:'233'}}` + +------------ +### commentUpdateBefore +- Type: Function +- Default: null +- Usage: Before modifying comments +- Parameter: + - {Object} [cell]: The cell information of the comment, such as:`{ r:0,c:2,v:{m:'233',v:'233'}}` + +------------ +### commentUpdateAfter +- Type: Function +- Default: null +- Usage: After modifying the comment +- Parameter: + - {Object} [oldCell]: Before modification, the cell information where the comment is located, such as:`{ r:0,c:2,v:{m:'233',v:'233'}}` + - {Object} [newCell]: After modification, the cell information where the comment is located, such as:`{ r:0,c:2,v:{m:'233',v:'233'}}` + +------------ + +## Pivot table + +### pivotTableEditBefore +- Type: Function +- Default: null +- Usage: Before modifying the PivotTable, operations such as dragging fields, etc. +- Parameter: + - {Object} [sheet]: Worksheet configuration where the pivot table is located + +------------ +### pivotTableEditAfter +- Type: Function +- Default: null +- Usage: After modifying the PivotTable, operations such as dragging fields, etc. +- Parameter: + - {Object} [oldSheet]: Before modification, the worksheet configuration where the pivot table is located + - {Object} [newSheet]: After modification, the worksheet configuration where the pivot table is located + +------------ + +## Freeze + +### frozenCreateBefore +- Type: Function +- Default: null +- Usage: Before setting freeze +- Parameter: + - {Object} [frozen]: Freeze type information + +------------ +### frozenCreateAfter +- Type: Function +- Default: null +- Usage: After setting freeze +- Parameter: + - {Object} [frozen]: Freeze type information + +------------ +### frozenCancelBefore +- Type: Function +- Default: null +- Usage: Before unfreezing +- Parameter: + - {Object} [frozen]: Freeze type information + +------------ +### frozenCancelAfter +- Type: Function +- Default: null +- Usage: After unfreezing +- Parameter: + - {Object} [frozen]: Freeze type information + ------------ \ No newline at end of file diff --git a/docs/zh/guide/FAQ.md b/docs/zh/guide/FAQ.md index d28f312..6ae06b1 100644 --- a/docs/zh/guide/FAQ.md +++ b/docs/zh/guide/FAQ.md @@ -42,6 +42,7 @@ luckysheet.buildGridData(luckysheetfile) ## **Q** 远端加载数据是loadUrl还是updateUrl？ **A** : [loadUrl](/zh/guide/config.html#loadurl)。配置了loadUrl，Luckysheet会通过ajax请求整个表格数据，而updateUrl会作为协同编辑实时保存的接口地址。 +注意：初始化数据需要配置loadUrl和loadSheetUrl参数，而协同编辑则在配置loadUrl和loadSheetUrl的基础上，还要配置updateUrl和allowUpdate才能生效。 ------------ diff --git a/docs/zh/guide/config.md b/docs/zh/guide/config.md index 3b3d52c..dfa3bdb 100644 --- a/docs/zh/guide/config.md +++ b/docs/zh/guide/config.md @@ -22,7 +22,7 @@ luckysheet.create(options) 这里的`options`配置项会作用于整个表格，特别的，单个sheet的配置则需要在`options.data`数组中，分别设置对应更详细的参数，参考[工作表配置](/zh/guide/sheet.html) -针对个性化的需求，除了允许配置名称栏（[showinfobar](#showinfobar)）、工具栏（[showtoolbar](#showtoolbar)）、底部sheet页（[showsheetbar](#showsheetbar)）、底部计数栏（[showstatisticBar](#showstatisticBar)）之外， +针对个性化的需求，除了允许配置信息栏（[showinfobar](#showinfobar)）、工具栏（[showtoolbar](#showtoolbar)）、底部sheet页（[showsheetbar](#showsheetbar)）、底部计数栏（[showstatisticBar](#showstatisticBar)）之外， Luckysheet开放了更细致的自定义配置选项，分别有 - 自定义工具栏（[showtoolbarConfig](#showtoolbarConfig)） @@ -30,7 +30,7 @@ Luckysheet开放了更细致的自定义配置选项，分别有 - 自定义计数栏（[showstatisticBarConfig](#showstatisticBarConfig)） - 自定义添加行和回到顶部（[sheetBottomConfig](#sheetBottomConfig)） - 自定义单元格右键菜单（[cellRightClickConfig](#cellRightClickConfig)） -- 自定义sheet页右击菜单（[sheetRightClickConfig](#sheetRightClickConfig)） +- 自定义底部sheet页右击菜单（[sheetRightClickConfig](#sheetRightClickConfig)） ## 配置项 @@ -56,7 +56,7 @@ Luckysheet开放了更细致的自定义配置选项，分别有 - 网格线 [showGridLines](#showGridLines) - 工具栏 [showtoolbar](#showtoolbar) - 自定义工具栏[showtoolbarConfig](#showtoolbarConfig) -- 名称栏 [showinfobar](#showinfobar) +- 信息栏 [showinfobar](#showinfobar) - 底部sheet页 [showsheetbar](#showsheetbar) - 自定义底部sheet页 [showsheetbarConfig](#showsheetbarConfig) - 底部计数栏 [showstatisticBar](#showstatisticBar) @@ -103,13 +103,15 @@ Luckysheet开放了更细致的自定义配置选项，分别有 ### loadUrl - 类型：String - 默认值："" -- 作用：配置`loadUrl`的地址，Luckysheet会通过ajax请求整个表格数据，默认载入status为1的sheet数据中的所有`celldata`，其余的sheet载入除`celldata`字段外的所有字段。但是考虑到一些公式、图表及数据透视表会引用其他sheet的数据，所以前台会加一个判断，如果该当前sheet引用了其他sheet的数据则把引用到的sheet的数据一并补全。 +- 作用：配置`loadUrl`的地址，与`loadSheetUrl`配合使用，一般用于大数据量的时候。也可以不用Luckysheet提供的接口参数，使用[data](#data)参数可以提前准备好所有表格数据用于初始化。 + + Luckysheet会通过ajax请求整个表格数据，默认载入status为1的sheet数据中的所有`celldata`，其余的sheet载入除`celldata`字段外的所有字段。但是考虑到一些公式、图表及数据透视表会引用其他sheet的数据，所以前台会加一个判断，如果该当前sheet引用了其他sheet的数据则会通过`loadSheetUrl`配置的接口地址请求数据，把引用到的sheet的数据一并补全。因为 `loadUrl`只负责当前页数据，所以还需要配置`loadSheetUrl`作为异步加载数据的接口。 ------------ ### loadSheetUrl - 类型：String - 默认值："" -- 作用：配置`loadSheetUrl`的地址，参数为`gridKey`（表格主键） 和 `index`（sheet主键合集，格式为`[1,2,3]`），返回的数据为sheet的`celldata`字段数据集合 +- 作用：配置`loadSheetUrl`的地址，参数为`gridKey`（表格主键） 和 `index`（sheet主键合集，格式为`["sheet_01","sheet_02","sheet_0"]`），返回的数据为sheet的`celldata`字段数据集合。为了加载性能考虑，除了第一次加载当前页的`celldata`数据之外，其余sheet的数据，是在切换到那个sheet页的时候，才会请求那一页的数据。 ------------ ### allowUpdate @@ -121,7 +123,9 @@ Luckysheet开放了更细致的自定义配置选项，分别有 ### updateUrl - 类型：String - 默认值："" -- 作用：操作表格后的后台更新地址，在`allowUpdate`为`true`时才会有效 +- 作用：操作表格后的后台更新地址，在`allowUpdate`为`true`时才会有效，此接口也是共享编辑的接口地址。 + +注意，还需要配置`loadUrl`和`loadSheetUrl`才能生效 ------------ ### updateImageUrl @@ -181,7 +185,7 @@ Luckysheet开放了更细致的自定义配置选项，分别有 ### showtoolbar - 类型：Boolean - 默认值：true -- 作用：是否第二列显示工具栏 +- 作用：是否显示工具栏 ------------ ### showtoolbarConfig @@ -232,7 +236,7 @@ Luckysheet开放了更细致的自定义配置选项，分别有 ### showinfobar - 类型：Boolean - 默认值：true -- 作用：是否显示顶部名称栏 +- 作用：是否显示顶部信息栏 ------------ ### showsheetbar @@ -376,18 +380,18 @@ Luckysheet开放了更细致的自定义配置选项，分别有 - 格式： ```json { - copy: false, // '复制' - copyAs: false, // '复制为' - paste: false, // '粘贴' - insert: false, // '插入' - delete: false, // '删除' - hide: false, // '隐藏' - deleteCell: false, // '删除单元格' - clear: false, // '清除内容' - matrix: false, // '矩阵操作选区' - sort: false, // '排序选区' - filter: false, //'筛选选区' - chart: false // '图表生成' + copy: false, // 复制 + copyAs: false, // 复制为 + paste: false, // 粘贴 + insert: false, // 插入 + delete: false, // 删除 + hide: false, // 隐藏 + deleteCell: false, // 删除单元格 + clear: false, // 清除内容 + matrix: false, // 矩阵操作选区 + sort: false, // 排序选区 + filter: false, // 筛选选区 + chart: false // 图表生成 } ------------ @@ -401,8 +405,8 @@ Luckysheet开放了更细致的自定义配置选项，分别有 - 格式： ```json { - delete: false, // '删除' - copy: false, // '复制' + delete: false, // 删除 + copy: false, // 复制 rename: false, //重命名 color: false, //更改颜色 hide: false, //隐藏 @@ -652,8 +656,8 @@ Luckysheet开放了更细致的自定义配置选项，分别有 - 默认值：null - 作用：sheet移动前 - 参数： - - {Number} [i]: 当前sheet页的index - - {Number} [order]: 当前sheet页order + - {Number} [i]: 当前sheet页的`index` + - {Number} [order]: 当前sheet页`order` ------------ ### sheetMoveAfter @@ -661,9 +665,9 @@ Luckysheet开放了更细致的自定义配置选项，分别有 - 默认值：null - 作用：sheet移动后 - 参数： - - {Number} [i]: 当前sheet页的index - - {Number} [oldOrder]: 修改前当前sheet页order - - {Number} [newOrder]: 修改后当前sheet页order + - {Number} [i]: 当前sheet页的`index` + - {Number} [oldOrder]: 修改前当前sheet页`order` + - {Number} [newOrder]: 修改后当前sheet页`order` ------------ ### sheetDeleteBefore @@ -687,7 +691,7 @@ Luckysheet开放了更细致的自定义配置选项，分别有 - 默认值：null - 作用：sheet修改名称前 - 参数： - - {Number} [i]: sheet页的index + - {Number} [i]: sheet页的`index` - {String} [name]: 当前sheet页名称 ------------ @@ -706,7 +710,7 @@ Luckysheet开放了更细致的自定义配置选项，分别有 - 默认值：null - 作用：sheet修改颜色前 - 参数： - - {Number} [i]: sheet页的index + - {Number} [i]: sheet页的`index` - {String} [color]: 当前sheet页颜色 ------------ @@ -715,7 +719,7 @@ Luckysheet开放了更细致的自定义配置选项，分别有 - 默认值：null - 作用：sheet修改颜色后 - 参数： - - {Number} [i]: sheet页的index + - {Number} [i]: sheet页的`index` - {String} [oldColor]: 修改前当前sheet页颜色 - {String} [newColor]: 修改后当前sheet页颜色 @@ -742,7 +746,7 @@ Luckysheet开放了更细致的自定义配置选项，分别有 ### workbookDestroyBefore - 类型：Function - 默认值：null -- 作用：表格创建之后触发 +- 作用：表格销毁之前触发 - 参数： - {Object} [book]: 整个工作簿的配置（options） @@ -750,7 +754,7 @@ Luckysheet开放了更细致的自定义配置选项，分别有 ### workbookDestroyAfter - 类型：Function - 默认值：null -- 作用：表格创建之后触发 +- 作用：表格销毁之后触发 - 参数： - {Object} [book]: 整个工作簿的配置（options）