Skip to content
Snippets Groups Projects
Commit f5b1eaf0 authored by Nithya Santhanam's avatar Nithya Santhanam
Browse files

TMSS-817: Fixed default column order

parent 1c44e3a8
No related branches found
No related tags found
2 merge requests!634WIP: COBALT commissioning delta,!555Resolves TMSS-817
Hide whitespace changes
Inline Side-by-side
SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable.js
+ 55
− 64
View file @ f5b1eaf0
......@@ -65,6 +65,7 @@ const getItemStyle = ({ isDragging, isDropAnimating }, draggableStyle) => ({
...draggableStyle,
// some basic styles to make the items look a bit nicer
userSelect: "none",
cursor: isDragging? 'move': 'move',
...(!isDragging && { transform: "translate(0,0)" }),
...(isDropAnimating && { transitionDuration: "0.001s" })
......@@ -1844,13 +1845,10 @@ function Table(props) {
);
// console.log('columns List', visibleColumns.map((d) => d.id));
const storedColOrder = UtilService.localStore({ type: 'get', key: tablename+'colOrder'});
if (storedColOrder.length) {
setColumnOrder(storedColOrder);
}
else if (columnOrders && columnOrders.length) {
if (columnOrders && columnOrders.length) {
if (showAction === 'true') {
setColumnOrder(['Select', 'Action', ...columnOrders]);
UtilService.localStore({ type: 'set', key: tablename+'colOrder', value: ['Select', ...columnOrders]});
UtilService.localStore({ type: 'set', key: tablename+'colOrder', value: ['Select', 'Action', ...columnOrders]});
} else {
setColumnOrder(['Select', ...columnOrders]);
UtilService.localStore({ type: 'set', key: tablename+'colOrder', value: ['Select', ...columnOrders]});
......@@ -2072,70 +2070,63 @@ function Table(props) {
onDragUpdate={(dragUpdateObj, b) => {
const colOrder = [...currentColOrder.current];
const sIndex = dragUpdateObj.source.index;
const dIndex =
dragUpdateObj.destination && dragUpdateObj.destination.index;
if (typeof sIndex === "number" && typeof dIndex === "number") {
colOrder.splice(sIndex, 1);
colOrder.splice(dIndex, 0, dragUpdateObj.draggableId);
setColumnOrder(colOrder);
UtilService.localStore({ type: 'set', key: tablename+'colOrder', value: colOrder});
}
const dIndex = dragUpdateObj.destination && dragUpdateObj.destination.index;
colOrder.splice(sIndex, 1);
colOrder.splice(dIndex, 0, dragUpdateObj.draggableId);
setColumnOrder(colOrder);
UtilService.localStore({ type: 'set', key: tablename+'colOrder', value: colOrder});
}}
>
<Droppable droppableId="droppable" direction="horizontal">
{(droppableProvided, snapshot) => (
<tr {...headerGroup.getHeaderGroupProps()}
ref={droppableProvided.innerRef}>
{headerGroup.headers.map((column,index) => (
<Draggable
key={column.id}
draggableId={column.id}
index={index}
isDragDisabled={!column.accessor}
>
{(provided, snapshot) => {
return (
<th onClick={() => {
if(!doServersideFilter) {
toggleBySorting({ 'id': column.id, desc: (column.isSortedDesc != undefined ? !column.isSortedDesc : false) });
}
}}>
<div {...column.getHeaderProps(column.getSortByToggleProps())} >
<div
{...provided.draggableProps}
{...provided.dragHandleProps}
// {...extraProps}
ref={provided.innerRef}
style={{
...getItemStyle(
snapshot,
provided.draggableProps.style
)
// ...style
}}
>
{column.Header !== 'actionpath' && column.render('Header')}
{column.Header !== 'Action' ?
column.isSorted ? (column.isSortedDesc ? <i className="pi pi-sort-down" aria-hidden="true"></i> : <i className="pi pi-sort-up" aria-hidden="true"></i>) : ""
: ""
{(droppableProvided, snapshot) => (
<tr {...headerGroup.getHeaderGroupProps()}
ref={droppableProvided.innerRef}>
{headerGroup.headers.map((column,index) => (
<Draggable
key={column.id}
draggableId={column.id}
index={index}
isDragDisabled={_.includes(['Select', 'Action', 'Status Logs'], column.id)? true: false}>
{(provided, snapshot) => {
return (
<th onClick={() => {
if(!doServersideFilter) {
toggleBySorting({ 'id': column.id, desc: (column.isSortedDesc != undefined ? !column.isSortedDesc : false) });
}
}}>
<div {...column.getHeaderProps(column.getSortByToggleProps())} >
<div
{...provided.draggableProps}
{...provided.dragHandleProps}
// {...extraProps}
ref={provided.innerRef}
style={{
...getItemStyle(
snapshot,
provided.draggableProps.style
)
// ...style
}}>
{column.Header !== 'actionpath' && column.render('Header')}
{column.Header !== 'Action' ?
column.isSorted ? (column.isSortedDesc ? <i className="pi pi-sort-down" aria-hidden="true"></i> : <i className="pi pi-sort-up" aria-hidden="true"></i>) : ""
: ""
}
</div>
</div>
</div>
{/* Render the columns filter UI */}
{column.Header !== 'actionpath' &&
<div className={columnclassname[0][column.Header]}>
{column.canFilter && column.Header !== 'Action' ? column.render('Filter') : null}
</div>
}
</th>
);
}}
</Draggable>
))}
</tr>
)}
{/* Render the columns filter UI */}
{column.Header !== 'actionpath' &&
<div className={columnclassname[0][column.Header]}>
{column.canFilter && column.Header !== 'Action' ? column.render('Filter') : null}
</div>
}
</th>
);
}}
</Draggable>
))}
</tr>
)}
</Droppable>
</DragDropContext>
))}
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment