edit puesto superior

src/Components/Modal/EditPlaza.js

@@ -27,7 +27,7 @@ import Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete';
 const filter = createFilterOptions();
 
 async function getPuestoSuperior(puesto, auth) {
-console.log('P:',puesto)
+  console.log('P:', puesto)
   if (puesto.length < 2) return []
   let rest = new Service(`/plaza/keypuestosup?keyword=${puesto}`)
   let result = await rest.get(auth.token)
@@ -129,7 +129,7 @@ function Edit(props) {
   };
 
   const handleSubmitDialog = async (event) => {
-  console.log('handlesubmit',dialogValue)
+    console.log('handlesubmit', dialogValue)
     event.preventDefault();
     let { id, nombre } = await savePuestoSuperior(dialogValue, auth)
     if (id) {
@@ -138,8 +138,9 @@ function Edit(props) {
         id: id,
       }
       if (to_set.id) {
+        console.log("TO SET", to_set)
         setDialogValue(to_set);
-        reset({ ...getValues(),puestosuperior: to_set.id })
+        // reset({ ...getValues(),puestosuperior: to_set.id })
       }
     }
     handleCloseDialog();
@@ -149,39 +150,27 @@ function Edit(props) {
     console.log('value receivied', value)
     let id = value?.id || 0;
     if (id !== 0) {
-      reset({ ...getValues(),puestosuperior: id })
-      setValue('puestosuperior',id)
-      setDialogValueHook(value)
+      setValue('puestosuperior', id)
+      let temp = getValues();
+      // temp['puestosuperior'] = id
+      // temp['puestosuperior_id'] = id
+      console.log("TEMP", temp)
+      reset({ ...temp, puestosuperior: id })
+      // setDialogValueHook(value)
     }
+    console.log('SETTING:', value)
     setDialogValueHook(value)
-  },[setValue,reset,getValues])
-
-
-
-  // let setDialogValue = useCallback((value) => {
-  // console.log('value receivied', value)
-  //   let id = value.id || 0;
-  //   if (id !== 0) {
-  //     console.log('setiando valor', value)
-  //     setValue({ puestosuperior: value?.id })
-  //      // setDialogValueHook(value)
-  //   }
-  //   console.log("setiando valor false", value)
-  //   // setDialogValueHook(value)
-  // }, [setValue])
-
-
-
+  }, [setValue, reset, getValues])
 
   const loading = openSugg && options.length === 0;
 
   const AutoCompleteChange = (event, newValue) => {
     console.log('newValue', newValue)
     //this should be change
-    setValue('puestosuperior', newValue?.id)
+    // setValue('puestosuperior', newValue?.id)
 
     if (typeof newValue === 'string') {
-    console.log('if1')
+      console.log('if1')
       setTimeout(() => {
         toggleOpenDialog(true);
         setDialogValue({
@@ -190,14 +179,14 @@ function Edit(props) {
         });
       });
     } else if (newValue && newValue.inputValue) {
-    console.log('if2')
+      console.log('if2')
       toggleOpenDialog(true);
       setDialogValue({
         title: newValue.inputValue,
         id: '',
       });
     } else {
-    console.log('if3')
+      console.log('if3')
       setDialogValue(newValue);
     }
   }
@@ -239,13 +228,10 @@ function Edit(props) {
   useEffect(() => {
 
     let current_id = getValues('id')
-    // console.log({ current_id, visible })
 
     if (visible == null) return;
 
     if (current_id !== visible) {
-    console.log('change with use effect')
-
       let rest = new Service(`/plaza/getthis/${visible}`)
       rest
         .getQuery(auth.token)
@@ -284,46 +270,9 @@ function Edit(props) {
 
     return () => {
       active = false;
-      // reset()
     };
 
-
-
   }, [visible, auth, reset, loading, dialogValue, getValues, setDialogValue])
-  // console.log('PROPS', props)
-
-
-  // if (props.visible !== getValues('id') ) {
-  //
-  //   let rest = new Service(`/plaza/getthis/${visible}`)
-  //   rest
-  //     .getQuery(auth.token)
-  //     .then(response => {
-  //
-  //       console.log('initial  value', dialogValue)
-  //       let { areadeptoplz_id, fecha, tests, puestosuperior } = response.data;
-  //       let temp_test = tests.map(t => ({ id: t.id }))
-  //       setChecklist(temp_test.map(t => t.id))
-  //       console.log('puesto sup', puestosuperior)
-  //       reset({
-  //         ...response.data,
-  //         aredepto: areadeptoplz_id,
-  //         fecha: new Date(fecha),
-  //         tests: temp_test,
-  //         puestosuperior: puestosuperior.id
-  //       })
-  //       let temp = { title: puestosuperior.nombre, id: puestosuperior.id }
-  //       console.log(temp)
-  //       if (dialogValue?.id !== temp.id) {
-  //         setDialogValueHook(temp)
-  //       }
-  //
-  //     })
-  //     .catch(e => console.log(e))
-  // }else {
-  //   console.log("no es visible y el puesto superior no es 0",{ visible,"p": getValues('puestosuperior')})
-  // }
-
 
   const changeTab = (_event, newValue) => setTab(newValue);
 
@@ -354,12 +303,14 @@ function Edit(props) {
                 margin="dense"
                 id="name"
                 value={dialogValue?.title}
-                onChange={(event) =>
+                onChange={(event) => {
+                  console.log('aa', event.target.value)
                   setDialogValue({
                     ...dialogValue,
                     title: event.target.value,
                   })
                 }
+                }
                 label="Puesto"
                 type="text"
                 variant="standard"
@@ -369,12 +320,14 @@ function Edit(props) {
                 margin="dense"
                 id="name"
                 value={dialogValue?.id}
-                onChange={(event) =>
+                onChange={(event) => {
+                  console.log('ev', event.target.value)
                   setDialogValue({
                     ...dialogValue,
                     id: event.target.value,
                   })
                 }
+                }
                 label="Descripción"
                 type="text"
                 variant="standard"
@@ -430,87 +383,89 @@ function Edit(props) {
                   {...register("nombrepuesto")} />
 
 
-                <FormControl fullWidth>
+                {/*
+                  <FormControl fullWidth>
                   <Controller
                     helperText={errors.puestosuperior?.message}
                     error={errors?.puestosuperior}
                     name="puestosuperior"
                     control={control}
-                    render={({ field }) =>
-                      <Autocomplete
-                        fullWidth
-                        value={dialogValue}
-                        onChange={AutoCompleteChange}
-                        open={openSugg}
-                        onOpen={() => {
-                          setOpenSugg(true);
-                        }}
-                        onClose={() => {
-                          setOpenSugg(false);
-                        }}
-                        isOptionEqualToValue={(option, value) => option.title === value.title}
-                        filterOptions={(options, params) => {
-                          const filtered = filter(options, params);
-
-                          if (params.inputValue !== '') {
-                            filtered.push({
-                              inputValue: params.inputValue,
-                              title: `Add "${params.inputValue}"`,
+                  render={({ field }) =>
+                    <Autocomplete
+                      fullWidth
+                      value={dialogValue}
+                      onChange={AutoCompleteChange}
+                      open={openSugg}
+                    onOpen={() => {
+                      setOpenSugg(true);
+                      }}
+                    onClose={() => {
+                      setOpenSugg(false);
+                      }}
+                      isOptionEqualToValue={(option, value) => option.title === value.title}
+                    filterOptions={(options, params) => {
+                      const filtered = filter(options, params);
+
+                      if (params.inputValue !== '') {
+                        filtered.push({
+                          inputValue: params.inputValue,
+                          title: `Agregar "${params.inputValue}"`,
+                        });
+                      }
+
+                      return filtered;
+                      }}
+                      id="puesto_superior_autocomplete"
+                      options={options}
+                      loading={loading}
+                    getOptionLabel={(option) => {
+                      if (typeof option === 'string') {
+                        return option;
+                      }
+                      if (option.inputValue) {
+                        return option.inputValue;
+                      }
+                      return option.title;
+                      }}
+                      selectOnFocus
+                      clearOnBlur
+                      handleHomeEndKeys
+                      renderOption={(props, option) => <li key={option.id} {...props}>{option.title}</li>}
+                      freeSolo
+                    renderInput={(params) => (
+                      <TextField
+                        {...params}
+                        {...register('puestosuperior')}
+                        error={Boolean(errors.puestosuperior)}
+                        label="Puesto Superior"
+                      InputProps={{
+                        ...params.InputProps,
+                          onChange: (event) => {
+                            // let title = event.target.value;
+                            // console.log('titulo',title)
+                            setOptions([]);
+                            setDialogValue({
+                              title: event.target.value,
+                              id: '',
                             });
-                          }
-
-                          return filtered;
+                          },
+                          endAdornment: (
+                        <React.Fragment>
+                        {loading ? <CircularProgress color="inherit" size={20} /> : null}
+                        {params.InputProps.endAdornment}
+                            </React.Fragment>
+                          ),
                         }}
-                        id="puesto_superior_autocomplete"
-                        options={options}
-                        loading={loading}
-                        getOptionLabel={(option) => {
-                          if (typeof option === 'string') {
-                            return option;
-                          }
-                          if (option.inputValue) {
-                            return option.inputValue;
-                          }
-                          return option.title;
-                        }}
-                        selectOnFocus
-                        clearOnBlur
-                        handleHomeEndKeys
-                        renderOption={(props, option) => <li {...props}>{option.title}</li>}
-                        freeSolo
-                        renderInput={(params) => (
-                          <TextField
-                            {...params}
-                            {...register('puestosuperior')}
-                            error={Boolean(errors.puestosuperior)}
-                            label="Puesto Superior"
-                            InputProps={{
-                              ...params.InputProps,
-                              onChange: (event) => {
-                                // let title = event.target.value;
-                                // console.log('titulo',title)
-                                setOptions([]);
-                                setDialogValue({
-                                  title: event.target.value,
-                                  id: '',
-                                });
-                              },
-                              endAdornment: (
-                                <React.Fragment>
-                                  {loading ? <CircularProgress color="inherit" size={20} /> : null}
-                                  {params.InputProps.endAdornment}
-                                </React.Fragment>
-                              ),
-                            }}
-                          />
-                        )}
+                      />
+                      )}
 
                       />
 
                     }
-                  >
-                  </Controller>
-                </FormControl>
+                    >
+                        </Controller>
+                    </FormControl>
+                    */}
 
               </Stack>