mirror of
https://github.com/OpenSignLabs/OpenSign.git
synced 2026-08-21 07:02:32 +02:00
feat: implement daisy-ui in alert, report, drive
This commit is contained in:
@@ -3,7 +3,6 @@ import Parse from "parse";
|
||||
import { jwtDecode } from "jwt-decode";
|
||||
import { useScript } from "../hook/useScript";
|
||||
import ModalUi from "../primitives/ModalUi";
|
||||
import { modalCancelBtnColor, modalSubmitBtnColor } from "../constant/const";
|
||||
|
||||
/*
|
||||
* `GoogleSignInBtn`as it's name indicates it render google sign in button
|
||||
@@ -207,45 +206,25 @@ const GoogleSignInBtn = ({
|
||||
localStorage.setItem("parseAppId", appid);
|
||||
};
|
||||
return (
|
||||
<div style={{ position: "relative" }}>
|
||||
<div className="relative">
|
||||
{thirdpartyLoader && (
|
||||
<div
|
||||
style={{
|
||||
position: "fixed",
|
||||
width: "100vw",
|
||||
height: "100vh",
|
||||
backgroundColor: "rgba(0,0,0,0.2)",
|
||||
top: 0,
|
||||
left: 0,
|
||||
zIndex: 2
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
position: "fixed",
|
||||
fontSize: "50px",
|
||||
color: "#3ac9d6",
|
||||
top: "50%",
|
||||
left: "45%"
|
||||
}}
|
||||
className="loader-37"
|
||||
></div>
|
||||
<div className="fixed w-[100vw] h-[100vh] bg-black bg-opacity-25 top-0 left-0 z-20 text-[50px] text-[#3ac9d6]">
|
||||
<div className="fixed top-[50%] left-[45%] loader-37"></div>
|
||||
</div>
|
||||
)}
|
||||
<div ref={googleBtn} className="text-sm"></div>
|
||||
<ModalUi showClose={false} isOpen={isModal} title="Sign up form">
|
||||
<form className="px-4 py-3">
|
||||
<form className="px-4 py-3 text-base-content">
|
||||
<div className="mb-3">
|
||||
<label
|
||||
htmlFor="Phone"
|
||||
style={{ display: "flex" }}
|
||||
className="block text-xs text-gray-700 font-semibold"
|
||||
>
|
||||
Phone <span style={{ fontSize: 13, color: "red" }}>*</span>
|
||||
Phone <span className="text-[13px] text-[red]">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="tel"
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
id="Phone"
|
||||
value={userDetails.Phone}
|
||||
onChange={(e) =>
|
||||
@@ -260,14 +239,13 @@ const GoogleSignInBtn = ({
|
||||
<div className="mb-3">
|
||||
<label
|
||||
htmlFor="Company"
|
||||
style={{ display: "flex" }}
|
||||
className="block text-xs text-gray-700 font-semibold"
|
||||
>
|
||||
Company <span style={{ fontSize: 13, color: "red" }}>*</span>
|
||||
Company <span className="text-[13px] text-[red]">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
id="Company"
|
||||
value={userDetails.Company}
|
||||
onChange={(e) =>
|
||||
@@ -282,14 +260,13 @@ const GoogleSignInBtn = ({
|
||||
<div className="mb-3">
|
||||
<label
|
||||
htmlFor="JobTitle"
|
||||
style={{ display: "flex" }}
|
||||
className="block text-xs text-gray-700 font-semibold"
|
||||
>
|
||||
Job Title <span style={{ fontSize: 13, color: "red" }}>*</span>
|
||||
Job Title <span className="text-[13px] text-[red]">*</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
id="JobTitle"
|
||||
value={userDetails.Destination}
|
||||
onChange={(e) =>
|
||||
@@ -301,20 +278,18 @@ const GoogleSignInBtn = ({
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<div className="flex flex-row gap-2">
|
||||
<button
|
||||
type="button"
|
||||
className="px-3 py-1.5 text-white rounded shadow-md text-center focus:outline-none "
|
||||
className="op-btn op-btn-primary"
|
||||
onClick={() => handleSubmitbtn()}
|
||||
style={{ marginRight: 10, backgroundColor: modalSubmitBtnColor }}
|
||||
>
|
||||
Sign up
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="p-1.5 text-black border-[1px] border-[#ccc] shadow-md rounded focus:outline-none"
|
||||
className="op-btn op-btn-neutral"
|
||||
onClick={handleCloseModal}
|
||||
style={{ width: 90, backgroundColor: modalCancelBtnColor }}
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
|
||||
@@ -599,42 +599,22 @@ function DriveBody(props) {
|
||||
isOpen={isDeleteDoc}
|
||||
headerColor={themeColor}
|
||||
title={"Delete Document"}
|
||||
handleClose={() => {
|
||||
setIsDeleteDoc(false);
|
||||
}}
|
||||
handleClose={() => setIsDeleteDoc(false)}
|
||||
>
|
||||
<div style={{ height: "100%", padding: 20 }}>
|
||||
<div className="h-full p-[20px]">
|
||||
<p>Are you sure you want to delete this document?</p>
|
||||
|
||||
<div
|
||||
style={{
|
||||
height: "1px",
|
||||
backgroundColor: "#9f9f9f",
|
||||
width: "100%",
|
||||
marginTop: "15px",
|
||||
marginBottom: "15px"
|
||||
}}
|
||||
></div>
|
||||
|
||||
<div className="h-[1px] w-full bg-[#9f9f9f] my-[15px]"></div>
|
||||
<button
|
||||
onClick={() => {
|
||||
handleDeleteDocument(selectDoc);
|
||||
}}
|
||||
style={{
|
||||
background: themeColor,
|
||||
color: "white"
|
||||
}}
|
||||
onClick={() => handleDeleteDocument(selectDoc)}
|
||||
type="button"
|
||||
className="finishBtn"
|
||||
className="op-btn op-btn-primary mr-2"
|
||||
>
|
||||
Yes
|
||||
</button>
|
||||
<button
|
||||
onClick={() => {
|
||||
setIsDeleteDoc(false);
|
||||
}}
|
||||
onClick={() => setIsDeleteDoc(false)}
|
||||
type="button"
|
||||
className="finishBtn cancelBtn"
|
||||
className="op-btn op-btn-neutral"
|
||||
>
|
||||
No
|
||||
</button>
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import Title from "../components/Title";
|
||||
import { NavLink } from "react-router-dom";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import login_img from "../assets/images/login_img.svg";
|
||||
import Parse from "parse";
|
||||
import Alert from "../primitives/Alert";
|
||||
@@ -10,6 +10,7 @@ import { fetchAppInfo } from "../redux/reducers/infoReducer";
|
||||
|
||||
function ForgotPassword() {
|
||||
const dispatch = useDispatch();
|
||||
const navigate = useNavigate();
|
||||
const [state, setState] = useState({
|
||||
email: "",
|
||||
password: "",
|
||||
@@ -79,7 +80,7 @@ function ForgotPassword() {
|
||||
)}
|
||||
</div>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-x-2">
|
||||
<div className="">
|
||||
<div>
|
||||
<form onSubmit={handleSubmit}>
|
||||
<h2 className="text-[30px] mt-6">Welcome Back !</h2>
|
||||
<span className="text-[12px] text-[#878787]">
|
||||
@@ -89,9 +90,9 @@ function ForgotPassword() {
|
||||
<div className="px-6 py-4">
|
||||
<label className="block text-xs">Email</label>
|
||||
<input
|
||||
type="text"
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
type="email"
|
||||
name="email"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
value={state.email}
|
||||
onChange={handleChange}
|
||||
required
|
||||
@@ -103,12 +104,12 @@ function ForgotPassword() {
|
||||
<button type="submit" className="op-btn op-btn-primary">
|
||||
Submit
|
||||
</button>
|
||||
<NavLink
|
||||
to="/"
|
||||
className="rounded-sm bg-white border-[1px] border-[#15b4e9] text-[#15b4e9] px-4 py-3 text-xs font-semibold shadow uppercase cursor-pointer"
|
||||
<button
|
||||
onClick={() => navigate("/", { replace: true })}
|
||||
className="op-btn op-btn-secondary"
|
||||
>
|
||||
Login
|
||||
</NavLink>
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
@@ -10,11 +10,7 @@ import { NavLink, useNavigate, useLocation } from "react-router-dom";
|
||||
import login_img from "../assets/images/login_img.svg";
|
||||
import { useWindowSize } from "../hook/useWindowSize";
|
||||
import ModalUi from "../primitives/ModalUi";
|
||||
import {
|
||||
isEnableSubscription,
|
||||
modalCancelBtnColor,
|
||||
modalSubmitBtnColor
|
||||
} from "../constant/const";
|
||||
import { isEnableSubscription } from "../constant/const";
|
||||
import Alert from "../primitives/Alert";
|
||||
import { appInfo } from "../constant/appinfo";
|
||||
import { fetchAppInfo } from "../redux/reducers/infoReducer";
|
||||
@@ -1099,7 +1095,7 @@ function Login() {
|
||||
<div
|
||||
aria-labelledby="loginHeading"
|
||||
role="region"
|
||||
className="md:p-10 lg:p-16 "
|
||||
className="md:p-10 lg:p-16"
|
||||
>
|
||||
<div className="md:p-4 lg:p-10 p-4 bg-base-100 text-base-content md:border-[1px] md:border-gray-400 ">
|
||||
<div className="w-[250px] h-[66px] inline-block overflow-hidden">
|
||||
@@ -1125,8 +1121,8 @@ function Login() {
|
||||
</label>
|
||||
<input
|
||||
id="email"
|
||||
type="text"
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded text-xs"
|
||||
type="email"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
name="email"
|
||||
value={state.email}
|
||||
onChange={handleChange}
|
||||
@@ -1144,18 +1140,14 @@ function Login() {
|
||||
type={
|
||||
state.passwordVisible ? "text" : "password"
|
||||
}
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded text-xs"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
name="password"
|
||||
value={state.password}
|
||||
onChange={handleChange}
|
||||
required
|
||||
/>
|
||||
<span
|
||||
className={`absolute top-[50%] right-[10px] -translate-y-[50%] cursor-pointer ${
|
||||
state.passwordVisible
|
||||
? "text-[#007bff]"
|
||||
: "text-black"
|
||||
}`}
|
||||
className="absolute cursor-pointer top-[50%] right-[10px] -translate-y-[50%] text-base-content"
|
||||
onClick={togglePasswordVisibility}
|
||||
>
|
||||
{state.passwordVisible ? (
|
||||
@@ -1170,7 +1162,7 @@ function Login() {
|
||||
<div className="relative mt-1">
|
||||
<NavLink
|
||||
to="/forgetpassword"
|
||||
className="text-[13px] text-[#002864] hover:underline underline-offset-1 focus:outline-none cursor-pointer ml-1"
|
||||
className="text-[13px] op-link op-link-primary underline-offset-1 focus:outline-none ml-1"
|
||||
>
|
||||
Forgot Password?
|
||||
</NavLink>
|
||||
@@ -1198,17 +1190,9 @@ function Login() {
|
||||
</NavLink>
|
||||
</div>
|
||||
</form>
|
||||
<br />
|
||||
{appInfo.googleClietId && (
|
||||
<div className="text-sm flex justify-center items-center">
|
||||
<hr className="border-[1px] border-gray-300 w-full" />
|
||||
<span className="px-2 text-gray-500 cursor-default">
|
||||
OR
|
||||
</span>
|
||||
<hr className="border-[1px] border-gray-300 w-full" />
|
||||
</div>
|
||||
<div className="op-divider my-4 text-sm">OR</div>
|
||||
)}
|
||||
<br />
|
||||
<div className="flex flex-col justify-center items-center gap-y-3">
|
||||
{/* {appInfo?.fbAppId && (
|
||||
<LoginFacebook
|
||||
@@ -1252,7 +1236,7 @@ function Login() {
|
||||
<Alert type={state.alertType}>{state.alertMsg}</Alert>
|
||||
</div>
|
||||
<ModalUi isOpen={isModal} title="Additional Info" showClose={false}>
|
||||
<form className="px-4 py-3">
|
||||
<form className="px-4 py-3 text-base-content">
|
||||
<div className="mb-3">
|
||||
<label
|
||||
htmlFor="Company"
|
||||
@@ -1263,7 +1247,7 @@ function Login() {
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
id="Company"
|
||||
value={userDetails.Company}
|
||||
onChange={(e) =>
|
||||
@@ -1286,7 +1270,7 @@ function Login() {
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
id="JobTitle"
|
||||
value={userDetails.Destination}
|
||||
onChange={(e) =>
|
||||
@@ -1298,23 +1282,18 @@ function Login() {
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<div className="mt-4">
|
||||
<div className="mt-4 gap-2 flex flex-row">
|
||||
<button
|
||||
type="button"
|
||||
className="px-3 py-1.5 text-white rounded shadow-md text-center focus:outline-none "
|
||||
className="op-btn op-btn-primary"
|
||||
onClick={(e) => handleSubmitbtn(e)}
|
||||
style={{
|
||||
marginRight: 10,
|
||||
backgroundColor: modalSubmitBtnColor
|
||||
}}
|
||||
>
|
||||
Login
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="py-1.5 text-black border-[1px] border-[#ccc] shadow-md rounded focus:outline-none"
|
||||
className="op-btn op-btn-neutral"
|
||||
onClick={handleCloseModal}
|
||||
style={{ width: 75, backgroundColor: modalCancelBtnColor }}
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
@@ -1324,14 +1303,8 @@ function Login() {
|
||||
</>
|
||||
) : (
|
||||
<div
|
||||
style={{
|
||||
position: "fixed",
|
||||
fontSize: "50px",
|
||||
color: "#3ac9d6",
|
||||
top: "50%",
|
||||
left: "45%"
|
||||
}}
|
||||
className="loader-37"
|
||||
className="loader-37 fixed top-[50%] left-[45%] text-[50px] text-[#3ac9d6]"
|
||||
style={{ color: "#3ac9d6" }}
|
||||
></div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
@@ -6,6 +6,7 @@ import { toDataUrl } from "../constant/Utils";
|
||||
import Parse from "parse";
|
||||
import { appInfo } from "../constant/appinfo";
|
||||
import { SaveFileSize } from "../constant/saveFileSize";
|
||||
import Alert from "../primitives/Alert";
|
||||
const ManageSign = () => {
|
||||
const appName = appInfo.appname;
|
||||
const [penColor, setPenColor] = useState("blue");
|
||||
@@ -17,7 +18,7 @@ const ManageSign = () => {
|
||||
const [isvalue, setIsValue] = useState(false);
|
||||
const allColor = ["blue", "red", "black"];
|
||||
const [isLoader, setIsLoader] = useState(true);
|
||||
const [isSuccess, setIsSuccess] = useState(false);
|
||||
const [isAlert, setIsAlert] = useState({ type: "success", message: "" });
|
||||
const [Initials, setInitials] = useState("");
|
||||
const [isInitials, setIsInitials] = useState(false);
|
||||
const [id, setId] = useState("");
|
||||
@@ -185,12 +186,20 @@ const ManageSign = () => {
|
||||
updateSign.set("UserId", userId);
|
||||
const res = await updateSign.save();
|
||||
setIsLoader(false);
|
||||
setIsSuccess(true);
|
||||
setIsAlert({
|
||||
type: "success",
|
||||
message: "Signature saved successfully."
|
||||
});
|
||||
setTimeout(() => setIsAlert({}), 2000);
|
||||
return res;
|
||||
} catch (err) {
|
||||
console.log(err);
|
||||
setIsLoader(false);
|
||||
alert(`${err.message}`);
|
||||
setIsAlert({
|
||||
type: "danger",
|
||||
message: `${err.message}`
|
||||
});
|
||||
setTimeout(() => setIsAlert({}), 2000);
|
||||
}
|
||||
} else {
|
||||
try {
|
||||
@@ -201,12 +210,20 @@ const ManageSign = () => {
|
||||
updateSign.set("UserId", userId);
|
||||
const res = await updateSign.save();
|
||||
setIsLoader(false);
|
||||
setIsSuccess(true);
|
||||
setIsAlert({
|
||||
type: "success",
|
||||
message: "Signature saved successfully."
|
||||
});
|
||||
setTimeout(() => setIsAlert({}), 2000);
|
||||
return res;
|
||||
} catch (err) {
|
||||
console.log(err);
|
||||
setIsLoader(false);
|
||||
alert(`${err.message}`);
|
||||
setIsAlert({
|
||||
type: "success",
|
||||
message: `${err.message}`
|
||||
});
|
||||
setTimeout(() => setIsAlert({}), 2000);
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -230,15 +247,7 @@ const ManageSign = () => {
|
||||
<div className="loader-37 "></div>
|
||||
</div>
|
||||
)}
|
||||
{isSuccess && (
|
||||
<div
|
||||
className="alert alert-success successBox"
|
||||
role="alert"
|
||||
onAnimationEnd={() => setIsSuccess(false)}
|
||||
>
|
||||
Signature saved successfully!
|
||||
</div>
|
||||
)}
|
||||
{isAlert?.message && <Alert type={isAlert.type}>{isAlert.message}</Alert>}
|
||||
<div
|
||||
className="mainDiv"
|
||||
style={{
|
||||
|
||||
@@ -4,13 +4,11 @@ import Title from "../components/Title";
|
||||
|
||||
const PageNotFound = ({ prefix }) => {
|
||||
return (
|
||||
<div className="flex items-center justify-center h-screen w-full bg-white rounded">
|
||||
<div className="flex items-center justify-center h-screen w-full bg-base-100 text-base-content rounded">
|
||||
<Title title={"Page Not Found"} />
|
||||
<div className="text-center">
|
||||
<h1 className="text-[60px] lg:text-[120px] font-semibold text-black">
|
||||
404
|
||||
</h1>
|
||||
<p className="text-[30px] lg:text-[50px] text-black">
|
||||
<h1 className="text-[60px] lg:text-[120px] font-semibold">404</h1>
|
||||
<p className="text-[30px] lg:text-[50px]">
|
||||
{prefix ? prefix : "Page"} Not Found
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@@ -173,21 +173,8 @@ const Report = () => {
|
||||
<>
|
||||
<Title title={reportName} />
|
||||
{isLoader ? (
|
||||
<div
|
||||
style={{
|
||||
height: "100vh",
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
justifyContent: "center"
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
fontSize: "45px",
|
||||
color: "#3dd3e0"
|
||||
}}
|
||||
className="loader-37"
|
||||
></div>
|
||||
<div className="h-[100vh] flex justify-center items-center text-[45px] text-[#3dd3e0]">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
|
||||
@@ -529,7 +529,7 @@ const Signup = () => {
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
value={name}
|
||||
onChange={(e) => setName(e.target.value)}
|
||||
required
|
||||
@@ -541,8 +541,8 @@ const Signup = () => {
|
||||
</label>
|
||||
<input
|
||||
id="email"
|
||||
type="text"
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs lowercase"
|
||||
type="email"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
value={email}
|
||||
onChange={(e) =>
|
||||
setEmail(e.target.value?.toLowerCase())
|
||||
@@ -556,7 +556,7 @@ const Signup = () => {
|
||||
</label>
|
||||
<input
|
||||
type="tel"
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
value={phone}
|
||||
onChange={(e) => setPhone(e.target.value)}
|
||||
required
|
||||
@@ -568,7 +568,7 @@ const Signup = () => {
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
value={company}
|
||||
onChange={(e) => setCompany(e.target.value)}
|
||||
required
|
||||
@@ -580,7 +580,7 @@ const Signup = () => {
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
value={jobTitle}
|
||||
onChange={(e) => setJobTitle(e.target.value)}
|
||||
required
|
||||
@@ -593,16 +593,14 @@ const Signup = () => {
|
||||
<div className="relative">
|
||||
<input
|
||||
type={showPassword ? "text" : "password"}
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm w-full"
|
||||
name="password"
|
||||
value={password}
|
||||
onChange={(e) => handlePasswordChange(e)}
|
||||
required
|
||||
/>
|
||||
<span
|
||||
className={`absolute top-[50%] right-[10px] -translate-y-[50%] cursor-pointer ${
|
||||
showPassword ? "text-[#007bff]" : "text-black"
|
||||
}`}
|
||||
className={`absolute top-[50%] right-[10px] -translate-y-[50%] cursor-pointer text-base-content`}
|
||||
onClick={togglePasswordVisibility}
|
||||
>
|
||||
{showPassword ? (
|
||||
|
||||
@@ -5,25 +5,25 @@ const Alert = ({ children, type }) => {
|
||||
function theme(color) {
|
||||
switch (color) {
|
||||
case "success":
|
||||
return "border-[#c3e6cb] bg-[#d4edda] text-[#155724]";
|
||||
return "op-alert-success";
|
||||
case "info":
|
||||
return "border-[#adcdeb] bg-[#c1daf0] text-[#153756]";
|
||||
return "op-alert-info";
|
||||
case "danger":
|
||||
return "border-[#f0a8a8] bg-[#f4bebe] text-[#c42121]";
|
||||
return "op-alert-error";
|
||||
case "warning":
|
||||
return "op-alert-warning";
|
||||
default:
|
||||
return "border-[#d6d6d6] bg-[#d9d9d9] text-[#575757]";
|
||||
return "";
|
||||
}
|
||||
}
|
||||
return (
|
||||
<>
|
||||
{children && (
|
||||
<div
|
||||
className={`z-[1000] fixed top-20 left-1/2 transform -translate-x-1/2 border-[1px] text-sm ${textcolor} rounded py-[.75rem] px-[1.25rem] z-50`}
|
||||
>
|
||||
{children}
|
||||
children && (
|
||||
<div className="z-[1000] fixed top-20 left-1/2 transform -translate-x-1/2 text-sm">
|
||||
<div className={`op-alert ${textcolor}`}>
|
||||
<span>{children}</span>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
</div>
|
||||
)
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -888,7 +888,7 @@ const ReportTable = (props) => {
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
)}
|
||||
<div className="p-2 overflow-x-scroll w-full bg-white rounded-xl">
|
||||
<div className="p-2 overflow-x-scroll w-full bg-base-100 text-base-content rounded-xl">
|
||||
{isCelebration && (
|
||||
<div style={{ position: "relative", zIndex: "1000" }}>
|
||||
<Confetti width={window.innerWidth} height={window.innerHeight} />
|
||||
@@ -929,8 +929,7 @@ const ReportTable = (props) => {
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<table className="op-table op-table-zebra">
|
||||
{/* <table className="table-auto w-full border-collapse"> */}
|
||||
<table className="op-table op-table-zebra border-collapse">
|
||||
<thead className="text-[14px]">
|
||||
<tr className="border-y-[1px]">
|
||||
{props.heading?.map((item, index) => (
|
||||
@@ -1586,7 +1585,7 @@ const ReportTable = (props) => {
|
||||
)}
|
||||
</div>
|
||||
{props.List?.length <= 0 && (
|
||||
<div className="flex flex-col items-center justify-center w-full bg-white rounded-xl py-4">
|
||||
<div className="flex flex-col items-center justify-center w-full bg-base-100 text-base-content rounded-xl py-4">
|
||||
<div className="w-[60px] h-[60px] overflow-hidden">
|
||||
<img
|
||||
className="w-full h-full object-contain"
|
||||
|
||||
@@ -20,7 +20,7 @@ const ModalUi = ({
|
||||
<div
|
||||
className={`${
|
||||
reduceWidth || "md:min-w-[500px]"
|
||||
} fixed z-[1000] top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 text-sm bg-white rounded shadow-md max-h-90 min-w-[90%] overflow-y-auto hide-scrollbar `}
|
||||
} fixed z-[1000] top-1/2 left-1/2 transform -translate-x-1/2 -translate-y-1/2 text-sm bg-base-100 rounded-xl shadow-md max-h-90 min-w-[90%] overflow-y-auto hide-scrollbar `}
|
||||
>
|
||||
{showHeader && (
|
||||
<div
|
||||
|
||||
Reference in New Issue
Block a user