amenpunk 1 год назад
Родитель
Сommit
e4d95d798a

+ 7 - 0
src/App.css

470
   justify-content: space-between;
470
   justify-content: space-between;
471
   align-items: flex-end;
471
   align-items: flex-end;
472
 }
472
 }
473
+
474
+.loadingBase{
475
+  display: grid;
476
+}
477
+.lodingSpinner{
478
+  place-self: center;
479
+}

+ 4 - 1
src/App.js

12
 const queryClient = new QueryClient({
12
 const queryClient = new QueryClient({
13
   defaultOptions: {
13
   defaultOptions: {
14
     queries: {
14
     queries: {
15
-      refetchOnWindowFocus: true,
15
+      refetchOnWindowFocus: false,
16
+      refetchOnMount: false,
17
+      retry:false,
18
+      cacheTime: 0,
16
     },
19
     },
17
   },
20
   },
18
 })
21
 })

+ 1 - 1
src/Components/Dashboard.js

114
     const { exp } = jwt_decode(token);
114
     const { exp } = jwt_decode(token);
115
     let timestamp = exp * 1000;
115
     let timestamp = exp * 1000;
116
     let exp_in = timestamp - Date.now();
116
     let exp_in = timestamp - Date.now();
117
-    console.log("EXP IN : ", exp_in)
117
+    // console.log("EXP IN : ", exp_in)
118
     if(exp_in <= 0 ){
118
     if(exp_in <= 0 ){
119
       alert("TOKEN EXPIRADO, PORFAVOR INICIA SESSION")
119
       alert("TOKEN EXPIRADO, PORFAVOR INICIA SESSION")
120
       dispatch(removeToken())
120
       dispatch(removeToken())

+ 13 - 0
src/Components/Generics/loading.jsx

43
   )
43
   )
44
 }
44
 }
45
 
45
 
46
+export function Centred() {
47
+  return (
48
+    <div className="loadingBase" data-title=".dot-pulse">
49
+      <div className="lodingSpinner">
50
+        <div className={types[0]}></div>
51
+      </div>
52
+    </div>
53
+
54
+  )
55
+}
56
+
57
+
58
+

+ 0 - 1
src/Components/Modal/AgregarManual.js

160
 
160
 
161
   const AutoCompleteChange = (event, newValue) => {
161
   const AutoCompleteChange = (event, newValue) => {
162
     console.log('newValue', newValue)
162
     console.log('newValue', newValue)
163
-    // TODO : formik logic to validate autocomplete
164
     setValues({ ...values, puestosuperior: newValue?.id })
163
     setValues({ ...values, puestosuperior: newValue?.id })
165
 
164
 
166
     if (typeof newValue === 'string') {
165
     if (typeof newValue === 'string') {

+ 1 - 2
src/Components/Navigation/MenuMovil.jsx

14
 import { removeToken } from '../../Slices/tokenSlice';
14
 import { removeToken } from '../../Slices/tokenSlice';
15
 
15
 
16
 export function MenuMovil(props) {
16
 export function MenuMovil(props) {
17
-
18
   let { anchor, control } = props;
17
   let { anchor, control } = props;
19
   const dispatch = useDispatch();
18
   const dispatch = useDispatch();
20
   const navigate = useNavigate()
19
   const navigate = useNavigate()
38
           }
37
           }
39
         }}>
38
         }}>
40
         <List style={{ paddingTop : 64 }}>
39
         <List style={{ paddingTop : 64 }}>
41
-          <MainListItems AppBarVisible={anchor} setAppBarVisible={() => console.log('cerrar la vision')} />
40
+          <MainListItems AppBarVisible={anchor} control={control}/>
42
         </List>
41
         </List>
43
         <Divider />
42
         <Divider />
44
         <List>
43
         <List>

+ 8 - 11
src/Components/Navigation/listItems.js

21
   let resolved = useResolvedPath(props.route);
21
   let resolved = useResolvedPath(props.route);
22
   let match = useMatch({ path: resolved.pathname, end: false });
22
   let match = useMatch({ path: resolved.pathname, end: false });
23
 
23
 
24
-  let { title, route, icon, open, AppBarVisible, setOpen } = props
24
+  let { title, route, icon, open, AppBarVisible, setOpen, control } = props
25
 
25
 
26
   if (route.startsWith('prueba') && match && open && !AppBarVisible) {
26
   if (route.startsWith('prueba') && match && open && !AppBarVisible) {
27
     setOpen(false);
27
     setOpen(false);
31
     <ListItem
31
     <ListItem
32
       sx={{ color: '#25344f' }}
32
       sx={{ color: '#25344f' }}
33
       selected={match && typeof (match) === "object"}
33
       selected={match && typeof (match) === "object"}
34
-      onClick={() => navigate(route)}
34
+      onClick={() => {
35
+        navigate(route) 
36
+        if(control){
37
+          control(false)
38
+        }
39
+      }}
35
       button >
40
       button >
36
       <ListItemIcon>
41
       <ListItemIcon>
37
         {icon && icon}
42
         {icon && icon}
47
 
52
 
48
 export const MainListItems = (props) => {
53
 export const MainListItems = (props) => {
49
 
54
 
50
-  // const [open, setOpen] = React.useState(false);
51
-
52
-  // const showPruebas = () => {
53
-  //   if (!props.AppBarVisible) {
54
-  //     props.setAppBarVisible(true);
55
-  //   }
56
-  //   setOpen(!open);
57
-  // };
58
 
55
 
59
   return (
56
   return (
60
     <List>
57
     <List>
61
       <ListSubheader inset>MENÚ</ListSubheader>
58
       <ListSubheader inset>MENÚ</ListSubheader>
62
       {
59
       {
63
         MainItems.map(({ icon, title, route }, i) => (
60
         MainItems.map(({ icon, title, route }, i) => (
64
-          <NavItem key={i} icon={icon} title={title} route={route} />
61
+          <NavItem control={props.control} key={i} icon={icon} title={title} route={route} />
65
         ))
62
         ))
66
       }
63
       }
67
 
64
 

+ 30 - 32
src/Pages/Puestos.jsx

26
 import { GridMode } from '../Components/Puestos/GridMode'
26
 import { GridMode } from '../Components/Puestos/GridMode'
27
 import { Add as AddIcon, } from '@mui/icons-material/'
27
 import { Add as AddIcon, } from '@mui/icons-material/'
28
 
28
 
29
-import { Loading } from '../Components/Generics/loading'
30
-import { ErrorMessage } from '../Components/Generics/Error'
29
+import { Centred as Loading } from '../Components/Generics/loading'
31
 import { useSelector } from 'react-redux';
30
 import { useSelector } from 'react-redux';
32
 
31
 
33
 import { useQuery } from 'react-query';
32
 import { useQuery } from 'react-query';
43
     return response;
42
     return response;
44
   }
43
   }
45
 
44
 
46
-  const { isLoading, error, data: result } = useQuery('puestos', getAll);
45
+  const { isLoading, error, data: result } = useQuery('puestos', getAll,{
46
+    retry:false,
47
+    cacheTime: 0,
48
+  });
49
+
50
+
51
+console.log(isLoading,result, error)
52
+
47
   const changePage = useCallback((_, value) => setPage(value), []);
53
   const changePage = useCallback((_, value) => setPage(value), []);
48
   const [alignment, setAlignment] = React.useState('grid');
54
   const [alignment, setAlignment] = React.useState('grid');
49
   const handleChange = useCallback((_event, newAlignment) => setAlignment(newAlignment), [])
55
   const handleChange = useCallback((_event, newAlignment) => setAlignment(newAlignment), [])
91
     }
97
     }
92
   }, [del, show])
98
   }, [del, show])
93
 
