contact.ejs 10.4 KB
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <title>Contact Us | Leadstec</title>
  <meta content="width=device-width, initial-scale=1.0" name="viewport">
  <meta content="Leads Technologies Ltd.,Leadstec,Contact Us,Contact Information,Company Address,Phone Number,Company Email,Experience Product,After-sales Service, Training,Cooperation Consultation,Message" name="keywords">
  <meta content="Welcome to contact Leadstec by phone, email or message for product consultation, cooperation negotiation, advice and after-sales service." name="description">

  <!-- Favicons -->
  <link href="../img/favicon.ico" rel="icon">
  <link href="../img/apple-touch-icon.png" rel="apple-touch-icon">

  <%- include('headlib'); -%>
    

    <!-- Event snippet for 联系我们 conversion page -->
    <script>
        window.addEventListener("DOMContentLoaded", function(event) { 
            document.querySelector('[type="submit"]').addEventListener('click',function(){
            var name = document.querySelector('[name="name"]').value;
            var email = document.querySelector('[name="email"]').value;
            var captcha = document.querySelector('[name="captcha"]').value;
            var message = document.querySelector('[name="message"]').value;
            var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
                if (name!="" &&  message !="" && email.match(mailformat)){
                    gtag('event', 'conversion', {'send_to': 'AW-732763526/yWk1CJjbxdEBEIartN0C'});
                };
            });
        });
    </script>
</head>

