Skip to content

Commit

Permalink
feat: linkJump & linkDetect support function
Browse files Browse the repository at this point in the history
  • Loading branch information
Rui-Sun committed Feb 6, 2025
1 parent 68a81be commit 130faa5
Show file tree
Hide file tree
Showing 11 changed files with 79 additions and 41 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,10 @@
{
"changes": [
{
"packageName": "@visactor/vtable",
"comment": "feat: linkJump & linkDetect support function",
"type": "none"
}
],
"packageName": "@visactor/vtable"
}
14 changes: 7 additions & 7 deletions docs/assets/option/en/column/link-column-type.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,22 +12,22 @@ Specify the column type as 'link', cellType can be omitted and defaults to 'text
prefix = '##'+${prefix}
) }}

##${prefix} linkJump(boolean) = true
##${prefix} linkJump(boolean|Function) = true

**link type exclusive configuration item** Whether the link can be clicked to jump
**link type exclusive configuration item** Whether the link can be clicked to jump

##${prefix} linkDetect(boolean) = true
##${prefix} linkDetect(boolean|Function) = true

**link type exclusive configuration item** Whether the link undergoes regular detection, and displays as link only if the link conforms to the url rules. This configuration does not take effect if a template link is configured.
**link type exclusive configuration item** Whether the link undergoes regular detection, and displays as link only if the link conforms to the url rules. This configuration does not take effect if a template link is configured.

##${prefix} templateLink(string | (record: any, col: number, row: number, table: BaseTableAPI) => string)

**link type exclusive configuration item** Template link address, such as: 'https://www.google.com.hk/search?q={name}', where name is the attribute field name of the data source.
**link type exclusive configuration item** Template link address, such as: 'https://www.google.com.hk/search?q={name}', where name is the attribute field name of the data source.

##${prefix} linkTarget(string)

**link type exclusive configuration item** Specifying the name of the browsing context the resource is being loaded into, is the second parameter of window.open(), and defaults to '_blank'.
**link type exclusive configuration item** Specifying the name of the browsing context the resource is being loaded into, is the second parameter of window.open(), and defaults to '\_blank'.

##${prefix} linkWindowFeatures(string)

**link type exclusive configuration item** A string containing a comma-separated list of window features, which is the third parameter of window.open().
**link type exclusive configuration item** A string containing a comma-separated list of window features, which is the third parameter of window.open().
8 changes: 4 additions & 4 deletions docs/assets/option/en/dimension/link-dimension-type.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,11 +12,11 @@ Specify the column type as 'link', headerType can be omitted and defaults to 'te
prefix = '##'+${prefix}
) }}

##${prefix} linkJump(boolean) = true
##${prefix} linkJump(boolean|Function) = true

**Link type exclusive configuration item** Whether the link is clickable and can be redirected

##${prefix} linkDetect(boolean) = true
##${prefix} linkDetect(boolean|Function) = true

**Link type exclusive configuration item** Whether the link undetrrgoes regular expression detection, and only if the link complies with the URL rules it will be displayed as a link. This configuration does not take effect if a template link is configured.

Expand All @@ -26,8 +26,8 @@ Specify the column type as 'link', headerType can be omitted and defaults to 'te

##${prefix} linkTarget(string)

**link type exclusive configuration item** Specifying the name of the browsing context the resource is being loaded into, is the second parameter of window.open(), and defaults to '_blank'.
**link type exclusive configuration item** Specifying the name of the browsing context the resource is being loaded into, is the second parameter of window.open(), and defaults to '\_blank'.

##${prefix} linkWindowFeatures(string)

**link type exclusive configuration item** A string containing a comma-separated list of window features, which is the third parameter of window.open().
**link type exclusive configuration item** A string containing a comma-separated list of window features, which is the third parameter of window.open().
8 changes: 4 additions & 4 deletions docs/assets/option/en/indicator/link-indicator-type.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,11 +12,11 @@ Specify the column type as 'link', and the default cellType is 'text' if not spe
prefix = '##'+${prefix}
) }}

##${prefix} linkJump(boolean) = true
##${prefix} linkJump(boolean|Function) = true

**Exclusive configuration for link type** Whether the link is clickable and can be redirected

##${prefix} linkDetect(boolean) = true
##${prefix} linkDetect(boolean|Function) = true

**Exclusive configuration for link type** Whether to perform regular detection on the link. If the link conforms to the URL rules, it will be displayed as a link. This configuration does not take effect if a template link is configured.

Expand All @@ -26,8 +26,8 @@ Specify the column type as 'link', and the default cellType is 'text' if not spe

##${prefix} linkTarget(string)

**link type exclusive configuration item** Specifying the name of the browsing context the resource is being loaded into, is the second parameter of window.open(), and defaults to '_blank'.
**link type exclusive configuration item** Specifying the name of the browsing context the resource is being loaded into, is the second parameter of window.open(), and defaults to '\_blank'.

##${prefix} linkWindowFeatures(string)

