@bit.rhplus/ag-grid 0.0.11

package/Aggregations.js

@@ -0,0 +1,185 @@
+import Enumerable from 'linq';
+import moment from 'moment';
+
+const getColumnOrderDirection = (range) => (range.columns[0].colId === range.startColumn.colId) ? 1 : -1;
+
+const getColumnOrderIndex = (range, index) => {
+  if (getColumnOrderDirection(range) === 1) {
+    return range.columns[index];
+  }
+  return range.columns[range.columns.length - 1 - index];
+}
+
+const getDimensionDefinition = (ranges) => {
+  let dimensionColumns = [];
+  let columnIndex = 0;
+  ranges.forEach(range => {
+    let colOf = 0;
+    for (let i = 0; i < range.columns.length; i += 1) {
+      if (columnIndex === 3)
+        break;
+      dimensionColumns = [...dimensionColumns, getColumnOrderIndex(range, colOf).colId];
+      columnIndex += 1;
+      colOf += 1;
+    }
+  });
+  return dimensionColumns;
+}
+
+const rangeContainsRowIndex = (range, row) => {
+  const start = Math.min(range.startRow.rowIndex, range.endRow.rowIndex);
+  const end = Math.max(range.startRow.rowIndex, range.endRow.rowIndex);
+  return (start <= row && end >= row);
+}
+
+const getValue = (gridRef, column, rowIndex) => {
+  const rowModel = gridRef.current.api.getModel();
+  const rowNode = rowModel.getRow(rowIndex);
+  const value = gridRef.current.api.getValue(column, rowNode);
+  return value;
+}
+
+const isValidDate = value => {
+  let typeValid = !(typeof value === 'number' || typeof value === "boolean" || value == null || value === '');
+  if (typeValid) {
+    typeValid = moment(value).isValid();
+  }
+  return typeValid;
+}
+
+export default function Aggregations(gridRef) {
+  const ranges = gridRef.current.api.getCellRanges();
+  let sum = null; let min = null; let max = null; let avg = null; let count = 0; let numberCount = 0;
+  let earliest; let latest;
+  let square = 0;
+  let cubic = 0;
+  let sumRows = [];
+  let sumCols = [];
+
+  if (!ranges[0] || !ranges[0].startRow)
+    return {};
+
+  const startRow = Math.min(ranges[0].startRow.rowIndex, ranges[0].endRow.rowIndex);
+  const domensionRanges = Enumerable.from(ranges).where(w => rangeContainsRowIndex(w, startRow)).toArray();
+  const dimensions = getDimensionDefinition(domensionRanges);
+
+  ranges.forEach(range => {
+    const start = Math.min(range.startRow.rowIndex, range.endRow.rowIndex);
+    const end = Math.max(range.startRow.rowIndex, range.endRow.rowIndex);
+    const rows = Enumerable.range(start, Math.abs(end - start) + 1).toArray();
+    sumRows = new Set([...sumRows, ...rows]);
+
+    const cols = Enumerable.from(range.columns).select(s => s.colId).distinct().toArray();
+    sumCols = new Set([...sumCols, ...cols]);
+
+    for (let rowIndex = start; rowIndex <= end; rowIndex += 1) {
+      let firstDimension = 0;
+      let secondDimension = 0;
+      let thirdDimension = 0;
+      const {columns} = range;
+      for (let i = 0; i < columns.length; i+=1) {
+        const column = columns[i];
+        const value = getValue(gridRef, column, rowIndex);
+
+        const validDate = isValidDate(value);
+        if (validDate) {
+          const dateValue = moment(value);
+          earliest = new Date(Math.min.apply(null, [(earliest || dateValue), dateValue]));
+          latest = new Date(Math.max.apply(null, [(latest || dateValue), dateValue]));
+        }
+        else if (typeof value === 'number') {
+          if (column.colId === dimensions[0]) { // prvni dimenze
+            firstDimension += value;
+          } else if (column.colId === dimensions[1]) {
+            secondDimension += value;
+          } else if (column.colId === dimensions[2]) {
+            thirdDimension += value;
+          }
+          sum += value;
+          min = Math.min(min || value, value);
+          max = Math.max(max || value, value);
+          numberCount += 1;
+        }
+        count += 1;
+      };
+      square += (firstDimension * secondDimension);
+      cubic += (firstDimension * secondDimension * thirdDimension);
+    }
+    avg = (sum / numberCount);
+
+  });
+
+  return {
+    sum,
+    min,
+    max,
+    avg,
+    count,
+    square,
+    cubic,
+    earliest,
+    latest,
+    rows: [...sumRows].length,
+    cols: [...sumCols].length
+  };
+
+
+  // ranges.map(item => {
+  //   var start = Math.min(item.startRow.rowIndex, item.endRow.rowIndex);
+  //   var end = Math.max(item.startRow.rowIndex, item.endRow.rowIndex);
+  //   for (var rowIndex = start; rowIndex <= end; rowIndex++) {
+  //     var dimension = 0;
+  //     rowVolume = 1;
+
+  //     item.columns.forEach(column => {
+  //       var rowModel = gridRef.current.api.getModel();
+  //       var rowNode = rowModel.getRow(rowIndex);
+  //       var value = gridRef.current.api.getValue(column, rowNode);
+
+  //       if (Date.parse(value) && value != 0) {
+  //         dateCount++;
+  //         earliest = new Date(Math.min.apply(null, [(earliest || Date.parse(value)), Date.parse(value)]));
+  //         latest = new Date(Math.max.apply(null, [(latest || Date.parse(value)), Date.parse(value)]));
+  //       }
+
+  //       if (typeof value === "number") {
+  //         dimension++;
+  //         sum += value;
+  //         min = Math.min(min || value, value);
+  //         max = Math.max(max || value, value);
+  //         count++;
+
+  //         if (dimension <= 3) {
+  //           rowVolume = rowVolume * value;
+  //         } else {
+  //           rowVolume = 0;
+  //         }
+  //       }
+  //     })
+  //     if (dimension === 2) {
+  //       volume2d = volume2d + rowVolume;
+  //     } else if (dimension === 3) {
+  //       volume3d = volume3d + rowVolume;
+  //     }
+
+
+  //   }
+  //   length += (Math.abs(item.startRow.rowIndex - item.endRow.rowIndex) + 1) * item.columns.length;
+  //   avg = (sum / count);
+  // });
+
+  // return {
+  //   length,
+  //   sum,
+  //   min,
+  //   max,
+  //   avg,
+  //   count,
+  //   volume2d,
+  //   volume3d,
+  //   earliest,
+  //   latest,
+  //   isDate: dateCount >= 2,
+  //   dateCount
+  // };
+}

