Lene il y a 4 ans
Parent
révision
31ebc4c8d5

+ 31
- 1
public/css/newStyle.css Voir le fichier

@@ -287,7 +287,8 @@ h3 {
287 287
 }
288 288
 
289 289
 #intro #intro-carousel .item {
290
-  height: 700px;
290
+  height: 550px;
291
+  object-fit: cover;
291 292
   display: block;
292 293
   background-size: center;
293 294
   background-position: center center;
@@ -296,6 +297,35 @@ h3 {
296 297
   transition-property: opacity;
297 298
 }
298 299
 
300
+/* Extra small devices (phones, 600px and down) */
301
+@media only screen and (max-width: 600px) {
302
+  #intro #intro-carousel .item {
303
+    height: 750px;
304
+  }
305
+}
306
+
307
+/* Small devices (portrait tablets and large phones, 600px and up) */
308
+@media only screen and (min-width: 600px) {
309
+  #intro #intro-carousel .item {
310
+    height: 660px;
311
+  }
312
+}
313
+
314
+/* Medium devices (landscape tablets, 768px and up) */
315
+@media only screen and (min-width: 768px) {
316
+  #intro #intro-carousel .item {
317
+    height: 550px;
318
+  }
319
+}
320
+
321
+/* Large devices (laptops/desktops, 992px and up) */
322
+@media only screen and (min-width: 992px) {
323
+}
324
+
325
+/* Extra large devices (large laptops and desktops, 1200px and up) */
326
+@media only screen and (min-width: 1200px) {
327
+}
328
+
299 329
 /*--------------------------------------------------------------
300 330
 # Buttons
301 331
 --------------------------------------------------------------*/

+ 36
- 6
src/components/about/aboutTimeshareCarouselSection.vue Voir le fichier

@@ -24,12 +24,42 @@
24 24
       style="margin-top:-50px"
25 25
       :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
26 26
     >
27
-      <img class="item" src="../../../public/img/intro-carousel/timeshare-1.jpg" alt="" />
28
-      <img class="item" src="../../../public/img/intro-carousel/timeshare-2.jpg" alt="" />
29
-      <img class="item" src="../../../public/img/intro-carousel/timeshare-3.jpg" alt="" />
30
-      <img class="item" src="../../../public/img/intro-carousel/timeshare-4.jpg" alt="" />
31
-      <img class="item" src="../../../public/img/intro-carousel/timeshare-5.jpg" alt="" />
32
-      <img class="item" src="../../../public/img/intro-carousel/timeshare-6.jpg" alt="" />
27
+      <img
28
+        class="item"
29
+        src="/img/intro-carousel/timeshare-1.jpg"
30
+        style="object-fit: cover"
31
+        alt=""
32
+      />
33
+      <img
34
+        class="item"
35
+        src="/img/intro-carousel/timeshare-2.jpg"
36
+        style="object-fit: cover"
37
+        alt=""
38
+      />
39
+      <img
40
+        class="item"
41
+        src="/img/intro-carousel/timeshare-3.jpg"
42
+        style="object-fit: cover"
43
+        alt=""
44
+      />
45
+      <img
46
+        class="item"
47
+        src="/img/intro-carousel/timeshare-4.jpg"
48
+        style="object-fit: cover"
49
+        alt=""
50
+      />
51
+      <img
52
+        class="item"
53
+        src="/img/intro-carousel/timeshare-5.jpg"
54
+        style="object-fit: cover"
55
+        alt=""
56
+      />
57
+      <img
58
+        class="item"
59
+        src="/img/intro-carousel/timeshare-6.jpg"
60
+        style="object-fit: cover"
61
+        alt=""
62
+      />
33 63
     </carousel>
34 64
 
35 65
     <div id="intro-carousel" class="owl-carousel"></div>

+ 6
- 6
src/components/about/aboutUsCarouselSection.vue Voir le fichier

@@ -26,12 +26,12 @@
26 26
       style="margin-top:-50px"
27 27
       :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
28 28
     >
29
-      <img class="item" src="../../../public/img/intro-carousel/home-1.jpg" alt="" />
30
-      <img class="item" src="../../../public/img/intro-carousel/home-2.jpg" alt="" />
31
-      <img class="item" src="../../../public/img/intro-carousel/home-3.jpg" alt="" />
32
-      <img class="item" src="../../../public/img/intro-carousel/home-4.jpg" alt="" />
33
-      <img class="item" src="../../../public/img/intro-carousel/home-5.jpg" alt="" />
34
-      <img class="item" src="../../../public/img/intro-carousel/home-6.jpg" alt="" />
29
+      <img class="item" src="/img/intro-carousel/home-1.jpg" style="object-fit: cover" alt="" />
30
+      <img class="item" src="/img/intro-carousel/home-2.jpg" style="object-fit: cover" alt="" />
31
+      <img class="item" src="/img/intro-carousel/home-3.jpg" style="object-fit: cover" alt="" />
32
+      <img class="item" src="/img/intro-carousel/home-4.jpg" style="object-fit: cover" alt="" />
33
+      <img class="item" src="/img/intro-carousel/home-5.jpg" style="object-fit: cover" alt="" />
34
+      <img class="item" src="/img/intro-carousel/home-6.jpg" style="object-fit: cover" alt="" />
35 35
     </carousel>
36 36
 
37 37
     <div id="intro-carousel" class="owl-carousel"></div>

+ 41
- 10
src/components/home/carouselSection.vue Voir le fichier

@@ -2,10 +2,9 @@
2 2
   <section id="intro">
3 3
     <div class="container">
4 4
       <div class="row">
5
-        <div align="left" class="col-sm-12 col-md-8">
6
-          <div class="intro-content">
5
+        <div align="left" class="col-sm-12 col-md-12 col-lg-8">
6
+          <div class="intro-content introContentAdjust">
7 7
             <h2>Find your perfect Property</h2>
8
-
9 8
             <ul class="nav nav-pills mb-3" id="pills-tab" role="tablist">
10 9
               <li class="nav-item">
11 10
                 <a
@@ -175,12 +174,12 @@
175 174
       style="margin-top:-50px"
176 175
       :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
177 176
     >
178
-      <img class="item" src="../../../public/img/intro-carousel/home-1.jpg" alt="" />
179
-      <img class="item" src="../../../public/img/intro-carousel/home-2.jpg" alt="" />
180
-      <img class="item" src="../../../public/img/intro-carousel/home-3.jpg" alt="" />
181
-      <img class="item" src="../../../public/img/intro-carousel/home-4.jpg" alt="" />
182
-      <img class="item" src="../../../public/img/intro-carousel/home-5.jpg" alt="" />
183
-      <img class="item" src="../../../public/img/intro-carousel/home-6.jpg" alt="" />
177
+      <img class="item" src="/img/intro-carousel/home-1.jpg" style="object-fit: cover" alt="" />
178
+      <img class="item" src="/img/intro-carousel/home-2.jpg" style="object-fit: cover" alt="" />
179
+      <img class="item" src="/img/intro-carousel/home-3.jpg" style="object-fit: cover" alt="" />
180
+      <img class="item" src="/img/intro-carousel/home-4.jpg" style="object-fit: cover" alt="" />
181
+      <img class="item" src="/img/intro-carousel/home-5.jpg" style="object-fit: cover" alt="" />
182
+      <img class="item" src="/img/intro-carousel/home-6.jpg" style="object-fit: cover" alt="" />
184 183
     </carousel>
185 184
 
186 185
     <div id="intro-carousel" class="owl-carousel"></div>
@@ -264,4 +263,36 @@ export default {
264 263
 };
265 264
 </script>
266 265
 
267
-<style lang="scss" scoped></style>
266
+<style lang="scss" scoped>
267
+/* Extra small devices (phones, 600px and down) */
268
+@media only screen and (max-width: 600px) {
269
+  .introContentAdjust {
270
+    margin-top: -35px !important;
271
+  }
272
+}
273
+
274
+/* Small devices (portrait tablets and large phones, 600px and up) */
275
+@media only screen and (min-width: 600px) {
276
+  .introContentAdjust {
277
+    margin-top: -15px !important;
278
+  }
279
+}
280
+
281
+/* Medium devices (landscape tablets, 768px and up) */
282
+@media only screen and (min-width: 768px) {
283
+}
284
+
285
+/* Large devices (laptops/desktops, 992px and up) */
286
+@media only screen and (min-width: 992px) {
287
+  .introContentAdjust {
288
+    margin-top: 25px !important;
289
+  }
290
+}
291
+
292
+/* Extra large devices (large laptops and desktops, 1200px and up) */
293
+@media only screen and (min-width: 1200px) {
294
+  .introContentAdjust {
295
+    margin-top: 0px !important;
296
+  }
297
+}
298
+</style>

+ 6
- 6
src/components/misc/privacyPolicy/carouselSection.vue Voir le fichier

@@ -25,12 +25,12 @@
25 25
       style="margin-top:-50px"
26 26
       :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
27 27
     >
28
-      <img class="item" src="/img/intro-carousel/home-1.jpg" alt="" />
29
-      <img class="item" src="/img/intro-carousel/home-2.jpg" alt="" />
30
-      <img class="item" src="/img/intro-carousel/home-3.jpg" alt="" />
31
-      <img class="item" src="/img/intro-carousel/home-4.jpg" alt="" />
32
-      <img class="item" src="/img/intro-carousel/home-5.jpg" alt="" />
33
-      <img class="item" src="/img/intro-carousel/home-6.jpg" alt="" />
28
+      <img class="item" src="/img/intro-carousel/home-1.jpg" style="object-fit: cover" alt="" />
29
+      <img class="item" src="/img/intro-carousel/home-2.jpg" style="object-fit: cover" alt="" />
30
+      <img class="item" src="/img/intro-carousel/home-3.jpg" style="object-fit: cover" alt="" />
31
+      <img class="item" src="/img/intro-carousel/home-4.jpg" style="object-fit: cover" alt="" />
32
+      <img class="item" src="/img/intro-carousel/home-5.jpg" style="object-fit: cover" alt="" />
33
+      <img class="item" src="/img/intro-carousel/home-6.jpg" style="object-fit: cover" alt="" />
34 34
     </carousel>
35 35
 
36 36
     <div id="intro-carousel" class="owl-carousel"></div>

+ 39
- 41
src/components/processFlow/makeOffer.vue Voir le fichier

@@ -10,9 +10,7 @@
10 10
         class="btn btn-b-n"
11 11
         style="width: 150px; height:40px;"
12 12
         data-dismiss="modal"
13
-      >
14
-        OK
15
-      </button>
13
+      >OK</button>
16 14
     </div>
17 15
     <div v-else>
18 16
       <div v-if="!isSaved">
@@ -84,27 +82,26 @@
84 82
       <div v-if="!isSaved" class="container">
85 83
         <div class="row">
86 84
           <div algin="center" class="col">
87
-            <button v-if="isMakeOffer" type="button" @click="SendOffer()" class="btn-solid-blue">
88
-              Send Offer
89
-            </button>
85
+            <button
86
+              v-if="isMakeOffer"
87
+              type="button"
88
+              @click="SendOffer()"
89
+              class="btn-solid-blue"
90
+            >Send Offer</button>
90 91
             <button
91 92
               v-if="!isMakeOffer && !isDecline && canEdit"
92 93
               type="submit"
93 94
               @click="Accept()"
94 95
               class="btn btn-b-n"
95 96
               style="width: 150px; height:40px;"
96
-            >
97
-              Accept
98
-            </button>
97
+            >Accept</button>
99 98
             <button
100 99
               v-if="!isMakeOffer && !isDecline && canEdit"
101 100
               type="button"
102 101
               @click="Decline()"
103 102
               class="btn btn-b-n"
104 103
               style="width: 150px; height:40px;"
105
-            >
106
-              Decline
107
-            </button>
104
+            >Decline</button>
108 105
           </div>
109 106
         </div>
110 107
       </div>
@@ -126,9 +123,7 @@
126 123
         @click="Complete()"
127 124
         class="btn btn-b-n"
128 125
         style="width: 150px; height:40px;"
129
-      >
130
-        Complete
131
-      </button>
126
+      >Complete</button>
132 127
       <div v-if="isSaved">
133 128
         <div class="form-group row">
134 129
           <br />
@@ -142,9 +137,7 @@
142 137
           class="btn btn-b-n"
143 138
           style="width: 150px; height:40px;"
144 139
           data-dismiss="modal"
145
-        >
146
-          OK
147
-        </button>
140
+        >OK</button>
148 141
       </div>
149 142
     </div>
150 143
   </div>
@@ -163,7 +156,7 @@ export default {
163 156
     canEdit: Boolean,
164 157
     item: Object,
165 158
     bidId: Number,
166
-    updateItem: Function
159
+    updateItem: Function,
167 160
   },
168 161
   data() {
169 162
     return {
@@ -171,28 +164,30 @@ export default {
171 164
       isSaved: false,
172 165
       message: "",
173 166
       isInfo: true,
174
-      isLoggedIn: Log.isLoggedIn()
167
+      isLoggedIn: Log.isLoggedIn(),
175 168
     };
176 169
   },
177 170
   methods: {
178
-    ...mapActions("bid", ["getBid", "saveBid", "acceptBid", "declineBid"]),
171
+    ...mapActions("bid", ["getTemplate", "saveBid", "acceptBid", "declineBid"]),
179 172
     SendOffer() {
180
-      alert("Under Development");
181
-      // this.getBid(0);
182
-      // this.bidItem.id = 0;
183
-      // this.bidItem.amount = this.item.offer;
184
-      // this.bidItem.comment = this.item.comment;
185
-      // if (this.isProperty) {
186
-      //   this.bidItem.propertyId = this.item.id;
187
-      // } else {
188
-      //   this.bidItem.timeshareWeekId = this.item.id;
189
-      // }
190
-      // this.saveBid(this.bidItem);
173
+      //alert("Under Development");
174
+      this.bidItem.id = 0;
175
+
176
+      this.bidItem.amount = this.item.offer;
177
+      this.bidItem.comment = this.item.comment;
178
+      if (this.isProperty) {
179
+        this.bidItem.propertyId = this.item.id;
180
+      } else {
181
+        this.bidItem.timeshareWeekId = this.item.id;
182
+        if (this.item.isTender) {
183
+          this.bidItem.tenderWeek = this.item;
184
+        }
185
+      }
186
+      this.saveBid(this.bidItem);
191 187
 
192
-      // this.item = [];
193
-      // this.isSaved = true;
194
-      // this.message = "Offer was submitted.";
195
-      // this.isInfo = true;
188
+      this.isSaved = true;
189
+      this.isInfo = true;
190
+      this.message = "Offer was submitted.";
196 191
     },
197 192
     Accept() {
198 193
       this.acceptBid(this.item.id);
@@ -208,24 +203,27 @@ export default {
208 203
 
209 204
       const decline = {
210 205
         id: this.item.id,
211
-        comment: this.item.declineReason
206
+        comment: this.item.declineReason,
212 207
       };
213 208
 
214 209
       this.declineBid(decline);
215 210
       this.isSaved = true;
216 211
       this.message = "Offer Declined.";
217 212
       this.isInfo = false;
218
-    }
213
+    },
219 214
   },
220 215
   computed: {
221
-    ...mapState("bid", ["bidIt,em"])
216
+    ...mapState("bid", ["bidItem"]),
217
+  },
218
+  mounted() {
219
+    this.getTemplate();
222 220
   },
223 221
   watch: {
224 222
     item() {
225 223
       this.isSaved = false;
226 224
       this.canEdit = this.item.statusCode === "E1";
227
-    }
228
-  }
225
+    },
226
+  },
229 227
 };
