qury design columns grid

This commit is contained in:
Jan Prochazka
2020-12-27 16:02:50 +01:00
parent 0747614e00
commit 79759b1665
4 changed files with 94 additions and 17 deletions

View File

@@ -1,10 +1,16 @@
import React from 'react';
import { CheckboxField } from '../utility/inputs';
import DataFilterControl from '../datagrid/DataFilterControl';
import { CheckboxField, SelectField, TextField } from '../utility/inputs';
import TableControl, { TableColumn } from '../utility/TableControl';
function getTableDisplayName(column, tables) {
const table = tables.find((x) => x.designerId == column.designerId);
if (table) return table.alias || table.pureName;
return '';
}
export default function QueryDesignColumns({ value, onChange }) {
const { columns } = value || {};
console.log('QueryDesignColumns', value);
const { columns, tables } = value || {};
const changeColumn = React.useCallback(
(col) => {
@@ -22,7 +28,7 @@ export default function QueryDesignColumns({ value, onChange }) {
return (
<TableControl rows={columns || []}>
<TableColumn fieldName="columnName" header="Column/Expression" />
<TableColumn fieldName="tableDisplayName" header="Table" />
<TableColumn fieldName="tableDisplayName" header="Table" formatter={(row) => getTableDisplayName(row, tables)} />
<TableColumn
fieldName="isOutput"
header="Output"
@@ -36,21 +42,85 @@ export default function QueryDesignColumns({ value, onChange }) {
/>
)}
/>
{/* <TableColumn fieldName="queryDesignInfo.alias" editor="textbox" header="Alias" />
<TableColumn fieldName="queryDesignInfo.isGrouped" editor="checkbox" header="Group by" />
<TableColumn
fieldName="queryDesignInfo.aggregate"
editor="combobox"
fieldName="alias"
header="Alias"
formatter={(row) => (
<TextField
value={row.alias}
onChange={(e) => {
changeColumn({ ...row, alias: e.target.value });
}}
/>
)}
/>
<TableColumn
fieldName="isGrouped"
header="Group by"
formatter={(row) => (
<CheckboxField
checked={row.isGrouped}
onChange={(e) => {
if (e.target.checked) changeColumn({ ...row, isGrouped: true });
else changeColumn({ ...row, isGrouped: false });
}}
/>
)}
/>
<TableColumn
fieldName="aggregate"
header="Aggregate"
comboValues={['---', 'MIN', 'MAX', 'COUNT', 'COUNT DISTINCT', 'SUM', 'AVG']}
formatter={(row) => (
<SelectField
value={row.aggregate}
onChange={(e) => {
changeColumn({ ...row, aggregate: e.target.value });
}}
>
<option value="---">---</option>
<option value="MIN">MIN</option>
<option value="MAX">MAX</option>
<option value="COUNT">COUNT</option>
<option value="COUNT DISTINCT">COUNT DISTINCT</option>
<option value="SUM">SUM</option>
<option value="AVG">AVG</option>
</SelectField>
)}
/>
<TableColumn
fieldName="queryDesignInfo.sortOrder"
fieldName="sortOrder"
header="Sort order"
editor="combobox"
comboValues={sortComboValues}
formatter={(row) => (
<SelectField
value={row.sortOrder}
onChange={(e) => {
changeColumn({ ...row, sortOrder: e.target.value });
}}
>
<option value="0">---</option>
<option value="1">1st, ascending</option>
<option value="-1">1st, descending</option>
<option value="2">2nd, ascending</option>
<option value="-2">2nd, descending</option>
<option value="3">3rd, ascending</option>
<option value="-3">3rd, descending</option>,
</SelectField>
)}
/>
<TableColumn
fieldName="filter"
header="Filter"
formatter={(row) => (
<DataFilterControl
filterType="string"
filter={row.filter}
setFilter={(filter) => {
changeColumn({ ...row, filter });
}}
/>
)}
/>
<TableColumn fieldName="filter" header="Filter" editor="filterbox" getFilterType={this.getFilterType} /> */}
</TableControl>
);
}