package/CheckBoxRenderer.jsx

@@ -0,0 +1,29 @@
+import React from 'react';
+
+export class CheckboxRenderer extends React.Component {
+    constructor(props) {
+        super(props);
+        this.checkedHandler = this.checkedHandler.bind(this);
+    }
+
+    checkedHandler(event) {
+        const {node, column: {colId} = {}} = this.props;
+        const {target: {checked} = {}} = event;
+        node.setDataValue(colId, checked);        
+    }
+
+    render() {
+        const {data, value}  = this.props;
+        return (
+            !!data && (
+                <div style={{textAlign: 'center'}}>
+                    <input type='checkbox'
+                        checked={value}
+                        onClick={this.checkedHandler}
+                    />
+                        
+                </div>
+            )
+        )
+    }
+}

package/Components/ExtendButton.css

@@ -0,0 +1,6 @@
+.extra-small-button .ant-btn {
+  font-size: 10px;
+  padding: 2px 6px;
+  height: 20px;
+  line-height: 16px;
+}

package/Components/ExtendButton.jsx

@@ -0,0 +1,17 @@
+import * as React from 'react';
+import { Button } from 'antd';
+import './ExtendButton.css';
+
+const ExtendButton = (props) => {
+  const { size, className, ...restProps } = props;
+  const extraSmallClass = size === 'extraSmall' ? 'extra-small-button' : '';
+
+  const {children} = props;
+  return (    
+    <div className={`${extraSmallClass} ${className}`}>
+      <Button {...restProps}>{children}</Button>
+    </div>
+  );
+};
+
+export default ExtendButton;

package/CountryCellRenderer.jsx

@@ -0,0 +1,18 @@
+export default function CountryCellRenderer(params) {
+  const {value, value: {code} = {}} = params
+  
+  if (!value)
+    return '';
+
+  let imageUrl = '';
+  if (code)
+    imageUrl = `https://rhplus.blob.core.windows.net/countries/${code.toUpperCase()}.png`;
+
+  const { value: { name } = {} } = params;
+  return (
+    <div>
+      <span style={{ marginRight: 10 }}><img alt="img" src={imageUrl} /></span>
+      {name}
+    </div>
+  );
+}

package/Functions/index.js

