topdog/supersonic
1
0
Fork 0
mirror of https://github.com/tencentmusic/supersonic.git synced 2025-12-10 19:28:12 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

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

Browse Source 
* 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
Download Patch File Download Diff File Expand all files Collapse all files

15
webapp/packages/chat-sdk/src/Chat/constants.ts
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 { export enum SemanticTypeEnum {
MODEL = 'MODEL', MODEL = 'MODEL',
DIMENSION = 'DIMENSION', DIMENSION = 'DIMENSION',

11
webapp/packages/chat-sdk/src/components/ChatMsg/Bar/index.tsx
View File

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

7
webapp/packages/chat-sdk/src/components/ChatMsg/MetricCard/index.tsx
View File

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

7
webapp/packages/chat-sdk/src/components/ChatMsg/MetricTrend/MetricInfo.tsx
View File

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

9
webapp/packages/chat-sdk/src/components/ChatMsg/MetricTrend/MetricTrendChart.tsx
View File

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

7
webapp/packages/chat-sdk/src/components/ChatMsg/Pie/PieChart.tsx
View File

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

7
webapp/packages/chat-sdk/src/components/ChatMsg/Table/index.tsx
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 { Table as AntTable } from 'antd';
import { MsgDataType } from '../../../common/type'; import { MsgDataType } from '../../../common/type';
import { CLS_PREFIX } from '../../../common/constants'; 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`}> <div className={`${prefixCls}-formatted-value`}>
{`${ {`${
value value
? formatByDecimalPlaces( ? formatByDataFormatType(value, dataFormatType, dataFormat)
dataFormat?.needMultiply100 ? +value * 100 : value,
dataFormat?.decimalPlaces || 2
)
: 0 : 0
}%`} }%`}
</div> </div>

5
webapp/packages/chat-sdk/src/utils/utils.ts
View File

@@ -1,6 +1,11 @@
import moment, { Moment } from 'moment'; import moment, { Moment } from 'moment';
import { NumericUnit } from '../common/constants'; import { NumericUnit } from '../common/constants';
import { isString } from 'lodash'; 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) { export function formatByDecimalPlaces(value: number | string, decimalPlaces: number) {
if (value === null || value === undefined || value === '') { if (value === null || value === undefined || value === '') {