Compare commits
5 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
fc76e85d77 | ||
|
|
6979c51eaf | ||
|
|
f035ee7a9d | ||
|
|
a982e0f2a7 | ||
|
|
cbb4a31be6 |
@@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "ag-grid-react-example",
|
"name": "ag-grid-react-example",
|
||||||
"version": "13.3.0",
|
"version": "14.0.0",
|
||||||
"description": "Example Reach applicaiton using ag-Grid.",
|
"description": "Example Reach applicaiton using ag-Grid.",
|
||||||
"main": "dist/ag-grid-react-example.js",
|
"main": "dist/ag-grid-react-example.js",
|
||||||
"scripts": {
|
"scripts": {
|
||||||
@@ -58,9 +58,9 @@
|
|||||||
"typescript": "2.3.x"
|
"typescript": "2.3.x"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"ag-grid": "13.3.x",
|
"ag-grid": "14.0.x",
|
||||||
"ag-grid-enterprise": "13.3.x",
|
"ag-grid-enterprise": "14.0.x",
|
||||||
"ag-grid-react": "13.3.x",
|
"ag-grid-react": "14.0.x",
|
||||||
"bootstrap": "3.3.7",
|
"bootstrap": "3.3.7",
|
||||||
"d3": "4.9.1",
|
"d3": "4.9.1",
|
||||||
"file-loader": "0.11.1",
|
"file-loader": "0.11.1",
|
||||||
|
|||||||
@@ -1,5 +1,4 @@
|
|||||||
import React from 'react';
|
import React, {Component} from 'react';
|
||||||
import {reactCellRendererFactory} from 'ag-grid-react';
|
|
||||||
import SimpleCellRenderer from './simpleCellRenderer.jsx';
|
import SimpleCellRenderer from './simpleCellRenderer.jsx';
|
||||||
|
|
||||||
import {AgGridReact} from 'ag-grid-react';
|
import {AgGridReact} from 'ag-grid-react';
|
||||||
@@ -7,7 +6,7 @@ import {AgGridReact} from 'ag-grid-react';
|
|||||||
// put this line in to use ag-Grid enterprise
|
// put this line in to use ag-Grid enterprise
|
||||||
// import 'ag-grid-enterprise';
|
// import 'ag-grid-enterprise';
|
||||||
|
|
||||||
export default class MyApp extends React.Component {
|
export default class MyApp extends Component {
|
||||||
|
|
||||||
constructor() {
|
constructor() {
|
||||||
super();
|
super();
|
||||||
@@ -22,22 +21,22 @@ export default class MyApp extends React.Component {
|
|||||||
|
|
||||||
createColumnNames() {
|
createColumnNames() {
|
||||||
// creates column names by iterating the alphabet twice, eg {'aa','ab','ac',.....'zz'}
|
// creates column names by iterating the alphabet twice, eg {'aa','ab','ac',.....'zz'}
|
||||||
var alphabet = 'abcdefghijklmnopqrstuvwxyz'.split('');
|
const alphabet = 'abcdefghijklmnopqrstuvwxyz'.split('');
|
||||||
this.columnNames = [];
|
this.columnNames = [];
|
||||||
alphabet.forEach( letter1 => {
|
alphabet.forEach(letter1 => {
|
||||||
alphabet.forEach( letter2 => {
|
alphabet.forEach(letter2 => {
|
||||||
this.columnNames.push(letter1 + letter2);
|
this.columnNames.push(letter1 + letter2);
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
createRowData() {
|
createRowData() {
|
||||||
var rowData = [];
|
const rowData = [];
|
||||||
|
|
||||||
for (var i = 0; i<1000; i++) {
|
for (let i = 0; i < 1000; i++) {
|
||||||
var item = {};
|
const item = {};
|
||||||
this.columnNames.forEach( colName => {
|
this.columnNames.forEach(colName => {
|
||||||
item[colName] = '('+colName.toUpperCase()+','+i+')'
|
item[colName] = '(' + colName.toUpperCase() + ',' + i + ')'
|
||||||
});
|
});
|
||||||
rowData.push(item);
|
rowData.push(item);
|
||||||
}
|
}
|
||||||
@@ -46,9 +45,9 @@ export default class MyApp extends React.Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
createColumnDefs() {
|
createColumnDefs() {
|
||||||
var columnDefs = [];
|
const columnDefs = [];
|
||||||
|
|
||||||
this.columnNames.forEach( colName => {
|
this.columnNames.forEach(colName => {
|
||||||
columnDefs.push({
|
columnDefs.push({
|
||||||
headerName: colName.toUpperCase(),
|
headerName: colName.toUpperCase(),
|
||||||
field: colName,
|
field: colName,
|
||||||
@@ -63,7 +62,7 @@ export default class MyApp extends React.Component {
|
|||||||
render() {
|
render() {
|
||||||
return (
|
return (
|
||||||
<div style={{height: '100%'}} className="ag-fresh">
|
<div style={{height: '100%'}} className="ag-fresh">
|
||||||
<AgGridReact columnDefs={this.state.columnDefs} rowData={this.state.rowData} />
|
<AgGridReact columnDefs={this.state.columnDefs} rowData={this.state.rowData}/>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,4 +1,5 @@
|
|||||||
import React, {PropTypes} from 'react'
|
import React from 'react'
|
||||||
|
import * as PropTypes from 'prop-types';
|
||||||
import {Route, Link} from 'react-router-dom'
|
import {Route, Link} from 'react-router-dom'
|
||||||
|
|
||||||
// for bootstrap li active functionality
|
// for bootstrap li active functionality
|
||||||
|
|||||||
@@ -32,12 +32,13 @@ export default class MoodEditor extends Component {
|
|||||||
}
|
}
|
||||||
|
|
||||||
focus() {
|
focus() {
|
||||||
|
if (!this.cancelBeforeStart) {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
this.refs.input.focus();
|
this.refs.input.focus();
|
||||||
this.refs.input.setSelectionRange(this.state.value.length, this.state.value.length);
|
this.refs.input.setSelectionRange(this.state.value.length, this.state.value.length);
|
||||||
|
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
}
|
||||||
|
|
||||||
getValue() {
|
getValue() {
|
||||||
return this.state.value;
|
return this.state.value;
|
||||||
|
|||||||
@@ -34,7 +34,7 @@ export default class PartialMatchFilter extends Component {
|
|||||||
this.state.text = model ? model.value : '';
|
this.state.text = model ? model.value : '';
|
||||||
}
|
}
|
||||||
|
|
||||||
afterGuiAttached(params) {
|
componentDidMount() {
|
||||||
this.focus();
|
this.focus();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -41,10 +41,14 @@ export default class ProficiencyFilter extends React.Component {
|
|||||||
this.setState(newState, this.props.filterChangedCallback);
|
this.setState(newState, this.props.filterChangedCallback);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
getModel() {
|
getModel() {
|
||||||
return ''
|
return ''
|
||||||
}
|
}
|
||||||
|
|
||||||
|
setModel(model) {
|
||||||
|
}
|
||||||
|
|
||||||
render() {
|
render() {
|
||||||
const rows = [];
|
const rows = [];
|
||||||
PROFICIENCY_NAMES.forEach((name) => {
|
PROFICIENCY_NAMES.forEach((name) => {
|
||||||
|
|||||||
Reference in New Issue
Block a user