TMSS-299

Updated Viewtable

SAS/TMSS/frontend/tmss_webapp/src/components/ViewTable.js

@@ -297,7 +297,7 @@ const IndeterminateCheckbox = React.forwardRef(
 )
 
 // Our table component
-function Table({ columns, data, defaultheader, optionalheader, defaultSortColumn }) {
+function Table({ columns, data, defaultheader, optionalheader, tablename, defaultSortColumn }) {
   const filterTypes = React.useMemo(
     () => ({
       // Add a new fuzzyTextFilterFn filter type.
@@ -369,6 +369,7 @@ function Table({ columns, data, defaultheader, optionalheader, defaultSortColumn
 
   const [currentpage, setcurrentPage] = React.useState(0);
   const [currentrows, setcurrentRows] = React.useState(10);
+  const [custompagevalue,setcustompagevalue] = React.useState();
 
   const onPagination = (e) => {
     gotoPage(e.page);
@@ -376,6 +377,37 @@ function Table({ columns, data, defaultheader, optionalheader, defaultSortColumn
     setcurrentRows(e.rows);
     setPageSize(e.rows)
   };
+  const onCustomPage = (e) => {
+    if(typeof custompagevalue === 'undefined' || custompagevalue == null) return;
+    gotoPage(0);
+    setcurrentPage(0);
+    setcurrentRows(custompagevalue);
+    setPageSize(custompagevalue)
+  };
+
+  const onChangeCustompagevalue = (e) => {
+    setcustompagevalue(e.target.value);
+  }
+  
+  const onShowAllPage = (e) => {
+    gotoPage(e.page);
+    setcurrentPage(e.first);
+    setcurrentRows(e.rows);
+    setPageSize(tbldata.length)
+    setcustompagevalue();
+  };
+
+  const onToggleChange = (e) =>{
+    let lsToggleColumns = [];
+    allColumns.forEach( acolumn =>{
+      let jsonobj = {};
+      let visible = (acolumn.Header === e.target.id) ? ((acolumn.isVisible)?false:true) :acolumn.isVisible
+      jsonobj['Header'] = acolumn.Header;
+      jsonobj['isVisible'] = visible;
+      lsToggleColumns.push(jsonobj) 
+    })
+    localStorage.setItem(tablename,JSON.stringify(lsToggleColumns))
+  }
 
   return (
     <>
@@ -494,6 +526,7 @@ function ViewTable(props) {
     let defaultheader = props.defaultcolumns;
     let optionalheader = props.optionalcolumns;
     let defaultSortColumn = props.defaultSortColumn;
+    let tablename = (props.tablename)?props.tablename:window.location.pathname;
     if(!defaultSortColumn){
       defaultSortColumn =[{}];
     }
@@ -588,7 +621,7 @@ function ViewTable(props) {
  
   return (
     <div>
-        <Table columns={columns} data={tbldata} defaultheader={defaultheader[0]} optionalheader={optionalheader[0]} 
+        <Table columns={columns} data={tbldata} defaultheader={defaultheader[0]}  tablename={tablename}  optionalheader={optionalheader[0]} 
         defaultSortColumn={defaultSortColumn} />
     </div>
   )