@@ -0,0 +1,21 @@
+import Enumerable from 'linq';
+
+export const getSelectedRowsIndex = gridApi => {
+  const ranges = gridApi.rangeService.cellRanges;
+
+  let sumRows = [];
+  ranges.forEach(range => {
+    const start = Math.min(range.startRow.rowIndex, range.endRow.rowIndex);
+    const end = Math.max(range.startRow.rowIndex, range.endRow.rowIndex);
+    const rows = Enumerable.range(start, Math.abs(end - start) + 1).toArray();
+    sumRows = new Set([...sumRows, ...rows]);
+  });
+  return sumRows;
+}
+
+export const getValue = (gridApi, column, rowIndex) => {
+  const rowModel = gridApi.getModel();
+  const rowNode = rowModel.getRow(rowIndex);
+  const value = gridApi.getValue(column, rowNode);
+  return value;
+};

package/HeaderTemplates/CommonHeaderTemplate.js

@@ -0,0 +1,15 @@
+
+export const CommonHeaderTemplate = htmlText => `
+<div class="ag-cell-label-container" role="presentation">
+<span ref="eMenu" class="ag-header-icon ag-header-cell-menu-button"></span>
+<div ref="eLabel" class="ag-header-cell-label" role="presentation">
+  <span class="ag-header-cell-text" role="columnheader">
+    ${htmlText}
+  </span>
+  <span ref="eSortOrder" class="ag-header-icon ag-sort-order" ></span>
+    <span ref="eSortAsc" class="ag-header-icon ag-sort-ascending-icon" ></span>
+    <span ref="eSortDesc" class="ag-header-icon ag-sort-descending-icon" ></span>
+    <span ref="eSortNone" class="ag-header-icon ag-sort-none-icon" ></span>
+    <span ref="eFilter" class="ag-header-icon ag-filter-icon"></span>
+  </div>
+</div>`

package/HyperModuleEditor.js

@@ -0,0 +1,139 @@
+// import * as React from "react";
+// import HyperDetailContext from '@rhplus/wieldy.hyper-module';
+// import set from 'lodash/set';
+
+// const KEY_BACKSPACE = 8;
+// const KEY_DELETE = 46;
+// const KEY_F2 = 113;
+
+// // export interface IHyperModuleEditorProps extends ICellEditorComp {
+// //   // params: ICellRendererComp,
+// //   // children: React.ReactNode,
+// //   // onClick?(event: any): void,
+// //   // title?: string
+// // }
+
+// // const theme = createTheme();
+
+// const valueContextState = {
+//   open: false,
+//   trigger: () => {},
+//   onClose: () => {}
+// }
+
+// // export interface IState {
+// //   value: string,
+// //   open: boolean,
+// //   valueContext: any,
+// //   highlightAllOnFocus: any
+// // }
+
+// // export interface IProps {
+// //   data: any,
+// //   colDef: any,
+// //   setValue: (data:any) => {}
+// // }
+
+// class HyperModuleEditor extends React.Component {
+//   constructor(props) {
+//     super(props);
+
+//     this.state = this.createInitialState(props);
+//     this.handleChange = this.handleChange.bind(this);
+//   }
+
+//   createInitialState(props) {
+//     let startValue;
+//     let highlightAllOnFocus = true;
+
+//     if (props.keyPress === KEY_BACKSPACE || props.keyPress === KEY_DELETE) {
+//       // if backspace or delete pressed, we clear the cell
+//       startValue = '';
+//     } else if (props.charPress) {
+//       // if a letter was pressed, we start with the letter
+//       startValue = {
+//         name: props.charPress
+//       }
+      
+//       set(props.data, props.colDef.fieldId, null);
+//       highlightAllOnFocus = false;
+//     } else {
+//       // otherwise we start with the current value
+//       startValue = props.value;
+//       if (props.keyPress === KEY_F2) {
+//         highlightAllOnFocus = false;
+//       }
+//     }
+
+//     return {
+//       value: startValue,
+//       open: false,
+//       valueContext: valueContextState,
+//       highlightAllOnFocus
+//     }
+//   }
+
+//   afterGuiAttached() {
+//     // get ref from React component
+//     const eInput = this.refs.input;
+//     eInput.focus();
+//     if (this.state.highlightAllOnFocus) {
+//       eInput.select();
+
+//       this.setState({
+//         highlightAllOnFocus: false
+//       })
+//     } else {
+//       // when we started editing, we want the carot at the end, not the start.
+//       // this comes into play in two scenarios: a) when user hits F2 and b)
+//       // when user hits a printable character, then on IE (and only IE) the carot
+//       // was placed after the first character, thus 'apply' would end up as 'pplea'
+//       const length = eInput.value ? eInput.value.length : 0;
+//       if (length > 0) {
+//         eInput.setSelectionRange(length, length);
+//       }
+//     }
+//   }
+
+//   getValue() {
+//     return this.state.value;
+//   }
+
+//   handleChange(event) {
+//     set(this.props.data, this.props.colDef.fieldId, null);
+//     this.setState({
+//       value: event.target.value
+//     });
+//   }
+
+//   setOpen(open) {
+//     this.setState(() => ({ open }));
+//   }
+
+//   trigger(data) {
+//     this.props.setValue(data);
+//     this.setOpen(false);
+//   }
+
+//   render() {
+    
+//     return (
+//       <div>
+//         <input ref="input"
+//           value={this.state.value}
+//           onChange={this.handleChange}
+//           style={{ width: "100%" }}
+//         />
+//         <HyperDetailContext.Provider value={this.state.valueContext}>
+//           {this.props.children}
+//         </HyperDetailContext.Provider>
+//       </div>
+//     );
+//   }
+
+//   deleteOrBackspace(event) {
+//     return [KEY_DELETE, KEY_BACKSPACE].indexOf(event.keyCode) > -1;
+//   }
+// }
+
+// export default HyperModuleEditor;

