Merge branch 'edit-job' of WrenchBoard/Users-Wrench into master
This commit is contained in:
Gogs
@@ -4,7 +4,6 @@ import LoadingSpinner from "../Spinners/LoadingSpinner";
|
||||
|
||||
export default function FamilyTable({ className, familyList, loader }) {
|
||||
const filterCategories = ["All Categories", "Explore", "Featured"];
|
||||
|
||||
const [selectedCategory, setCategory] = useState(filterCategories[0]);
|
||||
return (
|
||||
<div
|
||||
@@ -13,12 +12,12 @@ export default function FamilyTable({ className, familyList, loader }) {
|
||||
}`}
|
||||
>
|
||||
<div className="relative w-full overflow-x-auto sm:rounded-lg">
|
||||
{loader ? (
|
||||
<div className="h-full min-h-[500px] w-full overflow-hidden flex justify-center items-center">
|
||||
<LoadingSpinner size='16' color='sky-blue' />
|
||||
</div>
|
||||
) : (
|
||||
<table className="w-full text-sm text-left text-gray-500 dark:text-gray-400 relative">
|
||||
{loader ? (
|
||||
<div className="h-full min-h-[500px] w-full overflow-hidden flex justify-center items-center">
|
||||
<LoadingSpinner size="16" color="sky-blue" />
|
||||
</div>
|
||||
) : (
|
||||
<table className="w-full text-sm text-left text-gray-500 dark:text-gray-400 relative">
|
||||
<>
|
||||
<thead className="sticky top-0">
|
||||
<tr className="text-base text-thin-light-gray whitespace-nowrap border-b dark:border-[#5356fb29] default-border-bottom ">
|
||||
@@ -31,55 +30,65 @@ export default function FamilyTable({ className, familyList, loader }) {
|
||||
<tbody className="overflow-y-scroll h-auto">
|
||||
<>
|
||||
{familyList?.length > 0 ? (
|
||||
familyList?.map(({ firstname, lastname, age }, idx) => (
|
||||
<tr
|
||||
className="bg-white dark:bg-dark-white border-b dark:border-[#5356fb29] hover:bg-gray-50"
|
||||
key={idx}
|
||||
>
|
||||
<td className=" py-4">
|
||||
<div className="flex space-x-2 items-center">
|
||||
<div className="w-[60px] h-[60px] rounded-full overflow-hidden flex justify-center items-center">
|
||||
<img
|
||||
src={dataImage1}
|
||||
alt="data"
|
||||
className="w-full h-full"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<h1 className="font-bold text-xl text-dark-gray dark:text-white whitespace-nowrap">
|
||||
{`${firstname} ${lastname} (${age})`}
|
||||
</h1>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Added{" "}
|
||||
<span className="text-purple">10-10-2029</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td className="text-center py-4 px-2">
|
||||
<div className="flex space-x-1 items-center justify-center">
|
||||
<span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap">
|
||||
10-10-2019
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
<td className="text-center py-4 px-2">
|
||||
<div className="flex space-x-1 items-center justify-center">
|
||||
<span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap">
|
||||
100
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
<td className="text-right py-4 px-2">
|
||||
<button
|
||||
type="button"
|
||||
className="w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
familyList?.map(
|
||||
(
|
||||
{ firstname, lastname, age, added, last_login },
|
||||
idx
|
||||
) => {
|
||||
let addedDate = added?.split(" ")[0];
|
||||
return (
|
||||
<tr
|
||||
className="bg-white dark:bg-dark-white border-b dark:border-[#5356fb29] hover:bg-gray-50"
|
||||
key={idx}
|
||||
>
|
||||
Manage
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
))
|
||||
<td className=" py-4">
|
||||
<div className="flex space-x-2 items-center">
|
||||
<div className="w-[60px] h-[60px] rounded-full overflow-hidden flex justify-center items-center">
|
||||
<img
|
||||
src={dataImage1}
|
||||
alt="data"
|
||||
className="w-full h-full"
|
||||
/>
|
||||
</div>
|
||||
<div className="flex flex-col">
|
||||
<h1 className="font-bold text-xl text-dark-gray dark:text-white whitespace-nowrap">
|
||||
{`${firstname} ${lastname} (${age})`}
|
||||
</h1>
|
||||
<span className="text-sm text-thin-light-gray">
|
||||
Added:{" "}
|
||||
<span className="text-purple ml-1">
|
||||
{addedDate}
|
||||
</span>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td className="text-center py-4 px-2">
|
||||
<div className="flex space-x-1 items-center justify-center">
|
||||
<span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap">
|
||||
{last_login}
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
<td className="text-center py-4 px-2">
|
||||
<div className="flex space-x-1 items-center justify-center">
|
||||
<span className="text-base text-dark-gray dark:text-white font-medium whitespace-nowrap">
|
||||
100
|
||||
</span>
|
||||
</div>
|
||||
</td>
|
||||
<td className="text-right py-4 px-2 flex items-center justify-center">
|
||||
<button
|
||||
type="button"
|
||||
className="w-20 h-11 flex justify-center items-center btn-gradient text-base rounded-full text-white"
|
||||
>
|
||||
Manage
|
||||
</button>
|
||||
</td>
|
||||
</tr>
|
||||
);
|
||||
}
|
||||
)
|
||||
) : (
|
||||
<tr className="font-bold text-xl text-dark-gray dark:text-white whitespace-nowrap">
|
||||
<td className="p-2" colSpan="4">
|
||||
@@ -90,8 +99,8 @@ export default function FamilyTable({ className, familyList, loader }) {
|
||||
</>
|
||||
</tbody>
|
||||
</>
|
||||
</table>
|
||||
)}
|
||||
</table>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -82,7 +82,7 @@ export default function InputCom({
|
||||
name={name}
|
||||
minLength={minLengthValidation()}
|
||||
maxLength={maxLengthValidation()}
|
||||
pattern={() => inputPatterns}
|
||||
// pattern={inputPatterns()}
|
||||
ref={inputRef}
|
||||
readOnly={disable}
|
||||
onBlur={blurHandler}
|
||||
|
||||
@@ -1,4 +1,4 @@
|
||||
import React, { useState } from "react";
|
||||
import React, { useCallback, useEffect, useMemo, useState } from "react";
|
||||
import dataImage1 from "../../assets/images/data-table-user-1.png";
|
||||
import dataImage2 from "../../assets/images/data-table-user-2.png";
|
||||
import dataImage3 from "../../assets/images/data-table-user-3.png";
|
||||
@@ -10,8 +10,42 @@ import DeleteJobPopout from "../jobPopout/DeleteJobPopout";
|
||||
import PaginatedList from "../Pagination/PaginatedList";
|
||||
import { handlePagingFunc } from "../Pagination/HandlePagination";
|
||||
import EditJobPopOut from "../jobPopout/EditJobPopout";
|
||||
import usersService from "../../services/UsersService";
|
||||
import { useSelector } from "react-redux";
|
||||
|
||||
export default function MyJobTable({ MyJobList, className }) {
|
||||
const [myCountry, setCountries] = useState("");
|
||||
const {
|
||||
userDetails: { country },
|
||||
} = useSelector((state) => state?.userDetails);
|
||||
|
||||
const userApi = useMemo(() => new usersService(), []);
|
||||
|
||||
// Get Country Api
|
||||
const getCountryList = useCallback(async () => {
|
||||
const res = await userApi.getSignupCountryData();
|
||||
|
||||
try {
|
||||
if (res.status === 200) {
|
||||
const {
|
||||
data: { signup_country },
|
||||
} = await res;
|
||||
console.log(signup_country);
|
||||
let checkCountry = signup_country
|
||||
?.filter((item) => item[0] == country)
|
||||
?.map((item, idx) => item[1])
|
||||
.join("");
|
||||
setCountries(checkCountry);
|
||||
}
|
||||
} catch (error) {
|
||||
throw new Error(error);
|
||||
}
|
||||
}, [userApi, country]);
|
||||
|
||||
useEffect(() => {
|
||||
getCountryList();
|
||||
}, [getCountryList]);
|
||||
|
||||
const filterCategories = ["All Categories", "Explore", "Featured"];
|
||||
const [selectedCategory, setCategory] = useState(filterCategories[0]);
|
||||
|
||||
@@ -209,6 +243,7 @@ export default function MyJobTable({ MyJobList, className }) {
|
||||
});
|
||||
}}
|
||||
situation={editJob.show}
|
||||
country={myCountry}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@@ -1,11 +1,13 @@
|
||||
import React, { useState } from "react";
|
||||
import React, { useCallback, useEffect, useMemo, useState } from "react";
|
||||
import ModalCom from "../Helpers/ModalCom";
|
||||
import { Form, Formik } from "formik";
|
||||
import * as Yup from "yup";
|
||||
import InputCom from "../Helpers/Inputs/InputCom";
|
||||
import LoadingSpinner from "../Spinners/LoadingSpinner";
|
||||
import usersService from "../../services/UsersService";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
|
||||
const EditJobPopOut = ({ details, onClose, situation }) => {
|
||||
const EditJobPopOut = ({ details, onClose, situation, country }) => {
|
||||
let [requestStatus, setRequestStatus] = useState({
|
||||
loading: false,
|
||||
status: false,
|
||||
@@ -41,7 +43,7 @@ const EditJobPopOut = ({ details, onClose, situation }) => {
|
||||
|
||||
let initialValues = {
|
||||
// initial values for formik
|
||||
country: details?.country,
|
||||
country: country,
|
||||
price: details?.price,
|
||||
title: details?.title,
|
||||
description: details?.description,
|
||||
@@ -49,7 +51,34 @@ const EditJobPopOut = ({ details, onClose, situation }) => {
|
||||
timeline_days: details?.timeline_days,
|
||||
};
|
||||
|
||||
console.log(details);
|
||||
const jobApi = useMemo(() => new usersService(), []);
|
||||
const navigate = useNavigate();
|
||||
|
||||
const handleEditJob = useCallback(
|
||||
async (values) => {
|
||||
setRequestStatus({ loading: true, message: "" });
|
||||
let reqData = {
|
||||
job_id: details.job_id,
|
||||
job_uid: details.job_uid,
|
||||
...values,
|
||||
};
|
||||
try {
|
||||
let res = await jobApi.jobManagerUpdateJob(reqData);
|
||||
let { data } = await res;
|
||||
if (data?.internal_return < 0) return;
|
||||
setRequestStatus({ loading: false, message: null });
|
||||
setTimeout(() => {
|
||||
navigate("/myjobs", { replace: true });
|
||||
onClose();
|
||||
}, 1000);
|
||||
} catch (error) {
|
||||
setRequestStatus({ loading: false, message: error });
|
||||
throw new Error(error);
|
||||
}
|
||||
},
|
||||
[jobApi, navigate, onClose, details]
|
||||
);
|
||||
|
||||
return (
|
||||
<ModalCom action={onClose} situation={situation} className="edit-popup">
|
||||
<div className="logout-modal-wrapper lg:w-[600px] h-full lg:h-auto bg-white dark:bg-dark-white lg:rounded-2xl">
|
||||
@@ -87,6 +116,7 @@ const EditJobPopOut = ({ details, onClose, situation }) => {
|
||||
<Formik
|
||||
initialValues={initialValues}
|
||||
validationSchema={validationSchema}
|
||||
onSubmit={handleEditJob}
|
||||
>
|
||||
{(props) => (
|
||||
<Form className="w-full">
|
||||
@@ -94,26 +124,19 @@ const EditJobPopOut = ({ details, onClose, situation }) => {
|
||||
<div className="fields w-full">
|
||||
<div className="xl:flex xl:space-x-7 mb-6">
|
||||
<div className="field w-full mb-6 xl:mb-0">
|
||||
<label
|
||||
htmlFor="country"
|
||||
className="input-label text-[#181c32] dark:text-white text-[13.975px] leading-[20.9625px] font-semibold block"
|
||||
>
|
||||
Country
|
||||
</label>
|
||||
<select
|
||||
id="country"
|
||||
<InputCom
|
||||
fieldClass="px-6 cursor-default"
|
||||
label="Country"
|
||||
labelClass="tracking-wide"
|
||||
inputBg="bg-slate-100"
|
||||
inputClass="input-curve lg border border-light-purple"
|
||||
type="text"
|
||||
name="country"
|
||||
value={props.values.country}
|
||||
className={`input-field py-2 px-6 mt-3 rounded-[50px] placeholder:text-base text-dark-gray dark:text-white w-full h-10 bg-slate-100 dark:bg-[#11131F] focus:ring-0 focus:outline-none`}
|
||||
onChange={props.handleChange}
|
||||
onBlur={props.handleBlur}
|
||||
disabled
|
||||
>
|
||||
<option
|
||||
className="text-slate-500 text-lg"
|
||||
value={props.values.country}
|
||||
/>
|
||||
</select>
|
||||
inputHandler={props.handleChange}
|
||||
blurHandler={props.handleBlur}
|
||||
disable={true}
|
||||
/>
|
||||
{props.errors.country && props.touched.country && (
|
||||
<p className="text-sm text-red-500">
|
||||
{props.errors.country}
|
||||
|
||||
@@ -461,6 +461,18 @@ class usersService {
|
||||
return this.postAuxEnd("/jobmanagercreatejob", postData);
|
||||
}
|
||||
|
||||
jobManagerUpdateJob(reqData) {
|
||||
var postData = {
|
||||
uid: localStorage.getItem("uid"),
|
||||
member_id: localStorage.getItem("member_id"),
|
||||
sessionid: localStorage.getItem("session_token"),
|
||||
job_id: localStorage.getItem("job_id"),
|
||||
action: 13010,
|
||||
...reqData
|
||||
};
|
||||
return this.postAuxEnd("/jobmanagerupdatejob", postData);
|
||||
}
|
||||
|
||||
// END POINT TO DELETE A JOB
|
||||
deleteJob(reqData) {
|
||||
var postData = {
|
||||
|
||||
Reference in New Issue
Block a user