Skip to content

Commit

Permalink
Hunar (#52)
Browse files Browse the repository at this point in the history 
* Add folder for student register

issue: There was a router problem for student register
resolve: always make page.js for route just separate them by making different folders.

* database

* - Created useContext for user (uid)
- Added service folder with functions to read and write data from the database
- Added authentication for student/homepage and student/information
- Updated student/login page to fix email and password authentication issues

* starting login page

* login page design

* signup page complete

* adding colors

* file change

* forget password

* add modal

* add conditions

* login page

* add posst function for menu and restaurant details

* meging with main

* adding restaurant information page

* fetching and adding data for restaurants

* merging from origin

* merge from orign

* adding emails status in database

* add and create function for adding new email with active status
add and create function for getting email names where active status is true
make changes in register page to check that email is in database for register

* chengin import sttement

* adding terms condition

* adding logos facility

* merge from master

* update database
sait-staff

* adding search option

* commit

* connecting sait-staff with database

* merging form master

* changes on sait

* mege from master to origin

* changing restaurant info table

* adding data to database

* updating cards

* adding logc for increase and decrease arrow

* adding databse changes

* updating datasbe function to getting student information

* adding authentication for restaurants

* changing Searching bar

* adding search bar in sait-staff

* updating restaurant login page

* adding update,delete and change password features

* adding fuctionality of deleting user's information from database including user data and restaurant menu, delete data from storage and from authentication

* update edit functionallity in sait-staff and add delete functionality in restaurant

* add add functionality for admins

* Hunar (#46)

* Add folder for student register

issue: There was a router problem for student register
resolve: always make page.js for route just separate them by making different folders.

* database

* - Created useContext for user (uid)
- Added service folder with functions to read and write data from the database
- Added authentication for student/homepage and student/information
- Updated student/login page to fix email and password authentication issues

* starting login page

* login page design

* signup page complete

* adding colors

* file change

* forget password

* add modal

* add conditions

* login page

* add posst function for menu and restaurant details

* meging with main

* adding restaurant information page

* fetching and adding data for restaurants

* merging from origin

* merge from orign

* adding emails status in database

* add and create function for adding new email with active status
add and create function for getting email names where active status is true
make changes in register page to check that email is in database for register

* chengin import sttement

* adding terms condition

* adding logos facility

* merge from master

* update database
sait-staff

* adding search option

* commit

* connecting sait-staff with database

* merging form master

* changes on sait

* mege from master to origin

* changing restaurant info table

* adding data to database

* updating cards

* adding logc for increase and decrease arrow

* adding databse changes

* updating datasbe function to getting student information

* adding authentication for restaurants

* changing Searching bar

* adding search bar in sait-staff

* updating restaurant login page

* adding update,delete and change password features

* adding fuctionality of deleting user's information from database including user data and restaurant menu, delete data from storage and from authentication

---------

Co-authored-by: Abdel Mouzahir <[email protected]>

* trying to show username in saitstaff

* console log

* small change

* remove azure

* adding loading animation

* loading in all login pages

* trying to fetch the name

* fetch data in login

* comment to hunar

* problem solved mentioned by abdel

* updatinf sait-login

* add feature of edit and update active state

* add search functionality in sait-staff

* add feature of updating password and delete account

---------

Co-authored-by: Abdel Mouzahir <[email protected]>
Co-authored-by: abdel mouzahir <[email protected]>
  • Loading branch information
@hunardeep720 @Abdelmouzahir
3 people authored Jul 5, 2024
1 parent 8ff8834 commit 6ae15a1
Show file tree
Hide file tree
Showing 6 changed files with 318 additions and 94 deletions.
43 changes: 30 additions & 13 deletions app/sait-staff/RDashboard/Table.js
View file
Original file line number Diff line number Diff line change
@@ -1,23 +1,34 @@
'use client'
import React, { useState } from 'react';
"use client";
import React, { useState } from "react";
import { LuPencil } from "react-icons/lu";
import { LuTrash } from "react-icons/lu";
import { IoStorefront } from "react-icons/io5";
import { formatPhoneNumber } from '@/Constant/formated';
import { formatPhoneNumber } from "@/Constant/formated";
import { MdOutlineDoneOutline } from "react-icons/md";
import { FaFilter } from "react-icons/fa";

const Table = ({ restaurants, handleEdit, handleDelete, setIsAdding, setSearch, search }) => {
const Table = ({
restaurants,
handleEdit,
handleDelete,
setIsAdding,
setSearch,
search,
}) => {
const [searchTerm, setSearchTerm] = useState("");
const [searchBy, setSearchBy] = useState("name");

const filteredRestaurants =
const filteredRestaurants =
restaurants && restaurants.length > 0
? restaurants.filter(restaurant => {
? restaurants.filter((restaurant) => {
if (searchBy === "name") {
return restaurant.name.toLowerCase().includes(searchTerm.toLowerCase());
return restaurant.name
.toLowerCase()
.includes(searchTerm.toLowerCase());
} else if (searchBy === "email") {
return restaurant.email.toLowerCase().includes(searchTerm.toLowerCase());
return restaurant.email
.toLowerCase()
.includes(searchTerm.toLowerCase());
} else if (searchBy === "phone") {
return restaurant.phoneNumber.includes(searchTerm);
}
Expand Down Expand Up @@ -68,18 +79,23 @@ const Table = ({ restaurants, handleEdit, handleDelete, setIsAdding, setSearch,
)}
</button>
</div>
<div className={search ? "w-full grid grid-cols-3 gap-5 bg-white rounded mb-5 p-3"
: "hidden"}>
<div
className={
search
? "w-full grid grid-cols-3 gap-5 bg-white rounded mb-5 p-3"
: "hidden"
}
>
<div>
<label>Search</label>
<label>Search</label>
<input
className="rounded ml-2 p-1 border-black border-2 w-full"
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
/>
</div>
<div>
<label>Criteria</label>
<label>Criteria</label>
<select
className="w-full rounded ml-2 p-1 border-black border-2"
value={searchBy}
Expand All @@ -106,7 +122,8 @@ const Table = ({ restaurants, handleEdit, handleDelete, setIsAdding, setSearch,
filteredRestaurants.map((restaurant) => (
<tr key={restaurant.id} className="hover:bg-gray-100">
<td className="py-4 px-6 text-center">
{restaurant.name[0].toUpperCase() + restaurant.name.slice(1)}
{restaurant.name[0].toUpperCase() +
restaurant.name.slice(1)}
</td>
<td className="py-4 px-6 text-center">{restaurant.email}</td>
<td className="py-4 px-6 text-center">
Expand Down
5 changes: 0 additions & 5 deletions app/sait-staff/overviewDash/index.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,21 +21,18 @@ export default function Dash() {

async function fetchData() {
const data = await getSaitData();
console.log(data);
setAdmin(data);
}
async function fetchDataByUser() {
const data = await getSaitDataByUser(user);
setUserData(data);
console.log(data);
}

useEffect(() => {
if (user) {
fetchData();
fetchDataByUser(user);
}
console.log(user);
}, [user]);

useEffect(() => {
Expand All @@ -44,14 +41,12 @@ export default function Dash() {
}, [admin]);

const handleEditRequest = (user) => {
console.log(user);
setEditEmployeData(user);
setIsEditing(true);
};

const handleDelete = (id) => {
// Handle delete logic
console.log(`Delete user with id: ${id}`);
setAdmin(admin.filter((user) => user.id !== id));
};

Expand Down
210 changes: 145 additions & 65 deletions app/sait-staff/overviewDash/table.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,36 +2,115 @@ import React, { useState } from "react";
import { LuPencil, LuTrash } from "react-icons/lu";
import { IoMdPersonAdd } from "react-icons/io";
import Modal from "@/Components/Modal";
import { FaFilter } from "react-icons/fa";
import { MdOutlineDoneOutline } from "react-icons/md";

const Table = ({
admin,
handleEdit,
setIsAdding,
handleChangeStatus,
}) => {
const [search, setSearch] = useState(false);
const [searchTerm, setSearchTerm] = useState("");
const [searchBy, setSearchBy] = useState("name");
const [isVisible, setIsVisisble] = useState(false);
const [isActive, setIsActive] = useState(null);
const [email, setEmail] = useState("");
const [docId, setDocId] = useState("");
const filteredEmployees =
admin && admin.length > 0
? admin.filter(user => {
if (searchBy === "name") {
return user.name.toLowerCase().includes(searchTerm.toLowerCase());
} else if (searchBy === "email") {
return user.email.toLowerCase().includes(searchTerm.toLowerCase());
} else if (searchBy === "phone") {
return user.phoneNumber.includes(searchTerm);
}
return true;
})
: [];

return (
<div className="container mx-auto px-4 sm:px-8">
<div className="py-8">
<div className="flex justify-between items-center mb-3">
<div className="flex mb-6">
<button
onClick={() => setIsAdding(true)}
className="inline-flex items-center justify-center rounded-md bg-green-600 px-4 py-2 text-sm font-medium text-gray-50 shadow transition-colors hover:bg-green-800 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-green-950 disabled:pointer-events-none disabled:opacity-50 dark:bg-gray-50 dark:text-green-900 dark:hover:bg-gray-200 dark:focus-visible:ring-gray-300"
className={
search
? "hidden"
: "inline-flex items-center justify-center rounded-md bg-green-600 px-4 py-2 text-sm font-medium text-gray-50 shadow transition-colors hover:bg-green-800 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-green-950 disabled:pointer-events-none disabled:opacity-50 dark:bg-gray-50 dark:text-green-900 dark:hover:bg-gray-200 dark:focus-visible:ring-gray-300"
}
>
<IoMdPersonAdd className="mr-2 h-4 w-4" />
Add Admin
</button>
<button
onClick={() => {
setSearch(!search);
if (search) {
setSearchTerm("");
}
}}
className={
search
? "inline-flex items-center justify-center rounded-md bg-green-600 px-4 py-2 text-sm font-medium text-gray-50 shadow transition-colors hover:bg-green-800 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-green-950 disabled:pointer-events-none disabled:opacity-50 dark:bg-gray-50 dark:text-green-900 dark:hover:bg-gray-200 dark:focus-visible:ring-gray-300"
: "ml-10 inline-flex items-center justify-center rounded-md bg-green-600 px-4 py-2 text-sm font-medium text-gray-50 shadow transition-colors hover:bg-green-800 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-green-950 disabled:pointer-events-none disabled:opacity-50 dark:bg-gray-50 dark:text-green-900 dark:hover:bg-gray-200 dark:focus-visible:ring-gray-300"
}
>
{search ? (
<>
<MdOutlineDoneOutline className="mr-2 h-4 w-4" />
Done
</>
) : (
<>
<FaFilter className="mr-2 h-4 w-4" />
Filter by
</>
)}
</button>
</div>
<div
className={
search
? "w-full grid grid-cols-3 gap-5 bg-white rounded mb-5 p-3"
: "hidden"
}
>
<div>
<label>Search</label>
<input
className="rounded ml-2 p-1 border-black border-2 w-full"
value={searchTerm}
onChange={(e) => setSearchTerm(e.target.value)}
/>
</div>
<div>
<label>Criteria</label>
<select
className="w-full rounded ml-2 p-1 border-black border-2"
value={searchBy}
onChange={(e) => setSearchBy(e.target.value)}
>
<option value="name">Name</option>
<option value="email">Email</option>
<option value="phone">Phone</option>
</select>
</div>
</div>
<div className="inline-block min-w-full shadow rounded-lg overflow-hidden">
<table className="min-w-full leading-normal table-fixed">
<thead className="text-center">
<tr>
<th className="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-xs font-semibold text-gray-600 uppercase tracking-wider">
User
</th>
<th className="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-xs font-semibold text-gray-600 uppercase tracking-wider">
Email
</th>
<th className="px-5 py-3 border-b-2 border-gray-200 bg-gray-100 text-xs font-semibold text-gray-600 uppercase tracking-wider">
Role
</th>
Expand All @@ -47,77 +126,78 @@ const Table = ({
</tr>
</thead>
<tbody>
{admin && admin.length > 0 ? (
admin.map((user) => (
<tr key={user.id}>
<td className="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<div className="flex items-center">
<div className="flex-shrink-0 w-10 h-10">
<img
className="w-full h-full rounded-full"
src={user.imageUrl}
alt=""
/>
</div>
<div className="ml-3">
<p className="text-gray-900 whitespace-no-wrap">
{user.name}
</p>
</div>
</div>
</td>
<td className="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<p className="text-gray-900 whitespace-no-wrap">
{user.role}
</p>
</td>
<td className="px-5 py-5 border-b border-gray-200 bg-white text-sm">
{filteredEmployees.length > 0 ? (filteredEmployees.map((user) => (
<tr key={user.id}>
<td className="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<div className="flex items-center">
<div className="flex-shrink-0 w-10 h-10">
<img
className="w-full h-full rounded-full"
src={user.imageUrl}
alt=""
/>
</div>
<div className="ml-3">
<p className="text-gray-900 whitespace-no-wrap">
{user.accountCreated.toDate().toDateString()}
{user.name}
</p>
</td>
<td className="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<span
onClick={() => {
setIsVisisble(true);
setIsActive(user.active),
setEmail(user.email),
setDocId(user.id);
}}
className={`relative inline-block px-3 py-1 font-semibold leading-tight rounded ${
user.active ? "bg-green-400" : "bg-red-400"
}`}
>
<span
aria-hidden
// className={` inset-0 ${user.active && 'bg-green-400'} opacity-50 rounded-full`}
></span>
<span className="p-3 cursor-pointer">
{user.active ? "Active" : "InActive"}
</span>
</span>
</td>
<td className="px-5 py-5 text-center border-gray-200 bg-white text-sm border-l">
<button
onClick={() => handleEdit(user)}
className="inline-flex items-center mr-2 justify-center rounded-md bg-green-900 px-4 py-2 text-sm font-medium text-gray-50 shadow transition-colors hover:bg-green-800 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-green-950 disabled:pointer-events-none disabled:opacity-50 dark:bg-gray-50 dark:text-green-900 dark:hover:bg-gray-200 dark:focus-visible:ring-gray-300"
>
Edit
<LuPencil className="ml-2 h-4 w-4" />
</button>
</td>
</tr>
))
) : (
<tr>
</div>
</div>
</td>
<td className="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<p className="text-gray-900 whitespace-no-wrap">
{user.email}
</p>
</td>
<td className="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<p className="text-gray-900 whitespace-no-wrap">
{user.role}
</p>
</td>
<td className="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<p className="text-gray-900 whitespace-no-wrap">
{user.accountCreated.toDate().toDateString()}
</p>
</td>
<td className="px-5 py-5 border-b border-gray-200 bg-white text-sm">
<span
onClick={() => {
setIsVisisble(true);
setIsActive(user.active),
setEmail(user.email),
setDocId(user.id);
}}
className={`relative inline-block px-3 py-1 font-semibold leading-tight rounded ${
user.active ? "bg-green-400" : "bg-red-400"
}`}
>
<span
aria-hidden
// className={` inset-0 ${user.active && 'bg-green-400'} opacity-50 rounded-full`}
></span>
<span className="p-3 cursor-pointer">
{user.active ? "Active" : "InActive"}
</span>
</span>
</td>
<td className="px-5 py-5 text-center border-gray-200 bg-white text-sm border-l">
<button
onClick={() => handleEdit(user)}
className="inline-flex items-center mr-2 justify-center rounded-md bg-green-900 px-4 py-2 text-sm font-medium text-gray-50 shadow transition-colors hover:bg-green-800 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-green-950 disabled:pointer-events-none disabled:opacity-50 dark:bg-gray-50 dark:text-green-900 dark:hover:bg-gray-200 dark:focus-visible:ring-gray-300"
>
Edit
<LuPencil className="ml-2 h-4 w-4" />
</button>
</td>
</tr>
))):(<><tr>
<td
colSpan="5"
className="px-5 py-5 border-b border-gray-200 bg-white text-sm text-center"
>
No data available
</td>
</tr>
)}
</tr></>)}
</tbody>
</table>
</div>
Expand Down
Loading

0 comments on commit 6ae15a1

Please sign in to comment.