99
 
94
-
95
-  if (isLoading) {
96
-    return (
97
-      <Loading />
98
-    )
99
-  }
100
-
101
-  if (error) {
102
-    return (
103
-      <Paper sx={{ mb: 2, padding: 2, height: '100%', minHeight: '95vh' }}>
104
-        <main id="loading_or_content">
105
-          <ErrorMessage />
106
-        </main>
107
-      </Paper>
108
-    )
109
-  }
110
-  const total_items = Divide(filter ? filter : result.data).length
100
+  const total_items = Divide(filter ? filter : ( result ? result.data: []  )).length
111
 
101
 
112
   return (
102
   return (
113
     <div className="content-section">
103
     <div className="content-section">
140
             <div style={{ padding: 7 }}>
130
             <div style={{ padding: 7 }}>
141
               <div className={` main_grid_plazas main_productos ${alignment === 'grid' ? 'activar_vista' : 'desactivar_vista'}`} id="grid_view">
131
               <div className={` main_grid_plazas main_productos ${alignment === 'grid' ? 'activar_vista' : 'desactivar_vista'}`} id="grid_view">
142
                 <Row style={{ minHeight: '57vh' }}>
132
                 <Row style={{ minHeight: '57vh' }}>
143
-                  <GridMode
144
-                    toggle={toggle}
145
-                    showing={alignment}
146
-                    data={filter ? Divide(filter) : Divide(result.data)}
147
-                    index={page - 1}
148
-                  />
133
+                  {isLoading && <Loading />}
134
+                  { !error ?
135
+                    <GridMode
136
+                      toggle={toggle}
137
+                      showing={alignment}
138
+                      data={filter ? Divide(filter) : Divide(result ? result.data  : [])}
139
+                      index={page - 1}
140
+                    /> : undefined
141
+                  }
142
+                  {!result && !isLoading && <center><h1>No tienes nigun puesto</h1></center>}
149
                 </Row>
143
                 </Row>
150
               </div>
144
               </div>
151
               <div className={`main_list_products ${alignment === 'list' ? 'activar_vista' : 'desactivar_vista'}`} id="list_view_products">
145
               <div className={`main_list_products ${alignment === 'list' ? 'activar_vista' : 'desactivar_vista'}`} id="list_view_products">
152
                 <Row style={{ minHeight: '57vh' }}>
146
                 <Row style={{ minHeight: '57vh' }}>
153
-                  <ListMode
154
-                    toggle={toggle}
155
-                    showing={alignment}
156
-                    data={filter ? Divide(filter) : Divide(result.data)}
157
-                    index={page - 1}
158
-                  />
147
+                  {isLoading && <Loading />}
148
+                  { !error ?
149
+                    <ListMode
150
+                      toggle={toggle}
151
+                      showing={alignment}
152
+                      data={filter ? Divide(filter) : Divide(result ? result.data : [])}
153
+                      index={page - 1}
154
+                    /> : undefined
155
+                  }
156
+                  {!result && !isLoading && <center><h1>No tienes nigun puesto</h1></center>}
159
                 </Row>
157
                 </Row>
160
               </div>
158
               </div>
161
 
159
 

+ 4 - 4
src/Slices/tokenSlice.js

9
       let { payload } = action
9
       let { payload } = action
10
       if (payload.candi) {
10
       if (payload.candi) {
11
         state.candi = action.payload
11
         state.candi = action.payload
12
-      }else{
12
+      } else {
13
         state.token = action.payload;
13
         state.token = action.payload;
14
       }
14
       }
15
     },
15
     },
16
-    removeToken: (state,action) => {
17
-      let {payload}=action
18
-      if(payload?.candi){
16
+    removeToken: (state, action) => {
17
+      let { payload } = action
18
+      if (payload?.candi) {
19
         state.candi = null
19
         state.candi = null
20
       }
20
       }
21
       state.token = null;
21
       state.token = null;