230 228
 </script>
231 229
 

+ 36
- 6
src/components/property/residential/residentialCarouselSection.vue Voir le fichier

@@ -177,12 +177,42 @@
177 177
         style="margin-top:-50px"
178 178
         :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
179 179
       >
180
-        <img class="item" src="img/intro-carousel/residential-1.jpg" alt="" />
181
-        <img class="item" src="img/intro-carousel/residential-2.jpg" alt="" />
182
-        <img class="item" src="img/intro-carousel/residential-3.jpg" alt="" />
183
-        <img class="item" src="img/intro-carousel/residential-4.jpg" alt="" />
184
-        <img class="item" src="img/intro-carousel/residential-5.jpg" alt="" />
185
-        <img class="item" src="img/intro-carousel/residential-6.jpg" alt="" />
180
+        <img
181
+          class="item"
182
+          src="img/intro-carousel/residential-1.jpg"
183
+          style="object-fit: cover"
184
+          alt=""
185
+        />
186
+        <img
187
+          class="item"
188
+          src="img/intro-carousel/residential-2.jpg"
189
+          style="object-fit: cover"
190
+          alt=""
191
+        />
192
+        <img
193
+          class="item"
194
+          src="img/intro-carousel/residential-3.jpg"
195
+          style="object-fit: cover"
196
+          alt=""
197
+        />
198
+        <img
199
+          class="item"
200
+          src="img/intro-carousel/residential-4.jpg"
201
+          style="object-fit: cover"
202
+          alt=""
203
+        />
204
+        <img
205
+          class="item"
206
+          src="img/intro-carousel/residential-5.jpg"
207
+          style="object-fit: cover"
208
+          alt=""
209
+        />
210
+        <img
211
+          class="item"
212
+          src="img/intro-carousel/residential-6.jpg"
213
+          style="object-fit: cover"
214
+          alt=""
215
+        />
186 216
       </carousel>
187 217
     </section>
188 218
     <main id="main" style="margin-top:-20px">

+ 8
- 7
src/components/propertyManagement/carouselSection.vue Voir le fichier

@@ -24,16 +24,17 @@
24 24
       :items="1"
25 25
       :autoplay="true"
26 26
       :loop="true"
27
+      :autoHeight="true"
27 28
       id="intro-carousel"
28
-      style="margin-top:-50px"
29
+      style="margin-top:-50px;"
29 30
       :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
30 31
     >
31
-      <img class="item" src="../../../public/img/intro-carousel/home-1.jpg" alt="" />
32
-      <img class="item" src="../../../public/img/intro-carousel/16.jpg" alt="" />
33
-      <img class="item" src="../../../public/img/intro-carousel/comm-1.jpg" alt="" />
34
-      <img class="item" src="../../../public/img/intro-carousel/comm-4.jpg" alt="" />
35
-      <img class="item" src="../../../public/img/intro-carousel/3.jpg" alt="" />
36
-      <img class="item" src="../../../public/img/intro-carousel/home-5.jpg" alt="" />
32
+      <img class="item" src="/img/intro-carousel/home-1.jpg" alt="" />
33
+      <img class="item" src="/img/intro-carousel/16.jpg" alt="" />
34
+      <img class="item" src="/img/intro-carousel/comm-1.jpg" alt="" />
35
+      <img class="item" src="/img/intro-carousel/comm-4.jpg" alt="" />
36
+      <img class="item" src="/img/intro-carousel/3.jpg" alt="" />
37
+      <img class="item" src="/img/intro-carousel/home-5.jpg" alt="" />
37 38
     </carousel>
38 39
 
39 40
     <div id="intro-carousel" class="owl-carousel"></div>

+ 76
- 0
src/components/shared/addressAutoComplete.vue Voir le fichier

@@ -0,0 +1,76 @@
1
+<template>
2
+  <div>
3
+    <gmap-autocomplete class="form-control" @place_changed="setPlace"></gmap-autocomplete>
4
+  </div>
5
+</template>
6
+
7
+<script>
8
+export default {
9
+  name: "AddressAutoComplete",
10
+  props: {
11
+    placeholder: {
12
+      default: "ENTER LOCATION"
13
+    }
14
+  },
15
+  data() {
16
+    return {
17
+      streetNumber: "",
18
+      streetName: "",
19
+      suburb: "",
20
+      city: "",
21
+      province: "",
22
+      country: "",
23
+      postalCode: "",
24
+      url: ""
25
+    };
26
+  },
27
+  methods: {
28
+    setPlace(place) {
29
+      this.streetNumber = "";
30
+      this.streetName = "";
31
+      this.suburb = "";
32
+      this.city = "";
33
+      this.province = "";
34
+      this.country = "";
35
+      this.postalCode = "";
36
+      this.url = "";
37
+
38
+      for (let i = 0; i < place.address_components.length; i++) {
39
+        if (place.address_components[i].types[0] === "street_number") {
40
+          this.streetNumber = place.address_components[i].long_name;
41
+        }
42
+        if (place.address_components[i].types[0] === "route") {
43
+          this.streetName = place.address_components[i].long_name;
44
+        }
45
+        if (place.address_components[i].types[0] === "sublocality_level_1") {
46
+          this.suburb = place.address_components[i].long_name;
47
+        }
48
+        if (place.address_components[i].types[0] === "locality") {
49
+          this.city = place.address_components[i].long_name;
50
+        }
51
+        if (place.address_components[i].types[0] === "administrative_area_level_1") {
52
+          this.province = place.address_components[i].long_name;
53
+        }
54
+        if (place.address_components[i].types[0] === "country") {
55
+          this.country = place.address_components[i].long_name;
56
+        }
57
+        if (place.address_components[i].types[0] === "postal_code") {
58
+          this.postalCode = place.address_components[i].long_name;
59
+        }
60
+        this.url = place.url;
61
+
62
+        this.$emit("GoogleAddress", {
63
+          streetNumber: this.streetNumber,
64
+          streetName: this.streetName,
65
+          suburb: this.suburb,
66
+          city: this.city,
67
+          province: this.province,
68
+          country: this.country,
69
+          postalCode: this.postalCode,
70
+          url: this.url
71
+        });
72
+      }
73
+    }
74
+  }
75
+};
76
+</script>

+ 132
- 0
src/components/shared/contactUsSection.vue Voir le fichier

