added small ui changed like table b-padding, button size and fixd delete activity and group
This commit is contained in:
parent
52e12426af
commit
4e315aafcf
@ -248,7 +248,7 @@ const AssignOrg = ({ setStep }) => {
|
||||
? "Please wait..."
|
||||
: flowType === "default"
|
||||
? "Assign Organization"
|
||||
: "Add"}
|
||||
: "Assign Project"}
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
|
@ -84,10 +84,7 @@ const OrgPickerFromSPId = ({ title, placeholder }) => {
|
||||
height={50}
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
className="d-flex flex-column p-0 m-0 cursor-pointer"
|
||||
onClick={() => onOpen({ startStep: 3, orgData: org })}
|
||||
>
|
||||
<div className="d-flex flex-column p-0 m-0 cursor-pointer">
|
||||
<span className="fs-6 fw-semibold">{org.name}</span>
|
||||
<div className="d-flex gap-2">
|
||||
<small
|
||||
@ -102,6 +99,16 @@ const OrgPickerFromSPId = ({ title, placeholder }) => {
|
||||
<small className="text-small fw-semibold">Address:</small>
|
||||
<div className="d-flex text-wrap">{org.address}</div>
|
||||
</div>
|
||||
<div className="m-0 p-0">
|
||||
{" "}
|
||||
<button
|
||||
type="submit"
|
||||
className="btn btn-sm btn-primary"
|
||||
onClick={() => onOpen({ startStep: 3, orgData: org })}
|
||||
>
|
||||
Select
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
))}
|
||||
|
@ -85,7 +85,7 @@ const OrgPickerfromTenant = ({ title }) => {
|
||||
{isLoading ? (
|
||||
<div>Loading....</div>
|
||||
) : data && data?.data?.length > 0 ? (
|
||||
<div className="dataTables_wrapper no-footer pb-2">
|
||||
<div className="dataTables_wrapper no-footer pb-5">
|
||||
<table className="table dataTable text-nowrap">
|
||||
<thead>
|
||||
<tr className="table_header_border">
|
||||
@ -99,28 +99,41 @@ const OrgPickerfromTenant = ({ title }) => {
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{Array.isArray(data.data) && data.data.length > 0
|
||||
? data.data.map((row, i) => (
|
||||
<tr key={i}>
|
||||
{contactList.map((col) => (
|
||||
<td key={col.key} className={col.align}>
|
||||
{col.getValue(row)}
|
||||
</td>
|
||||
))}
|
||||
<td className="sticky-action-column bg-white">
|
||||
<button
|
||||
className="btn btn-sm btn-primary"
|
||||
onClick={() => onOpen({ startStep: 3, orgData: row })}
|
||||
>
|
||||
Select
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
))
|
||||
: null}
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
<div
|
||||
className="scrollable-tbody overflow-y-auto"
|
||||
style={{ maxHeight: "350px", overflowY: "auto" }}
|
||||
>
|
||||
<table className="table dataTable text-nowrap mb-0">
|
||||
<tbody>
|
||||
{Array.isArray(data.data) && data.data.length > 0
|
||||
? data.data.map((row, i) => (
|
||||
<tr key={i}>
|
||||
{contactList.map((col) => (
|
||||
<td key={col.key} className={col.align}>
|
||||
{col.getValue(row)}
|
||||
</td>
|
||||
))}
|
||||
<td className="sticky-action-column p-0 bg-white">
|
||||
<div className="p-1">
|
||||
<button
|
||||
type="submit"
|
||||
className="btn btn-sm btn-primary"
|
||||
onClick={() =>
|
||||
onOpen({ startStep: 3, orgData: row })
|
||||
}
|
||||
>
|
||||
Select
|
||||
</button>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
))
|
||||
: null}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
) : null}
|
||||
<div className="d-flex flex-column align-items-center text-center text-wrap text-black gap-2">
|
||||
|
@ -60,7 +60,7 @@ const OrganizationModal = () => {
|
||||
if (startStep === 1) {
|
||||
return orgData && orgData !== null
|
||||
? "Add Organization"
|
||||
: "Choose Organization1";
|
||||
: "Choose Organization";
|
||||
}
|
||||
|
||||
if (startStep === 2) {
|
||||
|
@ -93,7 +93,7 @@ const OrganizationsList = ({searchText}) => {
|
||||
if (isError) return <div>{error?.message || "Something went wrong"}</div>;
|
||||
|
||||
return (
|
||||
<div className="card px-0 px-sm-4">
|
||||
<div className="card px-0 px-sm-4 pb-12 pt-5">
|
||||
<div className="card-datatable table-responsive" id="horizontal-example">
|
||||
<div className="dataTables_wrapper no-footer px-2">
|
||||
<table className="table border-top dataTable text-nowrap">
|
||||
|
@ -7,7 +7,7 @@ const ProjectAssignedOrgs = () => {
|
||||
const { data, isLoading, isError, error } =
|
||||
useProjectAssignedOrganizations(selectedProject);
|
||||
|
||||
const contactList = [
|
||||
const orgList = [
|
||||
{
|
||||
key: "name",
|
||||
label: "Organization Name",
|
||||
@ -23,6 +23,16 @@ const ProjectAssignedOrgs = () => {
|
||||
</div>
|
||||
),
|
||||
align: "text-start",
|
||||
},
|
||||
{
|
||||
key: "service",
|
||||
label: "Service Name",
|
||||
getValue: (org) => (
|
||||
<div className="d-flex gap-2 py-1 ">
|
||||
N/A
|
||||
</div>
|
||||
),
|
||||
align: "text-start",
|
||||
},
|
||||
{
|
||||
key: "sprid",
|
||||
@ -61,7 +71,7 @@ const ProjectAssignedOrgs = () => {
|
||||
<table className="table dataTable text-nowrap">
|
||||
<thead>
|
||||
<tr className="table_header_border">
|
||||
{contactList.map((col) => (
|
||||
{orgList.map((col) => (
|
||||
<th key={col.key} className={col.align}>
|
||||
{col.label}
|
||||
</th>
|
||||
@ -72,7 +82,7 @@ const ProjectAssignedOrgs = () => {
|
||||
{Array.isArray(data) && data.length > 0 ? (
|
||||
data.map((row, i) => (
|
||||
<tr key={i}>
|
||||
{contactList.map((col) => (
|
||||
{orgList.map((col) => (
|
||||
<td key={col.key} className={col.align}>
|
||||
{col.getValue(row)}
|
||||
</td>
|
||||
@ -82,7 +92,7 @@ const ProjectAssignedOrgs = () => {
|
||||
) : (
|
||||
<tr style={{ height: "200px" }}>
|
||||
<td
|
||||
colSpan={contactList.length}
|
||||
colSpan={orgList.length}
|
||||
className="text-center align-middle"
|
||||
>
|
||||
Not Assigned yet
|
||||
|
@ -7,12 +7,12 @@ const ProjectOrganizations = () => {
|
||||
const { onOpen, startStep, flowType } = useOrganizationModal();
|
||||
const selectedProject = useSelectedProject();
|
||||
return (
|
||||
<div className="card">
|
||||
<div className="card pb-10" >
|
||||
<div className="card-header">
|
||||
<div className="d-flex justify-content-end px-2">
|
||||
<button
|
||||
type="button"
|
||||
className="link-button btn btn-xs rounded-md link-button-sm m-1 btn-primary"
|
||||
className="link-button btn btn-sm rounded-md link-button-sm m-1 btn-primary"
|
||||
onClick={() => onOpen({ startStep: 1, flowType: "assign" })}
|
||||
>
|
||||
<i className="bx bx-plus-circle me-2"></i>
|
||||
|
@ -135,7 +135,7 @@ const ManageActivity = ({ activity = null, whichGroup = null, close }) => {
|
||||
}, []);
|
||||
let isPending = isLoading || isUpdating;
|
||||
return (
|
||||
<form onSubmit={handleSubmit(onSubmit)}>
|
||||
<form onSubmit={handleSubmit(onSubmit)} className="px-7">
|
||||
{/* <h6>Create Activity</h6> */}
|
||||
<div className="row">
|
||||
<div className="col-6 text-start">
|
||||
@ -171,13 +171,19 @@ const ManageActivity = ({ activity = null, whichGroup = null, close }) => {
|
||||
</div>
|
||||
|
||||
<div className="col-md-12 text-start mt-1">
|
||||
<p className="py-1 my-0">
|
||||
{checkListItems.length > 0 ? "Check List" : "Add Check List"}
|
||||
</p>
|
||||
{checkListItems.length > 0 && (
|
||||
<table className="table mt-1 border-0">
|
||||
<thead className="py-0 my-0 table-border-top-0">
|
||||
<tr className="py-1">
|
||||
<label className="py-1 form-label my-0">
|
||||
Add Check List <i
|
||||
className="bx bx-plus-circle text-primary cursor-pointer"
|
||||
data-bs-toggle="tooltip"
|
||||
title="Add Check"
|
||||
data-bs-original-title="Add check"
|
||||
onClick={addChecklistItem}
|
||||
></i>
|
||||
</label>
|
||||
{checkListItems.length > 0 ? (
|
||||
<table className="table mt-1 border-none">
|
||||
<thead className="py-0 my-0 border-none ">
|
||||
<tr className="py-1 border-secondary ">
|
||||
<th colSpan={2} className="py-1">
|
||||
<small>Name</small>
|
||||
</th>
|
||||
@ -187,10 +193,10 @@ const ManageActivity = ({ activity = null, whichGroup = null, close }) => {
|
||||
<th className="text-center py-1">Action</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody className="table-border-bottom-0 ">
|
||||
<tbody className="table-border-bottom-0 border-secondary ">
|
||||
{checkListItems.map((item, index) => (
|
||||
<tr key={index} className="border-top-0">
|
||||
<td colSpan={2} className="border-top-0 border-0">
|
||||
<tr key={index}>
|
||||
<td colSpan={2} className="border-none" >
|
||||
<input
|
||||
className="d-none"
|
||||
{...register(`checkList.${index}.id`)}
|
||||
@ -212,7 +218,7 @@ const ManageActivity = ({ activity = null, whichGroup = null, close }) => {
|
||||
</small>
|
||||
)}
|
||||
</td>
|
||||
<td colSpan={2} className="text-center border-0">
|
||||
<td colSpan={2} className="text-center border-none">
|
||||
<input
|
||||
className="form-check-input"
|
||||
type="checkbox"
|
||||
@ -220,7 +226,7 @@ const ManageActivity = ({ activity = null, whichGroup = null, close }) => {
|
||||
defaultChecked={item.isMandatory}
|
||||
/>
|
||||
</td>
|
||||
<td className="text-center border-0">
|
||||
<td className="text-center border-none">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => removeChecklistItem(index)}
|
||||
@ -238,31 +244,20 @@ const ManageActivity = ({ activity = null, whichGroup = null, close }) => {
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
)}
|
||||
<button
|
||||
type="button"
|
||||
className="btn btn-xs btn-primary mt-2"
|
||||
onClick={addChecklistItem}
|
||||
>
|
||||
<i
|
||||
className="bx bx-plus-circle"
|
||||
data-bs-toggle="tooltip"
|
||||
title="Add Check"
|
||||
data-bs-original-title="Add check"
|
||||
></i>
|
||||
</button>
|
||||
):(<div className="d-flex justify-content-center my-0"><p className="text-secondary m-0">Not Yet Added</p> </div>)}
|
||||
|
||||
</div>
|
||||
|
||||
<div className="col-12 text-end mt-3">
|
||||
<button
|
||||
type="reset"
|
||||
className="btn btn-xs btn-label-secondary me-3"
|
||||
className="btn btn-sm btn-label-secondary me-3"
|
||||
onClick={handleClose}
|
||||
disabled={isPending}
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
<button type="submit" className="btn btn-xs btn-primary">
|
||||
<button type="submit" className="btn btn-sm btn-primary">
|
||||
{isPending ? "Please Wait" : activity ? "Update" : "Submit"}
|
||||
</button>
|
||||
</div>
|
||||
|
@ -53,7 +53,7 @@ const ManageGroup = ({ group = null, whichService = null, close }) => {
|
||||
|
||||
let isPending = isCreating || isUpdating;
|
||||
return (
|
||||
<form className="row px-2" onSubmit={handleSubmit(onSubmit)}>
|
||||
<form className="row px-12" onSubmit={handleSubmit(onSubmit)} cl>
|
||||
<div className="col-12 col-md-12 text-start">
|
||||
<Label className="form-label" required>
|
||||
Group Name
|
||||
|
@ -44,7 +44,7 @@ const ServiceGroups = ({ service }) => {
|
||||
<div className="d-flex justify-content-between text-start align-items-center accordion-header py-1">
|
||||
<p className="m-0 fw-bold fs-6">{service.name}</p>
|
||||
<button
|
||||
className="btn btn-xs btn-primary"
|
||||
className="btn btn-sm btn-primary"
|
||||
onClick={() =>
|
||||
setManageGroup({
|
||||
isOpen: true,
|
||||
@ -93,7 +93,7 @@ const ServiceGroups = ({ service }) => {
|
||||
>
|
||||
<div className="d-flex justify-content-between text-start accordion-header">
|
||||
{/* Show group toggle button only if ManageGroup is not open */}
|
||||
<div className="d-flex gap-4 align-items-center">
|
||||
<div className="d-flex gap-1 align-items-center">
|
||||
{!isManageGroup.isOpen && (
|
||||
<span
|
||||
onClick={() => toggleGroup(group.id)}
|
||||
@ -118,10 +118,6 @@ const ServiceGroups = ({ service }) => {
|
||||
<i
|
||||
className="bx bx-plus-circle text-primary cursor-pointer"
|
||||
onClick={() => {
|
||||
console.log(
|
||||
"Opening new activity for group:",
|
||||
group.id
|
||||
);
|
||||
setManageActivity({
|
||||
isOpen: true,
|
||||
activity: null, // Indicating new activity creation
|
||||
@ -182,7 +178,7 @@ const ServiceGroups = ({ service }) => {
|
||||
aria-labelledby={group.id}
|
||||
data-bs-parent="#accordionOne"
|
||||
>
|
||||
<div className="accordion-body">
|
||||
<div className="accordion-body ">
|
||||
{isOpen && actLoading && (
|
||||
<p className="text-center m-0">
|
||||
Loading activities...
|
||||
@ -192,7 +188,7 @@ const ServiceGroups = ({ service }) => {
|
||||
{isOpen && activities?.data?.length > 0 ? (
|
||||
<div className="row border-top-2">
|
||||
{/* Header Row */}
|
||||
<div className="col-12 d-flex justify-content-between py-2 border-bottom">
|
||||
<div className="col-12 d-flex justify-content-between py-2 border-bottom px-4">
|
||||
<span className="fw-semibold text-uppercase">
|
||||
Activity Name
|
||||
</span>
|
||||
|
@ -719,7 +719,7 @@ export const useCreateService = (onSuccessCallback) => {
|
||||
},
|
||||
onError: (error) => {
|
||||
debugger;
|
||||
showToast(error.message || "Something went wrong", "error");
|
||||
showToast( error?.response?.data?.message || error?.message || "Something went wrong", "error");
|
||||
},
|
||||
});
|
||||
};
|
||||
@ -742,7 +742,7 @@ export const useUpdateService = (onSuccessCallback) => {
|
||||
if (onSuccessCallback) onSuccessCallback(data);
|
||||
},
|
||||
onError: (error) => {
|
||||
showToast(error?.message || "Something went wrong", "error");
|
||||
showToast(error?.response?.data?.message || error?.message || "Something went wrong", "error");
|
||||
},
|
||||
});
|
||||
};
|
||||
@ -759,16 +759,16 @@ export const useCreateActivityGroup = (onSuccessCallback) => {
|
||||
queryClient.invalidateQueries({
|
||||
queryKey: ["groups"],
|
||||
});
|
||||
|
||||
showToast(
|
||||
data.message || "Activity Group created successfully.",
|
||||
debugger
|
||||
showToast( data?.message ||
|
||||
data?.response?.data?.message || "Activity Group created successfully.",
|
||||
"success"
|
||||
);
|
||||
|
||||
if (onSuccessCallback) onSuccessCallback(data);
|
||||
},
|
||||
onError: (error) => {
|
||||
showToast(error?.message || "Something went wrong", "error");
|
||||
showToast(error?.response?.data?.message || error?.message || "Something went wrong", "error");
|
||||
},
|
||||
});
|
||||
};
|
||||
@ -786,7 +786,8 @@ export const useUpdateActivityGroup = (onSuccessCallback) => {
|
||||
});
|
||||
|
||||
showToast(
|
||||
data.message || "Activity Group Updated successfully.",
|
||||
data?.message ||
|
||||
data?.response?.data?.message|| "Activity Group Updated successfully.",
|
||||
"success"
|
||||
);
|
||||
|
||||
@ -812,7 +813,7 @@ export const useCreateActivity = (onSuccessCallback) => {
|
||||
if (onSuccessCallback) onSuccessCallback(data);
|
||||
},
|
||||
onError: (error) => {
|
||||
showToast(error.message || "Something went wrong", "error");
|
||||
showToast(error?.response?.data?.message || error?.message || "Something went wrong", "error");
|
||||
},
|
||||
});
|
||||
};
|
||||
@ -834,7 +835,7 @@ export const useUpdateActivity = (onSuccessCallback) => {
|
||||
if (onSuccessCallback) onSuccessCallback(data);
|
||||
},
|
||||
onError: (error) => {
|
||||
showToast(error.message || "Something went wrong", "error");
|
||||
showToast(error?.response?.data?.message || error?.message || "Something went wrong", "error");
|
||||
},
|
||||
});
|
||||
};
|
||||
|
@ -32,7 +32,7 @@ const OrganizationPage = () => {
|
||||
<div className="col-6 text-end mt-2 mt-sm-0">
|
||||
<button
|
||||
type="button"
|
||||
className="p-1 me-1 m-sm-0 bg-primary rounded-circle"
|
||||
className="p-1 me-1 m-sm-0 bg-primary rounded-circle"
|
||||
title="Add New Organization"
|
||||
onClick={()=>onOpen({ startStep: 2,flowType:"default" })}
|
||||
>
|
||||
|
@ -91,7 +91,8 @@ const MasterPage = () => {
|
||||
|
||||
const handleDeleteServiceItem =()=>{
|
||||
if(!isDeleletingServiceItem.ItemId) return
|
||||
if(isDeleletingServiceItem.whichItem == "activiy"){
|
||||
debugger
|
||||
if(isDeleletingServiceItem.whichItem === "activity"){
|
||||
DeleteAcivity(isDeleletingServiceItem.ItemId,{onSuccess:()=>setDeleletingServiceItem({isOpen:false,ItemId:null,whichItem:null})})
|
||||
}else{
|
||||
DeleteSericeGroup(isDeleletingServiceItem.ItemId,{onSuccess:()=>setDeleletingServiceItem({isOpen:false,ItemId:null,whichItem:null})})
|
||||
|
Loading…
x
Reference in New Issue
Block a user