Browse Source

fix bug on edit plz

amenpunk 2 years ago
parent
commit
201d05d363
2 changed files with 119 additions and 103 deletions
  1. 24 20
      src/Components/Modal/AgregarManual.js
  2. 95 83
      src/Components/Modal/EditPlaza.js

+ 24 - 20
src/Components/Modal/AgregarManual.js

@@ -95,10 +95,13 @@ function Manual(props) {
95 95
   });
96 96
 
97 97
   let setDialogValue = (value) => {
98
-    if (value?.id !== undefined && isNaN(value?.id) === false) {
99
-      setValues({ ...values, puestosuperior: value?.id })
100
-    }
98
+    // console.log('setDialogValue',value)
99
+    // if (value?.id !== undefined && isNaN(value?.id) === false) {
100
+    //   console.log('first if')
101
+    setValues({ ...values, puestosuperior: value?.id })
102
+    // }
101 103
     setDialogValueHook(value)
104
+    // console.log(values)
102 105
   }
103 106
 
104 107
   const loading = openSugg && options.length === 0;
@@ -123,8 +126,6 @@ function Manual(props) {
123 126
 
124 127
   }, [loading, dialogValue, auth]);
125 128
 
126
-
127
-
128 129
   const handleClose = () => false
129 130
 
130 131
   const changeDepartamento = (event) => {
@@ -152,8 +153,8 @@ function Manual(props) {
152 153
   };
153 154
 
154 155
   const AutoCompleteChange = (event, newValue) => {
156
+    // FIX: este set es el que realmente agrega al estado
155 157
     setValues({ ...values, puestosuperior: newValue?.id })
156
-
157 158
     if (typeof newValue === 'string') {
158 159
       setTimeout(() => {
159 160
         toggleOpenDialog(true);
@@ -264,6 +265,7 @@ function Manual(props) {
264 265
               </DialogContentText>
265 266
 
266 267
               <TextField
268
+                fullWidth
267 269
                 autoFocus
268 270
                 margin="dense"
269 271
                 id="name"
@@ -279,20 +281,22 @@ function Manual(props) {
279 281
                 variant="standard"
280 282
               />
281 283
 
282
-              <TextField
283
-                margin="dense"
284
-                id="name"
285
-                value={dialogValue?.id}
286
-                onChange={(event) =>
287
-                  setDialogValue({
288
-                    ...dialogValue,
289
-                    id: event.target.value,
284
+              {/*
285
+                <TextField
286
+                  margin="dense"
287
+                  id="name"
288
+                  value={dialogValue?.id}
289
+                  onChange={(event) =>
290
+                      setDialogValue({
291
+                        ...dialogValue,
292
+                        id: event.target.value,
290 293
                   })
291
-                }
292
-                label="Descripción"
293
-                type="text"
294
-                variant="standard"
294
+                  }
295
+                  label="Descripción"
296
+                  type="text"
297
+                  variant="standard"
295 298
               />
299
+              */}
296 300
             </DialogContent>
297 301
             <DialogActions>
298 302
               <Button onClick={handleCloseDialog}>Cancelar</Button>
@@ -366,7 +370,7 @@ function Manual(props) {
366 370
                         if (params.inputValue !== '') {
367 371
                           filtered.push({
368 372
                             inputValue: params.inputValue,
369
-                            title: `Add "${params.inputValue}"`,
373
+                            title: `Agregar "${params.inputValue}"`,
370 374
                           });
371 375
                         }
372 376
 
@@ -387,7 +391,7 @@ function Manual(props) {
387 391
                       selectOnFocus
388 392
                       clearOnBlur
389 393
                       handleHomeEndKeys
390
-                      renderOption={(props, option) => <li {...props}>{option.title}</li>}
394
+                      renderOption={(props, option) => <li key={option.id} {...props}>{option.title}</li>}
391 395
                       freeSolo
392 396
                       renderInput={(params) => (
393 397
                         <TextField

+ 95 - 83
src/Components/Modal/EditPlaza.js

@@ -27,7 +27,7 @@ import Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete';
27 27
 const filter = createFilterOptions();
28 28
 
29 29
 async function getPuestoSuperior(puesto, auth) {
30
-  console.log('P:', puesto)
30
+  // console.log('P:', puesto)
31 31
   if (puesto.length < 2) return []
32 32
   let rest = new Service(`/plaza/keypuestosup?keyword=${puesto}`)
33 33
   let result = await rest.get(auth.token)
@@ -72,7 +72,7 @@ const plazeSchema = Yup.object({
72 72
 
73 73
 function Edit(props) {
74 74
 
75
-  const { setValue, getValues, reset, control, register, handleSubmit, formState: { errors } } = useForm({
75
+  const {setValue, getValues, reset, control, register, handleSubmit, formState: { errors } } = useForm({
76 76
     resolver: yupResolver(plazeSchema),
77 77
     defaultValues: {
78 78
       id: 0,
@@ -150,25 +150,38 @@ function Edit(props) {
150 150
     console.log('value receivied', value)
151 151
     let id = value?.id || 0;
152 152
     if (id !== 0) {
153
-      setValue('puestosuperior', id)
154
-      let temp = getValues();
153
+      console.log('setting value', id)
154
+      // let temp = getValues();
155 155
       // temp['puestosuperior'] = id
156 156
       // temp['puestosuperior_id'] = id
157
-      console.log("TEMP", temp)
158
-      reset({ ...temp, puestosuperior: id })
157
+      // reset({ ...temp, puestosuperior: id })
158
+      // setDialogValueHook(value)
159
+      // reset({ ...temp, puestosuperior_id: id,puestosuperior:value.title })
160
+      // reset()
161
+      setValue('puestosuperior', parseInt( id ))
162
+      // setFocus("notas", { shouldSelect: true })
163
+      // // resetField('puestosuperior',{keepError:false})
164
+      //
165
+
159 166
       // setDialogValueHook(value)
160 167
     }
161
-    console.log('SETTING:', value)
168
+    // console.log('SETTING:', value)
162 169
     setDialogValueHook(value)
163
-  }, [setValue, reset, getValues])
170
+    console.log("final", getValues())
171
+
172
+  }, [setValue, getValues])
164 173
 
165 174
   const loading = openSugg && options.length === 0;
166 175
 
167 176
   const AutoCompleteChange = (event, newValue) => {
168
-    console.log('newValue', newValue)
177
+    let temp = getValues();
178
+    console.log('newValue', temp, newValue)
179
+    temp['puestosuperior'] = newValue?.id;
180
+    // reset(temp)
181
+    // setDialogValue(newValue);
182
+    // return;
169 183
     //this should be change
170
-    // setValue('puestosuperior', newValue?.id)
171
-
184
+    setValue('puestosuperior', newValue?.id)
172 185
     if (typeof newValue === 'string') {
173 186
       console.log('if1')
174 187
       setTimeout(() => {
@@ -251,6 +264,7 @@ function Edit(props) {
251 264
             tests: temp_test,
252 265
             puestosuperior: puestosuperior.id
253 266
           })
267
+          // console.log("INITIAL:", getValues())
254 268
         })
255 269
         .catch(e => console.log(e))
256 270
 
@@ -383,89 +397,87 @@ function Edit(props) {
383 397
                   {...register("nombrepuesto")} />
384 398
 
385 399
 
386
-                {/*
387
-                  <FormControl fullWidth>
400
+                <FormControl fullWidth>
388 401
                   <Controller
389 402
                     helperText={errors.puestosuperior?.message}
390 403
                     error={errors?.puestosuperior}
391 404
                     name="puestosuperior"
392 405
                     control={control}
393
-                  render={({ field }) =>
394
-                    <Autocomplete
395
-                      fullWidth
396
-                      value={dialogValue}
397
-                      onChange={AutoCompleteChange}
398
-                      open={openSugg}
399
-                    onOpen={() => {
400
-                      setOpenSugg(true);
401
-                      }}
402
-                    onClose={() => {
403
-                      setOpenSugg(false);
404
-                      }}
405
-                      isOptionEqualToValue={(option, value) => option.title === value.title}
406
-                    filterOptions={(options, params) => {
407
-                      const filtered = filter(options, params);
408
-
409
-                      if (params.inputValue !== '') {
410
-                        filtered.push({
411
-                          inputValue: params.inputValue,
412
-                          title: `Agregar "${params.inputValue}"`,
413
-                        });
414
-                      }
415
-
416
-                      return filtered;
417
-                      }}
418
-                      id="puesto_superior_autocomplete"
419
-                      options={options}
420
-                      loading={loading}
421
-                    getOptionLabel={(option) => {
422
-                      if (typeof option === 'string') {
423
-                        return option;
424
-                      }
425
-                      if (option.inputValue) {
426
-                        return option.inputValue;
427
-                      }
428
-                      return option.title;
429
-                      }}
430
-                      selectOnFocus
431
-                      clearOnBlur
432
-                      handleHomeEndKeys
433
-                      renderOption={(props, option) => <li key={option.id} {...props}>{option.title}</li>}
434
-                      freeSolo
435
-                    renderInput={(params) => (
436
-                      <TextField
437
-                        {...params}
438
-                        {...register('puestosuperior')}
439
-                        error={Boolean(errors.puestosuperior)}
440
-                        label="Puesto Superior"
441
-                      InputProps={{
442
-                        ...params.InputProps,
443
-                          onChange: (event) => {
444
-                            // let title = event.target.value;
445
-                            // console.log('titulo',title)
446
-                            setOptions([]);
447
-                            setDialogValue({
448
-                              title: event.target.value,
449
-                              id: '',
406
+                    render={({ field }) =>
407
+                      <Autocomplete
408
+                        fullWidth
409
+                        value={dialogValue}
410
+                        onChange={AutoCompleteChange}
411
+                        open={openSugg}
412
+                        onOpen={() => {
413
+                          setOpenSugg(true);
414
+                        }}
415
+                        onClose={() => {
416
+                          setOpenSugg(false);
417
+                        }}
418
+                        isOptionEqualToValue={(option, value) => option.title === value.title}
419
+                        filterOptions={(options, params) => {
420
+                          const filtered = filter(options, params);
421
+
422
+                          if (params.inputValue !== '') {
423
+                            filtered.push({
424
+                              inputValue: params.inputValue,
425
+                              title: `Agregar "${params.inputValue}"`,
450 426
                             });
451
-                          },
452
-                          endAdornment: (
453
-                        <React.Fragment>
454
-                        {loading ? <CircularProgress color="inherit" size={20} /> : null}
455
-                        {params.InputProps.endAdornment}
456
-                            </React.Fragment>
457
-                          ),
427
+                          }
428
+
429
+                          return filtered;
458 430
                         }}
459
-                      />
460
-                      )}
431
+                        id="puesto_superior_autocomplete"
432
+                        options={options}
433
+                        loading={loading}
434
+                        getOptionLabel={(option) => {
435
+                          if (typeof option === 'string') {
436
+                            return option;
437
+                          }
438
+                          if (option.inputValue) {
439
+                            return option.inputValue;
440
+                          }
441
+                          return option.title;
442
+                        }}
443
+                        selectOnFocus
444
+                        clearOnBlur
445
+                        handleHomeEndKeys
446
+                        renderOption={(props, option) => <li key={option.id} {...props}>{option.title}</li>}
447
+                        freeSolo
448
+                        renderInput={(params) => (
449
+                          <TextField
450
+                            {...params}
451
+                            {...register('puestosuperior')}
452
+                            error={Boolean(errors.puestosuperior)}
453
+                            label="Puesto Superior"
454
+                            InputProps={{
455
+                              ...params.InputProps,
456
+                              onChange: (event) => {
457
+                                let title = event.target.value;
458
+                                console.log('titulo',title)
459
+                                setOptions([]);
460
+                                setDialogValue({
461
+                                  title: event.target.value,
462
+                                  id: '',
463
+                                });
464
+                              },
465
+                              endAdornment: (
466
+                                <React.Fragment>
467
+                                  {loading ? <CircularProgress color="inherit" size={20} /> : null}
468
+                                  {params.InputProps.endAdornment}
469
+                                </React.Fragment>
470
+                              ),
471
+                            }}
472
+                          />
473
+                        )}
461 474
 
462 475
                       />
463 476
 
464 477
                     }
465
-                    >
466
-                        </Controller>
467
-                    </FormControl>
468
-                    */}
478
+                  >
479
+                  </Controller>
480
+                </FormControl>
469 481
 
470 482
               </Stack>
471 483