|
|
@@ -6,50 +6,55 @@ import MainCard from "../../components/MainCard"; |
|
|
|
import UserGroupSearchForm from "./UserGroupSearchForm"; |
|
|
|
import UserGroupTable from "./UserGroupTable"; |
|
|
|
import {useEffect, useState} from "react"; |
|
|
|
import axios from "axios"; |
|
|
|
import {apiPath} from "../../auth/utils"; |
|
|
|
import {GET_GROUP_LIST_PATH} from "../../utils/ApiPathConst"; |
|
|
|
import LoadingComponent from "../extra-pages/LoadingComponent"; |
|
|
|
import * as React from "react"; |
|
|
|
|
|
|
|
// ==============================|| DASHBOARD - DEFAULT ||============================== // |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const UserGroupSearchPanel = () => { |
|
|
|
|
|
|
|
const [record] = useState([]); |
|
|
|
const [record,setRecord] = useState([]); |
|
|
|
const [searchCriteria, setSearchCriteria] = useState({}); |
|
|
|
const [sortedRecord, setSortedRecord] = useState([]); |
|
|
|
const [onReady, setOnReady] = useState(false); |
|
|
|
|
|
|
|
const filterSearchName = (array) => { |
|
|
|
return array.filter((item) => item.name.toLowerCase().includes(searchCriteria.eventName)); |
|
|
|
}; |
|
|
|
useEffect(() => { |
|
|
|
getGroupList(); |
|
|
|
}, []); |
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
setOnReady(true); |
|
|
|
}, [record]); |
|
|
|
|
|
|
|
const filterSearchType = (array) => { |
|
|
|
return array.filter((item) => item.category.includes(searchCriteria.type)); |
|
|
|
}; |
|
|
|
useEffect(() => { |
|
|
|
getGroupList(); |
|
|
|
}, [searchCriteria]); |
|
|
|
|
|
|
|
function sortData(record){ |
|
|
|
let sortedRecord = record; |
|
|
|
sortedRecord = filterSearchName(sortedRecord); |
|
|
|
sortedRecord = filterSearchType(sortedRecord); |
|
|
|
return sortedRecord; |
|
|
|
function getGroupList(){ |
|
|
|
axios.get(`${apiPath}${GET_GROUP_LIST_PATH}`, |
|
|
|
{params: searchCriteria} |
|
|
|
) |
|
|
|
.then((response) => { |
|
|
|
if (response.status === 200) { |
|
|
|
setRecord(response.data.records); |
|
|
|
} |
|
|
|
}) |
|
|
|
.catch(error => { |
|
|
|
console.log(error); |
|
|
|
return false; |
|
|
|
}); |
|
|
|
} |
|
|
|
|
|
|
|
function applySearch(input){ |
|
|
|
setSearchCriteria(input); |
|
|
|
//console.log("Apply Search: "); |
|
|
|
//console.log(input); |
|
|
|
} |
|
|
|
|
|
|
|
useEffect(() => { |
|
|
|
//console.log(searchCriteria); |
|
|
|
if(Object.keys(searchCriteria).length !== 0){ |
|
|
|
const tempSortedRecord = sortData(record); |
|
|
|
console.log(tempSortedRecord); |
|
|
|
setSortedRecord(tempSortedRecord); |
|
|
|
}else{ |
|
|
|
setSortedRecord(record); |
|
|
|
} |
|
|
|
}, [searchCriteria]); |
|
|
|
|
|
|
|
return ( |
|
|
|
!onReady ? |
|
|
|
<LoadingComponent/> |
|
|
|
: |
|
|
|
<Grid container rowSpacing={4.5} columnSpacing={2.75}> |
|
|
|
<Grid item xs={12} sx={{mb: -2.25}}> |
|
|
|
<Typography variant="h5">View User Group</Typography> |
|
|
@@ -65,7 +70,7 @@ const UserGroupSearchPanel = () => { |
|
|
|
content={false} |
|
|
|
> |
|
|
|
<UserGroupTable |
|
|
|
recordList={sortedRecord} |
|
|
|
recordList={record} |
|
|
|
/> |
|
|
|
</MainCard> |
|
|
|
</Grid> |
|
|
|