MERMS/MermsPanelReactJS
1
0
Fork 0
Code Issues Pull Requests 1 Releases Activity

fixed input fields #54

Merged
ameye merged 1 commits from input-fields-fix into master 2025-07-27 18:42:33 +00:00
Conversation 0 Commits 1 Files Changed 3
+28 -13
3 changed files with 28 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/component/product/ProductActive.jsx
+5 -5
View File
@@ -24,8 +24,8 @@ export default function ProductActive({productData}){
}
const homeFields ={
banner_text: { name: 'Main Banner Text', controls: 'TEXT', active: true },
banner_description: { name: 'Main Banner Text', controls: 'TEXTAREA', active: true },
banner_text: { name: 'Banner Text', controls: 'TEXT', active: true },
banner_description: { name: 'Banner Description', controls: 'TEXTAREA', active: true },
}
const footerFields ={
@@ -101,7 +101,7 @@ export default function ProductActive({productData}){
</div>
</div>
<div className="card-body">
<iframe ref={iframe} style={{borderWidth: '0px;'}} src={externalUrl} width="100%" height="600" title={externalUrl}></iframe>
<iframe ref={iframe} style={{borderWidth: '0px'}} src={externalUrl} width="100%" height="600" title={externalUrl}></iframe>
</div>
<div className="p-4 ml-auto">
<button type="button" onClick={handleRefresh} className="btn btn-primary">{refresh.isPending ? 'Loading...' : 'Refresh Site'}
@@ -121,7 +121,7 @@ export default function ProductActive({productData}){
<ul className="nav nav-tabs" role="tablist">
<>
{Object.entries(settingsObject).map(([key, value]) => (
<li className="nav-item">
<li key={key} className="nav-item">
<a className={`nav-link ${activeTab == value.controls && 'active show'}`}
id={key} data-bs-toggle="pill"
// data-bs-target={`#${value.controls}`}
@@ -139,7 +139,7 @@ export default function ProductActive({productData}){
<div className="tab-content">
<>
{Object.entries(settingsObject).map(([key, value]) => (
<div className={`tab-pane fade ${activeTab == value.controls && 'active show'}`}
<div key={key} className={`tab-pane fade ${activeTab == value.controls && 'active show'}`}
// id={value.controls} role="tabpanel"
// aria-labelledby={key}
>
src/component/product/settingsTab/GeneralTab.jsx
+22 -7
View File
@@ -1,26 +1,41 @@
import React, {memo} from 'react'
import React, {memo, useState} from 'react'
import SiteTemplateSelector from './SiteTemplateSelector';
const GeneralTab = memo(({name='Full Name', data, isCustom, productData}) =>{
console.log("Page data == ", data)
const fieldData = {}
Object.entries(data)?.forEach(([key, value]) => { // LOOP TO POPULATE FIELDDATA PROPERTIES WITH DATA OF EACH TAB
fieldData[value.name] = ''
})
const [fields, setFields] = useState(fieldData)
const handleChange = ({target:{name, value}}) => {
setFields(prev => ({...prev, [name]:value}))
}
const handleSubmit = () => {
console.log('formInfo', fields)
}
if (isCustom === true){
return <SiteTemplateSelector name={name} data={data} isCustom={isCustom} productData={productData} />
}
return (
<div className="page-account-form">
<div className="p-0" style={{ minHeight: '500px;'}}>
<div className="p-0" style={{ minHeight: '500px'}}>
<form>
<form id='tab_form'>
<div className="form-row">
<>
{Object.entries(data)?.map(([key, value]) => (
<div className="form-group col-md-12">
<div key={key} className="form-group col-md-12">
<label htmlFor="name1">{value.name}</label>
{value.controls == 'TEXT' ?
<input type="text" className="form-control" id={key} value="" />
<input name={value.name} type="text" className="form-control" id={key} value={fields[value.name]} onChange={handleChange} />
:value.controls == 'TEXTAREA' ?
<textarea rows={5} style={{resize: 'none'}} type="text" className="form-control" id={key} value="" />
<textarea name={value.name} rows={5} style={{resize: 'none'}} type="text" className="form-control" id={key} value={fields[value.name]} onChange={handleChange} />
:
null
}
@@ -28,7 +43,7 @@ const GeneralTab = memo(({name='Full Name', data, isCustom, productData}) =>{
))}
</>
<div className="form-group col-md-12" style={{textAlign:'right'}}>
<button type="submit" className="btn btn-primary">Update</button>
<button onClick={handleSubmit} type="button" className="btn btn-primary">Update</button>
</div>
</div>
</form>
src/component/product/settingsTab/SiteTemplateSelector.jsx
+1 -1
View File
@@ -8,7 +8,7 @@ const SiteTemplateSelector = memo(({name='Full Name', data}) =>{
<div className="row">
<>
{Object.entries(data)?.map(([key, value]) => (
<div className="col-xl-6 col-sm-6">
<div key={key} className="col-xl-6 col-sm-6">
<div className="card card-statistics">
<div className="card-body">
<div className="text-center p-2">