package/HyperModuleRenderer.js

@@ -0,0 +1,152 @@
+// import * as React from 'react';
+// import HyperDetailContext from '@rhplus/wieldy.hyper-module';
+// import set from 'lodash/set';
+// import get from 'lodash/get';
+
+// const HyperModuleRenderer = 
+//   ({value,  children, setValue, loadItem, colDef, data, api, props}) => 
+// {
+//   const [show, setShow] = React.useState(false);
+//   const [, setOpen] = React.useState(false);
+
+//   const handleClick = () => {
+//     onOpen();
+//     // onClick && onClick(event);
+//   }
+  
+//   // prepsat do css class
+//   const ButtonStyle = ({
+//     visibility: show ? 'visible' : 'hidden',
+//     float: 'right', 
+//     width: '20px',
+//     zIndex: 10000,
+//     overflow: 'hidden'
+//   })
+
+//   const onOpen = () => {
+//     ChangeValue(true);
+//   }
+
+//   const onClose = () => {
+//     setOpen(false);
+//     ChangeValue(false);
+//   }
+
+//   const ChangeValue = (open) => {
+//     setValueContext(state => ({
+//       ...state,
+//       open
+//     }))
+//   }
+
+//   // const valuePath = (props) => {
+//   //   return {
+//   //     id: this.deepValue(props.data, props.colDef.fieldId),
+//   //     name: props.value
+//   //   }
+//   // }
+
+//   const trigger = (_data) => {
+//     set(data, colDef.fieldId, _data.id);
+//     if (colDef.fieldDescription !== undefined && _data.description !== undefined) {
+//       set(data, colDef.fieldDescription, _data.description);
+//     }
+//     if (colDef.fieldObject !== undefined && _data.object !== undefined) {
+//       set(data, colDef.fieldObject, _data.object)
+//     }
+//     if (colDef.fieldAdditional1 !== undefined && _data.additional1 !== undefined) {
+//       set(data, colDef.fieldAdditional1, _data.additional1)
+//     }
+//     if (colDef.fieldAdditional2 !== undefined && _data.additional2 !== undefined) {
+//       set(data, colDef.fieldAdditional2, _data.additional2)
+//     }
+//     setValue(_data.name);
+//     setOpen(false);
+//   }
+
+//   // const handleClose = () => {
+//   //   setOpen(false);
+//   // }
+
+//   const valueContextState = {
+//     open: false,
+//     trigger,
+//     onClose
+//   }
+
+//   const onCellChanged = (event) => {
+//       if (event.rowIndex === props.rowIndex &&
+//       event.newValue !== props.value) {
+
+//       const val = get(data, colDef.fieldId);
+//       if (val === null) {      
+//         if (event.newValue != null && event.newValue.length > 0) {
+//           loading(event.newValue)
+//         }
+//         else if (event.newValue === null && val === null) { //opravit
+//           handleClick(null);
+//         }
+//       }
+
+//     }
+//   }
+
+//   React.useEffect(() => {
+//     api.addEventListener("cellValueChanged", onCellChanged);
+//     return () => api.removeEventListener("cellValueChanged", onCellChanged);
+//   }, []);
+
+//   const loading = async (_value) => {
+//     let result = await loadItem(_value);
+//     const {
+//       id = null,
+//       name = null, 
+//       description = null, 
+//       additional1 = null, 
+//       additional2 = null,
+//       object = null
+//     } = result || {};
+//     set(data, "_rh_plus_ag_grid_new_item", false);
+//     setValue(name);
+//     set(data, colDef.fieldId, id);
+//     if (colDef.fieldDescription !== undefined) {
+//       set(data, colDef.fieldDescription, description);
+//     }
+//     if (colDef.fieldAdditional1 !== undefined) {
+//       set(data, colDef.fieldAdditional1, additional1)
+//     }
+//     if (colDef.fieldAdditional2 !== undefined) {
+//       set(data, colDef.fieldAdditional2, additional2)
+//     }
+//     if (colDef.fieldObject !== undefined) {
+//       set(data, colDef.fieldObject, object)
+//     }
+//     // api.refreshCells({force: true});
+//     return result;
+//   }
+//   const [valueContext, setValueContext] = React.useState(valueContextState);
+//   return (
+//     <div 
+//       onMouseMove={() => setShow(true)} 
+//       onMouseLeave={() => setShow(false)} 
+//       style={{
+//         overflow: 'hidden'
+//       }}>
+//         {<button 
+//           onClick={event => handleClick(event)} 
+//           style={ButtonStyle}
+//         >
+//           ...
+//         </button>}
+//         <div style={{zIndex: 1}}
+//         >
+//           {value}
+//         </div>
+//         <HyperDetailContext.Provider value={valueContext}>
+//           {children}
+//         </HyperDetailContext.Provider>        
+//     </div>  
+//   )
+// }
+
+// export default HyperModuleRenderer;

