Contact us page

src/Config/config.js

@@ -15,7 +15,9 @@ function getConfig() {
             "linked_link": "https://www.linkedin.com/company/wrenchboard/",
             "support_email": 'support@wrenchboard.com',
             "support_phone": '404 855-7966',
-            "support_us_address": 'Atlanta,GA 30339',
+            "support_phone_ng": '(+420) 336 476 328',
+            "support_us_address": 'Cumberland Pkwy, Atlanta GA 30339',
+            "support_ng_address": 'Saka Tinubu Street, Victoria Island Lagos, Nigeria',
             "dummy": "2018-06-25T18:54:22.000Z",
             "user_service_endpoint": "https://dashboard.wrenchboard.com/svs/user",
         }

src/Services/ContactData.js

@@ -0,0 +1,10 @@
+import Axios from 'axios';
+import getConfig from './../Config/config'
+
+async function ContactData(callData) {
+    var site = getConfig()[0];
+    let response = await Axios.post(site.user_service_endpoint + "/sitecontact", callData);
+    return response.data.result_list;
+}
+
+export default ContactData;

src/components/Contact/Forms.js

@@ -1,6 +1,28 @@
 import React from 'react';
+import getConfig from './../../Config/config'
 
 function Forms() {
+
+    var site = getConfig()[0];
+
+    function handleSubmit(e) {
+        e.preventDefault();
+        console.log('You clicked submit.');
+        console.log(e);
+        debugger;
+        const firstname = e.target['f-name'].value;
+        const lastname = e.target['l-name'].value;
+        const email = e.target['email'].value;
+        
+        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);
+
+      }
+
+
     return (
         <>
             <section className="contact-section">
@@ -14,14 +36,12 @@ function Forms() {
                                     <h5>Headquaters</h5>
                                     <p>
                                         <i className="fal fa-home"></i>
-                                        Cumberland Pkwy, Atlanta
+                                        {site.support_us_address}
-                                        <br /> GA 30339
                                     </p>
 
                                     <p>
                                         <i className="fal fa-home"></i>
-                                        Saka Tinubu Street, Victoria Island
+                                        {site.support_ng_address}
-                                        <br />Lagos, Nigeria
                                     </p>
 
                                 </div>
@@ -29,31 +49,31 @@ function Forms() {
                                     <h5>Phone</h5>
                                     <p>
                                         <i className="fal fa-phone"></i>
-                                        (+1) 404 855-7966
+                                        {site.support_phone}
                                         <br />
-                                        (+420) 336 476 328
+                                       {site.support_phone_ng}
                                     </p>
                                 </div>
                                 <div className="single-info">
                                     <h5>Support</h5>
                                     <p>
                                         <i className="fal fa-envelope"></i>
-                                        support@wrenchboard.com
+                                        {site.support_email}
                                        
                                     </p>
                                 </div>
                                 <div className="ab-social">
                                     <h5>Follow Us</h5>
-                                    <a className="fac" href="https://www.facebook.com/wrenchboard">
+                                    <a className="fac" href={site.facebook_link}>
                                         <i className="fab fa-facebook-f"></i>
                                     </a>
-                                    <a className="twi" href="https://www.twitter.com/wrenchboard/">
+                                    <a className="twi" href={site.twitter_link}>
                                         <i className="fab fa-twitter"></i>
                                     </a>
                                     <a className="you" href="#">
                                         <i className="fab fa-youtube"></i>
                                     </a>
-                                    <a className="lin" href="https://www.linkedin.com/company/wrenchboard/">
+                                    <a className="lin" href={site.linked_link}>
                                         <i className="fab fa-linkedin-in"></i>
                                     </a>
                                 </div>
@@ -62,7 +82,7 @@ function Forms() {
                         <div className="col-md-8">
                             <div className="contact-form">
                                 <h4>Let’s Connect</h4>
-                                <form action="#" method="post" className="row">
+                                <form onSubmit={handleSubmit} className="row">
                                     <div className="col-md-6">
                                         <input type="text" name="f-name" placeholder="First Name" />
                                     </div>
@@ -84,7 +104,7 @@ function Forms() {
                                         />
                                     </div>
                                     <div className="col-md-12">
-                                        <input type="text" name="suject" placeholder="Subject" />
+                                        <input type="text" name="subject" placeholder="Subject" />
                                     </div>
                                     <div className="col-md-12">
                                         <textarea
@@ -94,7 +114,7 @@ function Forms() {
                                     </div>
                                     <div className="col-md-6">
                                         <div className="condition-check">
-                                            <input id="terms-conditions" type="checkbox" />
+                                            <input id="terms-conditions" name="terms-conditions" type="checkbox" />
                                             <label htmlFor="terms-conditions">
                                                 I agree to the <a href="#">Terms & Conditions</a>
                                             </label>