trithuc-mvc-react 1.5.4 → 1.5.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/components/DataManagement/DataTable.jsx +1 -1
  2. package/components/DataManagement/FilterGod.jsx +73 -74
  3. package/components/DataManagement/hooks.js +2 -0
  4. package/package.json +1 -1
package/components/DataManagement/DataTable.jsx CHANGED
@@ -32,7 +32,7 @@ const DataTable = () => {
32
32
  }),
33
33
  keepPreviousData: true,
34
34
  onSuccess: ({ PermissionModel, status }) => {
35
- if (!Permission && status) {
35
+ if (status) {
36
36
  setPermission(PermissionModel);
37
37
  }
38
38
  }
package/components/DataManagement/FilterGod.jsx CHANGED
@@ -1,92 +1,91 @@
1
- import { Slider, Toolbar } from "@mui/material";
1
+ import { Accordion, AccordionSummary, Box, FormControl, InputLabel, MenuItem, Select, Slider, Toolbar, Typography } from "@mui/material";
2
2
  import { useFormContext } from "react-hook-form";
3
3
  import Grid from "@mui/material/Unstable_Grid2";
4
4
  import DateRangePicker from "../date/DateRangePicker";
5
5
  import { FilterElement } from "./FilterElement";
6
6
  import { useDataTable } from "./hooks";
7
7
 
8
+ import AccordionDetails from '@mui/material/AccordionDetails';
9
+ import ExpandMoreIcon from '@mui/icons-material/ExpandMore';
10
+
8
11
  export const FilterGod = ({ filters, elementSize = "small" }) => {
9
12
  const { handleSubmit } = useFormContext();
10
13
  const onSubmit = (data) => console.log(data);
11
14
  const { setDataSearch, dataSearch } = useDataTable();
12
15
 
13
16
  return (
14
- <Toolbar
17
+ <Box
15
18
  component={"form"}
16
- disableGutters
17
19
  onSubmit={handleSubmit(onSubmit)}
18
- sx={{
19
- px: 1,
20
- my: elementSize == "small" ? 1 : 2,
21
- display: "flex",
22
- alignItems: "center"
23
- }}
24
20
  >
25
- <Grid
26
- container
27
- spacing={{xs:1, xl:2}}
28
-
29
- sx={{
30
- px: 1,
31
- flex: 1
32
- }}
33
- >
34
- {filters.map(({ field, ...rest }) => {
35
- if (rest.type === "date-range") {
36
- return (
37
- <Grid key={field.toString()} xs={12} sm={6} md={4} xl={3}>
38
- <DateRangePicker
39
- onChange={(value) => {
40
- setDataSearch(({ previousState }) => ({
41
- ...previousState,
42
- [field[0]]: value[0],
43
- [field[1]]: value[1]
44
- }));
45
- }}
46
- size={elementSize}
47
- value={[dataSearch?.[field[0]], dataSearch?.[field[1]]]}
48
- />
49
- </Grid>
50
- );
51
- }
21
+ <Accordion>
22
+ <AccordionSummary
23
+ sx={{
24
+ minHeight: 40,
25
+ '& .MuiAccordionSummary-content': {
26
+ my: 1
27
+ }
28
+ }}
29
+ expandIcon={<ExpandMoreIcon />}
30
+ aria-controls="panel1a-content"
31
+ id="panel1a-header"
32
+ >
33
+ <Typography variant="h6">Tìm kiếm</Typography>
34
+ </AccordionSummary>
35
+ <AccordionDetails>
36
+ <Grid container spacing={1}>
37
+ {filters.map(({ field, size, ...rest }) => {
38
+ if (rest.type === "date-range") {
39
+ return (
40
+ <Grid key={field.toString()} md={size?.md} xs={size?.xs} sm={size?.sm}>
41
+ <DateRangePicker
42
+ onChange={(value) => {
43
+ setDataSearch(({ previousState }) => ({
44
+ ...previousState,
45
+ [field[0]]: value[0],
46
+ [field[1]]: value[1]
47
+ }));
48
+ }}
49
+ size={elementSize}
50
+ value={[dataSearch?.[field[0]], dataSearch?.[field[1]]]}
51
+ />
52
+ </Grid>
53
+ );
54
+ }
52
55
 
53
- if (rest.type === "slider-range") {
54
- return (
55
- <Grid
56
- key={field.toString()}
57
- xs={12}
58
- sm={6}
59
- md={4}
60
- xl={3}
61
- sx={{
62
- px: 4
63
- }}
64
- >
65
- <Slider
66
- onChange={(e, value) => {
67
- setDataSearch({
68
- ...dataSearch,
69
- [field[0]]: value[0],
70
- [field[1]]: value[1]
71
- });
72
- }}
73
- size={elementSize}
74
- marks={rest.marks}
75
- defaultValue={rest.defaultValue}
76
- valueLabelDisplay="auto"
77
- max={rest.marks[rest.marks.length - 1]?.value}
78
- step={null}
79
- />
80
- </Grid>
81
- );
82
- }
83
- return (
84
- <Grid key={field} xs={12} sm={6} md={4} xl={3}>
85
- <FilterElement name={field} {...rest} size={elementSize} />
86
- </Grid>
87
- );
88
- })}
89
- </Grid>
90
- </Toolbar>
56
+ if (rest.type === "slider-range") {
57
+ return (
58
+ <Grid
59
+ key={field.toString()}
60
+ md={size?.md} xs={size?.xs} sm={size?.sm}
61
+ >
62
+ <Slider
63
+ onChange={(e, value) => {
64
+ setDataSearch({
65
+ ...dataSearch,
66
+ [field[0]]: value[0],
67
+ [field[1]]: value[1]
68
+ });
69
+ }}
70
+ size={elementSize}
71
+ marks={rest.marks}
72
+ defaultValue={rest.defaultValue}
73
+ valueLabelDisplay="auto"
74
+ max={rest.marks[rest.marks.length - 1]?.value}
75
+ step={null}
76
+ />
77
+ </Grid>
78
+ );
79
+ }
80
+ return (
81
+ <Grid key={field} md={size?.md} xs={size?.xs} sm={size?.sm} >
82
+ <FilterElement name={field} {...rest} size={elementSize} />
83
+ </Grid>
84
+ );
85
+ })}
86
+ </Grid>
87
+ </AccordionDetails>
88
+ </Accordion>
89
+ </Box>
91
90
  );
92
91
  };
package/components/DataManagement/hooks.js CHANGED
@@ -14,6 +14,8 @@ export function usePermission() {
14
14
  const canCreate = !Permission || Permission.Create;
15
15
  const canAction = !Permission || Permission.Action;
16
16
  const canView = !Permission || Permission.View;
17
+ console.table(Permission);
18
+ console.table({canEdit, canDelete, canDeleteMulti, canSave, canCreate, canAction, canView});
17
19
  return { canEdit, canDelete, canDeleteMulti, canSave, canCreate, canAction, canView };
18
20
  }, [Permission]);
19
21
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "trithuc-mvc-react",
3
- "version": "1.5.4",
3
+ "version": "1.5.6",
4
4
  "main": "index.js",
5
5
  "scripts": {
6
6
  "test": "echo \"Error: no test specified\" && exit 1"