TIMOR-TELECOM/revenue-fe
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

add loading when post/put data on master data module

Browse Source
This commit is contained in:
Wikzyy
2025-04-23 13:35:32 +07:00
parent e248c463c9
commit 94ffc332e9
26 changed files with 838 additions and 454 deletions
Download Patch File Download Diff File Expand all files Collapse all files

47
src/pages/master/profession/blocks/AddDialog.tsx
View File

@ -16,6 +16,7 @@ import {
import { Input } from '@/components/ui/input';
import { Button } from '@/components/ui/button';
import { doSaveLogActivity } from '@/actions/GlobalActions';
import { RefreshCw } from 'lucide-react';
const API_URL = apiConfig.service_master_data;
const AddDialog = () => {
@ -35,6 +36,7 @@ const AddDialog = () => {
created_at: ''
};
const [formField, setFormField] = useState(initialState);
const [isSubmitting, setIsSubmitting] = useState(false);
const created_time = new Date();
const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' ');
@ -46,25 +48,32 @@ const AddDialog = () => {
const doCreateProfession = useCallback(
async (e: React.FormEvent<HTMLFormElement>) => {
e.preventDefault();
setIsSubmitting(true);
const response = await PostData(`${API_URL}/profession/create`, formField);
try {
const response = await PostData(`${API_URL}/profession/create`, formField);
if (response?.status) {
resetForm();
handleAddDialog(false);
toast.success('Success Create Profession');
reload();
if (response?.status) {
resetForm();
handleAddDialog(false);
toast.success('Success Create Profession');
reload();
const createActivity = {
module: 'Manage Profession',
description: `Create Profession => ${formField.name}`,
action: 'C'
};
const createActivity = {
module: 'Manage Profession',
description: `Create Profession => ${formField.name}`,
action: 'C'
};
doSaveLogActivity(createActivity);
} else {
toast.error('Failed Create Profession');
setAlert({ show: true, message: response?.message });
doSaveLogActivity(createActivity);
} else {
toast.error('Failed Create Profession');
setAlert({ show: true, message: response?.message });
}
} catch (error) {
toast.error('Something went wrong, please try again.');
} finally {
setIsSubmitting(false);
}
},
[formField]
@ -134,7 +143,13 @@ const AddDialog = () => {
<Button type="button" variant="outline" onClick={resetForm}>
Reset
</Button>
<Button variant="default">Create</Button>
<Button variant="default" type="submit" disabled={isSubmitting}>
{isSubmitting ? (
<RefreshCw className="animate-spin h-8 w-8 text-white mx-3" />
) : (
'Create'
)}
</Button>
</div>
</div>
</form>

53
src/pages/master/profession/blocks/EditDialog.tsx
View File

@ -16,6 +16,7 @@ import {
import { Input } from '@/components/ui/input';
import { Button } from '@/components/ui/button';
import { doSaveLogActivity } from '@/actions/GlobalActions';
import { RefreshCw } from 'lucide-react';
const API_URL = apiConfig.service_master_data;
const EditDialog = () => {
@ -24,6 +25,7 @@ const EditDialog = () => {
const { PutData, GetData } = useCallApi();
const parsedUser = getAuth()?.user;
const [isLoading, setIsLoading] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
const created_time = new Date();
const formattedTime = created_time.toISOString().slice(0, 19).replace('T', ' ');
const [alert, setAlert] = useState({
@ -45,28 +47,35 @@ const EditDialog = () => {
const doUpdateProfession = useCallback(
async (e: React.FormEvent<HTMLFormElement>) => {
e.preventDefault();
setIsSubmitting(true);
const response = await PutData(
`${API_URL}/profession/update/${selectedProfession}`,
formField
);
try {
const response = await PutData(
`${API_URL}/profession/update/${selectedProfession}`,
formField
);
if (response?.status) {
resetForm();
handleEditDialog(false, null);
toast.success('Success Update Profession');
reload();
if (response?.status) {
resetForm();
handleEditDialog(false, null);
toast.success('Success Update Profession');
reload();
const createActivity = {
module: 'Manage Profession',
description: `Edit Profession => ${selectedProfession}`,
action: 'U'
};
const createActivity = {
module: 'Manage Profession',
description: `Edit Profession => ${selectedProfession}`,
action: 'U'
};
doSaveLogActivity(createActivity);
} else {
toast.error('Failed Update Profession');
setAlert({ show: true, message: 'Failed Update Profession' });
doSaveLogActivity(createActivity);
} else {
toast.error('Failed Update Profession');
setAlert({ show: true, message: response?.message });
}
} catch (error) {
toast.error('Something went wrong, please try again.');
} finally {
setIsSubmitting(false);
}
},
[selectedProfession, formField]
@ -170,7 +179,13 @@ const EditDialog = () => {
</div>
<div className="flex justify-end">
<Button className="btn btn-primary">Save Changes</Button>
<Button variant="default" type="submit" disabled={isSubmitting}>
{isSubmitting ? (
<RefreshCw className="animate-spin h-8 w-8 text-white mx-7" />
) : (
'Save Changes'
)}
</Button>
</div>
</div>
</form>