WrenchBoard/Users-Wrench
3
0
Fork 0
Code Issues Pull Requests Releases Activity

added third

Browse Source
This commit was merged in pull request #549.
This commit is contained in:
Chukwumdiebube Ojinta
2024-01-23 09:33:56 +01:00
parent 926837c656
commit 8139fbb090
15 changed files with 743 additions and 597 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/JobGroups/AddGroup.jsx
+84 -58
View File
@@ -1,69 +1,93 @@
import React, { useState } from 'react'
import React, { useState } from "react";
import ModalCom from '../Helpers/ModalCom'
import LoadingSpinner from '../Spinners/LoadingSpinner'
import InputCom from '../Helpers/Inputs/InputCom/index'
import ModalCom from "../Helpers/ModalCom";
import LoadingSpinner from "../Spinners/LoadingSpinner";
import InputCom from "../Helpers/Inputs/InputCom/index";
import usersService from '../../services/UsersService'
import usersService from "../../services/UsersService";
import { apiConst } from "../../lib/apiConst";
export default function AddGroup({action, situation , setUpdateList}) {
export default function AddGroup({ action, situation, setUpdateList }) {
const api = new usersService();
const api = new usersService()
const [name, setName] = useState("");
const [name, setName] = useState('')
const handleChange = ({ target: { name, value } }) => {
setName(value);
};
const handleChange = ({target:{name, value}}) =>{
setName(value)
}
let [requestStatus, setRequestStatus] = useState({
loading: false,
status: false,
message: "",
}); // STATE FOR KNOWING WHEN A REQUEST IS MADE TO THE SERVER
let [requestStatus, setRequestStatus] = useState({
const addGroup = () => {
setRequestStatus({ loading: true, status: false, message: "" });
if (name == "") {
setRequestStatus({
loading: false,
status: false,
message: "",
}); // STATE FOR KNOWING WHEN A REQUEST IS MADE TO THE SERVER
const addGroup = () => {
setRequestStatus({loading:true, status:false, message:''})
if(name == ''){
setRequestStatus({loading:false, status:false, message:'Please enter a group name'})
return setTimeout(()=>{
setRequestStatus({loading:false, status:false, message:''})
},3000)
}
if(name.length < 6){
setRequestStatus({loading:false, status:false, message:'Group name must be up to six characters'})
return setTimeout(()=>{
setRequestStatus({loading:false, status:false, message:''})
},3000)
}
api.jobGroupAdd({group_name:name, action:13025}).then(response => {
let {status, data} = response
if(status != 200 || data.internal_return < 0){
setRequestStatus({loading:false, status:false, message:'Unable to add Group'})
return
}
setRequestStatus({loading:false, status:true, message:'Group Added'})
setTimeout(()=>{
setRequestStatus({loading:false, status:false, message:''})
// close modal
action()
// reload group page
setUpdateList(prev => !prev)
},3000)
}).catch(error => {
setRequestStatus({loading:false, status:false, message:'Unable to add Group, try again later'})
}).finally(()=>{
setTimeout(()=>{
setRequestStatus({loading:false, status:false, message:''})
},3000)
})
message: "Please enter a group name",
});
return setTimeout(() => {
setRequestStatus({ loading: false, status: false, message: "" });
}, 3000);
}
if (name.length < 6) {
setRequestStatus({
loading: false,
status: false,
message: "Group name must be up to six characters",
});
return setTimeout(() => {
setRequestStatus({ loading: false, status: false, message: "" });
}, 3000);
}
api
.jobGroupAdd({
group_name: name,
action: apiConst.WRENCHBOARD_JOB_OFFER_SYSTEM,
})
.then((response) => {
let { status, data } = response;
if (status != 200 || data.internal_return < 0) {
setRequestStatus({
loading: false,
status: false,
message: "Unable to add Group",
});
return;
}
setRequestStatus({
loading: false,
status: true,
message: "Group Added",
});
setTimeout(() => {
setRequestStatus({ loading: false, status: false, message: "" });
// close modal
action();
// reload group page
setUpdateList((prev) => !prev);
}, 3000);
})
.catch((error) => {
setRequestStatus({
loading: false,
status: false,
message: "Unable to add Group, try again later",
});
})
.finally(() => {
setTimeout(() => {
setRequestStatus({ loading: false, status: false, message: "" });
}, 3000);
});
};
return (
<ModalCom
action={action}
situation={situation}
>
<ModalCom action={action} situation={situation}>
<div className="logout-modal-wrapper lg:w-[500px] h-full lg:h-auto bg-white dark:bg-dark-white lg:rounded-2xl">
<div className="logout-modal-header w-full flex items-center justify-between lg:px-10 lg:py-8 px-[30px] py-[23px] border-b border-light-purple dark:border-[#5356fb29] ">
<h1 className="text-26 font-bold text-dark-gray dark:text-white tracking-wide">
@@ -98,7 +122,7 @@ export default function AddGroup({action, situation , setUpdateList}) {
<div className="logout-modal-body w-full flex flex-col items-center px-10 py-8">
<div className="mb-6 w-full">
<div className="input-item">
<InputCom
<InputCom
labelClass="tracking-wider"
fieldClass="sm:px-6 px-2"
value={name}
@@ -108,7 +132,7 @@ export default function AddGroup({action, situation , setUpdateList}) {
type="text"
inputHandler={handleChange}
// iconName="message"
/>
/>
</div>
</div>
<div className="w-full flex justify-between items-center gap-4">
@@ -117,7 +141,9 @@ export default function AddGroup({action, situation , setUpdateList}) {
type="button"
className="text-base text-light-red tracking-wide "
>
<span className="border-b dark:border-[#5356fb29] border-light-red">Cancel</span>
<span className="border-b dark:border-[#5356fb29] border-light-red">
Cancel
</span>
</button>
{requestStatus.loading ? (
<LoadingSpinner size="8" color="sky-blue" />
@@ -153,5 +179,5 @@ export default function AddGroup({action, situation , setUpdateList}) {
</div>
</div>
</ModalCom>
)
);
}