liurunze
5 years ago
18 changed files with 2336 additions and 610 deletions
@ -0,0 +1,21 @@ |
|||
The MIT License (MIT) |
|||
|
|||
Copyright (c) 2020-present, Mengshukeji |
|||
|
|||
Permission is hereby granted, free of charge, to any person obtaining a copy |
|||
of this software and associated documentation files (the "Software"), to deal |
|||
in the Software without restriction, including without limitation the rights |
|||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell |
|||
copies of the Software, and to permit persons to whom the Software is |
|||
furnished to do so, subject to the following conditions: |
|||
|
|||
The above copyright notice and this permission notice shall be included in |
|||
all copies or substantial portions of the Software. |
|||
|
|||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR |
|||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, |
|||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE |
|||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER |
|||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, |
|||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN |
|||
THE SOFTWARE. |
|||
@ -0,0 +1,107 @@ |
|||
# Luckysheet |
|||
简体中文 | [English](./README.md) |
|||
|
|||
## Introduction - 介绍 |
|||
Luckysheet ，一款纯前端类似excel的在线表格，功能强大、配置简单、完全开源。 |
|||
|
|||
## Features - 特性 |
|||
1. Luckysheet支持表格设置包括冻结行列、合并单元格、筛选、排序、查询、条件格式、批注 |
|||
2. 支持数据分析功能包括透视表、图表、分列、矩阵操作、内置385个计算函数 |
|||
3. 支持一键截图、复制为json数据、共享编辑、excel与Luckysheet之间数据的复制粘贴 |
|||
4. 支持移动端查看 |
|||
5. 支持sparkLine |
|||
6. 下拉复制 |
|||
7. 快捷键 |
|||
|
|||
 |
