admin/marco.pms.web
1
0
Fork 0
Code Issues Pull Requests 2 Actions Packages Projects Releases Wiki Activity

add new images

Browse Source 
replase class= with className=
This commit is contained in:
Vikas Nale 2025-09-08 12:32:16 +05:30
parent 386b61d978
commit 698c1b7b16
11 changed files with 259 additions and 218 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

BIN
public/img/illustrations/girl-unlock-password-light.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 26 KiB

BIN
public/img/illustrations/registration.jpg Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.2 MiB

17
src/components/Directory/CardViewDirectory.jsx
View File

@ -25,8 +25,9 @@ const CardViewDirectory = ({
<div className="card-body px-1 py-2 pb-0"> <div className="card-body px-1 py-2 pb-0">
<div className="d-flex justify-content-between"> <div className="d-flex justify-content-between">
<div <div
className={`d-flex align-items-center ${IsActive && "cursor-pointer" className={`d-flex align-items-center ${
}`} IsActive && "cursor-pointer"
}`}
onClick={() => { onClick={() => {
if (IsActive) { if (IsActive) {
setIsOpenModalNote(true); setIsOpenModalNote(true);
@ -89,10 +90,11 @@ const CardViewDirectory = ({
)} )}
{!IsActive && ( {!IsActive && (
<i <i
className={`bx ${dirActions.action && dirActions.id === contact.id className={`bx ${
dirActions.action && dirActions.id === contact.id
? "bx-loader-alt bx-spin" ? "bx-loader-alt bx-spin"
: "bx-recycle" : "bx-recycle"
} me-1 text-primary cursor-pointer`} } me-1 text-primary cursor-pointer`}
title="Restore" title="Restore"
onClick={() => { onClick={() => {
setDirActions({ action: false, id: contact.id }); setDirActions({ action: false, id: contact.id });
@ -113,8 +115,9 @@ const CardViewDirectory = ({
</ul> </ul>
</div> </div>
<div <div
className={`card-footer text-start px-9 py-1 ${IsActive && "cursor-pointer" className={`card-footer text-start px-9 py-1 ${
}`} IsActive && "cursor-pointer"
}`}
onClick={() => { onClick={() => {
if (IsActive) { if (IsActive) {
setIsOpenModalNote(true); setIsOpenModalNote(true);
@ -126,7 +129,7 @@ const CardViewDirectory = ({
{contact.designation && ( {contact.designation && (
<ul className="list-unstyled my-1 d-flex align-items-start ms-2"> <ul className="list-unstyled my-1 d-flex align-items-start ms-2">
<li className="me-2"> <li className="me-2">
<i class="fa-solid fa-id-badge ms-1"></i> <i className="fa-solid fa-id-badge ms-1"></i>
</li> </li>
<li className="flex-grow-1 text-break small"> <li className="flex-grow-1 text-break small">
{contact.designation} {contact.designation}

307
src/components/common/GlobalModal/CreateIssue.jsx
View File

@ -1,172 +1,179 @@
import React,{useState} from "react"; import React, { useState } from "react";
import CommentEditor from "./CommentEditor"; import CommentEditor from "./CommentEditor";
import ReactQuill from "react-quill"; import ReactQuill from "react-quill";
import "react-quill/dist/quill.snow.css"; import "react-quill/dist/quill.snow.css";
import "./CommentEditor.css"; import "./CommentEditor.css";
const jiraModules = { const jiraModules = {
toolbar: [ toolbar: [
["bold", "italic", "underline", "strike"], ["bold", "italic", "underline", "strike"],
["link", "code"], ["link", "code"],
[{ list: "bullet" }], [{ list: "bullet" }],
], ],
}; };
const jiraFormats = [ const jiraFormats = [
"bold", "bold",
"italic", "italic",
"underline", "underline",
"strike", "strike",
"link", "link",
"code", "code",
"list", "list",
]; ];
const CreateIssue = () => const CreateIssue = () => {
{ const [value, setValue] = useState("");
const [value, setValue] = useState("");
return ( return (
<from > <from>
<div className="row"> <div className="row">
<div className="col-12 col-md-8"> <div className="col-12 col-md-8">
<div className="row"> <div className="row">
<label for="defaultFormControlInput" class="form-label "> <label for="defaultFormControlInput" className="form-label ">
Name Name
</label>
<input
type="text"
className="form-control form-control-sm"
id="defaultFormControlInput"
placeholder="John Doe"
aria-describedby="defaultFormControlHelp"
/>
</div>
<div className="row my-md-6 my-4 px-0">
<div className="col-6 ps-0">
<label for="defaultFormControlInput" className="form-label ">
Projec
</label> </label>
<input <select
type="text" name="DataTables_Table_0_length"
class="form-control form-control-sm" aria-controls="DataTables_Table_0"
id="defaultFormControlInput" className="form-select form-select-sm"
placeholder="John Doe" aria-label=""
aria-describedby="defaultFormControlHelp" >
/> <option>Project-2</option>
<option>Project-2</option>
<option>Project-3</option>
</select>
</div> </div>
<div className="row my-md-6 my-4 px-0"> <div className="col-6 pe-0">
<div className="col-6 ps-0"> <label for="defaultFormControlInput" className="form-label ">
<label for="defaultFormControlInput" class="form-label "> Type
Projec </label>
</label> <select
<select name="DataTables_Table_0_length"
name="DataTables_Table_0_length" aria-controls="DataTables_Table_0"
aria-controls="DataTables_Table_0" className="form-select form-select-sm"
className="form-select form-select-sm" aria-label=""
aria-label="" >
<option>Project-2</option>
<option>Project-2</option>
<option>Project-3</option>
</select>
</div>
</div>
<div className="row my-md-6 my-4 px-0">
<div className="col-6 ps-0">
<label for="defaultFormControlInput" className="form-label ">
Status
</label>
<select
name="DataTables_Table_0_length"
aria-controls="DataTables_Table_0"
className="form-select form-select-sm"
aria-label=""
>
<option>Project-2</option>
<option>Project-2</option>
<option>Project-3</option>
</select>
</div>
<div className="col-6 pe-0">
<label for="defaultFormControlInput" className="form-label ">
Activity
</label>
<select
name="DataTables_Table_0_length"
aria-controls="DataTables_Table_0"
className="form-select form-select-sm"
aria-label=""
>
<option>Project-2</option>
<option>Project-2</option>
<option>Project-3</option>
</select>
</div>
</div>
</div>
<div className="col-12 col-md-4">
<div className="row g-2">
<label for="defaultFormControlInput" className="form-label ">
Priority
</label>
<div className="col-md-4 mt-0">
<div className="form-check custom-option custom-option-icon p-2">
<label
className="form-check-label custom-option-content"
for="customRadioIcon1"
> >
<option>Project-2</option> <input
<option>Project-2</option> name="customRadioIcon"
<option>Project-3</option> className="form-check-input form-check-input-sm"
</select> type="radio"
</div> id="customRadioIcon1"
<div className="col-6 pe-0"> checked
<label for="defaultFormControlInput" class="form-label "> />{" "}
Type Low
</label> </label>
<select
name="DataTables_Table_0_length"
aria-controls="DataTables_Table_0"
className="form-select form-select-sm"
aria-label=""
>
<option>Project-2</option>
<option>Project-2</option>
<option>Project-3</option>
</select>
</div> </div>
</div> </div>
<div className="row my-md-6 my-4 px-0">
<div className="col-6 ps-0"> <div className="col-md-4 mt-0">
<label for="defaultFormControlInput" class="form-label "> <div className="form-check custom-option custom-option-icon p-2">
Status <label
</label> className="form-check-label custom-option-content"
<select for="customRadioIcon2"
name="DataTables_Table_0_length"
aria-controls="DataTables_Table_0"
className="form-select form-select-sm"
aria-label=""
> >
<option>Project-2</option> <input
<option>Project-2</option> name="customRadioIcon"
<option>Project-3</option> className="form-check-input form-check-input-sm"
</select> type="radio"
id="customRadioIcon2"
/>{" "}
Medium
</label>
</div> </div>
<div className="col-6 pe-0"> </div>
<label for="defaultFormControlInput" class="form-label ">
Activity <div className="col-md-4 mt-0">
</label> <div className="form-check custom-option custom-option-icon p-2">
<select <label
name="DataTables_Table_0_length" className="form-check-label custom-option-content"
aria-controls="DataTables_Table_0" for="customRadioIcon3"
className="form-select form-select-sm"
aria-label=""
> >
<option>Project-2</option> <input
<option>Project-2</option> name="customRadioIcon"
<option>Project-3</option> className="form-check-input form-check-input-sm"
</select> type="radio"
id="customRadioIcon3"
/>{" "}
High
</label>
</div> </div>
</div> </div>
</div> </div>
<div className="col-12 col-md-4"> </div>
<div class="row g-2"> <div className="marco-quill-wrapper">
<label for="defaultFormControlInput" class="form-label "> <ReactQuill
Priority theme="snow"
</label> value={value}
<div class="col-md-4 mt-0"> onChange={setValue}
<div class="form-check custom-option custom-option-icon p-2"> placeholder="Add a comment..."
<label class="form-check-label custom-option-content" for="customRadioIcon1"> modules={jiraModules}
<input formats={jiraFormats}
name="customRadioIcon" />
class="form-check-input form-check-input-sm" </div>
type="radio" </div>
id="customRadioIcon1"
checked
/> Low
</label>
</div>
</div>
<div class="col-md-4 mt-0">
<div class="form-check custom-option custom-option-icon p-2">
<label class="form-check-label custom-option-content" for="customRadioIcon2">
<input
name="customRadioIcon"
class="form-check-input form-check-input-sm"
type="radio"
id="customRadioIcon2"
/> Medium
</label>
</div>
</div>
<div class="col-md-4 mt-0">
<div class="form-check custom-option custom-option-icon p-2">
<label class="form-check-label custom-option-content" for="customRadioIcon3">
<input
name="customRadioIcon"
class="form-check-input form-check-input-sm"
type="radio"
id="customRadioIcon3"
/> High
</label>
</div>
</div>
</div>
</div>
<div className="marco-quill-wrapper">
<ReactQuill
theme="snow"
value={value}
onChange={setValue}
placeholder="Add a comment..."
modules={jiraModules}
formats={jiraFormats}
/>
</div>
</div>
</from> </from>
); );
}; };

1
src/components/master/CreateRole.jsx
View File

@ -226,7 +226,6 @@ const CreateRole = ({ modalType, onClose }) => {
{!masterFeatures && <p>Loading...</p>} {!masterFeatures && <p>Loading...</p>}
</div> </div>
{masterFeatures && ( {masterFeatures && (
<div className="col-12 text-center"> <div className="col-12 text-center">
<button type="submit" className="btn btn-sm btn-primary me-3"> <button type="submit" className="btn btn-sm btn-primary me-3">

15
src/layouts/AuthLayout.jsx
View File

@ -1,14 +1,14 @@
import React from "react"; import React from "react";
import { Link, Outlet } from "react-router-dom"; import { Link, Outlet } from "react-router-dom";
import { QueryClient } from '@tanstack/react-query'; import { QueryClient } from "@tanstack/react-query";
import { AuthWrapper } from "../pages/authentication/AuthWrapper"; import { AuthWrapper } from "../pages/authentication/AuthWrapper";
export const queryClient = new QueryClient({ export const queryClient = new QueryClient({
defaultOptions: { defaultOptions: {
queries: { queries: {
staleTime: 5 * 60 * 1000, // 5 min: data considered fresh staleTime: 5 * 60 * 1000, // 5 min: data considered fresh
refetchOnWindowFocus: true, // refresh on tab switch refetchOnWindowFocus: true, // refresh on tab switch
refetchOnReconnect: true, // re-fetch if network was lost refetchOnReconnect: true, // re-fetch if network was lost
retry: false, retry: false,
}, },
}, },
@ -17,14 +17,13 @@ export const queryClient = new QueryClient({
const AuthLayout = () => { const AuthLayout = () => {
return ( return (
// <div className="login-box"> // <div className="login-box">
<div class="authentication-wrapper authentication-cover"> <div className="authentication-wrapper authentication-cover">
<Link <Link
aria-label="Go to Home Page" aria-label="Go to Home Page"
to="/" to="/"
className="app-brand-link gap-2 position-fixed top-2 start-0 mx-2 mx-sm-4" className="app-brand-link gap-2 position-fixed top-2 start-0 mx-2 mx-sm-4"
> >
<span className="app-brand-logo rounded-circle " > <span className="app-brand-logo rounded-circle ">
<img <img
src="/img/brand/marco.png" src="/img/brand/marco.png"
alt="marco-logo" alt="marco-logo"
@ -38,4 +37,4 @@ const AuthLayout = () => {
); );
}; };
export default AuthLayout; export default AuthLayout;

58
src/pages/Gallary/ImagePop.jsx
View File

@ -2,7 +2,7 @@ import React, { useState, useEffect } from "react";
import "./ImagePop.css"; import "./ImagePop.css";
import { useModal } from "./ModalContext"; import { useModal } from "./ModalContext";
import moment from "moment"; import moment from "moment";
import {formatUTCToLocalTime} from "../../utils/dateUtils"; import { formatUTCToLocalTime } from "../../utils/dateUtils";
const ImagePop = ({ batch, initialIndex = 0 }) => { const ImagePop = ({ batch, initialIndex = 0 }) => {
const { closeModal } = useModal(); const { closeModal } = useModal();
@ -27,12 +27,12 @@ const ImagePop = ({ batch, initialIndex = 0 }) => {
image.uploadedBy?.lastName || "" image.uploadedBy?.lastName || ""
}`.trim(); }`.trim();
const date = formatUTCToLocalTime(image.uploadedAt); const date = formatUTCToLocalTime(image.uploadedAt);
// Location and category details from the 'batch' object (as previously corrected) // Location and category details from the 'batch' object (as previously corrected)
const buildingName = batch.buildingName; const buildingName = batch.buildingName;
const floorName = batch.floorName; const floorName = batch.floorName;
const workAreaName = batch.workAreaName; const workAreaName = batch.workAreaName;
const activityName = batch.activityName; const activityName = batch.activityName;
const batchComment = batch.comment; const batchComment = batch.comment;
// Handler for navigating to the previous image // Handler for navigating to the previous image
@ -54,38 +54,58 @@ const ImagePop = ({ batch, initialIndex = 0 }) => {
return ( return (
<div className="image-modal-overlay"> <div className="image-modal-overlay">
<div className="image-modal-content"> <div className="image-modal-content">
<i className="bx bx-x close-button" onClick={closeModal}></i>
<i className='bx bx-x close-button' onClick={closeModal}></i>
{hasPrev && ( {hasPrev && (
<button className="nav-button prev-button" onClick={handlePrev}> <button className="nav-button prev-button" onClick={handlePrev}>
<i className='bx bx-chevron-left'></i> <i className="bx bx-chevron-left"></i>
</button> </button>
)} )}
<div className="image-container"> <div className="image-container">
<img src={image.url} alt="Preview" className="modal-image" /> <img src={image.url} alt="Preview" className="modal-image" />
</div> </div>
{hasNext && ( {hasNext && (
<button className="nav-button next-button" onClick={handleNext}> <button className="nav-button next-button" onClick={handleNext}>
<i className='bx bx-chevron-right'></i> <i className="bx bx-chevron-right"></i>
</button> </button>
)} )}
<div className="image-details"> <div className="image-details">
<div className="flex alig-items-center">
<div className="flex alig-items-center"> <i className='bx bxs-user'></i> <span className="text-muted">Uploaded By : </span> <span className="text-secondary">{fullName}</span></div> {" "}
<div className="flex alig-items-center"> <i class='bx bxs-calendar' ></i> <span className="text-muted">Date : </span> <span className="text-secondary"> {date}</span></div> <i className="bx bxs-user"></i>{" "}
<div className="flex alig-items-center"> <i class='bx bx-map' ></i> <span className="text-muted">Uploaded By : </span> <span className="text-secondary">{buildingName} <i className='bx bx-chevron-right'></i> {floorName} <i className='bx bx-chevron-right'></i> <span className="text-muted">Uploaded By : </span>{" "}
{workAreaName || "Unknown"} <i className='bx bx-chevron-right'></i> {activityName}</span></div> <span className="text-secondary">{fullName}</span>
<div className="flex alig-items-center"> <i className='bx bx-comment-dots'></i> <span className="text-muted">comment : </span> <span className="text-secondary">{batchComment}</span></div> </div>
<div className="flex alig-items-center">
{" "}
<i className="bx bxs-calendar"></i>{" "}
<span className="text-muted">Date : </span>{" "}
<span className="text-secondary"> {date}</span>
</div>
<div className="flex alig-items-center">
{" "}
<i className="bx bx-map"></i>{" "}
<span className="text-muted">Uploaded By : </span>{" "}
<span className="text-secondary">
{buildingName} <i className="bx bx-chevron-right"></i> {floorName}{" "}
<i className="bx bx-chevron-right"></i>
{workAreaName || "Unknown"}{" "}
<i className="bx bx-chevron-right"></i> {activityName}
</span>
</div>
<div className="flex alig-items-center">
{" "}
<i className="bx bx-comment-dots"></i>{" "}
<span className="text-muted">comment : </span>{" "}
<span className="text-secondary">{batchComment}</span>
</div>
</div> </div>
</div> </div>
</div> </div>
); );
}; };
export default ImagePop; export default ImagePop;

2
src/pages/Home/LandingPage.jsx
View File

@ -1449,7 +1449,7 @@ const LandingPage = () => {
</span> </span>
<span className="app-brand-text demo text-white fw-bold ms-2 ps-1"> <span className="app-brand-text demo text-white fw-bold ms-2 ps-1">
<Link className="cta-title"> <Link className="cta-title">
<div class="app-brand-logo demo"> <div className="app-brand-logo demo">
<img <img
className="rounded" className="rounded"
style={{ style={{

38
src/pages/authentication/MainForgetPage.jsx
View File

@ -1,20 +1,26 @@
import React from "react" import React from "react";
// import LoginPage from "./LoginPage"; // import LoginPage from "./LoginPage";
import ForgotPasswordPage from "./ForgotPasswordPage"; import ForgotPasswordPage from "./ForgotPasswordPage";
const MainForgetPage = () => { const MainForgetPage = () => {
return ( return (
<> <>
<div className="authentication-inner row m-0">
<div class="authentication-inner row m-0"> <div className="d-none d-lg-flex col-lg-7 col-xl-8 h-100 align-items-center p-3">
<div class="d-none d-lg-flex col-lg-7 col-xl-8 h-100 align-items-center p-3"> <div className="w-75 h-75 d-flex justify-content-center">
<div class="w-75 h-75 d-flex justify-content-center"> <img
<img src="https://demos.themeselection.com/sneat-bootstrap-html-admin-template/assets/img/illustrations/girl-unlock-password-light.png" class="object-fit-sm-contain " alt="Login image" width="700" data-app-dark-img="illustrations/girl-unlock-password-dark.png" data-app-light-img="illustrations/girl-unlock-password-light.png" /> src="/img/illustrations/girl-unlock-password-light.png"
</div> className="object-fit-sm-contain "
</div> alt="Login image"
<ForgotPasswordPage /> width="700"
</div> data-app-dark-img="illustrations/girl-unlock-password-dark.png"
</> data-app-light-img="illustrations/girl-unlock-password-light.png"
) />
} </div>
export default MainForgetPage; </div>
<ForgotPasswordPage />
</div>
</>
);
};
export default MainForgetPage;

38
src/pages/authentication/MainRegisterPage.jsx
View File

@ -1,19 +1,25 @@
import React from "react" import React from "react";
import RegisterPage from "./RegisterPage"; import RegisterPage from "./RegisterPage";
const MainRegisterPage = () => { const MainRegisterPage = () => {
return ( return (
<> <>
<div className="authentication-inner row m-0">
<div class="authentication-inner row m-0"> <div className="d-none d-lg-flex col-lg-7 col-xl-8 h-100 align-items-center p-3">
<div class="d-none d-lg-flex col-lg-7 col-xl-8 h-100 align-items-center p-3"> <div className="w-75 h-75 d-flex justify-content-center">
<div class="w-75 h-75 d-flex justify-content-center"> <img
<img src="https://demos.themeselection.com/sneat-bootstrap-html-admin-template/assets/img/illustrations/girl-unlock-password-light.png" class="object-fit-sm-contain " alt="Login image" width="700" data-app-dark-img="illustrations/girl-unlock-password-dark.png" data-app-light-img="illustrations/girl-unlock-password-light.png" /> src="/img/illustrations/registration.jpg"
</div> className="object-fit-sm-contain "
</div> alt="Login image"
<RegisterPage /> width="700"
</div> data-app-dark-img="illustrations/registration.jpg"
</> data-app-light-img="illustrations/registration.jpg"
) />
} </div>
export default MainRegisterPage; </div>
<RegisterPage />
</div>
</>
);
};
export default MainRegisterPage;

1
src/pages/authentication/page-auth.css
View File

@ -18,6 +18,7 @@
} }
.authentication-wrapper.authentication-cover .authentication-inner { .authentication-wrapper.authentication-cover .authentication-inner {
height: 100vh; height: 100vh;
background-color: #fff;
} }
.authentication-wrapper.authentication-basic .authentication-inner { .authentication-wrapper.authentication-basic .authentication-inner {
max-width: 400px; max-width: 400px;