mirror of
https://github.com/AppFlowy-IO/AppFlowy.git
synced 2024-08-30 18:12:39 +00:00
parent
6334255e15
commit
2fb18dd051
@ -23,7 +23,7 @@ export function Toolbar({
|
||||
|
||||
return (
|
||||
<div className={'flex items-center justify-between overflow-x-auto overflow-y-hidden'}>
|
||||
<div className={'whitespace-nowrap text-base font-medium'}>{dateStr}</div>
|
||||
<div className={'whitespace-nowrap text-sm font-medium'}>{dateStr}</div>
|
||||
<div className={'flex items-center justify-end gap-2'}>
|
||||
<IconButton size={'small'} onClick={() => onNavigate('PREV')}>
|
||||
<LeftArrow />
|
||||
|
@ -1,4 +1,8 @@
|
||||
import { YjsDatabaseKey } from '@/application/collab.type';
|
||||
import { currencyFormaterMap, FieldType, parseNumberTypeOptions, useFieldSelector } from '@/application/database-yjs';
|
||||
import { CalculationType } from '@/application/database-yjs/database.type';
|
||||
import Decimal from 'decimal.js';
|
||||
import { isNaN } from 'lodash-es';
|
||||
import React, { useMemo } from 'react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
@ -16,6 +20,16 @@ export interface CalculationCellProps {
|
||||
export function CalculationCell({ cell }: CalculationCellProps) {
|
||||
const { t } = useTranslation();
|
||||
|
||||
const fieldId = cell?.fieldId || '';
|
||||
const { field } = useFieldSelector(fieldId);
|
||||
const format = useMemo(
|
||||
() =>
|
||||
field && Number(field?.get(YjsDatabaseKey.type)) === FieldType.Number
|
||||
? parseNumberTypeOptions(field).format
|
||||
: undefined,
|
||||
[field]
|
||||
);
|
||||
|
||||
const prefix = useMemo(() => {
|
||||
if (!cell) return '';
|
||||
|
||||
@ -39,10 +53,22 @@ export function CalculationCell({ cell }: CalculationCellProps) {
|
||||
}
|
||||
}, [cell, t]);
|
||||
|
||||
const num = useMemo(() => {
|
||||
const value = cell?.value;
|
||||
|
||||
if (value === undefined || isNaN(value)) return '';
|
||||
|
||||
if (format && currencyFormaterMap[format]) {
|
||||
return currencyFormaterMap[format](new Decimal(value).toNumber());
|
||||
}
|
||||
|
||||
return parseFloat(value);
|
||||
}, [cell?.value, format]);
|
||||
|
||||
return (
|
||||
<div className={'h-full w-full px-1 text-right text-xs font-medium uppercase leading-[36px] text-text-caption'}>
|
||||
{prefix}
|
||||
<span className={'ml-2 text-text-title'}>{cell?.value ?? ''}</span>
|
||||
<div className={'h-full w-full px-1 text-right uppercase leading-[36px] text-text-caption'}>
|
||||
<span className={'text-xs'}>{prefix}</span>
|
||||
<span className={'ml-2 text-sm font-medium text-text-title'}>{num}</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
@ -1,3 +1,4 @@
|
||||
import { DEFAULT_ROW_HEIGHT } from '@/application/database-yjs';
|
||||
import React, { memo, useCallback, useEffect, useRef } from 'react';
|
||||
import { areEqual, GridChildComponentProps, VariableSizeGrid } from 'react-window';
|
||||
import AutoSizer from 'react-virtualized-auto-sizer';
|
||||
@ -53,7 +54,7 @@ export const GridHeader = ({ scrollLeft, onScrollLeft, columnWidth, columns }: G
|
||||
className={'grid-sticky-header w-full text-text-title'}
|
||||
height={height}
|
||||
width={width}
|
||||
rowHeight={() => 36}
|
||||
rowHeight={() => DEFAULT_ROW_HEIGHT}
|
||||
rowCount={1}
|
||||
columnCount={columns.length}
|
||||
columnWidth={(index) => {
|
||||
|
Loading…
Reference in New Issue
Block a user