Skip to content

Commit

Permalink
#53
Browse files Browse the repository at this point in the history
  • Loading branch information
@maximilianweidenauer
maximilianweidenauer committed Feb 15, 2021
1 parent b6690b8 commit b28b5e5
Show file tree
Hide file tree
Showing 5 changed files with 73 additions and 39 deletions.
51 changes: 16 additions & 35 deletions src/JVX/components/editors/number/UIEditorNumber.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -12,6 +12,7 @@ import { checkCellEditorAlignments } from "../../compprops/CheckAlignments";
import { sendOnLoadCallback } from "../../util/sendOnLoadCallback";
import { parseJVxSize } from "../../util/parseJVxSize";
import { getEditorCompId } from "../../util/GetEditorCompId";
import { getDecimalLength, getGrouping, getMinimumIntDigits, getNumberLength, getScaleDigits } from "../../util/NumberProperties";

interface ICellEditorNumber extends ICellEditor{
numberFormat: string,
Expand All @@ -26,7 +27,7 @@ export interface IEditorNumber extends IEditor{
scale: number,
}

interface ScaleType {
export interface ScaleType {
minScale:number,
maxScale:number,
}
Expand All @@ -43,38 +44,22 @@ const UIEditorNumber: FC<IEditorNumber> = (baseProps) => {
const lastValue = useRef<any>();
const {onLoadCallback, id} = baseProps;

const cellEditorMetaData:IEditorNumber|undefined = context.contentStore.dataProviderMetaData.get(compId)?.get(props.dataRow)?.columns.find(column => column.name === props.columnName) as IEditorNumber;

const scaleDigits:ScaleType = useMemo(() => {
let count = props.cellEditor.numberFormat.includes('.') ? (props.cellEditor.numberFormat.split('.')[1].match(/0/g) || []).length : 0;
return cellEditorMetaData.scale === -1 ? {minScale: count, maxScale:20} : {minScale: count, maxScale: cellEditorMetaData.scale}
}, [cellEditorMetaData.scale, props.cellEditor.numberFormat]);

const useGrouping = props.cellEditor.numberFormat?.includes(',');

const prefixLength = useMemo(() => {
let count = (props.cellEditor.numberFormat.split('.')[0].match(/0/g) || []).length;
return '0'.repeat(count - (selectedRow ? selectedRow.toString().length : 0))
},[props.cellEditor.numberFormat, selectedRow]);

const length = useMemo(() => {
let returnLength:number|undefined = undefined;
if (scaleDigits.maxScale === 0)
returnLength = cellEditorMetaData.precision;
else if (cellEditorMetaData.precision !== 0 && cellEditorMetaData.scale !== -1)
returnLength = cellEditorMetaData.precision+1;
if (useGrouping && returnLength)
returnLength += Math.floor((cellEditorMetaData.precision - cellEditorMetaData.scale)/4)
if (prefixLength && returnLength)
returnLength += prefixLength.length
return returnLength
}, [cellEditorMetaData.precision, cellEditorMetaData.scale, scaleDigits, useGrouping, prefixLength]);
const cellEditorMetaData:IEditorNumber|undefined = context.contentStore.dataProviderMetaData.get(compId)?.
get(props.dataRow)?.columns.find(column => column.name === props.columnName) as IEditorNumber;

const scaleDigits:ScaleType = useMemo(() => getScaleDigits(props.cellEditor.numberFormat, cellEditorMetaData.scale),
[cellEditorMetaData.scale, props.cellEditor.numberFormat]);

const useGrouping = getGrouping(props.cellEditor.numberFormat);

const prefixLength = useMemo(() => getMinimumIntDigits(props.cellEditor.numberFormat, selectedRow),
[props.cellEditor.numberFormat, selectedRow]);

const length = useMemo(() => getNumberLength(scaleDigits, cellEditorMetaData.precision, cellEditorMetaData.scale, useGrouping, prefixLength),
[cellEditorMetaData.precision, cellEditorMetaData.scale, scaleDigits, useGrouping, prefixLength]);

const decimalLength = useMemo(() => {
if (cellEditorMetaData.precision > 0)
return cellEditorMetaData.precision - cellEditorMetaData.scale
else
return undefined
getDecimalLength(cellEditorMetaData.precision, cellEditorMetaData.scale);
},[cellEditorMetaData.precision, cellEditorMetaData.scale]);

useLayoutEffect(() => {
Expand All @@ -101,8 +86,6 @@ const UIEditorNumber: FC<IEditorNumber> = (baseProps) => {

const handleKeyDown = (e:any) => {
const curRef = inputRef.current
//@ts-ignore
console.log(curRef.inputEl.value.length, length)
handleEnterKey(e, () => sendSetValues(props.dataRow, props.name, props.columnName, selectedRow, lastValue.current, context.server));
//@ts-ignore
if (curRef.inputEl.value.length === curRef.inputEl.maxLength || (decimalLength && parseInt((value ? value.toString().split('.')[0] : "") + e.key).toString().length > decimalLength && curRef.inputEl.selectionStart <= (value ? value.toString().indexOf('.') : 0))) {
Expand All @@ -111,8 +94,6 @@ const UIEditorNumber: FC<IEditorNumber> = (baseProps) => {
}
}

console.log(selectedRow, prefixLength)

return (
<InputNumber
ref={inputRef}
Expand Down
18 changes: 16 additions & 2 deletions src/JVX/components/table/CellDisplaying.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,8 @@ import { IEditor } from "../editors/IEditor";
import { parseDateFormatTable } from "../util/ParseDateFormats";
import moment from "moment";
import { createEditor } from "../../factories/UIFactory";
import { IEditorNumber } from "../editors/number/UIEditorNumber";
import { getGrouping, getMinimumIntDigits, getScaleDigits } from "../util/NumberProperties";

export function displayEditor(metaData:IEditor|undefined, props:any) {
let editor = <div>{props.cellData}</div>
Expand All @@ -24,7 +26,7 @@ export function displayEditor(metaData:IEditor|undefined, props:any) {
return editor
}

export function cellRenderer(metaData:IEditor|undefined, cellData:any, resource:string) {
export function cellRenderer(metaData:IEditor|undefined, cellData:any, resource:string, locale:string) {
if (cellData !== undefined) {
if (metaData && metaData.cellEditor) {
if (metaData.cellEditor.className === "ChoiceCellEditor") {
Expand All @@ -47,10 +49,22 @@ export function cellRenderer(metaData:IEditor|undefined, cellData:any, resource:
else
return null
}
else if (metaData.cellEditor.className === "ImageCellEditor") {
else if (metaData.cellEditor.className === "ImageViewer") {
const castedColumn = metaData as IEditorImage
return <img className="rc-table-image" src={cellData ? "data:image/jpeg;base64," + cellData : resource + castedColumn.cellEditor.defaultImageName} alt="could not be loaded"/>
}
else if (metaData.cellEditor.className === "NumberCellEditor") {
const castedColumn = metaData as IEditorNumber;
if (cellData === null)
return null
return Intl.NumberFormat(locale,
{
useGrouping: getGrouping(castedColumn.cellEditor.numberFormat),
minimumIntegerDigits: getMinimumIntDigits(castedColumn.cellEditor.numberFormat, cellData)?.length,
minimumFractionDigits: getScaleDigits(castedColumn.cellEditor.numberFormat, castedColumn.scale).minScale,
maximumFractionDigits: getScaleDigits(castedColumn.cellEditor.numberFormat, castedColumn.scale).maxScale
}).format(cellData);
}
else
return cellData;
}
Expand Down
2 changes: 1 addition & 1 deletion src/JVX/components/table/UITable.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -52,7 +52,7 @@ tr.p-highlight{
&.NumberCellEditor {
text-align: right;
}
&.ImageCellEditor {
&.ImageViewer {
>.cell-data {
padding: 0;
vertical-align: middle;
Expand Down
3 changes: 2 additions & 1 deletion src/JVX/components/table/UITable.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -40,13 +40,14 @@ const CellEditor: FC<CellEditor> = (props) => {

const [edit, setEdit] = useState(false);
const wrapperRef = useRef(null)
const context = useContext(jvxContext);
const columnMetaData = props.metaData?.columns.find(column => column.name === props.colName)
useOutsideClick(wrapperRef, setEdit, columnMetaData)
return useMemo(() => {
if (!edit) {
return (
<div className={"cell-data"} style={{height: 30}} onDoubleClick={event => columnMetaData?.cellEditor?.className !== "ImageCellEditor" ? setEdit(true) : undefined}>
{cellRenderer(columnMetaData, props.cellData, props.resource)}
{cellRenderer(columnMetaData, props.cellData, props.resource, context.contentStore.locale)}
</div>
)
} else {
Expand Down
38 changes: 38 additions & 0 deletions src/JVX/components/util/NumberProperties.tsx
View file
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
import { ScaleType } from "../editors/number/UIEditorNumber";

export function getGrouping(numberFormat:string) {
return numberFormat.includes(',');
}

export function getMinimumIntDigits(numberFormat:string, value:any) {
let count = (numberFormat.split('.')[0].match(/0/g) || []).length;
if (count - (value ? value.toString().length : 0) > 0)
return '0'.repeat(count - (value ? value.toString().length : 0))
else
return undefined;
}

export function getScaleDigits(numberFormat:string, scale:number) {
let count = numberFormat.includes('.') ? (numberFormat.split('.')[1].match(/0/g) || []).length : 0;
return scale === -1 ? {minScale: count, maxScale:20} : {minScale: count, maxScale: scale}
}

export function getNumberLength(scaleDigits:ScaleType, precision:number, scale:number, grouping:boolean, minInt:string|undefined) {
let returnLength:number|undefined = undefined;
if (scaleDigits.maxScale === 0)
returnLength = precision;
else if (precision !== 0 && scale !== -1)
returnLength = precision+1;
if (grouping && returnLength)
returnLength += Math.floor((precision - scale)/4)
if (minInt && returnLength)
returnLength += minInt.length
return returnLength
}

export function getDecimalLength(precision:number, scale:number) {
if (precision > 0)
return precision - scale
else
return undefined
}

0 comments on commit b28b5e5

Please sign in to comment.