@@ -0,0 +1,132 @@
1
+<template>
2
+  <div>
3
+    <h4 align="left" class="contactHeader">Send us a message</h4>
4
+    <div class="form">
5
+      <div id="sendmessage">Your message has been sent. Thank you!</div>
6
+      <div id="errormessage"></div>
7
+      <div class="form-row">
8
+        <div class="form-group col-md-6">
9
+          <input
10
+            type="text"
11
+            name="name"
12
+            class="form-control"
13
+            id="name"
14
+            placeholder="Name"
15
+            data-rule="minlen:4"
16
+            data-msg="Please enter your name"
17
+            v-model="name"
18
+          />
19
+          <div class="validation"></div>
20
+        </div>
21
+        <div class="form-group col-md-6">
22
+          <input
23
+            type="email"
24
+            class="form-control"
25
+            name="email"
26
+            id="email"
27
+            placeholder="Email"
28
+            data-rule="email"
29
+            data-msg="Please enter a valid email"
30
+            v-model="email"
31
+          />
32
+          <div class="validation"></div>
33
+        </div>
34
+        <div class="form-group col-md-6">
35
+          <input
36
+            type="text"
37
+            name="phone"
38
+            class="form-control"
39
+            id="phone"
40
+            placeholder="Phone"
41
+            data-rule="minlen:10"
42
+            data-msg="Please enter at least 10 numbers"
43
+            v-model="phone"
44
+          />
45
+          <div class="validation"></div>
46
+        </div>
47
+        <div class="form-group col-md-6">
48
+          <input
49
+            type="text"
50
+            class="form-control"
51
+            name="property"
52
+            id="property"
53
+            placeholder="Property"
54
+            data-msg="Please enter the property you are interested in"
55
+            v-model="property"
56
+          />
57
+          <div class="validation"></div>
58
+        </div>
59
+      </div>
60
+      <div class="form-group">
61
+        <textarea
62
+          class="form-control"
63
+          name="message"
64
+          rows="5"
65
+          data-rule="required"
66
+          data-msg="Please write something for us"
67
+          placeholder="Message"
68
+          v-model="message"
69
+        ></textarea>
70
+        <div class="validation"></div>
71
+      </div>
72
+      <div class="text-center">
73
+        <button class="btn-solid-blue" @click="sendMail()">SEND</button>
74
+      </div>
75
+      <div v-if="boolSent">
76
+        <alert :text="alertMsg" :type="'SUCCESS'" />
77
+      </div>
78
+    </div>
79
+  </div>
80
+</template>
81
+
82
+<script>
83
+/* eslint-disable */
84
+import axios from "axios";
85
+import alert from "../shared/alert";
86
+
87
+export default {
88
+  components: {
89
+    alert
90
+  },
91
+  data() {
92
+    return {
93
+      alertMsg: "Sent! You can expect a reply soon!",
94
+      name: null,
95
+      email: null,
96
+      phone: null,
97
+      property: null,
98
+      message: null,
99
+      boolSent: false
100
+    };
101
+  },
102
+  mounted() {
103
+    this.boolSent = false;
104
+  },
105
+  methods: {
106
+    async sendMail() {
107
+      var mailObj = {
108
+        toAddress: "abigaildf@provision-sa.com",
109
+        fromAddress: "jlouw365@gmail.com",
110
+        name: this.name,
111
+        email: this.email,
112
+        phone: this.phone,
113
+        property: this.property,
114
+        message: this.message
115
+      };
116
+
117
+      const response = await axios.post("/api/mail/0", mailObj);
118
+
119
+      if (response.status === 200) {
120
+        this.boolSent = true;
121
+      } else {
122
+        console.log("Error");
123
+      }
124
+    },
125
+    countDownChanged(dismissCountDown) {
126
+      this.dismissCountDown = dismissCountDown;
127
+    }
128
+  }
129
+};
130
+</script>
131
+
132
+<style lang="scss" scoped></style>

+ 5
- 73
src/components/shared/footerSection.vue Voir le fichier

@@ -47,79 +47,7 @@
47 47
                 </p>
48 48
               </div>
49 49
               <div class="col-md-8">
50
-                <h4 align="left" class="contactHeader">Send us a message</h4>
51
-                <div class="form">
52
-                  <div id="sendmessage">Your message has been sent. Thank you!</div>
53
-                  <div id="errormessage"></div>
54
-                  <form
55
-                    action="mailto:jlouw365@gmail.com"
56
-                    method="post"
57
-                    role="form"
58
-                    class="contactForm"
59
-                  >
60
-                    <div class="form-row">
61
-                      <div class="form-group col-md-6">
62
-                        <input
63
-                          type="text"
64
-                          name="name"
65
-                          class="form-control"
66
-                          id="name"
67
-                          placeholder="Name"
68
-                          data-rule="minlen:4"
69
-                          data-msg="Please enter your name"
70
-                        />
71
-                        <div class="validation"></div>
72
-                      </div>
73
-                      <div class="form-group col-md-6">
74
-                        <input
75
-                          type="email"
76
-                          class="form-control"
77
-                          name="email"
78
-                          id="email"
79
-                          placeholder="Email"
80
-                          data-rule="email"
81
-                          data-msg="Please enter a valid email"
82
-                        />
83
-                        <div class="validation"></div>
84
-                      </div>
85
-                      <div class="form-group col-md-6">
86
-                        <input
87
-                          type="text"
88
-                          name="phone"
89
-                          class="form-control"
90
-                          id="phone"
91
-                          placeholder="Phone"
92
-                          data-rule="minlen:10"
93
-                          data-msg="Please enter at least 10 numbers"
94
-                        />
95
-                        <div class="validation"></div>
96
-                      </div>
97
-                      <div class="form-group col-md-6">
98
-                        <input
99
-                          type="text"
100
-                          class="form-control"
101
-                          name="property"
102
-                          id="property"
103
-                          placeholder="Property"
104
-                          data-msg="Please enter the property you are interested in"
105
-                        />
106
-                        <div class="validation"></div>
107
-                      </div>
108
-                    </div>
109
-                    <div class="form-group">
110
-                      <textarea
111
-                        class="form-control"
112
-                        name="message"
113
-                        rows="5"
114
-                        data-rule="required"
115
-                        data-msg="Please write something for us"
116
-                        placeholder="Message"
117
-                      ></textarea>
118
-                      <div class="validation"></div>
119
-                    </div>
120
-                    <div class="text-center"><button type="submit">SEND</button></div>
121
-                  </form>
122
-                </div>
50
+                <contactUsSection />
123 51
               </div>
124 52
             </div>
125 53
           </div>
@@ -188,9 +116,13 @@
188 116
 /* eslint-disable */
189 117
 import { mapState, mapActions } from "vuex";
190 118
 import Log from "../../assets/Log";
119
+import contactUsSection from "./contactUsSection";
191 120
 import AOS from "aos";
192 121
 import "aos/dist/aos.css";
193 122
 export default {
123
+  components: {
124
+    contactUsSection
125
+  },
194 126
   created() {
195 127
     AOS.init();
196 128
   },

+ 126
- 42
src/components/timeshare/buy/carouselSection.vue Voir le fichier

@@ -3,7 +3,7 @@
3 3
     <div class="container">
4 4
       <div class="row">
5 5
         <div align="left" class="col-sm-12 col-md-8">
6
-          <div class="intro-content box">
6
+          <div class="intro-content box" style="margin-top:-5px">
7 7
             <h2>Find your Timeshare</h2>
8 8
             <p>
9 9
               Please specify one or more details to view the available weeks and then select the
@@ -11,47 +11,68 @@
11 11
             </p>
12 12
             <div class="row">
13 13
               <div class="form-group col-md-6">
14
+                <div class="input-group">
15
+                  <label v-if="!searchParams.region" class="uniSelectLabel" for="region">REGION</label>
16
+                  <select
17
+                    class="form-control uniSelect"
18
+                    name="region"
19
+                    id="region"
20
+                    v-model="searchParams.region"
21
+                    @change="regionChange"
22
+                  >
23
+                    <option v-for="(region, r) in regions" :key="r">{{ region.regionName }}</option>
24
+                  </select>
25
+                </div>
26
+                <br />
27
+                <label>DATE FROM</label>
14 28
                 <input
15
-                  data-toggle="dropdown"
16
-                  name="region"
17
-                  class="form-control my-2"
18
-                  id="name"
19
-                  placeholder="Resort"
20
-                  aria-haspopup="true"
21
-                  aria-expanded="false"
22
-                />
23
-                <input
24
-                  data-toggle="dropdown"
25
-                  name="resort"
26
-                  class="form-control my-2"
27
-                  id="name"
28
-                  placeholder="Region"
29
-                  aria-haspopup="true"
30
-                  aria-expanded="false"
29
+                  type="date"
30
+                  name="arrival-to"
31
+                  class="form-control my-1 uniSelect"
32
+                  id="arrival-to"
33
+                  placeholder="Date From"
34
+                  v-model="filter.date"
31 35
                 />
32 36
               </div>
33 37
               <div class="form-group col-md-6">
38
+                <div class="input-group">
39
+                  <label
40
+                    v-if="!searchParams.resort"
41
+                    class="uniSelectLabel"
42
+                    for="weekInfoResortSelect"
43
+                  >RESORT</label>
44
+                  <select
45
+                    id="weekInfoResortSelect"
46
+                    class="form-control uniSelect"
47
+                    v-model="searchParams.resort"
48
+                  >
49
+                    <option
50
+                      v-for="(resort, r) in filteredResort"
51
+                      :key="r"
52
+                      :value="resort"
53
+                      @change="resortChange"
54
+                    >
55
+                      {{
56
+                      resort.resortName
57
+                      }}
58
+                    </option>
59
+                  </select>
60
+                </div>
61
+                <br />
62
+                <label>DATE TO</label>
34 63
                 <input
35
-                  data-toggle="dropdown"
36
-                  name="region"
37
-                  class="form-control my-2"
38
-                  id="name"
39
-                  placeholder="Week"
40
-                  aria-haspopup="true"
41
-                  aria-expanded="false"
42
-                />
43
-                <input
44
-                  data-toggle="dropdown"
45
-                  name="resort"
46
-                  class="form-control my-2"
47
-                  id="name"
48
-                  placeholder="Price Range"
49
-                  aria-haspopup="true"
50
-                  aria-expanded="false"
64
+                  type="date"
65
+                  name="arrival-to"
66
+                  class="form-control my-1 uniSelect"
67
+                  id="arrival-to"
68
+                  placeholder="Date To"
69
+                  v-model="filter.ddate"
51 70
                 />
52 71
               </div>
53 72
             </div>
54
-            <a href="resort-page.php" class="btn-solid-blue"><i class="fa fa-search"></i> SEARCH</a>
73
+            <button class="btn-solid-blue" @click="Search()">
74
+              <i class="fa fa-search"></i> SEARCH
75
+            </button>
55 76
           </div>
56 77
         </div>
57 78
       </div>
@@ -67,12 +88,12 @@
67 88
       style="margin-top:-50px"
68 89
       :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
69 90
     >
70
-      <img class="item" src="/img/intro-carousel/timeshare-1.jpg" alt="" />
71
-      <img class="item" src="/img/intro-carousel/timeshare-2.jpg" alt="" />
72
-      <img class="item" src="/img/intro-carousel/timeshare-3.jpg" alt="" />
73
-      <img class="item" src="/img/intro-carousel/timeshare-4.jpg" alt="" />
74
-      <img class="item" src="/img/intro-carousel/timeshare-5.jpg" alt="" />
75
-      <img class="item" src="/img/intro-carousel/timeshare-6.jpg" alt="" />
91
+      <img class="item" src="/img/intro-carousel/timeshare-1.jpg" style="object-fit: cover" alt />
92
+      <img class="item" src="/img/intro-carousel/timeshare-2.jpg" style="object-fit: cover" alt />
93
+      <img class="item" src="/img/intro-carousel/timeshare-3.jpg" style="object-fit: cover" alt />
94
+      <img class="item" src="/img/intro-carousel/timeshare-4.jpg" style="object-fit: cover" alt />
95
+      <img class="item" src="/img/intro-carousel/timeshare-5.jpg" style="object-fit: cover" alt />
96
+      <img class="item" src="/img/intro-carousel/timeshare-6.jpg" style="object-fit: cover" alt />
76 97
     </carousel>
77 98
 
78 99
     <div id="intro-carousel" class="owl-carousel"></div>
@@ -83,10 +104,73 @@
83 104
 /* eslint-disable */
84 105
 
85 106
 import carousel from "vue-owl-carousel";
107
+import { mapState, mapActions, mapGetters } from "vuex";
86 108
 export default {
87 109
   components: {
88
-    carousel
89
-  }
110
+    carousel,
111
+  },
112
+  data() {
113
+    return {
114
+      regionObj: {},
115
+      resortObj: {},
116
+      region: "",
117
+      resort: "",
118
+      priceMin: undefined,
119
+      priceMax: undefined,
120
+    };
121
+  },
122
+  methods: {
123
+    ...mapActions("timeshare", ["initTimeshare", "onResortChange", "saveWeek"]),
124
+    regionChange(item) {
125
+      let reg = this.regions.find((r) => r.regionName === item.target.value);
126
+      this.regionObj = reg;
127
+    },
128
+    resortChange(item) {
129
+      let res = this.resorts.find((r) => r.resortName === item.target.value);
130
+      this.resortObj = res;
131
+    },
132
+    Search() {
133
+      if (this.searchParams.price) {
134
+        this.filter.minPrice = this.searchParams.price;
135
+      }
136
+      if (this.searchParams.week) {
137
+        this.filter.keyword = this.week;
138
+      }
139
+
140
+      if (!this.searchParams.resort) {
141
+        return;
142
+      }
143
+
144
+      this.$router.push(`/resort/${this.searchParams.resort.resortCode}`);
145
+    },
146
+  },
147
+  computed: {
148
+    ...mapState("timeshare", ["resorts", "regions", "detailedRegion"]),
149
+    ...mapState("weekList", ["searchParams", "filter"]),
150
+    filteredResort() {
151
+      let list = [];
152
+      if (this.searchParams.region && this.searchParams.region !== "") {
153
+        const item = this.detailedRegion.find(
154
+          (region) => region.region.regionCode === this.regionObj.regionCode
155
+        );
156
+        if (item) {
157
+          list = item.children;
158
+        }
159
+      } else {
160
+        list = this.resorts;
161
+      }
162
+      return _.sortBy(list, (x) => x.resortName);
163
+    },
164
+  },
165
+  created() {
166
+    this.initTimeshare(this.weekId);
167
+  },
168
+  mounted() {
169
+    this.searchParams.region = null;
170
+    this.searchParams.resort = null;
171
+    this.filter.date = null;
172
+    this.filter.ddate = null;
173
+  },
90 174
 };
91 175
 </script>
92 176
 

+ 23
- 18
src/components/timeshare/buy/searchSection.vue Voir le fichier

@@ -29,20 +29,20 @@
29 29
               v-model="selectedResort"
30 30
               @change="resortEvent()"
31 31
             >
32
-              <option v-for="(resort, i) in selectedRegion.resorts" :key="i" :value="resort">
33
-                {{ resort.resortName }}
34
-              </option>
32
+              <option
33
+                v-for="(resort, i) in selectedRegion.resorts"
34
+                :key="i"
35
+                :value="resort"
36
+              >{{ resort.resortName }}</option>
35 37
             </select>
36 38
           </div>
37 39
           <div v-else class="input-group my-1">
38 40
             <label v-if="selectedResort === null" class="uniSelectLabel" for="resort">Resort</label>
39 41
             <select class="form-control uniSelect" name="resort" id="resort">
40
-              <option disabled>
41
-                Please Select a Region First
42
-              </option>
42
+              <option disabled>Please Select a Region First</option>
43 43
             </select>
44 44
           </div>
45
-          <div class="input-group my-1">
45
+          <!-- <div class="input-group my-1">
46 46
             <label v-if="selectedSeason === null" class="uniSelectLabel" for="season">Season</label>
47 47
             <select
48 48
               class="form-control uniSelect"
@@ -50,9 +50,7 @@
50 50
               id="season"
51 51
               v-model="selectedSeason"
52 52
             >
53
-              <option v-for="season in seasons" :key="season.id" :value="season">
54
-                {{ season.name }}
55
-              </option>
53
+              <option v-for="season in seasons" :key="season.id" :value="season">{{ season.name }}</option>
56 54
             </select>
57 55
           </div>
58 56
 
@@ -97,8 +95,10 @@
97 95
               placeholder="mm/dd/yy"
98 96
               v-model="dateTo"
99 97
             />
100
-          </p>
101
-          <div class="btn-white-border"><i class="fa fa-search"></i> SEARCH</div>
98
+          </p>-->
99
+          <button class="btn-white-border" @click="ShowResort()">
100
+            <i class="fa fa-search"></i> SEARCH
101
+          </button>
102 102
         </div>
103 103
         <div class="col-md-8 p-5">
104 104
           <h2>Search by Province</h2>
@@ -137,7 +137,7 @@ import Alert from "../../shared/alert.vue";
137 137
 export default {
138 138
   name: "TimeshareToBuy",
139 139
   components: {
140
-    Alert
140
+    Alert,
141 141
   },
142 142
   data() {
143 143
     return {
@@ -149,7 +149,7 @@ export default {
149 149
       bedrooms: null,
150 150
       maxPrice: null,
151 151
       dateFrom: "",
152
-      dateTo: ""
152
+      dateTo: "",
153 153
     };
154 154
   },
155 155
   mounted() {
@@ -163,8 +163,8 @@ export default {
163 163
       return `http://maps.google.com/maps?q=${this.myMap}&z=${this.myZoom}&output=embed`;
164 164
     },
165 165
     regions() {
166
-      return _.sortBy(this.detailedRegion, r => r.regionName);
167
-    }
166
+      return _.sortBy(this.detailedRegion, (r) => r.regionName);
167
+    },
168 168
   },
169 169
   methods: {
170 170
     ...mapActions("region", ["init", "getAvail", "getRegions", "getResort"]),
@@ -196,8 +196,13 @@ export default {
196 196
       if (this.maxPrice === "0") {
197 197
         this.maxPrice = null;
198 198
       }
199
-    }
200
-  }
199
+    },
200
+    ShowResort() {
201
+      if (this.selectedResort) {
202
+        this.$router.push(`/resort/${this.selectedResort.resortCode}`);
203
+      }
204
+    },
205
+  },
201 206
 };
202 207
 </script>
203 208
 

+ 51
- 0
src/components/timeshare/buy/toBuySearchResults.vue Voir le fichier

@@ -0,0 +1,51 @@
1
+<template>
2
+  <main id="main" style="margin-top:-20px; padding-bottom:50px">
3
+    <section>
4
+      <div class="container">
5
+        <div class="row pt-5 justify-content-md-center">
6
+          <h3>TIMESHARE TO BUY</h3>
7
+        </div>
8
+        <br />
9
+        <br />
10
+        <br />
11
+        <br />
12
+        <h1>bla</h1>
13
+        <!--<div v-if="properties.length > 0" class="row justify-content-md-center">
14
+          <div
15
+            class="col-lg-3 col-md-6 col-sm-6"
16
+            v-for="currentProperty in properties"
17
+            :key="currentProperty.id"
18
+          >
19
+            <div>
20
+              <div class="portfolio-item">
21
+                <img style="width:255px; height:255px" :src="currentProperty.displayImage" alt />
22
+
23
+                <h4 class="mt-3">{{ currentProperty.suburb }}</h4>
24
+                <p>
25
+                  Opposite Monument Park Spar, Pretoria! Secure Parking. A stand-alone building,
26
+                  situated in the best location. Incredible bargain!
27
+                </p>
28
+                <br />
29
+
30
+                <router-link
31
+                  class="btn-white-border"
32
+                  :to="`/property/commercial/property/${currentProperty.id}`"
33
+                >VIEW</router-link>
34
+              </div>
35
+            </div>
36
+          </div>
37
+        </div>
38
+        <div v-else class="row">
39
+          <div align="center" class="col-md-12">
40
+            <img src="img/no-homes.png" />
41
+            <br />
42
+            <br />
43
+            <p>Sorry no listing where found matching your search</p>
44
+          </div>
45
+        </div>-->
46
+      </div>
47
+    </section>
48
+  </main>
49
+</template>
50
+
51
+

+ 8
- 10
src/components/timeshare/buy/weekListComponent.vue Voir le fichier

@@ -5,7 +5,6 @@
5 5
         <thead>
6 6
           <tr>
7 7
             <th scope="col">Unit</th>
8
-            <th scope="col">Week</th>
9 8
             <th scope="col">Module</th>
10 9
             <th scope="col">Bedrooms</th>
11 10
             <th scope="col">Season</th>
@@ -17,15 +16,14 @@
17 16
           <tr v-for="(item, i) in filteredWeeks" :key="i">
18 17
             <td>{{ item.unitNumber }}</td>
19 18
             <td>{{ item.weekNumber }}</td>
20
-            <td>#module</td>
21 19
             <td>{{ item.bedrooms }}</td>
22
-            <td>#season</td>
20
+            <td>{{ item.season }}</td>
23 21
             <td>{{ item.sellPrice | toCurrency }}</td>
24 22
             <!-- <td>{{ item.region ? item.region.regionName : "" }}</td>
25 23
             <td>{{ item.resort ? item.resort.resortName : "" }}</td>
26 24
 
27 25
             <td>{{ item.arrivalDate | toDate }}</td>
28
-            <td>{{ item.departureDate | toDate }}</td> -->
26
+            <td>{{ item.departureDate | toDate }}</td>-->
29 27
 
30 28
             <!-- <td>{{item.status ? item.status.description : ''}}</td> -->
31 29
 
@@ -34,7 +32,7 @@
34 32
             </td>
35 33
             <!-- <div class="col-md-12">
36 34
                 <button type="button" class="btn btn-b-n" >View</button>
37
-              </div> -->
35
+            </div>-->
38 36
           </tr>
39 37
         </tbody>
40 38
       </table>
@@ -68,15 +66,15 @@ import { mapState, mapActions, mapGetters } from "vuex";
68 66
 export default {
69 67
   props: {
70 68
     resortCode: undefined,
71
-    userId: undefined
69
+    userId: undefined,
72 70
   },
73 71
   components: {},
74 72
   computed: {
75 73
     ...mapState("weekList", ["weeks", "status"]),
76 74
     ...mapGetters({
77 75
       filteredWeeks: "weekList/filteredWeeks",
78
-      getRegions: "weekList/getRegions"
79
-    })
76
+      getRegions: "weekList/getRegions",
77
+    }),
80 78
   },
81 79
   mounted() {
82 80
     if (this.resortCode) {
@@ -88,8 +86,8 @@ export default {
88 86
     View(item) {
89 87
       this.$router.push(`/resort/${item.resort.resortCode}/${item.unitNumber}`);
90 88
     },
91
-    ...mapActions("weekList", ["getWeeks", "applyResortFilter"])
92
-  }
89
+    ...mapActions("weekList", ["getWeeks", "applyResortFilter"]),
90
+  },
93 91
 };
94 92
 </script>
95 93
 

+ 7
- 11
src/components/timeshare/resort/carouselSection.vue Voir le fichier

@@ -4,7 +4,7 @@
4 4
       <carousel
5 5
         :nav="false"
6 6
         :dots="false"
7
-        :items="1"
7
+        :items="10"
8 8
         :autoplay="true"
9 9
         :loop="true"
10 10
         :autoHeight="true"
@@ -12,13 +12,9 @@
12 12
         style="margin-top:-50px;"
13 13
         :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
14 14
       >
15
-        <img
16
-          class="item"
17
-          style="object-fit:cover"
18
-          v-for="(image, i) in resortImages"
19
-          :src="image"
20
-          :key="i"
21
-        />
15
+        <div v-for="(image, i) in resortImages" :key="i">
16
+          <img class="item" style="object-fit:cover" :src="image" :key="i" />
17
+        </div>
22 18
       </carousel>
23 19
     </div>
24 20
   </section>
@@ -29,11 +25,11 @@
29 25
 import carousel from "vue-owl-carousel";
30 26
 export default {
31 27
   components: {
32
-    carousel
28
+    carousel,
33 29
   },
34 30
   props: {
35
-    resortImages: {}
36
-  }
31
+    resortImages: {},
32
+  },
37 33
 };
38 34
 </script>
39 35
 

+ 6
- 6
src/components/timeshare/resort/resortPage.vue Voir le fichier

@@ -15,15 +15,15 @@ import contentSection from "./contentSection";
15 15
 export default {
16 16
   components: {
17 17
     carouselSection,
18
-    contentSection
18
+    contentSection,
19 19
   },
20 20
   data() {
21 21
     return {
22
-      boolLoaded: false
22
+      boolLoaded: false,
23 23
     };
24 24
   },
25 25
   props: {
26
-    resortCode: {}
26
+    resortCode: {},
27 27
   },
28 28
   async created() {
29 29
     this.initResort(this.resortCode).then(() => {
@@ -36,14 +36,14 @@ export default {
36 36
       return this.resort
37 37
         ? `http://maps.google.com/maps?q=${this.resort.prLatitude},${this.resort.prLongitude}&z=15&output=embed`
38 38
         : "";
39
-    }
39
+    },
40 40
   },
41 41
   methods: {
42 42
     ...mapActions("resort", ["initResort"]),
43 43
     routerGoTo(goto) {
44 44
       this.$router.push(goto);
45
-    }
46
-  }
45
+    },
46
+  },
47 47
 };
48 48
 </script>
49 49
 

+ 32
- 21
src/components/timeshare/searchTimeshare.vue Voir le fichier

@@ -3,17 +3,13 @@
3 3
     <h2>Filter Weeks</h2>
4 4
     <p>*Select at least 1 filter field</p>
5 5
     <div class="input-group mt-2">
6
-      <label v-if="selectedSeason === null" class="uniSelectLabel" for="season">Season</label>
7
-      <select class="form-control" name="season" id="season" v-model="selectedSeason">
8
-        <option v-for="season in seasons" :key="season.id" :value="season">
9
-          {{ season.name }}
10
-        </option>
6
+      <label v-if="!filter.season" class="uniSelectLabel" for="season">Season</label>
7
+      <select class="form-control" name="season" id="season" v-model="filter.season">
8
+        <option v-for="season in seasons" :key="season.id" :value="season">{{ season.name }}</option>
11 9
       </select>
12 10
     </div>
13 11
     <div class="input-group mt-2">
14
-      <label v-if="!filter.bedrooms" class="uniSelectLabel" for="weekInfoRegionSelect"
15
-        >Bedrooms</label
16
-      >
12
+      <label v-if="!filter.bedrooms" class="uniSelectLabel" for="weekInfoRegionSelect">Bedrooms</label>
17 13
       <select class="form-control" name="bedrooms" v-model="filter.bedrooms">
18 14
         <option v-for="(item, i) in resortBedrooms" :key="i">{{ item }}</option>
19 15
       </select>
@@ -27,7 +23,7 @@
27 23
       v-model="filter.maxPrice"
28 24
     />
29 25
     <p class="mt-2">
30
-      Filter Arrival Date from
26
+      Date from
31 27
       <input
32 28
         type="date"
33 29
         name="arrival-from"
@@ -38,16 +34,22 @@
38 34
       />
39 35
     </p>
40 36
     <p>
41
-      Filter Arrival Date to
37
+      Date to
42 38
       <input
43 39
         type="date"
44 40
         name="arrival-to"
45 41
         class="form-control my-1"
46 42
         id="arrival-to"
47 43
         placeholder="mm/dd/yy"
44
+        v-model="filter.ddate"
48 45
       />
49 46
     </p>
50
-    <div class="btn-white-border"><i class="fa fa-search"></i> FILTER</div>
47
+    <button class="btn-white-border" @click="ClearFilter()">
48
+      <i class="fa fa-eraser"></i> CLEAR
49
+    </button>
50
+    <!-- <div class="btn-white-border">
51
+      <i class="fa fa-search"></i> FILTER
52
+    </div>-->
51 53
   </div>
52 54
 </template>
53 55
 
@@ -59,11 +61,11 @@ import _ from "lodash";
59 61
 export default {
60 62
   props: {
61 63
     hideTop: undefined,
62
-    keyword: undefined
64
+    keyword: undefined,
63 65
   },
64 66
   data() {
65 67
     return {
66
-      selectedSeason: null
68
+      selectedSeason: null,
67 69
     };
68 70
   },
69 71
   created() {
@@ -75,24 +77,33 @@ export default {
75 77
       "regions",
76 78
       "detailedRegion",
77 79
       "resortBedrooms",
78
-      "maxSleep"
80
+      "maxSleep",
79 81
     ]),
80
-    ...mapState("weekList", ["filter"]),
82
+    ...mapState("weekList", ["filter", "searchParams"]),
81 83
     ...mapState("timeshare", ["seasons"]),
82 84
     filteredResorts() {
83 85
       if (this.selectedRegion) {
84
-        const list = _.find(this.detailedRegion, i => i.region.regionName === this.selectedRegion)
85
-          .children;
86
-        return _.sortBy(list, r => r.resortName);
86
+        const list = _.find(
87
+          this.detailedRegion,
88
+          (i) => i.region.regionName === this.selectedRegion
89
+        ).children;
90
+        return _.sortBy(list, (r) => r.resortName);
87 91
       }
88 92
       return this.resorts;
89
-    }
93
+    },
90 94
   },
91 95
   methods: {
92 96
     ...mapActions("timeshare", ["initTimeshare"]),
93 97
     ...mapActions("weekList", ["clearFilter"]),
94
-    ...mapActions("timeshare", ["getSeasons"])
95
-  }
98
+    ...mapActions("timeshare", ["getSeasons"]),
99
+    ClearFilter() {
100
+      this.filter.season = null;
101
+      this.filter.bedrooms = null;
102
+      this.filter.maxPrice = null;
103
+      this.filter.date = null;
104
+      this.filter.ddate = null;
105
+    },
106
+  },
96 107
 };
97 108
 </script>
98 109
 

+ 7
- 1
src/router/index.js Voir le fichier

@@ -45,6 +45,7 @@ import agentManagementPage from "../components/admin/status/agentsUserManagement
45 45
 
46 46
 import ResortPage from "../components/timeshare/resort/resortPage.vue";
47 47
 import UnitPage from "../components/timeshare/resort/unit/unitPage.vue";
48
+import ToBuySearch from "../components/timeshare/buy/toBuySearchResults.vue";
48 49
 
49 50
 import ContactUs from "../components/misc/contactUs.vue";
50 51
 import PrivacyPolicy from "../components/misc//privacyPolicy/privacyPolicyPage.vue";
