Compare commits

...

12 Commits

Author SHA1 Message Date
victorAnumudu 14e588b0a9 fixed tab controls 2025-07-25 20:41:25 +01:00
CHIEFSOFT\ameye dde01ab79a Site data 2025-07-25 11:58:37 -04:00
ameye a5f1c4b5bb Merge branch 'iframe-bug-fix' of MERMS/MermsPanelReactJS into master 2025-07-24 20:20:16 +00:00
victorAnumudu a16dd7af24 fixed iframe bug 2025-07-24 21:16:48 +01:00
ameye 54d44e39d3 Merge branch 'internal-url' of MERMS/MermsPanelReactJS into master 2025-07-24 15:39:28 +00:00
victorAnumudu 578a0e4c8f url fixed 2025-07-24 13:18:10 +01:00
CHIEFSOFT\ameye d0ac2515a3 form data 2025-07-23 22:47:44 -04:00
CHIEFSOFT\ameye b26f8b4e0d fix data 2025-07-23 22:30:27 -04:00
ameye ab6518e2ee Merge branch 'text-hidden' of MERMS/MermsPanelReactJS into master 2025-07-22 20:08:58 +00:00
victorAnumudu 563abe6c35 menu dropdown fix 2025-07-22 20:03:27 +01:00
victorAnumudu 894ed6ea35 hid text on success 2025-07-22 20:01:11 +01:00
ameye 71859d9712 Merge branch 'tab-menu-fix' of MERMS/MermsPanelReactJS into master 2025-07-22 00:19:02 +00:00
6 changed files with 165 additions and 145 deletions
+1 -1
View File
@@ -12,7 +12,7 @@ const queryClient = new QueryClient({
refetchOnWindowFocus: false,
retry: 3,
// refetchOnMount: false,
staleTime: 360000 // can also be a number in millisecond
staleTime: 10*60*1000 // can also be a number in millisecond
},
},
})
+1 -1
View File
@@ -51,7 +51,7 @@ export default function Forgetpwd2() {
<div className="mt-5 d-flex">
<div className="bg-white register p-5">
<h1 className="mb-2">MERMS Panel</h1>
<p>Please enter your username.</p>
{!mutation.isSuccess && <p>Please enter your username.</p>}
<Formik
initialValues={initialValues}
validationSchema={validationSchema}
+117 -92
View File
@@ -1,10 +1,65 @@
import React from "react";
import React, { useRef, useState } from "react";
import getImage from "../../utils/getImage";
import BreadcrumbComBS from "../breadcrumb/BreadcrumbComBS";
import GeneralTab from "./settingsTab/GeneralTab";
import { useMutation } from "@tanstack/react-query";
import { productRefreshSite } from "../../services/services";
export default function ProductActive(){
export default function ProductActive({productData}){
const iframe = useRef()
const dataFields ={
site_title: { name: 'Title', controls: 'TEXT', active: true },
site_description: { name: 'Description', controls: 'TEXT', active: true },
site_logo_text: { name: 'Logo Text', controls: 'TEXT', active: true },
site_contact_email: { name: 'Email', controls: 'TEXT', active: true },
site_contact_phone: { name: 'Phone', controls: 'TEXT', active: true },
}
const socialFields ={
facebook: { name: 'Facebook', controls: 'TEXT', active: true },
twitter: { name: 'Twitter', controls: 'TEXT', active: true },
youtube: { name: 'Youtube', controls: 'TEXT', active: true },
}
const homeFields ={
banner_text: { name: 'Main Banner Text', controls: 'TEXT', active: true },
banner_description: { name: 'Main Banner Text', controls: 'TEXTAREA', active: true },
}
const settingsObject = {
settings: { title: 'Settings', controls: 'settings', active: 'active show' , data: dataFields},
home_tab: { title: 'Home Page', controls: 'home', active: '' , data: homeFields},
footer_tab: { title: 'Footer', controls: 'footer', active: '', data: {} },
about_tab: { title: 'About Page', controls: 'about', active: '', data: {} },
contact_tab: { title: 'Contact Page', controls: 'contact', active: '', data: {} },
social_tab: { title: 'Socials', controls: 'social', active: '', data: socialFields },
template_tab: { title: 'Template', controls: 'template', active: '', data: {} },
color_scheme_tab: { title: 'Color Scheme', controls: 'color-scheme', active: '', data: {} },
};
const [activeTab, setActiveTab] = useState(Object.entries(settingsObject)[0][1]?.controls)
const refresh = useMutation({
mutationFn: (fields) => {
return productRefreshSite(fields)
},
onSuccess: (res) => {
iframe.current.src += ''
}
})
const handleRefresh = () => {
const reqData = {
token: localStorage.getItem('token'), // USER TOKEN
uid: localStorage.getItem('uid'), // USER UID
product_id: productData.product_id,
subscription_uid: productData.subscription_uid
}
refresh.mutate(reqData)
}
let externalUrl= 'https://'+productData?.internal_url
return(
<>
@@ -15,101 +70,71 @@ export default function ProductActive(){
<div className="row account-contant">
<>
<div className="row tabs-contant">
<div className="col-xxl-6">
<div className="card card-statistics">
<div className="card-header">
<div className="card-heading">
<h4 className="card-title">https://25681.devprov.mermsemr.com/</h4>
</div>
</div>
<div className="card-body">
<iframe style={{borderWidth: '0px;'}} src="https://25681.devprov.mermsemr.com/" width="100%" height="600" title="https://25681.devprov.mermsemr.com"></iframe>
</div>
</div>
</div>
<div className="col-xxl-6">
<div className="card card-statistics">
<div className="card-header">
<div className="card-heading">
<h4 className="card-title"> Site Settings </h4>
</div>
</div>
<div className="card-body">
<div className="tab tab-vertical">
<ul className="nav nav-tabs" role="tablist">
<li className="nav-item">
<a className="nav-link active show" id="general-tab" data-bs-toggle="pill" data-bs-target="#general" type="button" role="tab" aria-controls="general" aria-selected="true">General</a>
</li>
<li className="nav-item">
<a className="nav-link" id="home-tab" data-bs-toggle="pill" data-bs-target="#home" type="button" role="tab" aria-controls="home" aria-selected="false">Home Page</a>
</li>
<li className="nav-item">
<a className="nav-link" id="footer-tab" data-bs-toggle="pill" data-bs-target="#footer" type="button" role="tab" aria-controls="footer" aria-selected="false">Footer</a>
</li>
<li className="nav-item">
<a className="nav-link" id="about-tab" data-bs-toggle="pill" data-bs-target="#about" type="button" role="tab" aria-controls="about" aria-selected="false">About Page</a>
</li>
<li className="nav-item">
<a className="nav-link" id="contact-tab" data-bs-toggle="pill" data-bs-target="#contact" type="button" role="tab" aria-controls="contact" aria-selected="true">Contact Page</a>
</li>
<li className="nav-item">
<a className="nav-link" id="social-tab" data-bs-toggle="pill" data-bs-target="#social" type="button" role="tab" aria-controls="social" aria-selected="false">Socials</a>
</li>
<li className="nav-item">
<a className="nav-link" id="template-tab" data-bs-toggle="pill" data-bs-target="#template" type="button" role="tab" aria-controls="template" aria-selected="false">Template</a>
</li>
<li className="nav-item">
<a className="nav-link" id="color-scheme-tab" data-bs-toggle="pill" data-bs-target="#color-scheme" type="button" role="tab" aria-controls="color-scheme" aria-selected="false">Color Scheme</a>
</li>
</ul>
<div className="tab-content">
<div className="tab-pane fade show active" id="general" role="tabpanel" aria-labelledby="general-tab">
<GeneralTab name='General' />
<>
<div className="row tabs-contant">
<div className="col-xxl-6">
<div className="card card-statistics">
<div className="card-header">
<div className="card-heading d-flex justify-content-between">
<h4 className="card-title">{externalUrl}</h4>
<button type="button" onClick={()=>iframe.current.src += ''} className="btn btn-primary">IC</button>
</div>
</div>
<div className="card-body">
<iframe ref={iframe} style={{borderWidth: '0px;'}} src={externalUrl} width="100%" height="600" title={productData?.internal_url ? productData?.internal_url : 'https://25681.devprov.mermsemr.com/'}></iframe>
</div>
<div className="p-4 ml-auto">
<button type="button" onClick={handleRefresh} className="btn btn-primary">{refresh.isPending ? 'Loading...' : 'Refresh Site'}
</button>
</div>
</div>
<div className="tab-pane fade" id="home" role="tabpanel" aria-labelledby="home-tab">
<GeneralTab name='Home Page' />
</div>
<div className="tab-pane fade" id="footer" role="tabpanel" aria-labelledby="footer-tab">
<GeneralTab name='Footer' />
</div>
<div className="tab-pane fade" id="about" role="tabpanel" aria-labelledby="about-tab">
<GeneralTab name='About Page' />
</div>
<div className="tab-pane fade" id="contact" role="tabpanel" aria-labelledby="contact-tab">
<GeneralTab name='Contact Page' />
</div>
<div className="tab-pane fade" id="social" role="tabpanel" aria-labelledby="social-tab">
<GeneralTab name='Socials' />
</div>
<div className="tab-pane fade" id="template" role="tabpanel" aria-labelledby="template-tab">
<GeneralTab name='Template' />
</div>
<div className="tab-pane fade" id="color-scheme" role="tabpanel" aria-labelledby="color-scheme-tab">
<GeneralTab name='Color Scheme' />
</div>
<div className="col-xxl-6">
<div className="card card-statistics">
<div className="card-header">
<div className="card-heading">
<h4 className="card-title"> Site Settings </h4>
</div>
</div>
<div className="card-body">
<div className="tab tab-vertical">
<ul className="nav nav-tabs" role="tablist">
<>
{Object.entries(settingsObject).map(([key, value]) => (
<li className="nav-item">
<a className={`nav-link ${activeTab == value.controls && 'active show'}`}
id={key} data-bs-toggle="pill"
// data-bs-target={`#${value.controls}`}
type="button" role="tab"
// aria-controls={value.controls}
// aria-selected="true"
onClick={()=>setActiveTab(value.controls)}
>
{value.title}
</a>
</li>
))}
</>
</ul>
<div className="tab-content">
<>
{Object.entries(settingsObject).map(([key, value]) => (
<div className={`tab-pane fade ${activeTab == value.controls && 'active show'}`}
// id={value.controls} role="tabpanel"
// aria-labelledby={key}
>
<GeneralTab name={value.title} data={value.data} />
</div>
))}
</>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</>
</div>
</div>
</div>
</>
</div>
</>
)
}
@@ -1,49 +1,36 @@
import React from 'react'
import React, {memo} from 'react'
export default function GeneralTab({name='Full Name'}) {
return (
<div className="page-account-form">
<div className="p-4">
<form>
<h4>{name}</h4>
<div className="form-row">
<div className="form-group col-md-12">
<label htmlFor="name1">Full Name</label>
<input type="text" className="form-control" id="name1"
value="Alice Williams" />
const GeneralTab = memo(({name='Full Name', data}) =>{
console.log("Page data == ", data)
return (
<div className="page-account-form">
<div className="p-0">
<form>
<div className="form-row">
<>
{Object.entries(data)?.map(([key, value]) => (
<div className="form-group col-md-12">
<label htmlFor="name1">{value.name}</label>
{value.controls == 'TEXT' ?
<input type="text" className="form-control" id={key} value="" />
:value.controls == 'TEXTAREA' ?
<textarea rows={5} style={{resize: 'none'}} type="text" className="form-control" id={key} value="" />
:
null
}
</div>
))}
</>
<div className="form-group col-md-12" style={{textAlign:'right'}}>
<button type="submit" className="btn btn-primary">Update</button>
</div>
</div>
<div className="form-group col-md-12">
<label htmlFor="title1">Title</label>
<input type="text" className="form-control" id="title1"
value="Marketing expert" />
</div>
<div className="form-group col-md-12">
<label htmlFor="phone1">Phone Number</label>
<input type="text" className="form-control" id="phone1"
value="(01) 97 563 15613" />
</div>
<div className="form-group col-md-12">
<label htmlFor="email1">Email</label>
<input type="email" className="form-control" id="email1"
value="alicewilliams@gmail.com" />
</div>
</div>
<div className="form-group">
<label htmlFor="add1">Address</label>
<input type="text" className="form-control" id="add1"
value="17504 Carlton Cuevas Rd, Gulfport, MS, 39503" />
</div>
<div className="form-group">
<label htmlFor="add2">Address 2</label>
<input type="text" className="form-control" id="add2"
value="1234 North Avenue Luke Lane, South Bend, IN 360001" />
</div>
<button type="submit" className="btn btn-primary">Update Information
</button>
</form>
</form>
</div>
</div>
</div>
)
}
)
}
)
export default GeneralTab
+5 -5
View File
@@ -588,11 +588,11 @@
left: 0px;
}
}
// .show{
// margin-top: 0!important;
// visibility: visible!important;
// opacity: 1!important;
// }
.show{
margin-top: 0!important;
visibility: visible!important;
opacity: 1!important;
}
// .show + .dropdown-menu{
// margin-top: 0;
// visibility: visible;
+8
View File
@@ -115,6 +115,14 @@ export const productsData = (reqData) => {
return postAuxEnd(`/panel/account/products`, postData, false)
}
// FUNCTION TO REFRESH SITE
export const productRefreshSite = (reqData) => {
let postData = {
...reqData,
}
return postAuxEnd(`/panel/account/products/refresh`, postData, false)
}
// FUNCTION TO GET DASHBOARD RECENT ACTIONS SECTION
export const recentActions = (reqData) => {
let postData = {