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="d-flex justify-content-between">
<div
className={`d-flex align-items-center ${IsActive && "cursor-pointer"
}`}
className={`d-flex align-items-center ${
IsActive && "cursor-pointer"
}`}
onClick={() => {
if (IsActive) {
setIsOpenModalNote(true);
@ -89,10 +90,11 @@ const CardViewDirectory = ({
)}
{!IsActive && (
<i
className={`bx ${dirActions.action && dirActions.id === contact.id
className={`bx ${
dirActions.action && dirActions.id === contact.id
? "bx-loader-alt bx-spin"
: "bx-recycle"
} me-1 text-primary cursor-pointer`}
} me-1 text-primary cursor-pointer`}
title="Restore"
onClick={() => {
setDirActions({ action: false, id: contact.id });
@ -113,8 +115,9 @@ const CardViewDirectory = ({
</ul>
</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={() => {
if (IsActive) {
setIsOpenModalNote(true);
@ -126,7 +129,7 @@ const CardViewDirectory = ({
{contact.designation && (
<ul className="list-unstyled my-1 d-flex align-items-start ms-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 className="flex-grow-1 text-break small">
{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 ReactQuill from "react-quill";
import "react-quill/dist/quill.snow.css";
import "./CommentEditor.css";
const jiraModules = {
toolbar: [
["bold", "italic", "underline", "strike"],
["link", "code"],
[{ list: "bullet" }],
],
};
const jiraFormats = [
"bold",
"italic",
"underline",
"strike",
"link",
"code",
"list",
];
const CreateIssue = () =>
{
const [value, setValue] = useState("");
toolbar: [
["bold", "italic", "underline", "strike"],
["link", "code"],
[{ list: "bullet" }],
],
};
const jiraFormats = [
"bold",
"italic",
"underline",
"strike",
"link",
"code",
"list",
];
const CreateIssue = () => {
const [value, setValue] = useState("");
return (
<from >
<div className="row">
<div className="col-12 col-md-8">
<div className="row">
<label for="defaultFormControlInput" class="form-label ">
Name
<from>
<div className="row">
<div className="col-12 col-md-8">
<div className="row">
<label for="defaultFormControlInput" className="form-label ">
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>
<input
type="text"
class="form-control form-control-sm"
id="defaultFormControlInput"
placeholder="John Doe"
aria-describedby="defaultFormControlHelp"
/>
<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="row my-md-6 my-4 px-0">
<div className="col-6 ps-0">
<label for="defaultFormControlInput" class="form-label ">
Projec
</label>
<select
name="DataTables_Table_0_length"
aria-controls="DataTables_Table_0"
className="form-select form-select-sm"
aria-label=""
<div className="col-6 pe-0">
<label for="defaultFormControlInput" className="form-label ">
Type
</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 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>
<option>Project-2</option>
<option>Project-3</option>
</select>
</div>
<div className="col-6 pe-0">
<label for="defaultFormControlInput" class="form-label ">
Type
<input
name="customRadioIcon"
className="form-check-input form-check-input-sm"
type="radio"
id="customRadioIcon1"
checked
/>{" "}
Low
</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 className="row my-md-6 my-4 px-0">
<div className="col-6 ps-0">
<label for="defaultFormControlInput" class="form-label ">
Status
</label>
<select
name="DataTables_Table_0_length"
aria-controls="DataTables_Table_0"
className="form-select form-select-sm"
aria-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="customRadioIcon2"
>
<option>Project-2</option>
<option>Project-2</option>
<option>Project-3</option>
</select>
<input
name="customRadioIcon"
className="form-check-input form-check-input-sm"
type="radio"
id="customRadioIcon2"
/>{" "}
Medium
</label>
</div>
<div className="col-6 pe-0">
<label for="defaultFormControlInput" class="form-label ">
Activity
</label>
<select
name="DataTables_Table_0_length"
aria-controls="DataTables_Table_0"
className="form-select form-select-sm"
aria-label=""
</div>
<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="customRadioIcon3"
>
<option>Project-2</option>
<option>Project-2</option>
<option>Project-3</option>
</select>
<input
name="customRadioIcon"
className="form-check-input form-check-input-sm"
type="radio"
id="customRadioIcon3"
/>{" "}
High
</label>
</div>
</div>
</div>
<div className="col-12 col-md-4">
<div class="row g-2">
<label for="defaultFormControlInput" class="form-label ">
Priority
</label>
<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="customRadioIcon1">
<input
name="customRadioIcon"
class="form-check-input form-check-input-sm"
type="radio"
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>
</div>
<div className="marco-quill-wrapper">
<ReactQuill
theme="snow"
value={value}
onChange={setValue}
placeholder="Add a comment..."
modules={jiraModules}
formats={jiraFormats}
/>
</div>
</div>
</from>
);
};

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

@ -226,7 +226,6 @@ const CreateRole = ({ modalType, onClose }) => {
{!masterFeatures && <p>Loading...</p>}
</div>
{masterFeatures && (
<div className="col-12 text-center">
<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 { Link, Outlet } from "react-router-dom";
import { QueryClient } from '@tanstack/react-query';
import { QueryClient } from "@tanstack/react-query";
import { AuthWrapper } from "../pages/authentication/AuthWrapper";
export const queryClient = new QueryClient({
defaultOptions: {
queries: {
staleTime: 5 * 60 * 1000, // 5 min: data considered fresh
refetchOnWindowFocus: true, // refresh on tab switch
refetchOnReconnect: true, // re-fetch if network was lost
staleTime: 5 * 60 * 1000, // 5 min: data considered fresh
refetchOnWindowFocus: true, // refresh on tab switch
refetchOnReconnect: true, // re-fetch if network was lost
retry: false,
},
},
@ -17,14 +17,13 @@ export const queryClient = new QueryClient({
const AuthLayout = () => {
return (
// <div className="login-box">
<div class="authentication-wrapper authentication-cover">
<div className="authentication-wrapper authentication-cover">
<Link
aria-label="Go to Home Page"
to="/"
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
src="/img/brand/marco.png"
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 { useModal } from "./ModalContext";
import moment from "moment";
import {formatUTCToLocalTime} from "../../utils/dateUtils";
import { formatUTCToLocalTime } from "../../utils/dateUtils";
const ImagePop = ({ batch, initialIndex = 0 }) => {
const { closeModal } = useModal();
@ -27,12 +27,12 @@ const ImagePop = ({ batch, initialIndex = 0 }) => {
image.uploadedBy?.lastName || ""
}`.trim();
const date = formatUTCToLocalTime(image.uploadedAt);
// Location and category details from the 'batch' object (as previously corrected)
const buildingName = batch.buildingName;
const floorName = batch.floorName;
const workAreaName = batch.workAreaName;
const activityName = batch.activityName;
const activityName = batch.activityName;
const batchComment = batch.comment;
// Handler for navigating to the previous image
@ -54,38 +54,58 @@ const ImagePop = ({ batch, initialIndex = 0 }) => {
return (
<div className="image-modal-overlay">
<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 && (
<button className="nav-button prev-button" onClick={handlePrev}>
<i className='bx bx-chevron-left'></i>
<i className="bx bx-chevron-left"></i>
</button>
)}
<div className="image-container">
<img src={image.url} alt="Preview" className="modal-image" />
</div>
<div className="image-container">
<img src={image.url} alt="Preview" className="modal-image" />
</div>
{hasNext && (
<button className="nav-button next-button" onClick={handleNext}>
<i className='bx bx-chevron-right'></i>
<i className="bx bx-chevron-right"></i>
</button>
)}
<div className="image-details">
<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>
<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>
{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 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 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>
);
};
export default ImagePop;
export default ImagePop;

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

@ -1449,7 +1449,7 @@ const LandingPage = () => {
</span>
<span className="app-brand-text demo text-white fw-bold ms-2 ps-1">
<Link className="cta-title">
<div class="app-brand-logo demo">
<div className="app-brand-logo demo">
<img
className="rounded"
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 ForgotPasswordPage from "./ForgotPasswordPage";
const MainForgetPage = () => {
return (
<>
<div class="authentication-inner row m-0">
<div class="d-none d-lg-flex col-lg-7 col-xl-8 h-100 align-items-center p-3">
<div class="w-75 h-75 d-flex justify-content-center">
<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" />
</div>
</div>
<ForgotPasswordPage />
</div>
</>
)
}
export default MainForgetPage;
return (
<>
<div className="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 className="w-75 h-75 d-flex justify-content-center">
<img
src="/img/illustrations/girl-unlock-password-light.png"
className="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"
/>
</div>
</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";
const MainRegisterPage = () => {
return (
<>
<div class="authentication-inner row m-0">
<div class="d-none d-lg-flex col-lg-7 col-xl-8 h-100 align-items-center p-3">
<div class="w-75 h-75 d-flex justify-content-center">
<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" />
</div>
</div>
<RegisterPage />
</div>
</>
)
}
export default MainRegisterPage;
return (
<>
<div className="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 className="w-75 h-75 d-flex justify-content-center">
<img
src="/img/illustrations/registration.jpg"
className="object-fit-sm-contain "
alt="Login image"
width="700"
data-app-dark-img="illustrations/registration.jpg"
data-app-light-img="illustrations/registration.jpg"
/>
</div>
</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 {
height: 100vh;
background-color: #fff;
}
.authentication-wrapper.authentication-basic .authentication-inner {
max-width: 400px;