From aabbbfff8bf81d197bfdb3a4c7f74bc9f134de92 Mon Sep 17 00:00:00 2001 From: YasinShaikh123 <123150391+YasinShaikh123@users.noreply.github.com> Date: Thu, 6 Feb 2025 15:07:42 +0530 Subject: [PATCH] =?UTF-8?q?[=20working=F0=9F=91=B7=E2=80=8D=E2=99=82?= =?UTF-8?q?=EF=B8=8F=20]?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package-lock.json | 31 ++- package.json | 2 + src/Pages/Dashboard/Dashboard.tsx | 107 +++++++++- .../RegisterUsers/AddRegisterUsers.tsx | 128 ++++++++++++ .../RegisterUsers/EditRegisterUsers.tsx | 125 ++++++++++++ .../RegisterUsers/RegisterUsers.tsx | 27 +-- .../RegisterUsers/ViewRegisterUsers.tsx | 126 ++++++++++++ src/Routes/Nav.ts | 6 +- src/assets/deleteIcon.png | Bin 0 -> 1262 bytes src/components/AlertDailog.tsx | 8 +- src/components/Charts/BarChart.tsx | 49 +++++ src/components/Charts/SemiDoughnutChart.tsx | 64 ++++++ src/components/ViewDailog.tsx | 192 +++++++++++------- 13 files changed, 758 insertions(+), 107 deletions(-) create mode 100644 src/Pages/ManageUsers/RegisterUsers/AddRegisterUsers.tsx create mode 100644 src/Pages/ManageUsers/RegisterUsers/EditRegisterUsers.tsx create mode 100644 src/Pages/ManageUsers/RegisterUsers/ViewRegisterUsers.tsx create mode 100644 src/assets/deleteIcon.png create mode 100644 src/components/Charts/BarChart.tsx create mode 100644 src/components/Charts/SemiDoughnutChart.tsx diff --git a/package-lock.json b/package-lock.json index 070fd08..565b898 100644 --- a/package-lock.json +++ b/package-lock.json @@ -11,9 +11,11 @@ "@chakra-ui/react": "^3.2.3", "@emotion/react": "^11.14.0", "@emotion/styled": "^11.14.0", + "chart.js": "^4.4.7", "framer-motion": "^11.18.0", "next-themes": "^0.4.4", "react": "^18.3.1", + "react-chartjs-2": "^5.3.0", "react-dom": "^18.3.1", "react-hook-form": "^7.54.2", "react-icons": "^5.4.0", @@ -1668,7 +1670,6 @@ }, "node_modules/@clack/prompts/node_modules/is-unicode-supported": { "version": "1.3.0", - "extraneous": true, "inBundle": true, "license": "MIT", "engines": { @@ -2660,6 +2661,12 @@ "@jridgewell/sourcemap-codec": "^1.4.14" } }, + "node_modules/@kurkle/color": { + "version": "0.3.4", + "resolved": "https://registry.npmjs.org/@kurkle/color/-/color-0.3.4.tgz", + "integrity": "sha512-M5UknZPHRu3DEDWoipU6sE8PdkZ6Z/S+v4dD+Ke8IaNlpdSQah50lz1KtcFBa2vsdOnwbbnxJwVM4wty6udA5w==", + "license": "MIT" + }, "node_modules/@nodelib/fs.scandir": { "version": "2.1.5", "resolved": "https://registry.npmjs.org/@nodelib/fs.scandir/-/fs.scandir-2.1.5.tgz", @@ -5220,6 +5227,18 @@ "url": "https://github.com/chalk/chalk?sponsor=1" } }, + "node_modules/chart.js": { + "version": "4.4.7", + "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.4.7.tgz", + "integrity": "sha512-pwkcKfdzTMAU/+jNosKhNL2bHtJc/sSmYgVbuGTEDhzkrhmyihmP7vUc/5ZK9WopidMDHNe3Wm7jOd/WhuHWuw==", + "license": "MIT", + "dependencies": { + "@kurkle/color": "^0.3.0" + }, + "engines": { + "pnpm": ">=8" + } + }, "node_modules/chokidar": { "version": "3.6.0", "resolved": "https://registry.npmjs.org/chokidar/-/chokidar-3.6.0.tgz", @@ -8048,6 +8067,16 @@ "node": ">=0.10.0" } }, + "node_modules/react-chartjs-2": { + "version": "5.3.0", + "resolved": "https://registry.npmjs.org/react-chartjs-2/-/react-chartjs-2-5.3.0.tgz", + "integrity": "sha512-UfZZFnDsERI3c3CZGxzvNJd02SHjaSJ8kgW1djn65H1KK8rehwTjyrRKOG3VTMG8wtHZ5rgAO5oTHtHi9GCCmw==", + "license": "MIT", + "peerDependencies": { + "chart.js": "^4.1.1", + "react": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0" + } + }, "node_modules/react-dom": { "version": "18.3.1", "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", diff --git a/package.json b/package.json index dbaf301..ca92e73 100644 --- a/package.json +++ b/package.json @@ -13,9 +13,11 @@ "@chakra-ui/react": "^3.2.3", "@emotion/react": "^11.14.0", "@emotion/styled": "^11.14.0", + "chart.js": "^4.4.7", "framer-motion": "^11.18.0", "next-themes": "^0.4.4", "react": "^18.3.1", + "react-chartjs-2": "^5.3.0", "react-dom": "^18.3.1", "react-hook-form": "^7.54.2", "react-icons": "^5.4.0", diff --git a/src/Pages/Dashboard/Dashboard.tsx b/src/Pages/Dashboard/Dashboard.tsx index d063737..5a0e63e 100644 --- a/src/Pages/Dashboard/Dashboard.tsx +++ b/src/Pages/Dashboard/Dashboard.tsx @@ -1,8 +1,105 @@ +import { + Box, + createListCollection, + Heading, + HStack, + Stack, + Status, + Tabs, + Text, +} from "@chakra-ui/react"; +import MainFrame from "../../components/MainFrame"; +import BarChart from "../../components/Charts/BarChart"; +import { + SelectContent, + SelectItem, + SelectLabel, + SelectRoot, + SelectTrigger, + SelectValueText, +} from "../../components/ui/select"; +import SemiDoughnutChart from "../../components/Charts/SemiDoughnutChart"; const Dashboard = () => { - return ( -
Dashboard
- ) -} + const frameworks = createListCollection({ + items: [ + { label: "React.js", value: "react" }, + { label: "Vue.js", value: "vue" }, + { label: "Angular", value: "angular" }, + { label: "Svelte", value: "svelte" }, + ], + }); -export default Dashboard \ No newline at end of file + return ( + + + + + Total Users + + + + Tab 1 + Tab 2 + Tab 3 + + + + + + + + + + Recruiter 2554 + + + + Customer 1224 + + + + + + Item approvals in + + + + + + {frameworks.items.map((movie) => ( + + {movie.label} + + ))} + + + + + + + + + + + + + ); +}; + +export default Dashboard; diff --git a/src/Pages/ManageUsers/RegisterUsers/AddRegisterUsers.tsx b/src/Pages/ManageUsers/RegisterUsers/AddRegisterUsers.tsx new file mode 100644 index 0000000..8fa5979 --- /dev/null +++ b/src/Pages/ManageUsers/RegisterUsers/AddRegisterUsers.tsx @@ -0,0 +1,128 @@ +import { Field, Input, Stack } from "@chakra-ui/react"; +import { + DialogActionTrigger, + DialogBody, + DialogCloseTrigger, + DialogContent, + DialogFooter, + DialogHeader, + DialogRoot, + DialogTitle, + DialogTrigger, +} from "../../../components/ui/dialog"; +import { Button } from "../../../components/ui/button"; +import { IoMdAdd } from "react-icons/io"; + +function AddRegisterUsers() { + return ( + + + + + + + + + Add User Accounts + + + + + + + + First Name + + + + + Last Name + + + + + Gender + + + + + DOB + + + + + OTP Verified + + + + + Language + + + + + + + + + + + + + + ); +} + +export default AddRegisterUsers; diff --git a/src/Pages/ManageUsers/RegisterUsers/EditRegisterUsers.tsx b/src/Pages/ManageUsers/RegisterUsers/EditRegisterUsers.tsx new file mode 100644 index 0000000..4604103 --- /dev/null +++ b/src/Pages/ManageUsers/RegisterUsers/EditRegisterUsers.tsx @@ -0,0 +1,125 @@ +import { MdOutlineRemoveRedEye } from "react-icons/md"; +import { Field, Input, Stack } from "@chakra-ui/react"; +import { + DialogActionTrigger, + DialogBody, + DialogCloseTrigger, + DialogContent, + DialogFooter, + DialogHeader, + DialogRoot, + DialogTitle, + DialogTrigger, +} from "../../../components/ui/dialog"; +import { BiEdit } from "react-icons/bi"; +import { Button } from "../../../components/ui/button"; + +function EditRegisterUsers() { + return ( + + + + + + + + + Edit user Accounts + + + + + + + + First Name + + + + + Last Name + + + + + Gender + + + + + DOB + + + + + OTP Verified + + + + + Language + + + + + + + + + + + + + + ); +} + +export default EditRegisterUsers; diff --git a/src/Pages/ManageUsers/RegisterUsers/RegisterUsers.tsx b/src/Pages/ManageUsers/RegisterUsers/RegisterUsers.tsx index 67e01e0..4bf7247 100644 --- a/src/Pages/ManageUsers/RegisterUsers/RegisterUsers.tsx +++ b/src/Pages/ManageUsers/RegisterUsers/RegisterUsers.tsx @@ -1,18 +1,18 @@ import { Box, HStack, Image, Input, Text } from "@chakra-ui/react"; import MainFrame from "../../../components/MainFrame"; import AlertDailog from "../../../components/AlertDailog"; -import { FcCancel } from "react-icons/fc"; import { NavLink } from "react-router-dom"; -import { MdOutlineRemoveRedEye } from "react-icons/md"; import { RiDeleteBin5Line } from "react-icons/ri"; import DataTable from "../../../components/DataTable"; -import { HiCheck } from "react-icons/hi2"; -import { HiX } from "react-icons/hi"; import { Switch } from "../../../components/ui/switch"; -import { Button } from "../../../components/ui/button"; import { InputGroup } from "../../../components/ui/input-group"; import { LuSearch } from "react-icons/lu"; import { BiEdit } from "react-icons/bi"; +import ViewRegisterUsers from "./ViewRegisterUsers"; +import EditRegisterUsers from "./EditRegisterUsers"; +import { Button } from "../../../components/ui/button"; +import { IoMdAdd } from "react-icons/io"; +import AddRegisterUsers from "./AddRegisterUsers"; const tableHeadRow = [ "Sr. No", @@ -42,24 +42,14 @@ const registerUser: any[] = [ ), "Action": ( - - - - - - - - + + {/* */} } - alertCaption="are you sure you want to delete ?" + alertCaption="Are You Sure You Want To Delete This User ?" onConfirm={() => { console.log("User deleted:", i + 1); }} @@ -105,6 +95,7 @@ const RegisterUsers = () => { ps={8} /> + + + + + + + + + View Details + + + + + + + + First Name + + + + + Last Name + + + + + Gender + + + + + DOB + + + + + OTP Verified + + + + + Language + + + + + + + + + + ); +} + +export default ViewRegisterUsers; diff --git a/src/Routes/Nav.ts b/src/Routes/Nav.ts index 83956b9..e0c0a56 100644 --- a/src/Routes/Nav.ts +++ b/src/Routes/Nav.ts @@ -17,7 +17,7 @@ export const nav = [ }, { title: "Manage Users", - path: "/register-users", + path: "", Icon: BiUserPin, type:'multiple', children: [ @@ -65,7 +65,7 @@ export const nav = [ }, { title: "Manage CMS", - path: "/faq", + path: "", Icon: AiOutlineFileText, type:'multiple', children: [ @@ -104,7 +104,7 @@ export const nav = [ }, { title: "Master Module", - path: "/agency-master", + path: "", Icon: BsBoxes, type:'multiple', children: [ diff --git a/src/assets/deleteIcon.png b/src/assets/deleteIcon.png new file mode 100644 index 0000000000000000000000000000000000000000..b3b827d893cf40abccfb8f85e324d97e66253df6 GIT binary patch literal 1262 zcmeAS@N?(olHy`uVBq!ia0vp^E!3HE3gj}`Nn{1`ISV`@iy0WWg+Z8+Vb&Z8pqge+7srr_xVJI8{iGd5w(4>Vv~CV?VBN8Z zsdbBqMZ5sluMeCqPK$h$qL#Rbd6YOf9{$a5;BlcXymJfRqQ*l9MHCtj%uGJJCQW~{ z***5Ug8q^Z=gy?=Exxg{xcr9o#-NoVqHAmH{@13ZJ@eNQ({6R0^Zv(=AKyQJF240) zZe!*eo>Qw=uU@%u;llc5e62@2J2`hp==jarXV1|))v;sup(~9mI6nGbe>lDH4+r<7 zn3pa}iKiDezkK=f@xOonq$9udc6W1U=jFXytTRpV-I3XoCr|eOSYe~Ty2&wIU88vC z9V5S$9UtYsMI8TW5cB2z%{zDQnBDxfaN{NYuiZyn-Jkv_h`a0l@J7n>_G4c5H8nM7 zUNpUV`&M`6n?p)_r4I|)EBc9Xww(W=&98j$z=4L-={B~uOP?kxxTtw-UUW+*`C*vI zmXw>qtxkzcwr~GFUFX=536XNLvau77UMQ@n_)(gZlM^H+_`BxyyLWbzj&^ydP2OO9 zzN&<$@dNwk&!2Z^72;8awvx-I|u3z8`3;#pX%cw?a?NSmYC!zw(>dV%PbHKC<+h9q*8G5luDY zx@f<5f5)1@_YyC9Z|0aSe-%CR@#DuF@8;AkJ|{8b?fduqCk{_L_VedY_R5HF%1@b> zipd&vxQ0Y)PqM3C8Te4*#Q>(HsDXh7aC8sYSxIuwMhl7#ZNnonNwL^yv zt>Y;1TE2YwIjhy;Q`T0rMNJBwcLQioo35Sf##d4KXALT&T=#G0;r-x~J-w@=y5zRk z`G7A!A8-BtX5DX{U=5L&g&TJ$oZtWC@ZsjwZ{NK;_jR|G*49?mZ;B9G4m1hCETkUO zQKhM*tnAmhc^TQ+pZ~<(3OjjCUrBJu^5yLBPfjoXy!qyvIHQ?orb_d8EDf?gCALyS zR#w*fDI2p(wBOA~oA>Vh8#?oj>A^2*^O7!<-_73Ge@d)n@4fzAdtb--ov2h@v}vvA zn-ESdu1i<1J}rt$e0%ZZwFTF6Bf|pa_BpsZUV6FZbY^T^+#}yd%MKqr*tmHun}LPJ zibJcqYp!&P zfB!1n6tL%_@Lb=WI}^5QMxVd^^$0M+r|g^C$JDggM@{&q$P4lA?rvq1{}LN=e=q;g z?Q!E9Tj+^ylh3t-YMN=8Mv&V4v-Y%EH2p^H#+49y^uQVsOKTAwF$aN0spH ogf;8ezdy0IBx?qP*T(-b-r=ujEo9mZETb4aUHx3vIVCg!0F)tD0RR91 literal 0 HcmV?d00001 diff --git a/src/components/AlertDailog.tsx b/src/components/AlertDailog.tsx index f7799e5..6ec63c9 100644 --- a/src/components/AlertDailog.tsx +++ b/src/components/AlertDailog.tsx @@ -1,6 +1,6 @@ import React from "react"; -import { DialogBody, HStack, Icon, Text } from "@chakra-ui/react"; +import { DialogBody, HStack, Icon, Image, Text } from "@chakra-ui/react"; import { Button } from "./ui/button"; import { DialogActionTrigger, @@ -9,6 +9,7 @@ import { DialogRoot, DialogTrigger, } from "./ui/dialog"; +import DeleteICN from '../assets/deleteIcon.png' interface DeleteConfirmationDialogProps { onConfirm?: () => void; @@ -65,7 +66,8 @@ const AlertDailog: React.FC = ({ p={8} gap={2} > - {alertIcon && alertIcon} + {/* {alertIcon && alertIcon} */} + = ({ {" "} {alertCaption} - + - // - // - // - // View Details - // - // - // - // - // Title - // - // Title - // - // Title - // - // Image - // - // + return ( + // + // + // + // + // + // + // View Details + // + // + // + // + // Title + // + // Title + // + // Title + // + // Image + // + // - // - // - // {/* - // - // - // - // - // */} - // - // - // - - - - + // + // + // {/* + // + // + // + // + // */} + // + // + // + + + + - - - View Details - + + + + View Details + + - - - - Title - + + + + + Title + + - Subtitle - + + Subtitle + + - Description - + + Description + + - Image - - - - + + Image + + + + + - - - - - ) + + + + ); } -export default ViewDailog \ No newline at end of file +export default ViewDailog;