feat: integrate luckysheet inline and fullscreen
This commit is contained in:
liaibo
@@ -0,0 +1,325 @@
|
||||
# FAQ
|
||||
|
||||
The content of this chapter collects the common problems that everyone has feedback. If the official documents and this list can’t answer your questions, I recommend you to [Official Forum](https://github.com/mengshukeji/Luckysheet/discussions)
|
||||
|
||||
## What is the difference between data and celldata in luckysheetfile?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Use one-dimensional array format [celldata](/guide/sheet.html#celldata), after the initialization is completed, the data converted into a two-dimensional array format is used for storage and update, and celldata is no longer used.
|
||||
|
||||
If you need to take out `data` as initial data, you need to execute [transToCellData(data)](/guide/api.html#transtocelldata-data-setting) to convert it to celldata data.
|
||||
Among them, the celldata in `{ r, c, v }` format is converted to a two-dimensional array using [transToData(celldata)](/guide/api.html#transtodata-celldata-setting)
|
||||
|
||||
Summarized as follows:
|
||||
```js
|
||||
// data => celldata two-dimensional array data into {r, c, v} format one-dimensional array
|
||||
luckysheet.transToCellData(data)
|
||||
|
||||
// celldata => data to generate the two-dimensional array required for the table
|
||||
luckysheet.transToData(celldata)
|
||||
```
|
||||
|
||||
------------
|
||||
|
||||
## What are the cell types?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Refer to [Cell Format List](/guide/cell.html), with examples of available cell formats
|
||||
|
||||
------------
|
||||
|
||||
## How to use Luckysheet in Vue/React project?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Check
|
||||
|
||||
- Vue case: [luckysheet-vue](https://github.com/mengshukeji/luckysheet-vue)
|
||||
- React case: [luckysheet-react](https://github.com/mengshukeji/luckysheet-react)
|
||||
|
||||
------------
|
||||
|
||||
## Why will the formula in the table not be triggered after initialization?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Refer to [Table data format](/guide/sheet.html#calcchain) ,just set the calcChain corresponding to the cell data.
|
||||
|
||||
------------
|
||||
|
||||
## Is the remote loading data loadUrl or updateUrl?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: [loadUrl](/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 parameter, while for collaborative editing, the four parameters of loadUrl, updateUrl and allowUpdate can be configured to take effect.
|
||||
|
||||
------------
|
||||
|
||||
## What is the difference between `index` and `order` for each sheet page?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Each sheet page has a unique id, which is `index`, which can be incremented by numbers or a random string. And `order` is the sorting situation of all sheets, starting from 0, can only be numbers `0,1,2...`.
|
||||
|
||||
------------
|
||||
|
||||
## Why can’t I run the project directly under the dist folder?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Need to start the local server
|
||||
|
||||
- [Node build a local server](https://github.com/JacksonTian/anywhere)
|
||||
- [Python build local server](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/set_up_a_local_testing_server)
|
||||
|
||||
------------
|
||||
|
||||
## How to import and export excel?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: The excel import and export library developed with Luckysheet-[Luckyexcel](https://github.com/mengshukeji/Luckyexcel) has realized the excel import function, and the export function is under development.You can refer to these 2 blog posts for excel export at this stage:
|
||||
|
||||
- [Development of Excel download function based on LuckySheet online form](https://www.cnblogs.com/recode-hyh/p/13168226.html)
|
||||
- [Use exceljs to export luckysheet form](https://blog.csdn.net/csdn_lsy/article/details/107179708)
|
||||
|
||||
------------
|
||||
|
||||
## How to merge cells during initialization?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Refer to the following case:
|
||||
- [How Luckysheet initializes the data with merged cells](https://www.cnblogs.com/DuShuSir/p/13272397.html)
|
||||
|
||||
------------
|
||||
|
||||
## How does 'Luckysheet' save the data from the table to the database? Is there a soulution for storage and collaboration?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: There are two options:
|
||||
|
||||
- 1. after the table operation is completed, you can use `luckysheet.getAllSheets()` to get all sheet data that stroed in the back-end.
|
||||
- 2. enable the collaborative editing function to transmit data to the back-end in real-time.
|
||||
refer this article:
|
||||
[How Luckysheet saves the data in the table to the database](https://www.cnblogs.com/DuShuSir/p/13857874.html)
|
||||
|
||||
------------
|
||||
|
||||
## How to monitor cell hover or click events? how to monitor `cellRenderAfter` in real-time?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: We have collected the secondary development requirements for cell events, and planned the cell-related hook functions, refer to [cell hook function](/guide/config.html#cellrenderafter) (the TODO displayed is not yet open)
|
||||
|
||||
------------
|
||||
|
||||
## How to customize the top toolbar?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**:
|
||||
reference: [options.showtoolbarconfig](/guide/config.html#showtoolbarconfig)(TODO means waiting to developed)
|
||||
|
||||
------------
|
||||
|
||||
## Does the project use jQuery?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: yes. At the beginning, Luckysheet uses jQuery。The packaging tool will package the jQuery to this file `./plugins/js/plugin.js`
|
||||
|
||||
If your project (such as react / Vue) also references jQuery globally and causes conflicts, you can try to remove a jQuery.
|
||||
|
||||
if you want to remove jQuery in `Luckysheet`, you can find `jQuery` in source code folder `gulpfile.js`: [src/plugins/js/jquery.min.js](https://github.com/mengshukeji/Luckysheet/blob/master/gulpfile.js)，then delete information related to jQuery.
|
||||
|
||||
------------
|
||||
|
||||
## How to add a field to a cell object?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: reference [cell object format](/guide/cell.html)，then read this annotation[src/controllers/postil.js](https://github.com/mengshukeji/Luckysheet/blob/master/src/controllers/postil.js)。the annotation is a configuration in a cell object.
|
||||
|
||||
------------
|
||||
|
||||
## The toolbar icon is on the loading stage all the time.
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: The luckysheet use iconfont icon in this project, if any icon cannot be loaded ,plz check your iconfont.css. we are so sorry that we did not describe it clearly in the old version documents.
|
||||
|
||||
Now the documents have been updated.[official documents](/guide/#steps-for-usage)
|
||||
|
||||
------------
|
||||
|
||||
## Can't run Luckyexcel after package.
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Terminal does not show `end`, but if the `dist` folder has this file `luckyexcel.js`, it is normal.
|
||||
|
||||
Lucky excel is an excel import and export library. The project uses `gulp` as a packaging tool. There is a problem with the old version of the packaging tool, but it is fixed now. if this problem still troubles you, plz check the following steps:
|
||||
1. pull the latest code.
|
||||
2. `npm i`
|
||||
3. `npm run build`
|
||||
|
||||
more information: [Luckyexcel](https://github.com/mengshukeji/Luckyexcel/)
|
||||
|
||||
------------
|
||||
|
||||
## How to disable editing of cells？How to open sheet protection?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Sheet protection includes disable editing of cells that you need to make some configurations on each sheets. `config.authority`, the latest configurations[sheet protection](/guide/sheet.html#config-authority)。
|
||||
|
||||
In order to make it easier for you to understand the function of sheet protection, the following video shows how to make the whole sheet uneditable, but allow a column of cells to be edited:
|
||||
|
||||
<iframe frameborder="0" src="https://v.qq.com/txp/iframe/player.html?vid=g3162sacwn6" allowFullScreen="true"></iframe>
|
||||
|
||||
In you local browser, you can open the control pannel, use `luckysheet.getLuckysheetfile()[0].config.authority` to get the configuration parameters.
|
||||
|
||||
------------
|
||||
|
||||
## How to configure data validation?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: there is the configuration of data validation，[data validation](/guide/sheet.html#dataVerification)。Also there is the API that you can use `data validation` in any time. [setDataVerification](/guide/api.html#setdataverification-optionitem-setting).
|
||||
|
||||
------------
|
||||
|
||||
## Is there a case for using Luckysheet with CDN?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Luckysheet supports CDN. reference: [The case of using luckysheet by CDN](https://www.cnblogs.com/DuShuSir/p/13859103.html)
|
||||
|
||||
------------
|
||||
|
||||
## how to limit the adaptive height of a picture in a cell？
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: First of all, you need to move the picture and adjust the cell size, and then there are the following situations:
|
||||
|
||||
- if the cell contains a picture and you expand the cell, the picure will not be expanded.
|
||||
- if the cell contains a picture and you shorten the cell to the edge of the picture, the picture will shrink.
|
||||
- When the picture exceeds the border of the cell, the size of this picture will change with the size of the cell.
|
||||
|
||||
if you want to get the position of the picture, you can overlap the picture with the border of the cell.(in the source code, it needs to overlap more than 2px.)The following demo video shows how to limit the image to the adaptive width and height of the cell.
|
||||
|
||||
<iframe frameborder="0" src="https://v.qq.com/txp/iframe/player.html?vid=y3163ya0q6c" allowFullScreen="true"></iframe>
|
||||
|
||||
------------
|
||||
|
||||
## How to get the default row height and column width of the worksheet?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: There are two ways to get it
|
||||
|
||||
- 1. use `luckysheet.getLuckysheetfile()` to get all configuration data, so you can get the `defaultRowHeight` and `defaultColWidth` in the sheet configuration data。
|
||||
- 2. use API to get the default row height [getDefaultRowHeight](/guide/api.html#getdefaultrowheight-setting) and column width.[getDefaultColWidth](/guide/api.html#getdefaultcolwidth-setting)
|
||||
|
||||
------------
|
||||
|
||||
## How to hide the add row button and the back to top button below the worksheet?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Configuration is open
|
||||
- Allow adding rows [enableAddRow](/guide/config.html#enableaddrow)
|
||||
- Allow back to top [enableAddBackTop](/guide/config.html#enableAddBackTop)
|
||||
|
||||
------------
|
||||
|
||||
## How to hide the row and column headings of the worksheet?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Configuration is open
|
||||
- The width of the row header area [rowHeaderWidth](/guide/config.html#rowheaderwidth)
|
||||
- The height of the column header area [columnHeaderHeight](/guide/config.html#columnHeaderHeight)
|
||||
|
||||
------------
|
||||
|
||||
## What method can be called to set `config.merge`?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Three methods
|
||||
- Interface operation
|
||||
- Use API: [setRangeMerge](/guide/api.html#setrangemerge-type-setting)
|
||||
- Manually assemble merge parameters
|
||||
|
||||
------------
|
||||
|
||||
## Why is the official new feature ineffective?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: The first step is to check whether you have used CDN to import,
|
||||
|
||||
The CDN link used in the Luckysheet tutorial is the service provided by [jsdelivr](https://www.jsdelivr.com/package/npm/luckysheet), and the code is from [npmjs.com](https://www.npmjs.com/) automatically sync the past, not from [Github](https://github.com/mengshukeji/Luckysheet/). Because our newly submitted code still needs to be tested for a period of time, it will not be released to npm immediately, causing the npm code to lag behind Github.
|
||||
|
||||
If you need to try the latest code, we strongly recommend that you pull the code from the [Luckysheet Github](https://github.com/mengshukeji/Luckysheet/) main repository. After our version is stable, we will consider releasing the npm package in real time.
|
||||
|
||||
The second step, if it is to import the packaged code of the github repository, test to determine whether there is a bug, you can find the problem and try to fix it, and then [submit a PR](https://github.com/mengshukeji/Luckysheet/pulls), if can't fix it, please [submit issues](https://github.com/mengshukeji/Luckysheet/issues).
|
||||
|
||||
------------
|
||||
|
||||
## `npm run dev` reported an error: ʻError: Cannot find module'rollup'`?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: It may be a problem with the npm package installation, try the following steps:
|
||||
1. `npm cache clean --force`
|
||||
2. `npm i rimraf -g`
|
||||
3. `rimraf node_modules`
|
||||
4. Delete the package-lock.json file
|
||||
5. `npm i`
|
||||
6. `npm run dev`
|
||||
|
||||
Tip: Most other npm installation problems can also be solved by trying above steps.
|
||||
|
||||
------------
|
||||
|
||||
## How to carry out secondary development of Luckysheet in Vue project?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: The [luckysheet-vue](https://github.com/mengshukeji/luckysheet-vue) case is to provide an application integration solution.
|
||||
|
||||
If directly developed locally:
|
||||
1. Start both the Luckysheet project and your own Vue project. For example, the Luckysheet project is at http://localhost:3001
|
||||
2. Import Luckysheet to use in the Vue project through `http://localhost:3001`
|
||||
|
||||
In this case, after Luckysheet is modified in real time, the changes can be seen in the Vue project
|
||||
|
||||
------------
|
||||
|
||||
## Error reporting `Store.createChart` when creating chart?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: You need to introduce a chart plugin to use it. You should configure the chart plugin to use when the workbook is initialized. Refer to
|
||||
|
||||
- Plugins configuration [plugins](/guide/config.html#plugins)
|
||||
- 或 官方demo [src/index.html](https://github.com/mengshukeji/Luckysheet/blob/master/src/index.html)
|
||||
|
||||
------------
|
||||
|
||||
## Can cells add custom attributes?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: The custom attributes directly assigned to the cell object will be filtered. To make the custom attributes take effect, you need to edit the code to remove the filter attributes.
|
||||
|
||||
------------
|
||||
|
||||
## How to enter text starting with `'='`? For example, `=currentDate('YYYY-MM-DD')`, it will remove the function by default, how to prohibit the function?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Just add a single quotation mark in front of it, and it will be forcibly recognized as a string, which is consistent with excel. For example: `'=currentDate('YYYY-MM-DD')`
|
||||
|
||||
------------
|
||||
|
||||
## Why does the create callback have no effect?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: The API method `luckysheet.create()` does not have a callback, but Luckysheet provides a hook function to execute the callback method at a specified location, such as:
|
||||
- Triggered before the workbook is created [workbookCreateBefore](/guide/config.html#workbookcreatebefore)
|
||||
- Triggered after the workbook is created [workbookCreateAfter](/guide/config.html#workbookcreateafter)
|
||||
|
||||
------------
|
||||
|
||||
## When create, the first cell is selected by default, how to remove it?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: When the cell is selected, it is highlighted by default, just remove the highlight, use API: [setRangeShow](/guide/api.html#setrangeshow-range-setting)
|
||||
|
||||
```js
|
||||
luckysheet.setRangeShow("A2",{show:false})
|
||||
```
|
||||
|
||||
------------
|
||||
|
||||
## Where is the right-click event bound?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: In the source code [src/controllers/hander.js](https://github.com/mengshukeji/Luckysheet/blob/master/src/controllers/handler.js), search for `event.which == "3"` to find the code executed by the right-click event.
|
||||
|
||||
------------
|
||||
|
||||
## How to add a custom toolbar?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: No configuration is currently provided, you can refer to the implementation of the print button in the toolbar to modify the source code:
|
||||
1. Search for `luckysheet-icon-print` globally to find the implementation of the print button, in [src/controllers/constant.js](https://github.com/mengshukeji/Luckysheet/blob/master/src/controllers/constant.js) add a similar template string, you need to customize a unique id
|
||||
2. Modify [src/controllers/resize.js](https://github.com/mengshukeji/Luckysheet/blob/master/src/controllers/resize.js) and add a new record in the toobarConfig object
|
||||
3. Modify [src/controllers/menuButton.js](https://github.com/mengshukeji/Luckysheet/blob/master/src/controllers/menuButton.js) to add an event listener
|
||||
|
||||
------------
|
||||
|
||||
## How to add custom formulas?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Two source codes need to be modified:
|
||||
1. Add a formula to the `functionImplementation` object in the [src/function/functionImplementation.js](https://github.com/mengshukeji/Luckysheet/blob/master/src/function/functionImplementation.js) file, format refer to formulas such as `SUM`/`AVERAGE`
|
||||
2. Modify all the language packs in the [src/locale](https://github.com/mengshukeji/Luckysheet/blob/master/src/locale) file directory, and add the new formula description to the `functionlist` array in. Among them, `t` is the category of the function, `m` is the number of parameters, the minimum number of parameters and the maximum number of parameters.
|
||||
|
||||
------------
|
||||
|
||||
## Is there a similar loadData interface, I want to load 10 records first, and then dynamically load the data, these data are appended to the table?
|
||||
|
||||
**<span style="font-size:20px;">A</span>**: Yes. Our `loadSheetUrl` provides this function, which can be turned on by initializing `options.enablePage = true`.
|
||||
|
||||
Searching for `enablePage` in the source code, you can see that there is a `method.addDataAjax` method, which contains an ajax request to dynamically load data, which will be appended to the worksheet.
|
||||
|
||||
This function is now hidden in the document, because when we made this interface, the interface parameters were matched according to our actual business, which may not be universal. We are going to abstract and release it for everyone to use. If you want to use it yourself you can change it based on this.
|
||||
|
||||
It is recommended that you consider writing your own interface to load the data, and then use `setRangeValue` to append the data at the specified location, which has a higher degree of customization.
|
||||
|
||||
------------
|
||||
@@ -0,0 +1,271 @@
|
||||
# Luckysheet is no longer maintained, please use [Univer](https://github.com/dream-num/univer) instead!
|
||||
|
||||
# Get started
|
||||
|
||||
## Introduction
|
||||
Luckysheet is an online spreadsheet like excel that is powerful, simple to configure, and completely open source.
|
||||
|
||||
## Demo
|
||||
[Online demo](https://dream-num.github.io/LuckysheetDemo/)
|
||||
|
||||
|
||||
|
||||
## Online Case
|
||||
|
||||
- [Cooperative editing demo](http://luckysheet.lashuju.com/demo/)(Note: The official Java backend will also be open source after finishing,using OT algorithm. Please do not operate frequently to prevent the server from crashing)
|
||||
|
||||
## Features
|
||||
|
||||
### 🛠️Formatting
|
||||
+ **Styling** (Change font style, size, color, or apply effects)
|
||||
+ **Conditional formatting** (highlight interesting cells or ranges of cells, emphasize unusual values, and visualize data by using data bars, color scales, and icon sets that correspond to specific variations in the data)
|
||||
+ **Align or rotate text**
|
||||
+ **Support text truncation, overflow, automatic line wrapping**
|
||||
+ **Data types**
|
||||
+ **currency, percentages, decimals, dates**
|
||||
+ **Custom** (E.g `##,###0.00` , `$1,234.56$##,###0.00_);[Red]($##,###0.00)`, `_($* ##,###0.00_);_(...($* "-"_);_(@_)`, `08-05 PM 01:30MM-dd AM/PM hh:mm` )
|
||||
+ **Cell segmentation style** (Alt+Enter line break, sub,super, in-cell style)
|
||||
|
||||
### 🧬Cells
|
||||
+ **Move cells by drag and dropping** (Operate on selection)
|
||||
+ **Fill handle** (For a series like 1, 2, 3, 4, 5..., type 1 and 2 in the first two cells. For the series 2, 4, 6, 8..., type 2 and 4. Support arithmetic sequence, geometric sequence,date, week,chinese numbers)
|
||||
+ **Auto Fill Options** (Fill copy, sequence, only format, no format, day, month, year)
|
||||
+ **Multiple selection** (Hold Ctrl Selecting multiple cells, copy and paste)
|
||||
+ **Find and replace** (Such as a particular number or text string, Support regular expression, whole word, case sensitive)
|
||||
+ **Location** (Cells can be selected according to the data type)
|
||||
+ **Merge cells**
|
||||
+ **Data validation** (Checkbox, drop-down list, datePicker)
|
||||
|
||||
### 🖱️Row & columns
|
||||
+ **Hide, Insert, Delete rows and columns**
|
||||
+ **Frozen rows and columns** (First row, first column, Frozen to selection, freeze adjustment lever can be dragged)
|
||||
+ **Split text** (Split text into different columns with the Convert Text to Columns Wizard)
|
||||
|
||||
### 🔨Operation
|
||||
+ **Undo/Redo**
|
||||
+ **Copy/Paste/Cut** (Copy from excel to Luckysheet with format, vice versa)
|
||||
+ **Hot key** (The operating experience is consistent with excel, if there are differences or missing, please feedback to us)
|
||||
+ **Format Painter** (Similar to google sheet)
|
||||
+ **Selection by drag and dropping** (Change the parameters of formula and chart through selection)
|
||||
|
||||
### ⚙️Formulas & functions
|
||||
+ **Built-in formulas**
|
||||
+ Math (SUMIFS, AVERAGEIFS, SUMIF, SUM, etc.)
|
||||
+ Text (CONCATENATE, REGEXMATCH, MID)
|
||||
+ Date (DATEVALUE, DATEDIF, NOW, WEEKDAY, etc.)
|
||||
+ Financial (PV, FV, IRR, NPV, etc.)
|
||||
+ Logical (IF, AND, OR, IFERROR, etc.)
|
||||
+ Lookup (VLOOKUP, HLOOkUP, INDIRECT, OFFSET, etc.)
|
||||
+ Dynamic Array (Excel2019 new formulas, SORT,FILTER,UNIQUE,RANDARRAY,SEQUENCE)
|
||||
+ **Array** (={1,2,3,4,5,6}, Crtl+Shift+Enter)
|
||||
+ **Remote formulas** (DM_TEXT_TFIDF, DM_TEXT_TEXTRANK,DATA_CN_STOCK_CLOSE etc. Need remote interface, can realize complex calculation)
|
||||
+ **Custom** (Some formula suitable for use in China have been added. AGE_BY_IDCARD, SEX_BY_IDCARD, BIRTHDAY_BY_IDCARD, PROVINCE_BY_IDCARD, CITY_BY_IDCARD, etc. You can define any formula you want)
|
||||
|
||||
### 📐Tables
|
||||
+ **Filters** (Support color , numerical, date, text filtering)
|
||||
+ **Sort** (Sort multiple fields simultaneously)
|
||||
|
||||
### 📈Pivot table
|
||||
+ **Arrange fields** (Add fileds to rows, columns, values, area, it is similar to excel)
|
||||
+ **Aggregation** (Surport Sum,Count,CountA,CountUnique,Average,Max,Min,Median,Product,Stdev,Stdevp,Var,VarP etc.)
|
||||
+ **Filter data** (Add fileds to filters area and analyze the desired data )
|
||||
+ **Drill down** (Double click pivot table cell to drill down for detail data )
|
||||
+ **Create a PivotChart** (Pivot table can create a chart )
|
||||
|
||||
### 📊Chart
|
||||
+ **Support types** (Line, Column, Area, Bar, Pie, comming soon Scatter, Radar, Gauge, Funnel etc.)
|
||||
+ **Chart Plugins** (Link to another project [ChartMix](https://github.com/mengshukeji/chartMix)(MIT): ECharts is currently supported,Highcharts, Ali G2, amCharts, googleChart, chart.js are being developed gradually)
|
||||
+ **Sparklines** (Support by formula : Line, Pie, Box, Pie etc.)
|
||||
|
||||
### ✍️Share
|
||||
+ **Comments** (Add, delete, update)
|
||||
+ **Collaborate** (Simultaneous editing by multiple users)
|
||||
|
||||
### 📚Insert object
|
||||
+ **Insert picture** (JPG,PNG,SVG and so on)
|
||||
|
||||
### ⚡Luckysheet
|
||||
+ **Matrix operation** (Operate selection through the right-click menu: transpose, rotate, numerical calculation)
|
||||
+ **Screenshot** (Take a screenshot with selection)
|
||||
+ **Copy to** (In the right-click menu, copy selection to json, array etc.)
|
||||
+ **EXCEL import/export** (Specially adapted to Luckysheet, export is under development)
|
||||
|
||||
### ⏱️Coming soon
|
||||
+ **Print** (Like excel print option, save to PDF)
|
||||
+ **Tree menu** (Just like the outline (group) function of excel)
|
||||
+ **Table new Features** (filter, slicer)
|
||||
+ **CSV,TXT import/export** (Specially adapted to Luckysheet)
|
||||
+ **Insert Shapes** ([Pen tool](https://github.com/mengshukeji/Pentool) Shapes)
|
||||
+ **Documentation** (Improve documentation and API)
|
||||
+ **More...** (Please advise us)
|
||||
|
||||
## Development model
|
||||
|
||||
### Requirements
|
||||
[Node.js](https://nodejs.org/en/) Version >= 6
|
||||
|
||||
### Installation
|
||||
```shell
|
||||
npm install
|
||||
npm install gulp -g
|
||||
```
|
||||
|
||||
### Development
|
||||
```shell
|
||||
npm run dev
|
||||
```
|
||||
|
||||
### Package
|
||||
```shell
|
||||
npm run build
|
||||
```
|
||||
|
||||
## Steps for usage
|
||||
|
||||
### First step
|
||||
|
||||
There are two ways to introduce dependencies
|
||||
|
||||
#### CDN
|
||||
```html
|
||||
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/luckysheet@latest/dist/plugins/css/pluginsCss.css' />
|
||||
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/luckysheet@latest/dist/plugins/plugins.css' />
|
||||
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/luckysheet@latest/dist/css/luckysheet.css' />
|
||||
<link rel='stylesheet' href='https://cdn.jsdelivr.net/npm/luckysheet@latest/dist/assets/iconfont/iconfont.css' />
|
||||
<script src="https://cdn.jsdelivr.net/npm/luckysheet@latest/dist/plugins/js/plugin.js"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/luckysheet@latest/dist/luckysheet.umd.js"></script>
|
||||
```
|
||||
|
||||
Note that the path of `https://cdn.jsdelivr.net/npm/luckysheet@latest/dist/luckysheet.umd.js` means that the latest luckysheet code will be pulled, but if Luckysheet has just been released, the jsdelivr website may not have time Synchronize from npm, so using this path will still pull to the previous version. We recommend that you directly specify the latest version.
|
||||
|
||||
To specify the Luckysheet version, please add the version number after all CDN dependent files, such as: `https://cdn.jsdelivr.net/npm/luckysheet@2.1.12/dist/luckysheet.umd.js`.
|
||||
|
||||
> How do I know which version is the latest version? View the latest [release record](https://github.com/mengshukeji/Luckysheet/releases) or [package.json](https://github.com/mengshukeji/Luckysheet/blob/master/package.json)` version` field.
|
||||
|
||||
If it is not convenient to access jsdelivr.net, you can also import it locally
|
||||
|
||||
#### Import locally
|
||||
After `npm run build`, all files in the `dist` folder are copied to the project directory
|
||||
```html
|
||||
<link rel='stylesheet' href='./plugins/css/pluginsCss.css' />
|
||||
<link rel='stylesheet' href='./plugins/plugins.css' />
|
||||
<link rel='stylesheet' href='./css/luckysheet.css' />
|
||||
<link rel='stylesheet' href='./assets/iconfont/iconfont.css' />
|
||||
<script src="./plugins/js/plugin.js"></script>
|
||||
<script src="./luckysheet.umd.js"></script>
|
||||
```
|
||||
### Second step
|
||||
Specify a table container
|
||||
```html
|
||||
<div id="luckysheet" style="margin:0px;padding:0px;position:absolute;width:100%;height:100%;left: 0px;top: 0px;"></div>
|
||||
```
|
||||
### Third step
|
||||
Create a table
|
||||
```javascript
|
||||
<script>
|
||||
$(function () {
|
||||
//Configuration item
|
||||
var options = {
|
||||
container: 'luckysheet' //luckysheet is the container id
|
||||
}
|
||||
luckysheet.create(options)
|
||||
})
|
||||
</script>
|
||||
```
|
||||
|
||||
## Structure
|
||||
|
||||
### Format
|
||||
|
||||
The data format of a complete Luckysheet table file is: luckysheetfile, a table file contains several sheet files, corresponding to excel sheet0, sheet1, etc.
|
||||
|
||||
An example of a Luckysheet file is as follows, the table contains 3 sheets:`
|
||||
luckysheetfile = [{sheet1 settings}, {sheet2 settings}, {sheet3 settings}]`
|
||||
Equivalent to 3 sheets of excel
|
||||
|
||||
|
||||
|
||||
An example of a sheet in the file is as follows:
|
||||
```javascript
|
||||
luckysheetfile[0] =
|
||||
{
|
||||
"name": "Cell", //Worksheet name
|
||||
"color": "", //Worksheet color
|
||||
"config": {}, //Table row height, column width, merged cells, borders, hidden rows and other settings
|
||||
"index": "0", //Worksheet index
|
||||
"chart": [], //Chart configuration
|
||||
"status": "1", //Activation status
|
||||
"order": "0", //The order of the worksheet
|
||||
"hide": 0,//whether to hide
|
||||
"column": 18, //Number of columns
|
||||
"row": 36, //number of rows
|
||||
"celldata": [], //Original cell data set
|
||||
"visibledatarow": [], //The position of all rows
|
||||
"visibledatacolumn": [], //The position of all columns
|
||||
"ch_width": 2322, //The width of the worksheet area
|
||||
"rh_height": 949, //The height of the worksheet area
|
||||
"scrollLeft": 0, //Left and right scroll bar position
|
||||
"scrollTop": 315, //Up and down scroll bar position
|
||||
"luckysheet_select_save": [], //selected area
|
||||
"luckysheet_conditionformat_save": {},//Conditional format
|
||||
"calcChain": [],//Formula chain
|
||||
"isPivotTable":false,//Whether to pivot table
|
||||
"pivotTable":{},//Pivot table settings
|
||||
"filter_select": null,//Filter range
|
||||
"filter": null,//Filter configuration
|
||||
"luckysheet_alternateformat_save": [], //Alternate colors
|
||||
"luckysheet_alternateformat_save_modelCustom": []//Customize alternate colors
|
||||
}
|
||||
```
|
||||
### View method
|
||||
View in chrome's console
|
||||
`luckysheet.getluckysheetfile()`
|
||||
You can see the complete settings
|
||||
`[{shee1}, {sheet2}, {sheet3}]`
|
||||
|
||||
## Keyboard shortcuts
|
||||
|
||||
| Keyboard shortcuts | Features |
|
||||
| ------------ | ------------ |
|
||||
| CTRL + C | Copy cell |
|
||||
| CTRL + V | Paste cell |
|
||||
| CTRL + X | Cut cell |
|
||||
| CTRL + Z | Undo |
|
||||
| CTRL + Y | Redo |
|
||||
| CTRL + A | Select all |
|
||||
| CTRL + B | Bold |
|
||||
| CTRL + F | Find |
|
||||
| CTRL + H | Replace |
|
||||
| CTRL + I | Italic |
|
||||
| CTRL + UP/DOWN/LEFT/RIGHT | Quickly adjust cell marquee |
|
||||
| SHIFT + UP/DOWN/LEFT/RIGHT | Adjust selection area |
|
||||
| CTRL + Left mouse click | Multiple selection cell |
|
||||
| SHIFT + Left mouse click | Adjust selection area |
|
||||
| UP/DOWN/LEFT/RIGHT | Move cell selection box |
|
||||
| ENTER | Edit cell |
|
||||
| TAB | Move cell selection box to the right |
|
||||
| DELETE | Clear cell data |
|
||||
|
||||
## Guide
|
||||
|
||||
If you encounter problems with Luckysheet, follow the steps below to find the answer
|
||||
|
||||
1. Use Doge or Google to search for common technical issues
|
||||
2. For Luckysheet related issues, please view [Luckysheet Official Document](https://dream-num.github.io/LuckysheetDocs/)(Note that the function of marking TODO has not yet been implemented)
|
||||
3. Search [FAQ List](https://dream-num.github.io/LuckysheetDocs/guide/FAQ.html)
|
||||
4. Search [Official Forum](https://groups.google.com/g/luckysheet) to see if anyone has encountered it
|
||||
5. Try to check or experiment by yourself to find the answer
|
||||
6. Please try to read the source code to find the answer,
|
||||
|
||||
If none of the above methods solve your problem, you can consider:
|
||||
|
||||
- Go to [Official Forum](https://groups.google.com/g/luckysheet) to ask questions
|
||||
- Go to [Gitter](https://gitter.im/mengshukeji/Luckysheet) to ask questions
|
||||
- If there are obvious problems or the needs cannot be met, please submit [issues](https://github.com/mengshukeji/Luckysheet/issues)
|
||||
|
||||
> Recommended reading [How To Ask Questions The Smart Way](http://www.catb.org/~esr/faqs/smart-questions.html)
|
||||
|
||||
At the same time, we strongly recommend you to help us enrich the Luckysheet community
|
||||
|
||||
- If you find a problem with the documentation or code, you can contribute by submitting a PR. All reasonable changes, optimizations, amendments, or document amendments or updates related to submissions will be accepted
|
||||
- When you have some experience in using or secondary developing Luckysheet, we encourage you to share it through blog posts
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,391 @@
|
||||
# Format attributes
|
||||
|
||||
## Cell attributes table
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<td>Attribute value</td>
|
||||
<td>Full name</td>
|
||||
<td><div style="width:100px">Explanation</div></td>
|
||||
<td>Example value</td>
|
||||
<td>Aspose method or attribute</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ct</td>
|
||||
<td>celltype</td>
|
||||
<td>Cell value format: text, time, etc.</td>
|
||||
<td><a href="#cellStyle">Cell format</a></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>bg</td>
|
||||
<td>background</td>
|
||||
<td>background color</td>
|
||||
<td>#fff000</td>
|
||||
<td>setBackgroundColor</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ff</td>
|
||||
<td>fontfamily</td>
|
||||
<td>Font</td>
|
||||
<td>0 Times New Roman, 1 Arial, 2 Tahoma, 3 Verdana, 4 Microsoft Yahei, 5 Song, 6 ST Heiti, 7 ST Kaiti, 8 ST FangSong, 9 ST Song, 10 Chinese New Wei, 11 Chinese Xingkai, 12 Chinese Lishu</td>
|
||||
<td>Style.Font object's Name property.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>fc</td>
|
||||
<td>fontcolor</td>
|
||||
<td>font color</td>
|
||||
<td>#fff000</td>
|
||||
<td>Style.Font object's Color property</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>bl</td>
|
||||
<td>bold</td>
|
||||
<td>Bold</td>
|
||||
<td>0 Regular, 1 Bold</td>
|
||||
<td>Style.Font object's IsBold property to true.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>it</td>
|
||||
<td>italic</td>
|
||||
<td>Italic</td>
|
||||
<td>0 Regular, 1 Italic</td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>fs</td>
|
||||
<td>fontsize</td>
|
||||
<td>font size</td>
|
||||
<td>14</td>
|
||||
<td>Style.Font object's Size property.</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>cl</td>
|
||||
<td>cancelline</td>
|
||||
<td>Cancelline</td>
|
||||
<td>0 Regular, 1 Cancelline</td>
|
||||
<td>Style.Font object's Underline property</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>vt</td>
|
||||
<td>verticaltype</td>
|
||||
<td>Vertical alignment</td>
|
||||
<td>0 middle, 1 up, 2 down</td>
|
||||
<td>setVerticalAlignment</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>ht</td>
|
||||
<td>horizontaltype</td>
|
||||
<td>Horizontal alignment</td>
|
||||
<td>0 center, 1 left, 2 right</td>
|
||||
<td>setHorizontalAlignment</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>mc</td>
|
||||
<td>mergecell</td>
|
||||
<td>Merge Cells</td>
|
||||
<td>{rs: 10, cs:5} indicates that the cells from this cell to 10 rows and 5 columns are merged.</td>
|
||||
<td>Merge</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>tr</td>
|
||||
<td>textrotate</td>
|
||||
<td>Text rotation</td>
|
||||
<td>0: 0、1: 45 、2: -45、3 Vertical text、4: 90 、5: -90</td>
|
||||
<td>setRotationAngle</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>tb</td>
|
||||
<td>textbeak</td>
|
||||
<td>Text wrap</td>
|
||||
<td>0 truncation, 1 overflow, 2 word wrap</td>
|
||||
<td>2: setTextWrapped <br> 0和1: IsTextWrapped = true</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>v</td>
|
||||
<td>value</td>
|
||||
<td>Original value</td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>m</td>
|
||||
<td>monitor</td>
|
||||
<td>Display value</td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>f</td>
|
||||
<td>function</td>
|
||||
<td>formula</td>
|
||||
<td></td>
|
||||
<td>setFormula <br> setArrayFormula <br> workbook.calculateFormula();</td>
|
||||
</tr>
|
||||
</table>
|
||||
|
||||
|
||||
The following is the storage of 3 cells:
|
||||
```json
|
||||
[
|
||||
{
|
||||
"r": 10,
|
||||
"c": 11,
|
||||
"v": {
|
||||
"f": "=MAX(A7:A9)",
|
||||
"ct": {
|
||||
"fa": "General",
|
||||
"t": "n"
|
||||
},
|
||||
"v": 100,
|
||||
"m": "100"
|
||||
}
|
||||
},
|
||||
{
|
||||
"r": 0,
|
||||
"c": 1,
|
||||
"v": {
|
||||
"v": 12,
|
||||
"f": "=SUM(A2)",
|
||||
"bg": "#fff000"
|
||||
}
|
||||
},
|
||||
{
|
||||
"r": 10,
|
||||
"c": 11,
|
||||
"v": "值2"
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
## <div id='cellStyle'>Cell format</div>
|
||||
|
||||
Reference[Aspose.Cells](https://docs.aspose.com/display/cellsnet/List+of+Supported+Number+Formats#ListofSupportedNumberFormats-Aspose.Cells)
|
||||
|
||||
The format is set to:
|
||||
|
||||
```json
|
||||
{
|
||||
"ct": {
|
||||
"fa": "General",
|
||||
"t": "g"
|
||||
},
|
||||
"m": "2424",
|
||||
"v": 2424
|
||||
}
|
||||
```
|
||||
|
||||
|Parameter|Explanation|Value|
|
||||
| ------------ | ------------ | ------------ |
|
||||
|fa|Format definition string| such as "General"|
|
||||
|t|Type|Such as "g"|
|
||||
|
||||
The available settings are as follows:
|
||||
| Format | ct.fa | ct.t | Example of m value | Remarks |
|
||||
|----------|----------|-------------------------|------------------------- |------------------------- |
|
||||
| Automatic | General | g | Luckysheet |Automatic format, which is also the default format; When the cell content is a number, the value of `m` is `'n'`|
|
||||
| Plain text | @ | s | Luckysheet ||
|
||||
| <br><br><br>**Number Format** | | | | |
|
||||
| Integer | 0 | n | 1235 | 0 decimal places |
|
||||
| One decimal place of the number | 0.0 | n | 1234.6 | The number of 0 after the dot represents the number of decimal places. If the original number is large, the number of digits will be rounded to the nearest hour |
|
||||
| Two decimal places | 0.00 | n | 1234.56 ||
|
||||
| Percentage integer | 0% | n | 123456% |The usage of #0% is also supported|
|
||||
| Percentage | 0.00% | n | 123456.00% |The usage of #0.00% is also supported. The number of 0 after the dot represents the number of decimal places|
|
||||
| Scientific Notation | 0.00E+00 | n | 1.23E+03 ||
|
||||
| Scientific Notation | ##0.0E+0 | n | 1.2E+3 ||
|
||||
| Fractions | # ?/? | n | 1234 5/9 ||
|
||||
| Score | # ??/?? | n | 1234 14/25 ||
|
||||
| Ten thousand | w | n |123 thousand and 456||
|
||||
| Ten thousand two decimal places | w0.00 | n |123 thousand and 3456.00 ||
|
||||
| Accounting | ¥(0.00) | n ||
|
||||
| More number formats | #,##0 | n | 1,235 ||
|
||||
| More number formats | #,##0.00 | n | 1,234.56 ||
|
||||
| More number formats | `#,##0_);(#,##0)` | n | 1,235 ||
|
||||
| More number formats | `#,##0_);[Red](#,##0)` | n | 1,235 ||
|
||||
| More number formats | `#,##0.00_);(#,##0.00)` | n | 1,234.56 ||
|
||||
| More number formats | `#,##0.00_);[Red](#,##0.00)` | n | 1,234.56 ||
|
||||
| More number formats | $#,##0_);($#,##0) | n | $1,235 ||
|
||||
| More number formats | `$#,##0_);[Red]($#,##0)` | n | $1,235 ||
|
||||
| More number formats | $#,##0.00_);($#,##0.00) | n | $1,234.56 ||
|
||||
| More number formats | `$#,##0.00_);[Red]($#,##0.00)` | n | $1,234.56 ||
|
||||
| More number formats | _($* #,##0_);_(...($* "-"_);_(@_) | n | $ 1,235 ||
|
||||
| More number formats | _(* #,##0_);_(*..._(* "-"_);_(@_) | n | 1,235 ||
|
||||
| More number formats | _($* #,##0.00_);_(...($* "-"_);_(@_) | n | $ 1,234.56 ||
|
||||
| More number formats | _(* #,##0.00_);...* "-"??_);_(@_) | n | 1,234.56 ||
|
||||
| <br><br><br>**Time and Date Format** | | | | |
|
||||
| Time | hh:mm AM/PM | d |10:23 AM||
|
||||
| Time 24H | hh:mm | d |10:23||
|
||||
| Date Time | yyyy-MM-dd hh:mm AM/PM | d |2020-07-29 10:23 AM||
|
||||
| Date Time 24H | yyyy-MM-dd hh:mm | d |2020-07-29 10:23||
|
||||
| Date | yyyy-MM-dd | d | 1930-08-05 ||
|
||||
| Date | yyyy/MM/dd | d | 1930/8/5 ||
|
||||
| Date | yyyy "year" M" month "d" day" | d | August 5, 1930 ||
|
||||
| Date | MM-dd | d | 08-05 ||
|
||||
| Date | M-d | d | 8-5 ||
|
||||
| Date | M"Month"d"Day" | d | August 5th ||
|
||||
| Date | h:mm:ss | d | 13:30:30 ||
|
||||
| Date | h:mm | d | 13:30 ||
|
||||
| Date | AM/PM hh:mm | d | 01:30 PM ||
|
||||
| Date | AM/PM h:mm | d | 1:30 PM ||
|
||||
| Date | AM/PM h:mm:ss | d | 1:30:30 PM ||
|
||||
| Date | MM-dd AM/PM hh:mm | d | Next 08-05 01:30 PM ||
|
||||
| <br><br><br>**Currency Format** | | | | |
|
||||
| Currency: RMB | "¥" 0.00 | n | ¥ 123.00 | Also supports ¥ #.00 or ¥0.00|
|
||||
| Currency: US Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Euro | "€" 0.00 | n | € 123.00 ||
|
||||
| Currency: British Pound | "￡" 0.00 | n | ￡ 123.00 ||
|
||||
| Currency: Hong Kong Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Japanese Yen | "￥" 0.00 | n | ￥123.00 ||
|
||||
| Currency: Albanian Lek | "Lek" 0.00 | n | Lek 123.00 ||
|
||||
| Currency: Algerian Dinar | "din" 0.00 | n | din 123.00 ||
|
||||
| Currency: Afghani | "Af" 0.00 | n | Af 123.00 ||
|
||||
| Currency: Argentine Peso | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: United Arab Emirates Dirham | "dh" 0.00 | n | dh 123.00 ||
|
||||
| Currency: Aruban Florin | "Afl" 0.00 | n | Afl 123.00 ||
|
||||
| Currency: Omani Rial | "Rial" 0.00 | n | Rial 123.00 ||
|
||||
| Currency: Azerbaijani Manat | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Egyptian Pound | "￡" 0.00 | n | ￡ 123.00 ||
|
||||
| Currency: Ethiopian Birr | "Birr" 0.00 | n | Birr 123.00 ||
|
||||
| Currency: Angolan Kwanza | "Kz" 0.00 | n | Kz 123.00 ||
|
||||
| Currency: Australian Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Macau Patacas | "MOP" 0.00 | n | MOP 123.00 ||
|
||||
| Currency: Barbadian Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Papua New Guinea Kina | "PGK" 0.00 | n | PGK 123.00 ||
|
||||
| Currency: Bahamian Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Pakistani Rupee | "Rs" 0.00 | n | Rs 123.00 ||
|
||||
| Currency: Paraguayan Guarani | "Gs" 0.00 | n | Gs 123.00 ||
|
||||
| Currency: Bahraini Dinar | "din" 0.00 | n | din 123.00 ||
|
||||
| Currency: Panamanian Balboa | "B/" 0.00 | n | B/ 123.00 ||
|
||||
| Currency: Brazilian Riyal | "R$" 0.00 | n | R$ 123.00 ||
|
||||
| Currency: Belarusian ruble | "р" 0.00 | n | р 123.00 ||
|
||||
| Currency: Bermudian Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Bulgarian Lev | "lev" 0.00 | n | lev 123.00 ||
|
||||
| Currency: Iceland Krona | "kr" 0.00 | n | kr 123.00 ||
|
||||
| Currency: Bosnia and Herzegovina convertible mark | "KM" 0.00 | n | KM 123.00 ||
|
||||
| Currency: Polish Zloty | "z?" 0.00 | n | z? 123.00 ||
|
||||
| Currency: Boliviano | "Bs" 0.00 | n | Bs 123.00 ||
|
||||
| Currency: Belize Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Botswana Pula | "P" 0.00 | n | P 123.00 ||
|
||||
| Currency: Bhutan Nusam | "Nu" 0.00 | n | Nu 123.00 ||
|
||||
| Currency: Burundian Franc | "FBu" 0.00 | n | FBu 123.00 ||
|
||||
| Currency: North Korean Won | "?KP" 0.00 | n | ?KP 123.00 ||
|
||||
| Currency: Danish Krone | "kr" 0.00 | n | kr 123.00 ||
|
||||
| Currency: East Caribbean Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Dominican Peso | "RD$" 0.00 | n | RD$ 123.00 ||
|
||||
| Currency: Russian ruble | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Eritrean Nakfa | "Nfk" 0.00 | n | Nfk 123.00 ||
|
||||
| Currency: CFA franc | "CFA" 0.00 | n | CFA 123.00 ||
|
||||
| Currency: Philippine Peso | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Fijian Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Cape Verde Escudo | "CVE" 0.00 | n | CVE 123.00 ||
|
||||
| Currency: Falkland Islands Pound | "￡" 0.00 | n | ￡ 123.00 ||
|
||||
| Currency: Gambia Dalasi | "GMD" 0.00 | n | GMD 123.00 ||
|
||||
| Currency: Congolese Franc | "FrCD" 0.00 | n | FrCD 123.00 ||
|
||||
| Currency: Colombian Peso | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Costa Rican Colon | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Cuban Peso | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Cuban Convertible Peso | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Guyana Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Kazakhstan tenge | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Haitian Gourde | "HTG" 0.00 | n | HTG 123.00 ||
|
||||
| Currency: Korean Won | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Netherlands Antilles Guild | "NAf." 0.00 | n | NAf. 123.00 ||
|
||||
| Currency: Honduras Lalempira | "L" 0.00 | n | L 123.00 ||
|
||||
| Currency: Djiboutian Franc | "Fdj" 0.00 | n | Fdj 123.00 ||
|
||||
| Currency: Kyrgyzstan Som | "KGS" 0.00 | n | KGS 123.00 ||
|
||||
| Currency: Guinean Franc | "FG" 0.00 | n | FG 123.00 ||
|
||||
| Currency: Canadian Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Ghanaian Cedi | "GHS" 0.00 | n | GHS 123.00 ||
|
||||
| Currency: Cambodian Riel | "Riel" 0.00 | n | Riel 123.00 ||
|
||||
| Currency: Czech Koruna | "K?" 0.00 | n | K? 123.00 ||
|
||||
| Currency: Zimbabwe dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Qatari Rial | "Rial" 0.00 | n | Rial 123.00 ||
|
||||
| Currency: Cayman Islands Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Comorian Franc | "CF" 0.00 | n | CF 123.00 ||
|
||||
| Currency: Kuwaiti Dinar | "din" 0.00 | n | din 123.00 ||
|
||||
| Currency: Croatian Kuna | "kn" 0.00 | n | kn 123.00 ||
|
||||
| Currency: Kenyan Shilling | "Ksh" 0.00 | n | Ksh 123.00 ||
|
||||
| Currency: Lesotho Loti | "LSL" 0.00 | n | LSL 123.00 ||
|
||||
| Currency: Lao Kip | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Lebanese Pound | "L￡" 0.00 | n | L￡ 123.00 ||
|
||||
| Currency: Lithuanian Litas | "Lt" 0.00 | n | Lt 123.00 ||
|
||||
| Currency: Libyan Dinar | "din" 0.00 | n | din 123.00 ||
|
||||
| Currency: Libyan Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Rwandan franc | "RF" 0.00 | n | RF 123.00 ||
|
||||
| Currency: Romanian Lei | "RON" 0.00 | n | RON 123.00 ||
|
||||
| Currency: Madagascar Ariary | "Ar" 0.00 | n | Ar 123.00 ||
|
||||
| Currency: Maldivian Rufiyaa | "Rf" 0.00 | n | Rf 123.00 ||
|
||||
| Currency: Malawian Kwacha | "MWK" 0.00 | n | MWK 123.00 ||
|
||||
| Currency: Malaysian Ringgit | "RM" 0.00 | n | RM 123.00 ||
|
||||
| Currency: Macedonian Dinar | "din" 0.00 | n | din 123.00 ||
|
||||
| Currency: Mauritian Rupee | "MURs" 0.00 | n | MURs 123.00 ||
|
||||
| Currency: Mauritania Ouguiya | "MRO" 0.00 | n | MRO 123.00 ||
|
||||
| Currency: Mongolian Tugrik | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Bangladeshi Taka | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Peruvian New Sol | "S/" 0.00 | n | S/ 123.00 ||
|
||||
| Currency: Myanmar Kyat | "K" 0.00 | n | K 123.00 ||
|
||||
| Currency: Moldovan Lei | "MDL" 0.00 | n | MDL 123.00 ||
|
||||
| Currency: Moroccan Dirham | "dh" 0.00 | n | dh 123.00 ||
|
||||
| Currency: Mozambique Metical | "MTn" 0.00 | n | MTn 123.00 ||
|
||||
| Currency: Mexican Peso | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Namibian Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: South African Rand | "R" 0.00 | n | R 123.00 ||
|
||||
| Currency: South Sudanese Pound | "￡" 0.00 | n | ￡ 123.00 ||
|
||||
| Currency: Nicaragua Cordoba | "C$" 0.00 | n | C$ 123.00 ||
|
||||
| Currency: Nepalese Rupee | "Rs" 0.00 | n | Rs 123.00 ||
|
||||
| Currency: Nigerian Naira | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Norwegian Krone | "kr" 0.00 | n | kr 123.00 ||
|
||||
| Currency: Georgia Lari | "GEL" 0.00 | n | GEL 123.00 ||
|
||||
| Currency: RMB (Offshore) | "￥" 0.00 | n | ￥123.00 ||
|
||||
| Currency: Swedish Krona | "kr" 0.00 | n | kr 123.00 ||
|
||||
| Currency: Swiss Franc | "CHF" 0.00 | n | CHF 123.00 ||
|
||||
| Currency: Serbian Dinar | "din" 0.00 | n | din 123.00 ||
|
||||
| Currency: Sierra Leone Leone | "SLL" 0.00 | n | SLL 123.00 ||
|
||||
| Currency: Seychelles Rupee | "SCR" 0.00 | n | SCR 123.00 ||
|
||||
| Currency: Saudi Riyal | "Rial" 0.00 | n | Rial 123.00 ||
|
||||
| Currency: Sao Tome Dobra | "Db" 0.00 | n | Db 123.00 ||
|
||||
| Currency: St. Helena Pound | "￡" 0.00 | n | ￡ 123.00 ||
|
||||
| Currency: Sri Lankan Rupee | "Rs" 0.00 | n | Rs 123.00 ||
|
||||
| Currency: Swaziland Lilangeni | "SZL" 0.00 | n | SZL 123.00 ||
|
||||
| Currency: Sudanese Pound | "SDG" 0.00 | n | SDG 123.00 ||
|
||||
| Currency: Surinamese Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Solomon Islands Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Somali Shilling | "SOS" 0.00 | n | SOS 123.00 ||
|
||||
| Currency: Tajikistani Somoni | "Som" 0.00 | n | Som 123.00 ||
|
||||
| Currency: Pacific Franc | "FCFP" 0.00 | n | FCFP 123.00 ||
|
||||
| Currency: Thai Baht | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Tanzanian Shilling | "TSh" 0.00 | n | TSh 123.00 ||
|
||||
| Currency: Tongan Paanga | "T$" 0.00 | n | T$ 123.00 ||
|
||||
| Currency: Trinidad and Tobago Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Tunisian Dinar | "din" 0.00 | n | din 123.00 ||
|
||||
| Currency: Turkish Lira | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Vanuatu Vatu | "VUV" 0.00 | n | VUV 123.00 ||
|
||||
| Currency: Guatemalan Quetzal | "Q" 0.00 | n | Q 123.00 ||
|
||||
| Currency: Venezuelan Bolivar | "Bs" 0.00 | n | Bs 123.00 ||
|
||||
| Currency: Brunei Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Ugandan Shilling | "UGX" 0.00 | n | UGX 123.00 ||
|
||||
| Currency: Ukrainian Hryvnia | "грн." 0.00 | n | грн. 123.00 ||
|
||||
| Currency: Uruguayan Peso | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Uzbekistani Sum | "so?m" 0.00 | n | so?m 123.00 ||
|
||||
| Currency: Western Samoa Tala | "WST" 0.00 | n | WST 123.00 ||
|
||||
| Currency: Singapore Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: New Taiwan Dollar | "NT$" 0.00 | n | NT$ 123.00 ||
|
||||
| Currency: New Zealand Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Hungarian Forint | "Ft" 0.00 | n | Ft 123.00 ||
|
||||
| Currency: Syrian Pound | "￡" 0.00 | n | ￡ 123.00 ||
|
||||
| Currency: Jamaican Dollar | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: Armenian Dram | "Dram" 0.00 | n | Dram 123.00 ||
|
||||
| Currency: Yemeni Rial | "Rial" 0.00 | n | Rial 123.00 ||
|
||||
| Currency: Iraqi Dinar | "din" 0.00 | n | din 123.00 ||
|
||||
| Currency: Iranian Rial | "Rial" 0.00 | n | Rial 123.00 ||
|
||||
| Currency: Israeli New Shekel | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Indian Rupee | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Indonesian Rupiah | "Rp" 0.00 | n | Rp 123.00 ||
|
||||
| Currency: Jordanian Dinar | "din" 0.00 | n | din 123.00 ||
|
||||
| Currency: Vietnamese Dong | "?" 0.00 | n |? 123.00 ||
|
||||
| Currency: Zambian Kwacha | "ZMW" 0.00 | n | ZMW 123.00 ||
|
||||
| Currency: Gibraltar Pound | "￡" 0.00 | n | ￡ 123.00 ||
|
||||
| Currency: Chilean Peso | "$" 0.00 | n | $ 123.00 ||
|
||||
| Currency: China-Africa Financial Cooperation Franc | "FCFA" 0.00 | n | FCFA 123.00 ||
|
||||
|
||||
Notice: Import/export only considers the data style that the user sees. For example, the way to process the date format in excel is to convert the date into a number: 42736 represents 2017-1-1.
|
||||
File diff suppressed because it is too large
Load Diff
@@ -0,0 +1,221 @@
|
||||
|
||||
# Contribution guide
|
||||
|
||||
welcome! We are very happy that you are here and look forward to your interest in participating in Luckysheet contributions. Of course, before you participate in the Luckysheet contribution, please make sure to read the following full text:
|
||||
|
||||
## Our code of conduct
|
||||
|
||||
1. We promise to respect all those who participated in the contribution, not limited to those who raised questions, contributed documents and code, resolved bugs and other contributions;
|
||||
|
||||
2. We are obliged to abide by local laws and regulations, and we reject all behaviors with legal risks;
|
||||
3. We oppose any participant's derogatory comments, personal attacks, harassment or insult to others, and other non-professional behaviors;
|
||||
4. We have the right and responsibility to delete or edit content that does not comply with this code of conduct, not limited to code, issues, wikis, documents and others. Participants who do not comply with the code of conduct may be removed from the team;
|
||||
5. We accept the supervision of anyone, and anyone can report to us the facts that are found to be inconsistent with this code of conduct through problem feedback.
|
||||
|
||||
## How to participate in contributing?
|
||||
|
||||
* Contributed documents: Browsing the document can deepen your understanding of Luckysheet. Once you find that the document is not clearly written or the logic is confusing, you can correct, modify, and supplement. You can go to [Google Forum](https://groups.google.com/g/luckysheet) to give feedback
|
||||
* Contributing code: Welcome everyone to contribute code to the Luckysheet community, you are welcome to claim the Open state [Issues](https://github.com/mengshukeji/Luckysheet/issues) and unfinished features, submit a PR, and become one of the contributors If you find that some functions cannot meet your needs or have problems during use, please record in Issues
|
||||
* Participate in the issue discussion: you can post your suggestions under any [Issues](https://github.com/mengshukeji/Luckysheet/issues)
|
||||
* Review code: You can see PR submitted by all contributors on [Github](https://github.com/mengshukeji/Luckysheet), you can review their code and post your suggestions
|
||||
|
||||
## How to submit issues
|
||||
|
||||
Before you submit features/improvements, you should pay attention to the following points:
|
||||
|
||||
* Please confirm whether the feature/improvement has been submitted by others
|
||||
* An easy-to-understand title to explain the bug/submission feature/improvement you submitted
|
||||
* If it is a bug, describe the cause of the bug in detail. If it can be reproduced, please try to provide complete reproduction steps
|
||||
* If it is a feature, then the feature should have wide applicability, suitable for most users, and it is best to provide detailed design documents
|
||||
* If it is an improvement, describe the benefits of this improvement as clearly as possible
|
||||
|
||||
Specific steps:
|
||||
|
||||
* Create [Issues](https://github.com/mengshukeji/Luckysheet/issues) and describe the issue clearly
|
||||
* If you want to solve the issue, assign the issue to your own name. If you just submit a bug/feature/improvement and don’t have time to contribute code, set assignne to empty
|
||||
* If it is a relatively large feature/improvement, try to output the design document first and follow the [Luckysheet RFC](https://github.com/mengshukeji/Luckysheet-rfcs) process for others to review
|
||||
|
||||
## How to claim Issues
|
||||
|
||||
In Luckysheet's [Issues](https://github.com/mengshukeji/Luckysheet/issues) list, there are many issues created by others that have not been repaired. If you are interested, you can claim these issues. The steps to claim are as follows:
|
||||
|
||||
* Leave a message under the issue, express the idea of claiming the task, and specify **@I can solve it**
|
||||
* If the submitter has no comments, assign the issue to your own name and update the progress in time
|
||||
* If it is a relatively large feature, try to output the design document first and follow the [Luckysheet RFC](https://github.com/mengshukeji/Luckysheet-rfcs) process for others to review
|
||||
* Develop the code and submit the code to github
|
||||
|
||||
## How to submit code
|
||||
|
||||
1. Fork to own warehouse
|
||||
|
||||
Go to the Github page of [Luckysheet](https://github.com/mengshukeji/Luckysheet), and click the Fork button in the upper right corner to proceed.
|
||||
|
||||
2. Git clone to local
|
||||
|
||||
```shell
|
||||
git clone https://github.com/<your_github_name>/Luckysheet.git
|
||||
```
|
||||
|
||||
3. Establish a connection upstream
|
||||
|
||||
```shell
|
||||
|
||||
cd Luckysheet
|
||||
gitremote add upstream https://github.com/mengshukeji/Luckysheet.git
|
||||
```
|
||||
|
||||
4. Create a development branch
|
||||
|
||||
```shell
|
||||
git checkout -b dev
|
||||
```
|
||||
|
||||
5. Modify the submission code
|
||||
|
||||
```shell
|
||||
git add.
|
||||
npm run commit
|
||||
git push origin dev
|
||||
```
|
||||
|
||||
6. Sync code, synchronize the latest code to the local
|
||||
|
||||
```shell
|
||||
git fetch upstream
|
||||
git rebase upstream/master
|
||||
```
|
||||
|
||||
7. If there is a conflict (nothing can be ignored)
|
||||
|
||||
```shell
|
||||
git status # View conflict files and modify conflicts
|
||||
git add.
|
||||
git rebase --continue
|
||||
```
|
||||
When submitting the git rebase --continue command, if vim prompts to edit the commit information, you can add your changes, then save and exit
|
||||
> For vim commands, please refer to the [vim](https://www.runoob.com/linux/linux-vim.html)
|
||||
|
||||
8. Submit branch code
|
||||
|
||||
```shell
|
||||
git push origin dev
|
||||
```
|
||||
|
||||
If you are prompted to pull first, you can pull it before submitting
|
||||
```shell
|
||||
git pull origin dev
|
||||
git push origin dev
|
||||
```
|
||||
If the vim prompt to edit the commit information pops up, you can exit directly through the vim command
|
||||
> For vim commands, please refer to [vim](https://www.runoob.com/linux/linux-vim.html)
|
||||
|
||||
9. Submit pr
|
||||
Go to the fork project in your github warehouse, switch to the branch you just created and modified, click new pull request, and add the corresponding description, and finally click Create pull request to submit
|
||||
|
||||
## Code Specification
|
||||
|
||||
> General code specification example
|
||||
|
||||
* Keep the block depth to a minimum. Avoid nested If conditions as much as possible
|
||||
```js
|
||||
// CORRECT
|
||||
if (!comparison) return
|
||||
|
||||
if (variable) {
|
||||
for (const item of items) {}
|
||||
} else if (variable2) {
|
||||
// Do something here
|
||||
}
|
||||
|
||||
// INCORRECT
|
||||
if (comparison) {
|
||||
if (variable) {
|
||||
for (const item in items) {}
|
||||
} else if (variable2) {
|
||||
// Do something here
|
||||
}
|
||||
} else {
|
||||
return
|
||||
}
|
||||
```
|
||||
|
||||
* Do not use operands for chain comparison
|
||||
```js
|
||||
// CORRECT
|
||||
|
||||
if (cb) cb()
|
||||
if (!cb || (cb === fn)) cb()
|
||||
|
||||
// INCORRECT
|
||||
|
||||
cb && cb()
|
||||
(!cb || (cb === fn)) && cb()
|
||||
```
|
||||
|
||||
* All variables should be declared at the beginning of the block in alphabetical order
|
||||
```js
|
||||
// CORRECT
|
||||
function foo () {
|
||||
const foo ='bar'
|
||||
const bar ='foo'
|
||||
|
||||
if (conditional) {}
|
||||
|
||||
...
|
||||
|
||||
return foo
|
||||
}
|
||||
|
||||
// INCORRECT
|
||||
|
||||
function foo () {
|
||||
const foo ='bar'
|
||||
|
||||
if (conditional) {}
|
||||
|
||||
const bar ='foo'
|
||||
|
||||
...
|
||||
|
||||
return foo
|
||||
}
|
||||
```
|
||||
|
||||
* Return as soon as possible
|
||||
```js
|
||||
// CORRECT
|
||||
if (condition) return'foo'
|
||||
if (condition2) return'bar'
|
||||
// Return must have a blank line above
|
||||
return'fizz'
|
||||
|
||||
// INCORRECT
|
||||
const variable =''
|
||||
|
||||
if (condition) {
|
||||
variable ='foo'
|
||||
} else if (condition2) {
|
||||
variable ='bar'
|
||||
} else {
|
||||
variable ='fizz'
|
||||
}
|
||||
|
||||
return variable
|
||||
```
|
||||
|
||||
## How to contribute documents
|
||||
|
||||
## How to become Luckysheet Committer
|
||||
|
||||
As long as anyone contributes to the Luckysheet project, you are the officially recognized Contributor of the Luckysheet project. There is no exact standard for growing from Contributor to Committer, and there is no expected timetable, but Committer candidates are generally A long-term active contributor, becoming Committer does not require a huge architectural improvement contribution, or how many lines of code contributions, contributing code, contributing documents, participating in mailing list discussions, helping to answer questions, etc., are all ways to increase their influence .
|
||||
|
||||
List of potential contributions (in no particular order):
|
||||
|
||||
* Submit the bugs, features, and improvements you found to the issue
|
||||
* Update the official documents so that the project documents are the most recent, the best practices for writing Luckysheet, and various useful documents for the users
|
||||
* Perform test and report test results, performance test and other MQ performance comparison test, etc.
|
||||
* Review the work of others (including code and non-code) and publish your own suggestions
|
||||
* Guide new contributors and be familiar with the community process
|
||||
* Post a blog about Luckysheet
|
||||
* Any contribution to the development of the Luckysheet community
|
||||
* ......
|
||||
@@ -0,0 +1,809 @@
|
||||
# Table Data
|
||||
|
||||
## Get table data
|
||||
|
||||
- **Configuration**：
|
||||
|
||||
Configure the address of `updateUrl`, 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.
|
||||
|
||||
- **Format**：
|
||||
Through the global method `luckysheet.getluckysheetfile()`, the configuration information of all worksheets can be obtained.
|
||||
|
||||
The luckysheetfile example is as follows:
|
||||
```json
|
||||
[
|
||||
{
|
||||
"name": "Cell", //Worksheet name
|
||||
"color": "", //Worksheet color
|
||||
"index": "0", //Worksheet index
|
||||
"status": "1", //Activation status
|
||||
"order": "0", //The order of the worksheet
|
||||
"hide": 0,//whether to hide
|
||||
"row": 36, //number of rows
|
||||
"column": 18, //Number of columns
|
||||
"config": {
|
||||
"merge":{}, //merged cells
|
||||
"rowlen":{}, //Table row height
|
||||
"columnlen":{}, //Table column width
|
||||
"rowhidden":{}, //hidden rows
|
||||
"colhidden":{}, //hidden columns
|
||||
"borderInfo":{}, //borders
|
||||
},
|
||||
"celldata": [], //initialize the cell data
|
||||
"data": [], //Update and store the cell data
|
||||
"scrollLeft": 0, //Left and right scroll bar position
|
||||
"scrollTop": 315, //Up and down scroll bar position
|
||||
"luckysheet_select_save": [], //selected area
|
||||
"luckysheet_conditionformat_save": {},//Conditional format
|
||||
"calcChain": [],//Formula chain
|
||||
"isPivotTable":false,//Whether to pivot table
|
||||
"pivotTable":{},//Pivot table configuration
|
||||
"filter_select": null,//Filter range
|
||||
"filter": null,//Filter configuration
|
||||
"luckysheet_alternateformat_save": [], //Alternate colors
|
||||
"luckysheet_alternateformat_save_modelCustom": [], //Customize alternate colors
|
||||
"chart": [], //Chart configuration
|
||||
"visibledatarow": [], //The position of all rows
|
||||
"visibledatacolumn": [], //The position of all columns
|
||||
"ch_width": 2322, //The width of the worksheet area
|
||||
"rh_height": 949, //The height of the worksheet area
|
||||
},
|
||||
{
|
||||
"name": "Sheet2",
|
||||
"color": "",
|
||||
"status": "0",
|
||||
"order": "1",
|
||||
"data": [],
|
||||
"config": {},
|
||||
"index": 1
|
||||
},
|
||||
{
|
||||
"name": "Sheet3",
|
||||
"color": "",
|
||||
"status": "0",
|
||||
"order": "2",
|
||||
"data": [],
|
||||
"config": {},
|
||||
"index": 2
|
||||
}
|
||||
]
|
||||
```
|
||||
- **Explanation**：
|
||||
|
||||
## name
|
||||
- Type：String
|
||||
- Default："Sheet1"
|
||||
- Usage：Worksheet name
|
||||
|
||||
------------
|
||||
## color
|
||||
- Type：String
|
||||
- Default："##f20e0e"
|
||||
- Usage：Worksheet color, there will be a bottom border under the worksheet name
|
||||
|
||||
------------
|
||||
## index
|
||||
- Type：Number
|
||||
- Default：0
|
||||
- Usage：Worksheet index, starting from 0
|
||||
|
||||
------------
|
||||
## status
|
||||
- Type：Number
|
||||
- Default：1
|
||||
- Usage：Active state, there is only one active worksheet which number will be 1 and the other worksheets are 0
|
||||
|
||||
------------
|
||||
## order
|
||||
- Type：Number
|
||||
- Default：0
|
||||
- Usage： The index of the worksheets is starting from 0. it will increase when a worksheet is added.
|
||||
|
||||
------------
|
||||
## hide
|
||||
- Type：Number
|
||||
- Default：0
|
||||
- Usage： Whether to hide, `0` means not to hide, `1` means to hide
|
||||
|
||||
------------
|
||||
## row
|
||||
- Type：Number
|
||||
- Default：36
|
||||
- Usage： The number of cell rows
|
||||
|
||||
------------
|
||||
## column
|
||||
- Type：Number
|
||||
- Default：18
|
||||
- Usage： The number of cell columns
|
||||
|
||||
------------
|
||||
## scrollLeft
|
||||
- Type：Number
|
||||
- Default：0
|
||||
- Usage： Left and right scroll bar position
|
||||
|
||||
------------
|
||||
## scrollTop
|
||||
- Type：Number
|
||||
- Default：0
|
||||
- Usage： Up and down scroll bar position
|
||||
|
||||
------------
|
||||
## config
|
||||
- Type: Object
|
||||
- Default: {}
|
||||
- Usage: Table row height, column width, merged cells, borders, hidden rows and other settings
|
||||
|
||||
### config.merge
|
||||
- Type：Object
|
||||
- Default：{}
|
||||
- Usage：Merge cell settings
|
||||
- example:
|
||||
```js
|
||||
{
|
||||
"13_5": {
|
||||
"r": 13,
|
||||
"c": 5,
|
||||
"rs": 3,
|
||||
"cs": 1
|
||||
},
|
||||
"13_7": {
|
||||
"r": 13,
|
||||
"c": 7,
|
||||
"rs": 3,
|
||||
"cs": 2
|
||||
},
|
||||
"14_2": {
|
||||
"r": 14,
|
||||
"c": 2,
|
||||
"rs": 1,
|
||||
"cs": 2
|
||||
}
|
||||
}
|
||||
```
|
||||
The `key` in the object is the spliced value of `r +'_' + c`, and the `value` is the cell information in the upper left corner: r: number of rows, c: number of columns, rs: number of merged rows, cs: merge Number of columns
|
||||
|
||||
### config.rowlen
|
||||
- Type：Object
|
||||
- Default：{}
|
||||
- Usage：The row height of each cell
|
||||
- example:
|
||||
```js
|
||||
"rowlen": {
|
||||
"0": 20,
|
||||
"1": 20,
|
||||
"2": 20
|
||||
}
|
||||
```
|
||||
|
||||
### config.columnlen
|
||||
- Type：Object
|
||||
- Default：{}
|
||||
- Usage：The column width of each cell
|
||||
- example:
|
||||
```js
|
||||
"columnlen": {
|
||||
"0": 97,
|
||||
"1": 115,
|
||||
"2": 128
|
||||
}
|
||||
```
|
||||
|
||||
### config.rowhidden
|
||||
- Type：Object
|
||||
- Default：{}
|
||||
- Usage：Hidden row information, Rows：`rowhidden[Rows]: 0`,
|
||||
|
||||
you should specify the number of rows by `key`,`value` is always `0`
|
||||
- example:
|
||||
```js
|
||||
"rowhidden": {
|
||||
"30": 0,
|
||||
"31": 0
|
||||
}
|
||||
```
|
||||
|
||||
### config.colhidden
|
||||
- Type：Object
|
||||
- Default：{}
|
||||
- Usage：Hidden column information, Columns：`colhidden[Columns]: 0`,
|
||||
|
||||
`key` specify the number of columns,`value` is always `0`
|
||||
- example:
|
||||
```js
|
||||
"colhidden": {
|
||||
"30": 0,
|
||||
"31": 0
|
||||
}
|
||||
```
|
||||
|
||||
### config.borderInfo
|
||||
- Type：Array
|
||||
- Default：{}
|
||||
- Usage：The border information of the cell
|
||||
- example:
|
||||
```js
|
||||
"borderInfo": [{
|
||||
"rangeType": "cell",
|
||||
"value": {
|
||||
"row_index": 3,
|
||||
"col_index": 3,
|
||||
"l": {
|
||||
"style": 10,
|
||||
"color": "rgb(255, 0, 0)"
|
||||
},
|
||||
"r": {
|
||||
"style": 10,
|
||||
"color": "rgb(255, 0, 0)"
|
||||
},
|
||||
"t": {
|
||||
"style": 10,
|
||||
"color": "rgb(255, 0, 0)"
|
||||
},
|
||||
"b": {
|
||||
"style": 10,
|
||||
"color": "rgb(255, 0, 0)"
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
"rangeType": "range",
|
||||
"borderType": "border-all",
|
||||
"style": "3",
|
||||
"color": "#0000ff",
|
||||
"range": [{
|
||||
"row": [7, 8],
|
||||
"column": [2, 3]
|
||||
}]
|
||||
}, {
|
||||
"rangeType": "range",
|
||||
"borderType": "border-inside",
|
||||
"style": "3",
|
||||
"color": "#0000ff",
|
||||
"range": [{
|
||||
"row": [7, 8],
|
||||
"column": [8, 9]
|
||||
}]
|
||||
}]
|
||||
```
|
||||
The range type can be divided into single cell and selected area
|
||||
1. selection `rangeType: "range"`
|
||||
|
||||
+ Border type `borderType："border-left" | "border-right" | "border-top" | "border-bottom" | "border-all" | "border-outside" | "border-inside" | "border-horizontal" | "border-vertical" | "border-none"`,
|
||||
+ Border thickness `style: 1 Thin | 2 Hair | 3 Dotted | 4 Dashed | 5 DashDot | 6 DashDotDot | 7 Double | 8 Medium | 9 MediumDashed | 10 MediumDashDot | 11 MediumDashDotDot | 12 SlantedDashDot | 13 Thick`
|
||||
+ Border color `color: Hexadecimal color value`
|
||||
+ Selection area `range: Row and column information array`
|
||||
|
||||
2. Single cell `rangeType："cell"`
|
||||
+ Number of rows and columns `value.row_index: number,value.col_index: number`
|
||||
+ Four border objects `value.l:Left border,value.r:Right border,value.t:Top border,value.b:Bottom border`
|
||||
+ Border thickness `value.l.style: 1 Thin | 2 Hair | 3 Dotted | 4 Dashed | 5 DashDot | 6 DashDotDot | 7 Double | 8 Medium | 9 MediumDashed | 10 MediumDashDot | 11 MediumDashDotDot | 12 SlantedDashDot | 13 Thick`
|
||||
+ Border color `value.l.color: Hexadecimal color value`
|
||||
|
||||
- 示例
|
||||
+ ```js
|
||||
{
|
||||
"rangeType": "range",
|
||||
"borderType": "border-all",
|
||||
"style": "3",
|
||||
"color": "#0000ff",
|
||||
"range": [{
|
||||
"row": [7, 8],
|
||||
"column": [2, 3]
|
||||
}]
|
||||
}
|
||||
```
|
||||
Represents a selection with a setting range of `{"row": [7, 8], "column": [2, 3]}`, the type is all borders, the border thickness is `Dotted`, and the color is `"#0000ff"`
|
||||
|
||||
+ ```js
|
||||
{
|
||||
"rangeType": "cell",
|
||||
"value": {
|
||||
"row_index": 3,
|
||||
"col_index": 3,
|
||||
"l": {
|
||||
"style": 10,
|
||||
"color": "rgb(255, 0, 0)"
|
||||
},
|
||||
"r": {
|
||||
"style": 10,
|
||||
"color": "rgb(255, 0, 0)"
|
||||
},
|
||||
"t": {
|
||||
"style": 10,
|
||||
"color": "rgb(255, 0, 0)"
|
||||
},
|
||||
"b": {
|
||||
"style": 10,
|
||||
"color": "rgb(255, 0, 0)"
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
Means to set the cell `"D4"`, the upper border/lower border/left border/right border are all border thicknesses `"MediumDashDot"`, color is `"rgb(255, 0, 0)"`
|
||||
|
||||
------------
|
||||
## celldata
|
||||
- Type：Array
|
||||
- Default：[]
|
||||
- Usage： The original cell data set is a set containing `{r:0,c:0,v:{m:"value",v:"value",ct: {fa: "General", t: "g"}} }`The one-dimensional array of format cell information is only used during initialization. After the table is initialized with celldata, the data is converted to the same level field data in the luckysheetfile, such as `luckysheetfile[0].data`, the subsequent operation of the table Data update will be updated to this data field, and celldata is no longer used. Example:
|
||||
```js
|
||||
[{
|
||||
"r": 0,
|
||||
"c": 0,
|
||||
"v": {
|
||||
ct: {fa: "General", t: "g"},
|
||||
m:"value1",
|
||||
v:"value1"
|
||||
}
|
||||
}, {
|
||||
"r": 0,
|
||||
"c": 1,
|
||||
"v": {
|
||||
ct: {fa: "General", t: "g"},
|
||||
m:"value2",
|
||||
v:"value2"
|
||||
}
|
||||
}]
|
||||
```
|
||||
|
||||
------------
|
||||
## luckysheet_select_save
|
||||
- Type：Array
|
||||
- Default：[]
|
||||
- Usage： The selected area supports multiple selections and is a one-dimensional array containing multiple selection objects. Example:
|
||||
```js
|
||||
[
|
||||
{
|
||||
"left": 0,
|
||||
"width": 97,
|
||||
"top": 0,
|
||||
"height": 20,
|
||||
"left_move": 0,
|
||||
"width_move": 97,
|
||||
"top_move": 0,
|
||||
"height_move": 41,
|
||||
"row": [ 0, 1 ],
|
||||
"column": [ 0, 0 ],
|
||||
"row_focus": 0,
|
||||
"column_focus": 0
|
||||
},
|
||||
{
|
||||
"left": 98,
|
||||
"width": 73,
|
||||
"top": 63,
|
||||
"height": 20,
|
||||
"left_move": 98,
|
||||
"width_move": 189,
|
||||
"top_move": 63,
|
||||
"height_move": 41,
|
||||
"row": [ 3, 4 ],
|
||||
"column": [ 1, 2 ],
|
||||
"row_focus": 3,
|
||||
"column_focus": 1
|
||||
},
|
||||
{
|
||||
"left": 288,
|
||||
"width": 128,
|
||||
"top": 21,
|
||||
"height": 20,
|
||||
"left_move": 288,
|
||||
"width_move": 128,
|
||||
"top_move": 21,
|
||||
"height_move": 62,
|
||||
"row": [ 1, 3 ],
|
||||
"column": [ 3, 3 ],
|
||||
"row_focus": 1,
|
||||
"column_focus": 3
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
------------
|
||||
## luckysheet_conditionformat_save
|
||||
- Type：Array
|
||||
- Default：[]
|
||||
- Usage： Conditional format configuration information, a one-dimensional array containing multiple conditional format configuration objects,
|
||||
|
||||
type: "default": Highlight cell rules and project selection rules,
|
||||
|
||||
"dataBar": Data bar,
|
||||
|
||||
"icons": Icon set,
|
||||
|
||||
"colorGradation": Color scale
|
||||
|
||||
Example:
|
||||
```js
|
||||
[
|
||||
{
|
||||
"type": "default",
|
||||
"cellrange": [
|
||||
{
|
||||
"row": [ 2, 7 ],
|
||||
"column": [ 2, 2 ]
|
||||
}
|
||||
],
|
||||
"format": {
|
||||
"textColor": "#000000",
|
||||
"cellColor": "#ff0000"
|
||||
},
|
||||
"conditionName": "betweenness",
|
||||
"conditionRange": [
|
||||
{
|
||||
"row": [ 4, 4 ],
|
||||
"column": [ 2, 2 ]
|
||||
},
|
||||
{
|
||||
"row": [ 6, 6 ],
|
||||
"column": [ 2, 2 ]
|
||||
}
|
||||
],
|
||||
"conditionValue": [ 2, 4
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "dataBar",
|
||||
"cellrange": [
|
||||
{
|
||||
"row": [ 10, 15 ],
|
||||
"column": [ 10, 11 ]
|
||||
}
|
||||
],
|
||||
"format": [
|
||||
"#6aa84f",
|
||||
"#ffffff"
|
||||
]
|
||||
},
|
||||
{
|
||||
"type": "icons",
|
||||
"cellrange": [
|
||||
{
|
||||
"row": [ 19, 23 ],
|
||||
"column": [ 2, 2 ]
|
||||
}
|
||||
],
|
||||
"format": {
|
||||
"len": "3",
|
||||
"leftMin": "0",
|
||||
"top": "0"
|
||||
}
|
||||
},
|
||||
{
|
||||
"type": "colorGradation",
|
||||
"cellrange": [
|
||||
{
|
||||
"left": 422,
|
||||
"width": 100,
|
||||
"top": 210,
|
||||
"height": 20,
|
||||
"left_move": 422,
|
||||
"width_move": 100,
|
||||
"top_move": 210,
|
||||
"height_move": 125,
|
||||
"row": [ 10, 15 ],
|
||||
"column": [ 6, 6 ],
|
||||
"row_focus": 10,
|
||||
"column_focus": 6
|
||||
}
|
||||
],
|
||||
"format": [
|
||||
"rgb(99, 190, 123)",
|
||||
"rgb(255, 235, 132)",
|
||||
"rgb(248, 105, 107)"
|
||||
]
|
||||
}
|
||||
]
|
||||
```
|
||||
|
||||
------------
|
||||
## calcChain
|
||||
- Type：Array
|
||||
- Default：[]
|
||||
- Usage：Formula chain, used when the cell linked by the formula is changed, all formulas referencing this cell will be refreshed, example:
|
||||
```js
|
||||
[{
|
||||
"r": 6,
|
||||
"c": 3,
|
||||
"index": 1,
|
||||
"func": [true, 23.75, "=AVERAGE(D3:D6)"],
|
||||
"color": "w",
|
||||
"parent": null,
|
||||
"chidren": {},
|
||||
"times": 0
|
||||
}, {
|
||||
"r": 7,
|
||||
"c": 3,
|
||||
"index": 1,
|
||||
"func": [true, 30, "=MAX(D3:D6)"],
|
||||
"color": "w",
|
||||
"parent": null,
|
||||
"chidren": {},
|
||||
"times": 0
|
||||
}]
|
||||
```
|
||||
|
||||
------------
|
||||
## isPivotTable
|
||||
- Type：Boolean
|
||||
- Default：false
|
||||
- Usage： Whether PivotTable
|
||||
|
||||
------------
|
||||
## pivotTable
|
||||
- Type：Object
|
||||
- Default：{}
|
||||
- Usage： Pivot table settings, example:
|
||||
```js
|
||||
{
|
||||
"pivot_select_save": {
|
||||
"left": 0,
|
||||
"width": 73,
|
||||
"top": 0,
|
||||
"height": 19,
|
||||
"left_move": 0,
|
||||
"width_move": 369,
|
||||
"top_move": 0,
|
||||
"height_move": 259,
|
||||
"row": [0, 12],
|
||||
"column": [0, 4],
|
||||
"row_focus": 0,
|
||||
"column_focus": 0
|
||||
},
|
||||
"pivotDataSheetIndex": 6, //The sheet index where the source data is located
|
||||
"column": [{
|
||||
"index": 3,
|
||||
"name": "subject",
|
||||
"fullname": "subject"
|
||||
}],
|
||||
"row": [{
|
||||
"index": 1,
|
||||
"name": "student",
|
||||
"fullname": "student"
|
||||
}],
|
||||
"filter": [],
|
||||
"values": [{
|
||||
"index": 4,
|
||||
"name": "score",
|
||||
"fullname": "count:score",
|
||||
"sumtype": "COUNTA",
|
||||
"nameindex": 0
|
||||
}],
|
||||
"showType": "column",
|
||||
"pivotDatas": [
|
||||
["count:score", "science", "mathematics", "foreign language", "English", "total"],
|
||||
["Alex", 1, 1, 1, 1, 4],
|
||||
["Joy", 1, 1, 1, 1, 4],
|
||||
["Tim", 1, 1, 1, 1, 4],
|
||||
["total", 3, 3, 3, 3, 12]
|
||||
],
|
||||
"drawPivotTable": false,
|
||||
"pivotTableBoundary": [5, 6]
|
||||
}
|
||||
```
|
||||
|
||||
------------
|
||||
## filter_select
|
||||
- Type：Object
|
||||
- Default：{}
|
||||
- Usage：Filter range, a selection area, a sheet has only one filter range, similar to the `luckysheet_select_save` example:
|
||||
```js
|
||||
{
|
||||
"left": 74,
|
||||
"width": 73,
|
||||
"top": 40,
|
||||
"height": 19,
|
||||
"left_move": 74,
|
||||
"width_move": 221,
|
||||
"top_move": 40,
|
||||
"height_move": 99,
|
||||
"row": [
|
||||
2,
|
||||
6
|
||||
],
|
||||
"column": [
|
||||
1,
|
||||
3
|
||||
],
|
||||
"row_focus": 2,
|
||||
"column_focus": 1
|
||||
}
|
||||
```
|
||||
|
||||
------------
|
||||
## filter
|
||||
- Type：Object
|
||||
- Default：{}
|
||||
- Usage： Specific settings for filtering, examples:
|
||||
```js
|
||||
{
|
||||
"0": {
|
||||
"caljs": {},
|
||||
"rowhidden": {
|
||||
"3": 0,
|
||||
"4": 0
|
||||
},
|
||||
"optionstate": true,
|
||||
"str": 2,
|
||||
"edr": 6,
|
||||
"cindex": 1,
|
||||
"stc": 1,
|
||||
"edc": 3
|
||||
},
|
||||
"1": {
|
||||
"caljs": {},
|
||||
"rowhidden": {
|
||||
"6": 0
|
||||
},
|
||||
"optionstate": true,
|
||||
"str": 2,
|
||||
"edr": 6,
|
||||
"cindex": 2,
|
||||
"stc": 1,
|
||||
"edc": 3
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
------------
|
||||
## luckysheet_alternateformat_save
|
||||
- Type：Array
|
||||
- Default：[]
|
||||
- Usage： Alternating color configuration, example:
|
||||
```js
|
||||
[{
|
||||
"cellrange": {
|
||||
"row": [1, 6],
|
||||
"column": [1, 5]
|
||||
},
|
||||
"format": {
|
||||
"head": {
|
||||
"fc": "#000",
|
||||
"bc": "#5ed593"
|
||||
},
|
||||
"one": {
|
||||
"fc": "#000",
|
||||
"bc": "#ffffff"
|
||||
},
|
||||
"two": {
|
||||
"fc": "#000",
|
||||
"bc": "#e5fbee"
|
||||
},
|
||||
"foot": {
|
||||
"fc": "#000",
|
||||
"bc": "#a5efcc"
|
||||
}
|
||||
},
|
||||
"hasRowHeader": false,
|
||||
"hasRowFooter": false
|
||||
}, {
|
||||
"cellrange": {
|
||||
"row": [1, 6],
|
||||
"column": [8, 12]
|
||||
},
|
||||
"format": {
|
||||
"head": {
|
||||
"fc": "#000",
|
||||
"bc": "#5599fc"
|
||||
},
|
||||
"one": {
|
||||
"fc": "#000",
|
||||
"bc": "#ffffff"
|
||||
},
|
||||
"two": {
|
||||
"fc": "#000",
|
||||
"bc": "#ecf2fe"
|
||||
},
|
||||
"foot": {
|
||||
"fc": "#000",
|
||||
"bc": "#afcbfa"
|
||||
}
|
||||
},
|
||||
"hasRowHeader": false,
|
||||
"hasRowFooter": false
|
||||
}]
|
||||
```
|
||||
|
||||
------------
|
||||
## luckysheet_alternateformat_save_modelCustom
|
||||
- Type：Array
|
||||
- Default：[]
|
||||
- Usage：Custom alternate colors, including multiple custom alternate colors configuration, example:
|
||||
```js
|
||||
[{
|
||||
"head": {
|
||||
"fc": "#6aa84f",
|
||||
"bc": "#ffffff"
|
||||
},
|
||||
"one": {
|
||||
"fc": "#000",
|
||||
"bc": "#ffffff"
|
||||
},
|
||||
"two": {
|
||||
"fc": "#000",
|
||||
"bc": "#e5fbee"
|
||||
},
|
||||
"foot": {
|
||||
"fc": "#000",
|
||||
"bc": "#a5efcc"
|
||||
}
|
||||
}]
|
||||
```
|
||||
|
||||
------------
|
||||
## chart
|
||||
- Type：Array
|
||||
- Default：[]
|
||||
- Usage： Chart configuration (under development)
|
||||
|
||||
------------
|
||||
## visibledatarow
|
||||
- Type：Number
|
||||
- Default：[]
|
||||
- Usage： Position information of all rows, incremental row position data, No need to set up for initialization
|
||||
|
||||
------------
|
||||
## visibledatacolumn
|
||||
- Type：Number
|
||||
- Default：[]
|
||||
- Usage： Position information of all columns, incremental column position data, No need to set up for initialization
|
||||
|
||||
------------
|
||||
## ch_width
|
||||
- Type：Number
|
||||
- Default：2322
|
||||
- Usage：The width of the entire worksheet area (the gray area including the border), No need to set up for initialization
|
||||
|
||||
------------
|
||||
## rh_height
|
||||
- Type：Number
|
||||
- Default：2322
|
||||
- Usage：The height of the entire worksheet area (the gray area containing the border), No need to set up for initialization
|
||||
|
||||
------------
|
||||
|
||||
## Get sheet data
|
||||
|
||||
- **Configuration**：
|
||||
|
||||
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
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"1": [{r:0, c:1, v:"value 1"},{r:10, c:11, v:"value 2"}],
|
||||
"2": [data],
|
||||
"3": [data],
|
||||
}
|
||||
```
|
||||
- **Explanation**：
|
||||
|
||||
`r` stands for row, `c` stands for column, and `v` stands for the value of the cell. The value can be a character, number, or json string.
|
||||
|
||||
The data will only be loaded once, generally speaking, there is only one primary key, but considering that some formulas, charts and pivot tables will refer to the data of other sheets, the front desk will add a judgment, if the current sheet refers to the data of other sheets, then complete the data of the referenced sheet together.
|
||||
|
||||
## Update data
|
||||
|
||||
- **Configuration**：
|
||||
|
||||
Configure the address of `updateUrl`, and the parameter sent to the backend is a json string.
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
compress: false,
|
||||
gridKey:10004,
|
||||
data: [update data]
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
| Parameter | Explanation | Example |
|
||||
| ------------ | ------------ | ------------ |
|
||||
| compress | Luckysheet uses client pako for zlib parameter compression, which is true if the browser supports compression, otherwise false. The backend can decide whether to decompress the data content based on this parameter | The process of obtaining parameters on the server side: 1. Serialize json string 2. Decode the data field if the compress field is TRUE 3. Decode the data string URLDecoder.decode(utf-8) |
|
||||
| gridKey | Luckysheet file identifier | none |
|
||||
| data | An array containing updated data. For the parameter format in the array, please see the introduction below. In the example: `t` indicates the update type, `i` is the index of the sheet, `c` is the row number, `r` is the column number, and `v` is the value | `data: [{ t : 'cell', i:0, c : 0, r : 0 , v: 2 }]` |
|
||||
@@ -0,0 +1,903 @@
|
||||
# Table Operation
|
||||
`luckysheet` stores all operations in the history to `undo` and `redo`. If `allowupdate` is set to true and `updateURL` is available in initial, operations will be updated on the backend in real-time via webSocket. And every one can edit same sheet on the same time.
|
||||
|
||||
>Source code [`src/controllers/server.js`] (https://github.com/mengshukeji/Luckysheet/blob/master/src/controllers/server.js) The module shows us the function of background saving.
|
||||
|
||||
In general, shared editing(or collaborative editing) is controled by the account system created by developers to control permissions.
|
||||
|
||||
The following are all types of operations that support transferring to the background. In this case, I use mongodb as a storage example to explain how front-end and back-end interacts with eachother.
|
||||
|
||||
Pay attention, `i` in the object is the `index` of the sheet rather than `order`.
|
||||
## Cell refresh
|
||||
### single cell refresh
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "v",
|
||||
"i": "Sheet_0554kKiKl4M7_1597974810804",
|
||||
"v": {
|
||||
"v": 233,
|
||||
"ct": { "fa": "General", "t": "n" },
|
||||
"m": "233"
|
||||
},
|
||||
"r": 0,
|
||||
"c": 1
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|i|The index value of the current sheet|
|
||||
|v|Cell value, refer to [单元格属性表](/zh/guide/cell.html#基本单元格)|
|
||||
|r|Row number of cell|
|
||||
|c|The column number of the cell|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
The cell update is mainly to update the `luckysheetfile[i].celldata` parameter, which is an array:
|
||||
```json
|
||||
[
|
||||
{r:0, c:1, v: "value1"},
|
||||
{r:10, c:11, v:"value2"},
|
||||
{r:10, c:11, v:{f:"=sum", v:"100"}}
|
||||
]
|
||||
```
|
||||
Store the values in all the cells in the sheet, Luckysheet will create a new table data according to the number of rows and columns in `luckysheetfile[i].row` and `luckysheetfile[i].column` when it is created, and then use `data[ r][c]=v` to fill the table data, empty data cells are represented by null.
|
||||
|
||||
When saving the data posted by the frontend, the backend needs to convert the parameters to the format of `{r:0, c:1:v:100}` first, and then update the field of `luckysheetfile[i].celldata`, if the cell exists the cell is updated, if not, it is added, and if the cell exists but `v` is null, the cell is deleted.
|
||||
|
||||
- **Frontend view**：
|
||||
|
||||
You can modify the value of any cell, and then go to the chrome console to view the operation of `"t"=="v"`.
|
||||
|
||||
## Config operation
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "cg",
|
||||
"i": 3,
|
||||
"v": {
|
||||
"7": 192
|
||||
},
|
||||
"k": "rowlen"
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|i|The index value of the current sheet|
|
||||
|v|The internal key-value that needs to be updated|
|
||||
|k|Operation key name|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
Update `luckysheetfile[i].config.[k][v.key] = v.value`, if `k` does not exist in `config`, then create a new `k` attribute and set it to empty, If there is no `v.key` in `k`, create a new `v.key` and update `v.value`.
|
||||
|
||||
1. Examples of modifying row height:
|
||||
- Enter: `{"t":"cg","i":3,"v":{"3":10, "5":70, "10":100},"k":" rowlen"}`
|
||||
- Update: `luckysheetfile[3].config.["rowlen"]["3"] = 10`
|
||||
|
||||
2. Examples of modifying column width:
|
||||
- Enter: `{"t":"cg","i":1,"v":{"20":74, "15":170, "6":40},"k":" columnlen"}`
|
||||
- Update: `luckysheetfile[1].config.["columnlen"]["20"] = 74`
|
||||
|
||||
3. Examples of merged cells:
|
||||
- Enter: `{"t":"cg","i":1,"v":{"5_10":{row:[1,3], column:[3,5]},"k":" merge "}`
|
||||
- Update: `luckysheetfile[1].config.["merge"]["5_10"] = {row:[1,3], column:[3,5]}`
|
||||
|
||||
## General save
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "all",
|
||||
"i": 3,
|
||||
"v": {
|
||||
"v": 1,
|
||||
"m":1,
|
||||
},
|
||||
"k": "freezen",
|
||||
"s": false
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|i|The index value of the current sheet|
|
||||
|v|The internal key-value that needs to be updated|
|
||||
|k|The `value` in the key-value that needs to be saved|
|
||||
|s|If it is `true` then `v` is saved as a string, otherwise it is saved according to the object|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
`luckysheetfile[3].[k]= v`
|
||||
If `s` is `true`, it is `luckysheetfile[3].[k]= JSON.stringify(v)`
|
||||
|
||||
1. Pivot table:
|
||||
- Enter: `{"t":"all","i":1,"v":{………},"k":"pivotTable", "s": false}`
|
||||
- Update: `luckysheetfile[1].["pivotTable"] = {………}`
|
||||
|
||||
2. Freeze rows and columns:
|
||||
- Enter: `{"t":"all","i":3,"v":{………},"k":"freezen", "s": false}`
|
||||
- Update: `luckysheetfile[3].["freezen"] = {………}`
|
||||
|
||||
3. Filter range:
|
||||
- Enter: `{"t":"all","i":3,"v":{………},"k":"filter_select", "s": true }`
|
||||
- Update: `luckysheetfile[3].["filter_select"] = JSON.stringify ({………})`
|
||||
|
||||
4. Sheet name:
|
||||
- Enter: `{"t":"all","i":1,"v":"doc","k":"name", "s": false}`
|
||||
- Update: `luckysheetfile[1].["name"] = "doc"`
|
||||
|
||||
5. Sheet color:
|
||||
- Enter: `{"t":"all","i":2,"v":"#FFF000","k":"color", "s": false}`
|
||||
- Update: `luckysheetfile[2].["color"] = "#FFF000"`
|
||||
|
||||
## Function chain operation
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "fc",
|
||||
"i": 0,
|
||||
"v": {
|
||||
"r": 3,
|
||||
"c": 7,
|
||||
"index": 0,
|
||||
"func": [
|
||||
true,
|
||||
187282,
|
||||
"=SUM(E4:G4)"
|
||||
]
|
||||
},
|
||||
"op": "add",
|
||||
"pos": 0
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|i|The index value of the current sheet|
|
||||
|v|Object value, the internal fields of the object do not need to be updated separately, so save as text|
|
||||
|op|Operation type, `add` is add, `update` is update, and `del` is delete|
|
||||
|pos|Updated or deleted function location|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
calcChain is an array
|
||||
- If the value of `op` is `add` then add to the end `luckysheetfile[i].calcChain.push (v)`，
|
||||
- If the value of `op` is `update` then update `luckysheetfile[i].calcChain[pos]= v`，
|
||||
- If the value of `op` is `del` then delete `luckysheetfile[i].calcChain.splice(pos, 1)`。
|
||||
|
||||
- **Frontend view**：
|
||||
|
||||
You can modify the value of any cell, and then go to the chrome console to view the operation of `"t"=="v"`.
|
||||
|
||||
## Row and column operations
|
||||
|
||||
### Delete rows or columns
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "drc",
|
||||
"i": 3,
|
||||
"v": {
|
||||
"index": 6,
|
||||
"len": 2
|
||||
},
|
||||
"rc": "r"
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<td colspan="2">Parameter</td>
|
||||
<td>Explanation</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">t</td>
|
||||
<td>Operation type symbol</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">i</td>
|
||||
<td>The index value of the current sheet</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">rc</td>
|
||||
<td>Row operation or column operation, the value `r` stands for row, and `c` stands for column</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td rowspan="2">v</td>
|
||||
<td>index</td>
|
||||
<td>Delete from which row or column</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>len</td>
|
||||
<td>Number of rows or columns deleted</td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
If the value of `rc` is `'r'` then delete the row, if the value of `rc` is `'c'` then delete the column, eg `rc='r'`, `index=4`, `len= 5`, means to delete the next 5 lines (4, 5, 6, 7, 8) from the 4th line.
|
||||
|
||||
Mainly operate on the cells in `luckysheetfile[i].celldata`, delete the qualified cells described in the parameters and update the row and column values of other cells. Taking the above as an example, first find the `r` in the cell Delete all the cells with values from 4 to 8, and then subtract the value of 5 from the original cell number 9 and later, and finally subtract 5 from `luckysheetfile[i].row`.
|
||||
If the `v` value is `"#__qkdelete#"` (without quotes), then this is the cell to be deleted.
|
||||
|
||||
- **Front view**：
|
||||
|
||||
You can delete rows or columns, and then go to the chrome console to view the operation of `"t"=="drc"`.
|
||||
|
||||
### Add rows or columns
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "arc",
|
||||
"i": 0,
|
||||
"v": {
|
||||
"index": 5,
|
||||
"len": 10,
|
||||
"data": []
|
||||
},
|
||||
"rc": "c"
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<td colspan="2">Parameter</td>
|
||||
<td>Explanation</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">t</td>
|
||||
<td>Operation type symbol</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">i</td>
|
||||
<td>The index value of the current sheet</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">rc</td>
|
||||
<td>Row operation or column operation, the value `r` stands for row, and `c` stands for column</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td rowspan="3">v</td>
|
||||
<td>index</td>
|
||||
<td>Start from which row or column</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>len</td>
|
||||
<td>How many rows or columns to add</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>data</td>
|
||||
<td>New row or column content</td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
If the value of `rc` is `r`, add a new row. If the value of `rc` is `c`, add a new column. For example, `rc=r, index=4, len=5` then it means increase 5 lines from line 4. If `data` is empty, add an empty line. If `data` is not empty, use the array in `data` to add a new line.
|
||||
|
||||
Mainly operate on the cells in `luckysheetfile[i].celldata`. Taking the above as an example, first add 5 to `luckysheetfile[i].row`, and then add `r` greater than 4 to the entire cell`r `Value +5, if `data` is empty, add an empty line to end, if `data` is not empty, convert the two-dimensional array `data` to `{r:0,c:0,v:100}` Format and added to `celldata`, the pseudo code for conversion is as follows:
|
||||
|
||||
```javascript
|
||||
var ret = [];
|
||||
for(var r=0;r<data.length;r++){
|
||||
for(var c=0;c<data[0].length;c++){
|
||||
if(d[r][c]==null){
|
||||
continue;
|
||||
}
|
||||
ret.push({r:r+5, c:c, v: data[r][c]});
|
||||
}
|
||||
}
|
||||
return ret;
|
||||
```
|
||||
|
||||
- **Front view**：
|
||||
You can add rows or columns, and then go to the chrome console to view the operation of `"t"=="arc"`. If you want to view the operation with the value of `data`, you can delete some rows or columns, and then undelete (Ctrl+Z), you can see.
|
||||
|
||||
## Filter operating
|
||||
|
||||
### Select filter condition
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "f",
|
||||
"i": 0,
|
||||
"v": "{\"caljs\":{},\"selected\":{\"Qingdao\":\"1\",\"Guangxi\":\"1\",\"Chongqing\":\"1\"},\"rowhidden\":{\"1\":0,\"2\":0,\"3\":0,\"4\":0,\"6\":0,\"7\":0,\"8\":0,\"9\":0,\"10\":0,\"11\":0,\"12\":0,\"13\":0,\"14\":0,\"15\":0,\"16\":0,\"17\":0,\"18\":0,\"19\":0,\"21\":0,\"22\":0,\"24\":0,\"25\":0,\"26\":0,\"27\":0,\"28\":0,\"29\":0,\"30\":0,\"31\":0,\"32\":0,\"33\":0,\"34\":0,\"35\":0}}",
|
||||
"op": "upOrAdd",
|
||||
"pos": 1
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|i|The index value of the current sheet|
|
||||
|v|Object value, the internal fields of the object do not need to be updated separately, so save as text|
|
||||
|op|The operation type `upOrAdd` is update, if it does not exist, it is added, and `del` is delete|
|
||||
|pos|Updated or deleted `option` location|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
Update `luckysheetfile[i].filter = {pos: v }`, the value of `v` is a string in JSON format. `filter` is a key-value pair, `key` is the index value (in characters) of the option position, and `v` is a json string parameter. `filter` represents a set of filter conditions.
|
||||
|
||||
### Clear filter
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "fsc",
|
||||
"i": 0,
|
||||
"v": null
|
||||
}
|
||||
```
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
Clear `luckysheetfile[i]. filter = null` ， `luckysheetfile[i]. filter_select = null`。
|
||||
|
||||
### Restore filter
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "fsr",
|
||||
"i": 0,
|
||||
"v": {
|
||||
"filter": [],
|
||||
"filter_select": {}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
Clear `luckysheetfile[i]. filter = v.filter`， `luckysheetfile[i]. filter_select = v. filter_select`。
|
||||
|
||||
## Sheet operation
|
||||
|
||||
### New sheet
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "sha",
|
||||
"i": null,
|
||||
"v": {
|
||||
"name": "Sheet4",
|
||||
"color": "",
|
||||
"status": "0",
|
||||
"order": 3,
|
||||
"index": 3,
|
||||
"data": [],
|
||||
"config": {},
|
||||
"pivotTable": null,
|
||||
"isPivotTable": false
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<td colspan="2">Parameter</td>
|
||||
<td>Explanation</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">t</td>
|
||||
<td>Operation type symbol</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">i</td>
|
||||
<td>The index value of the current sheet</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td rowspan="9">v</td>
|
||||
<td>name</td>
|
||||
<td>The index value of the sheet jumped after hiding</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>color</td>
|
||||
<td>Sheet color</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>status</td>
|
||||
<td>Active state</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>order</td>
|
||||
<td>Sheet order</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>index</td>
|
||||
<td>Sheet Index</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>celldata</td>
|
||||
<td>Cell dataset</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>config</td>
|
||||
<td>Setting</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>pivotTable</td>
|
||||
<td>Pivot table settings</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td>isPivotTable</td>
|
||||
<td>Whether the pivot table</td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
Add a line (a document) to the database.
|
||||
|
||||
### Copy sheet
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "shc",
|
||||
"i": "New sheet location",
|
||||
"v": {
|
||||
"copyindex": "copyindex"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
Copy the sheet index value in the table, set it to `copyindex` and add it to the database, set the `index` of the new document to the value corresponding to `i`.
|
||||
|
||||
### Delete sheet
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "shd",
|
||||
"i": null,
|
||||
"v": {
|
||||
"deleIndex": 0
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<td colspan="2">Parameter</td>
|
||||
<td>Explanation</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">t</td>
|
||||
<td>Operation type symbol</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td rowspan="2">v</td>
|
||||
<td>deleIndex</td>
|
||||
<td>The sheet index to be deleted</td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
Delete the sheet whose index is the value corresponding to `deleIndex`.
|
||||
|
||||
### restore from a deleted sheet
|
||||
|
||||
- **format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "shre",
|
||||
"i": null,
|
||||
"v": {
|
||||
"reIndex": "0"
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
<table>
|
||||
<tr>
|
||||
<td colspan="2">Parameter</td>
|
||||
<td>Explanation</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td colspan="2">t</td>
|
||||
<td>Operation type symbol</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td rowspan="2">v</td>
|
||||
<td>deleIndex</td>
|
||||
<td>需要恢复的sheet索引</td>
|
||||
</tr>
|
||||
|
||||
</table>
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
restore the sheet whose index is the number of `reIndex`.
|
||||
|
||||
### Position
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "shr",
|
||||
"i": null,
|
||||
"v": {
|
||||
"0": 1,
|
||||
"1": 0,
|
||||
"2": 2,
|
||||
"3": 3,
|
||||
"4": 4,
|
||||
"5": 5,
|
||||
"6": 6,
|
||||
"7": 7,
|
||||
"Sheet_6az6nei65t1i_1596209937084": 8
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|v|Set the sorting of Sheet as a key-value pair, `key` represents the index of the sheet, and `value` represents the order value. The format is: `{"1": 3, "2":1, "0": 2, "3":0}`|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
For the page where the `index` of the sheet is equal to the `key`, set its `order` attribute to the `value`. Examples:
|
||||
|
||||
`luckysheetfile[key1].order = value1`
|
||||
`luckysheetfile[key2].order = value2`
|
||||
`luckysheetfile[key3].order = value3`
|
||||
|
||||
### switch to the specified sheet
|
||||
|
||||
- **format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "shs",
|
||||
"i": null,
|
||||
"v": 1
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|v|index of the specified sheet|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
setting the `status` = `1`, when the `index` of a sheet is eaqul to `v`：
|
||||
|
||||
`luckysheetfile[v].status = 1`
|
||||
|
||||
## Sheet attributes (hide or show)
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "sh",
|
||||
"i": 0,
|
||||
"v": 1,
|
||||
"op": " hide",
|
||||
"cur": 2
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|i|The index value of the current sheet|
|
||||
|op|Operation options include hide and show|
|
||||
|v|Hide if `hide` is `1`, show if `0` or empty|
|
||||
|cur|After hiding, set sheet which index corresponding to the `cur` to the active state|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
The `hide` field of the root path of the sheet corresponding to `i` is updated to `v`. When hidden, the `status` value is `0`. When displayed, it is `1`. If hidden, the sheet which `cur` corresponds to `index`, its `status` is updated to `1`.
|
||||
|
||||
## Table information change
|
||||
|
||||
### Table name
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "na",
|
||||
"i": null,
|
||||
"v": "Data"
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|v|The name of the table|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
Update the table name in the database according to gridkey.
|
||||
|
||||
### Thumbnail
|
||||
|
||||
- **Format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "thumb",
|
||||
"img": "base64",
|
||||
"curindex": "curindx"
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|img|Thumbnail of current table, base64 string|
|
||||
|curindex|The current sheet opened by default|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
According to gridkey, update the thumbnail field of the table in mysql to the img value, and update the status field of the sheet whose index is the curindex value to 1, and set the status value of other sheets to 0.
|
||||
|
||||
## Chart(TODO)
|
||||
|
||||
There are four types of chart operations: add new chart -"add", move chart position-"xy", zoom chart-"wh", and update chart configuration-"update".
|
||||
|
||||
### new chart
|
||||
|
||||
- **format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "c",
|
||||
"i": 0,
|
||||
"op":"add",
|
||||
"v": {
|
||||
"chart_id": "chart_p145W6i73otw_1596209943446",
|
||||
"width": 400,
|
||||
"height": 250,
|
||||
"left": 20,
|
||||
"top": 120,
|
||||
"sheetIndex": "Sheet_6az6nei65t1i_1596209937084",
|
||||
"needRangeShow": true,
|
||||
"chartOptions": {
|
||||
"chart_id": "chart_p145W6i73otw_1596209943446",
|
||||
"chartAllType": "echarts|line|default",
|
||||
"rangeArray": [ { "row": [ 0, 4 ], "column": [ 0, 7 ] } ],
|
||||
"rangeColCheck": { "exits": true, "range": [ 0, 0 ] },
|
||||
"rangeRowCheck": { "exits": true, "range": [ 0, 0 ] },
|
||||
"rangeConfigCheck": false,
|
||||
"defaultOption": {
|
||||
"title": {
|
||||
"show": true,
|
||||
"text": "default title"
|
||||
}
|
||||
}
|
||||
},
|
||||
"isShow": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|i|The index value of the current sheet|
|
||||
|op|Operation options include hide and show|
|
||||
|v|configuration information of charts|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
update the chart settings in the current sheet,if`luckysheetfile[i].chart` is null，the array should be `[]` on initial.
|
||||
|
||||
```json
|
||||
luckysheetfile[0].chart.push(v)
|
||||
```
|
||||
|
||||
### move chart position
|
||||
|
||||
- **format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "c",
|
||||
"i": 0,
|
||||
"op":"xy",
|
||||
"v": {
|
||||
"chart_id": "chart_p145W6i73otw_1596209943446",
|
||||
"left": 20,
|
||||
"top": 120
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|i|The index value of the current sheet|
|
||||
|op|Operation options include hide and show|
|
||||
|v|configuration information of charts|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
update the chart settings in the current sheet
|
||||
|
||||
```js
|
||||
luckysheetfile[0].chart[v.chart_id].left = v.left;
|
||||
luckysheetfile[0].chart[v.chart_id].top = v.top;
|
||||
```
|
||||
|
||||
### zoom chart
|
||||
|
||||
- **format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "c",
|
||||
"i": 0,
|
||||
"op":"wh",
|
||||
"v": {
|
||||
"chart_id": "chart_p145W6i73otw_1596209943446",
|
||||
"width": 400,
|
||||
"height": 250,
|
||||
"left": 20,
|
||||
"top": 120
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|i|The index value of the current sheet|
|
||||
|op|Operation options include hide and show|
|
||||
|v|configuration information of charts|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
update the chart settings in the current sheet
|
||||
|
||||
```js
|
||||
luckysheetfile[0].chart[v.chart_id].left = v.left;
|
||||
luckysheetfile[0].chart[v.chart_id].top = v.top;
|
||||
luckysheetfile[0].chart[v.chart_id].width = v.width;
|
||||
luckysheetfile[0].chart[v.chart_id].height = v.height;
|
||||
```
|
||||
|
||||
### change the configuration of charts
|
||||
|
||||
- **format**：
|
||||
|
||||
```json
|
||||
{
|
||||
"t": "c",
|
||||
"i": 0,
|
||||
"op":"update",
|
||||
"v": {
|
||||
"chart_id": "chart_p145W6i73otw_1596209943446",
|
||||
"width": 400,
|
||||
"height": 250,
|
||||
"left": 20,
|
||||
"top": 120,
|
||||
"sheetIndex": "Sheet_6az6nei65t1i_1596209937084",
|
||||
"needRangeShow": true,
|
||||
"chartOptions": {
|
||||
"chart_id": "chart_p145W6i73otw_1596209943446",
|
||||
"chartAllType": "echarts|line|default",
|
||||
"rangeArray": [ { "row": [ 0, 4 ], "column": [ 0, 7 ] } ],
|
||||
"rangeColCheck": { "exits": true, "range": [ 0, 0 ] },
|
||||
"rangeRowCheck": { "exits": true, "range": [ 0, 0 ] },
|
||||
"rangeConfigCheck": false,
|
||||
"defaultOption": {
|
||||
"title": {
|
||||
"show": true,
|
||||
"text": "default title"
|
||||
}
|
||||
}
|
||||
},
|
||||
"isShow": true
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
- **Explanation**：
|
||||
|
||||
|Parameter|Explanation|
|
||||
| ------------ | ------------ |
|
||||
|t|Operation type symbol|
|
||||
|i|The index value of the current sheet|
|
||||
|op|Operation options include hide and show|
|
||||
|v|configuration information of charts|
|
||||
|
||||
- **Backend update**：
|
||||
|
||||
update the chart settings in the current sheet
|
||||
|
||||
```js
|
||||
luckysheetfile[0].chart[v.chart_id] = v;
|
||||
```
|
||||
|
||||
## Backend return format
|
||||
|
||||
Data format returned by websocket backend
|
||||
```js
|
||||
{
|
||||
createTime: command sending time
|
||||
data:{} modified command
|
||||
id: "7a" websocket id
|
||||
returnMessage: "success"
|
||||
status: "0" 0 tells the front end to modify according to the data command 1 meaningless
|
||||
type: 0: connection is successful, 1: send to the currently connected user, 2: send information to other users, 3: send selection location information, 999: user disconnected
|
||||
username: username
|
||||
}
|
||||
```
|
||||
@@ -0,0 +1,33 @@
|
||||
# Tutorials and resources
|
||||
|
||||
Open source software is inseparable from the contribution of the community. Here will be a list of tutorials, learning materials and supporting solutions provided by the community.
|
||||
|
||||
If you have written or found an excellent tutorial and want to recommend it to us, please directly [edit this page](https://github.com/mengshukeji/Luckysheet/edit/master/docs/guide/resource.md) submit a PR.
|
||||
|
||||
## Blog
|
||||
- [How Luckysheet initializes the data with merged cells](https://www.cnblogs.com/DuShuSir/p/13272397.html)[Pending translation]
|
||||
- [How Luckysheet saves the data in the table to the database](https://www.cnblogs.com/DuShuSir/p/13857874.html)[Pending translation]
|
||||
- [Case of introducing Luckysheet into local HTML using CDN loading](https://www.cnblogs.com/DuShuSir/p/13859103.html)[Pending translation]
|
||||
- [Basic usage of Luckysheet, use `loadUrl` to load server data](https://blog.csdn.net/DCDC2020/article/details/108486525)
|
||||
- [Luckysheet import and export implementation-Java background processing](https://blog.csdn.net/u014632228/article/details/109738221)
|
||||
|
||||
## Front-end case
|
||||
|
||||
### Community Case
|
||||
- [luckysheet-vue-importAndExport](https://github.com/oy-paddy/luckysheet-vue-importAndExport/tree/master/)
|
||||
|
||||
## Back-end case
|
||||
|
||||
### Official case
|
||||
- [Java backend Luckysheet Server](https://github.com/mengshukeji/LuckysheetServer)
|
||||
|
||||
### Community Case
|
||||
- [Luckysheet save and restore](https://gitee.com/ichiva/luckysheet-saved-in-recovery) (Java version)
|
||||
- [Online form for collaborative editing based on Luckysheet](https://github.com/DilemmaVi/ecsheet) (Java version)
|
||||
- [Simple Express.js server example template for individual use](https://github.com/TitanRGB/Luckysheet-ExpressReact-Example) (Node-Express version)
|
||||
- [Use .net core 3.1 and Npoi to make a basic export based on LuckSheet](https://gitee.com/xiong-kangli/luck-sheet_.-net-core) (.NET version)
|
||||
- [Collaborative editing in go language version](https://github.com/fandypeng/excel2config)（Go version）
|
||||
|
||||
## Learning Materials
|
||||
|
||||
- [How to build a web data analysis report from 0 to 1](https://github.com/mengshukeji/LuckyResources/blob/master/ppt/%E5%A6%82%E4%BD%95%E4%BB%8E0%E5%88%B01%E6%90%AD%E5%BB%BA%20Web%20%E6%95%B0%E6%8D%AE%E5%88%86%E6%9E%90%E6%8A%A5%E8%A1%A8.pptx)[Pending translation]
|
||||
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user