Compare commits

..

1 Commits

Author SHA1 Message Date
victorAnumudu 260071e1d3 section layout update 2024-07-11 07:00:16 +01:00
6 changed files with 50 additions and 102 deletions
Binary file not shown.

Before

Width:  |  Height:  |  Size: 47 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 56 KiB

+7 -8
View File
@@ -1,12 +1,11 @@
import axios from 'axios'; import Axios from 'axios';
import getConfig from './../Config/config'
async function ContactData(reqData) { async function ContactData(callData) {
let formData = new FormData() // debugger;
for (let value in reqData) { var site = getConfig()[0];
formData.append(value, reqData[value]); let response = await Axios.post(`${process.env.REACT_APP_AUX_ENDPOINT}/sitecontact`, callData);
} return response.data.result;
let response = await axios.post(`${process.env.REACT_APP_AUX_ENDPOINT}/sitecontact`, reqData);
return response;
} }
export default ContactData; export default ContactData;
+31 -82
View File
@@ -1,4 +1,4 @@
import React, {useState} from 'react'; import React from 'react';
import getConfig from './../../Config/config' import getConfig from './../../Config/config'
import ContactData from '../../Services/ContactData'; import ContactData from '../../Services/ContactData';
@@ -7,68 +7,33 @@ function Forms() {
var site = getConfig()[0]; var site = getConfig()[0];
const [formDetails, setFormDetails] = useState({
first_name: '',
last_name: '',
email: '',
subject: '',
phone_number: '',
action: 1001,
message: '',
channel: 'WEB',
terms_conditions: false
})
const validForm = formDetails.first_name && formDetails.last_name && formDetails.email && formDetails.phone_number && formDetails.subject && formDetails.message
const handleChange = ({target:{name, value}}) => {
setFormDetails(prev => ({...prev, [name]:value}))
}
const [requestStatus, setRequestStatus] = useState({loading:false, status:false, msg:''})
function handleSubmit(e) { function handleSubmit(e) {
e.preventDefault() e.preventDefault();
setRequestStatus({loading:true, status:false, msg:''}) // console.log('You clicked submit.');
if(!validForm){ // console.log(e);
setRequestStatus({loading:false, status:false, msg:'please, fill all fields'}) // debugger;
setTimeout(()=>{ const firstname = e.target['f-name'].value;
setRequestStatus({loading:false, status:false, msg:''}) const lastname = e.target['l-name'].value;
},3000) const email = e.target['email'].value;
return const phone = e.target['phone'].value;
} const subject = e.target['subject'].value;
const message = e.target['message'].value;
const terms = e.target['terms-conditions'].checked;
//alert(terms);
delete formDetails.terms_conditions var callData = [{
"firstname": firstname,
"lastname": lastname,
"email": email,
"phone": phone,
"subject": subject,
"message": message,
"channel": 'WEB'
}];
const callRet = ContactData(callData);
console.log('You clicked submit========> '+ callRet);
ContactData(formDetails).then(res =>{
if(res?.data?.result != '100'){
setRequestStatus({loading:false, status:false, msg:'failed to send message'})
setTimeout(()=>{
setRequestStatus({loading:false, status:false, msg:''})
},3000)
return
}
setRequestStatus({loading:false, status:true, msg:'message Sent'})
setTimeout(()=>{
setRequestStatus({loading:false, status:false, msg:''})
setFormDetails({
first_name: '',
last_name: '',
email: '',
subject: '',
phone_number: '',
action: 1001,
message: '',
channel: 'WEB',
terms_conditions: false
})
},3000)
}).catch(err => {
setRequestStatus({loading:false, status:false, msg:'failed something went wrong'})
setTimeout(()=>{
setRequestStatus({loading:false, status:false, msg:''})
},3000)
});
} }
@@ -134,10 +99,10 @@ function Forms() {
<h4>Lets Connect</h4> <h4>Lets Connect</h4>
<form onSubmit={handleSubmit} className="row"> <form onSubmit={handleSubmit} className="row">
<div className="col-md-6"> <div className="col-md-6">
<input type="text" name="first_name" placeholder="First Name" maxLength={15} onChange={handleChange} value={formDetails.first_name} /> <input type="text" name="f-name" placeholder="First Name" maxLength={15} />
</div> </div>
<div className="col-md-6"> <div className="col-md-6">
<input type="text" name="last_name" placeholder="Last Name" maxLength={15} onChange={handleChange} value={formDetails.last_name} /> <input type="text" name="l-name" placeholder="Last Name" maxLength={15} />
</div> </div>
<div className="col-md-6"> <div className="col-md-6">
<input <input
@@ -145,52 +110,36 @@ function Forms() {
name="email" name="email"
placeholder="Email Address" placeholder="Email Address"
maxLength={35} maxLength={35}
onChange={handleChange}
value={formDetails.email}
/> />
</div> </div>
<div className="col-md-6"> <div className="col-md-6">
<input <input
type="number" type="number"
name="phone_number" name="phone"
placeholder="Phone Number" placeholder="Phone Number"
maxLength={15} maxLength={15}
onChange={handleChange}
value={formDetails.phone_number}
/> />
</div> </div>
<div className="col-md-12"> <div className="col-md-12">
<input type="text" name="subject" placeholder="Subject" maxLength={35} value={formDetails.subject} onChange={handleChange} /> <input type="text" name="subject" placeholder="Subject" maxLength={35} />
</div> </div>
<div className="col-md-12"> <div className="col-md-12">
<textarea <textarea
name="message" name="message"
placeholder="How can we help?" placeholder="How can we help?"
onChange={handleChange}
value={formDetails.message}
></textarea> ></textarea>
</div> </div>
<div className="col-md-6"> <div className="col-md-6">
<div className="condition-check"> <div className="condition-check">
<input id="terms-conditions" name="terms_conditions" type="checkbox" value={formDetails.terms_conditions} onChange={handleChange} /> <input id="terms-conditions" name="terms-conditions" type="checkbox" />
<label htmlFor="terms-conditions"> <label htmlFor="terms-conditions">
I agree to the <a href="#">Terms & Conditions</a> I agree to the <a href="#">Terms & Conditions</a>
</label> </label>
</div> </div>
</div> </div>
<div className="col-md-6 text-right"> <div className="col-md-6 text-right">
<input <input type="submit" name="submit" value="Send Message" />
type="submit"
value={ requestStatus.loading ? 'Sending...' : 'Send Message'}
disabled={requestStatus.loading}
className={`${!validForm ? 'opacity-25' : 'opacity-100'}`}
/>
</div> </div>
{/* <div className="p-2 col-12">
{requestStatus.msg &&
}
</div> */}
<p className={`p-1 w-100 text-center ${requestStatus.status ? 'text-success' : 'text-danger'}`}>{requestStatus.msg}</p>
</form> </form>
</div> </div>
</div> </div>
+1 -1
View File
@@ -55,7 +55,7 @@ function FooterHomeOne({ className }) {
<li> <li>
<Link to="/use-cases">Use Cases</Link> <Link to="/use-cases">Use Cases</Link>
</li> </li>
<li className='d-none'> <li>
<a target='_blank' href={process.env.REACT_APP_AGENT_LINK}>Agent</a> <a target='_blank' href={process.env.REACT_APP_AGENT_LINK}>Agent</a>
</li> </li>
<li> <li>
+6 -6
View File
@@ -25,24 +25,24 @@ const Main = ({gredient}) => {
</div> </div>
} }
<div className="container"> <div className="container">
<div className="row">
<div className="col-lg-6">
<div className="w-100">
<div className="p-0 appie-traffic-title section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100"> <div className="p-0 appie-traffic-title section_title" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100">
<h3 className='title'>Set Chores, Set Goals <div className='section_sub_title'>Reward Accomplishments</div></h3> <h3 className='title'>Set Chores, Set Goals <div className='section_sub_title'>Reward Accomplishments</div></h3>
<p className=''> <p className=''>
Set goals, tasks, or anything that motivates or needs to be done and reward completion. WrenchBoard is the platform to plan rewards. Set goals, tasks, or anything that motivates or needs to be done and reward completion. WrenchBoard is the platform to plan rewards.
</p> </p>
</div> </div>
<div className="row mt-3 align-items-center">
<div className="col-lg-6">
<div className="w-100">
<div className="appie-traffic-title section_title mb-3" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100" style={{padding: '0'}}> <div className="appie-traffic-title section_title mb-3" data-aos="fade-up" data-aos-duration="1500" data-aos-delay="100" style={{padding: '0'}}>
<h3 className='title text-center text-lg-left'>Assign Faster with</h3> <h3 className='title text-center'>Assign Faster with</h3>
<h3 className='w-100 title text-center d-flex justify-content-center justify-content-lg-end flex-nowrap'> <h3 className='w-100 title text-center d-flex justify-content-center flex-nowrap'>
<div className='color-blue italic'>wrench</div><div className='color-purple'>Agent</div> <div className='color-blue italic'>wrench</div><div className='color-purple'>Agent</div>
</h3> </h3>
</div> </div>
<div className="row"> <div className="row">
{list?.map(({ icon, header, paragraph, name }, idx) => ( {list?.map(({ icon, header, paragraph, name }, idx) => (
<div className="col-12 col-md-6 mb-10" key={idx} onClick={()=>changeActiveImg(name)} style={{cursor: 'pointer'}}> <div className="col-12 mb-10" key={idx} onClick={()=>changeActiveImg(name)} style={{cursor: 'pointer'}}>
<div <div
className={`appie-traffic-service features appie-modern-design`} className={`appie-traffic-service features appie-modern-design`}
> >