package/NotificationOptions.jsx

@@ -0,0 +1,53 @@
+import React from 'react';
+
+const getValue = (value, fix, def = '') =>
+  Number.isNaN(value) || value === null ? def : parseFloat(value).toFixed(fix);
+
+const NotificationOptions = {
+  head: messageInfo => {
+    const {
+      sum,
+      square,
+      cubic,
+      rows,
+      cols
+    } = messageInfo;
+
+    const squareMeters = getValue(square / 10000, 2);
+    const cubicMeters = getValue(cubic / 1000000, 2);
+
+    return (
+
+      <div>
+        <span className="mr-1"><b>Rows:</b></span>{getValue(rows, 1)}
+        <span className="ml-3 mr-1"><b>Sum:</b></span>{getValue(sum, 1)}
+        {cols === 2 ? <span className="ml-3 mr-1"><b>m<sup>2</sup>:</b> {squareMeters}</span> : <span />}
+        {cols === 3 ? <span className="ml-3 mr-1"><b>m<sup>3</sup>:</b> {cubicMeters}</span> : <span />}
+      </div>)
+  },
+
+  body: messageInfo => {
+    const {
+      count,
+      min,
+      max,
+      avg,
+    } = messageInfo;
+    return (
+      <>
+        <div>
+          <span className="mr-2"><b>Min:</b></span>{getValue(min, 2)}
+          <span className="ml-2 mr-2"><b>Max:</b></span>{getValue(max, 2)}
+          <span className="ml-2 mr-2"><b>Avg:</b></span>{getValue(avg, 2)}
+          <span className="ml-2 mr-2"><b>Count:</b></span>{getValue(count, 2)}
+        </div>
+      </>
+    )
+  },
+  style: {
+    width: 520
+  },
+  placement: 'bottomRight'
+}
+
+export default NotificationOptions;

package/OnCellDoubleClicked.js

@@ -0,0 +1,10 @@
+
+export const RhPlusOnCellDoubleClicked = (
+  event, 
+  options
+  ) => 
+{
+  // call overrided function 
+  if (options.onCellDoubleClicked)
+    options.onCellDoubleClicked(event);
+}

package/OnCellEditingStarted.js

@@ -0,0 +1,9 @@
+export const RhPlusOnCellEditingStarted = (event, options) => {
+
+  // call overrided function 
+  if (options.onCellEditingStarted)
+    options.onCellEditingStarted(event);
+  event.api.refreshCells({force: true});
+  
+}
+

package/OnCellValueChanged.js

@@ -0,0 +1,12 @@
+
+/* eslint-disable no-param-reassign */
+export const RhPlusOnCellValueChanged = (event, options) => 
+{
+  event.data._rh_plus_ag_grid_new_item = false;
+  event.data._rh_plus_ag_grid_row_changed = true;
+
+  // call overrided function 
+  if (options.onCellValueChanged)
+    options.onCellValueChanged(event);
+  // event.api.refreshCells({force: true});
+}