Browse Source

docs(data.md): data.mb

border setting doc
master
liurunze 5 years ago
parent
commit
9c9c1d53fa
  1. 58
      docs/guide/data.md
  2. 136
      docs/zh/guide/data.md
  3. 2
      src/controllers/selection.js

58
docs/guide/data.md

@ -255,16 +255,58 @@
There are two types of range: single cell and selection There are two types of range: single cell and selection
1. selection `rangeType: "range"` 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 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 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` + Border color `color: Hexadecimal color value`
- Selection area `range: Row and column information array` + Selection area `range: Row and column information array`
2. Single cell `rangeType:"cell"` 2. Single cell `rangeType:"cell"`
- Number of rows and columns `value.row_index: number,value.col_index: number` + 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` + 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 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` + 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)"`
### config.rowhidden ### config.rowhidden
- Type:Object - Type:Object

136
docs/zh/guide/data.md

@ -210,61 +210,103 @@
- 作用:单元格的边框信息,示例: - 作用:单元格的边框信息,示例:
```js ```js
"borderInfo": [{ "borderInfo": [{
"rangeType": "cell", "rangeType": "cell",
"value": { "value": {
"row_index": 3, "row_index": 3,
"col_index": 3, "col_index": 3,
"l": { "l": {
"style": 10, "style": 10,
"color": "rgb(255, 0, 0)" "color": "rgb(255, 0, 0)"
}, },
"r": { "r": {
"style": 10, "style": 10,
"color": "rgb(255, 0, 0)" "color": "rgb(255, 0, 0)"
}, },
"t": { "t": {
"style": 10, "style": 10,
"color": "rgb(255, 0, 0)" "color": "rgb(255, 0, 0)"
}, },
"b": { "b": {
"style": 10, "style": 10,
"color": "rgb(255, 0, 0)" "color": "rgb(255, 0, 0)"
}
} }
}, }
{ },
"rangeType": "range", {
"borderType": "border-all", "rangeType": "range",
"style": "3", "borderType": "border-all",
"color": "#0000ff", "style": "3",
"range": [{ "color": "#0000ff",
"row": [7, 8], "range": [{
"column": [2, 3] "row": [7, 8],
}] "column": [2, 3]
}, {
"rangeType": "range",
"borderType": "border-inside",
"style": "3",
"color": "#0000ff",
"range": [{
"row": [7, 8],
"column": [8, 9]
}]
}] }]
}, {
"rangeType": "range",
"borderType": "border-inside",
"style": "3",
"color": "#0000ff",
"range": [{
"row": [7, 8],
"column": [8, 9]
}]
}]
``` ```
范围类型分单个单元格和选区两种情况 范围类型分单个单元格和选区两种情况
1. 选区 `rangeType: "range"` 1. 选区 `rangeType: "range"`
- 边框类型 `borderType:"border-left" | "border-right" | "border-top" | "border-bottom" | "border-all" | "border-outside" | "border-inside" | "border-horizontal" | "border-vertical" | "border-none"` + 边框类型 `borderType:"border-left" | "border-right" | "border-top" | "border-bottom" | "border-all" | "border-outside" | "border-inside" | "border-horizontal" | "border-vertical" | "border-none"`
- 边框粗细 `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` + 边框粗细 `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`
- 边框颜色 `color: 16进制颜色值` + 边框颜色 `color: 16进制颜色值`
- 选区范围 `range: 行列信息数组` + 选区范围 `range: 行列信息数组`
2. 单个单元格 `rangeType:"cell"` 2. 单个单元格 `rangeType:"cell"`
- 行数和列数 `value.row_index: 数字,value.col_index: 数字` + 单元格的行数和列数索引 `value.row_index: 数字,value.col_index: 数字`
- 四个边框对象 `value.l:左边框,value.r:右边框,value.t:上边框,value.b:下边框` + 四个边框对象 `value.l:左边框,value.r:右边框,value.t:上边框,value.b:下边框`
- 边框粗细 `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` + 边框粗细 `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`
- 边框颜色 `value.l.color: 16进制颜色值` + 边框颜色 `value.l.color: 16进制颜色值`
- 示例
+ ```js
{
"rangeType": "range",
"borderType": "border-all",
"style": "3",
"color": "#0000ff",
"range": [{
"row": [7, 8],
"column": [2, 3]
}]
}
```
表示设置范围为`{"row": [7, 8],"column": [2, 3]}`的选区,类型为所有边框,边框粗细为`Dotted`,颜色为`"#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)"
}
}
}
```
表示设置单元格`"D4"`,上边框/下边框/左边框/右边框都是边框粗细为`"MediumDashDot"`,颜色为`"rgb(255, 0, 0)"`
### config.rowhidden ### config.rowhidden
- 类型:Object - 类型:Object

2
src/controllers/selection.js

@ -149,7 +149,7 @@ const selection = {
selectionCopyShow(); selectionCopyShow();
//qksheet内copy保存 //luckysheet内copy保存
Store.luckysheet_copy_save = { Store.luckysheet_copy_save = {
"dataSheetIndex": Store.currentSheetIndex, "dataSheetIndex": Store.currentSheetIndex,
"copyRange": copyRange, "copyRange": copyRange,

Loading…
Cancel
Save