(feat)(chat-sdk) extract formatByDataFormatType() (#2287)

* feat(Chat/constants.ts): rm unused code

* feat(chat-sdk): extract formatByDataFormatType()
This commit is contained in:
FredTsang
2025-06-08 07:34:51 +08:00
committed by GitHub
parent df70a3cf15
commit 9ffdba956e
8 changed files with 20 additions and 48 deletions

View File

@@ -1,18 +1,3 @@
export const THEME_COLOR_LIST = [
'#3369FF',
'#36D2B8',
'#DB8D76',
'#47B359',
'#8545E6',
'#E0B18B',
'#7258F3',
'#0095FF',
'#52CC8F',
'#6675FF',
'#CC516E',
'#5CA9E6',
];
export enum SemanticTypeEnum {
MODEL = 'MODEL',
DIMENSION = 'DIMENSION',

View File

@@ -1,7 +1,7 @@
import { CHART_BLUE_COLOR, CHART_SECONDARY_COLOR, PREFIX_CLS } from '../../../common/constants';
import { MsgDataType } from '../../../common/type';
import {
formatByDecimalPlaces,
formatByDataFormatType,
getChartLightenColor,
getFormattedValue,
} from '../../../utils/utils';
@@ -94,7 +94,7 @@ const BarChart: React.FC<Props> = ({
return value === 0
? 0
: metricField.dataFormatType === 'percent'
? `${formatByDecimalPlaces(metricField.dataFormat?.needMultiply100 ? +value * 100 : value, metricField.dataFormat?.decimalPlaces || 2)}%`
? formatByDataFormatType(value, metricField.dataFormatType, metricField.dataFormat)
: getFormattedValue(value);
},
},
@@ -115,10 +115,7 @@ const BarChart: React.FC<Props> = ({
? '-'
: metricField.dataFormatType === 'percent' ||
metricField.dataFormatType === 'decimal'
? `${formatByDecimalPlaces(
metricField.dataFormat?.needMultiply100 ? +item.value * 100 : item.value,
metricField.dataFormat?.decimalPlaces || 2
)}${metricField.dataFormatType === 'percent' ? '%' : ''}`
? formatByDataFormatType(item.value, metricField.dataFormatType, metricField.dataFormat)
: getFormattedValue(item.value)
}</span></div>`
)
@@ -151,7 +148,7 @@ const BarChart: React.FC<Props> = ({
return value === 0
? 0
: metricField.dataFormatType === 'percent'
? `${formatByDecimalPlaces(metricField.dataFormat?.needMultiply100 ? +value * 100 : value, metricField.dataFormat?.decimalPlaces || 2)}%`
? formatByDataFormatType(value, metricField.dataFormatType, metricField.dataFormat)
: getFormattedValue(value);
},
},

View File

@@ -1,5 +1,5 @@
import { PREFIX_CLS } from '../../../common/constants';
import { formatByDecimalPlaces, formatMetric, formatNumberWithCN } from '../../../utils/utils';
import { formatByDataFormatType, formatMetric, formatNumberWithCN } from '../../../utils/utils';
import ApplyAuth from '../ApplyAuth';
import { MsgDataType } from '../../../common/type';
import PeriodCompareItem from './PeriodCompareItem';
@@ -52,10 +52,7 @@ const MetricCard: React.FC<Props> = ({ data, question, loading, onApplyAuth }) =
{typeof value === 'string' && isNaN(+value)
? value
: dataFormatType === 'percent' || dataFormatType === 'decimal'
? `${formatByDecimalPlaces(
dataFormat?.needMultiply100 ? +value * 100 : value,
dataFormat?.decimalPlaces || 2
)}${dataFormatType === 'percent' ? '%' : ''}`
? formatByDataFormatType(value, dataFormatType, dataFormat)
: isNumber
? formatMetric(value) || '-'
: formatNumberWithCN(+value)}

View File

@@ -1,5 +1,5 @@
import { PREFIX_CLS } from '../../../common/constants';
import { formatByDecimalPlaces, formatMetric, formatNumberWithCN } from '../../../utils/utils';
import { formatByDataFormatType, formatMetric, formatNumberWithCN } from '../../../utils/utils';
import { AggregateInfoType, ColumnType } from '../../../common/type';
import PeriodCompareItem from '../MetricCard/PeriodCompareItem';
import { SwapOutlined } from '@ant-design/icons';
@@ -29,10 +29,7 @@ const MetricInfo: React.FC<Props> = ({ aggregateInfo, currentMetricField }) => {
<div style={{ display: 'flex', alignItems: 'flex-end' }}>
<div className={`${prefixCls}-indicator-value`}>
{dataFormatType === 'percent' || dataFormatType === 'decimal'
? `${formatByDecimalPlaces(
dataFormat?.needMultiply100 ? +value * 100 : value,
dataFormat?.decimalPlaces || 2
)}${dataFormatType === 'percent' ? '%' : ''}`
? formatByDataFormatType(value, dataFormatType, dataFormat)
: isNumber
? formatMetric(value)
: formatNumberWithCN(+value)}

View File

@@ -1,6 +1,6 @@
import { CHART_SECONDARY_COLOR, CLS_PREFIX, THEME_COLOR_LIST } from '../../../common/constants';
import {
formatByDecimalPlaces,
formatByDataFormatType,
getFormattedValue,
getMinMaxDate,
groupByColumn,
@@ -134,7 +134,7 @@ const MetricTrendChart: React.FC<Props> = ({
return value === 0
? 0
: metricField.dataFormatType === 'percent'
? `${formatByDecimalPlaces(value, metricField.dataFormat?.decimalPlaces || 2)}%`
? formatByDataFormatType(value, metricField.dataFormatType, metricField.dataFormat)
: getFormattedValue(value);
},
},
@@ -156,10 +156,7 @@ const MetricTrendChart: React.FC<Props> = ({
? '-'
: metricField.dataFormatType === 'percent' ||
metricField.dataFormatType === 'decimal'
? `${formatByDecimalPlaces(
item.value,
metricField.dataFormat?.decimalPlaces || 2
)}${metricField.dataFormatType === 'percent' ? '%' : ''}`
? formatByDataFormatType(item.value, metricField.dataFormatType, metricField.dataFormat)
: getFormattedValue(item.value)
}</span></div>`
)

View File

@@ -1,6 +1,6 @@
import { PREFIX_CLS, THEME_COLOR_LIST } from '../../../common/constants';
import { MsgDataType } from '../../../common/type';
import { formatByDecimalPlaces, getFormattedValue } from '../../../utils/utils';
import { formatByDataFormatType, getFormattedValue } from '../../../utils/utils';
import type { ECharts } from 'echarts';
import * as echarts from 'echarts';
import { useEffect, useRef } from 'react';
@@ -55,10 +55,7 @@ const PieChart: React.FC<Props> = ({
const value = params.value;
return `${params.name}: ${
metricField.dataFormatType === 'percent'
? `${formatByDecimalPlaces(
metricField.dataFormat?.needMultiply100 ? +value * 100 : value,
metricField.dataFormat?.decimalPlaces || 2
)}%`
? formatByDataFormatType(value, metricField.dataFormatType, metricField.dataFormat)
: getFormattedValue(value)
}`;
},

View File

@@ -1,4 +1,4 @@
import { formatByDecimalPlaces, formatByThousandSeperator } from '../../../utils/utils';
import { formatByDataFormatType, formatByThousandSeperator } from '../../../utils/utils';
import { Table as AntTable } from 'antd';
import { MsgDataType } from '../../../common/type';
import { CLS_PREFIX } from '../../../common/constants';
@@ -42,10 +42,7 @@ const Table: React.FC<Props> = ({ data, size, loading, question, onApplyAuth })
<div className={`${prefixCls}-formatted-value`}>
{`${
value
? formatByDecimalPlaces(
dataFormat?.needMultiply100 ? +value * 100 : value,
dataFormat?.decimalPlaces || 2
)
? formatByDataFormatType(value, dataFormatType, dataFormat)
: 0
}%`}
</div>

View File

@@ -1,6 +1,11 @@
import moment, { Moment } from 'moment';
import { NumericUnit } from '../common/constants';
import { isString } from 'lodash';
import { ColumnType } from '../common/type';
export function formatByDataFormatType(value: number | string, type: ColumnType['dataFormatType'], dataFormat: Partial<ColumnType['dataFormat']> = {}) {
return `${formatByDecimalPlaces(dataFormat?.needMultiply100 ? +value * 100 : value, dataFormat?.decimalPlaces || 2)}${type === 'percent' ? '%' : ''}`;
}
export function formatByDecimalPlaces(value: number | string, decimalPlaces: number) {
if (value === null || value === undefined || value === '') {