Commit 344d1dff authored by ReemyHasan's avatar ReemyHasan

Add Users Functionalties

parent fee3154a
...@@ -13,7 +13,8 @@ import useTranslation from "next-translate/useTranslation"; ...@@ -13,7 +13,8 @@ import useTranslation from "next-translate/useTranslation";
import { TranslationFiles } from "@/src/data/core"; import { TranslationFiles } from "@/src/data/core";
import websocket from "../src/features/web-socket"; import websocket from "../src/features/web-socket";
import DataContext from "../src/context/trap-context"; import DataContext from "../src/context/trap-context";
import '../src/styles/tailwind.css' import '../src/styles/tailwind.css';
import { useCookies } from "react-cookie";
const inter = Inter({ subsets: ["latin"] }); const inter = Inter({ subsets: ["latin"] });
export default function App({ Component, pageProps }: AppProps) { export default function App({ Component, pageProps }: AppProps) {
...@@ -28,11 +29,13 @@ export default function App({ Component, pageProps }: AppProps) { ...@@ -28,11 +29,13 @@ export default function App({ Component, pageProps }: AppProps) {
new_val, new_val,
setNewVal setNewVal
]); ]);
React.useEffect(() => {
if (router.pathname === "/") { const [cookies, setCookie, removeCookie] = useCookies([]);
router.push("/dashboard"); // React.useEffect(() => {
} // if (router.pathname === "/") {
}, [router]); // router.push("/dashboard");
// }
// }, [router]);
useEffect(() => { useEffect(() => {
if (typeof window !== "undefined") { if (typeof window !== "undefined") {
...@@ -40,14 +43,30 @@ export default function App({ Component, pageProps }: AppProps) { ...@@ -40,14 +43,30 @@ export default function App({ Component, pageProps }: AppProps) {
if (loader) loader.remove(); if (loader) loader.remove();
} }
}, []); }, []);
// useEffect(() => {
// if (!websocket) {
// return;
// }
// return () => {
// if (websocket) {
// websocket.close();
// }
// };
// }, []);
const removeCookieAfterOneHour = async () => {
removeCookie("role", { path: "/", sameSite: true });
removeCookie("token", { path: "/", sameSite: true });
window.location.href = "/sign-in";
};
useEffect(() => { useEffect(() => {
if (!websocket) { const timeout = setTimeout(() => {
return; removeCookieAfterOneHour();
} }, 360000 //000
);
return () => { return () => {
if (websocket) { clearTimeout(timeout);
websocket.close();
}
}; };
}, []); }, []);
return ( return (
...@@ -68,8 +87,7 @@ export default function App({ Component, pageProps }: AppProps) { ...@@ -68,8 +87,7 @@ export default function App({ Component, pageProps }: AppProps) {
}} }}
> >
<DataContext.Provider value={contextValue}> <DataContext.Provider value={contextValue}>
<AuthContextProvider> <AuthContextProvider >
{/*// @ts-ignore*/}
<Component {...pageProps} /> <Component {...pageProps} />
</AuthContextProvider> </AuthContextProvider>
</DataContext.Provider> </DataContext.Provider>
......
...@@ -4,6 +4,7 @@ import { Fragment } from "react"; ...@@ -4,6 +4,7 @@ import { Fragment } from "react";
import Head from "next/head"; import Head from "next/head";
import { TranslationFiles } from "@/src/data/core"; import { TranslationFiles } from "@/src/data/core";
import useTranslation from "next-translate/useTranslation"; import useTranslation from "next-translate/useTranslation";
import DashboardComponent from "@/src/features/dashboard";
export default function Home() { export default function Home() {
const { t } = useTranslation(TranslationFiles.COMMON); const { t } = useTranslation(TranslationFiles.COMMON);
...@@ -14,7 +15,8 @@ export default function Home() { ...@@ -14,7 +15,8 @@ export default function Home() {
</Head> </Head>
<AppLayout> <AppLayout>
<main className={`app-main-container`}> <main className={`app-main-container`}>
<div className={"page-header"}>{t("dashboard")}</div> <div className={"page-header"}>{t("")}</div>
<DashboardComponent />
</main> </main>
</AppLayout> </AppLayout>
</Fragment> </Fragment>
......
...@@ -4,7 +4,7 @@ import UserLayout from "../../../src/components/user-layout"; ...@@ -4,7 +4,7 @@ import UserLayout from "../../../src/components/user-layout";
import { Fragment } from "react"; import { Fragment } from "react";
import useTranslation from "next-translate/useTranslation"; import useTranslation from "next-translate/useTranslation";
import { TranslationFiles } from "@/src/data/core"; import { TranslationFiles } from "@/src/data/core";
import ProfileForm from "@/src/features/profile"; import UserProfileForm from "@/src/features/profile/user-profile";
export default function Profile() { export default function Profile() {
const { t } = useTranslation(TranslationFiles.COMMON); const { t } = useTranslation(TranslationFiles.COMMON);
return ( return (
...@@ -13,7 +13,7 @@ export default function Profile() { ...@@ -13,7 +13,7 @@ export default function Profile() {
<title>{t("profile")}</title> <title>{t("profile")}</title>
</Head> </Head>
<UserLayout > <UserLayout >
<ProfileForm /> <UserProfileForm />
</UserLayout> </UserLayout>
</Fragment> </Fragment>
); );
......
...@@ -7,8 +7,9 @@ import { TranslationFiles } from "@/src/data/core"; ...@@ -7,8 +7,9 @@ import { TranslationFiles } from "@/src/data/core";
type DynamicFormHeaderProps = { type DynamicFormHeaderProps = {
className?: string; className?: string;
title: string; title: string;
onSave: (values: any) => void;
}; };
const DynamicFormHeader = ({ className, title }: DynamicFormHeaderProps) => { const DynamicFormHeader = ({ className, title,onSave }: DynamicFormHeaderProps) => {
const { t } = useTranslation(TranslationFiles.COMMON); const { t } = useTranslation(TranslationFiles.COMMON);
return ( return (
<Row <Row
...@@ -20,11 +21,14 @@ const DynamicFormHeader = ({ className, title }: DynamicFormHeaderProps) => { ...@@ -20,11 +21,14 @@ const DynamicFormHeader = ({ className, title }: DynamicFormHeaderProps) => {
</Col> </Col>
<Col> <Col>
<Row gutter={8}> <Row gutter={8}>
<Col> {/* <Col>
<FmsButton borderRadius= {32} type={"secondary"}>{t("cancel")}</FmsButton> <FmsButton borderRadius= {32} type={"secondary"}>{t("cancel")}</FmsButton>
</Col> </Col> */}
<Col> <Col>
<FmsButton borderRadius= {32} type={"primary"}> <FmsButton borderRadius= {32}
type={"primary"}
onClick={onSave}
>
{t("save")} {t("save")}
</FmsButton> </FmsButton>
</Col> </Col>
......
...@@ -16,21 +16,23 @@ const DynamicForm = ({ ...@@ -16,21 +16,23 @@ const DynamicForm = ({
}: DynamicFormDto) => { }: DynamicFormDto) => {
return ( return (
<Fragment> <Fragment>
<Formik {/* <Formik
enableReinitialize enableReinitialize
initialValues={initialValues} initialValues={initialValues}
onSubmit={onFinish} onSubmit={onFinish}
validationSchema={schema} validationSchema={schema}
> > */}
{() => ( {() => (
<Form> <Form>
<DynamicFormHeader <DynamicFormHeader
className={className?.formHeaderClassName} className={className?.formHeaderClassName}
title={title} title={title}
onSave={onFinish}
/> />
<Row <Row
className={`${styles.formContent} ${className?.formContentClassName}`} className={`${styles.formContent} ${className?.formContentClassName}`}
> >
{/*
{formCol?.map((col, index) => ( {formCol?.map((col, index) => (
<Col span={col?.span} key={index}> <Col span={col?.span} key={index}>
{col?.cards?.map((card, index) => ( {col?.cards?.map((card, index) => (
...@@ -49,11 +51,11 @@ const DynamicForm = ({ ...@@ -49,11 +51,11 @@ const DynamicForm = ({
</Card> </Card>
))} ))}
</Col> </Col>
))} ))}*/}
</Row> </Row>
</Form> </Form>
)} )}
</Formik> {/* </Formik> */}
</Fragment> </Fragment>
); );
}; };
......
...@@ -8,40 +8,40 @@ import DataContext from "../../../../context/trap-context"; ...@@ -8,40 +8,40 @@ import DataContext from "../../../../context/trap-context";
const { Header } = Layout; const { Header } = Layout;
export default function AppHeader() { export default function AppHeader() {
const { data, setData, websocket, setNewVal } = useContext(DataContext); // const { data, setData, websocket, setNewVal } = useContext(DataContext);
useEffect(() => { // useEffect(() => {
if (!websocket) { // if (!websocket) {
return; // return;
} // }
websocket.onmessage = function (event:any) { // websocket.onmessage = function (event:any) {
const message = JSON.parse(event.data); // const message = JSON.parse(event.data);
console.log(message); // console.log(message);
if (message.new_val != null) { // if (message.new_val != null) {
const newData = message.new_val; // const newData = message.new_val;
const transformedData = { // const transformedData = {
flag:'0', // flag:'0',
id: newData.id, // id: newData.id,
timestamp: newData.timestamp, // timestamp: newData.timestamp,
agentAddress: newData.agentAddress, // agentAddress: newData.agentAddress,
severity: newData.severity, // severity: newData.severity,
specificTrap: newData.specificTrap, // specificTrap: newData.specificTrap,
genericTrap: newData.genericTrap, // genericTrap: newData.genericTrap,
variableBindings: newData.variableBindings, // variableBindings: newData.variableBindings,
}; // };
setNewVal(transformedData); // setNewVal(transformedData);
setData((prevData: any) => [...prevData, newData]); // setData((prevData: any) => [...prevData, newData]);
} // }
else{ // else{
setNewVal({id:message.old_val.id,flag:-1,}); // setNewVal({id:message.old_val.id,flag:-1,});
} // }
}; // };
return () => { // return () => {
// if (websocket) { // // if (websocket) {
// websocket.close(); // // websocket.close();
// } // // }
}; // };
}, []); // }, []);
return ( return (
...@@ -59,9 +59,9 @@ export default function AppHeader() { ...@@ -59,9 +59,9 @@ export default function AppHeader() {
<Col className={"app-language-switcher"}> <Col className={"app-language-switcher"}>
<AppLanguageSwitcher /> <AppLanguageSwitcher />
</Col> </Col>
<Col className={"app-notifications"}> {/* <Col className={"app-notifications"}>
<AppNotifications data={data} setData={setData} /> <AppNotifications data={data} setData={setData} />
</Col> </Col> */}
<Col className={"app-user-info"}> <Col className={"app-user-info"}>
<UserInfo /> <UserInfo />
</Col> </Col>
......
import { AUTH_TOKEN } from "@/src/data/constant/app-constant"; // import { AUTH_TOKEN } from "@/src/data/constant/app-constant";
import router from "next/router"; import router from "next/router";
import { createContext, useEffect, useState } from "react"; import { createContext, useEffect, useState } from "react";
import { useCookies } from "react-cookie"; import { useCookies } from "react-cookie";
...@@ -7,24 +7,32 @@ export const AuthContext = createContext({}); ...@@ -7,24 +7,32 @@ export const AuthContext = createContext({});
const AuthContextProvider = (props: { children: React.ReactNode }) => { const AuthContextProvider = (props: { children: React.ReactNode }) => {
const [authenticated, setAuthenticated] = useState<boolean>(false); const [authenticated, setAuthenticated] = useState<boolean>(false);
const [cookies, removeCookies] = useCookies([AUTH_TOKEN]); const [cookies, removeCookie] = useCookies(["role", "token"]);
useEffect(() => { useEffect(() => {
if (cookies[AUTH_TOKEN]) { if (cookies["token"]) {
setAuthenticated(true); setAuthenticated(true);
} else { } else {
setAuthenticated(false); setAuthenticated(false);
router.push("/sign-in"); router.push("/sign-in");
} }
}, [cookies[AUTH_TOKEN]]); }, [cookies]);
const logout = async () => { const logout = async () => {
removeCookies(AUTH_TOKEN, { path: "/", sameSite: true }); try {
window.location.href = "/sign-in"; removeCookie("role", "", { path: "/", expires: new Date(0) });
removeCookie("token", "", { path: "/", expires: new Date(0) });
// removeCookie("role","");
// removeCookie("token","");
window.location.href = "/sign-in";
} catch (error) {
console.error("Error while removing cookies:", error);
}
}; };
return ( return (
<AuthContext.Provider <AuthContext.Provider
value={{ value={{
authenticated: authenticated,
logout: logout, logout: logout,
setAuthenticated: setAuthenticated, setAuthenticated: setAuthenticated,
}} }}
......
export const AUTH_TOKEN: string = "app-auth-token"; // export const AUTH_TOKEN: string = "token";
export const Default_Language: string = "app-language"; export const Default_Language: string = "app-language";
export const TrapURL: string = "http://localhost:6647/api/rethink/data"; export const ApiGatewayURL: string = `http://localhost:6644`;
export const SettingURL: string = "http://localhost:6647/api/about"; export const TrapURL: string = `http://localhost:6644/api/rethink/data`;
export const SettingURL: string = `http://localhost:6644/api/about`;
export const AuthURL: string = "http://localhost:6644/auth/";
export const UserURL: string = `http://localhost:6644/users/`;
import { GithubOutlined, MailOutlined } from "@ant-design/icons"; import { GithubOutlined, MailOutlined } from "@ant-design/icons";
import React, { useState } from "react"; import React, { useState } from "react";
export default function Footer() { export default function Footer() {
const [showEmail, setShowEmail] = useState(false); // const [showEmail, setShowEmail] = useState(false);
const email = <span>{"example@example.com "}</span>; // const email = <span>{"example@example.com "}</span>;
const handleButtonClick = () => {
setShowEmail(!showEmail);
};
return ( return (
<> <>
<footer className="relative bg-blueGray-200 pt-8 pb-6"> <footer className="relative bg-blueGray-200 pt-8 pb-6">
...@@ -32,52 +29,14 @@ export default function Footer() { ...@@ -32,52 +29,14 @@ export default function Footer() {
<div className="container mx-auto px-4"> <div className="container mx-auto px-4">
<div className="flex flex-wrap text-center lg:text-left"> <div className="flex flex-wrap text-center lg:text-left">
<div className="w-full lg:w-6/12 px-4"> <div className="w-full lg:w-6/12 px-4">
{/* <h4 className="text-3xl font-semibold">Let's keep in touch!</h4>
<h5 className="text-lg mt-0 mb-2 text-blueGray-600">
Find us on any of these platform.
</h5> */}
<div className="mt-6 lg:mb-0 mb-6"> <div className="mt-6 lg:mb-0 mb-6">
{/* <button
className="bg-white text-lightBlue-400 shadow-lg font-normal h-10 w-10 items-center justify-center align-center rounded-full outline-none focus:outline-none mr-2"
type="button"
onClick={handleButtonClick}
>
<MailOutlined
style={{ fontSize: "19px", color: "#000f24" }}
className={"ExclamationCircleOutlined "}
/>
</button>
{showEmail && <>{email}</>}
<button
className="bg-white text-blueGray-800 shadow-lg font-normal h-10 w-10 items-center justify-center align-center rounded-full outline-none focus:outline-none mr-2"
type="button"
onClick={() =>
window.open("https://github.com/ReemyHasan", "_blank")
}
>
<GithubOutlined
style={{ fontSize: "19px", color: "#000f24" }}
className={"ExclamationCircleOutlined "}
/>
</button> */}
</div> </div>
</div> </div>
<div className="w-full lg:w-6/12 px-4"> <div className="w-full lg:w-6/12 px-4">
<div className="flex flex-wrap items-top mb-6"> <div className="flex flex-wrap items-top mb-6">
<div className="w-full lg:w-4/12 px-4 ml-auto"> <div className="w-full lg:w-4/12 px-4 ml-auto">
{/* <span className="block uppercase text-blueGray-500 text-sm font-semibold mb-2">
Useful Links
</span>
<ul className="list-unstyled">
<li>
<a
className="text-blueGray-600 hover:text-blueGray-800 font-semibold block pb-2 text-sm"
href="#"
>
Contact Us
</a>
</li>
</ul> */}
</div> </div>
</div> </div>
</div> </div>
......
...@@ -11,8 +11,10 @@ import { ...@@ -11,8 +11,10 @@ import {
} from "@/src/services/setting-service"; } from "@/src/services/setting-service";
import MainUtils from "@/src/utils/main"; import MainUtils from "@/src/utils/main";
import { useCookies } from "react-cookie";
export default function AboutContent() { export default function AboutContent() {
const { t } = useTranslation(TranslationFiles.COMMON); const { t } = useTranslation(TranslationFiles.COMMON);
const [cookies] = useCookies([]);
const router = useRouter(); const router = useRouter();
const [formData, setFormData] = useState({ const [formData, setFormData] = useState({
subject: "", //fullName subject: "", //fullName
...@@ -26,12 +28,12 @@ export default function AboutContent() { ...@@ -26,12 +28,12 @@ export default function AboutContent() {
}, []); }, []);
async function getAboutInfo() { async function getAboutInfo() {
const response = await fetchAboutSettingData(); const response = await fetchAboutSettingData(cookies["token"],cookies["role"]);
setData(response); setData(response);
console.log(data); console.log(data);
} }
async function sendMessage() { async function sendMessage() {
const response = await sendEmailMessage(formData); const response = await sendEmailMessage(formData,cookies["token"],cookies["role"]);
console.log(response); console.log(response);
if (response == true) { if (response == true) {
setSendingStatus("success"); setSendingStatus("success");
...@@ -45,6 +47,9 @@ export default function AboutContent() { ...@@ -45,6 +47,9 @@ export default function AboutContent() {
return item ? item.value : ""; return item ? item.value : "";
} }
}; };
if (data.length === 0) {
return <div>Loading...</div>;
}
return ( return (
<> <>
<main> <main>
......
...@@ -8,18 +8,26 @@ export const formItems = (t: Function) => { ...@@ -8,18 +8,26 @@ export const formItems = (t: Function) => {
title: t("info"), title: t("info"),
items: [ items: [
{ {
colSpan: 12, colSpan: 8,
label: t("fname"), label: t("fname"),
type: FormItemTypes.Text, type: FormItemTypes.Text,
name: "first-name", name: "fname",
createMode: true, createMode: true,
updateMode: true, updateMode: true,
}, },
{ {
colSpan: 12, colSpan: 8,
label: t("lname"), label: t("lname"),
type: FormItemTypes.Text, type: FormItemTypes.Text,
name: "last-name", name: "lname",
createMode: true,
updateMode: true,
},
{
colSpan: 8,
label: t("username"),
type: FormItemTypes.Text,
name: "username",
createMode: true, createMode: true,
updateMode: true, updateMode: true,
}, },
...@@ -32,7 +40,15 @@ export const formItems = (t: Function) => { ...@@ -32,7 +40,15 @@ export const formItems = (t: Function) => {
updateMode: true, updateMode: true,
}, },
{ {
colSpan: 12, colSpan: 24,
label: t("password"),
type: FormItemTypes.Text,
name: "password",
createMode: true,
updateMode: true,
},
{
colSpan: 6,
label: t("gender-label"), label: t("gender-label"),
type: FormItemTypes.Select, type: FormItemTypes.Select,
name: "gender", name: "gender",
...@@ -50,33 +66,33 @@ export const formItems = (t: Function) => { ...@@ -50,33 +66,33 @@ export const formItems = (t: Function) => {
], ],
}, },
{ {
colSpan: 12, colSpan: 6,
label: t("job-label"), label: t("job-label"),
type: FormItemTypes.Select, type: FormItemTypes.Select,
name: "Job", name: "role",
createMode: true, createMode: true,
updateMode: true, updateMode: true,
options: [ options: [
{ {
label: t("male"), label: t("user"),
value: 0, value: 'user',
}, },
{ {
label: t("female"), label: t("admin"),
value: 1, value: 'admin',
}, },
], ],
}, },
{ {
colSpan: 12, colSpan: 6,
label: t("joining-date-label"), label: t("joining-date-label"),
type: FormItemTypes.DatePicker, type: FormItemTypes.DatePicker,
name: "ReceivedDate", name: "workingDate",
createMode: true, createMode: true,
updateMode: true, updateMode: true,
}, },
{ {
colSpan: 12, colSpan: 6,
label: t("country-label"), label: t("country-label"),
type: FormItemTypes.Select, type: FormItemTypes.Select,
name: "country", name: "country",
...@@ -93,14 +109,7 @@ export const formItems = (t: Function) => { ...@@ -93,14 +109,7 @@ export const formItems = (t: Function) => {
}, },
], ],
}, },
{
colSpan: 24,
label: t("description-label"),
type: FormItemTypes.TextArea,
name: "description",
createMode: true,
updateMode: true,
},
], ],
}, },
], ],
......
import { DynamicFormTypes } from "@/src/components/dynamic-form/dtos/dynamic-form.dto"; import React, { useState } from "react";
import DynamicForm from "@/src/components/dynamic-form"; import { Row, Col, Card, Form, Input, Button, message, Select, DatePicker } from "antd"; // Make sure to import the correct antd components
import { formItems } from "./add-user-data";
import useTranslation from "next-translate/useTranslation"; import useTranslation from "next-translate/useTranslation";
import { TranslationFiles } from "@/src/data/core"; import { TranslationFiles } from "@/src/data/core";
import { Register } from "@/src/services/user-service";
import { useCookies } from "react-cookie";
const { Option } = Select;
const SignUpForm = () => { const SignUpForm = () => {
const { t } = useTranslation(TranslationFiles.COMMON); const { t } = useTranslation(TranslationFiles.COMMON);
const [cookies] = useCookies([]);
const [loading, setLoading] = useState(false);
const onFinish = async (values:any) => {
try {
console.log(values);
setLoading(true);
await Register(values, cookies["token"], cookies["role"]);
setLoading(false);
message.success("User registered successfully!");
} catch (error) {
setLoading(false);
console.error(error);
message.error("Error occurred while registering user.");
}
};
return ( return (
<div data-testid="new-stock-form"> <div data-testid="new-stock-form">
<DynamicForm <Row gutter={16} justify="center">
type={DynamicFormTypes.Create} <Col span={16}>
title={t("add-new-user")} <Card title={t("add-new-user")}>
initialValues={{}} <Form
onFinish={(values) => console.log({ values })} name="signUpForm"
formCol={formItems(t)} layout="vertical"
/> onFinish={onFinish}
>
<Row gutter={16}>
<Col span={12}>
<Form.Item
label={t("fname")}
name="fname"
rules={[
{ required: true, message: "Please enter your first name." },
]}
>
<Input placeholder={t("fname")} />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label={t("lname")}
name="lname"
rules={[
{ required: true, message: "Please enter your last name." },
]}
>
<Input placeholder={t("lname")} />
</Form.Item>
</Col>
</Row>
<Row gutter={16}>
<Col span={12}>
<Form.Item
label={t("email.label")}
name="email"
rules={[
{ required: true, message: "Please enter your email." },
{ type: 'email', message: 'Please enter a valid email address.' },
]}
>
<Input placeholder={t("email.label")} />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label={t("username.label")}
name="username"
rules={[
{ required: true, message: "Please enter your username." },
]}
>
<Input placeholder={t("username")} />
</Form.Item>
</Col>
</Row>
<Form.Item
label={t("password")}
name="password"
rules={[
{ required: true, message: "Please enter your password." },
]}
>
<Input.Password placeholder={t("password")} />
</Form.Item>
<Row gutter={16}>
<Col span={12}>
<Form.Item
label={t("gender-label")}
name="gender"
rules={[
{ required: true, message: "Please select your gender." },
]}
>
<Select placeholder={t("gender")}>
<Option value="male">{t("male")}</Option>
<Option value="female">{t("female")}</Option>
</Select>
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label={t("role.label")}
name="role"
rules={[
{ required: true, message: "Please select a role." },
]}
>
<Select placeholder={t("role.label")}>
<Option value="user">{t("user")}</Option>
<Option value="admin">{t("admin")}</Option>
</Select>
</Form.Item>
</Col>
</Row>
<Row gutter={16}>
<Col span={12}>
<Form.Item
label={t("workingDate.label")}
name="workingDate"
rules={[
{ required: true, message: "Please select a working date." },
]}
>
<DatePicker placeholder={t("workingDate.label")} />
</Form.Item>
</Col>
<Col span={12}>
<Form.Item
label={t("country.label")}
name="country"
rules={[
{ required: true, message: "Please select a country." },
]}
>
<Select placeholder={t("country.label")}>
<Option value="syria">{t("syria")}</Option>
<Option value="others">{t("others")}</Option>
</Select>
</Form.Item>
</Col>
</Row>
<Form.Item>
<Button type="primary" htmlType="submit" loading={loading}>
{t("save")}
</Button>
</Form.Item>
</Form>
</Card>
</Col>
</Row>
</div> </div>
); );
}; };
export default SignUpForm; export default SignUpForm;
import React from "react"; import React from "react";
import FmsTable from "../../../../shared-library/src/tables/fms-table"; import FmsTable from "../../../../shared-library/src/tables/fms-table";
import { DataSource } from "../show-users/data-source"; // import { DataSource } from "../show-users/data-source";
import useTranslation from "next-translate/useTranslation"; import useTranslation from "next-translate/useTranslation";
import { TranslationFiles } from "@/src/data/core"; import { TranslationFiles } from "@/src/data/core";
import FmsButton from "../../../../shared-library/src/buttons/fms-button"; import FmsButton from "../../../../shared-library/src/buttons/fms-button";
...@@ -40,7 +40,7 @@ export default function CardUsers() { ...@@ -40,7 +40,7 @@ export default function CardUsers() {
{"See all".toUpperCase()} {"See all".toUpperCase()}
</FmsButton> </FmsButton>
</div> </div>
<FmsTable {/* <FmsTable
title={"users"} title={"users"}
columns={Columns} columns={Columns}
data={DataSource} data={DataSource}
...@@ -49,7 +49,7 @@ export default function CardUsers() { ...@@ -49,7 +49,7 @@ export default function CardUsers() {
// t={t} // t={t}
// setData={setData} // setData={setData}
// setColumns={setColumns} // setColumns={setColumns}
/> /> */}
</div> </div>
</div> </div>
</> </>
......
import { FormItemTypes } from "@/src/components/dynamic-form/dtos/form-item.dto.ts";
export const formItems = (t: Function) => {
return [
{
span: 24,
cards: [
{
title: t("info"),
items: [
{
colSpan: 12,
label: t("fname"),
type: FormItemTypes.Text,
name: "first-name",
createMode: true,
updateMode: true,
},
{
colSpan: 12,
label: t("lname"),
type: FormItemTypes.Text,
name: "last-name",
createMode: true,
updateMode: true,
},
{
colSpan: 12,
label: t("email.label"),
type: FormItemTypes.Text,
name: "email",
createMode: true,
updateMode: true,
},
{
colSpan: 12,
label: t("gender-label"),
type: FormItemTypes.Select,
name: "gender",
createMode: true,
updateMode: true,
options: [
{
label: t("male"),
value: 0,
},
{
label: t("female"),
value: 1,
},
],
},
{
colSpan: 12,
label: t("job-label"),
type: FormItemTypes.Select,
name: "Job",
createMode: true,
updateMode: true,
options: [
{
label: t("male"),
value: 0,
},
{
label: t("female"),
value: 1,
},
],
},
{
colSpan: 12,
label: t("joining-date-label"),
type: FormItemTypes.DatePicker,
name: "ReceivedDate",
createMode: true,
updateMode: true,
},
],
},
],
},
];
};
import React, { useEffect } from "react"; import React, { useEffect , useState} from "react";
import { Button, Checkbox, Col, Form, Input, Row } from "antd"; import { Button, Checkbox, Col, Form, Input, Row, message } from "antd";
import Image from "next/image"; import Image from "next/image";
import AuthWrapper from "./auth-wrapper"; import AuthWrapper from "./auth-wrapper";
import styles from "./auth-wrapper.module.css"; import styles from "./auth-wrapper.module.css";
import { AUTH_TOKEN } from "@/src/data/constant/app-constant";
import { useCookies } from "react-cookie"; import { useCookies } from "react-cookie";
import useTranslation from "next-translate/useTranslation"; import useTranslation from "next-translate/useTranslation";
import { TranslationFiles } from "@/src/data/core"; import { TranslationFiles } from "@/src/data/core";
import router from "next/router"; import router from "next/router";
import {
login, getUserInfo
} from "@/src/services/user-service";
import MainUtils from "@/src/utils/main";
const Login = () => { const Login = () => {
const { t } = useTranslation(TranslationFiles.COMMON); const { t } = useTranslation(TranslationFiles.COMMON);
const [cookies, setCookie, removeCookie] = useCookies([AUTH_TOKEN]); const [cookies, setCookie, removeCookie] = useCookies([]);
async function UserInfo(data:any,token:any) {
const response = await getUserInfo(data,token);
return response;
}
async function onFinishSend (values: any){
const response = await login(values);
if(!MainUtils.isEmptyObject( response)){
const info = await UserInfo(values.username, response.data);
const onFinishSend = (values: any) => { setCookie("token", response.data);
if(values.email=="admin@f.com"){ setCookie("role", info.role);
setCookie(AUTH_TOKEN, values.email, { maxAge: 60 }); setCookie("username", info.username);
if(info.role=="admin"){
router.push("/"); router.push("/");
}
else if (info.role=="user"){
router.push("/user/landing");
}
message.success("successfully authenticated!!");
} }
else if(values.email=="user@f.com"){ else{
setCookie(AUTH_TOKEN, values.email, { maxAge: 60 }); message.error("credentials are not correct");
router.push("/user/landing");
} }
}; };
const removeCookieAfterOneHour = () => { const removeCookieAfterOneHour = async () => {
removeCookie(AUTH_TOKEN); removeCookie("role", { });
removeCookie("token", { });
window.location.href = "/sign-in";
}; };
// call the removeCookieAfterOneHour function after one hour (3600000 milliseconds)
useEffect(() => { useEffect(() => {
const timeout = setTimeout(() => { const timeout = setTimeout(() => {
removeCookieAfterOneHour(); removeCookieAfterOneHour();
}, 60000); }, 360000 //000
);
return () => { return () => {
clearTimeout(timeout); clearTimeout(timeout);
}; };
...@@ -55,21 +75,21 @@ const Login = () => { ...@@ -55,21 +75,21 @@ const Login = () => {
<Row> <Row>
<Col span={24}> <Col span={24}>
<Form name="basic" layout="vertical" onFinish={onFinishSend}> <Form name="basic" layout="vertical" onFinish={onFinishSend}>
<Form.Item label={t("email.label")} className={styles.formInput}> <Form.Item label={t("username.label")} className={styles.formInput}>
<Form.Item <Form.Item
name="email" name="username"
rules={[ rules={[
{ {
required: true, required: true,
message: t("email.required-message"), message: t("email.required-message"),
}, },
{ {
type: "email", type:"string",
}, },
]} ]}
> >
<Input <Input
placeholder={t("email.placeholder")} placeholder={t("username.placeholder")}
data-testid="email" data-testid="email"
/> />
</Form.Item> </Form.Item>
......
import React, { useEffect , useState} from "react";
import useTranslation from "next-translate/useTranslation"; import useTranslation from "next-translate/useTranslation";
import { TranslationFiles } from "@/src/data/core"; import { TranslationFiles } from "@/src/data/core";
import FmsButton from "../../../../shared-library/src/buttons/fms-button"; import FmsButton from "../../../../shared-library/src/buttons/fms-button";
import { useRouter } from "next/router"; import { useRouter } from "next/router";
import { getUserInfo } from "@/src/services/user-service";
import { useCookies } from "react-cookie";
const ProfileForm = () => { const ProfileForm = () => {
const { t } = useTranslation(TranslationFiles.COMMON); const { t } = useTranslation(TranslationFiles.COMMON);
const [cookies] = useCookies([]);
const [data, setData] = useState([]);
const router = useRouter(); const router = useRouter();
useEffect(() => {
async function fetchUserInfo() {
try {
const response = await getUserInfo(cookies["username"], cookies["token"]);
setData(response);
console.log(response);
} catch (error) {
// Handle any errors that might occur during the API call
}
}
fetchUserInfo();
}, []);
if (data.length === 0) {
return <div>Loading...</div>;
}
return ( return (
<> <>
<main className="profile-page"> <main className="profile-page">
...@@ -48,11 +69,11 @@ const ProfileForm = () => { ...@@ -48,11 +69,11 @@ const ProfileForm = () => {
<div className="flex flex-wrap justify-center"> <div className="flex flex-wrap justify-center">
<div className="w-full lg:w-3/12 px-4 lg:order-2 flex justify-center"> <div className="w-full lg:w-3/12 px-4 lg:order-2 flex justify-center">
<div className="relative"> <div className="relative">
<img {/* <img
alt="..." alt="..."
src="/images/Reem.jpg" src="/images/login-image2.jpg"
className="shadow-xl rounded-full h-auto align-middle border-none absolute -m-16 -ml-20 lg:-ml-16 max-w-150-px" className="shadow-xl rounded-full h-auto align-middle border-none absolute -m-16 -ml-20 lg:-ml-16 max-w-150-px"
/> /> */}
</div> </div>
</div> </div>
<div className="w-full lg:w-4/12 px-4 lg:order-3 lg:text-right lg:self-center"> <div className="w-full lg:w-4/12 px-4 lg:order-3 lg:text-right lg:self-center">
...@@ -80,8 +101,8 @@ const ProfileForm = () => { ...@@ -80,8 +101,8 @@ const ProfileForm = () => {
</span> </span>
</div> </div>
<div className="mr-4 p-3 text-center"> <div className="mr-4 p-3 text-center">
<span className="text-xl font-bold block uppercase tracking-wide text-blueGray-600"> <span className="text-xl font-bold block tracking-wide text-blueGray-600">
10 {data.gender}
</span> </span>
<span className="text-sm text-blueGray-400"> <span className="text-sm text-blueGray-400">
{t("gender")} {t("gender")}
...@@ -89,7 +110,7 @@ const ProfileForm = () => { ...@@ -89,7 +110,7 @@ const ProfileForm = () => {
</div> </div>
<div className="lg:mr-4 p-3 text-center"> <div className="lg:mr-4 p-3 text-center">
<span className="text-xl font-bold block uppercase tracking-wide text-blueGray-600"> <span className="text-xl font-bold block uppercase tracking-wide text-blueGray-600">
89 {data.workingDate}
</span> </span>
<span className="text-sm text-blueGray-400"> <span className="text-sm text-blueGray-400">
{t("start-working-date")} {t("start-working-date")}
...@@ -99,20 +120,23 @@ const ProfileForm = () => { ...@@ -99,20 +120,23 @@ const ProfileForm = () => {
</div> </div>
</div> </div>
<div className="text-center mt-12"> <div className="text-center mt-12">
<h3 className="text-4xl font-semibold leading-normal mb-2 text-blueGray-700 mb-2"> <h3 className="text-4xl font-semibold uppercase leading-normal mb-2 text-blueGray-700 mb-2">
REEM HASAN {data.username}
</h3> </h3>
<div className="text-sm leading-normal mt-0 mb-2 text-blueGray-400 font-bold uppercase"> <div className="text-sm leading-normal mt-0 mb-2 text-blueGray-400 font-bold uppercase">
<i className="fas fa-map-marker-alt mr-2 text-lg text-blueGray-400"></i>{" "} <i className="fas fa-map-marker-alt mr-2 text-lg text-blueGray-400"></i>{" "}
Syria-Damascus {data.country}
</div>
<div className="text-sm leading-normal mt-0 mb-2 text-blueGray-400 font-bold uppercase">
<i className="fas fa-map-marker-alt mr-2 text-lg text-blueGray-400"></i>{" "}
{data.email}
</div> </div>
</div> </div>
<div className="mt-10 py-10 border-t border-blueGray-200 text-center"> <div className="mt-10 py-10 border-t border-blueGray-200 text-center">
<div className="flex flex-wrap justify-center"> <div className="flex flex-wrap justify-center">
<div className="w-full lg:w-9/12 px-4"> <div className="w-full lg:w-9/12 px-4">
<p className="mb-4 text-lg leading-relaxed text-blueGray-700"> <p className="mb-4 text-lg leading-relaxed text-blueGray-700">
Site Admin {`${data.fname} ${data.lname}`}
</p> </p>
<div className="mb-2 text-lightBlue-500 mt-10"> <div className="mb-2 text-lightBlue-500 mt-10">
<i className="fas fa-briefcase mr-2 text-lg text-blueGray-400"></i> <i className="fas fa-briefcase mr-2 text-lg text-blueGray-400"></i>
...@@ -120,7 +144,7 @@ const ProfileForm = () => { ...@@ -120,7 +144,7 @@ const ProfileForm = () => {
</div> </div>
<div className="mb-2 text-lightBlue-500"> <div className="mb-2 text-lightBlue-500">
<i className="fas fa-university mr-2 text-lg "></i> <i className="fas fa-university mr-2 text-lg "></i>
Site Admin {data.role}
</div> </div>
</div> </div>
</div> </div>
......
import useTranslation from "next-translate/useTranslation";
import { TranslationFiles } from "@/src/data/core";
import FmsButton from "../../../../shared-library/src/buttons/fms-button";
import { useRouter } from "next/router";
const UserProfileForm = () => {
const { t } = useTranslation(TranslationFiles.COMMON);
const router = useRouter();
return (
<>
<main className="profile-page">
<section className="relative block h-500-px">
<div
className="absolute top-0 w-full h-full bg-center bg-cover"
style={{
backgroundImage:
"url('https://images.unsplash.com/photo-1499336315816-097655dcfbda?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2710&q=80')",
}}
>
<span
id="blackOverlay"
className="w-full h-full absolute opacity-50 bg-black"
></span>
</div>
<div
className="top-auto bottom-0 left-0 right-0 w-full absolute pointer-events-none overflow-hidden h-16"
style={{ transform: "translateZ(0)" }}
>
<svg
className="absolute bottom-0 overflow-hidden"
xmlns="http://www.w3.org/2000/svg"
preserveAspectRatio="none"
version="1.1"
viewBox="0 0 2560 100"
x="0"
y="0"
>
<polygon
className="text-blueGray-200 fill-current"
points="2560 0 2560 100 0 100"
></polygon>
</svg>
</div>
</section>
<section className="relative py-16 bg-blueGray-200">
<div className="container mx-auto px-4">
<div className="relative flex flex-col min-w-0 break-words bg-white w-full mb-6 shadow-xl rounded-lg -mt-64">
<div className="px-6">
<div className="flex flex-wrap justify-center">
<div className="w-full lg:w-3/12 px-4 lg:order-2 flex justify-center">
<div className="relative">
<img
alt="..."
src="/images/Reem.jpg"
className="shadow-xl rounded-full h-auto align-middle border-none absolute -m-16 -ml-20 lg:-ml-16 max-w-150-px"
/>
</div>
</div>
<div className="w-full lg:w-4/12 px-4 lg:order-3 lg:text-right lg:self-center">
{/* <div className="py-6 px-3 mt-32 sm:mt-0">
<FmsButton
className="bg-blueGray-700 active:bg-blueGray-600 uppercase text-white font-bold hover:shadow-md shadow text-xs px-4 py-2 rounded outline-none focus:outline-none sm:mr-2 mb-1 ease-linear transition-all duration-150"
type="primary"
borderRadius="32"
onClick={() => {
router.push("/setup/setting-profile-content");
}}
>
{t("edit")}
</FmsButton>
</div> */}
</div>
<div className="w-full lg:w-4/12 px-4 lg:order-1">
<div className="flex justify-center py-4 lg:pt-4 pt-8">
<div className="mr-4 p-3 text-center">
<span className="text-xl font-bold block uppercase tracking-wide text-blueGray-600">
</span>
<span className="text-sm text-blueGray-400">
</span>
</div>
<div className="mr-4 p-3 text-center">
<span className="text-xl font-bold block uppercase tracking-wide text-blueGray-600">
10
</span>
<span className="text-sm text-blueGray-400">
{t("gender")}
</span>
</div>
<div className="lg:mr-4 p-3 text-center">
<span className="text-xl font-bold block uppercase tracking-wide text-blueGray-600">
89
</span>
<span className="text-sm text-blueGray-400">
{t("start-working-date")}
</span>
</div>
</div>
</div>
</div>
<div className="text-center mt-12">
<h3 className="text-4xl font-semibold leading-normal mb-2 text-blueGray-700 mb-2">
REEM HASAN
</h3>
<div className="text-sm leading-normal mt-0 mb-2 text-blueGray-400 font-bold uppercase">
<i className="fas fa-map-marker-alt mr-2 text-lg text-blueGray-400"></i>{" "}
Syria-Damascus
</div>
</div>
<div className="mt-10 py-10 border-t border-blueGray-200 text-center">
<div className="flex flex-wrap justify-center">
<div className="w-full lg:w-9/12 px-4">
<p className="mb-4 text-lg leading-relaxed text-blueGray-700">
Site Admin
</p>
<div className="mb-2 text-lightBlue-500 mt-10">
<i className="fas fa-briefcase mr-2 text-lg text-blueGray-400"></i>
{t("role")}
</div>
<div className="mb-2 text-lightBlue-500">
<i className="fas fa-university mr-2 text-lg "></i>
Site Admin
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</main>
</>
);
};
export default UserProfileForm;
...@@ -11,7 +11,7 @@ const Setting = () => { ...@@ -11,7 +11,7 @@ const Setting = () => {
const router = useRouter(); const router = useRouter();
return ( return (
<> <>
<Divider orientation="left">{t("setting-pages")}</Divider> <Divider orientation="left">{t("setting-about-page")}</Divider>
<Col span={24} className={"pd"}> <Col span={24} className={"pd"}>
<FmsButton <FmsButton
...@@ -25,7 +25,7 @@ const Setting = () => { ...@@ -25,7 +25,7 @@ const Setting = () => {
{t("About-page-setting").toUpperCase()} {t("About-page-setting").toUpperCase()}
</FmsButton> </FmsButton>
</Col> </Col>
<Divider orientation="left"></Divider> <Divider orientation="left">{t("setting-profile-page")}</Divider>
<Col span={12}className={"pd"} > <Col span={12}className={"pd"} >
<FmsButton <FmsButton
type="move" type="move"
......
...@@ -10,6 +10,7 @@ import { ...@@ -10,6 +10,7 @@ import {
sendEmailMessage, sendEmailMessage,
} from "@/src/services/setting-service"; } from "@/src/services/setting-service";
import MainUtils from "../../utils/main"; import MainUtils from "../../utils/main";
import { useCookies } from "react-cookie";
export default function SettingAboutContent() { export default function SettingAboutContent() {
const { t } = useTranslation(TranslationFiles.COMMON); const { t } = useTranslation(TranslationFiles.COMMON);
const router = useRouter(); const router = useRouter();
...@@ -21,8 +22,9 @@ export default function SettingAboutContent() { ...@@ -21,8 +22,9 @@ export default function SettingAboutContent() {
const [sendingStatus, setSendingStatus] = useState(""); const [sendingStatus, setSendingStatus] = useState("");
const [data, setData] = useState([]); const [data, setData] = useState([]);
const [cookies] = useCookies([]);
async function sendMessage() { async function sendMessage() {
const response = await sendEmailMessage(formData); const response = await sendEmailMessage(formData,cookies["token"],cookies["role"]);
console.log(response); console.log(response);
if (response == true) { if (response == true) {
setSendingStatus("success"); setSendingStatus("success");
...@@ -34,7 +36,7 @@ export default function SettingAboutContent() { ...@@ -34,7 +36,7 @@ export default function SettingAboutContent() {
for (let i = 0; i < data.length; i++) { for (let i = 0; i < data.length; i++) {
console.log("data", data[i]); console.log("data", data[i]);
if (!MainUtils.isEmptyValue( data[i].value)) { if (!MainUtils.isEmptyValue( data[i].value)) {
const response = await UpdateAboutSettingData(data[i]); const response = await UpdateAboutSettingData(data[i],cookies["token"],cookies["role"]);
console.log(response); console.log(response);
if (!MainUtils.isEmptyObject(response)) { if (!MainUtils.isEmptyObject(response)) {
message.success(data[i].key+" Updated successfully"); message.success(data[i].key+" Updated successfully");
......
import { useState } from "react"; import { useState, useEffect } from "react";
import useTranslation from "next-translate/useTranslation"; import useTranslation from "next-translate/useTranslation";
import { TranslationFiles } from "@/src/data/core"; import { TranslationFiles } from "@/src/data/core";
import FmsButton from "../../../../shared-library/src/buttons/fms-button"; import FmsButton from "../../../../shared-library/src/buttons/fms-button";
import { DatePicker, Input, Select } from "antd"; import { DatePicker, Input, Select, message } from "antd";
import { FileAddOutlined, UploadOutlined } from "@ant-design/icons"; import { getUserInfo, UpdateUserInfo } from "@/src/services/user-service";
import { useCookies } from "react-cookie";
import { useRouter } from "next/router";
const SettingProfileContent = () => { const SettingProfileContent = () => {
const { t } = useTranslation(TranslationFiles.COMMON); const { t } = useTranslation(TranslationFiles.COMMON);
const [imageSrc, setImageSrc] = useState("/images/Reem.jpg"); const [data, setData] = useState([]);
const [cookies] = useCookies([]);
const router = useRouter();
useEffect(() => {
async function fetchUserInfo() {
try {
const response = await getUserInfo(cookies["username"], cookies["token"]);
setData(response);
console.log(response);
} catch (error) {
}
}
const handleImageUpload = (e) => { fetchUserInfo();
const file = e.target.files[0]; }, []);
const reader = new FileReader(); const handleUpdate = async () => {
reader.onloadend = () => { try {
setImageSrc(reader.result); const response = await UpdateUserInfo(
}; data,
reader.readAsDataURL(file); cookies["token"],
cookies["role"]
);
message.success("your profile information updated successfully.");
router.push("/profile");
} catch (error) {
message.error("Error updating profile information.");
}
}; };
if (data.length === 0) {
return <div>Loading...</div>;
}
return ( return (
<> <>
<main className="profile-page"> <main className="profile-page">
...@@ -60,33 +86,6 @@ const SettingProfileContent = () => { ...@@ -60,33 +86,6 @@ const SettingProfileContent = () => {
<div className="flex flex-wrap justify-center"> <div className="flex flex-wrap justify-center">
<div className="w-full lg:w-3/12 px-4 lg:order-2 flex justify-center"> <div className="w-full lg:w-3/12 px-4 lg:order-2 flex justify-center">
<div className="relative"> <div className="relative">
<label htmlFor="image-upload" className="file-input-label">
<img
alt="..."
src={imageSrc}
className="shadow-xl rounded-full h-auto align-middle border-none absolute -m-16 -ml-20 lg:-ml-16 max-w-150-px"
/>
<div className="add-image-button pd-top">
<FmsButton
type={"secondary"}
className={"pd-top"}
size={"large"}
borderRadius={8}
onclick={
handleImageUpload
}
>
<input
type="file"
id="image-upload"
accept=".jpg,.jpeg,.png"
onChange={handleImageUpload}
// className="hidden"
/>
</FmsButton>
</div>
</label>
</div> </div>
</div> </div>
<div className="w-full lg:w-4/12 px-4 lg:order-3 lg:text-right lg:self-center"> <div className="w-full lg:w-4/12 px-4 lg:order-3 lg:text-right lg:self-center">
...@@ -95,7 +94,7 @@ const SettingProfileContent = () => { ...@@ -95,7 +94,7 @@ const SettingProfileContent = () => {
className="bg-blueGray-700 active:bg-blueGray-600 uppercase text-white font-bold hover:shadow-md shadow text-xs px-4 py-2 rounded outline-none focus:outline-none sm:mr-2 mb-1 ease-linear transition-all duration-150" className="bg-blueGray-700 active:bg-blueGray-600 uppercase text-white font-bold hover:shadow-md shadow text-xs px-4 py-2 rounded outline-none focus:outline-none sm:mr-2 mb-1 ease-linear transition-all duration-150"
type="primary" type="primary"
borderRadius="32" borderRadius="32"
onClick={handleUpdate}
> >
{t("save")} {t("save")}
</FmsButton> </FmsButton>
...@@ -112,24 +111,21 @@ const SettingProfileContent = () => { ...@@ -112,24 +111,21 @@ const SettingProfileContent = () => {
</span> </span>
</div> </div>
<div className="pd-top mr-4 p-3 text-center"> <div className="pd-top mr-4 p-3 text-center">
<span className=" text-xl font-bold block uppercase tracking-wide text-blueGray-600"> <span className=" text-xl font-bold block tracking-wide text-blueGray-600">
<Select <Select
placeholder={t("gender")} value={data.gender}
// value={""} onChange={(e) =>
onChange={(e: any) => setData({ ...data, gender: e })
{} }>
} <Select.Option value="male">{t("male")}</Select.Option>
/> <Select.Option value="female">{t("female")}</Select.Option>
</Select>
</span> </span>
</div> </div>
<div className="pd-top lg:mr-4 p-3 text-center"> <div className="pd-top lg:mr-4 p-3 text-center">
<span className="text-xl font-bold block uppercase tracking-wide text-blueGray-600"> <span className="text-xl font-bold block uppercase tracking-wide text-blueGray-600">
<DatePicker {data.workingDate}
placeholder={t("start-working-date")}
// value={""}
onChange={(e: any) =>
{}}/>
</span> </span>
</div> </div>
</div> </div>
...@@ -139,47 +135,75 @@ const SettingProfileContent = () => { ...@@ -139,47 +135,75 @@ const SettingProfileContent = () => {
<h3 className="text-4xl font-semibold leading-normal mb-2 text-blueGray-700 mb-2"> <h3 className="text-4xl font-semibold leading-normal mb-2 text-blueGray-700 mb-2">
<Input <Input
className={"med-size"} className={"med-size"}
placeholder={"name"} placeholder={"username"}
// value={""} value={data.username}
onChange={(e: any) => onChange={(e) =>
{} setData({ ...data, username: e.target.value })
}/> }
/>
</h3> </h3>
<div className="text-sm leading-normal mt-0 mb-2 text-blueGray-400 font-bold uppercase"> <div className="text-sm leading-normal mt-0 mb-2 text-blueGray-400 font-bold uppercase">
<i className="fas fa-map-marker-alt text-lg text-blueGray-400"></i> <i className="fas fa-map-marker-alt text-lg text-blueGray-400"></i>
<Input <Input
className={"med-size"} className={"med-size"}
placeholder={"country"} placeholder={"username"}
// value={""} value={data.country}
onChange={(e: any) => onChange={(e) =>
{} setData({ ...data, country: e.target.value })
}/> }
/>
</div> </div>
<div className="text-sm leading-normal mt-0 mb-2 text-blueGray-400 font-bold uppercase">
<i className="fas fa-map-marker-alt text-lg text-blueGray-400"></i>
<Input
className={"med-size"}
placeholder={"email"}
value={data.email}
onChange={(e) =>
setData({ ...data, email: e.target.value })
}
/>
</div>
</div> </div>
<div className="mt-10 py-10 border-t border-blueGray-200 text-center"> <div className="mt-10 py-10 border-t border-blueGray-200 text-center">
<div className="flex flex-wrap justify-center"> <div className="flex flex-wrap justify-center">
<div className="w-full lg:w-9/12 px-4"> <div className="w-full lg:w-9/12 px-4">
<p className="mb-4 text-lg leading-relaxed text-blueGray-700"> <p className="mb-4 text-lg leading-relaxed text-blueGray-700">
<Input <Input
placeholder={"role"} className={"med-size"}
// value={""} placeholder={"fname"}
onChange={(e: any) => value={data.fname}
{} onChange={(e) =>
}/> setData({ ...data, fname: e.target.value })
}
/>
<span />
<Input
className={"med-size"}
placeholder={"lname"}
value={data.lname}
onChange={(e) =>
setData({ ...data, lname: e.target.value })
}
/>
</p> </p>
<div className="mb-2 text-lightBlue-500 mt-10"> <div className="mb-2 text-lightBlue-500 mt-10">
<i className="fas fa-briefcase mr-2 text-lg text-blueGray-400"></i> <i className="fas fa-briefcase mr-2 text-lg text-blueGray-400"></i>
{t("description")} {t("role")}
</div> </div>
<div className="mb-2 text-lightBlue-500"> <div className="mb-2 text-lightBlue-500">
<i className="fas fa-university mr-2 text-lg "></i> <i className="fas fa-university mr-2 text-lg "></i>
<Input.TextArea
placeholder={"description"} <Select
// value={""} value={data.role}
onChange={(e: any) => onChange={(e) =>
{} setData({ ...data, role: e.target.value })
}/> }>
<Select.Option value="user">{t("user")}</Select.Option>
<Select.Option value="admin">{t("admin")}</Select.Option>
</Select>
</div> </div>
</div> </div>
</div> </div>
......
...@@ -10,7 +10,7 @@ import ShowDetailsPopup from "./show-details-popup"; ...@@ -10,7 +10,7 @@ import ShowDetailsPopup from "./show-details-popup";
import axios from "axios"; import axios from "axios";
import { Spin } from "antd"; import { Spin } from "antd";
import { fetchData } from "@/src/services/traps-service"; import { fetchData } from "@/src/services/traps-service";
import { useCookies } from "react-cookie";
export default function ShowTraps() { export default function ShowTraps() {
const { t } = useTranslation(TranslationFiles.COMMON); const { t } = useTranslation(TranslationFiles.COMMON);
const [modalProps, setModalProps] = useState({ const [modalProps, setModalProps] = useState({
...@@ -20,9 +20,10 @@ export default function ShowTraps() { ...@@ -20,9 +20,10 @@ export default function ShowTraps() {
const { data, new_val, setNewVal } = useContext(DataContext); const { data, new_val, setNewVal } = useContext(DataContext);
const [data1, setData1] = useState([]); const [data1, setData1] = useState([]);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [cookies] = useCookies([]);
useEffect(() => { useEffect(() => {
setLoading(true); setLoading(true);
fetchData().then((transformedData) => { fetchData(cookies["token"]).then((transformedData) => {
if(transformedData) if(transformedData)
setData1(transformedData); setData1(transformedData);
if(new_val!=null){ if(new_val!=null){
......
import { useRouter } from "next/router"; import {Col, DatePicker, Input, Row } from "antd";
import FmsButton from "../../../../shared-library/src/buttons/fms-button"; import FmsButton from "../../../../shared-library/src/buttons/fms-button";
export function getColumns(setModalProps:any) { export function getColumns(setModalProps:any) {
const { RangePicker } = DatePicker;
return [ return [
{ {
title: "Name", title: "first-name",
dataIndex: "name", dataIndex: "fname",
key: "name", key: "fname",
resizable: true,
sorter: (a:any, b:any) => a.fname.localeCompare(b.fname),
sortDirections: ['descend', 'ascend'],
filterDropdown: ({ setSelectedKeys, selectedKeys, confirm }:any) => (
<div style={{ padding: 8 }}>
<Input
placeholder="Search"
value={selectedKeys[0]}
onChange={(e:any) => setSelectedKeys(e.target.value ? [e.target.value] : [])}
onPressEnter={confirm}
style={{ width: 188, marginBottom: 8, display: 'block' }}
/>
<Row gutter={12}>
<Col>
<FmsButton
type="primary"
onClick={confirm}
size="small"
borderRadius={10}
>
{"Search"}
</FmsButton>
</Col>
</Row>
</div>
),
onFilter: (value:any, record:any) => record.fname.toLowerCase().includes(value.toLowerCase()),
},
{
title: "last-name",
dataIndex: "lname",
key: "lname",
resizable: true,
sorter: (a:any, b:any) => a.lname.localeCompare(b.lname),
sortDirections: ['descend', 'ascend'],
filterDropdown: ({ setSelectedKeys, selectedKeys, confirm }:any) => (
<div style={{ padding: 8 }}>
<Input
placeholder="Search"
value={selectedKeys[0]}
onChange={(e:any) => setSelectedKeys(e.target.value ? [e.target.value] : [])}
onPressEnter={confirm}
style={{ width: 188, marginBottom: 8, display: 'block' }}
/>
<Row gutter={12}>
<Col>
<FmsButton
type="primary"
onClick={confirm}
size="small"
borderRadius={10}
>
{"Search"}
</FmsButton>
</Col>
</Row>
</div>
),
onFilter: (value:any, record:any) => record.lname.toLowerCase().includes(value.toLowerCase()),
},
{
title: "username",
dataIndex: "username",
key: "username",
resizable: true,
sorter: (a:any, b:any) => a.username.localeCompare(b.username),
sortDirections: ['descend', 'ascend'],
filterDropdown: ({ setSelectedKeys, selectedKeys, confirm }:any) => (
<div style={{ padding: 8 }}>
<Input
placeholder="Search"
value={selectedKeys[0]}
onChange={(e:any) => setSelectedKeys(e.target.value ? [e.target.value] : [])}
onPressEnter={confirm}
style={{ width: 188, marginBottom: 8, display: 'block' }}
/>
<Row gutter={12}>
<Col>
<FmsButton
type="primary"
onClick={confirm}
size="small"
borderRadius={10}
>
{"Search"}
</FmsButton>
</Col>
</Row>
</div>
),
onFilter: (value:any, record:any) => record.username.toLowerCase().includes(value.toLowerCase()),
},
{
title: "email",
dataIndex: "email",
key: "email",
resizable: true,
sorter: (a:any, b:any) => a.email.localeCompare(b.email),
sortDirections: ['descend', 'ascend'],
filterDropdown: ({ setSelectedKeys, selectedKeys, confirm }:any) => (
<div style={{ padding: 8 }}>
<Input
placeholder="Search"
value={selectedKeys[0]}
onChange={(e:any) => setSelectedKeys(e.target.value ? [e.target.value] : [])}
onPressEnter={confirm}
style={{ width: 188, marginBottom: 8, display: 'block' }}
/>
<Row gutter={12}>
<Col>
<FmsButton
type="primary"
onClick={confirm}
size="small"
borderRadius={10}
>
{"Search"}
</FmsButton>
</Col>
</Row>
</div>
),
onFilter: (value:any, record:any) => record.email.toLowerCase().includes(value.toLowerCase()),
}, },
{ {
title: "Age", title: "gender",
dataIndex: "age", dataIndex: "gender",
key: "age", key: "gender",
resizable: true,
sorter: (a:any, b:any) => a.gender.localeCompare(b.gender),
sortDirections: ['descend', 'ascend'],
filterDropdown: ({ setSelectedKeys, selectedKeys, confirm }:any) => (
<div style={{ padding: 8 }}>
<Input
placeholder="Search"
value={selectedKeys[0]}
onChange={(e:any) => setSelectedKeys(e.target.value ? [e.target.value] : [])}
onPressEnter={confirm}
style={{ width: 188, marginBottom: 8, display: 'block' }}
/>
<Row gutter={12}>
<Col>
<FmsButton
type="primary"
onClick={confirm}
size="small"
borderRadius={10}
>
{"Search"}
</FmsButton>
</Col>
</Row>
</div>
),
onFilter: (value:any, record:any) => record.gender.toLowerCase().includes(value.toLowerCase()),
},
{
title: "role",
dataIndex: "role",
key: "role",
resizable: true,
sorter: (a:any, b:any) => a.role.localeCompare(b.role),
sortDirections: ['descend', 'ascend'],
filterDropdown: ({ setSelectedKeys, selectedKeys, confirm }:any) => (
<div style={{ padding: 8 }}>
<Input
placeholder="Search"
value={selectedKeys[0]}
onChange={(e:any) => setSelectedKeys(e.target.value ? [e.target.value] : [])}
onPressEnter={confirm}
style={{ width: 188, marginBottom: 8, display: 'block' }}
/>
<Row gutter={12}>
<Col>
<FmsButton
type="primary"
onClick={confirm}
size="small"
borderRadius={10}
>
{"Search"}
</FmsButton>
</Col>
</Row>
</div>
),
onFilter: (value:any, record:any) => record.role.toLowerCase().includes(value.toLowerCase()),
}, },
{ {
title: "Address", title: "workingDate",
dataIndex: "address", dataIndex: "workingDate",
key: "address", key: "workingDate",
sorter: (a: any, b: any) => a.workingDate.localeCompare(b.workingDate),
sortDirections: ['descend', 'ascend'],
filterDropdown: ({ setSelectedKeys, selectedKeys, confirm, clearFilters }: any) => (
<div style={{ padding: 8 }}>
<RangePicker
value={selectedKeys[0]}
onChange={(value: any) => setSelectedKeys(value ? [value] : [])}
onOk={confirm}
style={{ marginBottom: "8px", display: 'block' }}
/>
<Row gutter={12}>
<Col>
<FmsButton
type="primary"
onClick={confirm}
size="small"
borderRadius={10}
style={{ marginRight: 8 }}
>
{"Search"}
</FmsButton>
</Col>
</Row>
</div>
),
onFilter: (value: any, record: any) => {
const [start, end] = value;
const date = new Date(record.workingDate); // Convert to a Date object
return (
(!start || date >= start.startOf('day')) &&
(!end || date <= end.endOf('day'))
);
},
},
{
title: "country",
dataIndex: "country",
key: "country",
resizable: true,
sorter: (a:any, b:any) => a.country.localeCompare(b.country),
sortDirections: ['descend', 'ascend'],
filterDropdown: ({ setSelectedKeys, selectedKeys, confirm }:any) => (
<div style={{ padding: 8 }}>
<Input
placeholder="Search"
value={selectedKeys[0]}
onChange={(e:any) => setSelectedKeys(e.target.value ? [e.target.value] : [])}
onPressEnter={confirm}
style={{ width: 188, marginBottom: 8, display: 'block' }}
/>
<Row gutter={12}>
<Col>
<FmsButton
type="primary"
onClick={confirm}
size="small"
borderRadius={10}
>
{"Search"}
</FmsButton>
</Col>
</Row>
</div>
),
onFilter: (value:any, record:any) => record.country.toLowerCase().includes(value.toLowerCase()),
}, },
{ {
title: "Actions", title: "Actions",
...@@ -23,7 +272,9 @@ export function getColumns(setModalProps:any) { ...@@ -23,7 +272,9 @@ export function getColumns(setModalProps:any) {
render: (text: any, record: any) => ( render: (text: any, record: any) => (
<FmsButton <FmsButton
type="primary" type="primary"
onClick={() => setModalProps({ isOpen: true, data: null})} size="middle"
borderRadius={32}
onClick={() => setModalProps({ isOpen: true, data: record })}
> >
{"edit"} {"edit"}
</FmsButton> </FmsButton>
......
type RoutesType = {
id: string;
name: string;
age: number;
address: string;
};
export const DataSource: Array<RoutesType> = [
{
id: "1",
name: "John Brown",
age: 1,
address: "New York No. 1 Lake Park",
},
{
id: "2",
name: "Jim Green",
age: 2,
address: "London No. 1 Lake Park",
},
{
id: "3",
name: "Joe Black",
age: 3,
address: "Sidney No. 1 Lake Park",
},
{
id: "4",
name: "Joe Black",
age: 4,
address: "Sidney No. 1 Lake Park",
},
{
id: "5",
name: "Joe Black",
age: 5,
address: "Sidney No. 1 Lake Park",
},
{
id: "6",
name: "Joe Black",
age: 6,
address: "Sidney No. 1 Lake Park",
},
{
id: "7",
name: "Joe Black",
age: 7,
address: "Sidney No. 1 Lake Park",
},
{
id: "8",
name: "Joe Black",
age: 8,
address: "Sidney No. 1 Lake Park",
},
{
id: "9",
name: "Joe Black",
age: 9,
address: "Sidney No. 1 Lake Park",
},
{
id: "10",
name: "Joe Black",
age: 10,
address: "Sidney No. 1 Lake Park",
},
{
id: "11",
name: "Joe Black",
age: 11,
address: "Sidney No. 1 Lake Park",
},
{
id: "12",
name: "Joe Black",
age: 12,
address: "Sidney No. 1 Lake Park",
},
{
id: "13",
name: "Joe Black",
age: 13,
address: "Sidney No. 1 Lake Park",
},
];
import React, {useState, useEffect} from "react"; import React, { useState, useEffect } from "react";
import { Col, DatePicker, Input, Modal, Row, Select } from "antd"; import {
Button,
Card,
Col,
DatePicker,
Form,
Input,
Modal,
Row,
Select,
message,
} from "antd";
import useTranslation from "next-translate/useTranslation"; import useTranslation from "next-translate/useTranslation";
import { TranslationFiles } from "@/src/data/core"; import { TranslationFiles } from "@/src/data/core";
import { UpdateUserInfo } from "@/src/services/user-service";
import { useCookies } from "react-cookie";
import MainUtils from "@/src/utils/main";
interface Props { interface Props {
modalProps: any; modalProps: any;
setModalProps: any; setModalProps: any;
} }
export default function EditUserPopup({ modalProps, setModalProps }: Props) { export default function EditUserPopup({ modalProps, setModalProps }: Props) {
const { t } = useTranslation(TranslationFiles.COMMON); const { t } = useTranslation(TranslationFiles.COMMON);
const [isModalOpen,setIsModalOpen] = useState(false); const [isModalOpen, setIsModalOpen] = useState(false);
const [userData, setUserData] = useState<any>(null);
const [cookies] = useCookies([]);
const handleCancel = () => { const handleCancel = () => {
setModalProps(false,null); setModalProps(false, null);
}; };
useEffect(() => { useEffect(() => {
console.log(MainUtils.cloneObject( modalProps.data));
setIsModalOpen(modalProps.isOpen); setIsModalOpen(modalProps.isOpen);
}, [modalProps]) setUserData(modalProps.data);
return ( }, [modalProps]);
<Modal title="edit-user" visible={isModalOpen} onOk={handleCancel} onCancel={handleCancel}>
<Row gutter={[12, 12]}> const handleUpdate = async () => {
<Col span={24}> try {
<Input /> const response = await UpdateUserInfo(
</Col> userData,
<Col span={24}> cookies["token"],
<Input /> cookies["role"]
</Col> );
<Col span={24}>
<Select />
</Col>
<Col span={24}>
<Select />
</Col>
<Col span={24}>
<Select />
</Col>
<Col span={24}>
<DatePicker />
</Col>
<Col span={24}>
<Input.TextArea />
</Col>
</Row>
</Modal> message.success("User information updated successfully.");
setModalProps(false, null);
} catch (error) {
message.error("Error updating user information.");
}
};
return (
<Modal
title="edit-user"
visible={isModalOpen}
onOk={handleUpdate}
onCancel={handleCancel}
>
<Row gutter={16} justify="center">
<Col span={16}>
<Form initialValues={userData} onFinish={handleUpdate}>
<Form.Item label="first-name" name="fname">
<Input
onChange={(e) =>
setUserData({ ...userData, fname: e.target.value })
}
/>
</Form.Item>
<Form.Item label="last-name" name="lname">
<Input
onChange={(e) =>
setUserData({ ...userData, lname: e.target.value })
}
/>
</Form.Item>
<Form.Item label="username"
name="username"
>
<Input
onChange={(e) =>
setUserData({ ...userData, username: e.target.value })
}
/>
</Form.Item>
<Form.Item label="email"
name="email"
rules={[
{ type: 'email' },
]}
>
<Input
onChange={(e) =>
setUserData({ ...userData, email: e.target.value })
}
/>
</Form.Item>
<Form.Item
label={t("password")}
name="password"
>
<Input.Password
onChange={(e) =>
setUserData({ ...userData, password: e.target.value })
} />
</Form.Item>
<Form.Item label={t("gender-label")} name="gender" >
<Select onChange={(e) =>
setUserData({ ...userData, gender: e })
}>
<Select.Option value="male">{t("male")}</Select.Option>
<Select.Option value="female">{t("female")}</Select.Option>
</Select>
</Form.Item>
<Form.Item label={t("role.label")} name="role">
<Select
onChange={(e) =>
setUserData({ ...userData, role: e })
}>
<Select.Option value="user">{t("user")}</Select.Option>
<Select.Option value="admin">{t("admin")}</Select.Option>
</Select>
</Form.Item>
{/* <Form.Item label={t("workingDate.label")} name="workingDate" >
<DatePicker />
</Form.Item> */}
<Form.Item label={t("country.label")} name="country" >
<Select onChange={(e) =>
setUserData({ ...userData, country: e })
}>
<Select.Option value="syria">{t("syria")}</Select.Option>
<Select.Option value="others">{t("others")}</Select.Option>
</Select>
</Form.Item>
</Form>
</Col>
</Row>
</Modal>
); );
} }
\ No newline at end of file
import * as React from "react"; import * as React from "react";
import { useState } from "react"; import { useState ,useEffect } from "react";
import useTranslation from "next-translate/useTranslation"; import useTranslation from "next-translate/useTranslation";
import { TranslationFiles } from "@/src/data/core"; import { TranslationFiles } from "@/src/data/core";
import FmsTable from "../../../../shared-library/src/tables/fms-table"; import FmsTable from "../../../../shared-library/src/tables/fms-table";
import { getColumns } from "./columns"; import { getColumns } from "./columns";
import { DataSource } from "./data-source"; import EditUserPopup from "./edit-user-popup";
import EditUserPopup from "./edit-user-popup" import { getAllUsers, deleteUser } from "@/src/services/user-service";
import { useCookies } from "react-cookie";
import { message } from "antd";
import FmsButton from "../../../../shared-library/src/buttons/fms-button";
export default function ShowUsers() { export default function ShowUsers() {
const { t } = useTranslation(TranslationFiles.COMMON); const { t } = useTranslation(TranslationFiles.COMMON);
const [modalProps, setModalProps] = useState({ const [modalProps, setModalProps] = useState({
isOpen: false, isOpen: false,
data: null, data: null,
}); });
const [data, setData] = useState(DataSource); const [data, setData] = useState([]);
const [selectedRowKeys, setSelectedRowKeys] = useState<string[]>([]);
const [cookies] = useCookies([]);
// Fetch data when the component mounts using useEffect
useEffect(() => {
const fetchData = async () => {
try {
const response = await getAllUsers(cookies["token"], cookies["role"]);
setData(response);
console.log(response);
} catch (error) {
console.error("Error fetching data:", error);
}
};
fetchData();
}, []);
const handleDeleteMultiple = async () => {
if (selectedRowKeys.length === 0) {
message.warning("Please select at least one row to delete.");
return;
}
try {
// Delete selected rows on the server
await Promise.all(selectedRowKeys.map((id:any) => deleteUser(id, cookies["token"], cookies["role"])));
// After successful deletion, update the table data by filtering out the deleted records
setData((prevData) =>
prevData.filter((item) => !selectedRowKeys.includes(item.id))
);
// Clear the selectedRowKeys state after deletion
setSelectedRowKeys([]);
message.success("Selected rows deleted successfully.");
} catch (error) {
console.error("Error deleting users:", error);
message.error("An error occurred while deleting selected rows.");
}
};
return ( return (
<div> <div>
<div className={"moreIcon"} >
<FmsButton borderRadius= {32} type={"danger"} onClick={handleDeleteMultiple} >{t("delete-selected")}</FmsButton>
</div>
<FmsTable <FmsTable
title={t("users")} title={t("users")}
columns={getColumns(setModalProps)} columns={getColumns(setModalProps)}
data={data} data={data}
rowSelection={{ rowSelection={{
type: "checkbox", type: "checkbox",
selectedRowKeys,
onChange: (selectedKeys) => {
setSelectedRowKeys(selectedKeys);
},
}} }}
t={t} t={t}
setData= {setData} setData= {setData}
......
let websocket: WebSocket | null = new WebSocket("ws://192.168.93.198:6647/fms-websocket"); let websocket: WebSocket | null = new WebSocket("ws://localhost:6647/fms-websocket");
websocket.onopen = function () { websocket.onopen = function () {
console.log("Connected to WebSocket server"); console.log("Connected to WebSocket server");
......
import axios from "axios"; import axios from "axios";
import {SettingURL} from "../data/constant/app-constant"; import {SettingURL} from "../data/constant/app-constant";
export const fetchAboutSettingData = async () => { export const fetchAboutSettingData = async (token:any,role:any) => {
try { try {
const response = await axios.get(SettingURL+"/data");
const response = await axios.get(SettingURL+"/data",{
headers: {
Authorization: `Bearer ${token}`,
},
});
if (response.data) { if (response.data) {
const data = response.data.map((item:any) => ({ const data = response.data.map((item:any) => ({
id: item.id, id: item.id,
...@@ -18,38 +23,60 @@ export const fetchAboutSettingData = async () => { ...@@ -18,38 +23,60 @@ export const fetchAboutSettingData = async () => {
} }
}; };
export const putAboutSettingData = async (data:any) => { export const putAboutSettingData = async (data:any,token:any,role:any) => {
if(role=="admin"){
try { try {
const response = await axios.post(SettingURL+"/post",data); const response = await axios.post(SettingURL+"/post",data,{
headers: {
Authorization: `Bearer ${token}`,
},
});
console.log(response.data); console.log(response.data);
} catch (error) { } catch (error) {
console.error(error); console.error(error);
} }
}
}; };
export const deleteByKeyAboutSettingData = async (key:any) => { export const deleteByKeyAboutSettingData = async (key:any,token:any,role:any) => {
if(role=="admin"){
try { try {
const response = await axios.delete(SettingURL+`/delete/${key}`); const response = await axios.delete(SettingURL+`/delete/${key}`,{
headers: {
Authorization: `Bearer ${token}`,
},
});
console.log(response.data); console.log(response.data);
} catch (error) { } catch (error) {
console.error(error); console.error(error);
} }
}
}; };
export const UpdateAboutSettingData = async (data:any) => { export const UpdateAboutSettingData = async (data:any,token:any,role:any) => {
if(role=="admin"){
try { try {
const response = await axios.put(SettingURL+`/update`, data); const response = await axios.put(SettingURL+`/update`, data,{
headers: {
Authorization: `Bearer ${token}`,
},
});
console.log(response); console.log(response);
return response; return response;
} catch (error) { } catch (error) {
console.error(error); console.error(error);
return error; return error;
} }
}
}; };
export const sendEmailMessage = async (data:any) => { export const sendEmailMessage = async (data:any,token:any,role:any) => {
try { try {
const response = await axios.post(SettingURL+`/send-message`, data); const response = await axios.post(SettingURL+`/send-message`, data,{
headers: {
Authorization: `Bearer ${token}`,
},
});
return response.data; return response.data;
} catch (error) { } catch (error) {
return error; return error;
......
import axios from "axios"; import axios from "axios";
import {TrapURL} from "../data/constant/app-constant"; import {TrapURL} from "../data/constant/app-constant";
export const fetchData = async () => { export const fetchData = async (token:any) => {
try { try {
const response = await axios.get(TrapURL); const response = await axios.get(TrapURL,{
headers: {
Authorization: `Bearer ${token}`,
},
});
if (response.data) { if (response.data) {
const transformedData = response.data.map((item:any) => ({ const transformedData = response.data.map((item:any) => ({
id: item.id, id: item.id,
......
import axios from "axios";
import { UserURL,AuthURL } from "../data/constant/app-constant";
import { message } from "antd";
import MainUtils from "../utils/main";
export const login = async (data: any) => {
try {
const values = MainUtils.cloneObject(data);
// console.log(values);
const response = await axios.post(AuthURL+"token", values);
// console.log(response);
return response;
} catch (error) {
console.log(error);
}
};
export const Register = async (data:any,token:any,role:any) => {
if(role=="admin"){
try {
const response = await axios.post(AuthURL+"register",data
,{
headers: {
Authorization: `Bearer ${token}`,
},
}
);
console.log(response.data);
} catch (error) {
console.error(error);
}
}
};
export const getUserInfo = async (data: any, token:any) => {
try {
const response = await axios.get(UserURL + `get/${data}`,{
headers: {
Authorization: `Bearer ${token}`,
},
});
return response.data;
} catch (error) {
message.error("Error: " + error);
}
};
export const getAllUsers = async (token:any, role:any) => {
if(role=="admin"){
try {
// console.log("data: "+data);
// console.log("token: "+ token);
const response = await axios.get(UserURL + `getAllUsers`,{
headers: {
Authorization: `Bearer ${token}`,
},
});
// console.log(response.data);
return response.data;
} catch (error) {
message.error("Error: " + error);
}
}
};
export const deleteUser = async (id: any, token:any,role:any) => {
if(role=="admin"){
try {
// console.log("data: "+data);
// console.log("token: "+ token);
const response = await axios.delete(UserURL + `delete/${id}`,{
headers: {
Authorization: `Bearer ${token}`,
},
});
// console.log(response.data);
return response.data;
} catch (error) {
message.error("Error: " + error);
}
}
};
export const UpdateUserInfo = async (data:any, token:any, role:any) => {
if(role=="admin"){
try {
// console.log("data: "+data);
// console.log("token: "+ token);
const response = await axios.put(UserURL + `/updateUser`, data, {
headers: {
Authorization: `Bearer ${token}`,
},
});
console.log(response.data);
return response.data;
} catch (error) {
message.error("Error: " + error);
}
}
};
...@@ -192,4 +192,12 @@ a { ...@@ -192,4 +192,12 @@ a {
.file-input-label input[type="file"] { .file-input-label input[type="file"] {
// margin: 20px; // margin: 20px;
cursor: pointer; cursor: pointer;
}
.moreIcon {
float: right;
cursor: pointer;
border-radius: 7px;
font-size: 20px;
/* background-color: rgba(0, 0, 0, .1); */
color: var(--primary-gray-400);
} }
\ No newline at end of file
...@@ -4,6 +4,7 @@ import { ...@@ -4,6 +4,7 @@ import {
Tag, Tag,
} from "antd"; } from "antd";
import classes from "./styles.module.css"; import classes from "./styles.module.css";
import FmsButton from "../buttons/fms-button";
interface fmsTableProps { interface fmsTableProps {
title: string; title: string;
columns: Array<any>; columns: Array<any>;
...@@ -13,7 +14,7 @@ interface fmsTableProps { ...@@ -13,7 +14,7 @@ interface fmsTableProps {
setColumns: Function; setColumns: Function;
rowSelection:any; rowSelection:any;
pageSizeOptions:Array<string>; pageSizeOptions:Array<string>;
defaultPageSize:any defaultPageSize:any;
} }
const FmsTable: FunctionComponent<fmsTableProps> = ({ const FmsTable: FunctionComponent<fmsTableProps> = ({
title, title,
...@@ -24,7 +25,7 @@ const FmsTable: FunctionComponent<fmsTableProps> = ({ ...@@ -24,7 +25,7 @@ const FmsTable: FunctionComponent<fmsTableProps> = ({
setColumns, setColumns,
rowSelection, rowSelection,
pageSizeOptions, pageSizeOptions,
defaultPageSize defaultPageSize,
}) => { }) => {
return ( return (
...@@ -35,8 +36,9 @@ const FmsTable: FunctionComponent<fmsTableProps> = ({ ...@@ -35,8 +36,9 @@ const FmsTable: FunctionComponent<fmsTableProps> = ({
data-testid="fms-table-total-count" data-testid="fms-table-total-count"
className={classes.totalCountTag} className={classes.totalCountTag}
> >
{`${data.length} row`} {data && `${data.length} row`}
</Tag> </Tag>
</div> </div>
<Table <Table
className="fms-table" className="fms-table"
......
...@@ -64,7 +64,7 @@ ...@@ -64,7 +64,7 @@
cursor: pointer; cursor: pointer;
border-radius: 7px; border-radius: 7px;
font-size: 20px; font-size: 20px;
background-color: rgba(0, 0, 0, .1); /* background-color: rgba(0, 0, 0, .1); */
color: var(--primary-gray-400); color: var(--primary-gray-400);
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment