.

hotfusion · Oct 23, 2024 · 771b331 · 771b331
1 parent 9b1197e
commit 771b331
Show file tree

Hide file tree

Showing 4 changed files with 63 additions and 18 deletions.
diff --git a/src/view/hotfusion/index.html b/src/view/hotfusion/index.html
@@ -2,9 +2,8 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + Vue + TS</title>
+    <title>HotFusion.ca</title>
   </head>
   <body>
     <div id="app"></div>

diff --git a/src/view/hotfusion/package.json b/src/view/hotfusion/package.json
@@ -5,7 +5,7 @@
   "type": "module",
   "scripts": {
     "dev": "vite",
-    "build": "vue-tsc -b && vite build",
+    "build": "vite build",
     "preview": "vite preview"
   },
   "dependencies": {

diff --git a/src/view/hotfusion/src/pages/contactus.vue b/src/view/hotfusion/src/pages/contactus.vue
@@ -1,5 +1,5 @@
 <script  lang="ts">
-import {Layout,Component,Components, Element} from "@hotfusion/ui"
+import {Fetch,Layout,Component,Components, Element, Warning} from "@hotfusion/ui"
 import * as KUTE from "kute.js";
 export default {
   props:['enable'],
@@ -19,16 +19,65 @@ export default {
     this.Layout.push(
         new Component( Components.form,{
           elements : [
-            new Element('input').setId('name').setLabel('Full Name').setIcon('fas fa-user').setPlaceholder('Enter your last and first name').setDisable(true).setType((value) => {
-              throw new Error('error')
-            }),
-            new Element('input').setId('email').setLabel('Email Address').setIcon('fas fa-at').setPlaceholder('Enter your email address').setDisable(true),
-            new Element('input').setId('phone').setLabel('Phone Number').setIcon('fas fa-phone').setPlaceholder('Enter your phone number').setDisable(true),
-            new Element('textarea').setId('message').setLabel('Message').setIcon('fas fa-envelope-square').setPlaceholder('Enter your message').setDisable(true)
+            new Element('input')
+                .setId('name')
+                .setValue('vadim')
+                .setLabel('Full Name')
+                .setIcon('fas fa-user')
+                .setPlaceholder('Enter your last and first name')
+                .setDisable(true)
+                .setMinValueLength(4)
+                .setMaxValueLength(100),
+            new Element('input')
+                .setValue('[email protected]')
+                .setId('email')
+                .setLabel('Email Address')
+                .setIcon('fas fa-at')
+                .setPlaceholder('Enter your email address')
+                .setDisable(true)
+                .setMinValueLength(4)
+                .setMaxValueLength(100)
+                .setType((event, element) => {
+                  let email = element.getValue()?.split('@')
+                  if(!email?.[1] || !email?.[1]?.split('.')?.[1] || email[1].split('.')?.[1]?.length < 2)
+                    throw new Error('The email address is not valid');
+                }),
+            new Element('input')
+                .setValue('5149996659')
+                .setId('phone')
+                .setLabel('Phone Number')
+                .setIcon('fas fa-phone')
+                .setPlaceholder('Enter your phone number')
+                .setDisable(true)
+                .setMinValueLength(9)
+                .setMaxValueLength(11)
+                .setType((event, element) => {
+                  let phone = element.getValue()
+                  if(isNaN(phone))
+                    throw new Error('The phone number is not valid');
+                }),
+            new Element('textarea')
+                .setValue('Hello, my name is vadim and i am looking for someone to work with!')
+                .setId('message')
+                .setLabel('Message')
+                .setIcon('fas fa-envelope-square')
+                .setPlaceholder('Enter your message')
+                .setDisable(true)
+                .setMinValueLength(20)
+                .setMaxValueLength(2000)
+
           ],
           footer : [
-              new Element('button').setLabel('Send us a message')
+              new Element('button').setLabel('Send us a message').setDisable(true).on('click', ({element}) => {
+                element.setBusy(true);
+                Fetch.post('https://hotfusion.ca/cgi-bin/mail.php',this.Layout[0].component.getFormAsObject()).then(e => {
+                  console.log('retrun',e);
+                })
+              })
           ]
+        }).on('keydown',async () => {
+          let isValid = this.Layout[0].component.isValid()
+            this.Layout[0].component.footer[0].setDisable(!isValid);
         })
     );
     setTimeout(() => {

diff --git a/src/view/hotfusion/src/pages/pricelist.vue b/src/view/hotfusion/src/pages/pricelist.vue
@@ -14,15 +14,15 @@ export default {
   }),
   methods : {
     onSlideChange(e){
-      this.activeIndex = e.activeIndex;
+      this.activeIndex
+          = e.activeIndex;
+
       setTimeout(() => {
         let p = [...this.$el.querySelectorAll('.paragraph')];
-
         p.forEach((x, i) => {
           if (i === e.activeIndex) {
-
             let element = x.querySelector('h1');
-            element.innerHTML = '';
+                element.innerHTML = '';
             KUTE.default.to(element, {text: element.getAttribute('value')}).start();
           }
         })
@@ -52,9 +52,6 @@ export default {
     <swiper-slide>
       <div class="paragraph" center>
         <div class="icon">
-          <div class="cube"></div>
-          <div class="circle"></div>
-          <div class="triangle"></div>
           <i class="fas fa-cash-register"></i>
         </div>
         <h1 value="How much our service cost?"></h1>