lrz
5 years ago
9 changed files with 369 additions and 237 deletions
@ -0,0 +1,31 @@ |
|||||
|
module.exports = { |
||||
|
title: 'Luckysheet文档', |
||||
|
description: 'Luckysheet 配置文档/API/教程', |
||||
|
base: '/LuckysheetDocs/', |
||||
|
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' |
||||
|
], |
||||
|
}, |
||||
|
// 仓库地址
|
||||
|
repo: 'mengshukeji/Luckysheet', |
||||
|
// 仓库链接文字
|
||||
|
repoLabel: '在 GitHub 上编辑此页', |
||||
|
// 仓库的文档目录
|
||||
|
docsDir: 'docs', |
||||
|
}, |
||||
|
} |
||||
|
After Width: | Height: | Size: 6.2 KiB |
@ -0,0 +1,15 @@ |
|||||
|
--- |
||||
|
home: true |
||||
|
heroText: Luckysheet |
||||
|
tagline: Luckysheet 配置文档/API/教程 |
||||
|
actionText: 快速上手 → |
||||
|
actionLink: /guide/ |
||||
|
features: |
||||
|
- title: 功能强大 |
||||
|
details: 包含大量常用电子表格功能,替代你的excel |
||||
|
- title: 配置简单 |
||||
|
details: 最少的配置就能开始上手使用 |
||||
|
- title: 完全开源 |
||||
|
details: 社区驱动,共同来完善你的想法 |
||||
|
footer: MIT Licensed | Copyright © 2020-present Mengshukeji |
||||
|
--- |
||||
@ -0,0 +1,71 @@ |
|||||
|
# 快速上手 |
||||
|
|
||||
|
## 基本介绍 |
||||
|
Luckysheet ，一款纯前端类似excel的在线表格，功能强大、配置简单、完全开源。 |
||||
|
|
||||
|
### 特性 |
||||
|
1. luckeeysht支持表格设置包括冻结行列、合并单元格、筛选、排序、查询、条件格式、批注 |
||||
|
2. 支持数据分析功能包括透视表、图表、分列、矩阵操作、内置385个计算函数 |
||||
|
3. 支持一键截图、复制为json数据、共享编辑、excel与luckysheet之间数据的复制粘贴 |
||||
|
|
||||
|
 |
||||
|
|
||||
|
|
||||
|
### 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="jfgrid" style="margin:0px;padding:0px;position:absolute;width:100%;height:100%;left: 0px;top: 0px;"></div> |
||||
|
``` |
||||
|
### 第四步 |
||||
|
创建一个表格 |
||||
|
```javascript |
||||
|
<script> |
||||
|
$(function () { |
||||
|
//配置项 |
||||
|
var options = { |
||||
|
container: 'jfgrid' //jfgrid为容器id |
||||
|
} |
||||
|
jfgrid.create(options) |
||||
|
}) |
||||
|
</script> |
||||
|
``` |
||||
|
|
||||
|
|
||||
@ -0,0 +1,232 @@ |
|||||
|
# 基本配置 |
||||
|
|
||||
|
## container |
||||
|
- 类型：String |
||||
|
- 默认值："jfgrid" |
||||
|
- 作用：容器的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 |
||||
|
- 作用：设置传输来的数值的精确位数，小数点后n位 传参数为数字或数字字符串，例： "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 |
||||
|
- 作用：编辑器表格编辑时缩放比例 |
||||
|
|
||||
|
------------ |
||||
|
## 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="jfgrid-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,11 @@ |
|||||
|
# 高级功能 |
||||
|
|
||||
|
## TODO... |
||||
|
### api |
||||
|
### 创建表格 |
||||
|
### 删除表格 |
||||
|
### 释放表格 |
||||
|
### 复制单元格 |
||||
|
### 插入单元格 |
||||
|
### 删除单元格 |
||||
|
### 编辑器单元格 |
||||
Loading…
Reference in new issue