drip-table
Version:
A tiny and powerful enterprise-class solution for building tables.
180 lines (179 loc) • 4.31 kB
TypeScript
/**
* This file is part of the drip-table project.
* @link : https://drip-table.jd.com/
* @author : Emil Zhai (root@derzh.com)
* @modifier : Emil Zhai (root@derzh.com)
* @copyright: Copyright (c) 2020 JD Network Technology Co., Ltd.
*/
import './index.less';
import React from 'react';
import { DripTableColumnSchema, DripTableRecordTypeBase, SchemaObject } from "../../../types";
import { DripTableComponentProps } from '../component';
export declare type DTCTextColumnSchema = DripTableColumnSchema<'text', {
/**
* 组件类名
*/
className?: string;
/**
* 字体大小
*/
fontSize?: string;
/**
* 字重大小
*/
fontWeight?: string;
/**
* 展示模式：
* {'single'} 单行文本；
* {'multiple'} 多行文本；
* {'custom'} 自定义文本；
* {'static'} 静态文本；
*/
mode?: 'single' | 'multiple' | 'custom' | 'static';
/**
* 自定义格式化字符串
*/
format?: string;
/**
* 静态文本内容
*/
static?: string;
/**
* 内容展示翻译文案
*/
i18n?: Record<string, string>;
/**
* 兜底文案
*/
defaultValue?: string;
/**
* 前缀文案
*/
prefix?: string;
/**
* 后缀文案
*/
suffix?: string;
/**
* 展示提示文案
*/
showTooltip?: boolean;
/**
* 提示文案显示位置
*/
placement?: 'top' | 'left' | 'right' | 'bottom' | 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight' | 'leftTop' | 'leftBottom' | 'rightTop' | 'rightBottom';
/**
* 自定义提示文案，支持 {{ data }} 格式字符串模板
*/
tooltip?: string | {
content?: string;
style?: React.CSSProperties;
};
/**
* 多行文本段落配置
*/
parts?: {
dataIndex: string | string[];
/**
* 内容展示翻译文案
*/
i18n?: Record<string, string>;
/**
* 前缀文案
*/
prefix?: string;
/**
* 后缀文案
*/
suffix?: string;
}[];
/**
* 最大行数
*/
maxRow?: number;
/**
* 行高
*/
lineHeight?: number;
/**
* 固定高度
*/
height?: number;
/**
* 固定宽度
*/
width?: number;
/**
* 超出部分显示省略号
*/
ellipsis?: boolean;
/**
* 是否展示一键复制按钮
*/
clipboard?: boolean;
/**
* 数据处理
*/
dataProcess?: string;
/**
* 禁用的数据处理
*/
disableFunc?: string;
/**
* 显隐的数据处理
*/
visibleFunc?: string;
}>;
export interface DTCTextEvent {
type: 'drip-text-copy';
payload: {
success: boolean;
};
}
interface DTCTextProps<RecordType extends DripTableRecordTypeBase> extends DripTableComponentProps<RecordType, DTCTextColumnSchema> {
}
interface DTCTextState {
windowInnerWidth: number;
cellLeft: number;
cellTop: number;
cellWidth: number;
cellHeight: number;
cellPaddingLeft: number;
cellPaddingRight: number;
cellPaddingTop: number;
cellPaddingBottom: number;
editState: 'none' | 'entering' | 'editing';
editWidth: number;
editHeight: number;
editValue: string;
}
export default class DTCText<RecordType extends DripTableRecordTypeBase> extends React.PureComponent<DTCTextProps<RecordType>, DTCTextState> {
static componentName: DTCTextColumnSchema['component'];
static schema: SchemaObject;
state: DTCTextState;
private componentUuid;
private $main;
private get configured();
private get fontSize();
private get lineHeight();
private get wrapperClassName();
private get commonStyles();
private get rawTextStyles();
private get wrapperStyles();
private get rawText();
private get visible();
private get disabled();
private get tooltip();
private updateCellRect;
private onDoubleClick;
private onKeyDown;
private onWheel;
private onResize;
private focusEdit;
componentDidUpdate(): void;
private renderEditInput;
private renderEdit;
private renderClipboard;
render(): JSX.Element;
}
export {};