mirror of
https://github.com/OpenSignLabs/OpenSign.git
synced 2026-08-25 17:12:37 +02:00
Merge branch 'feat_dasyui' of https://github.com/OpenSignLabs/OpenSign into resolve_stage
This commit is contained in:
prafull-opensignlabs
Generated
+45
@@ -58,6 +58,7 @@
|
||||
"@babel/runtime-corejs2": "^7.24.7",
|
||||
"autoprefixer": "^10.4.19",
|
||||
"commitizen": "^4.3.0",
|
||||
"daisyui": "^4.12.2",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint-plugin-prettier": "^4.2.1",
|
||||
"eslint-plugin-react": "^7.34.1",
|
||||
@@ -9041,6 +9042,16 @@
|
||||
"resolved": "https://registry.npmjs.org/css-select-base-adapter/-/css-select-base-adapter-0.1.1.tgz",
|
||||
"integrity": "sha512-jQVeeRG70QI08vSTwf1jHxp74JoZsr2XSgETae8/xC8ovSnL2WF87GTLO86Sbwdt2lK4Umg4HnnwMO4YF3Ce7w=="
|
||||
},
|
||||
"node_modules/css-selector-tokenizer": {
|
||||
"version": "0.8.0",
|
||||
"resolved": "https://registry.npmjs.org/css-selector-tokenizer/-/css-selector-tokenizer-0.8.0.tgz",
|
||||
"integrity": "sha512-Jd6Ig3/pe62/qe5SBPTN8h8LeUg/pT4lLgtavPf7updwwHpvFzxvOQBHYj2LZDMjUnBzgvIUSjRcf6oT5HzHFg==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"cssesc": "^3.0.0",
|
||||
"fastparse": "^1.1.2"
|
||||
}
|
||||
},
|
||||
"node_modules/css-to-react-native": {
|
||||
"version": "2.3.2",
|
||||
"resolved": "https://registry.npmjs.org/css-to-react-native/-/css-to-react-native-2.3.2.tgz",
|
||||
@@ -9264,6 +9275,15 @@
|
||||
"resolved": "https://registry.npmjs.org/csstype/-/csstype-3.1.3.tgz",
|
||||
"integrity": "sha512-M1uQkMl8rQK/szD0LNhtqxIPLpimGm8sOBwU7lLnCpSbTyY3yeU1Vc7l4KT5zT4s/yOxHH5O7tIuuLOCnLADRw=="
|
||||
},
|
||||
"node_modules/culori": {
|
||||
"version": "3.3.0",
|
||||
"resolved": "https://registry.npmjs.org/culori/-/culori-3.3.0.tgz",
|
||||
"integrity": "sha512-pHJg+jbuFsCjz9iclQBqyL3B2HLCBF71BwVNujUYEvCeQMvV97R59MNK3R2+jgJ3a1fcZgI9B3vYgz8lzr/BFQ==",
|
||||
"dev": true,
|
||||
"engines": {
|
||||
"node": "^12.20.0 || ^14.13.1 || >=16.0.0"
|
||||
}
|
||||
},
|
||||
"node_modules/cz-conventional-changelog": {
|
||||
"version": "3.3.0",
|
||||
"resolved": "https://registry.npmjs.org/cz-conventional-changelog/-/cz-conventional-changelog-3.3.0.tgz",
|
||||
@@ -9284,6 +9304,25 @@
|
||||
"@commitlint/load": ">6.1.1"
|
||||
}
|
||||
},
|
||||
"node_modules/daisyui": {
|
||||
"version": "4.12.2",
|
||||
"resolved": "https://registry.npmjs.org/daisyui/-/daisyui-4.12.2.tgz",
|
||||
"integrity": "sha512-ed3EFwPRLN+9+/MYPRB1pYjk6plRCBMobfBdSeB3voAS81KdL2pCKtbwJfUUpDdOnJ0F8T6oRdVX02P6UCD0Hg==",
|
||||
"dev": true,
|
||||
"dependencies": {
|
||||
"css-selector-tokenizer": "^0.8",
|
||||
"culori": "^3",
|
||||
"picocolors": "^1",
|
||||
"postcss-js": "^4"
|
||||
},
|
||||
"engines": {
|
||||
"node": ">=16.9.0"
|
||||
},
|
||||
"funding": {
|
||||
"type": "opencollective",
|
||||
"url": "https://opencollective.com/daisyui"
|
||||
}
|
||||
},
|
||||
"node_modules/damerau-levenshtein": {
|
||||
"version": "1.0.8",
|
||||
"resolved": "https://registry.npmjs.org/damerau-levenshtein/-/damerau-levenshtein-1.0.8.tgz",
|
||||
@@ -11119,6 +11158,12 @@
|
||||
"punycode": "^1.3.2"
|
||||
}
|
||||
},
|
||||
"node_modules/fastparse": {
|
||||
"version": "1.1.2",
|
||||
"resolved": "https://registry.npmjs.org/fastparse/-/fastparse-1.1.2.tgz",
|
||||
"integrity": "sha512-483XLLxTVIwWK3QTrMGRqUfUpoOs/0hbQrl2oz4J0pAcm3A3bu84wxTFqGqkJzewCLdME38xJLJAxBABfQT8sQ==",
|
||||
"dev": true
|
||||
},
|
||||
"node_modules/fastq": {
|
||||
"version": "1.17.1",
|
||||
"resolved": "https://registry.npmjs.org/fastq/-/fastq-1.17.1.tgz",
|
||||
|
||||
@@ -88,6 +88,7 @@
|
||||
"@babel/runtime-corejs2": "^7.24.7",
|
||||
"autoprefixer": "^10.4.19",
|
||||
"commitizen": "^4.3.0",
|
||||
"daisyui": "^4.12.2",
|
||||
"eslint": "^8.57.0",
|
||||
"eslint-plugin-prettier": "^4.2.1",
|
||||
"eslint-plugin-react": "^7.34.1",
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<html lang="en" data-theme="cupcake">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8" />
|
||||
@@ -50,4 +50,4 @@
|
||||
-->
|
||||
</body>
|
||||
|
||||
</html>
|
||||
</html>
|
||||
@@ -75,7 +75,7 @@ function App() {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="bg-[#eef1f5]">
|
||||
<div className="bg-base-200">
|
||||
{isloading ? (
|
||||
<Loader />
|
||||
) : (
|
||||
|
||||
@@ -1,7 +1,6 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
import Parse from "parse";
|
||||
import axios from "axios";
|
||||
import { modalCancelBtnColor, modalSubmitBtnColor } from "../constant/const";
|
||||
|
||||
const AddSigner = (props) => {
|
||||
const [name, setName] = useState("");
|
||||
@@ -238,15 +237,15 @@ const AddSigner = (props) => {
|
||||
)}
|
||||
<div className="w-full mx-auto p-2">
|
||||
{isUserExist && (
|
||||
<div className="mb-3">
|
||||
<div className="mb-3 flex items-center">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="addYourself"
|
||||
checked={addYourself}
|
||||
onChange={handleAddYourselfChange}
|
||||
className="form-checkbox"
|
||||
className="op-checkbox op-checkbox-sm"
|
||||
/>
|
||||
<label htmlFor="addYourself" className="ml-2 text-gray-700">
|
||||
<label htmlFor="addYourself" className="ml-2 text-gray-700 mb-0">
|
||||
Add Yourself
|
||||
</label>
|
||||
</div>
|
||||
@@ -267,7 +266,7 @@ const AddSigner = (props) => {
|
||||
onChange={(e) => setName(e.target.value)}
|
||||
required
|
||||
disabled={addYourself}
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
@@ -285,7 +284,7 @@ const AddSigner = (props) => {
|
||||
onChange={(e) => setEmail(e.target.value?.toLowerCase())}
|
||||
required
|
||||
disabled={addYourself}
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs lowercase"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
@@ -301,23 +300,18 @@ const AddSigner = (props) => {
|
||||
value={phone}
|
||||
onChange={(e) => setPhone(e.target.value)}
|
||||
disabled={addYourself}
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="mt-4 flex justify-start">
|
||||
<button
|
||||
type="submit"
|
||||
style={{ backgroundColor: modalSubmitBtnColor }}
|
||||
className="mr-2 px-[20px] py-1.5 text-white rounded shadow-md text-center focus:outline-none "
|
||||
>
|
||||
<div className="mt-4 flex gap-x-2 justify-start">
|
||||
<button type="submit" className="op-btn op-btn-primary">
|
||||
Submit
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => handleReset()}
|
||||
style={{ backgroundColor: modalCancelBtnColor }}
|
||||
className="px-4 py-1.5 text-black border-[1px] border-[#ccc] shadow-md rounded focus:outline-none"
|
||||
className="op-btn op-btn-secondary"
|
||||
>
|
||||
Reset
|
||||
</button>
|
||||
|
||||
@@ -221,7 +221,7 @@ const AddUser = (props) => {
|
||||
value={name}
|
||||
onChange={(e) => setName(e.target.value)}
|
||||
required
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
@@ -238,7 +238,7 @@ const AddUser = (props) => {
|
||||
value={email}
|
||||
onChange={(e) => setEmail(e.target.value)}
|
||||
required
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
@@ -255,7 +255,7 @@ const AddUser = (props) => {
|
||||
value={phone}
|
||||
onChange={(e) => setPhone(e.target.value)}
|
||||
required
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
</div>
|
||||
|
||||
|
||||
@@ -45,12 +45,16 @@ const Footer = () => {
|
||||
};
|
||||
return (
|
||||
<>
|
||||
<div className="bg-[#222c3c] text-[#98a6ba] text-center text-[13px] py-3">
|
||||
All Rights Reserved © {new Date().getFullYear()}
|
||||
<span onClick={openUrl} className="hover:underline cursor-pointer">
|
||||
{appName} ( version: {version ? version : `${Package.version} `})
|
||||
</span>
|
||||
</div>
|
||||
<footer className="op-footer op-footer-center py-3 bg-base-300 text-base-content text-center text-[13px]">
|
||||
<aside>
|
||||
<p>
|
||||
All Rights Reserved © {new Date().getFullYear()}
|
||||
<span onClick={openUrl} className="hover:underline cursor-pointer">
|
||||
{appName} ( version: {version ? version : `${Package.version} `})
|
||||
</span>
|
||||
</p>
|
||||
</aside>
|
||||
</footer>
|
||||
<button
|
||||
className={`${
|
||||
showButton ? "block" : "hidden"
|
||||
|
||||
@@ -67,7 +67,7 @@ const FullScreenButton = () => {
|
||||
<div className="flex items-center">
|
||||
<button
|
||||
onClick={toggleFullScreen}
|
||||
className="text-black p-2 text-sm focus:outline-none"
|
||||
className="text-base-content p-2 text-sm focus:outline-none"
|
||||
>
|
||||
{isFullScreen ? (
|
||||
<i className="fa-solid fa-compress"></i>
|
||||
|
||||
@@ -89,14 +89,16 @@ const Header = ({ showSidebar }) => {
|
||||
}, [isOpen]);
|
||||
|
||||
return (
|
||||
<div className="flex flex-row justify-between items-center gap-x-3 md:gap-x-4 bg-white md:px-4 px-2 shadow h-[50px] md:w-full ">
|
||||
<button
|
||||
className="cursor-pointer focus:outline-none"
|
||||
onClick={showSidebar}
|
||||
>
|
||||
<i className={`fa-solid fa-bars text-xl `}></i>
|
||||
</button>
|
||||
<div className="flex-1">
|
||||
<div className="op-navbar bg-base-100 shadow">
|
||||
<div className="flex-none">
|
||||
<button
|
||||
className="op-btn op-btn-square op-btn-ghost focus:outline-none"
|
||||
onClick={showSidebar}
|
||||
>
|
||||
<i className="fa-solid fa-bars text-xl text-base-content"></i>
|
||||
</button>
|
||||
</div>
|
||||
<div className="flex-1 ml-2">
|
||||
<div className="h-[25px] md:h-[40px] w-auto overflow-hidden">
|
||||
<img
|
||||
className="object-contain h-full w-auto"
|
||||
@@ -105,10 +107,7 @@ const Header = ({ showSidebar }) => {
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
id="profile-menu"
|
||||
className="flex justify-between items-center gap-x-3"
|
||||
>
|
||||
<div id="profile-menu" className="flex-none gap-2">
|
||||
{!isSubscribe && (
|
||||
<div>
|
||||
<button
|
||||
@@ -120,7 +119,7 @@ const Header = ({ showSidebar }) => {
|
||||
</div>
|
||||
)}
|
||||
{isPro && (
|
||||
<div className="w-[35px] h-[35px] rounded-full ring-[1px] ring-offset-2 ring-[#002862] text-[#002862] overflow-hidden font-semibold flex items-center justify-center">
|
||||
<div className="w-[35px] h-[35px] bg-white rounded-full ring-[1px] ring-offset-2 ring-[#002862] text-[#002862] overflow-hidden font-semibold flex items-center justify-center">
|
||||
PRO
|
||||
</div>
|
||||
)}
|
||||
@@ -140,60 +139,66 @@ const Header = ({ showSidebar }) => {
|
||||
</div>
|
||||
)}
|
||||
{width >= 768 && (
|
||||
<div onClick={toggleDropdown} className="cursor-pointer text-sm">
|
||||
<div
|
||||
onClick={toggleDropdown}
|
||||
className="cursor-pointer text-base-content text-sm"
|
||||
>
|
||||
{username && username}
|
||||
</div>
|
||||
)}
|
||||
<div className="relative">
|
||||
<div className="cursor-pointer">
|
||||
<i onClick={toggleDropdown} className="fa-solid fa-angle-down"></i>
|
||||
<div className="op-dropdown op-dropdown-end" id="profile-menu">
|
||||
<div tabIndex={0} role="button" className="op-btn op-btn-ghost">
|
||||
<i
|
||||
tabIndex={0}
|
||||
role="button"
|
||||
onClick={toggleDropdown}
|
||||
className="fa-solid fa-angle-down text-base-content"
|
||||
></i>
|
||||
</div>
|
||||
<div
|
||||
className={`dropdown absolute text-sm text-gray-700 font-light right-0 mt-4 p-1 w-48 bg-white border rounded-lg shadow-lg z-10 ${
|
||||
isOpen ? "block" : "hidden"
|
||||
}`}
|
||||
<ul
|
||||
tabIndex={0}
|
||||
className="mt-3 z-[1] p-2 shadow op-menu op-menu-sm op-dropdown-content text-base-content bg-base-100 rounded-box w-52"
|
||||
>
|
||||
<ul>
|
||||
<li
|
||||
className="hover:bg-gray-100 rounded-t-lg py-1 px-2 cursor-pointer font-normal"
|
||||
onClick={() => openInNewTab("https://docs.opensignlabs.com")}
|
||||
>
|
||||
<li onClick={() => openInNewTab("https://docs.opensignlabs.com")}>
|
||||
<span>
|
||||
<i className="fa-solid fa-book"></i> Docs
|
||||
</li>
|
||||
<li
|
||||
className="hover:bg-gray-100 py-1 px-2 cursor-pointer font-normal"
|
||||
onClick={() => {
|
||||
setIsOpen(false);
|
||||
navigate("/profile");
|
||||
}}
|
||||
>
|
||||
</span>
|
||||
</li>
|
||||
<li
|
||||
onClick={() => {
|
||||
setIsOpen(false);
|
||||
navigate("/profile");
|
||||
}}
|
||||
>
|
||||
<span>
|
||||
<i className="fa-regular fa-user"></i> Profile
|
||||
</li>
|
||||
<li
|
||||
className="hover:bg-gray-100 py-1 px-2 cursor-pointer font-normal"
|
||||
onClick={() => {
|
||||
setIsOpen(false);
|
||||
navigate("/changepassword");
|
||||
}}
|
||||
>
|
||||
</span>
|
||||
</li>
|
||||
<li
|
||||
onClick={() => {
|
||||
setIsOpen(false);
|
||||
navigate("/changepassword");
|
||||
}}
|
||||
>
|
||||
<span>
|
||||
<i className="fa-solid fa-lock"></i> Change Password
|
||||
</li>
|
||||
<li
|
||||
className="hover:bg-gray-100 py-1 px-2 cursor-pointer font-normal"
|
||||
onClick={() => {
|
||||
window.open("https://console.opensignlabs.com/");
|
||||
}}
|
||||
>
|
||||
</span>
|
||||
</li>
|
||||
<li
|
||||
onClick={() => {
|
||||
window.open("https://console.opensignlabs.com/");
|
||||
}}
|
||||
>
|
||||
<span>
|
||||
<i className="fa-regular fa-id-card"></i> Console
|
||||
</li>
|
||||
<li
|
||||
className="hover:bg-gray-100 rounded-b-lg py-1 px-2 cursor-pointer font-normal"
|
||||
onClick={closeDropdown}
|
||||
>
|
||||
</span>
|
||||
</li>
|
||||
<li onClick={closeDropdown}>
|
||||
<span>
|
||||
<i className="fa-solid fa-arrow-right-from-bracket"></i> Log Out
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -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,22 @@ 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>
|
||||
<label htmlFor="Phone" className="block text-xs font-semibold">
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
id="Phone"
|
||||
value={userDetails.Phone}
|
||||
onChange={(e) =>
|
||||
@@ -258,16 +234,12 @@ const GoogleSignInBtn = ({
|
||||
/>
|
||||
</div>
|
||||
<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>
|
||||
<label htmlFor="Company" className="block text-xs font-semibold">
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
id="Company"
|
||||
value={userDetails.Company}
|
||||
onChange={(e) =>
|
||||
@@ -280,16 +252,12 @@ const GoogleSignInBtn = ({
|
||||
/>
|
||||
</div>
|
||||
<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>
|
||||
<label htmlFor="JobTitle" className="block text-xs font-semibold">
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
id="JobTitle"
|
||||
value={userDetails.Destination}
|
||||
onChange={(e) =>
|
||||
@@ -301,20 +269,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-ghost"
|
||||
onClick={handleCloseModal}
|
||||
style={{ width: 90, backgroundColor: modalCancelBtnColor }}
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
|
||||
@@ -26,18 +26,18 @@ const DashboardButton = (props) => {
|
||||
props.Data && props.Data.Redirect_type
|
||||
? "cursor-pointer"
|
||||
: "cursor-default"
|
||||
} w-full px-3 py-2 flex text-white rounded-md shadow overflow-hidden`}
|
||||
} w-full shadow-md px-3 py-2 op-card bg-base-100`}
|
||||
>
|
||||
<div className="flex items-center justify-start gap-5">
|
||||
<span className="rounded-full bg-black bg-opacity-20 w-[60px] h-[60px] self-start flex justify-center items-center">
|
||||
<div className="flex flex-row items-center">
|
||||
<span className="rounded-full bg-base-content bg-opacity-20 w-[60px] h-[60px] self-start flex justify-center items-center">
|
||||
<i
|
||||
className={`${
|
||||
props.Icon ? props.Icon : "fa fa-solid fa-info"
|
||||
} text-[25px] lg:text-[30px]`}
|
||||
></i>
|
||||
</span>
|
||||
<div className="">
|
||||
<div className="text-base lg:text-lg text-black"> {props.Label}</div>
|
||||
<div className="op-card-title text-lg ml-3 text-base-content">
|
||||
{props.Label}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -336,25 +336,29 @@ const DashboardCard = (props) => {
|
||||
props.Data && props.Data.Redirect_type
|
||||
? "cursor-pointer"
|
||||
: "cursor-default"
|
||||
} w-full h-[140px] px-3 pt-4 pb-10 text-white rounded-md shadow overflow-hidden relative`}
|
||||
}`}
|
||||
>
|
||||
<div className="flex items-center justify-start gap-5">
|
||||
<span className="rounded-full bg-black bg-opacity-20 w-[60px] h-[60px] self-start flex justify-center items-center">
|
||||
<div className="flex items-center justify-start gap-5 text-white">
|
||||
<span className="rounded-full bg-black bg-opacity-20 w-[60px] h-[60px] self-start flex justify-center items-center">
|
||||
<i
|
||||
className={`${
|
||||
props.Icon ? props.Icon : "fa fa-solid fa-info"
|
||||
} text-[25px] lg:text-[30px]`}
|
||||
></i>
|
||||
</span>
|
||||
<div className="">
|
||||
<div className="font-medium">
|
||||
<div className="text-base lg:text-lg"> {props.Label}</div>
|
||||
<div className="text-2xl font-light">
|
||||
{loading ? <div className="loader-01"></div> : setFormat(response)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-xs absolute top-2 right-1">
|
||||
<Tooltip id={props.Label} iconColor={"white"} message={props?.Data?.tourMessage} />
|
||||
<div className="text-xs absolute top-3 right-2">
|
||||
<Tooltip
|
||||
id={props.Label}
|
||||
iconColor={"white"}
|
||||
message={props?.Data?.tourMessage}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
|
||||
@@ -121,21 +121,8 @@ function DashboardReport(props) {
|
||||
return (
|
||||
<>
|
||||
{isLoader ? (
|
||||
<div
|
||||
style={{
|
||||
height: "100vh",
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
justifyContent: "center"
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
fontSize: "45px",
|
||||
color: "#3dd3e0"
|
||||
}}
|
||||
className="loader-37"
|
||||
></div>
|
||||
<div className="h-[250px] text-[45px] text-[#3dd3e0] flex justify-center items-center">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
|
||||
@@ -18,51 +18,33 @@ const buttonList = [
|
||||
];
|
||||
const GetDashboard = (props) => {
|
||||
const Button = ({ label, redirectId, redirectType, icon }) => (
|
||||
<div className={"bg-white rounded-md shadow w-full"}>
|
||||
<Suspense
|
||||
fallback={
|
||||
<div style={{ height: "300px" }}>
|
||||
<div
|
||||
style={{
|
||||
marginLeft: "45%",
|
||||
marginTop: "150px",
|
||||
fontSize: "45px",
|
||||
color: "#3dd3e0"
|
||||
}}
|
||||
className="loader-37"
|
||||
></div>
|
||||
</div>
|
||||
}
|
||||
>
|
||||
<DashboardButton
|
||||
Icon={icon}
|
||||
Label={label}
|
||||
Data={{ Redirect_type: redirectType, Redirect_id: redirectId }}
|
||||
/>
|
||||
</Suspense>
|
||||
</div>
|
||||
<Suspense
|
||||
fallback={
|
||||
<div className="h-[300px] text-[45px] text-[#3dd3e0] flex justify-center items-center">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
}
|
||||
>
|
||||
<DashboardButton
|
||||
Icon={icon}
|
||||
Label={label}
|
||||
Data={{ Redirect_type: redirectType, Redirect_id: redirectId }}
|
||||
/>
|
||||
</Suspense>
|
||||
);
|
||||
const renderSwitchWithTour = (col) => {
|
||||
switch (col.widget.type) {
|
||||
case "Card":
|
||||
return (
|
||||
<div
|
||||
className={"bg-[#2ed8b6] rounded-md shadow mb-3 md:mb-0"}
|
||||
className="op-card bg-[#2ed8b6] w-full h-[140px] px-3 pt-4 mb-3 shadow-md"
|
||||
data-tut={col.widget.data.tourSection}
|
||||
style={{ background: col.widget.bgColor }}
|
||||
>
|
||||
<Suspense
|
||||
fallback={
|
||||
<div style={{ height: "300px" }}>
|
||||
<div
|
||||
style={{
|
||||
marginLeft: "45%",
|
||||
marginTop: "150px",
|
||||
fontSize: "45px",
|
||||
color: "#3dd3e0"
|
||||
}}
|
||||
className="loader-37"
|
||||
></div>
|
||||
<div className="h-[300px] text-[45px] text-[#3dd3e0] flex justify-center items-center">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
}
|
||||
>
|
||||
@@ -72,7 +54,6 @@ const GetDashboard = (props) => {
|
||||
Format={col.widget.format && col.widget.format}
|
||||
Data={col.widget.data}
|
||||
FilterData={col.widget.filter}
|
||||
DefaultQuery={props.DefaultQuery}
|
||||
/>
|
||||
</Suspense>
|
||||
</div>
|
||||
@@ -89,7 +70,7 @@ const GetDashboard = (props) => {
|
||||
);
|
||||
}
|
||||
default:
|
||||
return null;
|
||||
return <></>;
|
||||
}
|
||||
};
|
||||
const renderSwitch = (col) => {
|
||||
@@ -97,7 +78,7 @@ const GetDashboard = (props) => {
|
||||
case "Card":
|
||||
return (
|
||||
<div
|
||||
className={"bg-[#2ed8b6] rounded-md shadow mb-3 md:mb-0"}
|
||||
className="op-card bg-[#2ed8b6] w-full h-[140px] px-3 pt-4 mb-3 shadow-md"
|
||||
style={{ background: col.widget.bgColor }}
|
||||
>
|
||||
<Suspense fallback={<div>please wait</div>}>
|
||||
@@ -107,7 +88,6 @@ const GetDashboard = (props) => {
|
||||
Format={col.widget.format && col.widget.format}
|
||||
Data={col.widget.data}
|
||||
FilterData={col.widget.filter}
|
||||
DefaultQuery={props.DefaultQuery}
|
||||
/>
|
||||
</Suspense>
|
||||
</div>
|
||||
@@ -122,7 +102,7 @@ const GetDashboard = (props) => {
|
||||
);
|
||||
}
|
||||
default:
|
||||
return null;
|
||||
return <></>;
|
||||
}
|
||||
};
|
||||
return (
|
||||
@@ -130,7 +110,7 @@ const GetDashboard = (props) => {
|
||||
<div className="mb-3">
|
||||
<div
|
||||
data-tut={"tourbutton"}
|
||||
className="flex flex-col md:flex-row gap-6 md:gap-8"
|
||||
className="flex flex-col md:flex-row gap-4"
|
||||
>
|
||||
{buttonList.map((btn) => (
|
||||
<Button
|
||||
@@ -143,21 +123,19 @@ const GetDashboard = (props) => {
|
||||
))}
|
||||
</div>
|
||||
</div>
|
||||
{props.dashboard.map((val, key) => (
|
||||
<div key={"a" + key} className="row">
|
||||
{val.columns.map((col, i) =>
|
||||
col.widget.data && col.widget.data.tourSection ? (
|
||||
<div key={i} className={props.classnameArray[key][i]}>
|
||||
{renderSwitchWithTour(col)}
|
||||
</div>
|
||||
) : (
|
||||
<div key={i} className={props.classnameArray[key][i]}>
|
||||
{renderSwitch(col)}
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
<div className="grid grid-cols-12 w-full gap-x-4">
|
||||
{props?.dashboard?.columns?.map((col, i) =>
|
||||
col.widget.data && col.widget.data.tourSection ? (
|
||||
<div key={i} className={col?.colsize}>
|
||||
{renderSwitchWithTour(col)}
|
||||
</div>
|
||||
) : (
|
||||
<div key={i} className={col?.colsize}>
|
||||
{renderSwitch(col)}
|
||||
</div>
|
||||
)
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -376,23 +376,15 @@ function DriveBody(props) {
|
||||
</tr>
|
||||
)
|
||||
) : listType === "list" && data.Type === "Folder" ? (
|
||||
<div key={ind} className="folderBox">
|
||||
<div key={ind} className="icon-container">
|
||||
<ContextMenu.Root>
|
||||
<ContextMenu.Trigger className="ContextMenuTrigger">
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
cursor: "pointer"
|
||||
}}
|
||||
data-tut={props.dataTutSeventh}
|
||||
>
|
||||
<div data-tut={props.dataTutSeventh}>
|
||||
<img
|
||||
alt="no img"
|
||||
alt="folder"
|
||||
onClick={() => handleOnclikFolder(data)}
|
||||
src={folder}
|
||||
width={100}
|
||||
height={103}
|
||||
className="w-full h-full"
|
||||
/>
|
||||
{rename === data.objectId ? (
|
||||
<input
|
||||
@@ -450,7 +442,7 @@ function DriveBody(props) {
|
||||
<ContextMenu.Trigger className="ContextMenuTrigger">
|
||||
<img
|
||||
alt="PDF"
|
||||
className="pdf-icon"
|
||||
className="w-full h-full"
|
||||
src={pdfLogo}
|
||||
onClick={() => checkPdfStatus(data)}
|
||||
data-tut={props.dataTutSixth}
|
||||
@@ -587,13 +579,9 @@ function DriveBody(props) {
|
||||
</Table>
|
||||
</div>
|
||||
) : (
|
||||
<div className="pdfContainer">
|
||||
<div className="flex flex-row flex-wrap items-center mt-1 pb-[20px] mx-[5px]">
|
||||
{props.pdfData.map((data, ind) => {
|
||||
return (
|
||||
<div className="box" key={ind}>
|
||||
{handleFolderData(data, ind, "list")}
|
||||
</div>
|
||||
);
|
||||
return <div key={ind}>{handleFolderData(data, ind, "list")}</div>;
|
||||
})}
|
||||
</div>
|
||||
)}
|
||||
@@ -611,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>
|
||||
|
||||
@@ -21,7 +21,7 @@ const AddRoleModal = (props) => {
|
||||
? "User " + (props.signersdata.length + 1)
|
||||
: "User 1"
|
||||
}
|
||||
className="addUserInput"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs mt-1"
|
||||
/>
|
||||
<p
|
||||
style={{
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
import React, { useEffect, useState } from "react";
|
||||
import { isEnableSubscription, themeColor } from "../../constant/const";
|
||||
import { isEnableSubscription } from "../../constant/const";
|
||||
import ModalUi from "../../primitives/ModalUi";
|
||||
import { radioButtonWidget } from "../../constant/Utils";
|
||||
import PremiumAlertHeader from "../../primitives/PremiumAlertHeader";
|
||||
@@ -147,7 +147,7 @@ function DropdownWidgetOption(props) {
|
||||
|
||||
return (
|
||||
<ModalUi isOpen={props.showDropdown} title={props.title} showClose={false}>
|
||||
<div className="h-full p-[15px]">
|
||||
<div className="h-full p-[15px] text-base-content">
|
||||
<form
|
||||
onSubmit={(e) => {
|
||||
e.preventDefault();
|
||||
@@ -155,38 +155,25 @@ function DropdownWidgetOption(props) {
|
||||
}}
|
||||
>
|
||||
<div>
|
||||
<label style={{ fontSize: "13px", fontWeight: "600" }}>
|
||||
Name<span style={{ color: "red", fontSize: 13 }}> *</span>
|
||||
<label className="text-[13px] font-semibold">
|
||||
Name<span className="text-[red] text-[13px]"> *</span>
|
||||
</label>
|
||||
<input
|
||||
required
|
||||
defaultValue={dropdownName}
|
||||
value={dropdownName}
|
||||
onChange={(e) => setDropdownName(e.target.value)}
|
||||
className="drodown-input"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
|
||||
<label
|
||||
style={{ fontSize: "13px", fontWeight: "600", marginTop: "5px" }}
|
||||
>
|
||||
<label className="text-[13px] font-semibold mt-[5px]">
|
||||
Options
|
||||
</label>
|
||||
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "column"
|
||||
}}
|
||||
>
|
||||
<div className="flex flex-col">
|
||||
{dropdownOptionList.map((option, index) => (
|
||||
<div
|
||||
key={index}
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
marginBottom: "5px",
|
||||
alignItems: "center"
|
||||
}}
|
||||
className="flex flex-row mb-[5px] items-center"
|
||||
>
|
||||
{props.type === "checkbox" && !props.isSignYourself && (
|
||||
<input
|
||||
@@ -206,51 +193,34 @@ function DropdownWidgetOption(props) {
|
||||
setDefaultCheckbox(removeOption);
|
||||
}
|
||||
}}
|
||||
style={{
|
||||
width: "23px",
|
||||
height: "19px",
|
||||
marginRight: "5px"
|
||||
}}
|
||||
className="op-checkbox focus:outline-none hover:border-base-content mr-[5px]"
|
||||
/>
|
||||
)}
|
||||
<input
|
||||
required
|
||||
className="drodown-input"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
|
||||
type="text"
|
||||
value={option}
|
||||
onChange={(e) => handleInputChange(index, e.target.value)}
|
||||
/>
|
||||
|
||||
<i
|
||||
className="fa-solid fa-rectangle-xmark"
|
||||
className="fa-solid fa-rectangle-xmark text-[25px] ml-[10px] text-error"
|
||||
onClick={() => handleDeleteInput(index)}
|
||||
style={{
|
||||
color: "red",
|
||||
fontSize: "25px",
|
||||
marginLeft: "10px"
|
||||
}}
|
||||
></i>
|
||||
</div>
|
||||
))}
|
||||
<i
|
||||
onClick={handleAddInput}
|
||||
style={{
|
||||
cursor: "pointer",
|
||||
color: themeColor,
|
||||
fontSize: "25px",
|
||||
marginLeft: "10px"
|
||||
}}
|
||||
className="fa-solid fa-square-plus"
|
||||
className="fa-solid fa-square-plus text-[25px] ml-[10px] text-primary"
|
||||
></i>
|
||||
<div>
|
||||
{props.type === "checkbox" && !props.isSignYourself && (
|
||||
<>
|
||||
<label
|
||||
style={{
|
||||
fontSize: "13px",
|
||||
fontWeight: "600",
|
||||
color: !props.isSubscribe && "gray"
|
||||
}}
|
||||
className={`${
|
||||
!props.isSubscribe ? "text-[gray]" : ""
|
||||
} text-[13px] font-semibold`}
|
||||
>
|
||||
Minimun check
|
||||
</label>
|
||||
@@ -263,18 +233,16 @@ function DropdownWidgetOption(props) {
|
||||
const count = handleSetMinMax(e);
|
||||
setMinCount(count);
|
||||
}}
|
||||
className={
|
||||
className={`${
|
||||
props.isSubscribe || !isEnableSubscription
|
||||
? "drodown-input"
|
||||
: "disabled drodown-input"
|
||||
}
|
||||
? ""
|
||||
: "disabled "
|
||||
} op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs`}
|
||||
/>
|
||||
<label
|
||||
style={{
|
||||
fontSize: "13px",
|
||||
fontWeight: "600",
|
||||
color: !props.isSubscribe && "gray"
|
||||
}}
|
||||
className={`${
|
||||
!props.isSubscribe ? "text-[gray]" : ""
|
||||
} text-[13px] font-semibold`}
|
||||
>
|
||||
Maximum check
|
||||
</label>
|
||||
@@ -286,11 +254,11 @@ function DropdownWidgetOption(props) {
|
||||
const count = handleSetMinMax(e);
|
||||
setMaxCount(count);
|
||||
}}
|
||||
className={
|
||||
className={`${
|
||||
props.isSubscribe || !isEnableSubscription
|
||||
? "drodown-input"
|
||||
: "disabled drodown-input"
|
||||
}
|
||||
? ""
|
||||
: "disabled "
|
||||
} op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs`}
|
||||
/>
|
||||
</>
|
||||
)}
|
||||
@@ -298,32 +266,22 @@ function DropdownWidgetOption(props) {
|
||||
</div>
|
||||
{["dropdown", radioButtonWidget].includes(props.type) && (
|
||||
<>
|
||||
<label
|
||||
style={{
|
||||
fontSize: "13px",
|
||||
fontWeight: "600",
|
||||
marginTop: "5px"
|
||||
}}
|
||||
>
|
||||
<label className="text-[13px] font-semibold mt-[5px]">
|
||||
Default value
|
||||
</label>
|
||||
<select
|
||||
onChange={(e) => setDefaultValue(e.target.value)}
|
||||
className="drodown-input"
|
||||
className="op-select op-select-bordered op-select-sm focus:outline-none hover:border-base-content w-full text-xs"
|
||||
name="defaultvalue"
|
||||
value={defaultValue}
|
||||
placeholder="select default value"
|
||||
>
|
||||
<option value="" disabled hidden style={{ fontSize: "13px" }}>
|
||||
<option value="" disabled hidden className="text-[13px]">
|
||||
Select...
|
||||
</option>
|
||||
{dropdownOptionList.map((data, ind) => {
|
||||
return (
|
||||
<option
|
||||
style={{ fontSize: "13px" }}
|
||||
key={ind}
|
||||
value={data}
|
||||
>
|
||||
<option className="text-[13px]" key={ind} value={data}>
|
||||
{data}
|
||||
</option>
|
||||
);
|
||||
@@ -333,35 +291,21 @@ function DropdownWidgetOption(props) {
|
||||
)}
|
||||
{props.type !== "checkbox" && props.type !== radioButtonWidget && (
|
||||
<>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
gap: 10,
|
||||
marginTop: "0.5rem"
|
||||
}}
|
||||
>
|
||||
<div className="flex flex-row gap-[10px] mt-[0.5rem]">
|
||||
{statusArr.map((data, ind) => {
|
||||
return (
|
||||
<div
|
||||
key={ind}
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
gap: 5,
|
||||
alignItems: "center"
|
||||
}}
|
||||
className="flex flex-row gap-[5px] items-center"
|
||||
>
|
||||
<input
|
||||
style={{ accentColor: "red" }}
|
||||
className="op-radio op-radio-xs my-1"
|
||||
type="radio"
|
||||
name="status"
|
||||
onChange={() => setStatus(data.toLowerCase())}
|
||||
checked={status.toLowerCase() === data.toLowerCase()}
|
||||
/>
|
||||
<div style={{ fontSize: "13px", fontWeight: "500" }}>
|
||||
{data}
|
||||
</div>
|
||||
<div className="text-[13px] font-500">{data}</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
@@ -369,33 +313,31 @@ function DropdownWidgetOption(props) {
|
||||
</>
|
||||
)}
|
||||
{["checkbox", radioButtonWidget].includes(props.type) && (
|
||||
<div className="flex flex-row gap-5 mt-2 items-center text-center">
|
||||
<div className="flex flex-row gap-5 my-2 items-center text-center">
|
||||
{!props.isSignYourself && (
|
||||
<div>
|
||||
<div className="flex items-center">
|
||||
<input
|
||||
id="isreadonly"
|
||||
type="checkbox"
|
||||
checked={isReadOnly}
|
||||
onChange={(e) => {
|
||||
setIsReadOnly(e.target.checked);
|
||||
}}
|
||||
className="op-checkbox op-checkbox-sm"
|
||||
onChange={(e) => setIsReadOnly(e.target.checked)}
|
||||
/>
|
||||
<label className="ml-1" htmlFor="isreadonly">
|
||||
<label className="ml-1 mb-0" htmlFor="isreadonly">
|
||||
Is read only
|
||||
</label>
|
||||
</div>
|
||||
)}
|
||||
<div>
|
||||
<div className="flex items-center">
|
||||
<input
|
||||
id="ishidelabel"
|
||||
type="checkbox"
|
||||
checked={isHideLabel}
|
||||
onChange={(e) => {
|
||||
setIsHideLabel(e.target.checked);
|
||||
}}
|
||||
className="op-checkbox op-checkbox-sm"
|
||||
onChange={(e) => setIsHideLabel(e.target.checked)}
|
||||
/>
|
||||
|
||||
<label className="ml-1" htmlFor="ishidelabel">
|
||||
<label className="ml-1 mb-0" htmlFor="ishidelabel">
|
||||
Hide labels
|
||||
</label>
|
||||
</div>
|
||||
@@ -421,19 +363,15 @@ function DropdownWidgetOption(props) {
|
||||
|
||||
<button
|
||||
disabled={dropdownOptionList.length === 0 && true}
|
||||
style={{
|
||||
background: themeColor,
|
||||
color: "white"
|
||||
}}
|
||||
type="submit"
|
||||
className={"finishBtn"}
|
||||
className="op-btn op-btn-primary"
|
||||
>
|
||||
Save
|
||||
</button>
|
||||
{props.currWidgetsDetails?.options?.values?.length > 0 && (
|
||||
<button
|
||||
type="submit"
|
||||
className="finishBtn cancelBtn"
|
||||
className="op-btn op-btn-ghost ml-1"
|
||||
onClick={() => {
|
||||
props.handleClose && props.handleClose();
|
||||
resetState();
|
||||
|
||||
@@ -1,5 +1,4 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
import "../../styles/AddUser.css";
|
||||
import { checkIsSubscribed, getFileName } from "../../constant/Utils";
|
||||
import PremiumAlertHeader from "../../primitives/PremiumAlertHeader";
|
||||
import Upgrade from "../../primitives/Upgrade";
|
||||
@@ -60,28 +59,20 @@ const EditTemplate = ({ template, onSuccess }) => {
|
||||
};
|
||||
return (
|
||||
<div className="max-h-[300px] md:max-h-[400px] overflow-y-scroll p-[10px]">
|
||||
<div className="form-wrapper">
|
||||
<div className="text-base-content">
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div>
|
||||
<label htmlFor="name" style={{ fontSize: 13 }}>
|
||||
<label htmlFor="name" className="text-[13px]">
|
||||
File
|
||||
</label>
|
||||
<div
|
||||
style={{
|
||||
padding: "0.5rem 0.75rem",
|
||||
border: "1px solid #d1d5db",
|
||||
borderRadius: "0.375rem",
|
||||
fontSize: "0.75rem",
|
||||
fontWeight: "700"
|
||||
}}
|
||||
>
|
||||
<div className="op-input op-input-bordered op-input-sm focus:outline-none py-2 font-semibold w-full text-xs">
|
||||
{getFileName(template.URL)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="form-section">
|
||||
<label htmlFor="name" style={{ fontSize: 13 }}>
|
||||
<label htmlFor="name" className="text-[13px]">
|
||||
Name
|
||||
<span style={{ color: "red", fontSize: 13 }}> *</span>
|
||||
<span className="text-[13px] text-[red]"> *</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
@@ -89,11 +80,11 @@ const EditTemplate = ({ template, onSuccess }) => {
|
||||
value={formData.Name}
|
||||
onChange={(e) => handleStrInput(e)}
|
||||
required
|
||||
className="addUserInput"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
</div>
|
||||
<div className="form-section">
|
||||
<label htmlFor="Note" style={{ fontSize: 13 }}>
|
||||
<label htmlFor="Note" className="text-[13px]">
|
||||
Note
|
||||
</label>
|
||||
<input
|
||||
@@ -102,11 +93,11 @@ const EditTemplate = ({ template, onSuccess }) => {
|
||||
id="Note"
|
||||
value={formData.Note}
|
||||
onChange={(e) => handleStrInput(e)}
|
||||
className="addUserInput"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
</div>
|
||||
<div className="form-section">
|
||||
<label htmlFor="Description" style={{ fontSize: 13 }}>
|
||||
<label htmlFor="Description" className="text-[13px]">
|
||||
Description
|
||||
</label>
|
||||
<input
|
||||
@@ -115,46 +106,32 @@ const EditTemplate = ({ template, onSuccess }) => {
|
||||
id="Description"
|
||||
value={formData.Description}
|
||||
onChange={(e) => handleStrInput(e)}
|
||||
className="addUserInput"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
</div>
|
||||
<div className="form-section">
|
||||
<label style={{ fontSize: 13 }}>Send In Order</label>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
gap: 8,
|
||||
marginLeft: 8,
|
||||
marginBottom: 5
|
||||
}}
|
||||
>
|
||||
<label className="text-[13px]">Send In Order</label>
|
||||
<div className="flex items-center gap-[8px] ml-[8px] mb-[5px]">
|
||||
<input
|
||||
type="radio"
|
||||
value={"true"}
|
||||
className="op-radio op-radio-xs"
|
||||
name="SendinOrder"
|
||||
checked={formData.SendinOrder === "true"}
|
||||
onChange={handleStrInput}
|
||||
/>
|
||||
<div style={{ fontSize: 12 }}>Yes</div>
|
||||
<div className="text-[12px]">Yes</div>
|
||||
</div>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
gap: 8,
|
||||
marginLeft: 8,
|
||||
marginBottom: 5
|
||||
}}
|
||||
>
|
||||
<div className="flex items-center gap-[8px] ml-[8px] mb-[5px]">
|
||||
<input
|
||||
type="radio"
|
||||
value={"false"}
|
||||
name="SendinOrder"
|
||||
className="op-radio op-radio-xs"
|
||||
checked={formData.SendinOrder === "false"}
|
||||
onChange={handleStrInput}
|
||||
/>
|
||||
<div style={{ fontSize: 12 }}>No</div>
|
||||
<div className="text-[12px]">No</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="text-xs mt-2">
|
||||
@@ -186,10 +163,8 @@ const EditTemplate = ({ template, onSuccess }) => {
|
||||
checked={formData.AutomaticReminders}
|
||||
onChange={handleAutoReminder}
|
||||
type="checkbox"
|
||||
value=""
|
||||
className="sr-only peer"
|
||||
className="op-toggle transition-all checked:[--tglbg:#3368ff] checked:bg-white mt-2"
|
||||
/>
|
||||
<div className="w-9 h-5 bg-gray-200 peer-focus:outline-none peer-focus:ring-1 peer-focus:ring-black rounded-full peer dark:bg-gray-700 peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all dark:border-black peer-checked:bg-blue-600 mt-2"></div>
|
||||
</label>
|
||||
</div>
|
||||
{isSubscribe && formData?.AutomaticReminders === true && (
|
||||
@@ -202,15 +177,14 @@ const EditTemplate = ({ template, onSuccess }) => {
|
||||
type="number"
|
||||
value={formData.RemindOnceInEvery}
|
||||
name="RemindOnceInEvery"
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
onChange={handleStrInput}
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
)}
|
||||
{/* <SelectFolder onSuccess={handleFolder} folderCls={"contracts_Template"} /> */}
|
||||
<div className="buttoncontainer">
|
||||
<button type="submit" className="submitbutton">
|
||||
<div className="mt-[1rem] flex justify-start">
|
||||
<button type="submit" className="op-btn op-btn-primary">
|
||||
Submit
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -1,52 +1,42 @@
|
||||
import React from "react";
|
||||
import Tooltip from "../../primitives/Tooltip";
|
||||
|
||||
import ReactQuill from "react-quill";
|
||||
import "react-quill/dist/quill.snow.css";
|
||||
import EditorToolbar, { module1, formats } from "./EditorToolbar";
|
||||
|
||||
export function EmailBody(props) {
|
||||
return (
|
||||
<React.Fragment>
|
||||
<div className={`flex justify-center py-1 p-2`}>
|
||||
<div className=" flex flex-col">
|
||||
<form>
|
||||
<div className="text-lg font-normal text-black">
|
||||
<div className=" m-2 md:m-10 p-3 md:p-10 shadow-md hover:shadow-lg border-[1px] border-indigo-800 rounded-md">
|
||||
<label className="text-sm ml-2">
|
||||
Subject <Tooltip message={"email subject"} />
|
||||
</label>
|
||||
<input
|
||||
required
|
||||
value={props.requestSubject}
|
||||
onChange={(e) => props.setRequestSubject(e.target.value)}
|
||||
placeholder='${senderName} has requested you to sign "${documentName}"'
|
||||
className="px-3 py-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
/>
|
||||
<label className="text-sm ml-2 mt-3">
|
||||
Body <Tooltip message={"email body"} />
|
||||
</label>
|
||||
|
||||
<div className="px-3 py-2 w-full focus:outline-none text-xs">
|
||||
<EditorToolbar containerId="toolbar1" />
|
||||
<ReactQuill
|
||||
theme="snow"
|
||||
value={props.requestBody}
|
||||
// value={typedText}
|
||||
placeholder="add body of email "
|
||||
// readOnly={loading}
|
||||
// onChangeSelection={handleTextSelection} // Listen for text selection
|
||||
ref={props.editorRef}
|
||||
modules={module1}
|
||||
formats={formats}
|
||||
onChange={props.handleOnchangeRequest}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
<form className="flex flex-col text-base-content text-lg font-normal">
|
||||
<div className="m-2 md:m-10 p-3 md:p-10 shadow-md hover:shadow-lg border-[1px] border-indigo-800 rounded-md">
|
||||
<label className="text-sm ml-2">
|
||||
Subject <Tooltip message={"email subject"} />
|
||||
</label>
|
||||
<input
|
||||
required
|
||||
value={props.requestSubject}
|
||||
onChange={(e) => props.setRequestSubject(e.target.value)}
|
||||
placeholder='${senderName} has requested you to sign "${documentName}"'
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
<label className="text-sm ml-2 mt-3">
|
||||
Body <Tooltip message={"email body"} />
|
||||
</label>
|
||||
<div className="px-3 py-2 w-full focus:outline-none text-xs">
|
||||
<EditorToolbar containerId="toolbar1" />
|
||||
<ReactQuill
|
||||
theme="snow"
|
||||
value={props.requestBody}
|
||||
// value={typedText}
|
||||
placeholder="add body of email "
|
||||
// readOnly={loading}
|
||||
// onChangeSelection={handleTextSelection} // Listen for text selection
|
||||
ref={props.editorRef}
|
||||
modules={module1}
|
||||
formats={formats}
|
||||
onChange={props.handleOnchangeRequest}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</React.Fragment>
|
||||
</form>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -174,7 +174,7 @@ const SelectFolder = ({ required, onSuccess, folderCls, isReset }) => {
|
||||
<div className="relative max-w-sm">
|
||||
<div
|
||||
onClick={() => SetIsOpen(true)}
|
||||
className=" cursor-pointer rounded px-[20px] py-[20px] bg-white border border-gray-200 shadow flex max-w-sm gap-8 items-center"
|
||||
className=" cursor-pointer rounded px-[20px] py-[20px] bg-base-100 border-[1px] border-base-200 shadow flex max-w-sm gap-8 items-center"
|
||||
>
|
||||
<div>
|
||||
<i
|
||||
|
||||
@@ -3,16 +3,6 @@ import Parse from "parse";
|
||||
import "../../../styles/AddUser.css";
|
||||
import AsyncSelect from "react-select/async";
|
||||
|
||||
const customStyles = {
|
||||
control: (provided) => ({
|
||||
...provided,
|
||||
fontSize: "13px" // Font size for the control
|
||||
}),
|
||||
option: (provided) => ({
|
||||
...provided,
|
||||
fontSize: "13px" // Font size for the options
|
||||
})
|
||||
};
|
||||
const SelectSigners = (props) => {
|
||||
const [userList, setUserList] = useState([]);
|
||||
const [selected, setSelected] = useState();
|
||||
@@ -79,10 +69,10 @@ const SelectSigners = (props) => {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="addusercontainer">
|
||||
<div className="form-wrapper">
|
||||
<div className="form-section" style={{ marginBottom: 0 }}>
|
||||
<label style={{ fontSize: 14, fontWeight: "700" }}>Choose User</label>
|
||||
<div className="h-full px-[20px] py-[10px] text-base-content">
|
||||
<div className="w-full mx-auto p-[8px]">
|
||||
<div className="mb-0">
|
||||
<label className="text-[14px] font-bold">Choose from contacts</label>
|
||||
<AsyncSelect
|
||||
cacheOptions
|
||||
defaultOptions
|
||||
@@ -91,20 +81,24 @@ const SelectSigners = (props) => {
|
||||
noOptionsMessage={() => "User not Found"}
|
||||
loadOptions={loadOptions}
|
||||
onChange={handleOptions}
|
||||
styles={customStyles}
|
||||
unstyled
|
||||
classNames={{
|
||||
control: () =>
|
||||
"op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs",
|
||||
option: () =>
|
||||
"bg-base-200 text-base-content hover:bg-base-300 p-2 shadow-md"
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
{isError ? (
|
||||
<p style={{ color: "red", fontSize: "12px", margin: "5px" }}>
|
||||
Please select signer
|
||||
</p>
|
||||
) : (
|
||||
<p style={{ color: "transparent", fontSize: "12px", margin: "5px" }}>
|
||||
.
|
||||
</p>
|
||||
)}
|
||||
<p
|
||||
className={`${
|
||||
isError ? "text-[red]" : "text-transparent"
|
||||
} text-[12px] m-[5px]`}
|
||||
>
|
||||
Please select signer
|
||||
</p>
|
||||
<div>
|
||||
<button className="submitbutton" onClick={() => handleAdd()}>
|
||||
<button className="op-btn op-btn-primary" onClick={() => handleAdd()}>
|
||||
Submit
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -108,15 +108,17 @@ const SignersInput = (props) => {
|
||||
<label className="block relative">
|
||||
Signers
|
||||
{props.required && <span className="text-red-500 text-[13px]">*</span>}
|
||||
<span className="absolute ml-1 text-xs z-50">
|
||||
<span className="absolute ml-1 text-xs z-30">
|
||||
<Tooltip
|
||||
id={"signer-tooltip"}
|
||||
message={"Begin typing a contact's name to see suggested signers from your saved contacts or add new ones. Arrange the signing order by adding signers in the desired sequence. Use the '+' button to include signers and the 'x' to remove them. Each signer will receive an email prompt to sign the document in the order listed."}
|
||||
message={
|
||||
"Begin typing a contact's name to see suggested signers from your saved contacts or add new ones. Arrange the signing order by adding signers in the desired sequence. Use the '+' button to include signers and the 'x' to remove them. Each signer will receive an email prompt to sign the document in the order listed."
|
||||
}
|
||||
/>
|
||||
</span>
|
||||
</label>
|
||||
<div style={{ display: "flex", gap: 5 }}>
|
||||
<div style={{ flexWrap: "wrap", width: "100%" }}>
|
||||
<div className="flex gap-x-[5px]">
|
||||
<div className="w-full">
|
||||
<Select
|
||||
onSortEnd={onSortEnd}
|
||||
distance={4}
|
||||
@@ -126,6 +128,13 @@ const SignersInput = (props) => {
|
||||
onChange={onChange}
|
||||
closeMenuOnSelect={false}
|
||||
required={props.required}
|
||||
unstyled
|
||||
classNames={{
|
||||
control: () =>
|
||||
"op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs",
|
||||
option: () =>
|
||||
"bg-base-200 text-base-content hover:bg-base-300 p-2 shadow-md"
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div
|
||||
@@ -133,16 +142,7 @@ const SignersInput = (props) => {
|
||||
setIsModel(true);
|
||||
openModal();
|
||||
}}
|
||||
style={{
|
||||
cursor: "pointer",
|
||||
borderRadius: 4,
|
||||
border: "1px solid #ccc",
|
||||
minHeight: 38,
|
||||
minWidth: 48,
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
alignItems: "center"
|
||||
}}
|
||||
className="cursor-pointer border-[1px] op-inut op-input-bordered min-h-[38px] min-w-[48px] flex justify-center items-center"
|
||||
>
|
||||
<i className="fas fa-plus"></i>
|
||||
</div>
|
||||
|
||||
@@ -3,7 +3,7 @@ import { NavLink } from "react-router-dom";
|
||||
|
||||
const Menu = ({ item, isOpen, closeSidebar }) => {
|
||||
return (
|
||||
<li key={item.title} role="none">
|
||||
<li key={item.title} role="none" className="my-0.5">
|
||||
<NavLink
|
||||
to={
|
||||
item.pageType
|
||||
@@ -12,8 +12,8 @@ const Menu = ({ item, isOpen, closeSidebar }) => {
|
||||
}
|
||||
className={({ isActive }) =>
|
||||
`${
|
||||
isActive ? "text-[#0056b3] bg-[#eef1f5]" : ""
|
||||
} mx-auto flex items-center hover:bg-[#eef1f5] p-3 lg:p-4 cursor-pointer`
|
||||
isActive ? " bg-base-300 text-base-content" : ""
|
||||
} flex items-center text-left p-3 lg:p-4 text-base-content hover:text-base-content focus:bg-base-300 hover:bg-base-300 hover:no-underline focus:outline-none`
|
||||
}
|
||||
onClick={closeSidebar}
|
||||
tabIndex={isOpen ? 0 : -1}
|
||||
|
||||
@@ -9,6 +9,7 @@ import dp from "../../assets/images/dp.png";
|
||||
|
||||
const Sidebar = ({ isOpen, closeSidebar }) => {
|
||||
const [menuList, setmenuList] = useState([]);
|
||||
const [submenuOpen, setSubmenuOpen] = useState(false);
|
||||
let username = localStorage.getItem("username");
|
||||
const image = localStorage.getItem("profileImg") || dp;
|
||||
const tenantname = localStorage.getItem("TenantName");
|
||||
@@ -33,10 +34,18 @@ const Sidebar = ({ isOpen, closeSidebar }) => {
|
||||
}
|
||||
};
|
||||
|
||||
const toggleSubmenu = (title) => {
|
||||
setSubmenuOpen({ [title]: !submenuOpen[title] });
|
||||
};
|
||||
|
||||
const handleMenuItem = () => {
|
||||
closeSidebar();
|
||||
setSubmenuOpen({});
|
||||
};
|
||||
return (
|
||||
<aside
|
||||
className={`bg-white text-[#444] h-screen w-full md:w-[300px] overflow-y-auto transform transition-transform z-40 md:translate-x-0
|
||||
${isOpen ? "translate-x-0 block" : "-translate-x-full hidden"}`}
|
||||
className={`absolute md:relative bg-base-100 h-screen overflow-y-auto transition-all z-40 hide-scrollbar
|
||||
${isOpen ? "w-full md:w-[300px]" : "w-0"}`}
|
||||
>
|
||||
<div className="flex px-2 py-3 gap-2 items-center shadow-md">
|
||||
<div className="w-[75px] h-[75px] rounded-full ring-[2px] ring-offset-2 ring-gray-400 overflow-hidden">
|
||||
@@ -47,13 +56,20 @@ const Sidebar = ({ isOpen, closeSidebar }) => {
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
<p className="text-[14px] font-bold">{username}</p>
|
||||
<p className={`text-[12px] ${tenantname ? "mt-2" : ""}`}>
|
||||
<p className="text-[14px] font-bold text-base-content">{username}</p>
|
||||
<p
|
||||
className={`text-[12px] text-base-content ${
|
||||
tenantname ? "mt-2" : ""
|
||||
}`}
|
||||
>
|
||||
{tenantname}
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<nav aria-label="OpenSign Sidebar Navigation">
|
||||
<nav
|
||||
className="op-menu op-menu-sm"
|
||||
aria-label="OpenSign Sidebar Navigation"
|
||||
>
|
||||
<ul
|
||||
className="text-sm"
|
||||
role="menubar"
|
||||
@@ -65,19 +81,21 @@ const Sidebar = ({ isOpen, closeSidebar }) => {
|
||||
key={item.title}
|
||||
item={item}
|
||||
isOpen={isOpen}
|
||||
closeSidebar={closeSidebar}
|
||||
closeSidebar={handleMenuItem}
|
||||
/>
|
||||
) : (
|
||||
<Submenu
|
||||
key={item.title}
|
||||
item={item}
|
||||
closeSidebar={closeSidebar}
|
||||
toggleSubmenu={toggleSubmenu}
|
||||
submenuOpen={submenuOpen}
|
||||
/>
|
||||
)
|
||||
)}
|
||||
</ul>
|
||||
</nav>
|
||||
<footer className="mt-4 flex justify-center items-center text-[25px] text-black gap-3">
|
||||
<footer className="mt-4 flex justify-center items-center text-[25px] text-base-content gap-3">
|
||||
<SocialMedia />
|
||||
</footer>
|
||||
</aside>
|
||||
|
||||
@@ -1,19 +1,13 @@
|
||||
import React, { useState } from "react";
|
||||
import React from "react";
|
||||
import { NavLink } from "react-router-dom";
|
||||
|
||||
const Submenu = ({ item, closeSidebar }) => {
|
||||
const [submenuOpen, setSubmenuOpen] = useState(false);
|
||||
const Submenu = ({ item, closeSidebar, toggleSubmenu, submenuOpen }) => {
|
||||
const { title, icon, children } = item;
|
||||
|
||||
const toggleSubmenu = () => {
|
||||
setSubmenuOpen(!submenuOpen);
|
||||
};
|
||||
|
||||
return (
|
||||
<li role="none">
|
||||
<li role="none" className="my-0.5">
|
||||
<button
|
||||
onClick={toggleSubmenu}
|
||||
className="w-full flex items-center text-left text-[#444] p-3 lg:p-4 hover:bg-[#eef1f5] focus:outline-none focus:text-[#0056b3] focus:bg-[#eef1f5]"
|
||||
onClick={() => toggleSubmenu(item.title)}
|
||||
className="flex items-center text-left p-3 lg:p-4 text-base-content hover:text-base-content focus:bg-base-300 hover:bg-base-300 hover:no-underline focus:outline-none "
|
||||
aria-expanded={submenuOpen}
|
||||
aria-haspopup="true"
|
||||
aria-controls={`submenu-${title}`}
|
||||
@@ -23,23 +17,29 @@ const Submenu = ({ item, closeSidebar }) => {
|
||||
<span className="ml-3 lg:ml-4">{title}</span>
|
||||
<i
|
||||
className={`${
|
||||
submenuOpen ? "fa-solid fa-angle-down" : "fa-solid fa-angle-right"
|
||||
submenuOpen[item.title]
|
||||
? "fa-solid fa-angle-down"
|
||||
: "fa-solid fa-angle-right"
|
||||
}`}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
</div>
|
||||
</button>
|
||||
{submenuOpen && (
|
||||
{submenuOpen[item.title] && (
|
||||
<ul id={`submenu-${title}`} role="menu" aria-label={`${title} submenu`}>
|
||||
{children.map((childItem) => (
|
||||
<li key={childItem.title} role="none">
|
||||
<li key={childItem.title} role="none" className="my-0.5">
|
||||
<NavLink
|
||||
to={
|
||||
childItem.pageType
|
||||
? `/${childItem.pageType}/${childItem.objectId}`
|
||||
: `/${childItem.objectId}`
|
||||
}
|
||||
className="block pl-6 md:pl-8 py-2 text-sm text-gray-700 hover:bg-blue-500 hover:text-white focus:text-[#0056b3] focus:bg-[#eef1f5] cursor-pointer"
|
||||
className={({ isActive }) =>
|
||||
`${
|
||||
isActive ? "bg-base-300 text-base-content" : ""
|
||||
} flex items-center text-left pl-6 md:pl-8 py-2 text-sm cursor-pointer text-base-content hover:text-base-content focus:bg-base-300 hover:bg-base-300 hover:no-underline focus:outline-none`
|
||||
}
|
||||
onClick={closeSidebar}
|
||||
role="menuitem"
|
||||
tabIndex={submenuOpen ? 0 : -1}
|
||||
|
||||
@@ -5,8 +5,6 @@ export const rejectBtn =
|
||||
"bg-[#ffffff] rounded-sm shadow-md text-[12px] font-semibold uppercase text-black py-1.5 px-4 focus:outline-none text-center border-[1px] border-[#b4b4b4]";
|
||||
export const submitBtn =
|
||||
"bg-[#32a3ac] rounded-sm shadow-md text-[12px] font-semibold uppercase text-white py-1.5 px-4 focus:outline-none text-center";
|
||||
export const modalSubmitBtnColor = "#17a2b8";
|
||||
export const modalCancelBtnColor = "white";
|
||||
export const themeColor = "#47a3ad";
|
||||
export const iconColor = "#686968";
|
||||
export const isEnableSubscription = process.env.REACT_APP_ENABLE_SUBSCRIPTION;
|
||||
|
||||
@@ -2,17 +2,16 @@
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
body{
|
||||
background-color: white;
|
||||
body {
|
||||
background-color: white;
|
||||
}
|
||||
|
||||
/* Custom CSS to hide scrollbar */
|
||||
.hide-scrollbar::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hide-scrollbar {
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
display: none;
|
||||
}
|
||||
|
||||
.hide-scrollbar {
|
||||
-ms-overflow-style: none; /* IE and Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
}
|
||||
|
||||
@@ -14,8 +14,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "1231",
|
||||
hoverLabel: "Edit",
|
||||
btnColor: "#4bd396",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-primary",
|
||||
btnIcon: "fa-solid fa-pen",
|
||||
redirectUrl: "draftDocument",
|
||||
action: "redirect"
|
||||
@@ -23,8 +22,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "2142",
|
||||
hoverLabel: "Delete",
|
||||
btnColor: "#ff4848",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-secondary",
|
||||
btnIcon: "fa fa-trash",
|
||||
redirectUrl: "",
|
||||
action: "delete"
|
||||
@@ -43,8 +41,7 @@ export default function reportJson(id) {
|
||||
btnId: "4536",
|
||||
btnLabel: "sign",
|
||||
hoverLabel: "Sign",
|
||||
btnColor: "#3ac9d6",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-primary",
|
||||
btnIcon: "fa-solid fa-signature",
|
||||
redirectUrl: "pdfRequestFiles",
|
||||
action: "redirect"
|
||||
@@ -62,8 +59,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "8901",
|
||||
hoverLabel: "Share",
|
||||
btnColor: "#4bd396",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-primary",
|
||||
btnIcon: "fa-solid fa-share",
|
||||
redirectUrl: "",
|
||||
action: "share"
|
||||
@@ -71,8 +67,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "1588",
|
||||
hoverLabel: "View",
|
||||
btnColor: "#3ac9d6",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-secondary",
|
||||
btnIcon: "fa fa-eye",
|
||||
redirectUrl: "pdfRequestFiles",
|
||||
action: "redirect"
|
||||
@@ -80,7 +75,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "2234",
|
||||
hoverLabel: "option",
|
||||
btnColor: "transparent",
|
||||
btnColor: "",
|
||||
textColor: "black",
|
||||
btnIcon: "fa-solid fa-ellipsis-vertical fa-lg",
|
||||
action: "option",
|
||||
@@ -124,8 +119,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "1378",
|
||||
hoverLabel: "Edit",
|
||||
btnColor: "#4bd396",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-primary",
|
||||
btnIcon: "fa fa-eye",
|
||||
redirectUrl: "draftDocument",
|
||||
action: "redirect"
|
||||
@@ -133,8 +127,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "1278",
|
||||
hoverLabel: "Delete",
|
||||
btnColor: "#ff4848",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-secondary",
|
||||
btnIcon: "fa fa-trash",
|
||||
redirectUrl: "",
|
||||
action: "delete"
|
||||
@@ -152,8 +145,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "1458",
|
||||
hoverLabel: "View",
|
||||
btnColor: "#4bd396",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-primary",
|
||||
btnIcon: "fa fa-eye",
|
||||
redirectUrl: "draftDocument",
|
||||
action: "redirect"
|
||||
@@ -161,8 +153,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "1358",
|
||||
hoverLabel: "Delete",
|
||||
btnColor: "#ff4848",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-secondary",
|
||||
btnIcon: "fa fa-trash",
|
||||
redirectUrl: "",
|
||||
action: "delete"
|
||||
@@ -180,8 +171,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "1898",
|
||||
hoverLabel: "View",
|
||||
btnColor: "#4bd396",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-primary",
|
||||
btnIcon: "fa fa-eye",
|
||||
redirectUrl: "draftDocument",
|
||||
action: "redirect"
|
||||
@@ -189,8 +179,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "1998",
|
||||
hoverLabel: "Delete",
|
||||
btnColor: "#ff4848",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-secondary",
|
||||
btnIcon: "fa fa-trash",
|
||||
redirectUrl: "",
|
||||
action: "delete"
|
||||
@@ -208,8 +197,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "1999",
|
||||
hoverLabel: "Share",
|
||||
btnColor: "#4bd396",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-primary",
|
||||
btnIcon: "fa-solid fa-share",
|
||||
redirectUrl: "",
|
||||
action: "share"
|
||||
@@ -217,8 +205,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "1999",
|
||||
hoverLabel: "View",
|
||||
btnColor: "#3ac9d6",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-secondary",
|
||||
btnIcon: "fa fa-eye",
|
||||
redirectUrl: "pdfRequestFiles",
|
||||
action: "redirect"
|
||||
@@ -226,7 +213,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "2234",
|
||||
hoverLabel: "option",
|
||||
btnColor: "transparent",
|
||||
btnColor: "",
|
||||
textColor: "black",
|
||||
btnIcon: "fa-solid fa-ellipsis-vertical fa-lg",
|
||||
action: "option",
|
||||
@@ -269,8 +256,7 @@ export default function reportJson(id) {
|
||||
btnId: "2001",
|
||||
btnLabel: "sign",
|
||||
hoverLabel: "Sign",
|
||||
btnColor: "#3ac9d6",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-primary",
|
||||
btnIcon: "fa-solid fa-signature",
|
||||
redirectUrl: "pdfRequestFiles",
|
||||
action: "redirect"
|
||||
@@ -286,8 +272,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "2003",
|
||||
hoverLabel: "Edit",
|
||||
btnColor: "#4bd396",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-primary",
|
||||
btnIcon: "fa-solid fa-pen",
|
||||
redirectUrl: "draftDocument",
|
||||
action: "redirect"
|
||||
@@ -295,8 +280,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "2004",
|
||||
hoverLabel: "Delete",
|
||||
btnColor: "#ff4848",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-secondary",
|
||||
btnIcon: "fa fa-trash",
|
||||
redirectUrl: "",
|
||||
action: "delete"
|
||||
@@ -312,8 +296,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "2204",
|
||||
hoverLabel: "Delete",
|
||||
btnColor: "#f55a42",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-outline op-btn-error",
|
||||
btnIcon: "fa-solid fa-trash",
|
||||
action: "delete"
|
||||
}
|
||||
@@ -332,8 +315,7 @@ export default function reportJson(id) {
|
||||
btnId: "2234",
|
||||
btnLabel: "Use",
|
||||
hoverLabel: "Use",
|
||||
btnColor: "#4bd396",
|
||||
textColor: "white",
|
||||
btnColor: "op-btn-primary",
|
||||
btnIcon: "fa fa-plus",
|
||||
redirectUrl: "placeHolderSign",
|
||||
action: "redirect",
|
||||
@@ -345,6 +327,7 @@ export default function reportJson(id) {
|
||||
btnId: "1631",
|
||||
btnLabel: "Quick send",
|
||||
hoverLabel: "Quick send",
|
||||
btnColor: "op-btn-secondary",
|
||||
btnIcon: "fa-solid fa-envelope",
|
||||
redirectUrl: "",
|
||||
action: "bulksend",
|
||||
@@ -355,7 +338,7 @@ export default function reportJson(id) {
|
||||
{
|
||||
btnId: "2234",
|
||||
hoverLabel: "option",
|
||||
btnColor: "transparent",
|
||||
btnColor: "",
|
||||
textColor: "black",
|
||||
btnIcon: "fa-solid fa-ellipsis-vertical fa-lg",
|
||||
action: "option",
|
||||
|
||||
@@ -0,0 +1,90 @@
|
||||
const dashboardJson = [
|
||||
{
|
||||
id: "35KBoSgoAK",
|
||||
columns: [
|
||||
{
|
||||
colsize: "col-span-12 md:col-span-6 lg:col-span-6",
|
||||
widget: {
|
||||
type: "Card",
|
||||
icon: "fas fa-signature",
|
||||
bgColor: "#f0058e",
|
||||
label: "Need your Signature",
|
||||
description: null,
|
||||
data: {
|
||||
id: "e04ee9dc-932d-6b80-0202-703fd154eb74",
|
||||
queryType: "",
|
||||
class: "contracts_Document",
|
||||
query:
|
||||
'where={"$and":[{"AuditTrail.UserPtr":{"$ne":{"__type":"Pointer","className": "contracts_Users","objectId":"#objectId#"}}},{"AuditTrail.Activity":{"$ne":"Signed"}}],"Signers":{"$in":[{"__type":"Pointer","className":"contracts_Users","objectId":"#objectId#"}]},"IsDeclined":{"$ne":true},"IsCompleted":{"$ne":true},"Type":{"$ne":"Folder"},"Placeholders":{"$ne":null},"ExpiryDate":{"#*gt":{"__type":"#Date#","iso":"#today#"}}}&count=1',
|
||||
key: "count",
|
||||
Redirect_type: "Report",
|
||||
Redirect_id: "4Hhwbp482K",
|
||||
tourSection: "tourcard1",
|
||||
tourMessage:
|
||||
"Clicking on this card will take you to the list of documents awaiting your review."
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
colsize: "col-span-12 md:col-span-6 lg:col-span-6",
|
||||
widget: {
|
||||
type: "Card",
|
||||
icon: "fas fa-sign-out-alt",
|
||||
bgColor: "#g0058e",
|
||||
label: "Out for signatures",
|
||||
description: null,
|
||||
data: {
|
||||
id: "c1935cc0-28d4-3d73-b72a-8c1e3d18a17f",
|
||||
queryType: "",
|
||||
class: "contracts_Document",
|
||||
query:
|
||||
'where={"Type":{"#*ne":"Folder"},"Signers":{"#*exists":true,"#*ne":[]},"Placeholders":{"#*ne":null},"IsCompleted":{"#*ne":true},"IsDeclined":{"#*ne":true},"IsArchive":{"#*ne":true},"CreatedBy":{"__type":"Pointer","className":"_User","objectId":"#UserId.objectId#"},"ExpiryDate":{"#*gt":{"__type":"#Date#","iso":"#today#"}}}&count=1',
|
||||
key: "count",
|
||||
Redirect_type: "Report",
|
||||
Redirect_id: "1MwEuxLEkF",
|
||||
tourSection: "tourcard2",
|
||||
tourMessage:
|
||||
"Clicking on this card will take you to a list of documents awaiting signature."
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
colsize: "col-span-12 md:col-span-6 lg:col-span-6",
|
||||
widget: {
|
||||
type: "report",
|
||||
reportId: "5Go51Q7T8r",
|
||||
data: {
|
||||
tourSection: "tourreport1",
|
||||
tourMessage:
|
||||
"This is a list of documents that are waiting for your signature."
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
colsize: "col-span-12 md:col-span-6 lg:col-span-6",
|
||||
widget: {
|
||||
type: "report",
|
||||
reportId: "d9k3UfYHBc",
|
||||
data: {
|
||||
tourSection: "tourreport2",
|
||||
tourMessage:
|
||||
"This is a list of documents you've sent to other parties for signature."
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
colsize: "col-span-12 md:col-span-12 lg:col-span-12",
|
||||
widget: {
|
||||
type: "report",
|
||||
reportId: "kC5mfynCi4",
|
||||
data: {
|
||||
tourSection: "tourreport3",
|
||||
tourMessage:
|
||||
"This are documents you have started but have not finalized for sending."
|
||||
}
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
export default dashboardJson;
|
||||
@@ -253,21 +253,8 @@ const HomeLayout = () => {
|
||||
{isUserValid ? (
|
||||
<>
|
||||
{isLoader ? (
|
||||
<div
|
||||
style={{
|
||||
height: "100vh",
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
justifyContent: "center"
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
fontSize: "45px",
|
||||
color: "#3dd3e0"
|
||||
}}
|
||||
className="loader-37"
|
||||
></div>
|
||||
<div className="flex h-[100vh] justify-center items-center text-[45px] text-[#3dd3e0]">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
@@ -277,7 +264,7 @@ const HomeLayout = () => {
|
||||
id="renderList"
|
||||
className="relative h-screen flex flex-col justify-between w-full overflow-y-auto"
|
||||
>
|
||||
<div className="bg-[#eef1f5] p-3">{<Outlet />}</div>
|
||||
<div className="bg-base-200 p-3">{<Outlet />}</div>
|
||||
<div className="z-30">
|
||||
<Footer />
|
||||
</div>
|
||||
|
||||
@@ -49,13 +49,13 @@ function ChangePassword() {
|
||||
return <Navigate to="/" />;
|
||||
}
|
||||
return (
|
||||
<div className="w-full bg-white shadow rounded p-2">
|
||||
<div className="w-full bg-base-100 text-base-content shadow rounded p-2">
|
||||
<Title title={"Change Password"} />
|
||||
<div className="text-xl font-bold border-b-[1px] border-gray-300">
|
||||
Change Password
|
||||
</div>
|
||||
<div className="m-2">
|
||||
<form onSubmit={handleSubmit}>
|
||||
<form onSubmit={handleSubmit} className=" flex flex-col gap-y-2">
|
||||
<div>
|
||||
<label htmlFor="currentpassword" className="block text-xs ml-1">
|
||||
Current Password
|
||||
@@ -65,7 +65,7 @@ function ChangePassword() {
|
||||
name="currentpassword"
|
||||
value={currentpassword}
|
||||
onChange={(e) => setCurrentPassword(e.target.value)}
|
||||
className="px-3 py-2 mb-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm text-xs w-full"
|
||||
placeholder="Current Password"
|
||||
required
|
||||
/>
|
||||
@@ -79,7 +79,7 @@ function ChangePassword() {
|
||||
name="newpassword"
|
||||
value={newpassword}
|
||||
onChange={(e) => setnewpassword(e.target.value)}
|
||||
className="px-3 py-2 mb-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm text-xs w-full"
|
||||
placeholder="New Password"
|
||||
required
|
||||
/>
|
||||
@@ -91,17 +91,14 @@ function ChangePassword() {
|
||||
<input
|
||||
type="password"
|
||||
name="confirmpassword"
|
||||
className="px-3 py-2 mb-2 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-input op-input-bordered op-input-sm text-xs w-full"
|
||||
value={confirmpassword}
|
||||
onChange={(e) => setconfirmpassword(e.target.value)}
|
||||
placeholder="Confirm Password"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<button
|
||||
type="submit"
|
||||
className="bg-[#188ae2] m-2 px-4 py-3 rounded-sm shadow-md text-white text-xs font-semibold uppercase"
|
||||
>
|
||||
<button type="submit" className="op-btn op-btn-primary shadow-md m-2">
|
||||
Change Password
|
||||
</button>
|
||||
</form>
|
||||
|
||||
@@ -1,20 +1,18 @@
|
||||
import React, { useState, useEffect } from "react";
|
||||
import Parse from "parse";
|
||||
import "../styles/loader.css";
|
||||
import GetDashboard from "../components/dashboard/GetDashboard";
|
||||
import { useNavigate, useParams } from "react-router-dom";
|
||||
import Title from "../components/Title";
|
||||
import { useDispatch } from "react-redux";
|
||||
import { saveTourSteps } from "../redux/reducers/TourStepsReducer";
|
||||
import dashboardJson from "../json/dashboardJson";
|
||||
|
||||
const Dashboard = () => {
|
||||
const navigate = useNavigate();
|
||||
const dispatch = useDispatch();
|
||||
const { id } = useParams();
|
||||
const [dashboard, setdashboard] = useState([]);
|
||||
const [classnameArray, setclassnameArray] = useState([]);
|
||||
const [loading, setloading] = useState(false);
|
||||
const [defaultQuery, setDefaultQuery] = useState("");
|
||||
const [dashboard, setdashboard] = useState({});
|
||||
const [loading, setloading] = useState(true);
|
||||
|
||||
useEffect(() => {
|
||||
if (localStorage.getItem("accesstoken")) {
|
||||
@@ -30,53 +28,10 @@ const Dashboard = () => {
|
||||
}, [id]);
|
||||
|
||||
const getDashboard = async (id) => {
|
||||
setloading(true);
|
||||
try {
|
||||
var forms = Parse.Object.extend("w_dashboard");
|
||||
var query = new Parse.Query(forms);
|
||||
query.equalTo("objectId", id);
|
||||
const results = await query.first();
|
||||
const resultjson = results.toJSON();
|
||||
let classArray = [];
|
||||
let DefaultQuery = "";
|
||||
resultjson.rows.forEach((x) => {
|
||||
let col_lg = "",
|
||||
col_md = "",
|
||||
col_xs = "",
|
||||
col_sm = "",
|
||||
col_ = "",
|
||||
obj = {};
|
||||
let subItem = [];
|
||||
let item = "";
|
||||
x.columns.forEach((y) => {
|
||||
if (y.widget.type === "customeHtml") {
|
||||
DefaultQuery = y.widget.data[0].default;
|
||||
}
|
||||
if (Number(y["collg"]) > 0) {
|
||||
col_lg = "col-lg-" + y["collg"];
|
||||
}
|
||||
if (Number(y["colmd"]) > 0) {
|
||||
col_md = "col-md-" + y["colmd"];
|
||||
}
|
||||
if (Number(y["colxs"]) > 0) {
|
||||
col_xs = "col-xs-" + y["colxs"];
|
||||
}
|
||||
if (Number(y["colsm"]) > 0) {
|
||||
col_sm = "col-sm-" + y["colsm"];
|
||||
}
|
||||
if (Number(y["col"]) > 0) {
|
||||
col_ = "col-" + y["col"];
|
||||
}
|
||||
item =
|
||||
col_lg + " " + col_md + " " + col_xs + " " + col_sm + " " + col_;
|
||||
subItem.push(item);
|
||||
});
|
||||
obj = subItem;
|
||||
classArray.push(obj);
|
||||
});
|
||||
setdashboard(resultjson.rows);
|
||||
// console.log("resultjson.rows ", resultjson.rows);
|
||||
const arr = resultjson.rows[0].columns
|
||||
const dashboard = dashboardJson.find((x) => x.id === id);
|
||||
setdashboard(dashboard);
|
||||
const dashboardTour = dashboard.columns
|
||||
.filter((col) => {
|
||||
if (col.widget.data && col.widget.data.tourSection) {
|
||||
return col;
|
||||
@@ -90,14 +45,7 @@ const Dashboard = () => {
|
||||
// style: { backgroundColor: "#abd4d2" },
|
||||
};
|
||||
});
|
||||
dispatch(saveTourSteps(arr));
|
||||
// console.log("arr ", arr);
|
||||
setclassnameArray(classArray);
|
||||
if (localStorage.getItem("DashboardDefaultFilter")) {
|
||||
setDefaultQuery(localStorage.getItem("DashboardDefaultFilter"));
|
||||
} else {
|
||||
setDefaultQuery(DefaultQuery);
|
||||
}
|
||||
dispatch(saveTourSteps(dashboardTour));
|
||||
setloading(false);
|
||||
} catch (e) {
|
||||
console.error("Problem", e);
|
||||
@@ -105,32 +53,16 @@ const Dashboard = () => {
|
||||
}
|
||||
};
|
||||
|
||||
let _dash = (
|
||||
<GetDashboard
|
||||
dashboard={dashboard}
|
||||
classnameArray={classnameArray}
|
||||
DefaultQuery={defaultQuery}
|
||||
/>
|
||||
);
|
||||
if (loading) {
|
||||
_dash = (
|
||||
<div style={{ height: "300px", backgroundColor: "white" }}>
|
||||
<div
|
||||
style={{
|
||||
marginLeft: "45%",
|
||||
marginTop: "150px",
|
||||
fontSize: "45px",
|
||||
color: "#3dd3e0"
|
||||
}}
|
||||
className="loader-37"
|
||||
></div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Title title="Dashboard" />
|
||||
{_dash}
|
||||
{loading ? (
|
||||
<div className="h-[300px] text-[45px] text-[#3dd3e0] w-full bg-white flex justify-center items-center rounded-md">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
) : (
|
||||
<GetDashboard dashboard={dashboard} />
|
||||
)}
|
||||
</React.Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -1,21 +1,26 @@
|
||||
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";
|
||||
import { appInfo } from "../constant/appinfo";
|
||||
import { useDispatch } from "react-redux";
|
||||
import { fetchAppInfo } from "../redux/reducers/infoReducer";
|
||||
import { isEnableSubscription } from "../constant/const";
|
||||
import { getAppLogo } from "../constant/Utils";
|
||||
|
||||
function ForgotPassword() {
|
||||
const dispatch = useDispatch();
|
||||
const navigate = useNavigate();
|
||||
const [state, setState] = useState({
|
||||
email: "",
|
||||
password: "",
|
||||
hideNav: ""
|
||||
});
|
||||
const [sentStatus, setSentStatus] = useState("");
|
||||
const [image, setImage] = useState();
|
||||
|
||||
const handleChange = (event) => {
|
||||
const { name, value } = event.target;
|
||||
setState({ ...state, [name]: value });
|
||||
@@ -51,15 +56,26 @@ function ForgotPassword() {
|
||||
|
||||
useEffect(() => {
|
||||
dispatch(fetchAppInfo());
|
||||
saveLogo();
|
||||
resize();
|
||||
window.addEventListener("resize", resize);
|
||||
return () => window.removeEventListener("resize", resize);
|
||||
// eslint-disable-next-line
|
||||
}, []);
|
||||
|
||||
let image = appInfo.applogo;
|
||||
const saveLogo = async () => {
|
||||
if (isEnableSubscription) {
|
||||
const logo = await getAppLogo();
|
||||
if (logo) {
|
||||
setImage(logo);
|
||||
} else {
|
||||
setImage(appInfo?.applogo || undefined);
|
||||
}
|
||||
} else {
|
||||
setImage(appInfo?.applogo || undefined);
|
||||
}
|
||||
};
|
||||
return (
|
||||
<div className="bg-white">
|
||||
<div>
|
||||
<Title title="Forgot password page" />
|
||||
{sentStatus === "success" && (
|
||||
<Alert type="success">
|
||||
@@ -69,29 +85,31 @@ function ForgotPassword() {
|
||||
{sentStatus === "failed" && (
|
||||
<Alert type={"danger"}>Please setup email adapter </Alert>
|
||||
)}
|
||||
<div>
|
||||
<div className="md:m-10 lg:m-16 md:p-4 lg:p-10 p-5 bg-[#ffffff] md:border-[1px] md:border-gray-400 ">
|
||||
<div className="w-[250px] h-[66px] inline-block">
|
||||
{state.hideNav ? (
|
||||
<img src={image} width="100%" alt="" />
|
||||
) : (
|
||||
<img src={image} width="100%" alt="" />
|
||||
<div className="md:p-10 lg:p-16">
|
||||
<div className="md:p-4 lg:p-10 p-4 bg-base-100 text-base-content op-card">
|
||||
<div className="w-[250px] h-[66px] inline-block overflow-hidden">
|
||||
{image && (
|
||||
<img
|
||||
src={image}
|
||||
className="object-contain h-full"
|
||||
alt="applogo"
|
||||
/>
|
||||
)}
|
||||
</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]">
|
||||
Reset Your Password
|
||||
</span>
|
||||
<div className="shadow-md rounded my-4">
|
||||
<div className="w-full my-4 op-card bg-base-100 shadow-md outline outline-1 outline-slate-300/50">
|
||||
<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
|
||||
@@ -99,19 +117,16 @@ function ForgotPassword() {
|
||||
<hr className="my-2 border-none" />
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex justify-between items-center px-4">
|
||||
<button
|
||||
type="submit"
|
||||
className="rounded-sm bg-[#3ac9d6] text-white px-4 py-3 text-xs font-semibold shadow uppercase"
|
||||
>
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-2 text-center text-xs font-bold">
|
||||
<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>
|
||||
|
||||
@@ -484,6 +484,9 @@ const Forms = (props) => {
|
||||
setpercentage(0);
|
||||
setTimeout(() => setIsReset(false), 50);
|
||||
};
|
||||
const handleCancel = () => {
|
||||
navigate("/dashboard/35KBoSgoAK");
|
||||
};
|
||||
const handlePasswordSubmit = async (e) => {
|
||||
e.preventDefault();
|
||||
setIsPassword(false);
|
||||
@@ -561,7 +564,7 @@ const Forms = (props) => {
|
||||
setFormData((prev) => ({ ...prev, autoreminder: !formData.autoreminder }));
|
||||
};
|
||||
return (
|
||||
<div className="shadow-md rounded my-2 p-3 bg-[#ffffff] md:border-[1px] md:border-gray-600/50">
|
||||
<div className="shadow-md rounded my-2 p-3 bg-base-100 text-base-content md:border-[1px] md:border-gray-600/50">
|
||||
<Title title={props?.title} />
|
||||
{isAlert && (
|
||||
<Alert type={isErr ? "danger" : "success"}>
|
||||
@@ -571,16 +574,8 @@ const Forms = (props) => {
|
||||
</Alert>
|
||||
)}
|
||||
{isSubmit ? (
|
||||
<div style={{ height: "300px" }}>
|
||||
<div
|
||||
style={{
|
||||
marginLeft: "45%",
|
||||
marginTop: "150px",
|
||||
fontSize: "45px",
|
||||
color: "#3dd3e0"
|
||||
}}
|
||||
className="loader-37"
|
||||
></div>
|
||||
<div className="h-[300px] text-[45px] text-[#3dd3e0] flex justify-center items-center">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
@@ -629,12 +624,12 @@ const Forms = (props) => {
|
||||
style={{ width: `${percentage}%` }}
|
||||
></div>
|
||||
</div>
|
||||
<span className="text-black text-sm">{percentage}%</span>
|
||||
<span className="text-base-content text-sm">{percentage}%</span>
|
||||
</div>
|
||||
)}
|
||||
{isDecrypting && (
|
||||
<div className="flex items-center gap-x-2">
|
||||
<span className="text-black text-sm">
|
||||
<span className="text-base-content text-sm">
|
||||
Decrypting pdf please wait...
|
||||
</span>
|
||||
</div>
|
||||
@@ -648,13 +643,13 @@ const Forms = (props) => {
|
||||
</label>
|
||||
{fileupload.length > 0 ? (
|
||||
<div className="flex gap-2 justify-center items-center">
|
||||
<div className="flex justify-between items-center px-2 py-2 w-full font-bold rounded border-[1px] border-[#ccc] text-gray-500 bg-white text-[13px]">
|
||||
<div className="flex justify-between items-center op-input op-input-bordered op-input-sm w-full text-x text-[13px]">
|
||||
<div className="break-all">
|
||||
file selected : {getFileName(fileupload)}
|
||||
</div>
|
||||
<div
|
||||
onClick={() => setFileUpload("")}
|
||||
className="cursor-pointer px-[10px] text-[20px] font-bold bg-white text-red-500"
|
||||
className="cursor-pointer px-[10px] text-[20px] font-bold text-red-500"
|
||||
>
|
||||
<i className="fa-solid fa-xmark"></i>
|
||||
</div>
|
||||
@@ -667,10 +662,10 @@ const Forms = (props) => {
|
||||
)}
|
||||
</div>
|
||||
) : (
|
||||
<div className="flex gap-2 justify-center items-center">
|
||||
<div className="flex gap-2 justify-center items-center ">
|
||||
<input
|
||||
type="file"
|
||||
className="bg-white px-2 py-1.5 w-full border-[1px] border-gray-300 rounded focus:outline-none text-xs"
|
||||
className="op-file-input op-file-input-bordered op-file-input-sm focus:outline-none hover:border-base-content w-full text-xs"
|
||||
onChange={(e) => handleFileInput(e)}
|
||||
ref={inputFileRef}
|
||||
accept={
|
||||
@@ -698,7 +693,7 @@ const Forms = (props) => {
|
||||
</label>
|
||||
<input
|
||||
name="Name"
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
value={formData.Name}
|
||||
onChange={(e) => handleStrInput(e)}
|
||||
required
|
||||
@@ -708,7 +703,7 @@ const Forms = (props) => {
|
||||
<label className="block">Description</label>
|
||||
<input
|
||||
name="Description"
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
value={formData.Description}
|
||||
onChange={(e) => handleStrInput(e)}
|
||||
/>
|
||||
@@ -726,7 +721,7 @@ const Forms = (props) => {
|
||||
</label>
|
||||
<input
|
||||
name="Note"
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
value={formData.Note}
|
||||
onChange={(e) => handleStrInput(e)}
|
||||
required
|
||||
@@ -748,7 +743,7 @@ const Forms = (props) => {
|
||||
<input
|
||||
type="number"
|
||||
name="TimeToCompleteDays"
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
value={formData.TimeToCompleteDays}
|
||||
onChange={(e) => handleStrInput(e)}
|
||||
required
|
||||
@@ -786,7 +781,6 @@ const Forms = (props) => {
|
||||
<li>
|
||||
<span className="font-bold">Yes:</span>
|
||||
<span>
|
||||
{" "}
|
||||
Selecting this option will send the signing
|
||||
request to the first signer initially. Once the
|
||||
first signer completes their part, the next
|
||||
@@ -822,6 +816,7 @@ const Forms = (props) => {
|
||||
<input
|
||||
type="radio"
|
||||
value={"true"}
|
||||
className="op-radio op-radio-xs"
|
||||
name="SendinOrder"
|
||||
checked={formData.SendinOrder === "true"}
|
||||
onChange={handleStrInput}
|
||||
@@ -833,6 +828,7 @@ const Forms = (props) => {
|
||||
type="radio"
|
||||
value={"false"}
|
||||
name="SendinOrder"
|
||||
className="op-radio op-radio-xs"
|
||||
checked={formData.SendinOrder === "false"}
|
||||
onChange={handleStrInput}
|
||||
/>
|
||||
@@ -865,13 +861,11 @@ const Forms = (props) => {
|
||||
} relative block items-center mb-0`}
|
||||
>
|
||||
<input
|
||||
type="checkbox"
|
||||
className="op-toggle transition-all checked:[--tglbg:#3368ff] checked:bg-white"
|
||||
checked={formData.autoreminder}
|
||||
onChange={handleAutoReminder}
|
||||
type="checkbox"
|
||||
value=""
|
||||
className="sr-only peer"
|
||||
/>
|
||||
<div className="w-9 h-5 bg-gray-200 peer-focus:outline-none peer-focus:ring-1 peer-focus:ring-black rounded-full peer dark:bg-gray-700 peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all dark:border-black peer-checked:bg-blue-600 mt-2"></div>
|
||||
</label>
|
||||
</div>
|
||||
{formData?.autoreminder === true && (
|
||||
@@ -884,7 +878,7 @@ const Forms = (props) => {
|
||||
type="number"
|
||||
value={formData.remindOnceInEvery}
|
||||
name="remindOnceInEvery"
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
onChange={handleStrInput}
|
||||
required
|
||||
/>
|
||||
@@ -892,21 +886,21 @@ const Forms = (props) => {
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
<div className="flex items-center mt-3 gap-2 text-white">
|
||||
<div className="flex items-center mt-3 gap-2">
|
||||
<button
|
||||
className={`${
|
||||
isSubmit && "cursor-progress"
|
||||
} bg-[#1ab6ce] rounded-sm shadow-md text-[13px] font-semibold uppercase text-white py-1.5 px-2.5 focus:outline-none`}
|
||||
isSubmit ? "cursor-progress" : ""
|
||||
} op-btn op-btn-primary`}
|
||||
type="submit"
|
||||
disabled={isSubmit}
|
||||
>
|
||||
Next
|
||||
</button>
|
||||
<div
|
||||
className="cursor-pointer bg-[#188ae2] rounded-sm shadow-md text-[13px] font-semibold uppercase text-white py-1.5 px-2.5 text-center ml-[2px] focus:outline-none"
|
||||
onClick={() => handleReset()}
|
||||
className="op-btn op-btn-ghost"
|
||||
onClick={() => handleCancel()}
|
||||
>
|
||||
Reset
|
||||
Cancel
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
|
||||
@@ -126,7 +126,7 @@ function GenerateToken() {
|
||||
></div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="bg-white flex flex-col justify-center shadow rounded">
|
||||
<div className="bg-base-100 text-base-content flex flex-col justify-center shadow rounded">
|
||||
{!isEnableSubscription && <PremiumAlertHeader />}
|
||||
<h1 className={"ml-4 mt-3 mb-2 font-semibold"}>
|
||||
OpenSign™ API{" "}
|
||||
@@ -155,7 +155,7 @@ function GenerateToken() {
|
||||
{apiToken ? apiToken : "_____"}
|
||||
</span>
|
||||
<button
|
||||
className="rounded hover:bg-[#15b4e9] border-[1px] border-[#15b4e9] text-[#15b4e9] hover:text-white px-2.5 py-2 focus:outline-none ml-2"
|
||||
className="op-btn op-btn-primary op-btn-sm ml-2"
|
||||
onClick={() => copytoclipboard(apiToken)}
|
||||
>
|
||||
<i className="fa-solid fa-copy"></i>
|
||||
@@ -164,7 +164,7 @@ function GenerateToken() {
|
||||
</div>
|
||||
<button
|
||||
onClick={apiToken ? handleModal : handleSubmit}
|
||||
className="rounded hover:bg-[#15b4e9] border-[1px] border-[#15b4e9] text-[#15b4e9] hover:text-white text-xs md:text-sm lg:text-base px-2 py-2 focus:outline-none"
|
||||
className="op-btn op-btn-primary"
|
||||
>
|
||||
{apiToken ? "Regenerate Token" : "Generate Token"}
|
||||
</button>
|
||||
@@ -178,7 +178,7 @@ function GenerateToken() {
|
||||
"https://docs.opensignlabs.com/docs/API-docs/opensign-api-v-1"
|
||||
)
|
||||
}
|
||||
className="rounded hover:bg-[#15b4e9] border-[1px] my-2 border-[#15b4e9] text-[#15b4e9] hover:text-white px-11 py-2 text-xs md:text-base focus:outline-none"
|
||||
className="op-btn op-btn-primary my-2"
|
||||
>
|
||||
View Docs
|
||||
</button>
|
||||
|
||||
@@ -2,11 +2,7 @@ import React, { useState, useEffect } from "react";
|
||||
import { useNavigate, useParams } from "react-router-dom";
|
||||
import loader from "../assets/images/loader2.gif";
|
||||
import axios from "axios";
|
||||
import {
|
||||
isEnableSubscription,
|
||||
modalSubmitBtnColor,
|
||||
themeColor
|
||||
} from "../constant/const";
|
||||
import { isEnableSubscription, themeColor } from "../constant/const";
|
||||
import { contractUsers, getAppLogo } from "../constant/Utils";
|
||||
import logo from "../assets/images/logo.png";
|
||||
import { appInfo } from "../constant/appinfo";
|
||||
@@ -322,8 +318,7 @@ function GuestLogin() {
|
||||
<div className="mt-4 flex justify-start">
|
||||
<button
|
||||
type="submit"
|
||||
style={{ backgroundColor: modalSubmitBtnColor }}
|
||||
className="mr-2 px-[20px] py-1.5 text-white rounded shadow-md text-center focus:outline-none "
|
||||
className="op-btn op-btn-primary"
|
||||
disabled={loading}
|
||||
>
|
||||
{loading ? "Loading..." : "Next"}
|
||||
|
||||
@@ -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";
|
||||
@@ -1063,47 +1059,32 @@ function Login() {
|
||||
}
|
||||
};
|
||||
return (
|
||||
<div className="bg-white">
|
||||
<div>
|
||||
<Title title={"Login Page"} />
|
||||
{state.loading && (
|
||||
<div
|
||||
aria-live="assertive"
|
||||
style={{
|
||||
position: "fixed",
|
||||
width: "100vw",
|
||||
height: "100vh",
|
||||
backgroundColor: "rgba(0,0,0,0.2)",
|
||||
top: 0,
|
||||
left: 0,
|
||||
zIndex: 2
|
||||
}}
|
||||
className="fixed w-full h-full flex justify-center items-center bg-black bg-opacity-30 z-20 text-[50px] text-[#3ac9d6]"
|
||||
>
|
||||
<div
|
||||
role="status"
|
||||
style={{
|
||||
position: "fixed",
|
||||
fontSize: "50px",
|
||||
color: "#3ac9d6",
|
||||
top: "50%",
|
||||
left: "50%",
|
||||
transform: "translate(-50%, -50%)"
|
||||
}}
|
||||
className="loader-37"
|
||||
>
|
||||
<div role="status" className="loader-37">
|
||||
<span className="sr-only">Loading...</span>
|
||||
</div>
|
||||
</div>
|
||||
)}
|
||||
{appInfo && appInfo.appId ? (
|
||||
<>
|
||||
<div aria-labelledby="loginHeading" role="region">
|
||||
<div className="md:m-10 lg:m-16 md:p-4 lg:p-10 p-4 bg-[#ffffff] md:border-[1px] md:border-gray-400 ">
|
||||
<div
|
||||
aria-labelledby="loginHeading"
|
||||
role="region"
|
||||
className="md:p-10 lg:p-16"
|
||||
>
|
||||
<div className="md:p-4 lg:p-10 p-4 bg-base-100 text-base-content op-card">
|
||||
<div className="w-[250px] h-[66px] inline-block overflow-hidden">
|
||||
{image && (
|
||||
<img
|
||||
src={image}
|
||||
className="object-contain h-full"
|
||||
alt="The image displays the OpenSign logo with a stylized blue square with an open corner, accompanied by the tagline Seal the Deal, Openly."
|
||||
alt="applogo"
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
@@ -1115,20 +1096,20 @@ function Login() {
|
||||
<legend className="text-[12px] text-[#878787]">
|
||||
Login to your account
|
||||
</legend>
|
||||
<div className="px-6 py-4 outline outline-1 outline-slate-300/50 my-2 rounded shadow-md">
|
||||
<div className="w-full px-6 py-3 my-1 op-card bg-base-100 shadow-md outline outline-1 outline-slate-300/50">
|
||||
<label className="block text-xs" htmlFor="email">
|
||||
Email
|
||||
</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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
name="email"
|
||||
value={state.email}
|
||||
onChange={handleChange}
|
||||
required
|
||||
/>
|
||||
<hr className="my-2 border-none" />
|
||||
<hr className="my-1 border-none" />
|
||||
{!isLoginSSO && (
|
||||
<>
|
||||
<label className="block text-xs" htmlFor="password">
|
||||
@@ -1140,18 +1121,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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
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 ? (
|
||||
@@ -1166,23 +1143,23 @@ 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>
|
||||
</div>
|
||||
</div>
|
||||
</fieldset>
|
||||
<div className="flex flex-col md:flex-row justify-between items-stretch gap-8 text-center text-xs font-bold mt-2">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-2 text-center text-xs font-bold mt-2">
|
||||
<button
|
||||
type="submit"
|
||||
className="rounded-sm bg-[#3ac9d6] text-white w-full py-3 shadow outline-none uppercase focus:ring-2 focus:ring-blue-600"
|
||||
className="op-btn op-btn-primary"
|
||||
disabled={state.loading}
|
||||
>
|
||||
{state.loading ? "Loading..." : "Login"}
|
||||
</button>
|
||||
<NavLink
|
||||
className="rounded-sm cursor-pointer bg-white border-[1px] border-[#15b4e9] text-[#15b4e9] w-full py-3 shadow uppercase"
|
||||
className="op-btn op-btn-secondary hover:no-underline hover:text-base-content"
|
||||
to={
|
||||
location.search
|
||||
? "/signup" + location.search
|
||||
@@ -1194,17 +1171,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>
|
||||
{(appInfo.googleClietId || isEnableSubscription) && (
|
||||
<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
|
||||
@@ -1248,7 +1217,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"
|
||||
@@ -1259,7 +1228,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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
id="Company"
|
||||
value={userDetails.Company}
|
||||
onChange={(e) =>
|
||||
@@ -1282,7 +1251,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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
id="JobTitle"
|
||||
value={userDetails.Destination}
|
||||
onChange={(e) =>
|
||||
@@ -1294,23 +1263,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-ghost"
|
||||
onClick={handleCloseModal}
|
||||
style={{ width: 75, backgroundColor: modalCancelBtnColor }}
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
@@ -1320,14 +1284,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);
|
||||
}
|
||||
}
|
||||
};
|
||||
@@ -224,24 +241,13 @@ const ManageSign = () => {
|
||||
setIsValue(true);
|
||||
};
|
||||
return (
|
||||
<div className="relative h-full bg-white flex shadow rounded overflow-auto">
|
||||
<div className="relative h-full bg-base-100 text-base-content flex shadow rounded overflow-auto">
|
||||
{isLoader && (
|
||||
<div className="absolute bg-black bg-opacity-75 z-50 w-full h-full flex justify-center items-center">
|
||||
<div
|
||||
style={{ color: "#3dd3e0" }}
|
||||
className="loader-37 text-[45px]"
|
||||
></div>
|
||||
</div>
|
||||
)}
|
||||
{isSuccess && (
|
||||
<div
|
||||
className="alert alert-success successBox"
|
||||
role="alert"
|
||||
onAnimationEnd={() => setIsSuccess(false)}
|
||||
>
|
||||
Signature saved successfully!
|
||||
<div className="absolute bg-black text-[45px] text-[#3dd3e0] bg-opacity-75 z-50 w-full h-full flex justify-center items-center">
|
||||
<div className="loader-37 "></div>
|
||||
</div>
|
||||
)}
|
||||
{isAlert?.message && <Alert type={isAlert.type}>{isAlert.message}</Alert>}
|
||||
<div
|
||||
className="mainDiv"
|
||||
style={{
|
||||
@@ -249,39 +255,13 @@ const ManageSign = () => {
|
||||
paddingRight: "10px"
|
||||
}}
|
||||
>
|
||||
<div style={{ margin: 20 }}>
|
||||
<div
|
||||
style={{
|
||||
fontWeight: "700",
|
||||
fontSize: 15,
|
||||
color: "#000",
|
||||
paddingBottom: 8
|
||||
}}
|
||||
>
|
||||
My Signature
|
||||
</div>
|
||||
<div className="m-[20px]">
|
||||
<div className="font-[700] text-[15px] pb-[8px]">My Signature</div>
|
||||
<div className="signBlock mt-4">
|
||||
<div>
|
||||
<div style={{ position: "relative" }}>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-between",
|
||||
width: "50%",
|
||||
paddingLeft: 10
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "row",
|
||||
justifyContent: "space-around",
|
||||
alignItems: "center",
|
||||
gap: 10,
|
||||
marginBottom: 10
|
||||
}}
|
||||
>
|
||||
<div className="relative">
|
||||
<div className="flex flex-row justify-between w-1/2 pl-[10px]">
|
||||
<div className="flex flex-row justify-around items-center gap-[10px] mb-[10px]">
|
||||
<>
|
||||
<span
|
||||
onClick={() => handleSignatureBtn()}
|
||||
@@ -307,24 +287,14 @@ const ManageSign = () => {
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div style={{ position: "relative" }}>
|
||||
<div className="relative">
|
||||
<div>
|
||||
{image ? (
|
||||
<div
|
||||
style={{
|
||||
position: "relative",
|
||||
border: "2px solid #888"
|
||||
}}
|
||||
className="signatureCanvas"
|
||||
>
|
||||
<div className="signatureCanvas relative border-[2px] border-[#888]">
|
||||
<img
|
||||
alt="preview image"
|
||||
src={image}
|
||||
style={{
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
objectFit: "contain"
|
||||
}}
|
||||
className="w-full h-full object-contain"
|
||||
/>
|
||||
</div>
|
||||
) : (
|
||||
@@ -366,10 +336,10 @@ const ManageSign = () => {
|
||||
key === 0 && penColor === "blue"
|
||||
? "2px solid blue"
|
||||
: key === 1 && penColor === "red"
|
||||
? "2px solid red"
|
||||
: key === 2 && penColor === "black"
|
||||
? "2px solid black"
|
||||
: "2px solid white"
|
||||
? "2px solid red"
|
||||
: key === 2 && penColor === "black"
|
||||
? "2px solid black"
|
||||
: "2px solid white"
|
||||
}}
|
||||
onClick={() => {
|
||||
if (key === 0) {
|
||||
@@ -474,10 +444,10 @@ const ManageSign = () => {
|
||||
key === 0 && initialPen === "blue"
|
||||
? "2px solid blue"
|
||||
: key === 1 && initialPen === "red"
|
||||
? "2px solid red"
|
||||
: key === 2 && initialPen === "black"
|
||||
? "2px solid black"
|
||||
: "2px solid white"
|
||||
? "2px solid red"
|
||||
: key === 2 && initialPen === "black"
|
||||
? "2px solid black"
|
||||
: "2px solid white"
|
||||
}}
|
||||
onClick={() => {
|
||||
if (key === 0) {
|
||||
@@ -509,20 +479,11 @@ const ManageSign = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* {!warning && (
|
||||
<div className="warning signWarning" style={{ fontSize: 12 }}>
|
||||
<i
|
||||
className="fas fa-exclamation-circle"
|
||||
style={{ color: "#fab005", fontSize: 15 }}
|
||||
></i>{" "}
|
||||
Please upload signature/Image
|
||||
</div>
|
||||
)} */}
|
||||
</div>
|
||||
</div>
|
||||
<div style={{ paddingTop: 10 }}>
|
||||
<button
|
||||
className="customBtn successBtn"
|
||||
className="op-btn op-btn-primary"
|
||||
onClick={(e) => handleSubmit(e)}
|
||||
>
|
||||
save
|
||||
|
||||
@@ -11,8 +11,8 @@ import TourContentWithBtn from "../primitives/TourContentWithBtn";
|
||||
import Tour from "reactour";
|
||||
import axios from "axios";
|
||||
|
||||
const DriveBody = React.lazy(() =>
|
||||
import("../components/opensigndrive/DriveBody")
|
||||
const DriveBody = React.lazy(
|
||||
() => import("../components/opensigndrive/DriveBody")
|
||||
);
|
||||
const Loader = () => {
|
||||
return (
|
||||
@@ -279,7 +279,8 @@ function Opensigndrive() {
|
||||
setNewFolderName(value);
|
||||
};
|
||||
//function for create folder
|
||||
const handleAddFolder = async () => {
|
||||
const handleAddFolder = async (e) => {
|
||||
e.preventDefault();
|
||||
if (newFolderName) {
|
||||
setIsFolderLoader(true);
|
||||
const getParentObjId = folderName[folderName.length - 1];
|
||||
@@ -545,411 +546,331 @@ function Opensigndrive() {
|
||||
}
|
||||
}
|
||||
return (
|
||||
<div style={{ backgroundColor: "white" }} className="folderComponent">
|
||||
<div className="bg-base-100 text-base-content rounded-xl w-full">
|
||||
<Title title={"OpenSign™ Drive"} drive={true} />
|
||||
|
||||
<div>
|
||||
<ModalUi
|
||||
headerColor={"#dc3545"}
|
||||
isOpen={isAlert.isShow}
|
||||
title={"Alert"}
|
||||
handleClose={() => {
|
||||
setIsAlert({
|
||||
isShow: false,
|
||||
alertMessage: ""
|
||||
});
|
||||
}}
|
||||
>
|
||||
<div style={{ height: "100%", padding: 20 }}>
|
||||
<p>{isAlert.alertMessage}</p>
|
||||
|
||||
<div
|
||||
style={{
|
||||
height: "1px",
|
||||
backgroundColor: "#9f9f9f",
|
||||
width: "100%",
|
||||
marginTop: "15px",
|
||||
marginBottom: "15px"
|
||||
}}
|
||||
></div>
|
||||
<button
|
||||
onClick={() =>
|
||||
setIsAlert({
|
||||
isShow: false,
|
||||
alertMessage: ""
|
||||
})
|
||||
}
|
||||
type="button"
|
||||
className="finishBtn cancelBtn"
|
||||
<ModalUi
|
||||
headerColor={"#dc3545"}
|
||||
isOpen={isAlert.isShow}
|
||||
title={"Alert"}
|
||||
handleClose={() => {
|
||||
setIsAlert({
|
||||
isShow: false,
|
||||
alertMessage: ""
|
||||
});
|
||||
}}
|
||||
>
|
||||
<div className="h-full p-[20px] pb-[15px]">
|
||||
<p>{isAlert.alertMessage}</p>
|
||||
<div className="h-[1px] bg-[#9f9f9f] w-full my-[15px]"></div>
|
||||
<button
|
||||
onClick={() =>
|
||||
setIsAlert({
|
||||
isShow: false,
|
||||
alertMessage: ""
|
||||
})
|
||||
}
|
||||
type="button"
|
||||
className="op-btn op-btn-neutral op-btn-sm"
|
||||
>
|
||||
Close
|
||||
</button>
|
||||
</div>
|
||||
</ModalUi>
|
||||
<ModalUi
|
||||
isOpen={isFolder}
|
||||
title={"Add New Folder"}
|
||||
handleClose={oncloseFolder}
|
||||
>
|
||||
<div className="h-full p-[20px] pt-[10px] pb-[15px]">
|
||||
{folderLoader ? (
|
||||
<div className="h-[200px] flex flex-col justify-center items-center">
|
||||
<img alt="loader" src={loader} className="w-[50px] h-[50px]" />
|
||||
<span className="text-[13px] text-[gray]">Loading...</span>
|
||||
</div>
|
||||
) : (
|
||||
<form
|
||||
onSubmit={handleAddFolder}
|
||||
className="flex flex-col text-base-content"
|
||||
>
|
||||
Close
|
||||
</button>
|
||||
</div>
|
||||
</ModalUi>
|
||||
<ModalUi
|
||||
isOpen={isFolder}
|
||||
title={"Add New Folder"}
|
||||
handleClose={oncloseFolder}
|
||||
>
|
||||
<div style={{ height: "100%", padding: 20 }}>
|
||||
{folderLoader ? (
|
||||
<label className="py-[8px] text-[15px] font-[400] mb-0">
|
||||
Name
|
||||
<span className="text-[red]">*</span>
|
||||
</label>
|
||||
<input
|
||||
required
|
||||
className="op-input op-input-bordered op-input-sm"
|
||||
type="text"
|
||||
value={newFolderName}
|
||||
onChange={(e) => handleFolderName(e)}
|
||||
/>
|
||||
<span className="text-[red] text-[12px] mt-[6px]">{error}</span>
|
||||
<div
|
||||
style={{
|
||||
height: "200px",
|
||||
display: "flex",
|
||||
flexDirection: "column",
|
||||
justifyContent: "center",
|
||||
alignItems: "center"
|
||||
height: "1px",
|
||||
backgroundColor: "#9f9f9f",
|
||||
width: "100%",
|
||||
marginTop: "15px",
|
||||
marginBottom: "15px"
|
||||
}}
|
||||
>
|
||||
<img
|
||||
alt="loader img"
|
||||
src={loader}
|
||||
style={{ width: "50px", height: "50px" }}
|
||||
/>
|
||||
<span style={{ fontSize: "13px", color: "gray" }}>
|
||||
Loading...
|
||||
</span>
|
||||
></div>
|
||||
<div style={{ display: "flex", flexDirection: "row" }}>
|
||||
<button
|
||||
style={{ background: themeColor }}
|
||||
type="submit"
|
||||
className="finishBtn"
|
||||
>
|
||||
Add
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="finishBtn cancelBtn"
|
||||
onClick={oncloseFolder}
|
||||
>
|
||||
Close
|
||||
</button>
|
||||
</div>
|
||||
) : (
|
||||
<form
|
||||
onSubmit={(e) => {
|
||||
e.preventDefault();
|
||||
handleAddFolder();
|
||||
}}
|
||||
style={{ display: "flex", flexDirection: "column" }}
|
||||
>
|
||||
<label
|
||||
style={{
|
||||
margin: "10px 0px 10px 0px",
|
||||
fontSize: "15px",
|
||||
fontWeight: "400"
|
||||
}}
|
||||
>
|
||||
Name
|
||||
<span style={{ color: "red" }}>*</span>
|
||||
</label>
|
||||
|
||||
<input
|
||||
required
|
||||
className="form-control inputStyle"
|
||||
type="text"
|
||||
value={newFolderName}
|
||||
onChange={(e) => handleFolderName(e)}
|
||||
// className="addFolderInput"
|
||||
/>
|
||||
<span
|
||||
style={{ color: "red", fontSize: "12px", marginTop: "6px" }}
|
||||
>
|
||||
{error}
|
||||
</span>
|
||||
<div
|
||||
style={{
|
||||
height: "1px",
|
||||
backgroundColor: "#9f9f9f",
|
||||
width: "100%",
|
||||
marginTop: "15px",
|
||||
marginBottom: "15px"
|
||||
}}
|
||||
></div>
|
||||
<div style={{ display: "flex", flexDirection: "row" }}>
|
||||
<button
|
||||
style={{ background: themeColor }}
|
||||
type="submit"
|
||||
className="finishBtn"
|
||||
>
|
||||
Add
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
className="finishBtn cancelBtn"
|
||||
onClick={oncloseFolder}
|
||||
>
|
||||
Close
|
||||
</button>
|
||||
</div>
|
||||
</form>
|
||||
</form>
|
||||
)}
|
||||
</div>
|
||||
</ModalUi>
|
||||
{isLoading.isLoad ? (
|
||||
<div className="flex flex-col justify-center items-center h-[100vh] w-full">
|
||||
<img alt="loader" src={loader} className="w-[80px] h-[80px]" />
|
||||
<span className="text-[13px] text-[gray]">{isLoading.message}</span>
|
||||
</div>
|
||||
) : handleError ? (
|
||||
<div className="flex justify-center items-center h-[100vh] w-full">
|
||||
<span className="text-[20px] text-[gray]">{handleError}</span>
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<div className="flex flex-row justify-between items-center px-[25px] pt-[20px]">
|
||||
{tourData && (
|
||||
<Tour
|
||||
onRequestClose={closeTour}
|
||||
steps={tourData}
|
||||
isOpen={isTour}
|
||||
closeWithMask={false}
|
||||
scrollOffset={-100}
|
||||
rounded={5}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</ModalUi>
|
||||
|
||||
{isLoading.isLoad ? (
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
height: "100vh",
|
||||
width: "100%",
|
||||
flexDirection: "column"
|
||||
}}
|
||||
>
|
||||
<img
|
||||
alt="loader img"
|
||||
src={loader}
|
||||
style={{ width: "80px", height: "80px" }}
|
||||
/>
|
||||
<span style={{ fontSize: "13px", color: "gray" }}>
|
||||
{isLoading.message}
|
||||
</span>
|
||||
</div>
|
||||
) : handleError ? (
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
height: "100vh",
|
||||
width: "100%"
|
||||
}}
|
||||
>
|
||||
<span style={{ fontSize: "20px", color: "gray" }}>
|
||||
{handleError}
|
||||
</span>
|
||||
</div>
|
||||
) : (
|
||||
<>
|
||||
<div className="folderContainer">
|
||||
{tourData && (
|
||||
<Tour
|
||||
onRequestClose={closeTour}
|
||||
steps={tourData}
|
||||
isOpen={isTour}
|
||||
closeWithMask={false}
|
||||
scrollOffset={-100}
|
||||
rounded={5}
|
||||
/>
|
||||
)}
|
||||
|
||||
<div
|
||||
data-tut="reactourFirst"
|
||||
onMouseEnter={(e) => handleMouseEnter(e)}
|
||||
ref={scrollRef}
|
||||
className="w-full whitespace-nowrap cursor-pointer select-none overflow-x-auto"
|
||||
>
|
||||
{handleFolderTab(folderName)}
|
||||
</div>
|
||||
<div className="dropMenuBD">
|
||||
<div
|
||||
data-tut="reactourFirst"
|
||||
onMouseEnter={(e) => handleMouseEnter(e)}
|
||||
ref={scrollRef}
|
||||
style={{
|
||||
width: "100%"
|
||||
}}
|
||||
className="folderPath"
|
||||
id="folder-menu"
|
||||
className={
|
||||
isNewFol ? "dropdown show dropDownStyle" : "dropdown"
|
||||
}
|
||||
onClick={() => setIsNewFol(!isNewFol)}
|
||||
>
|
||||
{handleFolderTab(folderName)}
|
||||
</div>
|
||||
<div className="dropMenuBD">
|
||||
<div
|
||||
id="folder-menu"
|
||||
className={
|
||||
isNewFol ? "dropdown show dropDownStyle" : "dropdown"
|
||||
}
|
||||
onClick={() => setIsNewFol(!isNewFol)}
|
||||
>
|
||||
<div className="sort" data-tut="reactourSecond">
|
||||
<i
|
||||
className="fa fa-plus-square"
|
||||
aria-hidden="true"
|
||||
style={{ fontSize: "25px", color: `${iconColor}` }}
|
||||
></i>
|
||||
</div>
|
||||
<div
|
||||
className={
|
||||
isNewFol ? "dropdown-menu show" : "dropdown-menu"
|
||||
}
|
||||
aria-labelledby="dropdownMenuButton"
|
||||
aria-expanded={isNewFol ? "true" : "false"}
|
||||
>
|
||||
{" "}
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
flexDirection: "column"
|
||||
}}
|
||||
>
|
||||
<span
|
||||
className="dropdown-item itemColor"
|
||||
onClick={() => setIsFolder(true)}
|
||||
>
|
||||
<i
|
||||
style={{ marginRight: "5px" }}
|
||||
className="fa fa-plus"
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
Create folder
|
||||
</span>
|
||||
<span
|
||||
className="dropdown-item itemColor"
|
||||
onClick={() => navigate("/form/sHAnZphf69")}
|
||||
>
|
||||
<i
|
||||
style={{ marginRight: "5px" }}
|
||||
className="fas fa-pen-nib"
|
||||
></i>
|
||||
Sign Yourself
|
||||
</span>
|
||||
<span
|
||||
className="dropdown-item itemColor"
|
||||
onClick={() => navigate("/form/8mZzFxbG1z")}
|
||||
>
|
||||
{" "}
|
||||
<i
|
||||
style={{ marginRight: "5px" }}
|
||||
className="fa fa-file-signature"
|
||||
></i>
|
||||
Request Signatures{" "}
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div className="sort" data-tut="reactourSecond">
|
||||
<i
|
||||
className="fa fa-plus-square"
|
||||
aria-hidden="true"
|
||||
style={{ fontSize: "25px", color: `${iconColor}` }}
|
||||
></i>
|
||||
</div>
|
||||
<div
|
||||
id="menu-container"
|
||||
className={isShowSort ? "dropdown show" : "dropdown"}
|
||||
onClick={() => setIsShowSort(!isShowSort)}
|
||||
className={isNewFol ? "dropdown-menu show" : "dropdown-menu"}
|
||||
aria-labelledby="dropdownMenuButton"
|
||||
aria-expanded={isNewFol ? "true" : "false"}
|
||||
>
|
||||
<div
|
||||
data-tut="reactourThird"
|
||||
className=" sort "
|
||||
data-toggle="dropdown"
|
||||
>
|
||||
<i
|
||||
className="fa fa-sort-amount-asc"
|
||||
aria-hidden="true"
|
||||
style={{
|
||||
marginRight: "5px",
|
||||
fontSize: "14px",
|
||||
color: `${iconColor}`
|
||||
}}
|
||||
></i>
|
||||
<div className="flex flex-col">
|
||||
<span
|
||||
style={{
|
||||
fontSize: "15px",
|
||||
color: `${iconColor}`
|
||||
}}
|
||||
className="dropdown-item itemColor"
|
||||
onClick={() => setIsFolder(true)}
|
||||
>
|
||||
{selectedSort}
|
||||
<i
|
||||
style={{ marginRight: "5px" }}
|
||||
className="fa fa-plus"
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
Create folder
|
||||
</span>
|
||||
<span
|
||||
className="dropdown-item itemColor"
|
||||
onClick={() => navigate("/form/sHAnZphf69")}
|
||||
>
|
||||
<i
|
||||
style={{ marginRight: "5px" }}
|
||||
className="fas fa-pen-nib"
|
||||
></i>
|
||||
Sign Yourself
|
||||
</span>
|
||||
<span
|
||||
className="dropdown-item itemColor"
|
||||
onClick={() => navigate("/form/8mZzFxbG1z")}
|
||||
>
|
||||
<i
|
||||
style={{ marginRight: "5px" }}
|
||||
className="fa fa-file-signature"
|
||||
></i>
|
||||
Request Signatures{" "}
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
className={
|
||||
isShowSort ? "dropdown-menu show" : "dropdown-menu"
|
||||
}
|
||||
aria-labelledby="dropdownMenuButton"
|
||||
aria-expanded={isShowSort ? "true" : "false"}
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
id="menu-container"
|
||||
className={isShowSort ? "dropdown show" : "dropdown"}
|
||||
onClick={() => setIsShowSort(!isShowSort)}
|
||||
>
|
||||
<div
|
||||
data-tut="reactourThird"
|
||||
className=" sort "
|
||||
data-toggle="dropdown"
|
||||
>
|
||||
<i
|
||||
className="fa fa-sort-amount-asc"
|
||||
aria-hidden="true"
|
||||
style={{
|
||||
marginRight: "5px",
|
||||
fontSize: "14px",
|
||||
color: `${iconColor}`
|
||||
}}
|
||||
></i>
|
||||
<span
|
||||
style={{
|
||||
fontSize: "15px",
|
||||
color: `${iconColor}`
|
||||
}}
|
||||
>
|
||||
{sortingValue.map((value, ind) => {
|
||||
return (
|
||||
<span
|
||||
key={ind}
|
||||
onClick={() => {
|
||||
setSelectedSort(value);
|
||||
sortingData(value, null, pdfData);
|
||||
}}
|
||||
className="dropdown-item itemColor"
|
||||
style={{
|
||||
paddingLeft: selectedSort !== value && "33px"
|
||||
}}
|
||||
>
|
||||
{selectedSort === value && (
|
||||
<i
|
||||
className="fa fa-check"
|
||||
aria-hidden="true"
|
||||
style={{ marginRight: "5px" }}
|
||||
></i>
|
||||
)}
|
||||
{value}
|
||||
</span>
|
||||
);
|
||||
})}
|
||||
|
||||
<hr className="hrStyle" />
|
||||
{sortOrder.map((order, ind) => {
|
||||
return (
|
||||
<span
|
||||
key={ind}
|
||||
onClick={() => {
|
||||
setSortingOrder(order);
|
||||
sortingData(null, order, pdfData);
|
||||
}}
|
||||
className="dropdown-item itemColor"
|
||||
style={{
|
||||
paddingLeft: sortingOrder !== order && "33px"
|
||||
}}
|
||||
>
|
||||
{sortingOrder === order && (
|
||||
<i
|
||||
className="fa fa-check"
|
||||
aria-hidden="true"
|
||||
style={{ marginRight: "5px" }}
|
||||
></i>
|
||||
)}
|
||||
{order}
|
||||
</span>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
{selectedSort}
|
||||
</span>
|
||||
</div>
|
||||
<div
|
||||
className={
|
||||
isShowSort ? "dropdown-menu show" : "dropdown-menu"
|
||||
}
|
||||
aria-labelledby="dropdownMenuButton"
|
||||
aria-expanded={isShowSort ? "true" : "false"}
|
||||
>
|
||||
{sortingValue.map((value, ind) => {
|
||||
return (
|
||||
<span
|
||||
key={ind}
|
||||
onClick={() => {
|
||||
setSelectedSort(value);
|
||||
sortingData(value, null, pdfData);
|
||||
}}
|
||||
className="dropdown-item itemColor"
|
||||
style={{
|
||||
paddingLeft: selectedSort !== value && "33px"
|
||||
}}
|
||||
>
|
||||
{selectedSort === value && (
|
||||
<i
|
||||
className="fa fa-check"
|
||||
aria-hidden="true"
|
||||
style={{ marginRight: "5px" }}
|
||||
></i>
|
||||
)}
|
||||
{value}
|
||||
</span>
|
||||
);
|
||||
})}
|
||||
|
||||
<div>
|
||||
{isList ? (
|
||||
<div className="sort" onClick={() => setIsList(!isList)}>
|
||||
<i
|
||||
onClick={() => setIsList(!isList)}
|
||||
className="fa fa-th-large"
|
||||
style={{ fontSize: "24px", color: `${iconColor}` }}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
</div>
|
||||
) : (
|
||||
<div
|
||||
data-tut="reactourForth"
|
||||
className="sort"
|
||||
<hr className="hrStyle" />
|
||||
{sortOrder.map((order, ind) => {
|
||||
return (
|
||||
<span
|
||||
key={ind}
|
||||
onClick={() => {
|
||||
setSortingOrder(order);
|
||||
sortingData(null, order, pdfData);
|
||||
}}
|
||||
className="dropdown-item itemColor"
|
||||
style={{
|
||||
paddingLeft: sortingOrder !== order && "33px"
|
||||
}}
|
||||
>
|
||||
{sortingOrder === order && (
|
||||
<i
|
||||
className="fa fa-check"
|
||||
aria-hidden="true"
|
||||
style={{ marginRight: "5px" }}
|
||||
></i>
|
||||
)}
|
||||
{order}
|
||||
</span>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
{isList ? (
|
||||
<div className="sort" onClick={() => setIsList(!isList)}>
|
||||
<i
|
||||
onClick={() => setIsList(!isList)}
|
||||
>
|
||||
<i
|
||||
className="fa fa-list"
|
||||
aria-hidden="true"
|
||||
style={{ fontSize: "23px", color: `${iconColor}` }}
|
||||
></i>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
className="fa fa-th-large"
|
||||
style={{ fontSize: "24px", color: `${iconColor}` }}
|
||||
aria-hidden="true"
|
||||
></i>
|
||||
</div>
|
||||
) : (
|
||||
<div
|
||||
data-tut="reactourForth"
|
||||
className="sort"
|
||||
onClick={() => setIsList(!isList)}
|
||||
>
|
||||
<i
|
||||
className="fa fa-list"
|
||||
aria-hidden="true"
|
||||
style={{ fontSize: "23px", color: `${iconColor}` }}
|
||||
></i>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{pdfData && pdfData.length === 0 ? (
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
height: "50vh",
|
||||
width: "100%"
|
||||
}}
|
||||
>
|
||||
<span style={{ fontWeight: "bold" }}>No Data Found!</span>
|
||||
</div>
|
||||
) : (
|
||||
<div data-tut="reactourFifth">
|
||||
<React.Suspense fallback={<Loader />}>
|
||||
<DriveBody
|
||||
dataTutSixth="reactourSixth"
|
||||
dataTutSeventh="reactourSeventh"
|
||||
pdfData={pdfData}
|
||||
setFolderName={setFolderName}
|
||||
setIsLoading={setIsLoading}
|
||||
setDocId={setDocId}
|
||||
getPdfDocumentList={getPdfDocumentList}
|
||||
isDocId={docId}
|
||||
setPdfData={setPdfData}
|
||||
isList={isList}
|
||||
setIsAlert={setIsAlert}
|
||||
setSkip={setSkip}
|
||||
sortingData={sortingData}
|
||||
/>
|
||||
{loading && (
|
||||
<div style={{ textAlign: "center" }}>Loading...</div>
|
||||
)}
|
||||
</React.Suspense>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
{pdfData && pdfData.length === 0 ? (
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
justifyContent: "center",
|
||||
alignItems: "center",
|
||||
height: "50vh",
|
||||
width: "100%"
|
||||
}}
|
||||
>
|
||||
<span style={{ fontWeight: "bold" }}>No Data Found!</span>
|
||||
</div>
|
||||
) : (
|
||||
<div data-tut="reactourFifth">
|
||||
<React.Suspense fallback={<Loader />}>
|
||||
<DriveBody
|
||||
dataTutSixth="reactourSixth"
|
||||
dataTutSeventh="reactourSeventh"
|
||||
pdfData={pdfData}
|
||||
setFolderName={setFolderName}
|
||||
setIsLoading={setIsLoading}
|
||||
setDocId={setDocId}
|
||||
getPdfDocumentList={getPdfDocumentList}
|
||||
isDocId={docId}
|
||||
setPdfData={setPdfData}
|
||||
isList={isList}
|
||||
setIsAlert={setIsAlert}
|
||||
setSkip={setSkip}
|
||||
sortingData={sortingData}
|
||||
/>
|
||||
{loading && (
|
||||
<div className="text-center pb-[20px]">Loading...</div>
|
||||
)}
|
||||
</React.Suspense>
|
||||
</div>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -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>
|
||||
) : (
|
||||
<>
|
||||
|
||||
@@ -3,11 +3,7 @@ import { useLocation, useNavigate } from "react-router-dom";
|
||||
import Parse from "parse";
|
||||
import axios from "axios";
|
||||
import { appInfo } from "../constant/appinfo";
|
||||
import {
|
||||
isEnableSubscription,
|
||||
modalCancelBtnColor,
|
||||
modalSubmitBtnColor
|
||||
} from "../constant/const";
|
||||
import { isEnableSubscription } from "../constant/const";
|
||||
import { fetchSubscription } from "../constant/Utils";
|
||||
import { useDispatch } from "react-redux";
|
||||
import { showTenant } from "../redux/reducers/ShowTenant";
|
||||
@@ -294,33 +290,26 @@ const SSOVerify = () => {
|
||||
{message === "Verifying SSO..." && (
|
||||
<img alt="loader" src={loader} className="w-[80px] h-[80px]" />
|
||||
)}
|
||||
<div className="text-[gray]">{message}</div>
|
||||
<div className="text-base-content">{message}</div>
|
||||
</div>
|
||||
<ModalUi isOpen={isModal} title="Additional Info" showClose={false}>
|
||||
<div className="relative">
|
||||
{isLoader && (
|
||||
<div className="absolute w-full h-full bg-black bg-opacity-25 flex justify-center items-center">
|
||||
<div
|
||||
style={{
|
||||
fontSize: "45px",
|
||||
color: "#3dd3e0"
|
||||
}}
|
||||
className="loader-37"
|
||||
></div>
|
||||
<div className="absolute w-full h-full bg-black bg-opacity-25 flex justify-center items-center text-[45px] text-[#3dd3e0]">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
)}
|
||||
<form className="px-4 py-3" onSubmit={handleSubmitbtn}>
|
||||
<form
|
||||
className="px-4 py-3 text-base-content"
|
||||
onSubmit={handleSubmitbtn}
|
||||
>
|
||||
<div className="mb-3">
|
||||
<label
|
||||
htmlFor="Company"
|
||||
style={{ display: "flex" }}
|
||||
className="block text-xs text-gray-700 font-semibold"
|
||||
>
|
||||
Phone <span style={{ fontSize: 13, color: "red" }}>*</span>
|
||||
<label htmlFor="Company" className="block text-xs font-semibold">
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
id="Phone"
|
||||
value={userDetails.phone}
|
||||
onChange={(e) =>
|
||||
@@ -337,16 +326,12 @@ const SSOVerify = () => {
|
||||
</p>
|
||||
</div>
|
||||
<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>
|
||||
<label htmlFor="Company" className="block text-xs font-semibold">
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
id="Company"
|
||||
value={userDetails.Company}
|
||||
onChange={(e) =>
|
||||
@@ -360,17 +345,13 @@ const SSOVerify = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="mb-3">
|
||||
<label
|
||||
htmlFor="JobTitle"
|
||||
style={{ display: "flex" }}
|
||||
className="block text-xs text-gray-700 font-semibold"
|
||||
>
|
||||
<label htmlFor="JobTitle" className="block text-xs font-semibold">
|
||||
Job Title
|
||||
<span style={{ fontSize: 13, color: "red" }}>*</span>
|
||||
<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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
id="JobTitle"
|
||||
value={userDetails.Destination}
|
||||
onChange={(e) =>
|
||||
@@ -384,21 +365,13 @@ const SSOVerify = () => {
|
||||
/>
|
||||
</div>
|
||||
<div className="mt-4">
|
||||
<button
|
||||
type="submit"
|
||||
className="px-3 py-1.5 text-white rounded shadow-md text-center focus:outline-none "
|
||||
style={{
|
||||
marginRight: 10,
|
||||
backgroundColor: modalSubmitBtnColor
|
||||
}}
|
||||
>
|
||||
<button type="submit" className="op-btn op-btn-primary">
|
||||
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-ghost ml-2"
|
||||
onClick={handleCloseModal}
|
||||
style={{ width: 75, backgroundColor: modalCancelBtnColor }}
|
||||
>
|
||||
Cancel
|
||||
</button>
|
||||
|
||||
@@ -501,47 +501,26 @@ const Signup = () => {
|
||||
setSpecialCharValid(/[!@#$%^&*()\-_=+{};:,<.>]/.test(newPassword));
|
||||
};
|
||||
return (
|
||||
<div className="bg-white">
|
||||
<div className="">
|
||||
{state.loading && (
|
||||
<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] flex justify-center items-center z-20 bg-black bg-opacity-25 text-[#3ac9d6] text-[50px]">
|
||||
<div className="loader-37 "></div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<Title title={"Signup page"} />
|
||||
|
||||
{appInfo && appInfo.applogo ? (
|
||||
<div>
|
||||
<div className="md:m-10 lg:m-16 md:p-4 lg:p-10 p-5 bg-[#ffffff] md:border-[1px] md:border-gray-400 ">
|
||||
<div className="md:p-10 lg:p-16">
|
||||
<div className="md:p-4 lg:p-10 p-4 bg-base-100 text-base-content op-card">
|
||||
<div className="w-[250px] h-[66px] inline-block overflow-hidden">
|
||||
{image && (
|
||||
<img src={image} className="object-contain h-full" alt="logo" />
|
||||
)}
|
||||
</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">Create Account !</h2>
|
||||
<div className="outline outline-1 outline-slate-300/50 shadow-md rounded my-4">
|
||||
<div className="w-full my-4 op-card bg-base-100 shadow-md outline outline-1 outline-slate-300/50">
|
||||
<div className="px-6 py-4 text-xs">
|
||||
<label className="block ">
|
||||
Name{" "}
|
||||
@@ -549,7 +528,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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
value={name}
|
||||
onChange={(e) => setName(e.target.value)}
|
||||
required
|
||||
@@ -561,8 +540,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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
value={email}
|
||||
onChange={(e) =>
|
||||
setEmail(e.target.value?.toLowerCase())
|
||||
@@ -576,7 +555,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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
value={phone}
|
||||
onChange={(e) => setPhone(e.target.value)}
|
||||
required
|
||||
@@ -588,7 +567,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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
value={company}
|
||||
onChange={(e) => setCompany(e.target.value)}
|
||||
required
|
||||
@@ -600,7 +579,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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
value={jobTitle}
|
||||
onChange={(e) => setJobTitle(e.target.value)}
|
||||
required
|
||||
@@ -613,16 +592,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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
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 ? (
|
||||
@@ -690,18 +667,17 @@ const Signup = () => {
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="flex flex-col md:flex-row justify-between items-stretch gap-8 text-center text-xs font-bold mt-2">
|
||||
<div className="grid grid-cols-1 md:grid-cols-2 gap-2 text-center text-xs font-bold mt-2">
|
||||
<button
|
||||
type="submit"
|
||||
className="rounded-sm bg-[#3ac9d6] text-white w-full py-3 shadow uppercase"
|
||||
className="op-btn op-btn-primary"
|
||||
disabled={state.loading}
|
||||
>
|
||||
{state.loading ? "Loading..." : "Register"}
|
||||
</button>
|
||||
<NavLink
|
||||
className="rounded-sm cursor-pointer bg-white border-[1px] border-[#15b4e9] text-[#15b4e9] w-full py-3 shadow uppercase"
|
||||
className={`op-btn op-btn-secondary hover:no-underline hover:text-base-content`}
|
||||
to={location.search ? "/" + location.search : "/"}
|
||||
style={width < 768 ? { textAlign: "center" } : {}}
|
||||
>
|
||||
Login
|
||||
</NavLink>
|
||||
|
||||
@@ -296,37 +296,25 @@ function UserProfile() {
|
||||
// setPublicUserName(extendUser && extendUser?.[0]?.UserName);
|
||||
setCompany(extendUser && extendUser?.[0]?.Company);
|
||||
setJobTitle(extendUser?.[0]?.JobTitle);
|
||||
setIsDisableDocId(extendUser?.[0]?.HeaderDocId);
|
||||
};
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Title title={"Profile"} />
|
||||
{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>
|
||||
) : (
|
||||
<div className="flex justify-center items-center w-full relative">
|
||||
{/* {userNameError && (
|
||||
<div
|
||||
className={`z-[1000] fixed top-[50%] transform border-[1px] text-sm border-[#f0a8a8] bg-[#f4bebe] text-[#c42121] rounded py-[.75rem] px-[1.25rem]`}
|
||||
className={`z-[1000] fixed top-[50%] transform border-[1px] text-sm border-[#f0a8a8] bg-[#f4bebe] text-[#c42121] rounded py-[.75rem] px-[1.25rem]`}
|
||||
>
|
||||
{userNameError}
|
||||
</div>
|
||||
)} */}
|
||||
<div className="bg-white flex flex-col justify-center shadow rounded w-[450px]">
|
||||
<div className="bg-base-100 text-base-content flex flex-col justify-center shadow rounded-xl w-[450px]">
|
||||
<div className="flex flex-col justify-center items-center my-4">
|
||||
<div className="w-[200px] h-[200px] overflow-hidden rounded-full">
|
||||
<img
|
||||
@@ -338,7 +326,7 @@ function UserProfile() {
|
||||
{editmode && (
|
||||
<input
|
||||
type="file"
|
||||
className="max-w-[270px] text-sm py-1 px-2 mt-4 border-[1px] border-[#15b4e9] text-black rounded"
|
||||
className="op-file-input op-file-input-bordered op-file-input-sm max-w-[270px] mt-4 text-sm"
|
||||
accept="image/png, image/gif, image/jpeg"
|
||||
onChange={(e) => {
|
||||
let files = e.target.files;
|
||||
@@ -364,7 +352,7 @@ function UserProfile() {
|
||||
<ul className="w-full flex flex-col p-2 text-sm">
|
||||
<li
|
||||
className={`flex justify-between items-center border-t-[1px] border-gray-300 break-all ${
|
||||
editmode ? "py-1" : "py-2"
|
||||
editmode ? "py-1.5" : "py-2"
|
||||
}`}
|
||||
>
|
||||
<span className="font-semibold">Name:</span>{" "}
|
||||
@@ -372,7 +360,7 @@ function UserProfile() {
|
||||
<input
|
||||
type="text"
|
||||
value={name}
|
||||
className="py-1 px-2 text-sm border-[1px] border-[#15b4e9] text-black rounded"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content text-sm"
|
||||
onChange={(e) => SetName(e.target.value)}
|
||||
/>
|
||||
) : (
|
||||
@@ -381,14 +369,14 @@ function UserProfile() {
|
||||
</li>
|
||||
<li
|
||||
className={`flex justify-between items-center border-t-[1px] border-gray-300 break-all ${
|
||||
editmode ? "py-1" : "py-2"
|
||||
editmode ? "py-1.5" : "py-2"
|
||||
}`}
|
||||
>
|
||||
<span className="font-semibold">Phone:</span>{" "}
|
||||
{editmode ? (
|
||||
<input
|
||||
type="text"
|
||||
className="py-1 px-2 text-sm border-[1px] border-[#15b4e9] text-black rounded"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content text-sm"
|
||||
onChange={(e) => SetPhone(e.target.value)}
|
||||
value={Phone}
|
||||
/>
|
||||
@@ -402,7 +390,7 @@ function UserProfile() {
|
||||
</li>
|
||||
<li
|
||||
className={`flex justify-between items-center border-t-[1px] border-gray-300 break-all ${
|
||||
editmode ? "py-1" : "py-2"
|
||||
editmode ? "py-1.5" : "py-2"
|
||||
}`}
|
||||
>
|
||||
<span className="font-semibold">Company:</span>{" "}
|
||||
@@ -410,7 +398,7 @@ function UserProfile() {
|
||||
<input
|
||||
type="text"
|
||||
value={company}
|
||||
className="py-1 px-2 text-sm border-[1px] border-[#15b4e9] text-black rounded"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content text-sm"
|
||||
onChange={(e) => setCompany(e.target.value)}
|
||||
/>
|
||||
) : (
|
||||
@@ -419,7 +407,7 @@ function UserProfile() {
|
||||
</li>
|
||||
<li
|
||||
className={`flex justify-between items-center border-t-[1px] border-gray-300 break-all ${
|
||||
editmode ? "py-1" : "py-2"
|
||||
editmode ? "py-1.5" : "py-2"
|
||||
}`}
|
||||
>
|
||||
<span className="font-semibold">Job title:</span>{" "}
|
||||
@@ -427,7 +415,7 @@ function UserProfile() {
|
||||
<input
|
||||
type="text"
|
||||
value={jobTitle}
|
||||
className="py-1 px-2 text-sm border-[1px] border-[#15b4e9] text-black rounded"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content text-sm"
|
||||
onChange={(e) => setJobTitle(e.target.value)}
|
||||
/>
|
||||
) : (
|
||||
@@ -463,7 +451,7 @@ function UserProfile() {
|
||||
all your publicly set templates.`}
|
||||
/>
|
||||
</span>
|
||||
<div className="flex items-center">
|
||||
<div className="flex text-xs items-center">
|
||||
<span>opensign-me.vercel.app/</span>
|
||||
{editmode ? (
|
||||
<input
|
||||
@@ -471,14 +459,14 @@ function UserProfile() {
|
||||
value={publicUserName}
|
||||
disabled={!editmode}
|
||||
placeholder="enter user name"
|
||||
className="border-[1px] border-gray-200 rounded-[3px]"
|
||||
className="op-input op-input-bordered focus:outline-none hover:border-base-content op-input-xs"
|
||||
/>
|
||||
) : (
|
||||
<input
|
||||
value={extendUser?.[0]?.UserName}
|
||||
disabled
|
||||
placeholder="enter user name"
|
||||
className="border-[1px] border-gray-200 rounded-[3px]"
|
||||
className="op-input op-input-bordered op-input-xs"
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
@@ -498,27 +486,23 @@ function UserProfile() {
|
||||
url={
|
||||
"https://docs.opensignlabs.com/docs/help/Settings/disabledocumentid"
|
||||
}
|
||||
/>{" "}
|
||||
/>
|
||||
{!isSubscribe && isEnableSubscription && <Upgrade />}
|
||||
</span>{" "}
|
||||
</span>
|
||||
<label
|
||||
className={
|
||||
className={`${
|
||||
isSubscribe || !isEnableSubscription
|
||||
? `${
|
||||
editmode ? "cursor-pointer" : ""
|
||||
} relative inline-flex items-center mb-0`
|
||||
: "relative inline-flex items-center mb-0 pointer-events-none opacity-50"
|
||||
}
|
||||
? `${editmode ? "cursor-pointer" : ""}`
|
||||
: "pointer-events-none opacity-50"
|
||||
} relative block items-center mb-0`}
|
||||
>
|
||||
<input
|
||||
disabled={editmode ? false : true}
|
||||
type="checkbox"
|
||||
className="op-toggle transition-all checked:[--tglbg:#3368ff] checked:bg-white"
|
||||
checked={isDisableDocId}
|
||||
onChange={handleDisableDocId}
|
||||
type="checkbox"
|
||||
value=""
|
||||
className="sr-only peer"
|
||||
/>
|
||||
<div className="w-9 h-5 bg-gray-200 peer-focus:outline-none peer-focus:ring-1 peer-focus:ring-black rounded-full peer dark:bg-gray-700 peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all dark:border-black peer-checked:bg-blue-600"></div>
|
||||
</label>
|
||||
</div>
|
||||
{!isEnableSubscription && (
|
||||
@@ -530,44 +514,29 @@ function UserProfile() {
|
||||
)}
|
||||
</li>
|
||||
</ul>
|
||||
<div className="flex justify-center pt-2 pb-3 md:pt-3 md:pb-4">
|
||||
{editmode ? (
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleSubmit}
|
||||
className="rounded shadow focus:outline-none border-[2px] border-[#15b4e9] bg-white text-[#15b4e9] px-4 py-2 mr-4"
|
||||
>
|
||||
Save
|
||||
</button>
|
||||
) : (
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
setEditMode(true);
|
||||
}}
|
||||
className="rounded shadow focus:outline-none text-white bg-[#e7505a] px-4 py-2 mr-4"
|
||||
>
|
||||
Edit
|
||||
</button>
|
||||
)}
|
||||
<div className="flex justify-center gap-2 pt-2 pb-3 md:pt-3 md:pb-4">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => {
|
||||
if (editmode) {
|
||||
handleCancel();
|
||||
} else {
|
||||
navigate("/changepassword");
|
||||
}
|
||||
}}
|
||||
className={`rounded shadow focus:outline-none text-white bg-[#3598dc] ${
|
||||
editmode ? "px-4 py-2 " : "p-2"
|
||||
onClick={(e) =>
|
||||
editmode ? handleSubmit(e) : setEditMode(true)
|
||||
}
|
||||
className="op-btn op-btn-primary"
|
||||
>
|
||||
{editmode ? "Save" : "Edit"}
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() =>
|
||||
editmode ? handleCancel() : navigate("/changepassword")
|
||||
}
|
||||
className={`op-btn ${
|
||||
editmode ? "op-btn-ghost" : "op-btn-secondary"
|
||||
}`}
|
||||
>
|
||||
{editmode ? "Cancel" : "Change Password"}
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{isVerifyModal && (
|
||||
<ModalUi
|
||||
isOpen
|
||||
@@ -575,21 +544,8 @@ function UserProfile() {
|
||||
handleClose={handleCloseVerifyModal}
|
||||
>
|
||||
{otpLoader ? (
|
||||
<div
|
||||
style={{
|
||||
height: "150px",
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
justifyContent: "center"
|
||||
}}
|
||||
>
|
||||
<div
|
||||
style={{
|
||||
fontSize: "45px",
|
||||
color: "#3dd3e0"
|
||||
}}
|
||||
className="loader-37"
|
||||
></div>
|
||||
<div className="h-[150px] flex justify-center items-center text-[45px] text-[#3dd3e0]">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
) : (
|
||||
<form onSubmit={(e) => handleVerifyEmail(e)}>
|
||||
|
||||
@@ -4,7 +4,7 @@ import axios from "axios";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import Alert from "../primitives/Alert";
|
||||
import ModalUi from "../primitives/ModalUi";
|
||||
import { isEnableSubscription, rejectBtn, submitBtn } from "../constant/const";
|
||||
import { isEnableSubscription } from "../constant/const";
|
||||
import { checkIsSubscribed, openInNewTab } from "../constant/Utils";
|
||||
import Parse from "parse";
|
||||
import PremiumAlertHeader from "../primitives/PremiumAlertHeader";
|
||||
@@ -97,28 +97,15 @@ function Webhook() {
|
||||
return (
|
||||
<React.Fragment>
|
||||
<Title title={"Webhook"} />
|
||||
{isGenerate && <Alert type="success">Webhook added successfully!</Alert>}
|
||||
{isErr && <Alert type="danger">Something went wrong!</Alert>}
|
||||
{isGenerate && <Alert type="success">Webhook added successfully.</Alert>}
|
||||
{isErr && <Alert type="danger">Something went wrong.</Alert>}
|
||||
|
||||
{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>
|
||||
) : (
|
||||
<div className="bg-white flex flex-col justify-center shadow rounded">
|
||||
<div className="bg-base-100 text-base-content flex flex-col justify-center shadow rounded">
|
||||
{!isEnableSubscription && <PremiumAlertHeader />}
|
||||
<h1 className={"ml-4 mt-3 mb-2 font-semibold"}>
|
||||
OpenSign™ Webhook{" "}
|
||||
@@ -146,14 +133,14 @@ function Webhook() {
|
||||
<button
|
||||
type="button"
|
||||
onClick={handleModal}
|
||||
className="rounded hover:bg-[#15b4e9] border-[1px] border-[#15b4e9] text-[#15b4e9] hover:text-white px-4 py-2 text-xs md:text-base focus:outline-none"
|
||||
className="op-btn op-btn-primary "
|
||||
>
|
||||
{webhook ? "Update Webhook" : "Add Webhook"}
|
||||
</button>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
<div className="flex items-center justify-center ">
|
||||
<div className="flex items-center justify-center ">
|
||||
<button
|
||||
type="button"
|
||||
onClick={() =>
|
||||
@@ -161,7 +148,7 @@ function Webhook() {
|
||||
"https://docs.opensignlabs.com/docs/API-docs/save-update-webhook"
|
||||
)
|
||||
}
|
||||
className="rounded hover:bg-[#15b4e9] border-[1px] my-2 border-[#15b4e9] text-[#15b4e9] hover:text-white px-11 py-2 text-xs md:text-base focus:outline-none"
|
||||
className="op-btn op-btn-primary my-2"
|
||||
>
|
||||
View Docs
|
||||
</button>
|
||||
@@ -203,24 +190,27 @@ function Webhook() {
|
||||
>
|
||||
{error && <Alert type="danger">{error}</Alert>}
|
||||
<div className="m-[20px]">
|
||||
<div className="text-lg font-normal text-black">
|
||||
<div className="text-lg font-normal text-base-content">
|
||||
<label className="text-sm ml-2">Webhook</label>
|
||||
<input
|
||||
value={webhook}
|
||||
onChange={(e) => setWebhook(e.target.value)}
|
||||
placeholder="Enter webhook url"
|
||||
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 focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
</div>
|
||||
<hr className="bg-[#ccc] mt-4 " />
|
||||
<div className="flex items-center mt-3 gap-2 text-white">
|
||||
<hr className="bg-[#ccc] mt-3" />
|
||||
<div className="flex items-center mt-3 gap-2">
|
||||
<button
|
||||
onClick={handleSubmit}
|
||||
className={submitBtn + "ml-[2px]"}
|
||||
className="op-btn op-btn-primary ml-[2px]"
|
||||
>
|
||||
Yes
|
||||
</button>
|
||||
<button onClick={handleModal} className={rejectBtn}>
|
||||
<button
|
||||
onClick={handleModal}
|
||||
className="op-btn op-btn-secondary"
|
||||
>
|
||||
No
|
||||
</button>
|
||||
</div>
|
||||
|
||||
@@ -195,23 +195,16 @@ const AddContact = (props) => {
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="addusercontainer">
|
||||
<div className="h-full px-[20px] py-[10px]">
|
||||
{isLoader && (
|
||||
<div className="loaderdiv">
|
||||
<div
|
||||
style={{
|
||||
fontSize: "45px",
|
||||
color: "#3dd3e0"
|
||||
}}
|
||||
className="loader-37"
|
||||
></div>
|
||||
<div className="fixed top-0 left-0 right-0 bottom-0 flex justify-center items-center bg-black bg-opacity-30 text-[45px] text-[#3dd3e0]">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
)}
|
||||
<div className="form-wrapper">
|
||||
<div style={{ fontSize: 14, fontWeight: "700" }}>Add User</div>
|
||||
|
||||
<div className="w-full mx-auto p-[8px]">
|
||||
<div className="text-[14px] font-[700]">Add User</div>
|
||||
{isUserExist && (
|
||||
<div className="form-section">
|
||||
<div className="mb-[0.75rem]">
|
||||
<input
|
||||
type="checkbox"
|
||||
id="addYourself"
|
||||
@@ -224,11 +217,11 @@ const AddContact = (props) => {
|
||||
</label>
|
||||
</div>
|
||||
)}
|
||||
<form onSubmit={handleSubmit}>
|
||||
<div className="form-section">
|
||||
<label htmlFor="name" style={{ fontSize: 13 }}>
|
||||
<form className="text-base-content" onSubmit={handleSubmit}>
|
||||
<div className="mb-[0.75rem]">
|
||||
<label htmlFor="name" className="text-[13px]">
|
||||
Name
|
||||
<span style={{ color: "red", fontSize: 13 }}> *</span>
|
||||
<span className="text-[13px] text-[red]"> *</span>
|
||||
</label>
|
||||
<input
|
||||
type="text"
|
||||
@@ -237,13 +230,13 @@ const AddContact = (props) => {
|
||||
onChange={(e) => setName(e.target.value)}
|
||||
required
|
||||
disabled={addYourself}
|
||||
className="addUserInput"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
</div>
|
||||
<div className="form-section">
|
||||
<label htmlFor="email" style={{ fontSize: 13 }}>
|
||||
<div className="mb-[0.75rem]">
|
||||
<label htmlFor="email" className="text-[13px]">
|
||||
Email
|
||||
<span style={{ color: "red", fontSize: 13 }}> *</span>
|
||||
<span className="text-[13px] text-[red]"> *</span>
|
||||
</label>
|
||||
<input
|
||||
type="email"
|
||||
@@ -252,11 +245,11 @@ const AddContact = (props) => {
|
||||
onChange={(e) => setEmail(e.target.value?.toLowerCase())}
|
||||
required
|
||||
disabled={addYourself}
|
||||
className="addUserInput lowercase"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs lowercase"
|
||||
/>
|
||||
</div>
|
||||
<div className="form-section">
|
||||
<label htmlFor="phone" style={{ fontSize: 13 }}>
|
||||
<div className="mb-[0.75rem]">
|
||||
<label htmlFor="phone" className="text-[13px]">
|
||||
Phone
|
||||
</label>
|
||||
<input
|
||||
@@ -265,18 +258,18 @@ const AddContact = (props) => {
|
||||
value={phone}
|
||||
onChange={(e) => setPhone(e.target.value)}
|
||||
disabled={addYourself}
|
||||
className="addUserInput"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="buttoncontainer">
|
||||
<button type="submit" className="submitbutton">
|
||||
<div className="mt-[1rem] flex justify-start gap-2">
|
||||
<button type="submit" className="op-btn op-btn-primary">
|
||||
Submit
|
||||
</button>
|
||||
<button
|
||||
type="button"
|
||||
onClick={() => handleReset()}
|
||||
className="resetbutton"
|
||||
className="op-btn op-btn-secondary"
|
||||
>
|
||||
Reset
|
||||
</button>
|
||||
|
||||
@@ -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>
|
||||
)
|
||||
);
|
||||
};
|
||||
|
||||
|
||||
@@ -1,14 +1,10 @@
|
||||
import React, { useState, useEffect, useMemo } from "react";
|
||||
import React, { useState, useEffect } from "react";
|
||||
import pad from "../assets/images/pad.svg";
|
||||
import { useNavigate } from "react-router-dom";
|
||||
import axios from "axios";
|
||||
import ModalUi from "./ModalUi";
|
||||
import AddSigner from "../components/AddSigner";
|
||||
import {
|
||||
modalSubmitBtnColor,
|
||||
modalCancelBtnColor
|
||||
// isEnableSubscription
|
||||
} from "../constant/const";
|
||||
// import { isEnableSubscription } from "../constant/const";
|
||||
import Alert from "./Alert";
|
||||
import Tooltip from "./Tooltip";
|
||||
import { RWebShare } from "react-web-share";
|
||||
@@ -63,13 +59,65 @@ const ReportTable = (props) => {
|
||||
const { isMoreDocs, setIsNextRecord } = props;
|
||||
// For loop is used to calculate page numbers visible below table
|
||||
// Initialize pageNumbers using useMemo to avoid unnecessary re-creation
|
||||
const pageNumbers = useMemo(() => {
|
||||
const calculatedPageNumbers = [];
|
||||
for (let i = 1; i <= Math.ceil(props.List.length / props.docPerPage); i++) {
|
||||
calculatedPageNumbers.push(i);
|
||||
// const pageNumbers = useMemo(() => {
|
||||
// const calculatedPageNumbers = [];
|
||||
// for (let i = 1; i <= Math.ceil(props.List.length / props.docPerPage); i++) {
|
||||
// calculatedPageNumbers.push(i);
|
||||
// }
|
||||
// return calculatedPageNumbers;
|
||||
// }, [props.List, props.docPerPage]);
|
||||
const getPaginationRange = () => {
|
||||
const totalPageNumbers = 7; // Adjust this value to show more/less page numbers
|
||||
const pages = [];
|
||||
const totalPages = Math.ceil(props.List.length / props.docPerPage);
|
||||
if (totalPages <= totalPageNumbers) {
|
||||
for (let i = 1; i <= totalPages; i++) {
|
||||
pages.push(i);
|
||||
}
|
||||
} else {
|
||||
const leftSiblingIndex = Math.max(currentPage - 1, 1);
|
||||
const rightSiblingIndex = Math.min(currentPage + 1, totalPages);
|
||||
|
||||
const showLeftDots = leftSiblingIndex > 2;
|
||||
const showRightDots = rightSiblingIndex < totalPages - 2;
|
||||
|
||||
const firstPageIndex = 1;
|
||||
const lastPageIndex = totalPages;
|
||||
|
||||
if (!showLeftDots && showRightDots) {
|
||||
let leftItemCount = 3;
|
||||
let leftRange = Array.from({ length: leftItemCount }, (_, i) => i + 1);
|
||||
|
||||
pages.push(...leftRange);
|
||||
pages.push("...");
|
||||
pages.push(totalPages);
|
||||
} else if (showLeftDots && !showRightDots) {
|
||||
let rightItemCount = 3;
|
||||
let rightRange = Array.from(
|
||||
{ length: rightItemCount },
|
||||
(_, i) => totalPages - rightItemCount + i + 1
|
||||
);
|
||||
|
||||
pages.push(firstPageIndex);
|
||||
pages.push("...");
|
||||
pages.push(...rightRange);
|
||||
} else if (showLeftDots && showRightDots) {
|
||||
let middleRange = Array.from(
|
||||
{ length: 3 },
|
||||
(_, i) => leftSiblingIndex + i
|
||||
);
|
||||
|
||||
pages.push(firstPageIndex);
|
||||
pages.push("...");
|
||||
pages.push(...middleRange);
|
||||
pages.push("...");
|
||||
pages.push(lastPageIndex);
|
||||
}
|
||||
}
|
||||
return calculatedPageNumbers;
|
||||
}, [props.List, props.docPerPage]);
|
||||
|
||||
return pages;
|
||||
};
|
||||
const pageNumbers = getPaginationRange();
|
||||
// below useEffect reset currenpage to 1 if user change route
|
||||
useEffect(() => {
|
||||
checkTourStatus();
|
||||
@@ -329,11 +377,13 @@ const ReportTable = (props) => {
|
||||
setIsDeleteModal({});
|
||||
// setIsMakePublic({});
|
||||
// setSelectedPublicRole("");
|
||||
// setIsPublic((prevStates) => ({
|
||||
// ...prevStates,
|
||||
// [item.objectId]: !prevStates[item.objectId]
|
||||
// }));
|
||||
// setIsPublicProfile({});
|
||||
// if (item?.objectId) {
|
||||
// setIsPublic((prevStates) => ({
|
||||
// ...prevStates,
|
||||
// [item.objectId]: !prevStates[item.objectId]
|
||||
// }));
|
||||
// }
|
||||
};
|
||||
|
||||
const handleShare = (item) => {
|
||||
@@ -861,16 +911,13 @@ const ReportTable = (props) => {
|
||||
return (
|
||||
<div className="relative">
|
||||
{Object.keys(actLoader)?.length > 0 && (
|
||||
<div className="absolute w-full h-full rounded-md flex justify-center items-center bg-black bg-opacity-30 z-30">
|
||||
<div
|
||||
style={{ fontSize: "45px", color: "#3dd3e0" }}
|
||||
className="loader-37"
|
||||
></div>
|
||||
<div className="absolute w-full h-full text-[45px] text-[#3dd3e0] rounded-md flex justify-center items-center bg-black bg-opacity-30 z-30">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
)}
|
||||
<div className="p-2 overflow-x-scroll w-full bg-white rounded-md">
|
||||
<div className="p-2 overflow-x-scroll w-full bg-base-100 text-base-content rounded-xl">
|
||||
{/* {isCelebration && (
|
||||
<div style={{ position: "relative", zIndex: "1000" }}>
|
||||
<div className="relative z-[1000]">
|
||||
<Confetti width={window.innerWidth} height={window.innerHeight} />
|
||||
</div>
|
||||
)} */}
|
||||
@@ -909,19 +956,19 @@ const ReportTable = (props) => {
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
<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) => (
|
||||
<React.Fragment key={index}>
|
||||
<th className="px-4 py-2 font-thin">{item}</th>
|
||||
<th className="px-4 py-2">{item}</th>
|
||||
</React.Fragment>
|
||||
))}
|
||||
{props.actions?.length > 0 && (
|
||||
<th className="px-4 py-2 font-thin">Action</th>
|
||||
)}
|
||||
{/* {props.ReportName === "Templates" && isEnableSubscription && (
|
||||
<th className="px-4 py-2 font-thin">Public</th>
|
||||
<th className="px-4 py-2">Public</th>
|
||||
)} */}
|
||||
{/* {props.actions?.length > 0 && (
|
||||
<th className="px-4 py-2">Action</th>
|
||||
)} */}
|
||||
</tr>
|
||||
</thead>
|
||||
@@ -932,7 +979,7 @@ const ReportTable = (props) => {
|
||||
props.ReportName === "Contactbook" ? (
|
||||
<tr className="border-y-[1px]" key={index}>
|
||||
{props.heading.includes("Sr.No") && (
|
||||
<td className="px-4 py-2">{startIndex + index + 1}</td>
|
||||
<th className="px-4 py-2">{startIndex + index + 1}</th>
|
||||
)}
|
||||
<td className="px-4 py-2 font-semibold">{item?.Name} </td>
|
||||
<td className="px-4 py-2">{item?.Email || "-"}</td>
|
||||
@@ -943,14 +990,10 @@ const ReportTable = (props) => {
|
||||
<button
|
||||
key={index}
|
||||
onClick={() => handleActionBtn(act, item)}
|
||||
className={`mb-1 flex justify-center items-center gap-1 px-2 py-1 rounded shadow`}
|
||||
title={act.hoverLabel}
|
||||
style={{
|
||||
backgroundColor: act.btnColor
|
||||
? act.btnColor
|
||||
: "#3ac9d6",
|
||||
color: act?.textColor ? act?.textColor : "white"
|
||||
}}
|
||||
className={`${
|
||||
act?.btnColor ? act.btnColor : ""
|
||||
} op-btn op-btn-sm`}
|
||||
>
|
||||
<i className={act.btnIcon}></i>
|
||||
</button>
|
||||
@@ -969,19 +1012,13 @@ const ReportTable = (props) => {
|
||||
<div className="flex items-center mt-3 gap-2 text-white">
|
||||
<button
|
||||
onClick={() => handleDelete(item)}
|
||||
className="px-4 py-1.5 text-white rounded shadow-md text-center focus:outline-none "
|
||||
style={{
|
||||
backgroundColor: modalSubmitBtnColor
|
||||
}}
|
||||
className="op-btn op-btn-primary"
|
||||
>
|
||||
Yes
|
||||
</button>
|
||||
<button
|
||||
onClick={handleClose}
|
||||
className="px-4 py-1.5 text-black border-[1px] border-[#ccc] shadow-md rounded focus:outline-none"
|
||||
style={{
|
||||
backgroundColor: modalCancelBtnColor
|
||||
}}
|
||||
className="op-btn op-btn-secondary"
|
||||
>
|
||||
No
|
||||
</button>
|
||||
@@ -994,7 +1031,7 @@ const ReportTable = (props) => {
|
||||
) : (
|
||||
<tr className="border-y-[1px]" key={index}>
|
||||
{props.heading.includes("Sr.No") && (
|
||||
<td className="px-4 py-2">{startIndex + index + 1}</td>
|
||||
<th className="px-4 py-2">{startIndex + index + 1}</th>
|
||||
)}
|
||||
<td className="px-4 py-2 font-semibold w-56">
|
||||
{item?.Name}{" "}
|
||||
@@ -1020,7 +1057,6 @@ const ReportTable = (props) => {
|
||||
{formatRow(item?.ExtUserPtr)}
|
||||
</td>
|
||||
<td className="px-4 py-2">
|
||||
{/* {item?.Signers ? formatRow(item?.Signers) : "-"} */}
|
||||
{item?.Placeholders ? (
|
||||
<button
|
||||
onClick={() => handleViewSigners(item)}
|
||||
@@ -1032,58 +1068,214 @@ const ReportTable = (props) => {
|
||||
"-"
|
||||
)}
|
||||
</td>
|
||||
<td className="px-2 py-2 text-white flex flex-row gap-x-2 gap-y-1 justify-center items-center">
|
||||
{props.actions?.length > 0 &&
|
||||
props.actions.map((act, index) => (
|
||||
<button
|
||||
data-tut={act?.selector}
|
||||
key={index}
|
||||
onClick={() => handleActionBtn(act, item)}
|
||||
className={`${
|
||||
act.action === "option" ? "" : "rounded shadow"
|
||||
} ${
|
||||
act.btnLabel ? "py-[3px] px-1.5" : "py-1.5 px-2"
|
||||
} relative text-center flex items-center justify-center focus:outline-none`}
|
||||
title={act.hoverLabel}
|
||||
style={{
|
||||
backgroundColor: act.btnColor
|
||||
? act.btnColor
|
||||
: "#3ac9d6",
|
||||
color: act?.textColor ? act?.textColor : "white"
|
||||
}}
|
||||
>
|
||||
<i className={act.btnIcon}></i>
|
||||
{act.btnLabel && (
|
||||
<span className="ml-[4px] uppercase font-medium">
|
||||
{act.btnLabel}
|
||||
</span>
|
||||
)}
|
||||
{isOption[item.objectId] &&
|
||||
act.action === "option" && (
|
||||
<div className="absolute -right-2 top-5 p-1.5 bg-white text-nowrap rounded shadow-md z-[20] overflow-hidden">
|
||||
{act.subaction?.map((subact) => (
|
||||
<div
|
||||
key={subact.btnId}
|
||||
className="hover:bg-gray-300 rounded cursor-pointer px-2 py-1.5 flex justify-start items-center text-black"
|
||||
onClick={() =>
|
||||
handleActionBtn(subact, item)
|
||||
}
|
||||
title={subact.hoverLabel}
|
||||
>
|
||||
<i
|
||||
className={`${subact.btnIcon} mr-1.5`}
|
||||
></i>
|
||||
{subact.btnLabel && (
|
||||
<span className="ml-[4px] text-[13px] capitalize font-medium">
|
||||
{subact.btnLabel}
|
||||
</span>
|
||||
{/* {props.ReportName === "Templates" &&
|
||||
isEnableSubscription && (
|
||||
<td className=" pl-[20px] py-2">
|
||||
{props.ReportName === "Templates" && (
|
||||
<div className="flex flex-row">
|
||||
<label
|
||||
className={
|
||||
"cursor-pointer relative inline-flex items-center mb-0"
|
||||
}
|
||||
>
|
||||
<input
|
||||
checked={isPublic?.[item.objectId]}
|
||||
onChange={(e) =>
|
||||
handlePublicChange(e, item)
|
||||
}
|
||||
type="checkbox"
|
||||
value=""
|
||||
className="sr-only peer"
|
||||
/>
|
||||
<div className="w-9 h-5 bg-gray-200 peer-focus:outline-none peer-focus:ring-1 peer-focus:ring-black rounded-full peer dark:bg-gray-700 peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all dark:border-black peer-checked:bg-blue-600"></div>
|
||||
</label>
|
||||
</div>
|
||||
)}
|
||||
{isMakePublic[item.objectId] && (
|
||||
<ModalUi
|
||||
isOpen
|
||||
title={
|
||||
isPublic[item.objectId]
|
||||
? "Make template public"
|
||||
: "Make template private"
|
||||
}
|
||||
handleClose={() => {
|
||||
setIsMakePublic({});
|
||||
setSelectedPublicRole("");
|
||||
setIsPublic((prevStates) => ({
|
||||
...prevStates,
|
||||
[item.objectId]: !prevStates[item.objectId]
|
||||
}));
|
||||
}}
|
||||
>
|
||||
<div className="m-[20px]">
|
||||
<div className="font-normal text-black">
|
||||
<p className="text-lg">
|
||||
{isPublic[item.objectId]
|
||||
? `Are you sure you want to make this template public ?`
|
||||
: `Are you sure you want to make this template private ? This will remove it from your public profile ?`}
|
||||
</p>
|
||||
{isPublic[item.objectId] && (
|
||||
<div className="flex mt-2 gap-2 md:items-center">
|
||||
<p className="text-[15px]">
|
||||
Public role :{" "}
|
||||
</p>
|
||||
{item?.Placeholders?.length > 1 ? (
|
||||
<select
|
||||
className="w-[60%] md:w-[70%] border-[1px] border-gray-200 rounded-sm p-[2px]"
|
||||
name="textvalidate"
|
||||
value={selectedPublicRole}
|
||||
onChange={(e) =>
|
||||
setSelectedPublicRole(
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
>
|
||||
<option
|
||||
disabled
|
||||
style={{ fontSize: "13px" }}
|
||||
value=""
|
||||
>
|
||||
Select...
|
||||
</option>
|
||||
{item?.Placeholders.map(
|
||||
(data, ind) => {
|
||||
return (
|
||||
<option
|
||||
style={{ fontSize: "13px" }}
|
||||
key={ind}
|
||||
value={data?.Role}
|
||||
>
|
||||
{data?.Role}
|
||||
</option>
|
||||
);
|
||||
}
|
||||
)}
|
||||
</select>
|
||||
) : (
|
||||
<div className="w-[60%] md:w-[70%] border-[1px] border-gray-200 rounded-sm p-[2px]">
|
||||
{item?.Placeholders[0]?.Role}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
)}
|
||||
</div>
|
||||
<hr className="bg-[#ccc] mt-2 " />
|
||||
<div className="flex items-center mt-3 gap-2 text-white">
|
||||
<button
|
||||
onClick={() => handlePublicTemplate(item)}
|
||||
className="op-btn op-btn-primary"
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
<button
|
||||
onClick={() => handleClose(item)}
|
||||
className="op-btn op-btn-secondary"
|
||||
>
|
||||
No
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</ModalUi>
|
||||
)}
|
||||
{isPublicProfile[item.objectId] && (
|
||||
<ModalUi
|
||||
isOpen
|
||||
title={"Public URL"}
|
||||
handleClose={() => {
|
||||
setIsPublicProfile({});
|
||||
}}
|
||||
reduceWidth={
|
||||
"md:min-w-[440px] md:max-w-[400px]"
|
||||
}
|
||||
>
|
||||
<div className="m-[20px]">
|
||||
{publicUserName ? (
|
||||
<div className="font-normal text-black">
|
||||
<p>
|
||||
Here’s your public URL. Copy or share it
|
||||
with the signer, and you will be able to
|
||||
see all your publicly set templates.
|
||||
</p>
|
||||
<div className=" flex items-center gap-5 mt-2 p-[2px] w-[75%]">
|
||||
<span className="font-bold">
|
||||
Public URL :{" "}
|
||||
</span>
|
||||
<span
|
||||
onClick={() => copytoProfileLink()}
|
||||
className="underline underline-offset-2 cursor-pointer"
|
||||
>{`https://opensign.me/${publicUserName}`}</span>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="font-normal text-black">
|
||||
<p>
|
||||
Please add your public URL, and you will
|
||||
be able to make a public template.
|
||||
</p>
|
||||
<button
|
||||
className="mt-3 op-btn op-btn-primary"
|
||||
onClick={() => navigate("/profile")}
|
||||
>
|
||||
Add
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</ModalUi>
|
||||
)}
|
||||
</td>
|
||||
)} */}
|
||||
<td className="px-2 py-2">
|
||||
<div className="text-white flex flex-row gap-x-2 gap-y-1 justify-start items-center">
|
||||
{props.actions?.length > 0 &&
|
||||
props.actions.map((act, index) => (
|
||||
<button
|
||||
data-tut={act?.selector}
|
||||
key={index}
|
||||
onClick={() => handleActionBtn(act, item)}
|
||||
title={act.hoverLabel}
|
||||
className={
|
||||
act.action !== "option"
|
||||
? `${
|
||||
act?.btnColor ? act.btnColor : ""
|
||||
} op-btn op-btn-sm`
|
||||
: "text-base-content focus:outline-none text-lg mr-2 relative"
|
||||
}
|
||||
>
|
||||
<i className={act.btnIcon}></i>
|
||||
{act.btnLabel && (
|
||||
<span className="uppercase font-medium">
|
||||
{act.btnLabel}
|
||||
</span>
|
||||
)}
|
||||
</button>
|
||||
))}
|
||||
{isOption[item.objectId] &&
|
||||
act.action === "option" && (
|
||||
<div className="absolute -right-2 top-5 p-1.5 bg-white text-nowrap rounded shadow-md z-[20] overflow-hidden">
|
||||
{act.subaction?.map((subact) => (
|
||||
<div
|
||||
key={subact.btnId}
|
||||
className="hover:bg-gray-300 rounded cursor-pointer px-2 py-1.5 flex justify-start items-center text-black"
|
||||
onClick={() =>
|
||||
handleActionBtn(subact, item)
|
||||
}
|
||||
title={subact.hoverLabel}
|
||||
>
|
||||
<i
|
||||
className={`${subact.btnIcon} mr-1.5`}
|
||||
></i>
|
||||
{subact.btnLabel && (
|
||||
<span className="ml-[4px] text-[13px] capitalize font-medium">
|
||||
{subact.btnLabel}
|
||||
</span>
|
||||
)}
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
)}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
{isViewShare[item.objectId] && (
|
||||
<div className="fixed z-[999] inset-0 w-full h-full bg-black bg-opacity-[75%]">
|
||||
<div className="fixed 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%] md:min-w-[400px] overflow-y-auto max-h-[340px] md:max-h-[400px] hide-scrollbar">
|
||||
@@ -1140,19 +1332,13 @@ const ReportTable = (props) => {
|
||||
<div className="flex items-center mt-3 gap-2 text-white">
|
||||
<button
|
||||
onClick={() => handleDelete(item)}
|
||||
className="px-4 py-1.5 text-white rounded shadow-md text-center focus:outline-none "
|
||||
style={{
|
||||
backgroundColor: modalSubmitBtnColor
|
||||
}}
|
||||
className="op-btn op-btn-primary"
|
||||
>
|
||||
Yes
|
||||
</button>
|
||||
<button
|
||||
onClick={handleClose}
|
||||
className="px-4 py-1.5 text-black border-[1px] border-[#ccc] shadow-md rounded focus:outline-none"
|
||||
style={{
|
||||
backgroundColor: modalCancelBtnColor
|
||||
}}
|
||||
className="op-btn op-btn-secondary"
|
||||
>
|
||||
No
|
||||
</button>
|
||||
@@ -1167,11 +1353,8 @@ const ReportTable = (props) => {
|
||||
handleClose={() => setIsBulkSend({})}
|
||||
>
|
||||
{isLoader[item.objectId] ? (
|
||||
<div className="w-full h-[100px] md:h-[100px] rounded-b-md flex justify-center items-center bg-black bg-opacity-30 z-30">
|
||||
<div
|
||||
style={{ fontSize: "45px", color: "#3dd3e0" }}
|
||||
className="loader-37"
|
||||
></div>
|
||||
<div className="w-full h-[100px] text-[45px] text-[#3dd3e0] rounded-b-md flex justify-center items-center bg-black bg-opacity-30 z-30">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
) : (
|
||||
<BulkSendUi
|
||||
@@ -1234,23 +1417,17 @@ const ReportTable = (props) => {
|
||||
<div className="text-lg font-normal text-black">
|
||||
Are you sure you want to revoke this document?
|
||||
</div>
|
||||
<hr className="bg-[#ccc] mt-4 " />
|
||||
<div className="flex items-center mt-3 gap-2 text-white">
|
||||
<hr className="bg-[#ccc] mt-4" />
|
||||
<div className="flex items-center mt-3 gap-2">
|
||||
<button
|
||||
onClick={() => handleRevoke(item)}
|
||||
className="px-4 py-1.5 text-white rounded shadow-md text-center focus:outline-none "
|
||||
style={{
|
||||
backgroundColor: modalSubmitBtnColor
|
||||
}}
|
||||
className="op-btn op-btn-primary"
|
||||
>
|
||||
Yes
|
||||
</button>
|
||||
<button
|
||||
onClick={handleClose}
|
||||
className="px-4 py-1.5 text-black border-[1px] border-[#ccc] shadow-md rounded focus:outline-none"
|
||||
style={{
|
||||
backgroundColor: modalCancelBtnColor
|
||||
}}
|
||||
className="op-btn op-btn-secondary"
|
||||
>
|
||||
No
|
||||
</button>
|
||||
@@ -1274,22 +1451,15 @@ const ReportTable = (props) => {
|
||||
{isNextStep[user.Id] && (
|
||||
<div className="relative ">
|
||||
{actLoader[user.Id] && (
|
||||
<div className="absolute w-full h-full flex justify-center items-center bg-black bg-opacity-30 z-30">
|
||||
<div
|
||||
style={{
|
||||
fontSize: "45px",
|
||||
color: "#3dd3e0"
|
||||
}}
|
||||
className="loader-37"
|
||||
></div>
|
||||
<div className="absolute text-[45px] text-[#3dd3e0] w-full h-full flex justify-center items-center bg-black bg-opacity-30 z-30">
|
||||
<div className="loader-37"></div>
|
||||
</div>
|
||||
)}
|
||||
|
||||
<form
|
||||
onSubmit={(e) =>
|
||||
handleResendMail(e, item, user)
|
||||
}
|
||||
className="w-full flex flex-col gap-2 p-3 text-black relative"
|
||||
className="w-full flex flex-col gap-2 p-3 text-base-content relative"
|
||||
>
|
||||
<div className="absolute right-5 text-xs z-40">
|
||||
<Tooltip
|
||||
@@ -1308,7 +1478,7 @@ const ReportTable = (props) => {
|
||||
</label>
|
||||
<input
|
||||
id="mailsubject"
|
||||
className="w-full py-1.5 px-2 border-[1px] border-gray-300 rounded"
|
||||
className="op-input op-input-bordered op-input-sm focus:outline-none hover:border-base-content w-full text-xs"
|
||||
value={mail.subject}
|
||||
onChange={(e) =>
|
||||
handleSubjectChange(
|
||||
@@ -1341,7 +1511,7 @@ const ReportTable = (props) => {
|
||||
</div>
|
||||
<button
|
||||
type="submit"
|
||||
className="bg-[#32a3ac] w-[70px] font-semibold text-white py-2 rounded"
|
||||
className="op-btn op-btn-primary"
|
||||
>
|
||||
Resend
|
||||
</button>
|
||||
@@ -1367,170 +1537,6 @@ const ReportTable = (props) => {
|
||||
</ModalUi>
|
||||
)}
|
||||
</td>
|
||||
{/* {isEnableSubscription && (
|
||||
<td className=" pl-[20px] py-2 ">
|
||||
{props.ReportName === "Templates" && (
|
||||
<div className=" flex flex-row-">
|
||||
<label
|
||||
className={
|
||||
"cursor-pointer relative inline-flex items-center mb-0"
|
||||
}
|
||||
>
|
||||
<input
|
||||
checked={isPublic?.[item.objectId]}
|
||||
onChange={(e) => handlePublicChange(e, item)}
|
||||
type="checkbox"
|
||||
value=""
|
||||
className="sr-only peer"
|
||||
/>
|
||||
<div className="w-9 h-5 bg-gray-200 peer-focus:outline-none peer-focus:ring-1 peer-focus:ring-black rounded-full peer dark:bg-gray-700 peer-checked:after:translate-x-full rtl:peer-checked:after:-translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-[2px] after:start-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-4 after:w-4 after:transition-all dark:border-black peer-checked:bg-blue-600"></div>
|
||||
</label>
|
||||
</div>
|
||||
)}
|
||||
{isMakePublic[item.objectId] && (
|
||||
<ModalUi
|
||||
isOpen
|
||||
title={
|
||||
isPublic[item.objectId]
|
||||
? "Make template public"
|
||||
: "Make template private"
|
||||
}
|
||||
handleClose={() => {
|
||||
setIsMakePublic({});
|
||||
setSelectedPublicRole("");
|
||||
setIsPublic((prevStates) => ({
|
||||
...prevStates,
|
||||
[item.objectId]: !prevStates[item.objectId]
|
||||
}));
|
||||
}}
|
||||
>
|
||||
<div className="m-[20px]">
|
||||
<div className="font-normal text-black">
|
||||
<p className="text-lg">
|
||||
{" "}
|
||||
{isPublic[item.objectId]
|
||||
? `Are you sure you want tof make this templat public ?`
|
||||
: `Are you sure you want to make this template private? This will remove it from your public profile ?`}
|
||||
</p>
|
||||
{isPublic[item.objectId] && (
|
||||
<div className="flex mt-2 gap-2 md:items-center">
|
||||
<p className="text-[15px]">
|
||||
Public role :{" "}
|
||||
</p>
|
||||
{item?.Placeholders?.length > 1 ? (
|
||||
<select
|
||||
className="w-[60%] md:w-[70%] border-[1px] border-gray-200 rounded-sm p-[2px]"
|
||||
name="textvalidate"
|
||||
value={selectedPublicRole}
|
||||
onChange={(e) =>
|
||||
setSelectedPublicRole(
|
||||
e.target.value
|
||||
)
|
||||
}
|
||||
>
|
||||
<option
|
||||
disabled
|
||||
style={{ fontSize: "13px" }}
|
||||
value=""
|
||||
>
|
||||
Select...
|
||||
</option>
|
||||
{item?.Placeholders.map(
|
||||
(data, ind) => {
|
||||
return (
|
||||
<option
|
||||
style={{ fontSize: "13px" }}
|
||||
key={ind}
|
||||
value={data?.Role}
|
||||
>
|
||||
{data?.Role}
|
||||
</option>
|
||||
);
|
||||
}
|
||||
)}
|
||||
</select>
|
||||
) : (
|
||||
<div className="w-[60%] md:w-[70%] border-[1px] border-gray-200 rounded-sm p-[2px]">
|
||||
{item?.Placeholders[0]?.Role}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<hr className="bg-[#ccc] mt-2 " />
|
||||
<div className="flex items-center mt-3 gap-2 text-white">
|
||||
<button
|
||||
onClick={() => handlePublicTemplate(item)}
|
||||
className="px-4 py-1.5 text-white rounded shadow-md text-center focus:outline-none "
|
||||
style={{
|
||||
backgroundColor: modalSubmitBtnColor
|
||||
}}
|
||||
>
|
||||
Submit
|
||||
</button>
|
||||
<button
|
||||
onClick={() => handleClose(item)}
|
||||
className="px-4 py-1.5 text-black border-[1px] border-[#ccc] shadow-md rounded focus:outline-none"
|
||||
style={{
|
||||
backgroundColor: modalCancelBtnColor
|
||||
}}
|
||||
>
|
||||
No
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</ModalUi>
|
||||
)}
|
||||
{isPublicProfile[item.objectId] && (
|
||||
<ModalUi
|
||||
isOpen
|
||||
title={"Public URL"}
|
||||
handleClose={() => {
|
||||
setIsPublicProfile({});
|
||||
}}
|
||||
reduceWidth={"md:min-w-[440px] md:max-w-[400px]"}
|
||||
>
|
||||
<div className="m-[20px]">
|
||||
{publicUserName ? (
|
||||
<div className="font-normal text-black">
|
||||
<p>
|
||||
Here’s your public URL. Copy or share it
|
||||
with the signer, and you will be able to
|
||||
see all your publicly set templates.
|
||||
</p>
|
||||
<div className=" flex items-center gap-5 mt-2 p-[2px] w-[75%]">
|
||||
<span className="font-bold">
|
||||
Public URL :{" "}
|
||||
</span>
|
||||
<span
|
||||
onClick={() => copytoProfileLink()}
|
||||
className="underline underline-offset-2 cursor-pointer"
|
||||
>{`https://opensign.me/${publicUserName}`}</span>
|
||||
</div>
|
||||
</div>
|
||||
) : (
|
||||
<div className="font-normal text-black">
|
||||
<p>
|
||||
Please add your public URL, and you will
|
||||
be able to make a public template.
|
||||
</p>
|
||||
<button
|
||||
className="px-4 py-1.5 mt-3 text-white rounded shadow-md text-center focus:outline-none "
|
||||
style={{
|
||||
backgroundColor: modalSubmitBtnColor
|
||||
}}
|
||||
onClick={() => navigate("/profile")}
|
||||
>
|
||||
Add
|
||||
</button>
|
||||
</div>
|
||||
)}
|
||||
</div>
|
||||
</ModalUi>
|
||||
)}
|
||||
</td>
|
||||
)} */}
|
||||
</tr>
|
||||
)
|
||||
)}
|
||||
@@ -1538,46 +1544,38 @@ const ReportTable = (props) => {
|
||||
)}
|
||||
</tbody>
|
||||
</table>
|
||||
<div className="flex flex-wrap items-center gap-2 p-2 ">
|
||||
<div className="op-join flex flex-wrap items-center p-2 ">
|
||||
{props.List.length > props.docPerPage && (
|
||||
<>
|
||||
{currentPage > 1 && (
|
||||
<button
|
||||
onClick={() => paginateBack()}
|
||||
className="bg-blue-400 text-white rounded px-3 py-2 focus:outline-none"
|
||||
>
|
||||
Prev
|
||||
</button>
|
||||
)}
|
||||
</>
|
||||
)}
|
||||
{pageNumbers.map((x) => (
|
||||
<button
|
||||
key={x}
|
||||
onClick={() => paginateBack()}
|
||||
className="op-join-item op-btn "
|
||||
>
|
||||
Prev
|
||||
</button>
|
||||
)}
|
||||
{pageNumbers.map((x, i) => (
|
||||
<button
|
||||
key={i}
|
||||
onClick={() => setCurrentPage(x)}
|
||||
className=" bg-sky-400 text-white rounded px-3 py-2 focus:outline-none"
|
||||
disabled={x === "..."}
|
||||
className={`${
|
||||
x === currentPage ? "op-btn-active" : ""
|
||||
} op-join-item op-btn`}
|
||||
>
|
||||
{x}
|
||||
</button>
|
||||
))}
|
||||
{isMoreDocs && (
|
||||
<button className="text-black rounded px-1 py-2">...</button>
|
||||
)}
|
||||
{props.List.length > props.docPerPage && (
|
||||
<>
|
||||
{pageNumbers.includes(currentPage + 1) && (
|
||||
<button
|
||||
onClick={() => paginateFront()}
|
||||
className="bg-blue-400 text-white rounded px-3 py-2 focus:outline-none"
|
||||
>
|
||||
Next
|
||||
</button>
|
||||
)}
|
||||
</>
|
||||
<button
|
||||
onClick={() => paginateFront()}
|
||||
className="op-join-item op-btn"
|
||||
>
|
||||
Next
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
{props.List?.length <= 0 && (
|
||||
<div className="flex flex-col items-center justify-center w-full bg-white rounded 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"
|
||||
|
||||
@@ -18,31 +18,7 @@ const LinkUserModal = (props) => {
|
||||
closePopup={props.closePopup}
|
||||
signersData={props?.signersData}
|
||||
/>
|
||||
<div
|
||||
style={{
|
||||
display: "flex",
|
||||
alignItems: "center",
|
||||
gap: 5,
|
||||
margin: "0 30%",
|
||||
color: "#808080"
|
||||
}}
|
||||
>
|
||||
<span
|
||||
style={{
|
||||
height: 1,
|
||||
width: "100%",
|
||||
backgroundColor: "#ccc"
|
||||
}}
|
||||
></span>
|
||||
<span>or</span>
|
||||
<span
|
||||
style={{
|
||||
height: 1,
|
||||
width: "100%",
|
||||
backgroundColor: "#ccc"
|
||||
}}
|
||||
></span>
|
||||
</div>
|
||||
<div className="op-divider text-base-content mx-[25%] my-1">or</div>
|
||||
<AddContact details={props.handleAddUser} closePopup={props.closePopup} />
|
||||
</ModalUi>
|
||||
);
|
||||
|
||||
@@ -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
|
||||
|
||||
@@ -208,7 +208,6 @@
|
||||
height: 100px;
|
||||
margin: 10px;
|
||||
display: inline-block;
|
||||
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
|
||||
@@ -4,5 +4,9 @@ module.exports = {
|
||||
theme: {
|
||||
extend: {}
|
||||
},
|
||||
plugins: []
|
||||
plugins: [require("daisyui")],
|
||||
daisyui: {
|
||||
themes: true,
|
||||
prefix: "op-"
|
||||
}
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user