**link type exclusive configuration item** A string containing a comma-separated list of window features, which is the third parameter of window.open().
**link type exclusive configuration item** A string containing a comma-separated list of window features, which is the third parameter of window.open().
8 changes: 4 additions & 4 deletions docs/assets/option/zh/column/link-column-type.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,11 +12,11 @@
prefix = '##'+${prefix}
) }}

##${prefix} linkJump(boolean) = true
##${prefix} linkJump(boolean|Function) = true

**link 类型专属配置项** 链接是否可点击跳转

##${prefix} linkDetect(boolean) = true
##${prefix} linkDetect(boolean|Function) = true

**link 类型专属配置项** 链接是否进行正则检测,如果链接符合 url 规则才展示成为 link。如果配置了模板链接该配置不生效。

Expand All @@ -26,8 +26,8 @@

##${prefix} linkTarget(string)

**link 类型专属配置项** 指定加载资源的浏览上下文的名称,是window.open()的第二个参数,默认为'_blank'。
**link 类型专属配置项** 指定加载资源的浏览上下文的名称,是 window.open()的第二个参数,默认为'\_blank'。

##${prefix} linkWindowFeatures(string)

**link 类型专属配置项** 窗口特性列表,是window.open()的第三个参数。
**link 类型专属配置项** 窗口特性列表,是 window.open()的第三个参数。
18 changes: 9 additions & 9 deletions docs/assets/option/zh/dimension/link-dimension-type.md
Original file line number Diff line number Diff line change
Expand Up @@ -2,32 +2,32 @@

#${prefix} ${dimensionHeaderType}.link(string)

指定列类型为'link', headerType可缺省默认为'text'
指定列类型为'link', headerType 可缺省默认为'text'

##${prefix} headerType(string) = 'link'

指定列类型为'link', headerType可缺省默认为'text'
指定列类型为'link', headerType 可缺省默认为'text'

{{ use: base-dimension-type(
prefix = '##'+${prefix}
) }}

##${prefix} linkJump(boolean) = true
##${prefix} linkJump(boolean|Function) = true

**link类型专属配置项** 链接是否可点击跳转
**link 类型专属配置项** 链接是否可点击跳转

##${prefix} linkDetect(boolean) = true
##${prefix} linkDetect(boolean|Function) = true

**link类型专属配置项** 链接是否进行正则检测,如果链接符合url规则才展示成为link。如果配置了模板链接该配置不生效。
**link 类型专属配置项** 链接是否进行正则检测,如果链接符合 url 规则才展示成为 link。如果配置了模板链接该配置不生效。

##${prefix} templateLink(string | (record: any, col: number, row: number, table: BaseTableAPI) => string)

**link类型专属配置项** 模板链接地址,如:'https://www.google.com.hk/search?q={name}',name是数据源属性字段名。
**link 类型专属配置项** 模板链接地址,如:'https://www.google.com.hk/search?q={name}',name是数据源属性字段名。

##${prefix} linkTarget(string)

**link 类型专属配置项** 指定加载资源的浏览上下文的名称,是window.open()的第二个参数,默认为'_blank'。
**link 类型专属配置项** 指定加载资源的浏览上下文的名称,是 window.open()的第二个参数,默认为'\_blank'。

##${prefix} linkWindowFeatures(string)

**link 类型专属配置项** 窗口特性列表,是window.open()的第三个参数。
**link 类型专属配置项** 窗口特性列表,是 window.open()的第三个参数。
8 changes: 4 additions & 4 deletions docs/assets/option/zh/indicator/link-indicator-type.md
Original file line number Diff line number Diff line change
Expand Up @@ -12,11 +12,11 @@
prefix = '##'+${prefix}
) }}

##${prefix} linkJump(boolean) = true
##${prefix} linkJump(boolean|Function) = true

**link 类型专属配置项** 链接是否可点击跳转

##${prefix} linkDetect(boolean) = true
##${prefix} linkDetect(boolean|Function) = true

**link 类型专属配置项** 链接是否进行正则检测,如果链接符合 url 规则才展示成为 link。如果配置了模板链接该配置不生效。

Expand All @@ -26,8 +26,8 @@

##${prefix} linkTarget(string)

**link 类型专属配置项** 指定加载资源的浏览上下文的名称,是window.open()的第二个参数,默认为'_blank'。
**link 类型专属配置项** 指定加载资源的浏览上下文的名称,是 window.open()的第二个参数,默认为'\_blank'。

##${prefix} linkWindowFeatures(string)

**link 类型专属配置项** 窗口特性列表,是window.open()的第三个参数。
**link 类型专属配置项** 窗口特性列表,是 window.open()的第三个参数。
21 changes: 19 additions & 2 deletions packages/vtable/src/event/media-click.ts
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import { regUrl } from '../tools/global';
import type { LinkColumnDefine, MousePointerCellEvent } from '../ts-types';
import type { BaseTableAPI, HeaderData } from '../ts-types/base-table';
import type { IImageColumnBodyDefine } from '../ts-types/list-table/define/image-define';
import { getOrApply } from '../tools/helper';