<body>

  <!--==========================
  Header
  ============================-->
  <header id="header" class="fixed-top">
    <%- include('header'); -%>
  </header><!-- #header -->

  <!--==========================
    Intro Section
  ============================-->

  <main id="main">

        <section id="map" class="clearfix">
            
          <header class="section-header">
        <h3>Location</h3>
        </header>
        
            <div class="container">         
            <div class="row">
                
                <div class="col-md-4">
                    <div id="allmap" ></div>                        
                    <h4 class="font-bold">Guangzhou</h4><br/>
                    
                    <i class="ion-ios-location-outline"></i>
                    <div class="address">
                        <span>Add: </span><span>Room 903A Fuli Commercial Building,23 Zhongshanba Road,Liwan District, Guangzhou</span><br/><br/>
                    </div>
                    
                    <i class="ion-ios-telephone-outline"></i>
                    <span>Tel:</span><span>+86 20 8100 0647</span><br/><br/>
                    
                    <i class="ion-ios-email-outline"></i>
                    <span>E-mail: </span><span>sales@list.leadstecgz.com</span><br/><br/>
                </div>
                
                <div class="col-md-4">
                    <div id="allmap1" ></div>
                    <h4 class="font-bold">Hong Kong</h4><br/>
                    
                    <i class="ion-ios-location-outline"></i>
                    <div class="address">
                        <span>Add: </span><span>16/F, 700 Nathan Road, Mong Kok, Kowloon, Hong Kong</span><br/><br/>
                    </div>
                    
                    <i class="ion-ios-telephone-outline"></i>
                    <span>Tel: </span><span>+852 3483 6928</span><br/><br/>
                    
                    <i class="ion-ios-email-outline"></i>
                    <span>E-mail: </span><span>sales@list.leadstecgz.com</span><br/><br/>
                </div> 
                
                <div class="col-md-4">
                    <div id="allmap2" ></div>

                    <h4 class="font-bold">Beijing</h4><br/>
                    
                    <i class="ion-ios-location-outline"></i>
                    <div class="address">
                        <span>Add: </span><span>Room 1112, Block A, Tower 1, WangJing SOHO, 10 WangJing Street, ChaoYang District, Beijing</span><br/><br/>
                    </div>
                    
                    <!--<i class="ion-ios-telephone-outline"></i>
                    <span>Tel: </span><span>+86 10 6482 0755</span><br/><br/>-->
                    
                    <i class="ion-ios-email-outline"></i>
                    <span>E-mail: </span><span>sales@list.leadstecgz.com</span><br/><br/>
                </div> 
                
            </div>
        </div>
        </section><!-- #map -->
        
        <!--==========================
      Contact Section
    ============================-->
    <section id="contact" class="section-bg">
      <div class="container-fluid">

        <div class="section-header">
          <h3>Contact Us</h3>
          <p>For product trial, product demo, and cooperation.</p>
        </div>

        <div class="row wow">
          <div class="col-lg-12">
            <div class="form">
              <div class="container">
                <form action="/sendCustomerInfoToEmailAndErp" method="post" role="form" class="contactForm">
                
                    <div class="form-row">
                      <div class="form-group col-lg-6">
                        <input type="text" name="name" class="form-control" id="name" placeholder="Your Name" data-rule="minlen:1" data-msg="Please input your name" />
                        <div class="validation"></div>
                      </div>
                      <div class="form-group col-lg-6">
                        <input type="text" class="form-control" name="company" id="company" placeholder="Your Company" data-rule="minlen:1" data-msg="Please input your company" />
                        <div class="validation"></div>
                      </div>
                    </div>
                    
                    <div class="form-row">
                      <div class="form-group col-lg-6">
                        <input type="text" name="phone" class="form-control" id="phone" placeholder="Your Phone" data-rule="regexp:(\w+?)(\d+)\b$" data-msg="Please input correct phone number" />
                        <div class="validation"></div>
                      </div>
                      <div class="form-group col-lg-6">
                        <input type="email" class="form-control" name="email" id="email" placeholder="Your Email" data-rule="email" data-msg="Please input your email" />
                        <div class="validation"></div>
                      </div>
                    </div>
    
                    <div class="form-group">
                      <textarea class="form-control" name="message" rows="5" data-rule="required" data-msg="Please input your message" placeholder="Message"></textarea>
                      <div class="validation"></div>
                    </div>
                    
                    <div class="form-row captcha-form">
                      <div class="form-group col-lg-6">
                        <input type="text" name="captcha" class="form-control" id="captcha" data-rule="captcha" placeholder="Please input the captcha" data-msg="Please input the correct captcha" />
                        <div class="validation"></div>
                      </div>
                      <div class="form-group col-lg-6">
                          <a href="javascript:void(0);" >
                              <img src="/api/getCaptcha" alt="captcha">
                          </a>
                      </div>
                    </div>                    
                    
                    <div class="text-center"><button type="submit" title="Send Message">Submit</button></div>
                    
                  </form>
                  <div id="sendmessage" class="alert-success">Thank you for your message. We will process it as soon as possible.</div>
                  <div id="errormessage" class="alert-warning">lease resend the message or contact us by other ways.</div>
              </div>
            </div>
          </div>

        </div>

      </div>
    </section><!-- #contact -->
        
  </main>

  <!--==========================
    Footer
  ============================-->
  <footer id="footer">
    <%- include('footer'); -%>
  </footer><!-- #footer -->

  <a href="#" class="back-to-top"><i class="fa fa-chevron-up"></i></a>
  <!-- Uncomment below i you want to use a preloader -->
  <!-- <div id="preloader"></div> -->

  <!-- JavaScript Libraries -->
    

  <script type="text/javascript" src="https://webapi.amap.com/maps?v=1.4.14&key=ecf1f99e641030205321057ebdef1b9d"></script>
        <%- include('footlib'); -%> 
      <script type="text/javascript">

        var map = new AMap.Map('allmap', {
                zoom:15,//级别
                center: [113.2399034500, 23.1251857651],//中心点坐标
               lang: "en"
            });
        var marker = new AMap.Marker({
            position:[113.2399034500, 23.1251857651]//位置
        });
        map.add(marker);
        
        
        var map1 = new AMap.Map('allmap1', {
                zoom:15,//级别
                center: [114.1744230600, 22.3180088100],//中心点坐标
               lang: "en"
            });
        var marker1 = new AMap.Marker({
            position:[114.1744230600, 22.3180088100]//位置
        });
        map1.add(marker1);
        
        var map2 = new AMap.Map('allmap2', {
                zoom:15,//级别
                center: [116.4811223745, 39.9964872508],//中心点坐标
               lang: "en"
            });
        var marker2 = new AMap.Marker({
            position:[116.4811223745, 39.9964872508]//位置
        });
        map2.add(marker2);

        AMap.plugin(['AMap.ToolBar','AMap.MapType'],function(){//异步加载插件
            var toolbar = new AMap.ToolBar();
            map.addControl(toolbar);
        });
           
        AMap.plugin(['AMap.ToolBar','AMap.MapType'],function(){//异步加载插件
            var toolbar = new AMap.ToolBar();
            map1.addControl(toolbar);
        });

        AMap.plugin(['AMap.ToolBar','AMap.AdvancedInfoWindow'],function(){//异步加载插件
            var toolbar = new AMap.ToolBar();
            map2.addControl(toolbar);
            var advancedInfoWindow = new AMap.AdvancedInfoWindow();
            map2.addControl(advancedInfoWindow);
        });
        
        
        
    </script>
  

</body>

</html>