Loading web/src/components/sa_panel_town/sa_panel_town_list/sa_panel_town_list.tsx +70 −72 Original line number Diff line number Diff line Loading @@ -17,7 +17,11 @@ interface props { statesList: State[]; } export const SuperadminPanelTownList = ({windowActive, setWindowActive, statesList}: props) => { export const SuperadminPanelTownList = ({ windowActive, setWindowActive, statesList, }: props) => { const { townsList, getTownsByState, getTownById } = useTown(); const [pending, setPending] = useState(false); const [isLoading, setIsLoading] = useState(false); Loading @@ -26,8 +30,8 @@ export const SuperadminPanelTownList = ({windowActive, setWindowActive, statesLi const [form, setForm] = useState<Town>(townsList[0]); const forceRenderList = () => { setRenderCount(prevCount => prevCount + 1); } setRenderCount((prevCount) => prevCount + 1); }; const setData = async (idTown: number) => { setIsLoading(true); Loading @@ -38,39 +42,26 @@ export const SuperadminPanelTownList = ({windowActive, setWindowActive, statesLi setForm(actualTown); } setIsLoading(false); } }; const columns: TableColumn<Town>[] = [ { name: "Identificador", selector: row => row.idTown, sortable: true selector: (row) => row.idTown, sortable: true, }, { name: "Nombre", selector: row => row.name, sortable: true selector: (row) => row.name, sortable: true, }, { name: "Estado", selector: row => row.state, sortable: true selector: (row) => row.state, sortable: true, }, { name: "Acciones", cell: (row) => { return ( <FontAwesomeIcon style={{cursor: 'pointer'}} icon={faEdit} onClick={ ()=> setData(row.idTown) } /> ); } } ]; const refreshList = (stateId: number, name: string) => { setPending(true); const getTownsList = async () => { Loading @@ -82,7 +73,7 @@ export const SuperadminPanelTownList = ({windowActive, setWindowActive, statesLi showErrorAxios(error); } } } }; getTownsList(); setPending(false); }; Loading @@ -100,24 +91,28 @@ export const SuperadminPanelTownList = ({windowActive, setWindowActive, statesLi refreshList(state.stateId, state.name); }} > {statesList === null || statesList.length===0 ? <option disabled defaultValue="" value="">No hay estados</option> : {statesList === null || statesList.length === 0 ? ( <option disabled defaultValue="" value=""> No hay estados </option> ) : ( <> <option disabled selected value={0}>Selecciona el estado</option> <option disabled selected value={0}> Selecciona el estado </option> {statesList.map((state, index) => { return ( <option key={state.stateId} value={index}>{state.name}</option> <option key={state.stateId} value={index}> {state.name} </option> ); })} </> } )} </select> </div> <div className="town_list_body"> { actualWindowsActive && !isLoading && {actualWindowsActive && !isLoading && ( <SuperadminPanelTownRegister setWindowActive={setWindowActive} setActualWindowActive={setActualWindowActive} Loading @@ -126,15 +121,18 @@ export const SuperadminPanelTownList = ({windowActive, setWindowActive, statesLi isRegister={false} form={form} /> } <DataTable noDataComponent="No hay pueblos que mostrar" progressPending={pending} )} <DataTable noDataComponent="No hay pueblos que mostrar" progressPending={pending} disabled={windowActive} progressComponent={ <LoadingSpinner style={{display: 'flex'}}/> } columns={columns} data={townsList} selectableRows className="data_table" progressComponent={<LoadingSpinner style={{ display: "flex" }} />} columns={columns} data={townsList} selectableRows className="data_table" /> </div> </div> ); } No newline at end of file }; Loading
web/src/components/sa_panel_town/sa_panel_town_list/sa_panel_town_list.tsx +70 −72 Original line number Diff line number Diff line Loading @@ -17,7 +17,11 @@ interface props { statesList: State[]; } export const SuperadminPanelTownList = ({windowActive, setWindowActive, statesList}: props) => { export const SuperadminPanelTownList = ({ windowActive, setWindowActive, statesList, }: props) => { const { townsList, getTownsByState, getTownById } = useTown(); const [pending, setPending] = useState(false); const [isLoading, setIsLoading] = useState(false); Loading @@ -26,8 +30,8 @@ export const SuperadminPanelTownList = ({windowActive, setWindowActive, statesLi const [form, setForm] = useState<Town>(townsList[0]); const forceRenderList = () => { setRenderCount(prevCount => prevCount + 1); } setRenderCount((prevCount) => prevCount + 1); }; const setData = async (idTown: number) => { setIsLoading(true); Loading @@ -38,39 +42,26 @@ export const SuperadminPanelTownList = ({windowActive, setWindowActive, statesLi setForm(actualTown); } setIsLoading(false); } }; const columns: TableColumn<Town>[] = [ { name: "Identificador", selector: row => row.idTown, sortable: true selector: (row) => row.idTown, sortable: true, }, { name: "Nombre", selector: row => row.name, sortable: true selector: (row) => row.name, sortable: true, }, { name: "Estado", selector: row => row.state, sortable: true selector: (row) => row.state, sortable: true, }, { name: "Acciones", cell: (row) => { return ( <FontAwesomeIcon style={{cursor: 'pointer'}} icon={faEdit} onClick={ ()=> setData(row.idTown) } /> ); } } ]; const refreshList = (stateId: number, name: string) => { setPending(true); const getTownsList = async () => { Loading @@ -82,7 +73,7 @@ export const SuperadminPanelTownList = ({windowActive, setWindowActive, statesLi showErrorAxios(error); } } } }; getTownsList(); setPending(false); }; Loading @@ -100,24 +91,28 @@ export const SuperadminPanelTownList = ({windowActive, setWindowActive, statesLi refreshList(state.stateId, state.name); }} > {statesList === null || statesList.length===0 ? <option disabled defaultValue="" value="">No hay estados</option> : {statesList === null || statesList.length === 0 ? ( <option disabled defaultValue="" value=""> No hay estados </option> ) : ( <> <option disabled selected value={0}>Selecciona el estado</option> <option disabled selected value={0}> Selecciona el estado </option> {statesList.map((state, index) => { return ( <option key={state.stateId} value={index}>{state.name}</option> <option key={state.stateId} value={index}> {state.name} </option> ); })} </> } )} </select> </div> <div className="town_list_body"> { actualWindowsActive && !isLoading && {actualWindowsActive && !isLoading && ( <SuperadminPanelTownRegister setWindowActive={setWindowActive} setActualWindowActive={setActualWindowActive} Loading @@ -126,15 +121,18 @@ export const SuperadminPanelTownList = ({windowActive, setWindowActive, statesLi isRegister={false} form={form} /> } <DataTable noDataComponent="No hay pueblos que mostrar" progressPending={pending} )} <DataTable noDataComponent="No hay pueblos que mostrar" progressPending={pending} disabled={windowActive} progressComponent={ <LoadingSpinner style={{display: 'flex'}}/> } columns={columns} data={townsList} selectableRows className="data_table" progressComponent={<LoadingSpinner style={{ display: "flex" }} />} columns={columns} data={townsList} selectableRows className="data_table" /> </div> </div> ); } No newline at end of file };