iniciar proceso de editar guarda

This commit is contained in:
Eduardo Quiros 2022-08-22 04:00:25 -06:00
parent 04da74a2c4
commit cad12bd638
No known key found for this signature in database
GPG Key ID: B77F36C3F12720B4
1 changed files with 46 additions and 13 deletions

View File

@ -27,6 +27,7 @@ const GuardasSeguridad = () => {
user_type: '1', user_type: '1',
status: '1', status: '1',
status_text: '', status_text: '',
community_id: '',
}; };
@ -37,6 +38,7 @@ const GuardasSeguridad = () => {
const [globalFilter, setGlobalFilter] = useState(null); const [globalFilter, setGlobalFilter] = useState(null);
const [deleteGuardaDialog, setDeleteGuardaDialog] = useState(false); const [deleteGuardaDialog, setDeleteGuardaDialog] = useState(false);
const [deleteGuardasDialog, setDeleteGuardasDialog] = useState(false); const [deleteGuardasDialog, setDeleteGuardasDialog] = useState(false);
const [saveButtonTitle, setSaveButtonTitle] = useState("Registrar");
const toast = useRef(null); const toast = useRef(null);
const dt = useRef(null); const dt = useRef(null);
@ -90,7 +92,7 @@ const GuardasSeguridad = () => {
} }
}) })
.then( .then(
function (response) { function(response) {
if (response.status != 201) if (response.status != 201)
console.log('Ocurrió un error con el servicio: ' + response.status); console.log('Ocurrió un error con el servicio: ' + response.status);
else else
@ -98,7 +100,7 @@ const GuardasSeguridad = () => {
} }
) )
.then( .then(
function (response) { function(response) {
listaGuardasF(); listaGuardasF();
} }
) )
@ -129,7 +131,7 @@ const GuardasSeguridad = () => {
} }
}) })
.then( .then(
function (response) { function(response) {
if (response.status != 201) if (response.status != 201)
console.log('Ocurrió un error con el servicio: ' + response.status); console.log('Ocurrió un error con el servicio: ' + response.status);
else else
@ -137,7 +139,7 @@ const GuardasSeguridad = () => {
} }
) )
.then( .then(
function (response) { function(response) {
setChangeStatusGuardDialog(false); setChangeStatusGuardDialog(false);
toast.current.show({ toast.current.show({
severity: 'success', severity: 'success',
@ -163,7 +165,7 @@ const GuardasSeguridad = () => {
} }
}) })
.then( .then(
function (response) { function(response) {
if (response.status != 201) if (response.status != 201)
console.log('Ocurrió un error con el servicio: ' + response.status); console.log('Ocurrió un error con el servicio: ' + response.status);
else else
@ -171,7 +173,7 @@ const GuardasSeguridad = () => {
} }
) )
.then( .then(
function (response) { function(response) {
let _guarda = listaGuardas.filter(val => val._id !== guarda._id); let _guarda = listaGuardas.filter(val => val._id !== guarda._id);
setListaGuardas(_guarda); setListaGuardas(_guarda);
setDeleteGuardaDialog(false); setDeleteGuardaDialog(false);
@ -240,6 +242,16 @@ const GuardasSeguridad = () => {
setGuardDialog(true); setGuardDialog(true);
}; };
const editGuard = (guard) => {
setGuarda(guard);
console.log(guard);
setSaveButtonTitle("Actualizar");
}
const cancelEdit = () => {
setGuarda(emptyGuarda);
setSaveButtonTitle("Registrar");
}
const actionsGuard = (rowData) => { const actionsGuard = (rowData) => {
let icono = ''; let icono = '';
@ -254,6 +266,12 @@ const GuardasSeguridad = () => {
} }
return ( return (
<div className="actions"> <div className="actions">
<Button
icon="pi pi-pencil"
className="p-button-rounded p-button-success mt-2 mx-2"
onClick={() => editGuard(rowData)}
title="Editar"
/>
<Button <Button
icon="pi pi-exclamation-circle" icon="pi pi-exclamation-circle"
className="p-button-rounded p-button-info mt-2 mx-2" className="p-button-rounded p-button-info mt-2 mx-2"
@ -485,7 +503,7 @@ const GuardasSeguridad = () => {
</div> </div>
</div> </div>
<div className='row my-5 justify-content-center'> <div className='row my-5 justify-content-center'>
</div> </div>
@ -554,25 +572,40 @@ const GuardasSeguridad = () => {
<div className="p-fluid formgrid grid"> <div className="p-fluid formgrid grid">
<div className="field col-12 md:col-6"> <div className="field col-12 md:col-6">
<label htmlFor="nombre">Nombre</label> <label htmlFor="nombre">Nombre</label>
<InputText id="nombre" type="text" /> <InputText id="nombre" value={guarda.name} type="text" />
</div> </div>
<div className="field col-12 md:col-6"> <div className="field col-12 md:col-6">
<label htmlFor="apellidos">Apellido(s)</label> <label htmlFor="apellidos">Apellido(s)</label>
<InputText id="apellidos" type="text" /> <InputText id="apellidos" value={guarda.last_name} type="text" />
</div> </div>
<div className="field col-12 md:col-6"> <div className="field col-12 md:col-6">
<label htmlFor="correo_electronico">Correo electrónico</label> <label htmlFor="correo_electronico">Correo electrónico</label>
<InputText id="correo_electronico" type="email" /> <InputText id="correo_electronico" value={guarda.email} type="email" />
</div> </div>
<div className="field col-12 md:col-6"> <div className="field col-12 md:col-6">
<label htmlFor="identificacion">Identificación</label> <label htmlFor="identificacion">Identificación</label>
<InputText id="identificacion" type="text" /> <InputText id="identificacion" value={guarda.dni} type="text" />
</div> </div>
<div className="field col-12"> <div className="field col-12">
<label htmlFor="telefono">Teléfono</label> <label htmlFor="telefono">Teléfono</label>
<InputText id="telefono" type="tel" rows="4" /> <InputText id="telefono" value={guarda.phone} type="tel" rows="4" />
</div>
<div style={{
display: "flex",
justifyContent: "center",
gap: "10px",
width: "100%"
}}>
<Button
label={`${saveButtonTitle}`}
onClick={registrarGuarda}
/>
{saveButtonTitle === 'Actualizar' && (
<Button
label="Cancel"
onClick={cancelEdit}
className="p-button-danger" />)}
</div> </div>
<Button label="Registrar" onClick={registrarGuarda}></Button>
</div> </div>
</div> </div>
</div> </div>