diff --git a/apps/spreadsheeteditor/mobile/locale/en.json b/apps/spreadsheeteditor/mobile/locale/en.json index 02e45e796..d6f456d25 100644 --- a/apps/spreadsheeteditor/mobile/locale/en.json +++ b/apps/spreadsheeteditor/mobile/locale/en.json @@ -122,7 +122,22 @@ "textDiagonalDownBorder": "Diagonal Down Border", "textThin": "Thin", "textMedium": "Medium", - "textThick": "Thick" + "textThick": "Thick", + "textGeneral": "General", + "textNumber": "Number", + "textInteger": "Integer", + "textScientific": "Scientific", + "textAccounting": "Accounting", + "textCurrency": "Currency", + "textDate": "Date", + "textTime": "Time", + "textPercentage": "Percentage", + "textText": "Text", + "textDollar": "Dollar", + "textEuro": "Euro", + "textPound": "Pound", + "textRouble": "Rouble", + "textYen": "Yen" } }, "Common": { diff --git a/apps/spreadsheeteditor/mobile/src/store/cellSettings.js b/apps/spreadsheeteditor/mobile/src/store/cellSettings.js index 38fa63a9b..ac880feb5 100644 --- a/apps/spreadsheeteditor/mobile/src/store/cellSettings.js +++ b/apps/spreadsheeteditor/mobile/src/store/cellSettings.js @@ -40,6 +40,7 @@ export class storeCellSettings { let color = xfs.asc_getFillColor(); console.log(color); + let clr = this.resetColor(color); this.fillColor = clr; @@ -147,14 +148,19 @@ export class storeCellSettings { resetColor(color) { let clr = 'transparent'; - if (color) { - if (color.get_type() == Asc.c_oAscColor.COLOR_TYPE_SCHEME) { - clr = { - color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()), - effectValue: color.get_value() - } + if(color) { + if (color.get_auto()) { + // return clr; + clr = 'auto' } else { - clr = Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()); + if (color.get_type() == Asc.c_oAscColor.COLOR_TYPE_SCHEME) { + clr = { + color: Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()), + effectValue: color.get_value() + } + } else { + clr = Common.Utils.ThemeColor.getHexColor(color.get_r(), color.get_g(), color.get_b()); + } } } diff --git a/apps/spreadsheeteditor/mobile/src/view/edit/Edit.jsx b/apps/spreadsheeteditor/mobile/src/view/edit/Edit.jsx index f8be60d95..135e6459e 100644 --- a/apps/spreadsheeteditor/mobile/src/view/edit/Edit.jsx +++ b/apps/spreadsheeteditor/mobile/src/view/edit/Edit.jsx @@ -11,7 +11,7 @@ import EditImageController from "../../controller/edit/EditImage"; import { PageShapeStyle, PageShapeStyleNoFill, PageReplaceContainer, PageReorderContainer, PageShapeBorderColor, PageShapeCustomBorderColor, PageShapeCustomFillColor } from './EditShape'; import { PageImageReplace, PageImageReorder, PageLinkSettings } from './EditImage'; -import { TextColorCell, FillColorCell, CustomTextColorCell, CustomFillColorCell, FontsCell, TextFormatCell, TextOrientationCell, BorderStyleCell, BorderColorCell, CustomBorderColorCell, BorderSizeCell } from './EditCell'; +import { TextColorCell, FillColorCell, CustomTextColorCell, CustomFillColorCell, FontsCell, TextFormatCell, TextOrientationCell, BorderStyleCell, BorderColorCell, CustomBorderColorCell, BorderSizeCell, PageFormatCell, PageAccountingFormatCell, PageCurrencyFormatCell, PageDateFormatCell, PageTimeFormatCell } from './EditCell'; const routes = [ @@ -106,6 +106,26 @@ const routes = [ { path: '/edit-border-size-cell/', component: BorderSizeCell + }, + { + path: '/edit-format-cell/', + component: PageFormatCell + }, + { + path: '/edit-accounting-format-cell/', + component: PageAccountingFormatCell + }, + { + path: '/edit-currency-format-cell/', + component: PageCurrencyFormatCell + }, + { + path: '/edit-date-format-cell/', + component: PageDateFormatCell + }, + { + path: '/edit-time-format-cell/', + component: PageTimeFormatCell } ]; diff --git a/apps/spreadsheeteditor/mobile/src/view/edit/EditCell.jsx b/apps/spreadsheeteditor/mobile/src/view/edit/EditCell.jsx index a0ce26965..b6aa3093f 100644 --- a/apps/spreadsheeteditor/mobile/src/view/edit/EditCell.jsx +++ b/apps/spreadsheeteditor/mobile/src/view/edit/EditCell.jsx @@ -13,13 +13,10 @@ const EditCell = props => { const storeCellSettings = props.storeCellSettings; const cellStyles = storeCellSettings.cellStyles; const styleName = storeCellSettings.styleName; - console.log(styleName); - console.log(cellStyles); + console.log(storeCellSettings); const fontInfo = storeCellSettings.fontInfo; - console.log(fontInfo); - const fontName = fontInfo.name || _t.textFonts; const fontSize = fontInfo.size; const fontColor = storeCellSettings.fontColor; @@ -33,11 +30,11 @@ const EditCell = props => { const fontColorPreview = fontColor !== 'auto' ? : - ; + ; const fillColorPreview = fillColor !== 'auto' ? : - ; + ; return ( @@ -94,8 +91,8 @@ const EditCell = props => { - {!isAndroid ? : null @@ -109,7 +106,6 @@ const EditCell = props => { return ( props.onStyleClick(elem.name)}> - ) })} @@ -195,17 +191,21 @@ const PageTextColorCell = props => { const storePalette = props.storePalette; const storeCellSettings = props.storeCellSettings; const customColors = storePalette.customColors; - const fontColor = storeCellSettings.fontColor; + let fontColor = storeCellSettings.fontColor; + + if(typeof fontColor === 'object') { + fontColor = storeCellSettings.fontColor.color; + } const changeColor = (color, effectId, effectValue) => { if (color !== 'empty') { if (effectId !== undefined ) { const newColor = {color: color, effectId: effectId, effectValue: effectValue}; - props.onTextColor(newColor); storeCellSettings.changeFontColor(newColor); + props.onTextColor(newColor); } else { - props.onTextColor(color); storeCellSettings.changeFontColor(color); + props.onTextColor(color); } } else { // open custom color menu @@ -220,7 +220,7 @@ const PageTextColorCell = props => { - + { const storePalette = props.storePalette; const storeCellSettings = props.storeCellSettings; const customColors = storePalette.customColors; - const fillColor = storeCellSettings.fillColor; + let fillColor = storeCellSettings.fillColor; + + if(typeof fillColor === 'object') { + fillColor = storeCellSettings.fillColor.color; + } + + console.log(fillColor); const changeColor = (color, effectId, effectValue) => { if (color !== 'empty') { if (effectId !== undefined ) { const newColor = {color: color, effectId: effectId, effectValue: effectValue}; - props.onFillColor(newColor); storeCellSettings.changeFillColor(newColor); + props.onFillColor(newColor); } else { - props.onFillColor(color); storeCellSettings.changeFillColor(color); + props.onFillColor(color); } } else { // open custom color menu @@ -468,8 +474,6 @@ const PageBorderStyleCell = props => { 13: `${_t.textThick}` }; - // const borderSizes = storeCellSettings.borderSizes; - return ( @@ -565,10 +569,14 @@ const PageBorderColorCell = props => { const storePalette = props.storePalette; const storeCellSettings = props.storeCellSettings; const borderInfo = storeCellSettings.borderInfo; - const borderColor = typeof borderInfo.color === "object" ? borderInfo.color.color : borderInfo.color; + let borderColor = borderInfo.color; const borderStyle = storeCellSettings.borderStyle; const customColors = storePalette.customColors; + if(typeof borderColor === "object") { + borderColor = borderInfo.color.color; + } + const changeColor = (color, effectId, effectValue) => { if (color !== 'empty') { if (effectId !== undefined ) { @@ -592,7 +600,7 @@ const PageBorderColorCell = props => { - + { const storeCellSettings = props.storeCellSettings; const storePalette = props.storePalette; const borderInfo = storeCellSettings.borderInfo; - const borderColor = typeof borderInfo.color === "object" ? borderInfo.color.color : borderInfo.color; + let borderColor = borderInfo.color; + + if(typeof borderColor === "object") { + borderColor = borderInfo.color.color; + } + const borderStyle = storeCellSettings.borderStyle; const onAddNewColor = (colors, color) => { @@ -657,6 +670,174 @@ const PageBorderSizeCell = props => { ) } +const PageFormatCell = props => { + const { t } = useTranslation(); + const _t = t('View.Edit', {returnObjects: true}); + + return ( + + + + props.onCellFormat('R2VuZXJhbA==')}> + + + props.onCellFormat('MC4wMA==')}> + + + props.onCellFormat('JTIzMA==')}> + + + props.onCellFormat('MC4wMEUlMkIwMA==')}> + + + + + + + + + + + + + + + props.onCellFormat('MC4wMCUyNQ==')}> + + + props.onCellFormat('JTQw')}> + + + + + ) +} + +const PageAccountingFormatCell = props => { + const { t } = useTranslation(); + const _t = t('View.Edit', {returnObjects: true}); + + return ( + + + + props.onCellFormat('XyglMjQqJTIwJTIzJTJDJTIzJTIzMC4wMF8pJTNCXyglMjQqJTIwKCUyMyUyQyUyMyUyMzAuMDApJTNCXyglMjQqJTIwJTIyLSUyMiUzRiUzRl8pJTNCXyglNDBfKQ==')}> + + props.onCellFormat('XyglRTIlODIlQUMqJTIwJTIzJTJDJTIzJTIzMC4wMF8pJTNCXyglRTIlODIlQUMqJTIwKCUyMyUyQyUyMyUyMzAuMDApJTNCXyglRTIlODIlQUMqJTIwJTIyLSUyMiUzRiUzRl8pJTNCXyglNDBfKQ==')}> + + props.onCellFormat('XyglQzIlQTMqJTIwJTIzJTJDJTIzJTIzMC4wMF8pJTNCXyglQzIlQTMqJTIwKCUyMyUyQyUyMyUyMzAuMDApJTNCXyglQzIlQTMqJTIwJTIyLSUyMiUzRiUzRl8pJTNCXyglNDBfKQ==')}> + + props.onCellFormat('Xy0qJTIwJTIzJTJDJTIzJTIzMC4wMCU1QiUyNCVEMSU4MC4tNDE5JTVEXy0lM0ItKiUyMCUyMyUyQyUyMyUyMzAuMDAlNUIlMjQlRDElODAuLTQxOSU1RF8tJTNCXy0qJTIwJTIyLSUyMiUzRiUzRiU1QiUyNCVEMSU4MC4tNDE5JTVEXy0lM0JfLSU0MF8t')}> + + props.onCellFormat('XyglQzIlQTUqJTIwJTIzJTJDJTIzJTIzMC4wMF8pJTNCXyglQzIlQTUqJTIwKCUyMyUyQyUyMyUyMzAuMDApJTNCXyglQzIlQTUqJTIwJTIyLSUyMiUzRiUzRl8pJTNCXyglNDBfKQ==')}> + + + + ) +} + +const PageCurrencyFormatCell = props => { + const { t } = useTranslation(); + const _t = t('View.Edit', {returnObjects: true}); + + return ( + + + + props.onCellFormat('JTI0JTIzJTJDJTIzJTIzMC4wMA==')}> + + props.onCellFormat('JUUyJTgyJUFDJTIzJTJDJTIzJTIzMC4wMA==')}> + + props.onCellFormat('JUMyJUEzJTIzJTJDJTIzJTIzMC4wMA==')}> + + props.onCellFormat('JTIzJTJDJTIzJTIzMC4wMCUyMiVEMSU4MC4lMjI=')}> + + props.onCellFormat('JUMyJUE1JTIzJTJDJTIzJTIzMC4wMA==')}> + + + + ) +} + +const PageDateFormatCell = props => { + const { t } = useTranslation(); + const _t = t('View.Edit', {returnObjects: true}); + + return ( + + + + props.onCellFormat('TU0tZGQteXk=')}> + props.onCellFormat('TU0tZGQteXl5eQ==')}> + + props.onCellFormat('ZGQtTU0teXk=')}> + + props.onCellFormat('ZGQtTU0teXl5eQ==')}> + + props.onCellFormat('ZGQtTU1NLXl5eXk=')}> + + props.onCellFormat('ZGQtTU1N')}> + + props.onCellFormat('TU1NLXl5')}> + + + + ) +} + +const PageTimeFormatCell = props => { + const { t } = useTranslation(); + const _t = t('View.Edit', {returnObjects: true}); + + return ( + + + + props.onCellFormat('aCUzQW1tJTNCJTQw')}> + + props.onCellFormat('aCUzQW1tJTNBc3MlM0IlNDA=')}> + + props.onCellFormat('aCUzQW1tJTIwQU0lMkZQTSUzQiU0MA==')}> + + props.onCellFormat('aCUzQW1tJTNBc3MlMjBBTSUyRlBNJTNCJTQw')}> + + props.onCellFormat('JTVCaCU1RCUzQW1tJTNBc3MlM0IlNDA=')}> + + + + ) +} + const PageEditCell = inject("storeCellSettings")(observer(EditCell)); const TextColorCell = inject("storeCellSettings", "storePalette", "storeFocusObjects")(observer(PageTextColorCell)); @@ -683,5 +864,10 @@ export { BorderStyleCell, BorderColorCell, CustomBorderColorCell, - BorderSizeCell + BorderSizeCell, + PageFormatCell, + PageAccountingFormatCell, + PageCurrencyFormatCell, + PageDateFormatCell, + PageTimeFormatCell }; \ No newline at end of file