Browse Source

docs(api): readme

1.readme add forum 2.api docs add
getRowHeight/getColumnWidth/getDefaultRowHeight/getDefaultColumnWidth 3.demo add forum link
master
mengshukeji 5 years ago
parent
commit
30c6c58c0b
  1. 9
      README-zh.md
  2. 9
      README.md
  3. 100
      docs/guide/api.md
  4. 100
      docs/zh/guide/api.md
  5. 45
      docs/zh/guide/config.md
  6. 24
      src/demoData/demoFeature.js
  7. 5
      src/index.html

9
README-zh.md

@ -10,10 +10,10 @@
🚀Luckysheet ,一款纯前端类似excel的在线表格,功能强大、配置简单、完全开源。 🚀Luckysheet ,一款纯前端类似excel的在线表格,功能强大、配置简单、完全开源。
## 相关链接 ## 相关链接
| 源码 | 文档 | Demo | 插件Demo | | 源码 | 文档 | Demo | 插件Demo | 论坛 |
| ------ | -------- | ------ | ------ | | ------ | -------- | ------ | ------ | ------ |
| [Github](https://github.com/mengshukeji/Luckysheet)| [在线文档](https://mengshukeji.github.io/LuckysheetDocs/zh/) | [在线Demo](https://mengshukeji.github.io/LuckysheetDemo) | [导入Excel Demo](https://mengshukeji.github.io/LuckyexcelDemo/) | | [Github](https://github.com/mengshukeji/Luckysheet)| [在线文档](https://mengshukeji.github.io/LuckysheetDocs/zh/) | [在线Demo](https://mengshukeji.github.io/LuckysheetDemo) | [导入Excel Demo](https://mengshukeji.github.io/LuckyexcelDemo/) | [中文论坛](https://support.qq.com/product/288322) |
| [Gitee镜像](https://gitee.com/mengshukeji/Luckysheet)| [Gitee在线文档](https://mengshukeji.gitee.io/LuckysheetDocs/zh/) | [Gitee在线Demo](https://mengshukeji.gitee.io/luckysheetdemo/) | [Gitee导入Excel Demo](https://mengshukeji.gitee.io/luckyexceldemo/) | | [Gitee镜像](https://gitee.com/mengshukeji/Luckysheet)| [Gitee在线文档](https://mengshukeji.gitee.io/LuckysheetDocs/zh/) | [Gitee在线Demo](https://mengshukeji.gitee.io/luckysheetdemo/) | [Gitee导入Excel Demo](https://mengshukeji.gitee.io/luckyexceldemo/) | [Gitter](https://gitter.im/mengshukeji/Luckysheet) |
![演示](/docs/.vuepress/public/img/LuckysheetDemo.gif) ![演示](/docs/.vuepress/public/img/LuckysheetDemo.gif)
@ -200,6 +200,7 @@ npm run build
- [@danielcai1987](https://github.com/danielcai1987) - [@danielcai1987](https://github.com/danielcai1987)
- [@qq6690876](https://github.com/qq6690876) - [@qq6690876](https://github.com/qq6690876)
- [@javahuang](https://github.com/javahuang) - [@javahuang](https://github.com/javahuang)
- [@TimerGang](https://github.com/TimerGang)
- [@gsw945](https://github.com/gsw945) - [@gsw945](https://github.com/gsw945)
- [@swen-xiong](https://github.com/swen-xiong) - [@swen-xiong](https://github.com/swen-xiong)

9
README.md

@ -16,10 +16,10 @@ English| [简体中文](./README-zh.md)
🚀Luckysheet is an online spreadsheet like excel that is powerful, simple to configure, and completely open source. 🚀Luckysheet is an online spreadsheet like excel that is powerful, simple to configure, and completely open source.
## Links ## Links
| Source Code | Documentation | Demo | Plugins Demo | | Source Code | Documentation | Demo | Plugins Demo | Forum |
| ------ | -------- | ------ | ------ | | ------ | -------- | ------ | ------ | ------ |
| [Github](https://github.com/mengshukeji/Luckysheet)| [Online Documentation](https://mengshukeji.github.io/LuckysheetDocs/) | [Online Demo](https://mengshukeji.github.io/LuckysheetDemo) | [Import Excel Demo](https://mengshukeji.github.io/LuckyexcelDemo/) | | [Github](https://github.com/mengshukeji/Luckysheet)| [Online Documentation](https://mengshukeji.github.io/LuckysheetDocs/) | [Online Demo](https://mengshukeji.github.io/LuckysheetDemo) | [Import Excel Demo](https://mengshukeji.github.io/LuckyexcelDemo/) | [Chinese Forum](https://support.qq.com/product/288322) |
| [Gitee Mirror](https://gitee.com/mengshukeji/Luckysheet)| [Gitee Online Documentation](https://mengshukeji.gitee.io/LuckysheetDocs/) | [Gitee Online Demo](https://mengshukeji.gitee.io/luckysheetdemo/) | [Gitee Import Excel Demo](https://mengshukeji.gitee.io/luckyexceldemo/) | | [Gitee Mirror](https://gitee.com/mengshukeji/Luckysheet)| [Gitee Online Documentation](https://mengshukeji.gitee.io/LuckysheetDocs/) | [Gitee Online Demo](https://mengshukeji.gitee.io/luckysheetdemo/) | [Gitee Import Excel Demo](https://mengshukeji.gitee.io/luckyexceldemo/) | [Gitter](https://gitter.im/mengshukeji/Luckysheet) |
![Demo](/docs/.vuepress/public/img/LuckysheetDemo.gif) ![Demo](/docs/.vuepress/public/img/LuckysheetDemo.gif)
@ -196,6 +196,7 @@ Create a table
- [@danielcai1987](https://github.com/danielcai1987) - [@danielcai1987](https://github.com/danielcai1987)
- [@qq6690876](https://github.com/qq6690876) - [@qq6690876](https://github.com/qq6690876)
- [@javahuang](https://github.com/javahuang) - [@javahuang](https://github.com/javahuang)
- [@TimerGang](https://github.com/TimerGang)
- [@gsw945](https://github.com/gsw945) - [@gsw945](https://github.com/gsw945)
- [@swen-xiong](https://github.com/swen-xiong) - [@swen-xiong](https://github.com/swen-xiong)

100
docs/guide/api.md

@ -589,6 +589,106 @@ Use note:
------------ ------------
### getRowHeight(rowInfo [,setting])
(TODO)
- **Parameter**
- {Array} [rowInfo]: The number of rows
- {PlainObject} [setting]: optional parameters
+ {Number} [order]: Worksheet subscript; the default value is the current worksheet subscript
+ {Function} [success]: callback function for the end of the operation
- **Explanation**
Get the height of the specified row, get the object corresponding to the number of rows and height
- **Usage**:
- The height of the first row is 50px, the height of the second row is 60px, get these values
`luckysheet.getRowHeight([0,1])`
Return to get
`{0:50,1:60}`
------------
### getColumnWidth(columnInfo [,setting])
(TODO)
- **Parameter**
- {Array} [columnInfo]: The number of columns
- {PlainObject} [setting]: optional parameters
+ {Number} [order]: Worksheet subscript; the default value is the current worksheet subscript
+ {Function} [success]: callback function for the end of the operation
- **Explanation**
Get the width of the specified column, get the object of the corresponding relationship between the number of columns and the width
- **Usage**:
- The width of the first column is 50px, the width of the second column is 60px, get these values
`luckysheet.getColumnWidth([0,1])`
Return to get
`{0:50,1:60}`
------------
### getDefaultRowHeight([,setting])
(TODO)
- **Parameter**
- {PlainObject} [setting]: optional parameters
+ {Number} [order]: Worksheet subscript; the default value is the current worksheet subscript
+ {Function} [success]: callback function for the end of the operation
- **Explanation**
Get the default row height of the specified worksheet
- **Usage**:
- Returns the default row height of the current worksheet
`luckysheet.getDefaultRowHeight()`
Return to get
`19`
------------
### getDefaultColumnWidth([,setting])
(TODO)
- **Parameter**
- {PlainObject} [setting]: optional parameters
+ {Number} [order]: Worksheet subscript; the default value is the current worksheet subscript
+ {Function} [success]: callback function for the end of the operation
- **Explanation**
Get the default column width of the specified worksheet
- **Usage**:
- Returns the default column width of the current worksheet
`luckysheet.getDefaultColumnWidth()`
Return to get
`73`
------------
## Selection operation ## Selection operation
### getRange() ### getRange()

100
docs/zh/guide/api.md

@ -590,6 +590,106 @@ Luckysheet针对常用的数据操作需求,开放了主要功能的API,开
------------ ------------
### getRowHeight(rowInfo [,setting])
(TODO)
- **参数**
- {Array} [rowInfo]: 行数
- {PlainObject} [setting]: 可选参数
+ {Number} [order]: 工作表下标;默认值为当前工作表下标
+ {Function} [success]: 操作结束的回调函数
- **说明**
获取指定行的高度,得到行数和高度对应关系的对象
- **示例**:
- 第一行高度为50px,第二行高度为60px,获取这些值
`luckysheet.getRowHeight([0,1])`
返回得到
`{0:50,1:60}`
------------
### getColumnWidth(columnInfo [,setting])
(TODO)
- **参数**
- {Array} [columnInfo]: 列数
- {PlainObject} [setting]: 可选参数
+ {Number} [order]: 工作表下标;默认值为当前工作表下标
+ {Function} [success]: 操作结束的回调函数
- **说明**
获取指定列的宽度,得到列数和宽度对应关系的对象
- **示例**:
- 第一列宽度为50px,第二列宽度为60px,获取这些值
`luckysheet.getColumnWidth([0,1])`
返回得到
`{0:50,1:60}`
------------
### getDefaultRowHeight([,setting])
(TODO)
- **参数**
- {PlainObject} [setting]: 可选参数
+ {Number} [order]: 工作表下标;默认值为当前工作表下标
+ {Function} [success]: 操作结束的回调函数
- **说明**
获取指定工作表的默认行高
- **示例**:
- 返回当前工作表的默认行高
`luckysheet.getDefaultRowHeight()`
返回得到
`19`
------------
### getDefaultColumnWidth([,setting])
(TODO)
- **参数**
- {PlainObject} [setting]: 可选参数
+ {Number} [order]: 工作表下标;默认值为当前工作表下标
+ {Function} [success]: 操作结束的回调函数
- **说明**
获取指定工作表的默认列宽
- **示例**:
- 返回当前工作表的默认列宽
`luckysheet.getDefaultColumnWidth()`
返回得到
`73`
------------
## 选区操作 ## 选区操作
### getRange() ### getRange()

45
docs/zh/guide/config.md

@ -106,15 +106,52 @@ Luckysheet开放了更细致的自定义配置选项,分别有
### loadUrl ### loadUrl
- 类型:String - 类型:String
- 默认值:"" - 默认值:""
- 作用:配置`loadUrl`的地址,与`loadSheetUrl`配合使用,一般用于大数据量的时候。也可以不用Luckysheet提供的接口参数,使用[data](#data)参数可以提前准备好所有表格数据用于初始化。 - 作用:配置`loadUrl`的地址,与`loadSheetUrl`配合使用。
Luckysheet会通过ajax请求整个表格数据,默认载入status为1的sheet数据中的所有`celldata`,其余的sheet载入除`celldata`字段外的所有字段。但是考虑到一些公式、图表及数据透视表会引用其他sheet的数据,所以前台会加一个判断,如果该当前sheet引用了其他sheet的数据则会通过`loadSheetUrl`配置的接口地址请求数据,把引用到的sheet的数据一并补全。因为 `loadUrl`只负责当前页数据,所以还需要配置`loadSheetUrl`作为异步加载数据的接口。 Luckysheet会通过ajax请求(POST)整个表格的数据,默认载入status为1的sheet数据中的`celldata`,其余的sheet载入除`celldata`字段外的所有配置字段。特别是在数据量大的时候,`loadUrl`只负责当前页单元格数据,配置`loadSheetUrl`作为其它工作表异步加载单元格数据的接口,可以提高性能。
一个合格的接口返回的json数据为:
```js
"[
//status为1的sheet页,重点是需要提供初始化的数据celldata
{
"name": "Cell",
"index": "sheet_001",
"order": 0,
"status": 1,
"celldata": [{"r":0,"c":0,"v":{"bg":null,"bl":0,"it":0,"ff":0,"fs":11,"fc":"rgb(51, 51, 51)","ht":1,"vt":1,"v":1,"ct":{"fa":"General","t":"n"},"m":"1"}}]
},
//其他status为0的sheet页,无需提供celldata,只需要配置项即可
{
"name": "Data",
"index": "sheet_002",
"order": 1,
"status": 0
},
{
"name": "Picture",
"index": "sheet_003",
"order": 2,
"status": 0
}
]"
```
有几个注意点
+ 这是一个字符串,类似于JSON.stringify()处理后的json数据,压缩数据便于传输
+ loadUrl是一个post请求,也是为了支持大数据量
+ 考虑到一些公式、图表及数据透视表会引用其他sheet的数据,所以前台会加一个判断,如果该当前sheet引用了其他sheet的数据则会通过`loadSheetUrl`配置的接口地址请求数据,把引用到的sheet的数据一并补全,而不用等切换到其它页的时候再请求。
+ 当数据量小的时候,也可以不用Luckysheet提供的此接口,直接使用[data](#data)参数可以提前准备好所有表格数据用于初始化。
------------ ------------
### loadSheetUrl ### loadSheetUrl
- 类型:String - 类型:String
- 默认值:"" - 默认值:""
- 作用:配置`loadSheetUrl`的地址,参数为`gridKey`(表格主键) 和 `index`(sheet主键合集,格式为`["sheet_01","sheet_02","sheet_0"]`),返回的数据为sheet的`celldata`字段数据集合。为了加载性能考虑,除了第一次加载当前页的`celldata`数据之外,其余sheet的数据,是在切换到那个sheet页的时候,才会请求那一页的数据。 - 作用:配置`loadSheetUrl`的地址,参数为`gridKey`(表格主键) 和 `index`(sheet主键合集,格式为`["sheet_01","sheet_02","sheet_0"]`),返回的数据为sheet的`celldata`字段数据集合。
为了加载性能考虑,除了第一次加载当前页的`celldata`数据之外,其余sheet的数据,是在切换到那个sheet页的时候,才会请求那一页的数据。
注意:loadSheetUrl是一个post请求,是为了支持大数据量
------------ ------------
### allowUpdate ### allowUpdate

24
src/demoData/demoFeature.js

@ -0,0 +1,24 @@
// Features specially written for demo
(function() {
// language
function language(params) {
var lang = navigator.language||navigator.userLanguage;//常规浏览器语言和IE浏览器
lang = lang.substr(0, 2);//截取lang前2位字符
return lang;
}
// Tencent Forum Link Button
function supportButton() {
const text = language() === 'zh' ? '反馈' : 'Forum';
document.querySelector("body").insertAdjacentHTML('beforeend', `<a id="container" href="https://support.qq.com/product/288322" target="_blank" style="z-index:2;width:50px;height:50px;line-height:50px;position:fixed;right:40px;bottom:86px;border-radius:50px;cursor:pointer;background:rgb(71,133,249);color:#fff;text-align:center;text-decoration:none;">${text}</a>`);
}
supportButton()
})()

5
src/index.html

@ -17,8 +17,6 @@
<!-- rollup luckysheet.js --> <!-- rollup luckysheet.js -->
<script src="./luckysheet.umd.js"></script> <script src="./luckysheet.umd.js"></script>
<!-- demo feature, non-production use -->
<script src="./demoData/demoFeature.js"></script>
</head> </head>
<body> <body>
@ -1790,6 +1788,9 @@
}) })
</script> </script>
<!-- demo feature, non-production use -->
<script src="./demoData/demoFeature.js"></script>
</body> </body>
</html> </html>
Loading…
Cancel
Save