export function bindMediaClick(table: BaseTableAPI): void {
if (Env.mode === 'browser') {
Expand Down Expand Up @@ -32,14 +33,30 @@ export function bindMediaClick(table: BaseTableAPI): void {
const cellValue = table.getCellValue(col, row);
const cellOriginValue = table.getCellOriginValue(col, row);
if (cellType === 'link') {
const linkJump = (columnDefine as LinkColumnDefine).linkJump !== false;
let linkJump: boolean | undefined = getOrApply((columnDefine as LinkColumnDefine).linkJump, {
col,
row,
table,
value: cellValue,
dataValue: cellOriginValue,
cellHeaderPaths: undefined
});
linkJump = linkJump !== false;
if (!linkJump) {
return;
}

// 点击链接,打开相应页面
const templateLink = (columnDefine as LinkColumnDefine).templateLink;
const linkDetect = (columnDefine as LinkColumnDefine).linkDetect !== false;
let linkDetect = getOrApply((columnDefine as LinkColumnDefine).linkDetect, {
col,
row,
table,
value: cellValue,
dataValue: cellOriginValue,
cellHeaderPaths: undefined
});
linkDetect = linkDetect !== false;
let url;
if (templateLink) {
// 如果有模板链接,使用模板
Expand Down
15 changes: 13 additions & 2 deletions packages/vtable/src/scenegraph/group-creater/cell-helper.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,7 +25,7 @@ import type { CreateTextCellGroup } from './cell-type/text-cell';
import type { CreateVideoCellGroup } from './cell-type/video-cell';
import type { BaseTableAPI, HeaderData } from '../../ts-types/base-table';
import { getCellCornerRadius, getStyleTheme } from '../../core/tableHelper';
import { isPromise } from '../../tools/helper';
import { getOrApply, isPromise } from '../../tools/helper';
import { dealPromiseData } from '../utils/deal-promise-data';
import type { ICartesianAxis } from '../../components/axis/axis';
import { Factory } from '../../core/factory';
Expand Down Expand Up @@ -94,12 +94,23 @@ export function createCell(
//如果是超链接 颜色按照linkColor绘制 TODO:放到方法_getCellStyle中
// const columnDefine = table.getHeaderDefine(col, row);
const cellValue = value;
const cellOriginValue = table.getCellOriginValue(col, row);
const headerStyle = table._getCellStyle(col, row);

if (
type === 'link' &&
(('templateLink' in define && define.templateLink) ||
!('linkDetect' in define && define.linkDetect) ||
!(
'linkDetect' in define &&
getOrApply(define.linkDetect, {
col,
row,
table,
value: cellValue,
dataValue: cellOriginValue,
cellHeaderPaths: undefined
})
) ||
regUrl.test(cellValue))
) {
if (cellTheme) {
Expand Down
8 changes: 4 additions & 4 deletions packages/vtable/src/ts-types/list-table/define/link-define.ts
Original file line number Diff line number Diff line change
Expand Up @@ -14,9 +14,9 @@ export interface ILinkHeaderDefine extends IBasicHeaderDefine {

// 这里也需要定义 和bodyDefine的作用是不一样的
/** 链接是否可点击跳转 */
linkJump?: boolean;
linkJump?: boolean | ((args: StylePropertyFunctionArg) => boolean);
/** 链接是否进行正则检测,如果链接符合url规则才展示成为link。如果配置了模板链接该配置不生效。 */
linkDetect?: boolean;
linkDetect?: boolean | ((args: StylePropertyFunctionArg) => boolean);
/** 模板链接地址,如:'https://www.google.com.hk/search?q={name}',name是数据源属性字段名。 */
templateLink?: string | FieldGetter;

Expand All @@ -33,9 +33,9 @@ export interface ILinkColumnBodyDefine extends IBasicColumnBodyDefine {
// autoWrapText?: boolean;
// lineClamp?: LineClamp;
/** 链接是否可点击跳转 */
linkJump?: boolean;
linkJump?: boolean | ((args: StylePropertyFunctionArg) => boolean);
/** 链接是否进行正则检测,如果链接符合url规则才展示成为link。如果配置了模板链接该配置不生效。 */
linkDetect?: boolean;
linkDetect?: boolean | ((args: StylePropertyFunctionArg) => boolean);
/** 模板链接地址,如:'https://www.google.com.hk/search?q={name}',name是数据源属性字段名。 */
templateLink?: string | FieldGetter;

Expand Down
2 changes: 1 addition & 1 deletion packages/vtable/src/ts-types/style-define.ts
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ export interface StylePropertyFunctionArg {
/** progressbar类型特有,表示当前数值在总体数据范围的比例 */
percentile?: number;
/** 单元格的表头路径信息 */
cellHeaderPaths: ICellHeaderPaths;
cellHeaderPaths?: ICellHeaderPaths;
}
export type ColorPropertyDefine =
| string
Expand Down

0 comments on commit 130faa5

Please sign in to comment.