|||
|
|||
## Plan - 计划 |
|||
- 模块化(进行中) |
|||
- excel导入/导出 |
|||
- 表单 |
|||
- 插入图片 |
|||
- 更多... |
|||
|
|||
## Documentation - 文档 |
|||
[在线demo](https://mengshukeji.github.io/LuckysheetDemo/) |
|||
|
|||
[在线文档](https://mengshukeji.github.io/LuckysheetDocs/) |
|||
|
|||
## Requirements - 环境 |
|||
[Node.js](https://nodejs.org/en/) Version >= 6 |
|||
|
|||
## Installation - 安装 |
|||
``` |
|||
npm install |
|||
npm install gulp -g |
|||
``` |
|||
|
|||
## Development - 开发 |
|||
开发 |
|||
``` |
|||
npm run dev |
|||
``` |
|||
打包 |
|||
``` |
|||
npm run build |
|||
``` |
|||
阅读 |
|||
|
|||
Luckysheet的核心代码为luckysheet-core.js和luckysheet-function.js,开发者看源码只需要看这两个文件即可,接下来会讨论进行模块化方案,完善这个插件. |
|||
|
|||
## Usage - 用法 |
|||
|
|||
#### 第一步 |
|||
`npm run build`后`dist`文件夹下的所有文件复制到项目目录 |
|||
|
|||
#### 第二步 |
|||
引入依赖 |
|||
``` |
|||
<link rel="stylesheet" href="plugins/css/pluginsCss.min.css"> |
|||
<link rel="stylesheet" href="plugins/plugins.min.css"> |
|||
<link rel="stylesheet" href="css/main.min.css"> |
|||
<script src="plugins/js/plugin.min.js"></script> |
|||
<script src="main.min.js"></script> |
|||
``` |
|||
#### 第三步 |
|||
指定一个表格容器 |
|||
``` |
|||
<div id="luckysheet" style="margin:0px;padding:0px;position:absolute;width:100%;height:100%;left: 0px;top: 0px;"></div> |
|||
``` |
|||
#### 第四步 |
|||
创建一个表格 |
|||
``` |
|||
<script> |
|||
$(function () { |
|||
//配置项 |
|||
var options = { |
|||
container: 'luckysheet' //luckysheet为容器id |
|||
} |
|||
luckysheet.create(options) |
|||
}) |
|||
</script> |
|||
``` |
|||
|
|||
## Contact - 联系 |
|||
mengshu@office2.cn |
|||
|
|||
## communication - 交流 |
|||
|
|||
- 添加小编微信,拉你进Luckysheet开发者交流微信群,备注:加群 |
|||
|
|||
<img src="https://minio.cnbabylon.com/public/luckysheet/%E5%BE%AE%E4%BF%A1%E4%BA%8C%E7%BB%B4%E7%A0%81.jpg" width = "200" alt="微信群" align="center" /> |
|||
|
|||
或者 |
|||
|
|||
- 加入Luckysheet开发者交流QQ群 |
|||
|
|||
<img src="https://minio.cnbabylon.com/public/luckysheet/QQ%E7%BE%A4%E4%BA%8C%E7%BB%B4%E7%A0%81.jpg" width = "200" alt="微信群" align="center" /> |
|||
|
|||
## Authors and acknowledgment - 贡献者和感谢 |
|||
- Bug Pan ([@wpxp123456](https://github.com/wpxp123456)) |
|||
- Dushusir ([@Dushusir](https://github.com/Dushusir)) |
|||
|
|||
## License - 版权信息 |
|||
[MIT](http://opensource.org/licenses/MIT) |
|||
|
|||
Copyright (c) 2020-present, mengshukeji |
|||
@ -1,34 +1,96 @@ |
|||
module.exports = { |
|||
title: 'Luckysheet文档', |
|||
description: 'Luckysheet 配置文档/API/教程', |
|||
base: '/LuckysheetDocs/', |
|||
locales: { |
|||
// 键名是该语言所属的子路径
|
|||
// 作为特例，默认语言可以使用 '/' 作为其路径。
|
|||
'/': { |
|||
lang: 'en-US', // 将会被设置为 <html> 的 lang 属性
|
|||
title: 'Luckysheet Document', |
|||
description: 'Luckysheet is an online spreadsheet like excel that is powerful, simple to configure, and completely open source.This site contains official configuration document, API, and tutorial.' |
|||
}, |
|||
'/zh/': { |
|||
lang: 'zh-CN', |
|||
title: 'Luckysheet文档', |
|||
description: 'Luckysheet ，一款纯前端类似excel的在线表格，功能强大、配置简单、完全开源。本站包含官方配置文档,API,教程。' |
|||
}, |
|||
|
|||
}, |
|||
themeConfig: { |
|||
logo: '/img/logo.png', |
|||
// 页面滚动
|
|||
smoothScroll: true, |
|||
// 导航栏
|
|||
nav: [ |
|||
{ text: '首页', link: '/' }, |
|||
{ text: '指南', link: '/guide/' }, |
|||
{ text: '演示', link: 'https://mengshukeji.github.io/LuckysheetDemo/' }, |
|||
{ text: 'Github', link: 'https://github.com/mengshukeji/Luckysheet' }, |
|||
], |
|||
// 侧边栏
|
|||
sidebar: { |
|||
'/guide/': [ |
|||
'', |
|||
'config', |
|||
'feature', |
|||
'data', |
|||
'operate', |
|||
'format' |
|||
], |
|||
}, |
|||
|
|||
// 仓库地址
|
|||
repo: 'mengshukeji/Luckysheet', |
|||
// 仓库链接文字
|
|||
repoLabel: '在 GitHub 上编辑此页', |
|||
// 允许编辑链接文字
|
|||
editLinks: true, |
|||
// 仓库的文档目录
|
|||
docsDir: 'docs', |
|||
// 页面滚动
|
|||
smoothScroll: true, |
|||
locales: { |
|||
'/': { |
|||
selectText: 'Languages', |
|||
label: 'English', |
|||
ariaLabel: 'Select language', |
|||
editLinkText: 'Edit this page on GitHub', |
|||
lastUpdated: 'Last Updated', |
|||
serviceWorker: { |
|||
updatePopup: { |
|||
message: "New content is available.", |
|||
buttonText: "Refresh" |
|||
} |
|||
}, |
|||
nav: [ |
|||
{ text: 'Home', link: '/en/' }, |
|||
{ text: 'Guide', link: '/en/guide/' }, |
|||
{ text: 'Demo', link: 'https://mengshukeji.github.io/LuckysheetDemo/' } |
|||
], |
|||
// 侧边栏
|
|||
sidebar: { |
|||
'/guide/': [ |
|||
'', |
|||
'config', |
|||
'feature', |
|||
'data', |
|||
'operate', |
|||
'format' |
|||
], |
|||
}, |
|||
}, |
|||
'/zh/': { |
|||
// 多语言下拉菜单的标题
|
|||
selectText: '选择语言', |
|||
// 该语言在下拉菜单中的标签
|
|||
label: '简体中文', |
|||
ariaLabel: '选择语言', |
|||
// 编辑链接文字
|
|||
editLinkText: '在 GitHub 上编辑此页', |
|||
lastUpdated: '上次更新', |
|||
// Service Worker 的配置
|
|||
serviceWorker: { |
|||
updatePopup: { |
|||
message: "发现新内容可用.", |
|||
buttonText: "刷新" |
|||
} |
|||
}, |
|||
// 导航栏
|
|||
nav: [ |
|||
{ text: '首页', link: '/' }, |
|||
{ text: '指南', link: '/guide/' }, |
|||
{ text: '演示', link: 'https://mengshukeji.github.io/LuckysheetDemo/' } |
|||
], |
|||
// 侧边栏
|
|||
sidebar: { |
|||
'/zh/guide/': [ |
|||
'', |
|||
'config', |
|||
'feature', |
|||
'data', |
|||
'operate', |
|||
'format' |
|||
], |
|||
}, |
|||
}, |
|||
|
|||
}, |
|||
}, |
|||
} |
|||
@ -1,15 +1,15 @@ |
|||
--- |
|||
home: true |
|||
heroText: Luckysheet |
|||
tagline: Luckysheet 配置文档/API/教程 |
|||
actionText: 快速上手 → |
|||
tagline: Configuration Document · API · Tutorial |
|||
actionText: Get Started → |
|||
actionLink: /guide/ |
|||
features: |
|||
- title: 功能强大 |
|||
details: 包含大量常用电子表格功能,替代你的excel |
|||
- title: 配置简单 |
|||
details: 最少的配置就能开始上手使用 |
|||
- title: 完全开源 |
|||
details: 社区驱动,共同来完善你的想法 |
|||
- title: Powerful Features |
|||
details: Contains a large number of commonly used spreadsheet functions to replace your excel |
|||
- title: Simple Configuration |
|||
details: Get started with minimal configuration |
|||
- title: Open Source |
|||
details: Community driven, work together to improve your ideas |
|||
footer: MIT Licensed | Copyright © 2020-present Mengshukeji |
|||
--- |
|||
@ -1,232 +1,226 @@ |
|||
# 基本配置 |
|||
# Basic Configuration |
|||
|
|||
## container |
|||
- 类型：String |
|||
- 默认值："luckysheet" |
|||
- 作用：容器的ID |
|||
- Type: String |
|||
- Default: "luckysheet" |
|||
- Usage: Container ID |
|||
|
|||
------------ |
|||
## title |
|||
- 类型：String |
|||
- 默认值："Luckysheet Demo" |
|||
- 作用：表格的名称 |
|||
- Type: String |
|||
- Default: "Luckysheet Demo" |
|||
- Usage: Table's name |
|||
|
|||
------------ |
|||
## column |
|||
- 类型：Number |
|||
- 默认值：60 |
|||
- 作用：空表格默认的列数量 |
|||
- Type: Number |
|||
- Default: 60 |
|||
- Usage: The default number of columns in an empty table |
|||
|
|||
------------ |
|||
## row |
|||
- 类型：Number |
|||
- 默认值：84 |
|||
- 作用：空表格默认的行数据量 |
|||
- Type: Number |
|||
- Default: 84 |
|||
- Usage: The default number of rows in an empty table |
|||
|
|||
------------ |
|||
## data |
|||
- 类型：Array |
|||
- 默认值：[{ "name": "Sheet1", color: "", "status": "1", "order": "0", "data": [], "config": {}, "index":0 }, { "name": "Sheet2", color: "", "status": "0", "order": "1", "data": [], "config": {}, "index":1 }, { "name": "Sheet3", color: "", "status": "0", "order": "2", "data": [], "config": {}, "index":2 }] |
|||
- 作用：客户端sheet数据[shee1, sheet2, sheet3] |
|||
- Type: Array |
|||
- Default: [{ "name": "Sheet1", color: "", "status": "1", "order": "0", "data": [], "config": {}, "index":0 }, { "name": "Sheet2", color: "", "status": "0", "order": "1", "data": [], "config": {}, "index":1 }, { "name": "Sheet3", color: "", "status": "0", "order": "2", "data": [], "config": {}, "index":2 }] |
|||
- Usage: Client sheet data `[shee1, sheet2, sheet3]` |
|||
|
|||
------------ |
|||
|
|||
## fullscreenmode |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否全屏模式，非全屏模式下，标记框不会强制选中。 |
|||
- Type: Boolean |
|||
- Default: true |
|||
- Usage: Whether full-screen mode. In non-full-screen mode, the marker box is not forced to be selected |
|||
|
|||
------------ |
|||
## autoFormatw |
|||
- 类型：Boolean |
|||
- 默认值：false |
|||
- 作用：自动格式化超过4位数的数字为 亿万格式 例：true or "true" or "TRUE" |
|||
- Type: Boolean |
|||
- Default: false |
|||
- Usage: Automatically format numbers with more than 4 digits as 'billion format', for example: true or "true" or "TRUE" |
|||
|
|||
------------ |
|||
## accuracy |
|||
- 类型：Number |
|||
- 默认值：undefined |
|||
- 作用：设置传输来的数值的精确位数，小数点后n位 传参数为数字或数字字符串，例： "0" 或 0 |
|||
- Type: Number |
|||
- Default: undefined |
|||
- Usage: Set the accuracy,the number of digits after the decimal point. Pass the parameter as a number or numeric string, for example: "0" or 0 |
|||
|
|||
------------ |
|||
## allowCopy |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否允许拷贝 |
|||
- Type: Boolean |
|||
- Default: true |
|||
- Usage: Whether to allow copying |
|||
|
|||
------------ |
|||
## showtoolbar |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否第二列显示工具栏 |
|||
- Type: Boolean |
|||
- Default: true |
|||
- Usage: Whether to display the toolbar in the second row |
|||
|
|||
------------ |
|||
## showinfobar |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否显示顶部名称栏 |
|||
- Type: Boolean |
|||
- Default: true |
|||
- Usage: Whether to display the top name bar |
|||
|
|||
------------ |
|||
## showsheetbar |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否显示底部表格名称区域 |
|||
- Type: Boolean |
|||
- Default: true |
|||
- Usage: Whether to display the bottom table name area |
|||
|
|||
------------ |
|||
|
|||
## showstatisticBar |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否显示底部计数栏 |
|||
- Type: Boolean |
|||
- Default: true |
|||
- Usage: Whether to display the bottom count bar |
|||
|
|||
------------ |
|||
## editMode |
|||
- 类型：Boolean |
|||
- 默认值：false |
|||
- 作用：是否为编辑模式 |
|||
- Type: Boolean |
|||
- Default: false |
|||
- Usage: Whether it is edit mode |
|||
|
|||
------------ |
|||
## allowEdit |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否允许前台编辑 |
|||
- Type: Boolean |
|||
- Default: true |
|||
- Usage: Whether to allow frontend editing(Not implemented yet) |
|||
|
|||
------------ |
|||
## enableAddRow |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：允许增加行 |
|||
- Type: Boolean |
|||
- Default: true |
|||
- Usage: Allow add line |
|||
|
|||
------------ |
|||
## enableAddCol |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：允许增加列 |
|||
- Type: Boolean |
|||
- Default: true |
|||
- Usage: Allow add column |
|||
|
|||
------------ |
|||
## pointEdit |
|||
- 类型：Boolean |
|||
- 默认值：false |
|||
- 作用：是否是编辑器插入表格模式 |
|||
- Type: Boolean |
|||
- Default: false |
|||
- Usage: Whether the editor inserts table mode |
|||
|
|||
------------ |
|||
## pointEditUpdate |
|||
- 类型：Function |
|||
- 默认值：null |
|||
- 作用：编辑器表格更新函数 |
|||
- Type: Function |
|||
- Default: null |
|||
- Usage: Editor table update function |
|||
|
|||
------------ |
|||
## pointEditZoom |
|||
- 类型：Number |
|||
- 默认值：1 |
|||
- 作用：编辑器表格编辑时缩放比例 |
|||
|
|||
------------ |
|||
## pointEditZoom |
|||
- 类型：Number |
|||
- 默认值：1 |
|||
- 作用：编辑器表格编辑时缩放比例 |
|||
- Type: Number |
|||
- Default: 1 |
|||
- Usage: Editor table scaling when editing |
|||
|
|||
------------ |
|||
## userInfo |
|||
- 类型：String |
|||
- 默认值：`'<i style="font-size:16px;color:#ff6a00;" class="fa fa-taxi" aria-hidden="true"></i> rabbit'` |
|||
- 作用：右上角的用户信息展示样式 |
|||
- Type: String |
|||
- Default: `'<i style="font-size:16px;color:#ff6a00;" class="fa fa-taxi" aria-hidden="true"></i> rabbit'` |
|||
- Usage: User information display style in the upper right corner |
|||
|
|||
------------ |
|||
## userMenuItem |
|||
- 类型：Array |
|||
- 默认值：`[{url:"www.baidu.com", "icon":'<i class="fa fa-folder" aria-hidden="true"></i>', "name":"我的表格"}, {url:"www.baidu.com", "icon":'<i class="fa fa-sign-out" aria-hidden="true"></i>', "name":"退出登陆"}]` |
|||
- 作用：点击右上角的用户信息弹出的菜单 |
|||
- Type: Array |
|||
- Default: `[{url:"www.baidu.com", "icon":'<i class="fa fa-folder" aria-hidden="true"></i>', "name":"My Table"}, {url:"www.baidu.com", "icon":'<i class="fa fa-sign-out" aria-hidden="true"></i>', "name":"Sign Out"}]` |
|||
- Usage: The menu, which popped up by clicking the user information in the upper right corner |
|||
|
|||
------------ |
|||
## myFolderUrl |
|||
- 类型：String |
|||
- 默认值："www.baidu.com" |
|||
- 作用：左上角<返回按钮的链接 |
|||
- Type: String |
|||
- Default: "www.baidu.com" |
|||
- Usage: Back button link in the upper left corner |
|||
|
|||
------------ |
|||
## config |
|||
- 类型：Object |
|||
- 默认值：{} |
|||
- 作用：表格行高、列宽、合并单元格、公式等设置 |
|||
- Type: Object |
|||
- Default: {} |
|||
- Usage: Table row height, column width, merged cells, formulas and other settings |
|||
|
|||
------------ |
|||
## devicePixelRatio |
|||
- 类型：Number |
|||
- 默认值：window.devicePixelRatio |
|||
- 作用：设备比例，比例越大表格分标率越高 |
|||
- Type: Number |
|||
- Default: window.devicePixelRatio |
|||
- Usage: Device Pixel Ratio, the larger the ratio, the higher the table resolution |
|||
|
|||
------------ |
|||
## gridKey |
|||
- 类型：String |
|||
- 默认值："" |
|||
- 作用：表格唯一标识符 |
|||
- Type: String |
|||
- Default: "" |
|||
- Usage: Form unique identifier |
|||
|
|||
------------ |
|||
## loadUrl |
|||
- 类型：String |
|||
- 默认值："" |
|||
- 作用：配置loadUrl的地址，luckysheet会通过ajax请求表格数据，默认载入status为1的sheet数据中的所有data，其余的sheet载入除data字段外的所有字段 |
|||
- Type: String |
|||
- Default: "" |
|||
- Usage: Configure the address of `loadUrl`, Luckysheet will request the table data through ajax. By default, all `data` in the sheet data with status 1 is loaded, and the rest of the sheet loads all fields except the `data` field. |
|||
|
|||
------------ |
|||
## loadSheetUrl |
|||
- 类型：String |
|||
- 默认值："" |
|||
- 作用：配置loadSheetUrl的地址，参数为gridKey（表格主键） 和 index（sheet主键合集，格式为[1,2,3]），返回的数据为sheet的data字段数据集合 |
|||
- Type: String |
|||
- Default: "" |
|||
- Usage: Configure the address of `loadSheetUrl`, the parameters are `gridKey` (table primary key) and `index` (sheet primary key collection, format is `[1,2,3]`), the returned data is the `data` field set of sheet |
|||
|
|||
------------ |
|||
## updateUrl |
|||
- 类型：String |
|||
- 默认值："" |
|||
- 作用：表格数据的更新地址 |
|||
- Type: String |
|||
- Default: "" |
|||
- Usage: Update URL of table data |
|||
|
|||
------------ |
|||
## updateImageUrl |
|||
- 类型：String |
|||
- 默认值："" |
|||
- 作用：缩略图的更新地址 |
|||
- Type: String |
|||
- Default: "" |
|||
- Usage: Update URL of thumbnail |
|||
|
|||
------------ |
|||
## allowUpdate |
|||
- 类型：Boolean |
|||
- 默认值：false |
|||
- 作用：是否允许编辑后的后台更新 |
|||
- Type: Boolean |
|||
- Default: false |
|||
- Usage: Whether to allow background updates after editing |
|||
|
|||
------------ |
|||
## functionButton |
|||
- 类型：String |
|||
- 默认值："" |
|||
- 作用：右上角功能按钮，例如`'<button id="" class="btn btn-primary" style="padding:3px 6px;font-size: 12px;margin-right: 10px;">下载</button> <button id="" class="btn btn-primary btn-danger" style=" padding:3px 6px; font-size: 12px; margin-right: 10px;">分享</button> <button id="luckysheet-share-btn-title" class="btn btn-primary btn-danger" style=" padding:3px 6px; font-size: 12px; margin-right: 10px;">秀数据</button>'` |
|||
- Type: String |
|||
- Default: "" |
|||
- Usage: Function buttons in the upper right corner, for example`'<button id="" class="btn btn-primary" style="padding:3px 6px;font-size: 12px;margin-right: 10px;">Download</button> <button id="" class="btn btn-primary btn-danger" style=" padding:3px 6px; font-size: 12px; margin-right: 10px;">Share</button> <button id="luckysheet-share-btn-title" class="btn btn-primary btn-danger" style=" padding:3px 6px; font-size: 12px; margin-right: 10px;">Show Data</button>'` |
|||
|
|||
------------ |
|||
## showConfigWindowResize |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：图表和数据透视表的配置会在右侧弹出，设置弹出后表格是否会自动缩进 |
|||
- Type: Boolean |
|||
- Default: true |
|||
- Usage: The configuration of the chart or pivot table will pop up on the right. Set whether the table will be automatically indented after popping up |
|||
|
|||
------------ |
|||
## enablePage |
|||
- 类型：Boolean |
|||
- 默认值：false |
|||
- 作用：允许加载下一页 |
|||
- Type: Boolean |
|||
- Default: false |
|||
- Usage: Allow next page to load |
|||
|
|||
------------ |
|||
## chartConfigChange |
|||
- 类型：Function |
|||
- 默认值：null |
|||
- 作用：图表插件中图表更新触发的自定义方法 |
|||
- Type: Function |
|||
- Default: null |
|||
- Usage: Custom method for triggering chart update in chart plugin |
|||
|
|||
------------ |
|||
## beforeCreateDom |
|||
- 类型：Function |
|||
- 默认值：null |
|||
- 作用：表格创建之前自定义方法 |
|||
- Type: Function |
|||
- Default: null |
|||
- Usage: Custom method before table creation |
|||
|
|||
------------ |
|||
## fireMousedown |
|||
- 类型：Function |
|||
- 默认值：null |
|||
- 作用：单元格数据下钻自定义方法 |
|||
- Type: Function |
|||
- Default: null |
|||
- Usage: Custom method for drilling down cell data |
|||
|
|||
------------ |
|||
@ -0,0 +1,15 @@ |
|||
--- |
|||
home: true |
|||
heroText: Luckysheet |
|||
tagline: 配置文档 · API · 教程 |
|||
actionText: 快速上手 → |
|||
actionLink: /zh/guide/ |
|||
features: |
|||
- title: 功能强大 |
|||
details: 包含大量常用电子表格功能,替代你的excel |
|||
- title: 配置简单 |
|||
details: 最少的配置就能开始上手使用 |
|||
- title: 完全开源 |
|||
details: 社区驱动,共同来完善你的想法 |
|||
footer: MIT Licensed | Copyright © 2020-present Mengshukeji |
|||
--- |
|||
@ -0,0 +1,148 @@ |
|||
# 快速上手 |
|||
|
|||
## 基本介绍 |
|||
Luckysheet ，一款纯前端类似excel的在线表格，功能强大、配置简单、完全开源。 |
|||
|
|||
### 特性 |
|||
1. Luckysheet支持表格设置包括冻结行列、合并单元格、筛选、排序、查询、条件格式、批注 |
|||
2. 支持数据分析功能包括透视表、分列、矩阵操作、内置385个计算函数 |
|||
3. 支持一键截图、复制为json数据、共享编辑、excel与Luckysheet之间数据的复制粘贴 |
|||
4. 支持移动端查看 |
|||
5. 支持sparkLine |
|||
6. 下拉复制 |
|||
7. 快捷键 |
|||
|
|||
 |
|||
|
|||
|
|||
### Demo |
|||
[在线demo](https://mengshukeji.github.io/LuckysheetDemo/) |
|||
|
|||
## 开发模式 |
|||
|
|||
### 环境 |
|||
[Node.js](https://nodejs.org/en/) Version >= 6 |
|||
|
|||
### 安装 |
|||
```shell |
|||
npm install |
|||
npm install gulp -g |
|||
``` |
|||
|
|||
### 开发 |
|||
```shell |
|||
npm run dev |
|||
``` |
|||
|
|||
### 打包 |
|||
```shell |
|||
npm run build |
|||
``` |
|||
|
|||
## 使用步骤 |
|||
|
|||
### 第一步 |
|||
`npm run build`后`dist`文件夹下的所有文件复制到项目目录 |
|||
|
|||
### 第二步 |
|||
引入依赖 |
|||
```html |
|||
<link rel="stylesheet" href="plugins/css/pluginsCss.min.css"> |
|||
<link rel="stylesheet" href="plugins/plugins.min.css"> |
|||
<link rel="stylesheet" href="css/main.min.css"> |
|||
<script src="plugins/js/plugin.min.js"></script> |
|||
<script src="main.min.js"></script> |
|||
``` |
|||
### 第三步 |
|||
指定一个表格容器 |
|||
```html |
|||
<div id="luckysheet" style="margin:0px;padding:0px;position:absolute;width:100%;height:100%;left: 0px;top: 0px;"></div> |
|||
``` |
|||
### 第四步 |
|||
创建一个表格 |
|||
```javascript |
|||
<script> |
|||
$(function () { |
|||
//配置项 |
|||
var options = { |
|||
container: 'luckysheet' //luckysheet为容器id |
|||
} |
|||
luckysheet.create(options) |
|||
}) |
|||
</script> |
|||
``` |
|||
|
|||
## 整体结构 |
|||
|
|||
### 格式 |
|||
|
|||
一个完整的Luckysheet表格文件的数据格式为：luckysheetfile，一个表格文件包含若干个sheet文件，对应excel的sheet0、sheet1等。 |
|||
|
|||
一个Luckysheet文件的示例如下，该表格包含3个sheet：` |
|||
luckysheetfile = [ {sheet1设置}, {sheet2设置}, {sheet3设置} ]` |
|||
相当于excel的3个sheet |
|||
|
|||
 |
|||
|
|||
文件中的一个sheet的示例如下： |
|||
```javascript |
|||
luckysheetfile[0] = |
|||
{ |
|||
"name": "超市销售额", |
|||
"color": "", |
|||
"chart": [], |
|||
"status": 0, |
|||
"order": 0, |
|||
"celldata": [], |
|||
"row":90, |
|||
"column":100, |
|||
"index": 0, |
|||
"visibledatarow": [], |
|||
"visibledatacolumn": [], |
|||
"rowsplit": [], |
|||
"ch_width": 4629, |
|||
"rh_height": 1681, |
|||
"luckysheet_select_save": {}, |
|||
"luckysheet_selection_range": {}, |
|||
"scrollLeft": 0, |
|||
"scrollTop": 0, |
|||
"load": "1", |
|||
"config": { |
|||
"columlen": {}, |
|||
"rowhidden": {} |
|||
} |
|||
, |
|||
"pivotTable": {}, |
|||
"isPivotTable": true, |
|||
"calcChain": [], |
|||
"filter":{key1:value1, key2:value2}, |
|||
"filter_select": {} |
|||
} |
|||
``` |
|||
### 查看方式 |
|||
在chrome的console中查看 |
|||
`luckysheet.getluckysheetfile()` |
|||
可以看到完整设置 |
|||
`[{shee1}, {sheet2}, {sheet3}]` |
|||
|
|||
## 快捷键 |
|||
|
|||
| 快捷键 | 功能 | |
|||
| ------------ | ------------ | |
|||
| CTRL + C | 复制单元格 | |
|||
| CTRL + V | 粘贴单元格 | |
|||
| CTRL + X | 剪切单元格 | |
|||
| CTRL + Z | 撤销 | |
|||
| CTRL + Y | 重做 | |
|||
| CTRL + A | 全选 | |
|||
| CTRL + B | 加粗 | |
|||
| CTRL + F | 查找 | |
|||
| CTRL + H | 替换 | |
|||
| CTRL + I | 斜体 | |
|||
| CTRL + UP/DOWN/LEFT/RIGHT | 快捷调整单元格选框 | |
|||
| SHIFT + UP/DOWN/LEFT/RIGHT | 调整选区 | |
|||
| CTRL + 鼠标左击 | 多选单元格 | |
|||
| SHIFT + 鼠标左击 | 调整选区 | |
|||
| UP/DOWN/LEFT/RIGHT | 单个移动调整单元格选框 | |
|||
| ENTER | 编辑单元格 | |
|||
| DELETE | 清除单元格数据 | |
|||
@ -0,0 +1,226 @@ |
|||
# 基本配置 |
|||
|
|||
## container |
|||
- 类型：String |
|||
- 默认值："luckysheet" |
|||
- 作用：容器的ID |
|||
|
|||
------------ |
|||
## title |
|||
- 类型：String |
|||
- 默认值："Luckysheet Demo" |
|||
- 作用：表格的名称 |
|||
|
|||
------------ |
|||
## column |
|||
- 类型：Number |
|||
- 默认值：60 |
|||
- 作用：空表格默认的列数量 |
|||
|
|||
------------ |
|||
## row |
|||
- 类型：Number |
|||
- 默认值：84 |
|||
- 作用：空表格默认的行数据量 |
|||
|
|||
------------ |
|||
## data |
|||
- 类型：Array |
|||
- 默认值：[{ "name": "Sheet1", color: "", "status": "1", "order": "0", "data": [], "config": {}, "index":0 }, { "name": "Sheet2", color: "", "status": "0", "order": "1", "data": [], "config": {}, "index":1 }, { "name": "Sheet3", color: "", "status": "0", "order": "2", "data": [], "config": {}, "index":2 }] |
|||
- 作用：客户端sheet数据`[shee1, sheet2, sheet3]` |
|||
|
|||
------------ |
|||
|
|||
## fullscreenmode |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否全屏模式。非全屏模式下，标记框不会强制选中 |
|||
|
|||
------------ |
|||
## autoFormatw |
|||
- 类型：Boolean |
|||
- 默认值：false |
|||
- 作用：自动格式化超过4位数的数字为‘亿万格式’，例：true or "true" or "TRUE" |
|||
|
|||
------------ |
|||
## accuracy |
|||
- 类型：Number |
|||
- 默认值：undefined |
|||
- 作用：设置精度，小数点后的位数。传参数为数字或数字字符串，例： "0" 或 0 |
|||
|
|||
------------ |
|||
## allowCopy |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否允许拷贝 |
|||
|
|||
------------ |
|||
## showtoolbar |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否第二列显示工具栏 |
|||
|
|||
------------ |
|||
## showinfobar |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否显示顶部名称栏 |
|||
|
|||
------------ |
|||
## showsheetbar |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否显示底部表格名称区域 |
|||
|
|||
------------ |
|||
|
|||
## showstatisticBar |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否显示底部计数栏 |
|||
|
|||
------------ |
|||
## editMode |
|||
- 类型：Boolean |
|||
- 默认值：false |
|||
- 作用：是否为编辑模式 |
|||
|
|||
------------ |
|||
## allowEdit |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：是否允许前台编辑(暂未实现) |
|||
|
|||
------------ |
|||
## enableAddRow |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：允许增加行 |
|||
|
|||
------------ |
|||
## enableAddCol |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：允许增加列 |
|||
|
|||
------------ |
|||
## pointEdit |
|||
- 类型：Boolean |
|||
- 默认值：false |
|||
- 作用：是否是编辑器插入表格模式 |
|||
|
|||
------------ |
|||
## pointEditUpdate |
|||
- 类型：Function |
|||
- 默认值：null |
|||
- 作用：编辑器表格更新函数 |
|||
|
|||
------------ |
|||
## pointEditZoom |
|||
- 类型：Number |
|||
- 默认值：1 |
|||
- 作用：编辑器表格编辑时缩放比例 |
|||
|
|||
------------ |
|||
## userInfo |
|||
- 类型：String |
|||
- 默认值：`'<i style="font-size:16px;color:#ff6a00;" class="fa fa-taxi" aria-hidden="true"></i> rabbit'` |
|||
- 作用：右上角的用户信息展示样式 |
|||
|
|||
------------ |
|||
## userMenuItem |
|||
- 类型：Array |
|||
- 默认值：`[{url:"www.baidu.com", "icon":'<i class="fa fa-folder" aria-hidden="true"></i>', "name":"我的表格"}, {url:"www.baidu.com", "icon":'<i class="fa fa-sign-out" aria-hidden="true"></i>', "name":"退出登陆"}]` |
|||
- 作用：点击右上角的用户信息弹出的菜单 |
|||
|
|||
------------ |
|||
## myFolderUrl |
|||
- 类型：String |
|||
- 默认值："www.baidu.com" |
|||
- 作用：左上角<返回按钮的链接 |
|||
|
|||
------------ |
|||
## config |
|||
- 类型：Object |
|||
- 默认值：{} |
|||
- 作用：表格行高、列宽、合并单元格、公式等设置 |
|||
|
|||
------------ |
|||
## devicePixelRatio |
|||
- 类型：Number |
|||
- 默认值：window.devicePixelRatio |
|||
- 作用：设备比例，比例越大表格分辨率越高 |
|||
|
|||
------------ |
|||
## gridKey |
|||
- 类型：String |
|||
- 默认值："" |
|||
- 作用：表格唯一标识符 |
|||
|
|||
------------ |
|||
## loadUrl |
|||
- 类型：String |
|||
- 默认值："" |
|||
- 作用：配置`loadUrl`的地址，Luckysheet会通过ajax请求表格数据，默认载入status为1的sheet数据中的所有`data`，其余的sheet载入除`data`字段外的所有字段 |
|||
|
|||
------------ |
|||
## loadSheetUrl |
|||
- 类型：String |
|||
- 默认值："" |
|||
- 作用：配置`loadSheetUrl`的地址，参数为`gridKey`（表格主键） 和 `index`（sheet主键合集，格式为`[1,2,3]`），返回的数据为sheet的`data`字段数据集合 |
|||
|
|||
------------ |
|||
## updateUrl |
|||
- 类型：String |
|||
- 默认值："" |
|||
- 作用：表格数据的更新地址 |
|||
|
|||
------------ |
|||
## updateImageUrl |
|||
- 类型：String |
|||
- 默认值："" |
|||
- 作用：缩略图的更新地址 |
|||
|
|||
------------ |
|||
## allowUpdate |
|||
- 类型：Boolean |
|||
- 默认值：false |
|||
- 作用：是否允许编辑后的后台更新 |
|||
|
|||
------------ |
|||
## functionButton |
|||
- 类型：String |
|||
- 默认值："" |
|||
- 作用：右上角功能按钮，例如`'<button id="" class="btn btn-primary" style="padding:3px 6px;font-size: 12px;margin-right: 10px;">下载</button> <button id="" class="btn btn-primary btn-danger" style=" padding:3px 6px; font-size: 12px; margin-right: 10px;">分享</button> <button id="luckysheet-share-btn-title" class="btn btn-primary btn-danger" style=" padding:3px 6px; font-size: 12px; margin-right: 10px;">秀数据</button>'` |
|||
|
|||
------------ |
|||
## showConfigWindowResize |
|||
- 类型：Boolean |
|||
- 默认值：true |
|||
- 作用：图表或数据透视表的配置会在右侧弹出，设置弹出后表格是否会自动缩进 |
|||
|
|||
------------ |
|||
## enablePage |
|||
- 类型：Boolean |
|||
- 默认值：false |
|||
- 作用：允许加载下一页 |
|||
|
|||
------------ |
|||
## chartConfigChange |
|||
- 类型：Function |
|||
- 默认值：null |
|||
- 作用：图表插件中图表更新触发的自定义方法 |
|||
|
|||
------------ |
|||
## beforeCreateDom |
|||
- 类型：Function |
|||
- 默认值：null |
|||
- 作用：表格创建之前自定义方法 |
|||
|
|||
------------ |
|||
## fireMousedown |
|||
- 类型：Function |
|||
- 默认值：null |
|||
- 作用：单元格数据下钻自定义方法 |
|||
|
|||
------------ |
|||
@ -0,0 +1,92 @@ |
|||
# 表格数据 |
|||
|
|||
## 获取表格数据 |
|||
|
|||
- **配置**： |
|||
|
|||
配置 `updateUrl` 的地址，Luckysheet会通过ajax请求表格数据，默认载入status为1的sheet数据中的所有`data`，其余的sheet载入除`data`字段外的所有字段。 |
|||
|
|||
- **格式**： |
|||
|
|||
luckysheetfile示例如下： |
|||
```json |
|||
[ |
|||
{ |
|||
"name": "Sheet1", |
|||
"color": "", |
|||
"status": "1", |
|||
"order": "0", |
|||
"celldata": [], |
|||
"config": {}, |
|||
"index": 0 |
|||
}, |
|||
{ |
|||
"name": "Sheet2", |
|||
"color": "", |
|||
"status": "0", |
|||
"order": "1", |
|||
"data": [], |
|||
"config": {}, |
|||
"index": 1 |
|||
}, |
|||
{ |
|||
"name": "Sheet3", |
|||
"color": "", |
|||
"status": "0", |
|||
"order": "2", |
|||
"data": [], |
|||
"config": {}, |
|||
"index": 2 |
|||
} |
|||
] |
|||
``` |
|||
|
|||
## 获取sheet数据 |
|||
|
|||
- **配置**： |
|||
|
|||
配置`loadSheetUrl`的地址，参数为`gridKey`（表格主键） 和 `index`（sheet主键合集，格式为`[1,2,3]`），返回的数据为sheet的`data`字段数据集合 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"1": [{r:0, c:1, v:"值1"},{r:10, c:11, v:"值2"}], |
|||
"2": [data], |
|||
"3": [data], |
|||
} |
|||
``` |
|||
- **说明**： |
|||
|
|||
r代表行，c代表列，v代表该单元格的值，值可以是字符、数字或者json串。 |
|||
数据只会载入一次，一般来说都只有一个主键，但是考虑到一些公式、图表及数据透视表会引用其他sheet的数据，所以前台会加一个判断，如果该当前sheet引用了其他sheet的数据则把引用到的sheet的数据一并补全。 |
|||
|
|||
## 获取range范围数据 |
|||
|
|||
- **配置**： |
|||
|
|||
配置 `loadCellUrl` 的地址，参数为`gridKey`（表格主键） 、 `index`（sheet主键）、开始行、结束行、开始列、结束列。后台根据范围获取指定的`celldata`数据并返回。 |
|||
|
|||
## 更新数据 |
|||
|
|||
- **配置**： |
|||
|
|||
配置 `updateUrl` 的地址，发送到后台的参数为json的字符串。 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
compress: false, |
|||
gridKey:10004, |
|||
data: [更新数据] |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
| 参数 | 说明 | 举例 | |
|||
| ------------ | ------------ | ------------ | |
|||
| compress | Luckysheet采用客户端pako进行zlib参数压缩，如果浏览器支持压缩则为true，否则为false。后台可以根据此参数决定是否解压data中的内容 | 服务端获取参数过程：1. 序列化json字符串 2. 判断compress字段如果为TRUE则解压data字段 3. 解码data字符串URLDecoder.decode(utf-8) | |
|||
| gridKey | Luckysheet文件的标识符 | 无 | |
|||
| data | 一个包含更新数据的数组，数组中的参数格式请看下面的介绍。实例中：`t`表示更新类型、`i`为sheet的索引、`c`为行号、`r`为列号，`v`为值 | `data: [{ t : 'cell', i:0, c : 0, r : 0 , v: 2 }]` | |
|||
@ -0,0 +1,124 @@ |
|||
# 高级功能 |
|||
|
|||
## luckysheet.getcellvalue(r, c, data, type) |
|||
- **参数**： |
|||
- r：单元格所在行数；可选值；从0开始的整数，0表示第一行。 |
|||
- c：单元格所在列数；可选值；从0开始的整数，0表示第一列。 |
|||
- data：表数据；二维数组；默认值为当前表格数据。 |
|||
- type：单元格属性值；可选值；默认值为'v',表示获取单元格的值。 |
|||
- **用法**： |
|||
|
|||
此方法为获取单元格的值。`r`, `c`都没有值时，返回`data`；`r`, `c`只有一个有值时，返回整行或整列数据； |
|||
|
|||
------------ |
|||
## luckysheet.getluckysheetfile() |
|||
- **用法**： |
|||
|
|||
返回所有表格数据结构。 |
|||
|
|||
------------ |
|||
## luckysheet.sheetmanage.getSheetByIndex(index) |
|||
- **参数**： |
|||
- index：表格下标；从0开始的整数，0表示第一个表格；默认为当前表格下标。 |
|||
- **用法**： |
|||
|
|||
返回某个表格数据结构。 |
|||
|
|||
------------ |
|||
## luckysheet.getconfig() |
|||
- **用法**： |
|||
|
|||
返回当前表格config配置。 |
|||
|
|||
------------ |
|||
## luckysheet.getSheetConfig(sheetIndex) |
|||
- **参数**： |
|||
- sheetIndex：表格下标；从0开始的整数，0表示第一个表格；默认为当前表格下标。 |
|||
- **用法**： |
|||
|
|||
返回某个表格config配置。 |
|||
|
|||
------------ |
|||
## luckysheet.getvisibledatarow() |
|||
- **用法**： |
|||
|
|||
返回当前表格行高。 |
|||
|
|||
------------ |
|||
## luckysheet.getvisibledatacolumn() |
|||
- **用法**： |
|||
|
|||
返回当前表格列宽。 |
|||
|
|||
------------ |
|||
## luckysheet.getluckysheet_select_save() |
|||
- **用法**： |
|||
|
|||
返回当前选区。 |
|||
|
|||
------------ |
|||
## luckysheet.getdatabyselection(range, sheetIndex) |
|||
- **参数**： |
|||
- range：选区对象；`object: { row: [r1, r2], column: [c1, c2] }`；默认为当前选区。 |
|||
- sheetIndex：表格下标；从0开始的整数，0表示第一个表格；默认为当前表格下标。 |
|||
- **用法**： |
|||
|
|||
返回某个表格某个区域单元格数据。 |
|||
|
|||
------------ |
|||
## luckysheet.luckysheetrefreshgrid(scrollWidth, scrollHeight) |
|||
- **参数**： |
|||
- scrollWidth：横向滚动值。默认为当前横向滚动位置。 |
|||
- scrollHeight：纵向滚动值。默认为当前纵向滚动位置。 |
|||
- **用法**： |
|||
|
|||
按照scrollWidth, scrollHeight刷新canvas展示数据。 |
|||
|
|||
------------ |
|||
## luckysheet.setcellvalue(r, c, d, v) |
|||
- **参数**： |
|||
- r：单元格所在行数；从0开始的整数，0表示第一行。 |
|||
- c：单元格所在列数；从0开始的整数，0表示第一列。 |
|||
- d：表数据；二维数组。 |
|||
- v：要设置的值；可为对象，对象是是要符合单元格对象格式。 |
|||
- **用法**： |
|||
|
|||
设置某个单元格的值。可配合`luckysheet.luckysheetrefreshgrid()`刷新查看单元格值改变。 |
|||
```js |
|||
luckysheet.setcellvalue(0, 0, luckysheet.flowdata, 'abc'); |
|||
luckysheet.luckysheetrefreshgrid(); |
|||
``` |
|||
|
|||
------------ |
|||
## luckysheet.setluckysheet_select_save(v) |
|||
- **参数**： |
|||
- v：要设置的选区值(数组)。符合选区格式规则，如`[{ row: [r1, r2], column: [c1, c2] }]`。 |
|||
- **用法**： |
|||
|
|||
设置当前表格选区的值。配合`luckysheet.selectHightlightShow()`可在界面查看选区改变。 |
|||
```js |
|||
luckysheet.setluckysheet_select_save([{ row: [0, 1], column: [0, 1] }]); |
|||
luckysheet.selectHightlightShow(); |
|||
``` |
|||
|
|||
------------ |
|||
## luckysheet.sheetmanage.setSheetHide(index) |
|||
- **参数**： |
|||
- index：表格下标；从0开始的整数，0表示第一个表格；默认为当前表格下标。 |
|||
- **用法**： |
|||
|
|||
隐藏某个表格。 |
|||
|
|||
------------ |
|||
## luckysheet.sheetmanage.setSheetShow(index) |
|||
- **参数**： |
|||
- index：表格下标；从0开始的整数，0表示第一个表格；默认为当前表格下标。 |
|||
- **用法**： |
|||
|
|||
显示某个表格。 |
|||
|
|||
------------ |
|||
## luckysheet.method.destroy() |
|||
- **用法**： |
|||
|
|||
释放表格 |
|||
@ -0,0 +1,316 @@ |
|||
# 格式属性 |
|||
|
|||
## 单元格属性表 |
|||
|
|||
<table> |
|||
<tr> |
|||
<td>属性值</td> |
|||
<td>全称</td> |
|||
<td><div style="width:100px">说明</div></td> |
|||
<td>值示例</td> |
|||
<td>Aspose方法或者属性</td> |
|||
</tr> |
|||
<tr> |
|||
<td>ct</td> |
|||
<td>celltype</td> |
|||
<td>单元格值格式：文本、时间等</td> |
|||
<td><a href="#cellStyle">单元格格式</a></td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>bg</td> |
|||
<td>background</td> |
|||
<td>背景颜色</td> |
|||
<td>#fff000</td> |
|||
<td>setBackgroundColor</td> |
|||
</tr> |
|||
<tr> |
|||
<td>ff</td> |
|||
<td>fontfamily</td> |
|||
<td>字体</td> |
|||
<td>0 微软雅黑、1 宋体（Song）、2 黑体（ST Heiti）、3 楷体（ST Kaiti）、 4仿宋（ST FangSong）、 5 新宋体（ST Song）、 6 华文新魏、 7华文行楷、 8 华文隶书、 9 Arial、 10 Times New Roman 、11 Tahoma 、12 Verdana</td> |
|||
<td>Style.Font object's Name property.</td> |
|||
</tr> |
|||
<tr> |
|||
<td>fc</td> |
|||
<td>fontcolor</td> |
|||
<td>字体颜色</td> |
|||
<td>#fff000</td> |
|||
<td>Style.Font object's Color property</td> |
|||
</tr> |
|||
<tr> |
|||
<td>bl</td> |
|||
<td>bold</td> |
|||
<td>粗体</td> |
|||
<td>0 常规 、 1加粗</td> |
|||
<td>Style.Font object's IsBold property to true.</td> |
|||
</tr> |
|||
<tr> |
|||
<td>it</td> |
|||
<td>italic</td> |
|||
<td>斜体</td> |
|||
<td>0 常规 、 1 斜体</td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>fs</td> |
|||
<td>fontsize</td> |
|||
<td>字体大小</td> |
|||
<td>14</td> |
|||
<td>Style.Font object's Size property.</td> |
|||
</tr> |
|||
<tr> |
|||
<td>cl</td> |
|||
<td>cancelline</td> |
|||
<td>删除线</td> |
|||
<td>0 常规 、 1 删除线</td> |
|||
<td rowspan="2">Style.Font object's Underline property</td> |
|||
</tr> |
|||
<tr> |
|||
<td>ul</td> |
|||
<td>underline</td> |
|||
<td>下划线</td> |
|||
<td>0 常规 、 1 下划线</td> |
|||
</tr> |
|||
<tr> |
|||
<td rowspan="14">bs</td> |
|||
<td rowspan="14">borderstyle</td> |
|||
<td rowspan="14">边框样式</td> |
|||
<td>0 none</td> |
|||
<td rowspan="14">LineStyle</td> |
|||
</tr> |
|||
<tr> |
|||
<td>1 Thin</td> |
|||
</tr> |
|||
<tr> |
|||
<td>2 Hair</td> |
|||
</tr> |
|||
<tr> |
|||
<td>3 Dotted</td> |
|||
</tr> |
|||
<tr> |
|||
<td>4 Dashed</td> |
|||
</tr> |
|||
<tr> |
|||
<td>5 DashDot</td> |
|||
</tr> |
|||
<tr> |
|||
<td>6 DashDotDot</td> |
|||
</tr> |
|||
<tr> |
|||
<td>7 Double</td> |
|||
</tr> |
|||
<tr> |
|||
<td>8 Medium</td> |
|||
</tr> |
|||
<tr> |
|||
<td>9 MediumDashed</td> |
|||
</tr> |
|||
<tr> |
|||
<td>10 MediumDashDot</td> |
|||
</tr> |
|||
<tr> |
|||
<td>11 MediumDashDotDot</td> |
|||
</tr> |
|||
<tr> |
|||
<td>12 SlantedDashDot</td> |
|||
</tr> |
|||
<tr> |
|||
<td>13 Thick</td> |
|||
</tr> |
|||
<tr> |
|||
<td>bc</td> |
|||
<td>bordercolor</td> |
|||
<td>边框颜色</td> |
|||
<td>#fff000</td> |
|||
<td>setBorderColor</td> |
|||
</tr> |
|||
<tr> |
|||
<td>bs_t</td> |
|||
<td>borderstyleTop</td> |
|||
<td>上边框样式</td> |
|||
<td rowspan="8">同上</td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>bc_t</td> |
|||
<td>bordercolorTop</td> |
|||
<td>上边框颜色</td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>bs_b</td> |
|||
<td>borderstyleBottom</td> |
|||
<td>下边框样式</td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>bc_b</td> |
|||
<td>bordercolorBottom</td> |
|||
<td>下边框颜色</td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>bs_l</td> |
|||
<td>borderstyleLeft</td> |
|||
<td>左边框样式</td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>bc_l</td> |
|||
<td>bordercolorLeft</td> |
|||
<td>左边框颜色</td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>bs_r</td> |
|||
<td>borderstyleRight</td> |
|||
<td>右边框样式</td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>bc_r</td> |
|||
<td>bordercolorRight</td> |
|||
<td>右边框颜色</td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>vt</td> |
|||
<td>verticaltype</td> |
|||
<td>垂直对齐</td> |
|||
<td>0 中间、1 上、2下</td> |
|||
<td>setVerticalAlignment</td> |
|||
</tr> |
|||
<tr> |
|||
<td>ht</td> |
|||
<td>horizontaltype</td> |
|||
<td>水平对齐</td> |
|||
<td>0 居中、1 左、2右</td> |
|||
<td>setHorizontalAlignment</td> |
|||
</tr> |
|||
<tr> |
|||
<td>mc</td> |
|||
<td>mergecell</td> |
|||
<td>合并单元格</td> |
|||
<td>{ rs: 10, cs:5 } 表示从此cell开始到10行5列的cell进行合并。</td> |
|||
<td>Merge</td> |
|||
</tr> |
|||
<tr> |
|||
<td>tr</td> |
|||
<td>textrotate</td> |
|||
<td>文字旋转</td> |
|||
<td>0： 0、1： 45 、2：-45、3 竖排文字、4： 90 、5：-90</td> |
|||
<td>setRotationAngle</td> |
|||
</tr> |
|||
<tr> |
|||
<td>fl</td> |
|||
<td>floatlenght</td> |
|||
<td>小数位数</td> |
|||
<td>3</td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>tb</td> |
|||
<td>textbeak</td> |
|||
<td>文本换行</td> |
|||
<td>0 截断、1溢出、2 自动换行</td> |
|||
<td>2：setTextWrapped <br> 0和1：IsTextWrapped = true</td> |
|||
</tr> |
|||
<tr> |
|||
<td>ov</td> |
|||
<td>originvalue</td> |
|||
<td>原始值</td> |
|||
<td></td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>v</td> |
|||
<td>value</td> |
|||
<td>显示值</td> |
|||
<td></td> |
|||
<td></td> |
|||
</tr> |
|||
<tr> |
|||
<td>f</td> |
|||
<td>function</td> |
|||
<td>公式</td> |
|||
<td></td> |
|||
<td>setFormula <br> setArrayFormula <br> workbook.calculateFormula();</td> |
|||
</tr> |
|||
</table> |
|||
|
|||
|
|||
以下为3个单元格存储： |
|||
```json |
|||
[ |
|||
{r:0, c:1, v: { v:"显示", f:"=SUM(A2)", bg:"#fff000", bs:"1",bc:"#000"}}, |
|||
{r:10, c:11, v:"值2"}, |
|||
{r:10, c:11, v:{f:"=sum", v:"100"}} |
|||
] |
|||
``` |
|||
|
|||
## <div id='cellStyle'>单元格格式</div> |
|||
|
|||
参考[Aspose.Cells](https://docs.aspose.com/display/cellsnet/List+of+Supported+Number+Formats#ListofSupportedNumberFormats-Aspose.Cells) |
|||
|
|||
格式设置为： |
|||
|
|||
```json |
|||
{ |
|||
"v": "", |
|||
"f": "", |
|||
"ct": { |
|||
"v": 1, |
|||
"f": "#,##0.00", |
|||
"t": " Decimal" |
|||
} |
|||
} |
|||
``` |
|||
|
|||
|参数|说明|使用| |
|||
| ------------ | ------------ | ------------ | |
|||
|v|value，Aspose中的快捷设置值|`var currencyStyle = book.CreateStyle();`<br>`currencyStyle.Number = 8;`| |
|||
|f|Format：格式的定义串 `$#,##0;$-#,##0`|`var currencyStyle = book.CreateStyle();`<br>`currencyStyle.Custom = "#,##0 SEK";`| |
|||
|t|Type类型：<br>0：General<br>1：Decimal<br>2：Currency<br>3：Percentage<br>4：Scientific<br>5：Fraction<br>6：Date<br>7：Time<br>8：Accounting<br>9：Text<br>10：DateTime|类型是前端区分的格式，excel导入时根据导入format字符的关键字来区分是哪种类型：<br>1.含YYYY、MM、DD的是6| |
|||
|
|||
Aspose设置如下： |
|||
| Value | Type | Format String | |
|||
|-------|------------|---------------------------------------------| |
|||
| 0 | General | General | |
|||
| 1 | Decimal | 0 | |
|||
| 2 | Decimal | 0\.00 | |
|||
| 3 | Decimal | \#,\#\#0 | |
|||
| 4 | Decimal | \#,\#\#0\.00 | |
|||
| 5 | Currency | $\#,\#\#0;$\-\#,\#\#0 | |
|||
| 6 | Currency | $\#,\#\#0;$\-\#,\#\#0 | |
|||
| 7 | Currency | $\#,\#\#0\.00;$\-\#,\#\#0\.00 | |
|||
| 8 | Currency | $\#,\#\#0\.00;$\-\#,\#\#0\.00 | |
|||
| 9 | Percentage | 0% | |
|||
| 10 | Percentage | 0\.00% | |
|||
| 11 | Scientific | 0\.00E\+00 | |
|||
| 12 | Fraction | \# ?/? | |
|||
| 13 | Fraction | \# / | |
|||
| 14 | Date | m/d/yy | |
|||
| 15 | Date | d\-mmm\-yy | |
|||
| 16 | Date | d\-mmm | |
|||
| 17 | Date | mmm\-yy | |
|||
| 18 | Time | h:mm AM/PM | |
|||
| 19 | Time | h:mm:ss AM/PM | |
|||
| 20 | Time | h:mm | |
|||
| 21 | Time | h:mm:ss | |
|||
| 22 | Time | m/d/yy h:mm | |
|||
| 37 | Currency | \#,\#\#0;\-\#,\#\#0 | |
|||
| 38 | Currency | \#,\#\#0;\-\#,\#\#0 | |
|||
| 39 | Currency | \#,\#\#0\.00;\-\#,\#\#0\.00 | |
|||
| 40 | Currency | \#,\#\#0\.00;\-\#,\#\#0\.00 | |
|||
| 41 | Accounting | \_ \* \#,\#\#0\_ ;\_ \* "\_ ;\_ @\_ | |
|||
| 42 | Accounting | \_ $\* \#,\#\#0\_ ;\_ $\* "\_ ;\_ @\_ | |
|||
| 43 | Accounting | \_ \* \#,\#\#0\.00\_ ;\_ \* "??\_ ;\_ @\_ | |
|||
| 44 | Accounting | \_ $\* \#,\#\#0\.00\_ ;\_ $\* "??\_ ;\_ @\_ | |
|||
| 45 | Time | mm:ss | |
|||
| 46 | Time | h :mm:ss | |
|||
| 47 | Time | mm:ss\.0 | |
|||
| 48 | Scientific | \#\#0\.0E\+00 | |
|||
| 49 | Text | @ | |
|||
|
|||
导入/导出只用考虑用户看到的数据样式，例如excel中处理日期格式的方式为把日期统一转换为数字：42736 代表 2017-1-1， |
|||
@ -0,0 +1,621 @@ |
|||
# 表格操作 |
|||
|
|||
## 单元格刷新 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "v", |
|||
"i": 3, |
|||
"v": "asdf", |
|||
"r": 5, |
|||
"c": 7 |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
|参数|说明| |
|||
| ------------ | ------------ | |
|||
|t|操作类型表示符号| |
|||
|i|当前sheet的index值| |
|||
|v|单元格的值| |
|||
|r|单元格的行号| |
|||
|c|单元格的列号| |
|||
|
|||
- **后台更新**： |
|||
|
|||
单元格更新主要是更新 `luckysheetfile[i].celldata` 参数，该参数是一个数组： |
|||
```json |
|||
[ |
|||
{r:0, c:1, v: "值1"}, |
|||
{r:10, c:11, v:"值2"}, |
|||
{r:10, c:11, v:{f:"=sum", v:"100"}} |
|||
] |
|||
``` |
|||
存储了sheet中所有单元格中的值，Luckysheet在建立的时候会根据 `luckysheetfile[i].row` 和 `luckysheetfile[i].column` 的行列数量大小新建一个表格data，然后再使用 `data[r][c]=v` 的方式填充表格数据，空数据单元格以null表示。 |
|||
|
|||
后台在保存前台推送的数据时，首先需要把参数转换为 `{r:0, c:1:v:100}` 的格式，然后更新 `luckysheetfile[i].celldata` 字段，如果存在该单元格则更新，如果没有则添加，如果存在该单元格但是`v`为null则删除该单元格。 |
|||
|
|||
- **前台查看**： |
|||
|
|||
可以修改任意单元格的数值，然后到chrome控制台中查看`"t"=="v"`的操作。 |
|||
|
|||
## config操作 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "cg", |
|||
"i": 3, |
|||
"v": { |
|||
"7": 192 |
|||
}, |
|||
"k": "rowlen" |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
|参数|说明| |
|||
| ------------ | ------------ | |
|||
|t|操作类型表示符号| |
|||
|i|当前sheet的index值| |
|||
|v|需要更新的内部key-value| |
|||
|k|操作的key名称| |
|||
|
|||
- **后台更新**： |
|||
|
|||
更新 `luckysheetfile[i].config.[k][v.key] = v.value` ，如果`config`中不存在`k`，则新建一个`k`属性并设置为空，如果`k`中不存在`v.key`，则新建一个`v.key`再更新`v.value`。 |
|||
|
|||
1. 修改行高度举例： |
|||
- 输入：`{"t":"cg","i":3,"v":{"3":10, "5":70, "10":100},"k":" rowlen"}` |
|||
- 更新：`luckysheetfile[3].config.["rowlen"]["3"] = 10` |
|||
|
|||
2. 修改列宽度举例： |
|||
- 输入：`{"t":"cg","i":1,"v":{"20":74, "15":170, "6":40},"k":" columlen"}` |
|||
- 更新：`luckysheetfile[1].config.["columlen"]["20"] = 74` |
|||
|
|||
3. 合并单元格举例： |
|||
- 输入：`{"t":"cg","i":1,"v":{"5_10":{row:[1,3], column:[3,5]},"k":" merge "}` |
|||
- 更新：`luckysheetfile[1].config.["merge"]["5_10"] = {row:[1,3], column:[3,5]}` |
|||
|
|||
## 通用保存 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "all", |
|||
"i": 3, |
|||
"v": { |
|||
"v": 1, |
|||
"m":1, |
|||
}, |
|||
"k": "freezen", |
|||
"s": false |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
|参数|说明| |
|||
| ------------ | ------------ | |
|||
|t|操作类型表示符号| |
|||
|i|当前sheet的index值| |
|||
|v|需要更新的内部key-value| |
|||
|k|需要保存的key-value中的`value`| |
|||
|s|如果是`true`则`v`保存为字符串，否则按照对象进行保存| |
|||
|
|||
- **后台更新**： |
|||
|
|||
`luckysheetfile[3].[k]= v` |
|||
如果`s`为`true`，则为 `luckysheetfile[3].[k]= JSON.stringify(v)` |
|||
|
|||
1. 数据透视表： |
|||
- 输入：`{"t":"all","i":1,"v":{………},"k":"pivotTable", "s": false}` |
|||
- 更新：`luckysheetfile[1].["pivotTable"] = {………}` |
|||
|
|||
2. 冻结行列： |
|||
- 输入：`{"t":"all","i":3,"v":{………},"k":"freezen", "s": false}` |
|||
- 更新：`luckysheetfile[3].["freezen"] = {………}` |
|||
|
|||
3. 筛选范围： |
|||
- 输入：`{"t":"all","i":3,"v":{………},"k":"filter_select", "s": true }` |
|||
- 更新：`luckysheetfile[3].["filter_select"] = JSON.stringify ({………})` |
|||
|
|||
4. Sheet名称： |
|||
- 输入：`{"t":"all","i":1,"v":"文档","k":"name", "s": false}` |
|||
- 更新：`luckysheetfile[1].["name"] = "文档"` |
|||
|
|||
5. Sheet颜色： |
|||
- 输入： `{"t":"all","i":2,"v":"#FFF000","k":"color", "s": false}` |
|||
- 更新：`luckysheetfile[2].["color"] = "#FFF000"` |
|||
|
|||
## 函数链操作 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "fc", |
|||
"i": 0, |
|||
"v": { |
|||
"r": 3, |
|||
"c": 7, |
|||
"index": 0, |
|||
"func": [ |
|||
true, |
|||
187282, |
|||
"=SUM(E4:G4)" |
|||
] |
|||
}, |
|||
"op": "add", |
|||
"pos": 0 |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
|参数|说明| |
|||
| ------------ | ------------ | |
|||
|t|操作类型表示符号| |
|||
|i|当前sheet的index值| |
|||
|v|对象值，这里对象的内部字段不需要单独更新，所以存为文本即可| |
|||
|op|操作类型,`add`为新增，`update`为更新，`del`为删除| |
|||
|pos|更新或者删除的函数位置| |
|||
|
|||
- **后台更新**： |
|||
|
|||
calcChain为一个数组 |
|||
- 如果`op`的值为`add`则添加到末尾 `luckysheetfile[i].calcChain.push (v)`， |
|||
- 如果`op`的值为`update`则更新 `luckysheetfile[i].calcChain[pos]= v`， |
|||
- 如果`op`的值为`del`则删除 `luckysheetfile[i].calcChain.splice(pos, 1)`。 |
|||
|
|||
- **前台查看**： |
|||
|
|||
可以修改任意单元格的数值，然后到chrome控制台中查看`"t"=="v"`的操作。 |
|||
|
|||
## 行列操作 |
|||
|
|||
### 删除行或列 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "drc", |
|||
"i": 3, |
|||
"v": { |
|||
"index": 6, |
|||
"len": 2 |
|||
}, |
|||
"rc": "r" |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
<table> |
|||
<tr> |
|||
<td colspan="2">参数</td> |
|||
<td>说明</td> |
|||
</tr> |
|||
<tr> |
|||
<td colspan="2">t</td> |
|||
<td>操作类型表示符号</td> |
|||
</tr> |
|||
<tr> |
|||
<td colspan="2">i</td> |
|||
<td>当前sheet的index值</td> |
|||
</tr> |
|||
<tr> |
|||
<td colspan="2">rc</td> |
|||
<td>行操作还是列操作，值`r`代表行，`c`代表列</td> |
|||
</tr> |
|||
<tr> |
|||
<td rowspan="2">v</td> |
|||
<td>index</td> |
|||
<td>从第几行或者列开始删除</td> |
|||
</tr> |
|||
<tr> |
|||
<td>len</td> |
|||
<td>删除多少行或者列</td> |
|||
</tr> |
|||
|
|||
</table> |
|||
|
|||
- **后台更新**： |
|||
|
|||
如果`rc`的值是`'r'`删除行， 如果`rc`的值为`'c'`则删除列， 例如`rc='r'`，`index=4`，`len=5`，则代表从第4行开始删除之后的5行（4、5、6、7、8）。 |
|||
|
|||
主要是对 `luckysheetfile[i].celldata` 中的单元格进行操作，删除参数中所描述符合条件的单元格并且更新其他单元格的行列值，以上述为例，首先查找单元格中`r`值在4到8的所有单元格并删除，然后把本来行号9以后的单元格的`r`值减去5，最后把 `luckysheetfile[i].row` 减去5。 |
|||
如果`v`值为 `"#__qkdelete#"`（不含引号），则此处为需要删除的单元格。 |
|||
|
|||
- **前台查看**： |
|||
|
|||
可以删除行或者列，然后到chrome控制台中查看`"t"=="drc"`的操作。 |
|||
|
|||
### 增加行或列 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "arc", |
|||
"i": 0, |
|||
"v": { |
|||
"index": 5, |
|||
"len": 10, |
|||
"data": [] |
|||
}, |
|||
"rc": "c" |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
<table> |
|||
<tr> |
|||
<td colspan="2">参数</td> |
|||
<td>说明</td> |
|||
</tr> |
|||
<tr> |
|||
<td colspan="2">t</td> |
|||
<td>操作类型表示符号</td> |
|||
</tr> |
|||
<tr> |
|||
<td colspan="2">i</td> |
|||
<td>当前sheet的index值</td> |
|||
</tr> |
|||
<tr> |
|||
<td colspan="2">rc</td> |
|||
<td>行操作还是列操作，值`r`代表行，`c`代表列</td> |
|||
</tr> |
|||
<tr> |
|||
<td rowspan="3">v</td> |
|||
<td>index</td> |
|||
<td>从第几行或者列开始新增</td> |
|||
</tr> |
|||
<tr> |
|||
<td>len</td> |
|||
<td>增加多少行或者列</td> |
|||
</tr> |
|||
<tr> |
|||
<td>data</td> |
|||
<td>新增行或者列的内容</td> |
|||
</tr> |
|||
|
|||
</table> |
|||
|
|||
- **后台更新**： |
|||
|
|||
如果`rc`的值是`r`新增行， 如果`rc`的值为`c`则新增列， 例如`rc=r，index=4，len=5`，则代表从第4行开始增加5行，如果`data`为空则增加空行，如果`data`不为空则用`data`中的数组添加新增的行中。 |
|||
|
|||
主要是对 `luckysheetfile[i].celldata` 中的单元格进行操作，以上述为例，首先 `luckysheetfile[i].row` 加5，然后把`r`大于4的单元格的整体的`r`值+5，如果`data`为空则增加空行则结束，如果`data`不为空则把二维数组`data`转换为 `{r:0,c:0,v:100}` 的格式并添加到`celldata`中，转换的伪代码如下： |
|||
|
|||
```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; |
|||
``` |
|||
|
|||
- **前台查看**： |
|||
可以新增行或者列，然后到chrome控制台中查看`"t"=="arc"`的操作。如果想查看具有`data`值的操作，则先删除某几行或几列，然后再撤销删除（Ctrl+Z），就能看到。 |
|||
|
|||
## 筛选操作 |
|||
|
|||
### 选择筛选条件 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "f", |
|||
"i": 0, |
|||
"v": "{\"caljs\":{},\"selected\":{\"青岛\":\"1\",\"广西\":\"1\",\"重庆\":\"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 |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
|参数|说明| |
|||
| ------------ | ------------ | |
|||
|t|操作类型表示符号| |
|||
|i|当前sheet的index值| |
|||
|v|对象值，这里对象的内部字段不需要单独更新，所以存为文本即可| |
|||
|op|操作类型`upOrAdd`为更新，如果不存在则增加，`del`为删除| |
|||
|pos|更新或者删除的`option`位置| |
|||
|
|||
- **后台更新**： |
|||
|
|||
更新 `luckysheetfile[i].filter = { pos : v }`， v值为一个JSON格式的字符串。filter为一个键值对，key表示选项位置的索引值（以字符表示），v表示一个json字符串参数。filter代表一个筛选条件的集合。 |
|||
|
|||
### 清除筛选 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "fsc", |
|||
"i": 0, |
|||
"v": null |
|||
} |
|||
``` |
|||
|
|||
- **后台更新**： |
|||
|
|||
清除 `luckysheetfile[i]. filter = null` ， `luckysheetfile[i]. filter_select = null`。 |
|||
|
|||
### 恢复筛选 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "fsr", |
|||
"i": 0, |
|||
"v": { |
|||
"filter": [], |
|||
"filter_select": {} |
|||
} |
|||
} |
|||
``` |
|||
|
|||
- **后台更新**： |
|||
|
|||
清除 `luckysheetfile[i]. filter = v.filter`， `luckysheetfile[i]. filter_select = v. filter_select`。 |
|||
|
|||
## sheet操作 |
|||
|
|||
### 新建sheet |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "sha", |
|||
"i": null, |
|||
"v": { |
|||
"name": "Sheet4", |
|||
"color": "", |
|||
"status": "0", |
|||
"order": 3, |
|||
"index": 3, |
|||
"data": [], |
|||
"config": {}, |
|||
"pivotTable": null, |
|||
"isPivotTable": false |
|||
} |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
<table> |
|||
<tr> |
|||
<td colspan="2">参数</td> |
|||
<td>说明</td> |
|||
</tr> |
|||
<tr> |
|||
<td colspan="2">t</td> |
|||
<td>操作类型表示符号</td> |
|||
</tr> |
|||
<tr> |
|||
<td colspan="2">i</td> |
|||
<td>当前sheet的index值</td> |
|||
</tr> |
|||
<tr> |
|||
<td rowspan="9">v</td> |
|||
<td>name</td> |
|||
<td>隐藏后跳转的sheet的index值</td> |
|||
</tr> |
|||
<tr> |
|||
<td>color</td> |
|||
<td>Sheet颜色</td> |
|||
</tr> |
|||
<tr> |
|||
<td>status</td> |
|||
<td>激活状态</td> |
|||
</tr> |
|||
<tr> |
|||
<td>order</td> |
|||
<td>Sheet摆放顺序</td> |
|||
</tr> |
|||
<tr> |
|||
<td>index</td> |
|||
<td>Index索引</td> |
|||
</tr> |
|||
<tr> |
|||
<td>celldata</td> |
|||
<td>单元格数据集</td> |
|||
</tr> |
|||
<tr> |
|||
<td>config</td> |
|||
<td>设置</td> |
|||
</tr> |
|||
<tr> |
|||
<td>pivotTable</td> |
|||
<td>数据透视表设置</td> |
|||
</tr> |
|||
<tr> |
|||
<td>isPivotTable</td> |
|||
<td>是否数据透视表</td> |
|||
</tr> |
|||
|
|||
</table> |
|||
|
|||
- **后台更新**： |
|||
|
|||
添加一行（一个文档）到数据库中。 |
|||
|
|||
### 复制sheet |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "shc", |
|||
"i": "新建sheet的位置", |
|||
"v": { |
|||
"copyindex": "copyindex" |
|||
} |
|||
} |
|||
``` |
|||
|
|||
- **后台更新**： |
|||
|
|||
复制表格中的sheet索引值为`copyindex`并添加到数据库中，添加的设置该新文档的`index`为`i`对应的值。 |
|||
|
|||
### 删除sheet |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "shd", |
|||
"i": null, |
|||
"v": { |
|||
"deleIndex": 0 |
|||
} |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
<table> |
|||
<tr> |
|||
<td colspan="2">参数</td> |
|||
<td>说明</td> |
|||
</tr> |
|||
<tr> |
|||
<td colspan="2">t</td> |
|||
<td>操作类型表示符号</td> |
|||
</tr> |
|||
<tr> |
|||
<td rowspan="2">v</td> |
|||
<td>deleIndex</td> |
|||
<td>需要删除的sheet索引</td> |
|||
</tr> |
|||
|
|||
</table> |
|||
|
|||
- **后台更新**： |
|||
|
|||
删除索引为`deleIndex`对应值的sheet。 |
|||
|
|||
### 位置 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "shr", |
|||
"v": { |
|||
"index": "positon" |
|||
} |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
|参数|说明| |
|||
| ------------ | ------------ | |
|||
|t|操作类型表示符号| |
|||
|v|设置Sheet的排序，为一个键值对，`key`代表sheet的`index`，`value`代表`order`值。格式为：`{"1": 3, "2":1, "0": 2, "3":0}`| |
|||
|
|||
- **后台更新**： |
|||
|
|||
对sheet的`index`等于`key`的页，设置其`order`属性为`value`值。示例： |
|||
|
|||
`luckysheetfile[key1].order = value1` |
|||
`luckysheetfile[key2].order = value2` |
|||
`luckysheetfile[key3].order = value3` |
|||
|
|||
## sheet属性(隐藏或显示) |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "sh", |
|||
"i": 0, |
|||
"v": 1, |
|||
"op": " hide", |
|||
"cur": 2 |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
|参数|说明| |
|||
| ------------ | ------------ | |
|||
|t|操作类型表示符号| |
|||
|i|当前sheet的index值| |
|||
|op|操作选项，有hide、show| |
|||
|v|如果`hide`为`1`则隐藏，为`0`或者空则为显示| |
|||
|cur|隐藏后设置索引对应`cur`的sheet为激活状态| |
|||
|
|||
- **后台更新**： |
|||
|
|||
更新`i`对应sheet的根路径`hide`字段为`v`，当隐藏时`status`值为`0`，当显示时为`1`，如果为隐藏则更新`index`对应`cur`的sheet的`status`状态为`1`。 |
|||
|
|||
## 表格信息更改 |
|||
|
|||
### 表格名称 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "na", |
|||
"i": null, |
|||
"v": "数据" |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
|参数|说明| |
|||
| ------------ | ------------ | |
|||
|t|操作类型表示符号| |
|||
|v|表格的名称| |
|||
|
|||
- **后台更新**： |
|||
|
|||
根据gridkey更新数据库中的表格名称。 |
|||
|
|||
### 缩略图 |
|||
|
|||
- **格式**： |
|||
|
|||
```json |
|||
{ |
|||
"t": "thumb", |
|||
"img": "base64", |
|||
"curindex": "curindx" |
|||
} |
|||
``` |
|||
|
|||
- **说明**： |
|||
|
|||
|参数|说明| |
|||
| ------------ | ------------ | |
|||
|t|操作类型表示符号| |
|||
|img|当前表格的缩略图，为base64字符串| |
|||
|curindex|当前表格默认打开的sheet| |
|||
|
|||
- **后台更新**： |
|||
|
|||
根据gridkey更新mysql中表格的缩略图字段为img值，同时更新index为curindex值的sheet的status字段为1，设置其他sheet的status值为0。 |
|||
Loading…
Reference in new issue