Laux/Frontend-Internal-Developer-Platform
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

done user and role page

Browse Source
This commit is contained in:
sigmaBoei
2026-02-27 11:05:53 +08:00
parent 7ca948c6ad
commit fbf9067778
8 changed files with 946 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
frontend/src/app/roles/add/page.jsx Normal file
View File

@@ -0,0 +1,120 @@
import React from "react";
import TopHeader from "@/app/components/topHeader/TopHeader";
import globalStyle from "../../globalStyle.module.css";
import addRoleStyle from "./styles.module.css";
const page = () => {
return (
<div className={globalStyle.section}>
<div className={globalStyle.mainContainer}>
<div className={globalStyle.container}>
<TopHeader
buttonText="Save"
cancelButtonText="Cancel"
topbarTitle="Add Role"
state="add"
/>
<div className={addRoleStyle.addUserContainer}>
{/* Input fields Container */}
<div className={addRoleStyle.inputFieldContainer}>
{/* User Details */}
<div className={addRoleStyle.roleDetails}>
{/* Header */}
<div className={addRoleStyle.header}>
<div>
<p>Role Details</p>
</div>
</div>
{/* Input fields */}
<form className={addRoleStyle.fields}>
{/* Email */}
<div className={addRoleStyle.inputMainContainer}>
<div className={addRoleStyle.inputContainer}>
{/* Label */}
<div className={addRoleStyle.label}>
<p>Name</p>
</div>
{/* Input field */}
<div className={addRoleStyle.inputField}>
<input
type="text"
name=""
id=""
placeholder="Enter name"
className={addRoleStyle.placeholderTxt}
/>
</div>
</div>
</div>
{/* Full Name */}
<div className={addRoleStyle.inputMainContainer}>
<div className={addRoleStyle.inputContainer}>
{/* Label */}
<div className={addRoleStyle.label}>
<p>Organization ID</p>
</div>
{/* Input field */}
<div className={addRoleStyle.inputField}>
<input
type="text"
name=""
id=""
placeholder="Enter organization ID"
className={addRoleStyle.placeholderTxt}
/>
</div>
</div>
</div>
</form>
</div>
{/* Permissions */}
<div className={addRoleStyle.rolePermissions}>
{/* Add permissions */}
<div className={addRoleStyle.permissionsContainer}>
{/* Header */}
<div className={addRoleStyle.permissionsHeader}>
<p>Permissions</p>
<div className={addRoleStyle.svgContainer}>
<div>
<svg
xmlns="http://www.w3.org/2000/svg"
width={24}
height={24}
viewBox="0 0 24 24"
fill="none"
>
<path
d="M12 5.29199V18.7087"
stroke="#333649"
strokeWidth={2}
strokeLinecap="round"
strokeLinejoin="round"
/>
<path
d="M5.29102 12H18.7077"
stroke="#333649"
strokeWidth={2}
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
</div>
</div>
</div>
{/* State text (static) */}
<div className={addRoleStyle.permissionDefaultState}>
<p>No permission added yet</p>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
);
};
export default page;