mirror of
https://github.com/ONLYOFFICE/web-apps.git
synced 2026-02-10 18:05:32 +08:00
Merge pull request 'fix bugs: 67695, 76519' (#953) from fix/custom-format-refactor into release/v9.3.0
This commit is contained in:
Maxim Kadushkin
@ -9,10 +9,32 @@ class EditCellController extends Component {
|
||||
super(props);
|
||||
this.dateFormats = this.initFormats(Asc.c_oAscNumFormatType.Date, 38822);
|
||||
this.timeFormats = this.initFormats(Asc.c_oAscNumFormatType.Time, 1.534);
|
||||
this.knownFormats = this.initKnownFormats();
|
||||
|
||||
this.initCustomFormats = this.initCustomFormats.bind(this);
|
||||
this.memorizeCurrentFormat = this.memorizeCurrentFormat.bind(this);
|
||||
this.setCustomFormat = this.setCustomFormat.bind(this);
|
||||
this.onCellFormat = this.onCellFormat.bind(this);
|
||||
this.onAccountingCellFormat = this.onAccountingCellFormat.bind(this);
|
||||
this.onBorderStyle = this.onBorderStyle.bind(this);
|
||||
|
||||
this.initCustomFormats();
|
||||
this.memorizeCurrentFormat();
|
||||
}
|
||||
|
||||
memorizeCurrentFormat() {
|
||||
const api = Common.EditorApi.get();
|
||||
const info = api.asc_getCellInfo();
|
||||
const xfs = info.asc_getXfs();
|
||||
const numFormat = xfs.asc_getNumFormat();
|
||||
this.props.storeCellSettings.setCellFormat(numFormat);
|
||||
|
||||
const formatInfo = xfs.asc_getNumFormatInfo();
|
||||
const formatType = formatInfo.asc_getType();
|
||||
this.props.storeCellSettings.setCellFormatType(formatType);
|
||||
|
||||
const uiFormatType = this.getUiFormatType(numFormat, formatType);
|
||||
this.props.storeCellSettings.setUiFormatType(uiFormatType);
|
||||
}
|
||||
|
||||
initFormats(type, exampleVal) {
|
||||
@ -52,6 +74,61 @@ class EditCellController extends Component {
|
||||
storeCellSettings.initCustomFormats(data);
|
||||
}
|
||||
|
||||
initKnownFormats() {
|
||||
const api = Common.EditorApi.get();
|
||||
|
||||
const simpleFormats = {
|
||||
[Asc.c_oAscNumFormatType.General]: ['General'],
|
||||
[Asc.c_oAscNumFormatType.Number]: ['0.00'],
|
||||
[Asc.c_oAscNumFormatType.Fraction]: ['# ?/?'],
|
||||
[Asc.c_oAscNumFormatType.Scientific]: ['0.00E+00'],
|
||||
[Asc.c_oAscNumFormatType.Percent]: ['0.00%'],
|
||||
[Asc.c_oAscNumFormatType.Text]: ['@'],
|
||||
};
|
||||
|
||||
const accountingSymbols = [1033, 1031, 2057, 1049, 1041]; // $, €, £, ₽, ¥
|
||||
const accountingFormats = accountingSymbols.flatMap(symbol => {
|
||||
const info = new Asc.asc_CFormatCellsInfo();
|
||||
info.asc_setType(Asc.c_oAscNumFormatType.Accounting);
|
||||
info.asc_setSeparator(false);
|
||||
info.asc_setSymbol(symbol);
|
||||
return api.asc_getFormatCells(info) || [];
|
||||
});
|
||||
|
||||
const currencyFormats = [
|
||||
'[$$-409]#,##0.00',
|
||||
'#,##0.00\ [$€-407]',
|
||||
'[$£-809]#,##0.00',
|
||||
'#,##0.00\ [$₽-419]',
|
||||
'[$¥-411]#,##0.00'
|
||||
];
|
||||
|
||||
const dateFormats = this.dateFormats.map(f => f.value);
|
||||
const timeFormats = this.timeFormats.map(f => f.value);
|
||||
|
||||
return {
|
||||
...simpleFormats,
|
||||
[Asc.c_oAscNumFormatType.Accounting]: accountingFormats,
|
||||
[Asc.c_oAscNumFormatType.Currency]: currencyFormats,
|
||||
[Asc.c_oAscNumFormatType.Date]: dateFormats,
|
||||
[Asc.c_oAscNumFormatType.Time]: timeFormats,
|
||||
};
|
||||
}
|
||||
|
||||
getUiFormatType(cellFormat, cellFormatType) {
|
||||
if (cellFormatType === Asc.c_oAscNumFormatType.Custom) {
|
||||
return Asc.c_oAscNumFormatType.Custom;
|
||||
}
|
||||
|
||||
const knownForType = this.knownFormats[cellFormatType];
|
||||
if (!knownForType || !knownForType.includes(cellFormat)) {
|
||||
return Asc.c_oAscNumFormatType.Custom;
|
||||
}
|
||||
|
||||
return cellFormatType;
|
||||
}
|
||||
|
||||
|
||||
setCustomFormat(value) {
|
||||
const api = Common.EditorApi.get();
|
||||
const format = api.asc_convertNumFormatLocal2NumFormat(value);
|
||||
@ -62,6 +139,9 @@ class EditCellController extends Component {
|
||||
format
|
||||
});
|
||||
api.asc_setCellFormat(format);
|
||||
|
||||
storeCellSettings.setCellFormat(format);
|
||||
storeCellSettings.setCellFormatType(Asc.c_oAscNumFormatType.Custom);
|
||||
}
|
||||
|
||||
toggleBold(value) {
|
||||
@ -178,6 +258,8 @@ class EditCellController extends Component {
|
||||
onCellFormat(format) {
|
||||
const api = Common.EditorApi.get();
|
||||
api.asc_setCellFormat(format);
|
||||
|
||||
this.memorizeCurrentFormat();
|
||||
}
|
||||
|
||||
onAccountingCellFormat(value) {
|
||||
@ -190,8 +272,11 @@ class EditCellController extends Component {
|
||||
|
||||
let format = api.asc_getFormatCells(info);
|
||||
|
||||
if (format && format.length > 0)
|
||||
if (format && format.length > 0) {
|
||||
api.asc_setCellFormat(format[0]);
|
||||
this.props.storeCellSettings.setCellFormat(format[0]);
|
||||
this.props.storeCellSettings.setCellFormatType(Asc.c_oAscNumFormatType.Accounting);
|
||||
}
|
||||
}
|
||||
|
||||
onBorderStyle(type, borderInfo) {
|
||||
|
||||
@ -37,7 +37,13 @@ export class storeCellSettings {
|
||||
setAutoColor: action,
|
||||
customFormats: observable,
|
||||
initCustomFormats: action,
|
||||
addCustomFormat: action
|
||||
addCustomFormat: action,
|
||||
cellFormat: observable,
|
||||
setCellFormat: action,
|
||||
cellFormatType: observable,
|
||||
setCellFormatType: action,
|
||||
uiFormatType: observable,
|
||||
setUiFormatType: action,
|
||||
});
|
||||
}
|
||||
|
||||
@ -78,6 +84,22 @@ export class storeCellSettings {
|
||||
|
||||
customFormats;
|
||||
|
||||
cellFormat = 'General';
|
||||
cellFormatType;
|
||||
uiFormatType;
|
||||
|
||||
setCellFormat(format) {
|
||||
this.cellFormat = format;
|
||||
}
|
||||
|
||||
setCellFormatType(type) {
|
||||
this.cellFormatType = type;
|
||||
}
|
||||
|
||||
setUiFormatType(type) {
|
||||
this.uiFormatType = type;
|
||||
}
|
||||
|
||||
initCustomFormats(formatsArr) {
|
||||
this.customFormats = formatsArr;
|
||||
}
|
||||
|
||||
@ -1,9 +1,23 @@
|
||||
import React, {Fragment, useState, useEffect} from 'react';
|
||||
import {observer, inject} from "mobx-react";
|
||||
import {f7, List, ListItem, Icon, Button, Page, Navbar, Segmented, BlockTitle, NavRight, Link, Toggle, ListInput, Block} from 'framework7-react';
|
||||
import React, { Fragment, useEffect, useState } from 'react';
|
||||
import { inject, observer } from "mobx-react";
|
||||
import {
|
||||
Block,
|
||||
BlockTitle,
|
||||
Button,
|
||||
f7,
|
||||
Link,
|
||||
List,
|
||||
ListInput,
|
||||
ListItem,
|
||||
Navbar,
|
||||
NavRight,
|
||||
Page,
|
||||
Segmented,
|
||||
Toggle
|
||||
} from 'framework7-react';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
import {Device} from '../../../../../common/mobile/utils/device';
|
||||
import { ThemeColorPalette, CustomColorPicker } from '../../../../../common/mobile/lib/component/ThemeColorPalette.jsx';
|
||||
import { Device } from '../../../../../common/mobile/utils/device';
|
||||
import { CustomColorPicker, ThemeColorPalette } from '../../../../../common/mobile/lib/component/ThemeColorPalette.jsx';
|
||||
import { LocalStorage } from '../../../../../common/mobile/utils/LocalStorage.mjs';
|
||||
import { Swiper, SwiperSlide } from 'swiper/react';
|
||||
import SvgIcon from '@common/lib/component/SvgIcon';
|
||||
@ -39,7 +53,6 @@ import IconTextOrientationRotateup from '@common-icons/icon-text-orientation-rot
|
||||
import IconTextOrientationRotatedown from '@common-icons/icon-text-orientation-rotatedown.svg';
|
||||
import IconTextOrientationAngleclock from '@common-icons/icon-text-orientation-angleclock.svg';
|
||||
import IconTextOrientationVertical from '@common-icons/icon-text-orientation-vertical.svg';
|
||||
import IconPlus from '@common-ios-icons/icon-plus.svg';
|
||||
import IconAddCustomFormat from '@android-icons/icon-add-custom-format.svg';
|
||||
import IconFormatAccounting from '@icons/icon-format-accounting.svg';
|
||||
import IconFormatCurrency from '@icons/icon-format-currency.svg';
|
||||
@ -60,6 +73,37 @@ import IconTextItalic from '@common-icons/icon-text-italic.svg'
|
||||
import IconTextUnderline from '@common-icons/icon-text-underline.svg'
|
||||
import IconTextStrikethrough from '@common-icons/icon-text-strikethrough.svg'
|
||||
|
||||
const getFormatIcon = (cellFormat, cellFormatType) => {
|
||||
const exactFormatMap = {
|
||||
'General': IconFormatGeneral.id,
|
||||
'0.00': IconFormatNumber.id,
|
||||
'# ?/?': IconFormatInteger.id,
|
||||
'0.00E+00': IconFormatScientific.id,
|
||||
'0.00%': IconFormatPercentage.id,
|
||||
'@': IconFormatText.id
|
||||
};
|
||||
|
||||
if (exactFormatMap[cellFormat]) {
|
||||
return exactFormatMap[cellFormat];
|
||||
}
|
||||
|
||||
const typeMap = {
|
||||
[Asc.c_oAscNumFormatType.General]: IconFormatGeneral.id,
|
||||
[Asc.c_oAscNumFormatType.Number]: IconFormatNumber.id,
|
||||
[Asc.c_oAscNumFormatType.Scientific]: IconFormatScientific.id,
|
||||
[Asc.c_oAscNumFormatType.Accounting]: IconFormatAccounting.id,
|
||||
[Asc.c_oAscNumFormatType.Currency]: IconFormatCurrency.id,
|
||||
[Asc.c_oAscNumFormatType.Date]: IconFormatDate.id,
|
||||
[Asc.c_oAscNumFormatType.Time]: IconFormatTime.id,
|
||||
[Asc.c_oAscNumFormatType.Percent]: IconFormatPercentage.id,
|
||||
[Asc.c_oAscNumFormatType.Fraction]: IconFormatInteger.id,
|
||||
[Asc.c_oAscNumFormatType.Text]: IconFormatText.id,
|
||||
[Asc.c_oAscNumFormatType.Custom]: IconAddCustomFormat.id
|
||||
};
|
||||
|
||||
return typeMap[cellFormatType] ?? IconAddCustomFormat.id;
|
||||
};
|
||||
|
||||
const EditCell = props => {
|
||||
const isAndroid = Device.android;
|
||||
const { t } = useTranslation();
|
||||
@ -91,6 +135,8 @@ const EditCell = props => {
|
||||
<span className="color-preview" style={{ background: `#${(typeof fillColor === "object" ? fillColor.color : fillColor)}`}}></span> :
|
||||
<span className="color-preview"></span>;
|
||||
|
||||
const formatIconId = getFormatIcon(storeCellSettings.cellFormat, storeCellSettings.uiFormatType);
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<List>
|
||||
@ -170,9 +216,7 @@ const EditCell = props => {
|
||||
timeFormats: props.timeFormats,
|
||||
setCustomFormat: props.setCustomFormat
|
||||
}}>
|
||||
{!isAndroid ?
|
||||
<SvgIcon slot="media" symbolId={IconFormatGeneral.id} className={'icon icon-svg'} /> : null
|
||||
}
|
||||
<SvgIcon slot="media" symbolId={formatIconId} className={'icon icon-svg'} />
|
||||
</ListItem>
|
||||
</List>
|
||||
<List>
|
||||
@ -659,7 +703,6 @@ const PageTextFormatCell = props => {
|
||||
const PageTextOrientationCell = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t('View.Edit', {returnObjects: true});
|
||||
const isAndroid = Device.android;
|
||||
const storeCellSettings = props.storeCellSettings;
|
||||
const orientationStr = storeCellSettings.orientationStr;
|
||||
|
||||
@ -1004,7 +1047,7 @@ const PageBorderSizeCell = props => {
|
||||
const PageFormatCell = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t('View.Edit', {returnObjects: true});
|
||||
const isIos = Device.ios;
|
||||
const { cellFormat, uiFormatType: cellFormatType } = props.storeCellSettings;
|
||||
|
||||
return (
|
||||
<Page>
|
||||
@ -1021,55 +1064,112 @@ const PageFormatCell = props => {
|
||||
}
|
||||
</Navbar>
|
||||
<List>
|
||||
<ListItem link='/custom-format/' className='no-indicator' title={t('View.Edit.textCustomFormat')} routeProps={{
|
||||
setCustomFormat: props.setCustomFormat,
|
||||
onCellFormat: props.onCellFormat
|
||||
}}>
|
||||
{isIos ?
|
||||
<SvgIcon slot="media" symbolId={IconPlus.id} className={'icon icon-svg'} /> :
|
||||
<SvgIcon slot="media" symbolId={IconAddCustomFormat.id} className={'icon icon-svg'} />
|
||||
}
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textGeneral} onClick={() => props.onCellFormat('General')}>
|
||||
<SvgIcon slot="media" symbolId={IconFormatGeneral.id} className={'icon icon-svg'} />
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textNumber} onClick={() => props.onCellFormat('0.00')}>
|
||||
<SvgIcon slot="media" symbolId={IconFormatNumber.id} className={'icon icon-svg'} />
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textFraction} onClick={() => props.onCellFormat('# ?/?')}>
|
||||
<SvgIcon slot="media" symbolId={IconFormatInteger.id} className={'icon icon-svg'} />
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textScientific} onClick={() => props.onCellFormat('0.00E+00')}>
|
||||
<SvgIcon slot="media" symbolId={IconFormatScientific.id} className={'icon icon-svg'} />
|
||||
</ListItem>
|
||||
<ListItem title={_t.textAccounting} link="/edit-accounting-format-cell/" routeProps={{
|
||||
onAccountingCellFormat: props.onAccountingCellFormat
|
||||
}}>
|
||||
<SvgIcon slot="media" symbolId={IconFormatAccounting.id} className={'icon icon-svg'} />
|
||||
</ListItem>
|
||||
<ListItem title={_t.textCurrency} link="/edit-currency-format-cell/" routeProps={{
|
||||
onCellFormat: props.onCellFormat
|
||||
}}>
|
||||
<SvgIcon slot="media" symbolId={IconFormatCurrency.id} className={'icon icon-svg'} />
|
||||
</ListItem>
|
||||
<ListItem title={_t.textDate} link='/edit-date-format-cell/' routeProps={{
|
||||
onCellFormat: props.onCellFormat,
|
||||
dateFormats: props.dateFormats
|
||||
}}>
|
||||
<SvgIcon slot="media" symbolId={IconFormatDate.id} className={'icon icon-svg'} />
|
||||
</ListItem>
|
||||
<ListItem title={_t.textTime} link='/edit-time-format-cell/' routeProps={{
|
||||
onCellFormat: props.onCellFormat,
|
||||
timeFormats: props.timeFormats
|
||||
}}>
|
||||
<SvgIcon slot="media" symbolId={IconFormatTime.id} className={'icon icon-svg'} />
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textPercentage} onClick={() => props.onCellFormat('0.00%')}>
|
||||
<SvgIcon slot="media" symbolId={IconFormatPercentage.id} className={'icon icon-svg'} />
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textText} onClick={() => props.onCellFormat('@')}>
|
||||
<SvgIcon slot="media" symbolId={IconFormatText.id} className={'icon icon-svg'} />
|
||||
</ListItem>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="cell-format"
|
||||
title={_t.textGeneral}
|
||||
checked={cellFormat === 'General'}
|
||||
onChange={() => props.onCellFormat('General')}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="cell-format"
|
||||
title={_t.textNumber}
|
||||
checked={cellFormat === '0.00'}
|
||||
onChange={() => props.onCellFormat('0.00')}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="cell-format"
|
||||
title={_t.textFraction}
|
||||
checked={cellFormat === '# ?/?'}
|
||||
onChange={() => props.onCellFormat('# ?/?')}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="cell-format"
|
||||
title={_t.textScientific}
|
||||
checked={cellFormat === '0.00E+00'}
|
||||
onChange={() => props.onCellFormat('0.00E+00')}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="cell-format"
|
||||
title={_t.textAccounting}
|
||||
checked={cellFormatType === Asc.c_oAscNumFormatType.Accounting}
|
||||
link="/edit-accounting-format-cell/"
|
||||
routeProps={{
|
||||
onAccountingCellFormat: props.onAccountingCellFormat
|
||||
}}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="cell-format"
|
||||
title={_t.textCurrency}
|
||||
checked={cellFormatType === Asc.c_oAscNumFormatType.Currency}
|
||||
link="/edit-currency-format-cell/"
|
||||
routeProps={{
|
||||
onCellFormat: props.onCellFormat
|
||||
}}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="cell-format"
|
||||
title={_t.textDate}
|
||||
checked={cellFormatType === Asc.c_oAscNumFormatType.Date}
|
||||
link="/edit-date-format-cell/"
|
||||
routeProps={{
|
||||
onCellFormat: props.onCellFormat,
|
||||
dateFormats: props.dateFormats
|
||||
}}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="cell-format"
|
||||
title={_t.textTime}
|
||||
checked={cellFormatType === Asc.c_oAscNumFormatType.Time}
|
||||
link="/edit-time-format-cell/"
|
||||
routeProps={{
|
||||
onCellFormat: props.onCellFormat,
|
||||
timeFormats: props.timeFormats
|
||||
}}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="cell-format"
|
||||
title={_t.textPercentage}
|
||||
checked={cellFormat === '0.00%'}
|
||||
onChange={() => props.onCellFormat('0.00%')}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="cell-format"
|
||||
title={_t.textText}
|
||||
checked={cellFormat === '@'}
|
||||
onChange={() => props.onCellFormat('@')}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="cell-format"
|
||||
title={_t.textCustomFormat}
|
||||
checked={cellFormatType === Asc.c_oAscNumFormatType.Custom}
|
||||
link="/custom-format/"
|
||||
routeProps={{
|
||||
onCellFormat: props.onCellFormat,
|
||||
setCustomFormat: props.setCustomFormat
|
||||
}}
|
||||
/>
|
||||
</List>
|
||||
</Page>
|
||||
)
|
||||
@ -1111,18 +1211,20 @@ const PageCustomFormats = props => {
|
||||
<ListItem title={t('View.Edit.textCreateCustomFormat')} link="/create-custom-format/" className='no-indicator' routeProps={{
|
||||
setCustomFormat: props.setCustomFormat,
|
||||
customFormats: props.customFormats
|
||||
}}></ListItem>
|
||||
}}/>
|
||||
</List>
|
||||
{renderList && (
|
||||
<List>
|
||||
{customFormats.map((item, idx) => (
|
||||
<ListItem
|
||||
link='#'
|
||||
className='no-indicator'
|
||||
key={idx}
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="custom-format"
|
||||
title={item.format}
|
||||
value={item.value}
|
||||
onClick={() => handleCellFormatClick(item.value)}
|
||||
checked={item.value === storeCellSettings.cellFormat}
|
||||
onChange={() => handleCellFormatClick(item.value)}
|
||||
/>
|
||||
))}
|
||||
</List>
|
||||
@ -1169,9 +1271,23 @@ const PageCreationCustomFormat = observer(props => {
|
||||
)
|
||||
});
|
||||
|
||||
const PageAccountingFormatCell = observer(props => {
|
||||
const PageAccountingFormatCell = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t('View.Edit', {returnObjects: true});
|
||||
const { cellFormat } = props.storeCellSettings;
|
||||
|
||||
// todo: number type
|
||||
|
||||
const isAccountingFormat = (symbol) => {
|
||||
const symbolMap = {
|
||||
1033: '$',
|
||||
1031: '€',
|
||||
2057: '£',
|
||||
1049: '₽',
|
||||
1041: '¥'
|
||||
};
|
||||
return cellFormat.includes(symbolMap[symbol]);
|
||||
};
|
||||
|
||||
return (
|
||||
<Page>
|
||||
@ -1188,29 +1304,55 @@ const PageAccountingFormatCell = observer(props => {
|
||||
}
|
||||
</Navbar>
|
||||
<List>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textDollar} after='$'
|
||||
onClick={() => props.onAccountingCellFormat(1033)}>
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textEuro} after='€'
|
||||
onClick={() => props.onAccountingCellFormat(1031)}>
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textPound} after='£'
|
||||
onClick={() => props.onAccountingCellFormat(2057)}>
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textRouble} after='₽'
|
||||
onClick={() => props.onAccountingCellFormat(1049)}>
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textYen} after='¥'
|
||||
onClick={() => props.onAccountingCellFormat(1041)}>
|
||||
</ListItem>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="accounting-format"
|
||||
title={_t.textDollar}
|
||||
checked={isAccountingFormat(1033)}
|
||||
onChange={() => props.onAccountingCellFormat(1033)}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="accounting-format"
|
||||
title={_t.textEuro}
|
||||
checked={isAccountingFormat(1031)}
|
||||
onChange={() => props.onAccountingCellFormat(1031)}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="accounting-format"
|
||||
title={_t.textPound}
|
||||
checked={isAccountingFormat(2057)}
|
||||
onChange={() => props.onAccountingCellFormat(2057)}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="accounting-format"
|
||||
title={_t.textRouble}
|
||||
checked={isAccountingFormat(1049)}
|
||||
onChange={() => props.onAccountingCellFormat(1049)}
|
||||
/>
|
||||
<ListItem
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="accounting-format"
|
||||
title={_t.textYen}
|
||||
checked={isAccountingFormat(1041)}
|
||||
onChange={() => props.onAccountingCellFormat(1041)}
|
||||
/>
|
||||
</List>
|
||||
</Page>
|
||||
)
|
||||
});
|
||||
}
|
||||
|
||||
const PageCurrencyFormatCell = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t('View.Edit', {returnObjects: true});
|
||||
const _t = t('View.Edit', { returnObjects: true });
|
||||
const { cellFormat } = props.storeCellSettings;
|
||||
|
||||
return (
|
||||
<Page>
|
||||
@ -1227,21 +1369,46 @@ const PageCurrencyFormatCell = props => {
|
||||
}
|
||||
</Navbar>
|
||||
<List>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textDollar} after='$'
|
||||
onClick={() => props.onCellFormat('[$$-409]#,##0.00')}>
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textEuro} after='€'
|
||||
onClick={() => props.onCellFormat('#,##0.00\ [$€-407]')}>
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textPound} after='£'
|
||||
onClick={() => props.onCellFormat('[$£-809]#,##0.00')}>
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textRouble} after='₽'
|
||||
onClick={() => props.onCellFormat('#,##0.00\ [$₽-419]')}>
|
||||
</ListItem>
|
||||
<ListItem link='#' className='no-indicator' title={_t.textYen} after='¥'
|
||||
onClick={() => props.onCellFormat('[$¥-411]#,##0.00')}>
|
||||
</ListItem>
|
||||
<ListItem
|
||||
title={_t.textDollar}
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="currency-format"
|
||||
checked={cellFormat === '[$$-409]#,##0.00'}
|
||||
onChange={() => props.onCellFormat('[$$-409]#,##0.00')}
|
||||
/>
|
||||
<ListItem
|
||||
title={_t.textEuro}
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="currency-format"
|
||||
checked={cellFormat === '#,##0.00\ [$€-407]'}
|
||||
onChange={() => props.onCellFormat('#,##0.00\ [$€-407]')}
|
||||
/>
|
||||
<ListItem
|
||||
title={_t.textPound}
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="currency-format"
|
||||
checked={cellFormat === '[$£-809]#,##0.00'}
|
||||
onChange={() => props.onCellFormat('[$£-809]#,##0.00')}
|
||||
/>
|
||||
<ListItem
|
||||
title={_t.textRouble}
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="currency-format"
|
||||
checked={cellFormat === '#,##0.00\ [$₽-419]'}
|
||||
onChange={() => props.onCellFormat('#,##0.00\ [$₽-419]')}
|
||||
/>
|
||||
<ListItem
|
||||
title={_t.textYen}
|
||||
radio
|
||||
radioIcon="start"
|
||||
name="currency-format"
|
||||
checked={cellFormat === '[$¥-411]#,##0.00'}
|
||||
onChange={() => props.onCellFormat('[$¥-411]#,##0.00')}
|
||||
/>
|
||||
</List>
|
||||
</Page>
|
||||
)
|
||||
@ -1251,6 +1418,7 @@ const PageDateFormatCell = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t('View.Edit', {returnObjects: true});
|
||||
const dateFormats = props.dateFormats;
|
||||
const { cellFormat } = props.storeCellSettings;
|
||||
|
||||
return (
|
||||
<Page>
|
||||
@ -1269,8 +1437,15 @@ const PageDateFormatCell = props => {
|
||||
<List>
|
||||
{dateFormats.map((format, index) => {
|
||||
return (
|
||||
<ListItem link='#' key={index} className='no-indicator' title={format.displayValue}
|
||||
onClick={() => props.onCellFormat(format.value)}></ListItem>
|
||||
<ListItem
|
||||
key={index}
|
||||
radio
|
||||
radioIcon='start'
|
||||
name='cell-format-date'
|
||||
title={format.displayValue}
|
||||
checked={cellFormat === format.value}
|
||||
onChange={() => props.onCellFormat(format.value)}
|
||||
/>
|
||||
)
|
||||
})}
|
||||
</List>
|
||||
@ -1282,6 +1457,7 @@ const PageTimeFormatCell = props => {
|
||||
const { t } = useTranslation();
|
||||
const _t = t('View.Edit', {returnObjects: true});
|
||||
const timeFormats = props.timeFormats;
|
||||
const { cellFormat } = props.storeCellSettings;
|
||||
|
||||
return (
|
||||
<Page>
|
||||
@ -1300,8 +1476,15 @@ const PageTimeFormatCell = props => {
|
||||
<List>
|
||||
{timeFormats.map((format, index) => {
|
||||
return (
|
||||
<ListItem link='#' key={index} className='no-indicator' title={format.displayValue}
|
||||
onClick={() => props.onCellFormat(format.value)}></ListItem>
|
||||
<ListItem
|
||||
key={index}
|
||||
radio
|
||||
radioIcon='start'
|
||||
name='cell-format-time'
|
||||
title={format.displayValue}
|
||||
checked={cellFormat === format.value}
|
||||
onChange={() => props.onCellFormat(format.value)}
|
||||
/>
|
||||
)
|
||||
})}
|
||||
</List>
|
||||
@ -1375,6 +1558,11 @@ const BorderSizeCell = inject("storeCellSettings")(observer(PageBorderSizeCell))
|
||||
const CellStyle = inject("storeCellSettings")(observer(PageCellStyle));
|
||||
const CustomFormats = inject("storeCellSettings")(observer(PageCustomFormats));
|
||||
const PageCellTextDirection = inject("storeCellSettings")(observer(PageCellDirection));
|
||||
const FormatCell = inject("storeCellSettings")(observer(PageFormatCell));
|
||||
const AccountingFormatCell = inject("storeCellSettings")(observer(PageAccountingFormatCell));
|
||||
const CurrencyFormatCell = inject("storeCellSettings")(observer(PageCurrencyFormatCell));
|
||||
const DateFormatCell = inject("storeCellSettings")(observer(PageDateFormatCell));
|
||||
const TimeFormatCell = inject("storeCellSettings")(observer(PageTimeFormatCell));
|
||||
|
||||
export {
|
||||
PageEditCell as EditCell,
|
||||
@ -1389,11 +1577,11 @@ export {
|
||||
BorderColorCell,
|
||||
CustomBorderColorCell,
|
||||
BorderSizeCell,
|
||||
PageFormatCell,
|
||||
PageAccountingFormatCell,
|
||||
PageCurrencyFormatCell,
|
||||
PageDateFormatCell,
|
||||
PageTimeFormatCell,
|
||||
FormatCell as PageFormatCell,
|
||||
AccountingFormatCell as PageAccountingFormatCell,
|
||||
CurrencyFormatCell as PageCurrencyFormatCell,
|
||||
DateFormatCell as PageDateFormatCell,
|
||||
TimeFormatCell as PageTimeFormatCell,
|
||||
CellStyle,
|
||||
CustomFormats,
|
||||
PageCreationCustomFormat,
|
||||
|
||||
Reference in New Issue
Block a user