sonika/sony_intranet_remake2023
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Advanced filter

Browse Source
This commit is contained in:
Sonika 2024-01-02 14:12:58 +05:30
parent 0b78d804f3
commit 56b75203e6
3 changed files with 240 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/projects/Projects.tsx
View File

@ -44,7 +44,7 @@ export default function Projects(){
<Card sx={{margin:'1%', backgroundColor:'rgb(23 23 22)'}}> <Card sx={{margin:'1%', backgroundColor:'rgb(23 23 22)'}}>
<CardContent> <CardContent>
<FormControl className="select-field" variant="standard" style={{marginTop: '1%'}}> <FormControl className="select-field" variant="standard" style={{marginTop: '1%'}}>
<InputLabel htmlFor="contract-list" >Select Contract</InputLabel> <InputLabel htmlFor="contract-list" sx={{ color: 'white',paddingLeft:1 }}>Select Contract</InputLabel>
<Select <Select
sx={{color: 'white', sx={{color: 'white',
'& .MuiSelect-iconOutlined ': { '& .MuiSelect-iconOutlined ': {

223
src/components/search/AdvancedFilters.tsx Normal file
View File

@ -0,0 +1,223 @@
import React, { useState } from 'react';
import {
Paper,
Grid,
Select,
MenuItem,
InputLabel,
FormControl,
Button,
TextField,
} from '@mui/material';
const DarkModeFilters = () => {
const [filterValues, setFilterValues] = useState({
filter1: '',
filter2: '',
filter3: '',
filter4: '',
filter5: '',
filter6: '',
filter7: '',
});
const handleFilterChange = (filterName:any, value:any) => {
setFilterValues((prevValues) => ({ ...prevValues, [filterName]: value }));
};
const handleApplyFilters = () => {
// Handle the logic to apply filters
console.log('Filter Values:', filterValues);
};
return (
<Paper square sx={{ width:'100%', overflow: 'hidden', backgroundColor: 'rgb(13 13 13)' }}>
<Grid container spacing={2} justifyContent="center" sx={{margin:'1%'}} >
<Grid item xs={1.5}>
<FormControl fullWidth variant="standard">
<InputLabel sx={{ color: 'white',paddingLeft:1 }}>Assets</InputLabel>
<Select
// value={filterValues[`filter${filterNumber}`]}
label="Assets"
onChange={(e) =>{
}}
sx={{ color: 'white', border: '1px solid white', }}
>
<MenuItem value="All">All</MenuItem>
<MenuItem value="Audio Song">Audio Song</MenuItem>
<MenuItem value="Video Song">Video Song</MenuItem>
<MenuItem value="Audio visual">Audio visual</MenuItem>
<MenuItem value="Story">Story</MenuItem>
<MenuItem value="Score">Score</MenuItem>
<MenuItem value="Dialogue">Dialogue</MenuItem>
</Select>
</FormControl>
</Grid>
<Grid item xs={1.5}>
<FormControl fullWidth variant="standard">
<InputLabel sx={{ color: 'white',paddingLeft:1 }}>Rights</InputLabel>
<Select
// value={filterValues[`filter${filterNumber}`]}
label="Rights"
onChange={(e) =>{
}}
sx={{ color: 'white', border: '1px solid white', }}
>
<MenuItem value="All">All</MenuItem>
<MenuItem value="Physical">Physical</MenuItem>
<MenuItem value="Digital">Digital</MenuItem>
<MenuItem value="Adaptation">Adaptation</MenuItem>
<MenuItem value="Synchronisation">Synchronisation</MenuItem>
<MenuItem value="Copyright Registration">Copyright Registration</MenuItem>
<MenuItem value="Public Performance">Public Performance</MenuItem>
<MenuItem value="Compilation">Compilation</MenuItem>
<MenuItem value="Games">Games</MenuItem>
<MenuItem value="GamesDuplicate">GamesDuplicate</MenuItem>
<MenuItem value="Literary Work">Literary Work</MenuItem>
<MenuItem value="Musical Work">Musical Work</MenuItem>
<MenuItem value="Performances/Singer">Performances/Singer</MenuItem>
<MenuItem value="Background Score">Background Score</MenuItem>
<MenuItem value="Dialogue">Dialogue</MenuItem>
<MenuItem value="Synchronisation">Synchronisation</MenuItem>
<MenuItem value="Composition">Composition</MenuItem>
<MenuItem value="Lyrics">Lyrics</MenuItem>
</Select>
</FormControl>
</Grid>
<Grid item xs={1.5}>
<FormControl fullWidth variant="standard">
<InputLabel sx={{ color: 'white',paddingLeft:1 }}>Validity</InputLabel>
<Select
// value={filterValues[`filter${filterNumber}`]}
label="Validity"
onChange={(e) =>{
}}
sx={{ color: 'white', border: '1px solid white', }}
>
<MenuItem value="All">All</MenuItem>
<MenuItem value="6 Months">6 Months</MenuItem>
<MenuItem value="12 Months">12 Months</MenuItem>
<MenuItem value="24 Months">24 Months</MenuItem>
<MenuItem value="60 Months">60 Months</MenuItem>
</Select>
</FormControl>
</Grid>
<Grid item xs={1.5}>
<FormControl fullWidth variant="standard">
<InputLabel sx={{ color: 'white',paddingLeft:1 }}>Mood</InputLabel>
<Select
// value={filterValues[`filter${filterNumber}`]}
label="Mood"
onChange={(e) =>{
}}
sx={{ color: 'white', border: '1px solid white', }}
>
<MenuItem value="All">All</MenuItem>
<MenuItem value="Happy">Happy</MenuItem>
<MenuItem value="Sad">Sad</MenuItem>
<MenuItem value="Romantic">Romantic</MenuItem>
<MenuItem value="Bored">Bored</MenuItem>
<MenuItem value="Upbeat">Upbeat</MenuItem>
</Select>
</FormControl>
</Grid>
<Grid item xs={1.5}>
<FormControl fullWidth variant="standard">
<InputLabel sx={{ color: 'white',paddingLeft:1 }}>Language</InputLabel>
<Select
// value={filterValues[`filter${filterNumber}`]}
label="Language"
onChange={(e) =>{
}}
sx={{ color: 'white', border: '1px solid white', }}
>
<MenuItem value="All">All</MenuItem>
<MenuItem value="English">English</MenuItem>
<MenuItem value="Punjabi">Punjabi </MenuItem>
<MenuItem value="Gujarati">Gujarati </MenuItem>
<MenuItem value="Telugu">Telugu </MenuItem>
<MenuItem value="Bahasa Indonesia">Bahasa Indonesia </MenuItem>
<MenuItem value="Tamil">Tamil </MenuItem>
<MenuItem value="Kannada">Kannada </MenuItem>
<MenuItem value="Marathi">Marathi </MenuItem>
<MenuItem value="Bahasa Malaysia">Bahasa Malaysia </MenuItem>
<MenuItem value="Malayalam">Malayalam </MenuItem>
<MenuItem value="Hindi">Hindi </MenuItem>
<MenuItem value="Bengali">Bengali </MenuItem>
<MenuItem value="Assamese">Assamese </MenuItem>
<MenuItem value="Carnatic">Carnatic </MenuItem>
<MenuItem value="Spanish">Spanish </MenuItem>
<MenuItem value="Urdu">Urdu </MenuItem>
<MenuItem value="Rajasthani">Rajasthani </MenuItem>
<MenuItem value="Multi Language">Multi Language </MenuItem>
<MenuItem value="Other">Other </MenuItem>
<MenuItem value="Arabic">Arabic </MenuItem>
<MenuItem value="Sanskrit">Sanskrit </MenuItem>
<MenuItem value="Not Applicable">Not Applicable </MenuItem>
<MenuItem value="Maithili">Maithili </MenuItem>
<MenuItem value="Greek">Greek </MenuItem>
</Select>
</FormControl>
</Grid>
<Grid item xs={1.5}>
<FormControl fullWidth variant="standard">
<InputLabel sx={{ color: 'white',paddingLeft:1 }}>Genre</InputLabel>
<Select
// value={filterValues[`filter${filterNumber}`]}
label="Genre"
onChange={(e) =>{
}}
sx={{ color: 'white', border: '1px solid white', }}
>
<MenuItem value="All">All</MenuItem>
<MenuItem value="Childrens Music">Childrens Music</MenuItem>
<MenuItem value="Pop">Pop</MenuItem>
<MenuItem value="Soundtrack (Bollywood)">Soundtrack (Bollywood)</MenuItem>
<MenuItem value="Ghazals, Sufi &amp; Qawwali">Ghazals, Sufi &amp; Qawwali</MenuItem>
<MenuItem value="Regional Indian">Regional Indian</MenuItem>
<MenuItem value="Classical - Carnatic">Classical - Carnatic</MenuItem>
<MenuItem value="Soundtrack (Punjabi)">Soundtrack (Punjabi)</MenuItem>
<MenuItem value="Soundtrack (Telugu)">Soundtrack (Telugu)</MenuItem>
<MenuItem value="World Music">World Music</MenuItem>
<MenuItem value="Qawwali">Qawwali</MenuItem>
<MenuItem value="Indian Pop">Indian Pop</MenuItem>
<MenuItem value="Classical - Hindustani">Classical - Hindustani</MenuItem>
<MenuItem value="Soundtrack (Bengali)">Soundtrack (Bengali)</MenuItem>
<MenuItem value="Soundtrack (Kannada)">Soundtrack (Kannada)</MenuItem>
<MenuItem value="Folk">Folk</MenuItem>
<MenuItem value="Miscellaneous/Other">Miscellaneous/Other</MenuItem>
<MenuItem value="Fusion">Fusion</MenuItem>
<MenuItem value="Electronica">Electronica</MenuItem>
<MenuItem value="Soundtrack (Malayalam)">Soundtrack (Malayalam)</MenuItem>
<MenuItem value="IndiPop">IndiPop</MenuItem>
<MenuItem value="Devotional &amp; Spiritual">Devotional &amp; Spiritual</MenuItem>
<MenuItem value="Soundtrack (Other)">Soundtrack (Other)</MenuItem>
<MenuItem value="Western Pop/Rock">Western Pop/Rock</MenuItem>
<MenuItem value="International">International</MenuItem>
<MenuItem value="Soundtrack (Marathi)">Soundtrack (Marathi)</MenuItem>
<MenuItem value="Punjabi/Bhangra">Punjabi/Bhangra</MenuItem>
<MenuItem value="Soundtrack (Tamil)">Soundtrack (Tamil)</MenuItem>
<MenuItem value="Indian Folk">Indian Folk</MenuItem>
<MenuItem value="Devotional">Devotional</MenuItem>
</Select>
</FormControl>
</Grid>
</Grid>
</Paper>
);
};
export default DarkModeFilters;

23
src/components/search/Search.tsx
View File

@ -1,19 +1,27 @@
import { Button, Grid, Paper, TextField } from "@mui/material"; import { Button, FormControl, Grid, InputLabel, MenuItem, Paper, Select, TextField } from "@mui/material";
import React, { useEffect, useState } from "react"; import React, { useEffect, useState } from "react";
import { postSearchList, } from "../../APIs/SearchAPIs/postSearchList"; import { postSearchList, } from "../../APIs/SearchAPIs/postSearchList";
import DarkModeFilters from "./AdvancedFilters";
export default function Search() { export default function Search() {
const [searchText, setSearchText] = useState(''); const [searchText, setSearchText] = useState('');
const [advandeFilterData, setAdvandeFilterData] = useState({}); const [advanceFilterData, setAdvanceFilterData] = useState<any>();
const [showAdvancedFilters, setShowAdvancedFilters] = useState(false);
useEffect(()=>{ // useEffect(() => {
postSearchList(advandeFilterData) // if (showAdvancedFilters) {
},[advandeFilterData]) // // Fetch data or perform actions when advanced filters are applied
// postSearchList(advanceFilterData);
// }
// }, [advanceFilterData, showAdvancedFilters]);
useEffect(()=>{
postSearchList(advanceFilterData)
},[advanceFilterData])
const handleSearch = () => { const handleSearch = () => {
setAdvandeFilterData({ setAdvanceFilterData({
searchText, searchText,
rights: 0, rights: 0,
asset_type: 0, asset_type: 0,
@ -31,7 +39,7 @@ useEffect(()=>{
}; };
const handleAdvancedFilter = () => { const handleAdvancedFilter = () => {
console.log('Advanced Filter'); setShowAdvancedFilters(!showAdvancedFilters);
}; };
return ( return (
@ -79,6 +87,7 @@ useEffect(()=>{
</Button> </Button>
</Grid> </Grid>
</Grid> </Grid>
{showAdvancedFilters && <DarkModeFilters />}
</Paper> </Paper>
</Paper> </Paper>
) )