@@ -399,6 +400,11 @@ export default new Router({
399 400
       path: "/EnquireNow",
400 401
       name: "EnquireNow",
401 402
       component: EnquireNow
402
-    }
403
+    },
404
+    {
405
+      path: "/toBuyResults",
406
+      name: "ToBuySearch",
407
+      component: ToBuySearch
408
+    },
403 409
   ]
404 410
 });

+ 20
- 16
src/store/modules/processFlow/bid.js Voir le fichier

@@ -1,11 +1,12 @@
1
-import axios from 'axios';
2
-import log from '../../../assets/Log';
1
+import axios from "axios";
2
+import log from "../../../assets/Log";
3
+import { result } from "lodash";
3 4
 
4 5
 export default {
5 6
   namespaced: true,
6 7
   state: {
7 8
     bidItem: {},
8
-    bidItems: [],
9
+    bidItems: []
9 10
   },
10 11
   mutations: {
11 12
     setBid(state, bid) {
@@ -20,20 +21,23 @@ export default {
20 21
     updateBidList(state, bid) {
21 22
       state.bidItems.find(item => item.id === bid.id).status = bid.status;
22 23
       console.log(JSON.stringify(bid));
23
-    },
24
+    }
24 25
   },
25 26
   getters: {},
26 27
   actions: {
28
+    getTemplate({ commit }) {
29
+      axios.get("/api/bid/GetNewBidTemplate").then(result => commit("setBid", result.data));
30
+    },
27 31
     getBid({ commit }, id) {
28 32
       axios
29 33
         .get(`/api/bid/${id}`)
30
-        .then(result => commit('addToBids', result.data))
34
+        .then(result => commit("addToBids", result.data))
31 35
         .catch(console.error);
32 36
     },
33 37
     getBids({ commit }) {
34 38
       axios
35
-        .get('/api/bid/GetBids/All')
36
-        .then(result => commit('setBids', result.data))
39
+        .get("/api/bid/GetBids/All")
40
+        .then(result => commit("setBids", result.data))
37 41
         .catch(console.error);
38 42
     },
39 43
     saveBid({ commit }, item) {
@@ -42,27 +46,27 @@ export default {
42 46
       }
43 47
       console.log(JSON.stringify(item));
44 48
       axios
45
-        .post('/api/bid', item)
46
-        .then(result => commit('setBid', result.data))
49
+        .post("/api/bid", item)
50
+        .then(result => commit("setBid", result.data))
47 51
         .catch(console.error);
48 52
     },
49 53
     updateBid({ commit }, item) {
50 54
       axios
51
-        .put('/api/bid', item)
52
-        .then(result => commit('setBid', item))
55
+        .put("/api/bid", item)
56
+        .then(result => commit("setBid", item))
53 57
         .catch(console.error);
54 58
     },
55 59
     acceptBid({ commit }, id) {
56 60
       axios
57 61
         .put(`/api/bid/AcceptBid/${id}`)
58
-        .then(result => commit('updateBidList', result.data))
62
+        .then(result => commit("updateBidList", result.data))
59 63
         .catch(console.error);
60 64
     },
61 65
     declineBid({ commit }, item) {
62 66
       axios
63
-        .put('/api/bid/DeclineBid', item)
64
-        .then(result => commit('updateBidList', result.data))
67
+        .put("/api/bid/DeclineBid", item)
68
+        .then(result => commit("updateBidList", result.data))
65 69
         .catch(console.error);
66
-    },
67
-  },
70
+    }
71
+  }
68 72
 };

+ 32
- 15
src/store/modules/timeshare/weekList.js Voir le fichier

@@ -3,7 +3,7 @@
3 3
 /* eslint-disable no-restricted-syntax */
4 4
 /* eslint-disable guard-for-in */
5 5
 import axios from "axios";
6
-import _ from "lodash";
6
+import _, { min } from "lodash";
7 7
 
8 8
 export default {
9 9
   namespaced: true,
@@ -11,17 +11,25 @@ export default {
11 11
     weeks: [],
12 12
     status: undefined,
13 13
     filter: {
14
+      season: undefined,
14 15
       status: undefined,
15 16
       region: undefined,
16 17
       resort: undefined,
17 18
       bedrooms: undefined,
18 19
       date: undefined,
20
+      ddate: undefined,
19 21
       minPrice: undefined,
20 22
       maxPrice: undefined,
21 23
       keyword: undefined
22 24
     },
23 25
     prevFilter: undefined,
24
-    difFilter: undefined
26
+    difFilter: undefined,
27
+    searchParams: {
28
+      region: undefined,
29
+      resort: undefined,
30
+      fromDate: undefined,
31
+      toDate: undefined
32
+    }
25 33
   },
26 34
   mutations: {
27 35
     onLoading(state) {
@@ -81,21 +89,20 @@ export default {
81 89
           );
82 90
         }
83 91
         if (filter.bedrooms) {
84
-          weekList = _.filter(weekList, x => x.bedrooms && x.bedrooms == filter.bedrooms);
92
+          if (filter.bedrooms === "Studio") {
93
+            weekList = _.filter(weekList, x => (x.bedrooms && x.bedrooms === "0") || !x.bedrooms);
94
+          } else {
95
+            weekList = _.filter(weekList, x => x.bedrooms && x.bedrooms === filter.bedrooms);
96
+          }
85 97
         }
86 98
         if (filter.date) {
87 99
           const minDate = new Date(filter.date);
88
-          minDate.setDate(minDate.getDate() - 7);
89
-          const maxDate = new Date(filter.date);
90
-          maxDate.setDate(maxDate.getDate() + 7);
91
-          weekList = _.filter(
92
-            weekList,
93
-            x =>
94
-              new Date(x.arrivalDate) &&
95
-              new Date(x.departureDate) &&
96
-              new Date(x.arrivalDate) >= minDate &&
97
-              new Date(x.arrivalDate) <= maxDate
98
-          );
100
+          minDate.setDate(minDate.getDate() - 1);
101
+          weekList = _.filter(weekList, x => new Date(x.arrivalDate) >= minDate);
102
+        }
103
+        if (filter.ddate) {
104
+          const maxDate = new Date(filter.ddate);
105
+          weekList = _.filter(weekList, x => new Date(x.departureDate) <= maxDate);
99 106
         }
100 107
         if (filter.minPrice && filter.minPrice !== 0) {
101 108
           weekList = _.filter(weekList, x => x.sellPrice && x.sellPrice >= filter.minPrice);
@@ -103,6 +110,9 @@ export default {
103 110
         if (filter.maxPrice && filter.maxPrice !== 0) {
104 111
           weekList = _.filter(weekList, x => x.sellPrice && x.sellPrice <= filter.maxPrice);
105 112
         }
113
+        if (filter.season) {
114
+          weekList = _.filter(weekList, x => x.season === filter.season.name);
115
+        }
106 116
       }
107 117
       return _.sortBy(_.sortBy(weekList, "arrivalDate"), "resort.resortName");
108 118
     },
@@ -149,7 +159,6 @@ export default {
149 159
                 resortName: rootGetters["timeshare/getResortName"](code),
150 160
                 resortCode: code
151 161
               };
152
-              arr2.push(myItem);
153 162
             }
154 163
           }
155 164
           commit("setWeeks", arr2);
@@ -157,6 +166,14 @@ export default {
157 166
         })
158 167
         .catch(console.error);
159 168
     },
169
+    // getWeeks({ commit }) {
170
+    //   axios.get("api/timeshareweek").then(result =>
171
+    //     commit(
172
+    //       "setWeeks",
173
+    //       result.data.filter(x => x.region !== null)
174
+    //     )
175
+    //   );
176
+    // },
160 177
     clearFilter({ commit }, filter) {
161 178
       commit("onClearFilter", filter);
162 179
     }

Chargement…
Annuler
Enregistrer