George Williams 4年前
コミット
9604c87d20
32個のファイルの変更1076行の追加663行の削除
  1. 9
    7
      package-lock.json
  2. 2
    1
      package.json
  3. 12
    0
      public/css/newStyle.css
  4. 14
    4
      src/components/admin/fees/listingFee.vue
  5. 101
    0
      src/components/admin/misc/termsConditions.vue
  6. 73
    105
      src/components/admin/status/timeshareAdminPage.vue
  7. 0
    0
      src/components/misc/TermsConditions/carouselSection.vue
  8. 38
    0
      src/components/misc/TermsConditions/contentSection.vue
  9. 2
    1
      src/components/misc/TermsConditions/termsConditions.vue
  10. 16
    15
      src/components/misc/bondCaclculator.vue
  11. 64
    50
      src/components/property/commercial/createProperty/commercialCreateNew.vue
  12. 27
    9
      src/components/property/commercial/singleView/contentSection.vue
  13. 4
    6
      src/components/property/enquireNow/carouselSection.vue
  14. 71
    54
      src/components/property/enquireNow/contentSection.vue
  15. 46
    0
      src/components/property/enquireNow/enquirenow.vue
  16. 22
    20
      src/components/property/propertyUserField.vue
  17. 56
    56
      src/components/property/residential/createProperty/residentialCreateNew.vue
  18. 27
    10
      src/components/property/residential/singleView/contentSection.vue
  19. 3
    0
      src/components/shared/footerSection.vue
  20. 11
    15
      src/components/shared/listView.vue
  21. 15
    14
      src/components/shared/listViewControl.vue
  22. 20
    5
      src/components/shared/navBar.vue
  23. 1
    1
      src/components/timeshare/myWeeksPage.vue
  24. 293
    231
      src/components/timeshare/sell/contentSection.vue
  25. 19
    2
      src/components/user/registerAgencySection.vue
  26. 22
    1
      src/components/user/registerIndividual.vue
  27. 4
    2
      src/main.js
  28. 15
    3
      src/router/index.js
  29. 2
    0
      src/store/index.js
  30. 32
    0
      src/store/modules/misc/termsConditions.js
  31. 2
    0
      src/store/modules/user/authentication.js
  32. 53
    51
      src/store/modules/user/register.js

+ 9
- 7
package-lock.json ファイルの表示

12372
         "vue": "^2.5.17"
12372
         "vue": "^2.5.17"
12373
       }
12373
       }
12374
     },
12374
     },
12375
+    "vue-float-label": {
12376
+      "version": "1.6.1",
12377
+      "resolved": "https://registry.npmjs.org/vue-float-label/-/vue-float-label-1.6.1.tgz",
12378
+      "integrity": "sha1-I1HnGyXyGwbUNWOwRveNlRKgjGY="
12379
+    },
12375
     "vue-hot-reload-api": {
12380
     "vue-hot-reload-api": {
12376
       "version": "2.3.4",
12381
       "version": "2.3.4",
12377
       "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",
12382
       "resolved": "https://registry.npmjs.org/vue-hot-reload-api/-/vue-hot-reload-api-2.3.4.tgz",
12432
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.1.5.tgz",
12437
       "resolved": "https://registry.npmjs.org/vue-router/-/vue-router-3.1.5.tgz",
12433
       "integrity": "sha512-BszkPvhl7I9h334GjckCh7sVFyjTPMMJFJ4Bsrem/Ik+B/9gt5tgrk8k4gGLO4ZpdvciVdg7O41gW4DisQWurg=="
12438
       "integrity": "sha512-BszkPvhl7I9h334GjckCh7sVFyjTPMMJFJ4Bsrem/Ik+B/9gt5tgrk8k4gGLO4ZpdvciVdg7O41gW4DisQWurg=="
12434
     },
12439
     },
12435
-    "vue-share-social": {
12436
-      "version": "0.3.2",
12437
-      "resolved": "https://registry.npmjs.org/vue-share-social/-/vue-share-social-0.3.2.tgz",
12438
-      "integrity": "sha512-8YEm2Kkl756bhqSfXPtQqnOOItz7/DQWU6E4L+vC4dgT4rp0+XnqsgJAr4OXVQRRUNDO7TS8W0W79+zhfvh4pQ==",
12439
-      "requires": {
12440
-        "vue": "^2.5.16"
12441
-      }
12440
+    "vue-social-sharing": {
12441
+      "version": "3.0.0-beta.11",
12442
+      "resolved": "https://registry.npmjs.org/vue-social-sharing/-/vue-social-sharing-3.0.0-beta.11.tgz",
12443
+      "integrity": "sha512-jIATgcKcBGQveAbU4sKjHcsGN7gI/bq/T9fm/5qowtBuZe0I+5CZRWcAGDd6G64HzQfFEyNBLC02GYjMtaovhA=="
12442
     },
12444
     },
12443
     "vue-style-loader": {
12445
     "vue-style-loader": {
12444
       "version": "4.1.2",
12446
       "version": "4.1.2",

+ 2
- 1
package.json ファイルの表示

31
     "vue-currency-input": "^1.22.3",
31
     "vue-currency-input": "^1.22.3",
32
     "vue-disable-autocomplete": "0.0.4",
32
     "vue-disable-autocomplete": "0.0.4",
33
     "vue-eva-icons": "^1.1.1",
33
     "vue-eva-icons": "^1.1.1",
34
+    "vue-float-label": "^1.6.1",
34
     "vue-js-modal": "^1.3.33",
35
     "vue-js-modal": "^1.3.33",
35
     "vue-json-excel": "^0.2.98",
36
     "vue-json-excel": "^0.2.98",
36
     "vue-owl-carousel": "^2.0.3",
37
     "vue-owl-carousel": "^2.0.3",
37
     "vue-router": "^3.1.5",
38
     "vue-router": "^3.1.5",
38
-    "vue-share-social": "^0.3.2",
39
+    "vue-social-sharing": "^3.0.0-beta.11",
39
     "vue-trix": "^1.1.7",
40
     "vue-trix": "^1.1.7",
40
     "vue2-editor": "^2.10.2",
41
     "vue2-editor": "^2.10.2",
41
     "vue2-google-maps": "^0.10.7",
42
     "vue2-google-maps": "^0.10.7",

+ 12
- 0
public/css/newStyle.css ファイルの表示

20
 
20
 
21
 /* @import url("https://fonts.googleapis.com/css?family=Muli&display=swap"); */
21
 /* @import url("https://fonts.googleapis.com/css?family=Muli&display=swap"); */
22
 
22
 
23
+.vfl-label {
24
+  text-transform: uppercase;
25
+}
26
+
27
+.vfl-label-on-input {
28
+  top: -1.5em !important;
29
+}
30
+
31
+.vfl-label-on-focus {
32
+  color: rgb(27, 117, 187) !important;
33
+}
34
+
23
 .uniSelect {
35
 .uniSelect {
24
   border-color: rgb(27, 117, 187);
36
   border-color: rgb(27, 117, 187);
25
   border-width: 2px;
37
   border-width: 2px;

+ 14
- 4
src/components/admin/fees/listingFee.vue ファイルの表示

1
 <template>
1
 <template>
2
   <section id="content">
2
   <section id="content">
3
+    <div v-if="updated">
4
+      <alert :text="'The listing fee has been updated!!'" :type="'SUCCESS'" />
5
+    </div>
6
+
3
     <label for="fee" class="uniLabel">LISTING FEE</label>
7
     <label for="fee" class="uniLabel">LISTING FEE</label>
8
+
4
     <currency-input
9
     <currency-input
5
       onClick="this.setSelectionRange(0, this.value.length)"
10
       onClick="this.setSelectionRange(0, this.value.length)"
6
       name="fee"
11
       name="fee"
17
 <script>
22
 <script>
18
 /* eslint-disable */
23
 /* eslint-disable */
19
 import { mapActions, mapGetters, mapState } from "vuex";
24
 import { mapActions, mapGetters, mapState } from "vuex";
25
+import alert from "../../shared/alert";
20
 export default {
26
 export default {
27
+  components: {
28
+    alert
29
+  },
21
   data() {
30
   data() {
22
     return {
31
     return {
23
-      fee: 0.0
32
+      fee: 0.0,
33
+      updated: false
24
     };
34
     };
25
   },
35
   },
26
   mounted() {
36
   mounted() {
33
         amount: parseFloat(this.fee),
43
         amount: parseFloat(this.fee),
34
         name: "Listing Fee"
44
         name: "Listing Fee"
35
       };
45
       };
36
-
37
       this.setListingFee(feeObj);
46
       this.setListingFee(feeObj);
47
+      setTimeout(() => {
48
+        this.updated = true;
49
+      }, 200);
38
     },
50
     },
39
     async pullListingFee() {
51
     async pullListingFee() {
40
       await this.retrieveListingFee();
52
       await this.retrieveListingFee();
41
-      console.log(this.getListingFee);
42
-
43
       this.fee = this.getListingFee.amount;
53
       this.fee = this.getListingFee.amount;
44
     }
54
     }
45
   },
55
   },

+ 101
- 0
src/components/admin/misc/termsConditions.vue ファイルの表示

1
+<template>
2
+  <main id="main" style="padding-bottom:50px">
3
+    <div class="container">
4
+      <div class="row">
5
+        <div class="col">
6
+          <div class="section-header">
7
+            <h2>Terms And Conditions</h2>
8
+          </div>
9
+        </div>
10
+      </div>
11
+
12
+      <div class="row">
13
+        <div class="col-md-6">
14
+          <label for="version" class="uniSelectLabel">Version:</label>
15
+          <input name="version" type="text" v-model="version" class="mt-5 mb-3 ml-2" />
16
+        </div>
17
+        <div class="col-md-6 mt-5">
18
+          <p style="float:right">Last Modified: {{ getModiefiedDate }}</p>
19
+        </div>
20
+      </div>
21
+      <div class="row">
22
+        <div class="col">
23
+          <vue-editor v-model="termsInput" :editor-toolbar="customToolbar" />
24
+        </div>
25
+      </div>
26
+      <div class="row">
27
+        <div class="col-md-2 mt-3">
28
+          <button @click="saveTerms()" class="btn-solid-blue">Save</button>
29
+        </div>
30
+        <div v-if="updated" class="col mt-3">
31
+          <alert :text="'Terms and Contidtions Updated!!'" :type="'SUCCESS'" />
32
+        </div>
33
+      </div>
34
+    </div>
35
+    <div v-if="wait" id="preloader"></div>
36
+  </main>
37
+</template>
38
+
39
+<script>
40
+/* eslint-disable */
41
+import { VueEditor } from "vue2-editor";
42
+import { mapActions, mapGetters, mapState } from "vuex";
43
+import alert from "../../shared/alert";
44
+
45
+export default {
46
+  components: {
47
+    VueEditor,
48
+    alert
49
+  },
50
+  data() {
51
+    return {
52
+      termsInput: "",
53
+      version: "",
54
+      updated: false,
55
+      wait: true,
56
+      customToolbar: [
57
+        [{ header: [false, 1, 2, 3, 4, 5, 6] }],
58
+        ["bold", "italic", "underline", "strike"],
59
+        [{ align: "" }, { align: "center" }, { align: "right" }, { align: "justify" }],
60
+        [{ list: "ordered" }, { list: "bullet" }, { list: "check" }],
61
+        [{ script: "sub" }, { script: "super" }],
62
+        [{ indent: "-1" }, { indent: "+1" }]
63
+      ]
64
+    };
65
+  },
66
+  mounted() {
67
+    this.populateTerms();
68
+  },
69
+  methods: {
70
+    ...mapActions("termsConditions", ["setTerms", "retrieveTerms"]),
71
+    saveTerms() {
72
+      var termsObj = {
73
+        termsConditions: this.termsInput,
74
+        version: this.version
75
+      };
76
+      this.setTerms(termsObj).then(() => {
77
+        this.updated = true;
78
+        this.$router.go();
79
+      });
80
+    },
81
+    async populateTerms() {
82
+      await this.retrieveTerms();
83
+      this.version = this.terms.version;
84
+      this.termsInput = this.terms.termsConditions;
85
+      setTimeout(() => {
86
+        this.wait = false;
87
+      }, 500);
88
+    }
89
+  },
90
+  computed: {
91
+    ...mapGetters("termsConditions", ["getTermsAndConditions"]),
92
+    ...mapState("termsConditions", ["terms"]),
93
+    getModiefiedDate() {
94
+      var date = new Date(this.terms.modified);
95
+      return date.getDate() + " / " + (date.getMonth() + 1) + " / " + date.getFullYear();
96
+    }
97
+  }
98
+};
99
+</script>
100
+
101
+<style lang="scss" scoped></style>

+ 73
- 105
src/components/admin/status/timeshareAdminPage.vue ファイルの表示

10
           </div>
10
           </div>
11
         </div>
11
         </div>
12
       </div>
12
       </div>
13
-    </div>
14
-
15
-    <div class="row">
16
-      <div class="offset-1 col-md-6">
17
-        <div class="form-group col-md-3">
18
-                <div class="input-group">
19
-                  <label
20
-                    class="uniSelectLabel"
21
-                    for="weekInfoRegionSelect"
22
-                  >REGION</label>
23
-
24
-                  <select
25
-                    id="weekInfoRegionSelect"
26
-                    class="form-control uniSelect"
27
-                    @change="regionChange()"
28
-                    style="font-size: 15px"
29
-                  >
30
-                    <option
31
-                      v-for="(region, r) in regions"
32
-                      :key="r"
33
-                      :value="region"
34
-                    >{{ region.regionName }}</option>
35
-                  </select>
36
-                </div>
37
-                <div class="validation"></div>
38
-              </div>
39
-
40
-                  <div class="form-group col-md-3">
41
-                <div class="input-group">
42
-                  <label
43
-                    class="uniSelectLabel"
44
-                    for="weekInfoResortSelect"
45
-                  >RESORT NAME</label>
46
-
47
-                  <select
48
-                    id="weekInfoResortSelect"
49
-                    class="form-control uniSelect"
50
-                    @change="resortChange()"
51
-                  >
52
-                    <option value="Other">Other</option>
53
-                    <option
54
-                      v-for="(resort, r) in resorts"
55
-                      :key="r"
56
-                      :value="resort"
57
-                    >{{ resort.resortName }}</option>
58
-                  </select>
59
-                </div>
60
-                  </div>
61
-
62
-                  <div class="form-group col-md-3">
63
-                <label class="uniSelectLabel" for="region">SEASON</label>
64
-
65
-                <select
66
-                  class="form-control uniSelect"
67
-                  name="region"
68
-                  id="region">
69
-                  <option v-for="(season, r) in seasons" :key="r">{{ season.name }}</option>
70
-                </select>
71
-                <div class="validation"></div>
72
-              </div>
73
-
74
-              <div class="form-group col-md-3">
75
-                <label class="uniSlectLabel">STATUS</label>
76
-                <select class="form-control uniSelect"
77
-                        name="status">
78
-                </select>
79
-              </div>
80
-              <button type="button"> Filter</button>
81
-        <!-- <button
13
+      <div class="row">
14
+        <div class="col-md-3">
15
+          <float-label label="REGION">
16
+            <select
17
+              id="weekInfoRegionSelect"
18
+              class="form-control uniSelect"
19
+              @change="regionChange()"
20
+              style="font-size: 15px"
21
+            >
22
+              <option v-for="(region, r) in regions" :key="r" :value="region">{{
23
+                region.regionName
24
+              }}</option>
25
+            </select>
26
+          </float-label>
27
+        </div>
28
+        <div class="col-md-3">
29
+          <float-label label="RESORT NAME">
30
+            <select
31
+              id="weekInfoResortSelect"
32
+              class="form-control uniSelect"
33
+              @change="resortChange()"
34
+            >
35
+              <option value="Other">Other</option>
36
+              <option v-for="(resort, r) in resorts" :key="r" :value="resort">{{
37
+                resort.resortName
38
+              }}</option>
39
+            </select>
40
+          </float-label>
41
+        </div>
42
+        <div class="col-md-3">
43
+          <float-label label="SEASON">
44
+            <select class="form-control uniSelect" name="region" id="region">
45
+              <option v-for="(season, r) in seasons" :key="r">{{ season.name }}</option>
46
+            </select>
47
+          </float-label>
48
+        </div>
49
+        <div class="col-md-3">
50
+          <float-label label="STATUS">
51
+            <select class="form-control uniSelect" name="status"> </select>
52
+          </float-label>
53
+        </div>
54
+      </div>
55
+      <div class="row">
56
+        <div class="col">
57
+          <button style="float:right" class="btn-solid-blue" type="button">Filter</button>
58
+        </div>
59
+      </div>
60
+      <div class="row">
61
+        <div class="col-md-12">
62
+          <ListView
63
+            :items="getNeedsVerify"
64
+            :editable="true"
65
+            :deleteable="true"
66
+            :showCustomAction="true"
67
+            :CustomActionHeading="'Publish'"
68
+            @onRowClick="onRowClick"
69
+            @onClearSelected="onClearSelected"
70
+            @onEdit="onEdit"
71
+            :showNew="false"
72
+          />
73
+        </div>
74
+      </div>
75
+      <!-- <div class="offset-1 col-md-6">
76
+        <button
82
           type="button"
77
           type="button"
83
           :class="{
78
           :class="{
84
             'form-control btn btn-primary ': 1 === 1,
79
             'form-control btn btn-primary ': 1 === 1,
89
           @click="onVerify()"
84
           @click="onVerify()"
90
         >
85
         >
91
           {{ ButtonMessage }}
86
           {{ ButtonMessage }}
92
-        </button> -->
93
-        <!-- <div>{{ Message }}</div> -->
94
-      </div>
95
-      <div class="offset-1 col-md-10">
96
-        <ListView
97
-          :items="getNeedsVerify"
98
-          :editable="true"
99
-          :deleteable="true"
100
-          :showCustomAction="true"
101
-          :CustomActionHeading="'Publish'"
102
-          @onRowClick="onRowClick"
103
-          @onClearSelected="onClearSelected"
104
-          @onEdit="onEdit"
105
-          :showNew="false"
106
-        />
107
-      </div>
87
+        </button> 
88
+        <div>{{ Message }}</div>
89
+      </div> -->
108
     </div>
90
     </div>
109
   </main>
91
   </main>
110
 </template>
92
 </template>
130
     this.initTimeshare(0);
112
     this.initTimeshare(0);
131
   },
113
   },
132
   computed: {
114
   computed: {
133
-        ...mapState("timeshare", [
134
-      "resorts",
135
-      "regions",
136
-      "seasons",
137
-    ]),
115
+    ...mapState("timeshare", ["resorts", "regions", "seasons"]),
138
     ...mapState("individual", ["indiv"]),
116
     ...mapState("individual", ["indiv"]),
139
     filteredResort() {
117
     filteredResort() {
140
       let list = [];
118
       let list = [];
141
-      if (
142
-        this.sellItem &&
143
-        this.sellItem.region &&
144
-        this.sellItem.region.regionCode
145
-      ) {
119
+      if (this.sellItem && this.sellItem.region && this.sellItem.region.regionCode) {
146
         const item = this.detailedRegion.find(
120
         const item = this.detailedRegion.find(
147
-          (region) =>
148
-            region.region.regionCode === this.sellItem.region.regionCode
121
+          region => region.region.regionCode === this.sellItem.region.regionCode
149
         );
122
         );
150
         if (item) {
123
         if (item) {
151
           list = item.children;
124
           list = item.children;
153
       } else {
126
       } else {
154
         list = this.resorts;
127
         list = this.resorts;
155
       }
128
       }
156
-      return _.sortBy(list, (x) => x.resortName);
129
+      return _.sortBy(list, x => x.resortName);
157
     },
130
     },
158
     SelectedItems() {
131
     SelectedItems() {
159
       const selectedArray = [];
132
       const selectedArray = [];
191
   methods: {
164
   methods: {
192
     ...mapActions("myWeeks", ["getItems", "verifyWeek"]),
165
     ...mapActions("myWeeks", ["getItems", "verifyWeek"]),
193
     ...mapActions("alert", ["success"]),
166
     ...mapActions("alert", ["success"]),
194
-     ...mapActions("timeshare", [
195
-      "initTimeshare",
196
-      "onResortChange",
197
-      "saveWeek",
198
-      "getBlankWeek",
199
-    ]),
167
+    ...mapActions("timeshare", ["initTimeshare", "onResortChange", "saveWeek", "getBlankWeek"]),
200
     onVerify() {
168
     onVerify() {
201
       if (this.selectedItems.length > 0) {
169
       if (this.selectedItems.length > 0) {
202
         for (const i in this.selectedItems) {
170
         for (const i in this.selectedItems) {
218
     },
186
     },
219
     onClearSelected() {
187
     onClearSelected() {
220
       this.selectedItems = [];
188
       this.selectedItems = [];
221
-    },
189
+    }
222
     //   onDelete(item) {
190
     //   onDelete(item) {
223
     //   this.deleteListing(item.id);
191
     //   this.deleteListing(item.id);
224
     // },
192
     // },

+ 0
- 0
src/components/misc/TermsConditions/carouselSection.vue ファイルの表示


+ 38
- 0
src/components/misc/TermsConditions/contentSection.vue ファイルの表示

1
+<template>
2
+  <div class="container">
3
+    <div class="row">
4
+      <div class="col">
5
+        <div class="section-header">
6
+          <h2>Terms & Conditions</h2>
7
+        </div>
8
+      </div>
9
+    </div>
10
+    <div class="row">
11
+      <div class="col">
12
+        <div v-html="terms.termsConditions"></div>
13
+      </div>
14
+    </div>
15
+  </div>
16
+</template>
17
+
18
+<script>
19
+/* eslint-disable */
20
+import { mapActions, mapGetters, mapState } from "vuex";
21
+export default {
22
+  mounted() {
23
+    this.populateTerms();
24
+  },
25
+  methods: {
26
+    ...mapActions("termsConditions", ["retrieveTerms"]),
27
+    async populateTerms() {
28
+      await this.retrieveTerms();
29
+    }
30
+  },
31
+  computed: {
32
+    ...mapGetters("termsConditions", ["getTermsAndConditions"]),
33
+    ...mapState("termsConditions", ["terms"])
34
+  }
35
+};
36
+</script>
37
+
38
+<style lang="scss" scoped></style>

src/components/property/commercial/enquireNow/enquirenow.vue → src/components/misc/TermsConditions/termsConditions.vue ファイルの表示

1
 <template>
1
 <template>
2
   <div>
2
   <div>
3
     <carouselSection />
3
     <carouselSection />
4
-    <main id="main" style="margin-top:-20px;padding-bottom:50px">
4
+    <main id="main">
5
       <contentSection />
5
       <contentSection />
6
     </main>
6
     </main>
7
   </div>
7
   </div>
9
 
9
 
10
 <script>
10
 <script>
11
 /* eslint-disable */
11
 /* eslint-disable */
12
+
12
 import carouselSection from "./carouselSection";
13
 import carouselSection from "./carouselSection";
13
 import contentSection from "./contentSection";
14
 import contentSection from "./contentSection";
14
 export default {
15
 export default {

+ 16
- 15
src/components/misc/bondCaclculator.vue ファイルの表示

2
   <div>
2
   <div>
3
     <h2 id="modal-bondcal">Bond Calculator</h2>
3
     <h2 id="modal-bondcal">Bond Calculator</h2>
4
     <p>Calculate the value of the property you could buy</p>
4
     <p>Calculate the value of the property you could buy</p>
5
-    <input
6
-      type="text"
7
-      class="form-control mb-2"
8
-      name="income"
9
-      v-currency="{ currency: ['ZAR', null, { prefix: 'R' }][2] }"
10
-      id="gross-income"
11
-      placeholder="Gross Monthly Household Income"
5
+    <currency-input
6
+      onClick="this.setSelectionRange(0, this.value.length)"
7
+      name="price"
8
+      :value="value"
9
+      @input="value = $event"
12
       v-model="amount"
10
       v-model="amount"
13
-    />
14
-    <input
15
-      type="text"
11
+      id="gross-income"
16
       class="form-control mb-2"
12
       class="form-control mb-2"
13
+    />
14
+    <currency-input
15
+      onClick="this.setSelectionRange(0, this.value.length)"
17
       name="deposit"
16
       name="deposit"
18
-      v-currency="{ currency: ['ZAR', null, { prefix: 'R' }][2] }"
19
-      id="deposit"
20
-      placeholder="Deposit Amount – May be Required"
17
+      :value="value"
18
+      @input="value = $event"
21
       v-model="deposit"
19
       v-model="deposit"
20
+      id="gross-income"
21
+      class="form-control mb-2"
22
     />
22
     />
23
     <div class="slidecontainer mt-4">
23
     <div class="slidecontainer mt-4">
24
       <input type="range" min="5" max="30" value="10" class="slider" id="myRange" v-model="term" />
24
       <input type="range" min="5" max="30" value="10" class="slider" id="myRange" v-model="term" />
80
   },
80
   },
81
   computed: {
81
   computed: {
82
     totalMonthlyPayment() {
82
     totalMonthlyPayment() {
83
-      var rate = this.calcRate;
83
+      var rate = this.rate / 100 / 12;
84
       var years = this.term * 12;
84
       var years = this.term * 12;
85
       var topPart = rate * Math.pow(1 + rate, years);
85
       var topPart = rate * Math.pow(1 + rate, years);
86
       var bottomPart = Math.pow(1 + rate, years) - 1;
86
       var bottomPart = Math.pow(1 + rate, years) - 1;
87
 
87
 
88
-      var netAmnt = parseFloat(this.amount) - parseFloat(this.deposit);
88
+      var netAmnt = this.amount - this.deposit;
89
+
89
       var bond = (netAmnt * topPart) / bottomPart;
90
       var bond = (netAmnt * topPart) / bottomPart;
90
       if (isNaN(bond)) {
91
       if (isNaN(bond)) {
91
         return 0;
92
         return 0;

+ 64
- 50
src/components/property/commercial/createProperty/commercialCreateNew.vue ファイルの表示

5
         <div class="row">
5
         <div class="row">
6
           <div class="col">
6
           <div class="col">
7
             <label v-if="!salesType" class="uniSelectLabel" for="saleType">Sale Type</label>
7
             <label v-if="!salesType" class="uniSelectLabel" for="saleType">Sale Type</label>
8
-            <select class="form-control uniSelect mb-3" name="saleType" v-model="salesType">
9
-              <option value="Sale">To Sell</option>
10
-              <option value="Rental">To Rent</option>
11
-            </select>
8
+            <float-label label="Sale Type">
9
+              <select class="form-control uniSelect mb-3" name="saleType" v-model="salesType">
10
+                <option value="Sale">To Sell</option>
11
+                <option value="Rental">To Rent</option>
12
+              </select>
13
+            </float-label>
12
           </div>
14
           </div>
13
         </div>
15
         </div>
14
-        <div class="row">
16
+        <div class="row mt-2">
15
           <div class="col-md-6">
17
           <div class="col-md-6">
16
             <div v-if="!property.propertyName">
18
             <div v-if="!property.propertyName">
17
               <label for="propertyName" class="uniSelectLabel">PROPERTY NAME</label>
19
               <label for="propertyName" class="uniSelectLabel">PROPERTY NAME</label>
18
             </div>
20
             </div>
19
-            <input
20
-              class="form-control uniInput"
21
-              type="text"
22
-              name="propertyName"
23
-              v-model="property.propertyName"
24
-            />
21
+            <float-label label="PROPERTY NAME">
22
+              <input
23
+                class="form-control uniInput"
24
+                type="text"
25
+                name="propertyName"
26
+                v-model="property.propertyName"
27
+              />
28
+            </float-label>
25
           </div>
29
           </div>
26
           <div class="col-md-6">
30
           <div class="col-md-6">
27
             <div v-if="!property.propertyRef">
31
             <div v-if="!property.propertyRef">
28
               <label for="propertyName" class="uniSelectLabel">PROPERTY REFERENCE</label>
32
               <label for="propertyName" class="uniSelectLabel">PROPERTY REFERENCE</label>
29
             </div>
33
             </div>
30
-            <input
31
-              class="form-control uniInput"
32
-              type="text"
33
-              name="propertyRef"
34
-              v-model="property.propertyRef"
35
-            />
34
+            <float-label label="PROPERTY REFERENCE">
35
+              <input
36
+                class="form-control uniInput"
37
+                type="text"
38
+                name="propertyRef"
39
+                v-model="property.propertyRef"
40
+              />
41
+            </float-label>
36
           </div>
42
           </div>
37
         </div>
43
         </div>
38
         <div class="row my-5">
44
         <div class="row my-5">
54
             <div v-if="!property.unit">
60
             <div v-if="!property.unit">
55
               <label for="unit" class="uniSelectLabel">UNIT</label>
61
               <label for="unit" class="uniSelectLabel">UNIT</label>
56
             </div>
62
             </div>
57
-            <input
58
-              class="form-control uniInput"
59
-              type="text"
60
-              name="unit"
61
-              id="unit"
62
-              v-model="property.unit"
63
-            />
63
+            <float-label label="unit">
64
+              <input
65
+                class="form-control uniInput"
66
+                type="text"
67
+                name="unit"
68
+                id="unit"
69
+                v-model="property.unit"
70
+              />
71
+            </float-label>
64
           </div>
72
           </div>
65
         </div>
73
         </div>
66
         <div class="row my-5">
74
         <div class="row my-5">
84
                     >{{ salesType }} Price</label
92
                     >{{ salesType }} Price</label
85
                   >
93
                   >
86
                 </div>
94
                 </div>
87
-                <currency-input
88
-                  onClick="this.setSelectionRange(0, this.value.length)"
89
-                  name="price"
90
-                  :value="value"
91
-                  @input="value = $event"
92
-                  v-model="property.price"
93
-                  id="price"
94
-                  class="form-control uniInput"
95
-                />
95
+                <float-label label="price">
96
+                  <currency-input
97
+                    onClick="this.setSelectionRange(0, this.value.length)"
98
+                    name="price"
99
+                    :value="value"
100
+                    @input="value = $event"
101
+                    v-model="property.price"
102
+                    id="price"
103
+                    class="form-control uniInput"
104
+                  />
105
+                </float-label>
96
               </div>
106
               </div>
97
               <div v-if="salesType === 'Rental'" class="col-md-6">
107
               <div v-if="salesType === 'Rental'" class="col-md-6">
98
                 <select
108
                 <select
267
         </div>
277
         </div>
268
         <div class="form-group row">
278
         <div class="form-group row">
269
           <div class="col-md-12">
279
           <div class="col-md-12">
270
-            <label class="uniSelectLabel">Virtual Tour (URL)</label>
280
+            <label v-if="!property.virtualTour" class="uniSelectLabel">Virtual Tour (URL)</label>
271
             <div class="input-group-prepend">
281
             <div class="input-group-prepend">
272
-              <input
273
-                class="form-control uniInput"
274
-                type="link"
275
-                name="vtlink"
276
-                id="vtlink"
277
-                v-model="property.virtualTour"
278
-              />
282
+              <float-label label="Virtual Tour (URL)" style="width:100%">
283
+                <input
284
+                  class="form-control uniInput"
285
+                  type="link"
286
+                  name="vtlink"
287
+                  id="vtlink"
288
+                  v-model="property.virtualTour"
289
+                />
290
+              </float-label>
279
             </div>
291
             </div>
280
           </div>
292
           </div>
281
         </div>
293
         </div>
282
         <div class="row">
294
         <div class="row">
283
-          <div class="col-md-12">
284
-            <label class="uniSelectLabel">Video (URL)</label>
295
+          <div class="col-md-12 mt-2">
296
+            <label v-if="!property.video" class="uniSelectLabel">Video (URL)</label>
285
             <div class="input-group-prepend">
297
             <div class="input-group-prepend">
286
-              <input
287
-                class="form-control uniInput"
288
-                type="link"
289
-                name="vlink"
290
-                id="vlink"
291
-                v-model="property.video"
292
-              />
298
+              <float-label label="video " style="width:100%">
299
+                <input
300
+                  class="form-control uniInput"
301
+                  type="link"
302
+                  name="vlink"
303
+                  id="vlink"
304
+                  v-model="property.video"
305
+                />
306
+              </float-label>
293
             </div>
307
             </div>
294
           </div>
308
           </div>
295
         </div>
309
         </div>

+ 27
- 9
src/components/property/commercial/singleView/contentSection.vue ファイルの表示

5
         <div class="col-md-4">
5
         <div class="col-md-4">
6
           <div class="resPortfolioSection" style="margin-top:-5px">
6
           <div class="resPortfolioSection" style="margin-top:-5px">
7
             <iframe
7
             <iframe
8
+              v-if="property.video !== null"
8
               width="100%"
9
               width="100%"
9
               src="https://www.youtube.com/embed/watch_popup?v=qKgHJYzWtVA"
10
               src="https://www.youtube.com/embed/watch_popup?v=qKgHJYzWtVA"
10
               frameborder="0"
11
               frameborder="0"
37
             <h2>Property Detial</h2>
38
             <h2>Property Detial</h2>
38
             <p v-if="property.showAddress">{{ property.streetNumber }} {{ property.streetName }}</p>
39
             <p v-if="property.showAddress">{{ property.streetNumber }} {{ property.streetName }}</p>
39
             <p>{{ property.city }}, {{ property.suburb }}</p>
40
             <p>{{ property.city }}, {{ property.suburb }}</p>
40
-            <div v-for="field in property.displayData[0].values" :key="field.id">
41
+            <div v-if="property.displayData.length > 0">
42
+              <div v-for="(data, i) in property.displayData" :key="i">
43
+                <div v-for="field in data.values" :key="field.id">
44
+                  <p v-if="field.name === 'Floor Size'">{{ field.value }}M<sup>2</sup></p>
45
+                </div>
46
+              </div>
47
+            </div>
48
+            <!-- <div v-for="field in property.displayData[0].values" :key="field.id">
41
               <p v-if="field.name === 'Floor Size'">{{ field.value }}M<sup>2</sup></p>
49
               <p v-if="field.name === 'Floor Size'">{{ field.value }}M<sup>2</sup></p>
42
               <p v-if="field.name === 'Rates & Taxes'">
50
               <p v-if="field.name === 'Rates & Taxes'">
43
                 Rates & Taxes: R{{ field.value | toCurrency }}
51
                 Rates & Taxes: R{{ field.value | toCurrency }}
44
               </p>
52
               </p>
45
-            </div>
53
+            </div> -->
46
             <p>{{ property.shortDescription }}</p>
54
             <p>{{ property.shortDescription }}</p>
47
             <p>{{ property.price | toCurrency }}</p>
55
             <p>{{ property.price | toCurrency }}</p>
48
             <div class="btn-white-border"><i class="fa fa-search"></i>BOOK A VIEWING</div>
56
             <div class="btn-white-border"><i class="fa fa-search"></i>BOOK A VIEWING</div>
77
           <h2 v-else>{{ property.propertyName }}</h2>
85
           <h2 v-else>{{ property.propertyName }}</h2>
78
           <p>{{ property.shortDescription }}</p>
86
           <p>{{ property.shortDescription }}</p>
79
           <h4>Property Features</h4>
87
           <h4>Property Features</h4>
80
-          <div v-for="(data, i) in property.displayData" :key="i" class="row my-3">
81
-            <div v-for="(field, j) in data.values" :key="j" class="col-md-6">
82
-              <div v-if="field.value.toUpperCase() != 'YES'">
83
-                <i class="fa fa-check-circle"></i> {{ field.value }} {{ field.name }}
88
+          <div v-if="property.displayData.length > 0">
89
+            <div v-for="(data, i) in property.displayData" :key="i" class="row my-3">
90
+              <div v-for="(field, j) in data.values" :key="j" class="col-md-6">
91
+                <div v-if="field.value.toUpperCase() != 'YES'">
92
+                  <i class="fa fa-check-circle"></i> {{ field.value }} {{ field.name }}
93
+                </div>
94
+                <div v-else><i class="fa fa-check-circle"></i> {{ field.name }}</div>
84
               </div>
95
               </div>
85
-              <div v-else><i class="fa fa-check-circle"></i> {{ field.name }}</div>
86
             </div>
96
             </div>
87
           </div>
97
           </div>
98
+
88
           <div class="mt-5" v-html="property.description"></div>
99
           <div class="mt-5" v-html="property.description"></div>
89
-          <h4 class="mt-5">Video Tour</h4>
100
+          <router-link
101
+            style="float:right"
102
+            class="btn-solid-blue mt-3"
103
+            :to="{ name: 'EnquireNow', params: { id: $route.params.id } }"
104
+            >MORE INFO...</router-link
105
+          >
106
+          <h4 v-if="property.video !== null" class="mt-5">Video Tour</h4>
90
           <iframe
107
           <iframe
108
+            v-if="property.video !== null"
91
             width="100%"
109
             width="100%"
92
             src="https://www.youtube.com/embed/watch_popup?v=qKgHJYzWtVA"
110
             src="https://www.youtube.com/embed/watch_popup?v=qKgHJYzWtVA"
93
             frameborder="0"
111
             frameborder="0"
123
                     </div>
141
                     </div>
124
                   </td>
142
                   </td>
125
                   <td>
143
                   <td>
126
-                    <router-link class="btn-solid-blue" to="/EnquireNow">MORE INFO</router-link>
144
+                    
127
                   </td>
145
                   </td>
128
                 </tr>
146
                 </tr>
129
               </tbody>
147
               </tbody>

src/components/property/commercial/enquireNow/carouselSection.vue → src/components/property/enquireNow/carouselSection.vue ファイルの表示

20
       style="margin-top:-50px"
20
       style="margin-top:-50px"
21
       :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
21
       :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
22
     >
22
     >
23
-      <img class="item" src="/img/intro-carousel/home-1.jpg" alt="" />
24
-      <img class="item" src="/img/intro-carousel/home-2.jpg" alt="" />
25
-      <img class="item" src="/img/intro-carousel/home-3.jpg" alt="" />
26
-      <img class="item" src="/img/intro-carousel/home-4.jpg" alt="" />
27
-      <img class="item" src="/img/intro-carousel/home-5.jpg" alt="" />
28
-      <img class="item" src="/img/intro-carousel/home-6.jpg" alt="" />
23
+      <img class="item" v-for="(image, i) in images" :key="i" :src="image" />
29
     </carousel>
24
     </carousel>
30
 
25
 
31
     <div id="intro-carousel" class="owl-carousel"></div>
26
     <div id="intro-carousel" class="owl-carousel"></div>
39
 export default {
34
 export default {
40
   components: {
35
   components: {
41
     carousel
36
     carousel
37
+  },
38
+  props: {
39
+    images: {}
42
   }
40
   }
43
 };
41
 };
44
 </script>
42
 </script>

src/components/property/commercial/enquireNow/contentSection.vue → src/components/property/enquireNow/contentSection.vue ファイルの表示

2
   <div class="container pt-5">
2
   <div class="container pt-5">
3
     <div class="row mb-8">
3
     <div class="row mb-8">
4
       <div class="col-md-6">
4
       <div class="col-md-6">
5
-        <h3>Mooikloof Office Park</h3>
6
-        <p>
7
-          The cream of the crop, no costs were spared on the finishing touches of this beautiful
8
-          office. This 160m2 office is ideally situated in Pretoria East in the hub of business
9
-          expansion for Pretoria. Two superb, air-conditioned ground floor units divided only by
10
-          glass and completed with two small recording studios. The Space is currently used for
11
-          corporate boardroom and training centre functions and can accommodate up to 25 delegates.
12
-          Stunning finishes y interior designer complete the unit with style and class. The perfect
13
-          address and office for the established professional for the training centre of your
14
-          dreams!
15
-        </p>
5
+        <h3>{{ property.propertyName }}</h3>
6
+        <p v-html="property.description"></p>
16
         <p><strong>View by Appointment only!</strong></p>
7
         <p><strong>View by Appointment only!</strong></p>
17
         <br />
8
         <br />
18
         <p></p>
9
         <p></p>
19
-        To arrange a viewing contact Mynie:
10
+        <!-- To arrange a viewing contact Mynie:
20
         <div class="col-md-4">
11
         <div class="col-md-4">
21
           <a href="mailto:info@univateproperties.co.za">info@univateproperties.co.za</a><br />
12
           <a href="mailto:info@univateproperties.co.za">info@univateproperties.co.za</a><br />
22
           <a href="tel:0124921238">+27 (0) 12 492 1238</a>
13
           <a href="tel:0124921238">+27 (0) 12 492 1238</a>
23
-        </div>
14
+        </div> -->
24
       </div>
15
       </div>
25
       <div class="col-md-6">
16
       <div class="col-md-6">
26
-        <form>
27
-          <div class="form-group row">
28
-            <div class="form-group col-md-6">
17
+        <div class="form-group row">
18
+          <div class="form-group col-md-6 mb-4">
19
+            <float-label>
29
               <input
20
               <input
30
                 type="text"
21
                 type="text"
31
                 name="name"
22
                 name="name"
33
                 id="Unit"
24
                 id="Unit"
34
                 placeholder="Unit"
25
                 placeholder="Unit"
35
                 data-rule="minlen:4"
26
                 data-rule="minlen:4"
36
-                v-model="Unit"
27
+                v-model="property.unit"
28
+                disabled
37
               />
29
               />
38
-              <div class="validation"></div>
39
-            </div>
40
-            <div class="form-group col-md-6">
30
+            </float-label>
31
+
32
+            <div class="validation"></div>
33
+          </div>
34
+          <div class="form-group col-md-6">
35
+            <float-label>
41
               <input
36
               <input
42
                 type="text"
37
                 type="text"
43
                 name="name"
38
                 name="name"
45
                 id="Price"
40
                 id="Price"
46
                 placeholder="Price"
41
                 placeholder="Price"
47
                 data-rule="minlen:4"
42
                 data-rule="minlen:4"
48
-                v-model="Price"
43
+                v-model="property.price"
44
+                disabled
49
               />
45
               />
50
-              <div class="validation"></div>
51
-            </div>
52
-            <div class="form-group col-md-6">
46
+            </float-label>
47
+
48
+            <div class="validation"></div>
49
+          </div>
50
+          <div class="form-group col-md-6">
51
+            <float-label>
53
               <input
52
               <input
54
                 type="text"
53
                 type="text"
55
                 name="name"
54
                 name="name"
57
                 id="Size"
56
                 id="Size"
58
                 placeholder="Size"
57
                 placeholder="Size"
59
                 data-rule="minlen:4"
58
                 data-rule="minlen:4"
60
-                v-model="Size"
59
+                v-model="size"
60
+                disabled
61
               />
61
               />
62
-              <div class="validation"></div>
63
-            </div>
64
-            <div class="form-group col-md-6">
62
+            </float-label>
63
+
64
+            <div class="validation"></div>
65
+          </div>
66
+          <div class="form-group col-md-6 mb-4">
67
+            <float-label>
65
               <input
68
               <input
66
                 type="text"
69
                 type="text"
67
                 name="name"
70
                 name="name"
69
                 id="Suburb"
72
                 id="Suburb"
70
                 placeholder="Suburb"
73
                 placeholder="Suburb"
71
                 data-rule="minlen:4"
74
                 data-rule="minlen:4"
72
-                v-model="Suburb"
75
+                v-model="property.suburb"
76
+                disabled
73
               />
77
               />
74
-              <div class="validation"></div>
75
-            </div>
76
-            <div class="form-group col-md-12">
78
+            </float-label>
79
+
80
+            <div class="validation"></div>
81
+          </div>
82
+          <div class="form-group col-md-12 mb-4">
83
+            <float-label>
77
               <input
84
               <input
78
                 type="text"
85
                 type="text"
79
                 name="name"
86
                 name="name"
81
                 id="Name"
88
                 id="Name"
82
                 placeholder="Name"
89
                 placeholder="Name"
83
                 data-rule="minlen:4"
90
                 data-rule="minlen:4"
84
-                v-model="Name"
91
+                v-model="name"
85
               />
92
               />
86
-              <div class="validation"></div>
87
-            </div>
88
-            <div class="form-group col-md-12">
93
+            </float-label>
94
+
95
+            <div class="validation"></div>
96
+          </div>
97
+          <div class="form-group col-md-12 mb-4">
98
+            <float-label>
89
               <input
99
               <input
90
                 type="text"
100
                 type="text"
91
                 name="name"
101
                 name="name"
93
                 id="ContactNumber"
103
                 id="ContactNumber"
94
                 placeholder="ContactNumber"
104
                 placeholder="ContactNumber"
95
                 data-rule="minlen:4"
105
                 data-rule="minlen:4"
96
-                v-model="ContactNumber"
106
+                v-model="contactNumber"
97
               />
107
               />
98
-              <div class="validation"></div>
99
-            </div>
100
-            <div class="form-group col-md-12">
108
+            </float-label>
109
+
110
+            <div class="validation"></div>
111
+          </div>
112
+          <div class="form-group col-md-12">
113
+            <float-label>
101
               <input
114
               <input
102
                 type="text"
115
                 type="text"
103
                 name="name"
116
                 name="name"
107
                 data-rule="minlen:4"
120
                 data-rule="minlen:4"
108
                 v-model="email"
121
                 v-model="email"
109
               />
122
               />
110
-              <div class="validation"></div>
111
-            </div>
112
-          </div>
113
-          <div class="text-center">
114
-            <button class="btn-solid-blue" @click="sendMail()">ENQUIRE NOW</button>
115
-          </div>
116
-          <div v-if="boolSent">
117
-            <alert :text="alertMsg" :type="'SUCCESS'" />
123
+            </float-label>
124
+
125
+            <div class="validation"></div>
118
           </div>
126
           </div>
119
-        </form>
127
+        </div>
128
+        <div class="text-center">
129
+          <button class="btn-solid-blue" @click="sendMail()">ENQUIRE NOW</button>
130
+        </div>
131
+        <div v-if="boolSent">
132
+          <alert :text="alertMsg" :type="'SUCCESS'" />
133
+        </div>
120
       </div>
134
       </div>
121
     </div>
135
     </div>
122
   </div>
136
   </div>
125
 <script>
139
 <script>
126
 /* eslint-disable */
140
 /* eslint-disable */
127
 import axios from "axios";
141
 import axios from "axios";
128
-import alert from "../../../shared/alert";
142
+import alert from "../../shared/alert";
129
 
143
 
130
 export default {
144
 export default {
131
   components: {
145
   components: {
136
       alertMsg: "Sent! You can expect a reply soon!",
150
       alertMsg: "Sent! You can expect a reply soon!",
137
       name: null,
151
       name: null,
138
       email: null,
152
       email: null,
139
-      phone: null,
153
+      contactNumber: null,
140
       property: null,
154
       property: null,
141
       message: null,
155
       message: null,
142
       boolSent: false
156
       boolSent: false
145
   mounted() {
159
   mounted() {
146
     this.boolSent = false;
160
     this.boolSent = false;
147
   },
161
   },
162
+  props: {
163
+    property: {}
164
+  },
148
   methods: {
165
   methods: {
149
     async sendMail() {
166
     async sendMail() {
150
       var mailObj = {
167
       var mailObj = {
151
-        toAddress: "lenes@provision-sa.com",
168
+        toAddress: "jlouw365@gmail.com",
152
         fromAddress: "jlouw365@gmail.com",
169
         fromAddress: "jlouw365@gmail.com",
153
         name: this.name,
170
         name: this.name,
154
         email: this.email,
171
         email: this.email,
155
-        phone: this.phone,
156
-        property: this.property,
172
+        phone: this.contactNumber,
173
+        property: this.property.id.toString(),
157
         message: this.message
174
         message: this.message
158
       };
175
       };
159
 
176
 

+ 46
- 0
src/components/property/enquireNow/enquirenow.vue ファイルの表示

1
+<template>
2
+  <div>
3
+    <carouselSection v-if="propertyImages.length > 0" :images="propertyImages" />
4
+    <main id="main" style="margin-top:-20px;padding-bottom:50px">
5
+      <contentSection :property="property" />
6
+    </main>
7
+  </div>
8
+</template>
9
+
10
+<script>
11
+/* eslint-disable */
12
+import { mapState, mapActions } from "vuex";
13
+import carouselSection from "./carouselSection";
14
+import contentSection from "./contentSection";
15
+export default {
16
+  components: {
17
+    carouselSection,
18
+    contentSection
19
+  },
20
+  async mounted() {
21
+    await this.getProperty(this.$route.params.id);
22
+    await this.getPropertyImages(this.$route.params.id);
23
+    this.mayEditProperty(this.$route.params.id);
24
+  },
25
+  computed: {
26
+    ...mapState("property", ["property", "propertyImages"]),
27
+    ...mapState("propertyEdit", ["mayEdit"])
28
+  },
29
+  methods: {
30
+    ...mapActions("property", ["getProperty", "getPropertyImages", "clearPropertyImages"]),
31
+    ...mapActions("propertyEdit", ["mayEditProperty"]),
32
+    formatPrice(value) {
33
+      const val = (value / 1).toFixed(2);
34
+      return val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " ");
35
+    },
36
+    formatAddress(value) {
37
+      if (value !== "") {
38
+        return `${value}<br/>`;
39
+      }
40
+      return "";
41
+    }
42
+  }
43
+};
44
+</script>
45
+
46
+<style lang="scss" scoped></style>

+ 22
- 20
src/components/property/propertyUserField.vue ファイルの表示

1
 <template>
1
 <template>
2
   <div class="row">
2
   <div class="row">
3
-    <div class="col-md-4 mb-2" v-for="(currentField, i) in fields" :key="i">
3
+    <div class="col-md-4 mb-3 mt-2" v-for="(currentField, i) in fields" :key="i">
4
       <div class="input-group-prepend">
4
       <div class="input-group-prepend">
5
         <!-- <span class="input-group-text" style="color: #60CBEB">
5
         <!-- <span class="input-group-text" style="color: #60CBEB">
6
           <b>{{ GetFirstLetter(currentField.name) }}</b>
6
           <b>{{ GetFirstLetter(currentField.name) }}</b>
7
         </span> -->
7
         </span> -->
8
         <div v-if="!setFields[i] && currentField.type !== 'yesno'">
8
         <div v-if="!setFields[i] && currentField.type !== 'yesno'">
9
-          <label class="uniSelectLabel">{{ currentField.name }}</label>
9
+          <label class="uniSelectLabel" style="margin-top:-10px">{{ currentField.name }}</label>
10
         </div>
10
         </div>
11
-        <input
12
-          v-if="currentField.type === 'number'"
13
-          class="form-control uniInput"
14
-          type="number"
15
-          name="currentField.name"
16
-          id="currentField.id"
17
-          v-model="setFields[i]"
18
-          @change="UpdateSetFields(currentField, i)"
19
-        />
11
+        <float-label :label="currentField.name" style="width:100%;top:-1em !important;">
12
+          <input
13
+            v-if="currentField.type === 'number'"
14
+            class="form-control uniInput"
15
+            type="number"
16
+            name="currentField.name"
17
+            id="currentField.id"
18
+            v-model="setFields[i]"
19
+            @change="UpdateSetFields(currentField, i)"
20
+          />
20
 
21
 
21
-        <input
22
-          v-if="currentField.type === 'text'"
23
-          class="form-control uniInput"
24
-          type="text"
25
-          name="currentField.name"
26
-          id="currentField.id"
27
-          v-model="setFields[i]"
28
-          @change="UpdateSetFields(currentField, i)"
29
-        />
22
+          <input
23
+            v-if="currentField.type === 'text'"
24
+            class="form-control uniInput"
25
+            type="text"
26
+            name="currentField.name"
27
+            id="currentField.id"
28
+            v-model="setFields[i]"
29
+            @change="UpdateSetFields(currentField, i)"
30
+          />
31
+        </float-label>
30
       </div>
32
       </div>
31
     </div>
33
     </div>
32
 
34
 

+ 56
- 56
src/components/property/residential/createProperty/residentialCreateNew.vue ファイルの表示

5
         <div class="row">
5
         <div class="row">
6
           <div class="col">
6
           <div class="col">
7
             <label v-if="!salesType" class="uniSelectLabel" for="saleType">Sale Type</label>
7
             <label v-if="!salesType" class="uniSelectLabel" for="saleType">Sale Type</label>
8
-            <select class="form-control uniSelect mb-3" name="saleType" v-model="salesType">
9
-              <option value="Sale">To Sell</option>
10
-              <option value="Rental">To Rent</option>
11
-            </select>
8
+            <float-label label="Sale Type">
9
+              <select class="form-control uniSelect mb-3" name="saleType" v-model="salesType">
10
+                <option value="Sale">To Sell</option>
11
+                <option value="Rental">To Rent</option>
12
+              </select>
13
+            </float-label>
12
           </div>
14
           </div>
13
         </div>
15
         </div>
14
-        <div class="row">
16
+        <div class="row mt-2">
15
           <div class="col-md-6">
17
           <div class="col-md-6">
16
             <div v-if="!property.propertyName">
18
             <div v-if="!property.propertyName">
17
               <label for="propertyName" class="uniSelectLabel">PROPERTY NAME</label>
19
               <label for="propertyName" class="uniSelectLabel">PROPERTY NAME</label>
18
             </div>
20
             </div>
19
-            <input
20
-              class="form-control uniInput"
21
-              type="text"
22
-              name="propertyName"
23
-              v-model="property.propertyName"
24
-            />
21
+            <float-label label="PROPERTY NAME">
22
+              <input
23
+                class="form-control uniInput"
24
+                type="text"
25
+                name="propertyName"
26
+                v-model="property.propertyName"
27
+              />
28
+            </float-label>
25
           </div>
29
           </div>
26
           <div class="col-md-6">
30
           <div class="col-md-6">
27
             <div v-if="!property.propertyRef">
31
             <div v-if="!property.propertyRef">
28
               <label for="propertyName" class="uniSelectLabel">PROPERTY REFERENCE</label>
32
               <label for="propertyName" class="uniSelectLabel">PROPERTY REFERENCE</label>
29
             </div>
33
             </div>
30
-            <input
31
-              class="form-control uniInput"
32
-              type="text"
33
-              name="propertyRef"
34
-              v-model="property.propertyRef"
35
-            />
34
+            <float-label label="PROPERTY REFERENCE">
35
+              <input
36
+                class="form-control uniInput"
37
+                type="text"
38
+                name="propertyRef"
39
+                v-model="property.propertyRef"
40
+              />
41
+            </float-label>
36
           </div>
42
           </div>
37
         </div>
43
         </div>
38
         <div class="row my-5">
44
         <div class="row my-5">
50
               }}</option>
56
               }}</option>
51
             </select>
57
             </select>
52
           </div>
58
           </div>
53
-          <div v-if="propertyType === 'Commercial'" class="col-md-2">
54
-            <div v-if="!property.unit">
55
-              <label for="unit" class="uniSelectLabel">UNIT</label>
56
-            </div>
57
-            <input
58
-              class="form-control uniInput"
59
-              type="text"
60
-              name="unit"
61
-              id="unit"
62
-              v-model="property.unit"
63
-            />
64
-          </div>
65
         </div>
59
         </div>
66
         <div class="row my-5">
60
         <div class="row my-5">
67
           <div class="col-md-6">
61
           <div class="col-md-6">
84
                     >{{ salesType }} Price</label
78
                     >{{ salesType }} Price</label
85
                   >
79
                   >
86
                 </div>
80
                 </div>
87
-                <currency-input
88
-                  onClick="this.setSelectionRange(0, this.value.length)"
89
-                  name="price"
90
-                  :value="value"
91
-                  @input="value = $event"
92
-                  v-model="property.price"
93
-                  id="price"
94
-                  class="form-control uniInput"
95
-                />
81
+                <float-label label="Price">
82
+                  <currency-input
83
+                    onClick="this.setSelectionRange(0, this.value.length)"
84
+                    name="price"
85
+                    :value="value"
86
+                    @input="value = $event"
87
+                    v-model="property.price"
88
+                    id="price"
89
+                    class="form-control uniInput"
90
+                  />
91
+                </float-label>
96
               </div>
92
               </div>
97
               <div v-if="salesType === 'Rental'" class="col-md-6">
93
               <div v-if="salesType === 'Rental'" class="col-md-6">
98
                 <select
94
                 <select
293
           </div>
289
           </div>
294
         </div>
290
         </div>
295
         <div class="form-group row">
291
         <div class="form-group row">
296
-          <div class="col-md-12">
297
-            <label class="uniSelectLabel">Virtual Tour (URL)</label>
292
+          <div class="col-md-12 mt-2">
293
+            <label v-if="!property.virtualTour" class="uniSelectLabel">Virtual Tour (URL)</label>
298
             <div class="input-group-prepend">
294
             <div class="input-group-prepend">
299
-              <input
300
-                class="form-control uniInput"
301
-                type="link"
302
-                name="vtlink"
303
-                id="vtlink"
304
-                v-model="property.virtualTour"
305
-              />
295
+              <float-label label="Virtual Tour (URL)" style="width:100%">
296
+                <input
297
+                  class="form-control uniInput"
298
+                  type="link"
299
+                  name="vtlink"
300
+                  id="vtlink"
301
+                  v-model="property.virtualTour"
302
+                />
303
+              </float-label>
306
             </div>
304
             </div>
307
           </div>
305
           </div>
308
         </div>
306
         </div>
309
         <div class="row">
307
         <div class="row">
310
-          <div class="col-md-12">
311
-            <label class="uniSelectLabel">Video (URL)</label>
308
+          <div class="col-md-12 mt-2">
309
+            <label v-if="!property.video" class="uniSelectLabel">Video (URL)</label>
312
             <div class="input-group-prepend">
310
             <div class="input-group-prepend">
313
-              <input
314
-                class="form-control uniInput"
315
-                type="link"
316
-                name="vlink"
317
-                id="vlink"
318
-                v-model="property.video"
319
-              />
311
+              <float-label label="Video (URL)" style="width:100%">
312
+                <input
313
+                  class="form-control uniInput"
314
+                  type="link"
315
+                  name="vlink"
316
+                  id="vlink"
317
+                  v-model="property.video"
318
+                />
319
+              </float-label>
320
             </div>
320
             </div>
321
           </div>
321
           </div>
322
         </div>
322
         </div>

+ 27
- 10
src/components/property/residential/singleView/contentSection.vue ファイルの表示

5
         <div class="col-md-4">
5
         <div class="col-md-4">
6
           <div class="resPortfolioSection">
6
           <div class="resPortfolioSection">
7
             <iframe
7
             <iframe
8
+              v-if="property.video != null"
8
               width="100%"
9
               width="100%"
9
               src="https://www.youtube.com/embed/watch_popup?v=qKgHJYzWtVA"
10
               src="https://www.youtube.com/embed/watch_popup?v=qKgHJYzWtVA"
10
               frameborder="0"
11
               frameborder="0"
48
           </div>
49
           </div>
49
           <div class="panel-left px-5 pb-5 text-center">
50
           <div class="panel-left px-5 pb-5 text-center">
50
             <h4 class="text-white">Share this Property</h4>
51
             <h4 class="text-white">Share this Property</h4>
51
-            <a id="fb_share" href="#" target="_blank"
52
-              ><img src="img/icon-facebook.svg" alt="Share on Facebook" class="col-3 p-1 mx-1"
53
-            /></a>
52
+            <ShareNetwork
53
+              v-if="currentUrl !== ''"
54
+              network="facebook"
55
+              :url="currentUrl"
56
+              title="Uni-Vate Property Listing"
57
+              description="Check out this property on Uni-Vate Properties!"
58
+              quote="The hot reload is so fast it\'s near instant. - Evan You"
59
+              hashtags="vuejs,vite"
60
+            >
61
+              <img src="img/icon-facebook.svg" alt="Share on Facebook" class="col-3 p-1 mx-1" />
62
+            </ShareNetwork>
63
+
54
             <a
64
             <a
55
               href="mailto:?Subject=Simple Share Buttons&amp;Body=I%20saw%20this%20and%20thought%20of%20you!%20 https://www.univateproperties.co.za/"
65
               href="mailto:?Subject=Simple Share Buttons&amp;Body=I%20saw%20this%20and%20thought%20of%20you!%20 https://www.univateproperties.co.za/"
56
               ><img src="/img/icon-email.svg" alt="Share on email" class="col-3 p-1 mx-1"
66
               ><img src="/img/icon-email.svg" alt="Share on email" class="col-3 p-1 mx-1"
64
             /></a>
74
             /></a>
65
           </div>
75
           </div>
66
         </div>
76
         </div>
77
+        <div></div>
67
         <div class="col-md-8 p-5 resort-profile">
78
         <div class="col-md-8 p-5 resort-profile">
68
           <h2 v-if="property.showAddress">
79
           <h2 v-if="property.showAddress">
69
             <div style="display:inline" v-if="property.propertyName !== null">
80
             <div style="display:inline" v-if="property.propertyName !== null">
81
             </div>
92
             </div>
82
           </div>
93
           </div>
83
           <div>
94
           <div>
95
+            <router-link
96
+              style="float:right"
97
+              class="btn-solid-blue mt-3"
98
+              :to="{ name: 'EnquireNow', params: { id: $route.params.id } }"
99
+              >MORE INFO...</router-link
100
+            >
84
             <h4>Property Features</h4>
101
             <h4>Property Features</h4>
85
 
102
 
86
             <div v-for="(data, i) in property.displayData" :key="i" class="row my-3">
103
             <div v-for="(data, i) in property.displayData" :key="i" class="row my-3">
92
               </div>
109
               </div>
93
             </div>
110
             </div>
94
           </div>
111
           </div>
95
-          <h4 class="mt-5">Video Tour</h4>
112
+          <h4 v-if="property.video != null" class="mt-5">Video Tour</h4>
96
           <iframe
113
           <iframe
114
+            v-if="property.video != null"
97
             width="100%"
115
             width="100%"
98
             src="https://www.youtube.com/embed/watch_popup?v=qKgHJYzWtVA"
116
             src="https://www.youtube.com/embed/watch_popup?v=qKgHJYzWtVA"
99
             frameborder="0"
117
             frameborder="0"
125
 /* eslint-disable */
143
 /* eslint-disable */
126
 import { mapState, mapActions } from "vuex";
144
 import { mapState, mapActions } from "vuex";
127
 import gallery from "../../../shared/gallerySlideShow";
145
 import gallery from "../../../shared/gallerySlideShow";
128
-import { ShareFacebook } from "vue-share-social";
146
+import { ShareFacebook } from "vue-social-sharing";
129
 export default {
147
 export default {
130
   components: {
148
   components: {
131
     gallery,
149
     gallery,
137
   },
155
   },
138
   created() {
156
   created() {
139
     //this.getListsForPropertyEdit(this.property.id);
157
     //this.getListsForPropertyEdit(this.property.id);
140
-    console.log(this.property.displayData);
141
   },
158
   },
142
-  mounted() {
143
-    // var facebookShare = document.getElementById("fb_share");
144
-    // facebookShare.href = "http://www.facebook.com/share.php?u=" + encodeURIComponent(location.href);
159
+  async mounted() {
160
+    this.currentUrl = window.location.origin + this.$route.fullPath;
145
   },
161
   },
146
   data() {
162
   data() {
147
     return {
163
     return {
148
       index: null,
164
       index: null,
149
-      date: new Date()
165
+      date: new Date(),
166
+      currentUrl: ""
150
     };
167
     };
151
   },
168
   },
152
   methods: {
169
   methods: {

+ 3
- 0
src/components/shared/footerSection.vue ファイルの表示

27
               <router-link class="footerText" to="/websiteDisclaimer"
27
               <router-link class="footerText" to="/websiteDisclaimer"
28
                 >Website Disclaimer</router-link
28
                 >Website Disclaimer</router-link
29
               ><br />
29
               ><br />
30
+              <router-link class="footerText" to="/termsConditionsView"
31
+                >Terms & Conditions</router-link
32
+              ><br />
30
             </p>
33
             </p>
31
           </div>
34
           </div>
32
           <div class="col-lg-9 section-header" id="contactFoot">
35
           <div class="col-lg-9 section-header" id="contactFoot">

+ 11
- 15
src/components/shared/listView.vue ファイルの表示

2
 <template>
2
 <template>
3
   <div>
3
   <div>
4
     <div style="height:5px"></div>
4
     <div style="height:5px"></div>
5
-    <div class="d-flex justify-content-between table-title">
5
+    <div class="d-flex justify-content-between ">
6
       <div class="p-2" v-if="!hideSearch">
6
       <div class="p-2" v-if="!hideSearch">
7
-        <input v-model="searchItem" class="form-control" placeholder="Search...." />
7
+        <float-label>
8
+          <input v-model="searchItem" class="form-control uniInput mt-3" placeholder="Search...." />
9
+        </float-label>
8
       </div>
10
       </div>
9
       <div class="p-2" v-if="title">
11
       <div class="p-2" v-if="title">
10
         <h2>{{ title }}</h2>
12
         <h2>{{ title }}</h2>
12
       <div class="p-2">
14
       <div class="p-2">
13
         <div class="d-flex flex-row">
15
         <div class="d-flex flex-row">
14
           <div class="p2" v-if="showColumnChooser">
16
           <div class="p2" v-if="showColumnChooser">
15
-            <div
16
-              class="btn btn-primary myBackground btn-width cursor-pointer"
17
-              data-toggle="modal"
18
-              data-target="#myModal"
19
-            >
17
+            <div class="btn-solid-blue cursor-pointer" data-toggle="modal" data-target="#myModal">
20
               Column Chooser
18
               Column Chooser
21
             </div>
19
             </div>
22
             <div class="col-md-12">
20
             <div class="col-md-12">
23
               <div id="myModal" class="modal fade" role="dialog">
21
               <div id="myModal" class="modal fade" role="dialog">
24
-                <div class="modal-dialog modal-lg">
22
+                <div class="modal-dialog modal-lg" style="width:500px">
25
                   <!-- Modal content-->
23
                   <!-- Modal content-->
26
                   <div class="modal-content">
24
                   <div class="modal-content">
27
                     <div class="modal-header">
25
                     <div class="modal-header">
28
                       <h5>Column Chooser</h5>
26
                       <h5>Column Chooser</h5>
29
                       <button type="button" class="close" data-dismiss="modal">&times;</button>
27
                       <button type="button" class="close" data-dismiss="modal">&times;</button>
30
                     </div>
28
                     </div>
31
-                    <div style="margin-left:50px; margin-right:50px;margin-bottom:50px;">
29
+                    <div style="margin-bottom:50px;">
32
                       <ListViewControl :items="allColumn" @checkItem="checkItem" />
30
                       <ListViewControl :items="allColumn" @checkItem="checkItem" />
33
                     </div>
31
                     </div>
34
                   </div>
32
                   </div>
37
             </div>
35
             </div>
38
           </div>
36
           </div>
39
           <div class="p2" v-if="selectedItems.length > 0">
37
           <div class="p2" v-if="selectedItems.length > 0">
40
-            <div
41
-              class="btn btn-primary myBackground btn-width cursor-pointer"
42
-              @click="onClearSelected()"
43
-            >
38
+            <div class="btn-solid-blue cursor-pointer" @click="onClearSelected()">
44
               Clear Selected
39
               Clear Selected
45
             </div>
40
             </div>
46
           </div>
41
           </div>
47
           <div class="p2" v-if="showNew">
42
           <div class="p2" v-if="showNew">
48
-            <div class="btn btn-primary myBackground btn-width cursor-pointer" @click="onNew()">
43
+            <div class="btn-solid-blue cursor-pointer" @click="onNew()">
49
               New
44
               New
50
             </div>
45
             </div>
51
           </div>
46
           </div>
56
     <div v-if="items && items.length > 0" class="table-responsive">
51
     <div v-if="items && items.length > 0" class="table-responsive">
57
       <table
52
       <table
58
         id="table"
53
         id="table"
54
+        class="table table-striped"
59
         :class="{ 'table table-hover': 1 === 1, 'table-sm': compact, 'table-bordered': bordered }"
55
         :class="{ 'table table-hover': 1 === 1, 'table-sm': compact, 'table-bordered': bordered }"
60
       >
56
       >
61
         <thead>
57
         <thead>
94
             <th v-if="deleteable"></th>
90
             <th v-if="deleteable"></th>
95
           </tr>
91
           </tr>
96
         </thead>
92
         </thead>
97
-        <tbody class="my-table">
93
+        <tbody class="table">
98
           <tr
94
           <tr
99
             v-for="(item, i) in DisplayItems"
95
             v-for="(item, i) in DisplayItems"
100
             :key="i"
96
             :key="i"

+ 15
- 14
src/components/shared/listViewControl.vue ファイルの表示

1
 <template>
1
 <template>
2
   <div class="container">
2
   <div class="container">
3
-    <div class="offset-3 col-md-6">
4
-      <input v-model="searchItem" class="form-control" placeholder="Search...." />
3
+    <div class="row">
4
+      <div class="col-md-12">
5
+        <input v-model="searchItem" class="form-control" placeholder="Search...." />
6
+      </div>
5
     </div>
7
     </div>
8
+
6
     <hr />
9
     <hr />
7
     <div class="row">
10
     <div class="row">
8
-      <div v-for="item in items" :key="item" class="col-md-4">
9
-        <div :class="{'inSearch': isInSelected(item)}">
11
+      <div v-for="item in items" :key="item" class="col-md-6">
12
+        <div :class="{ inSearch: isInSelected(item) }">
10
           <CheckItem :title="item.column" :show="item.show" @checkItem="checkItem" />
13
           <CheckItem :title="item.column" :show="item.show" @checkItem="checkItem" />
11
         </div>
14
         </div>
12
       </div>
15
       </div>
14
   </div>
17
   </div>
15
 </template>
18
 </template>
16
 <script>
19
 <script>
17
-import CheckItem from './checkItem.vue';
20
+import CheckItem from "./checkItem.vue";
18
 
21
 
19
 export default {
22
 export default {
20
   components: {
23
   components: {
21
-    CheckItem,
24
+    CheckItem
22
   },
25
   },
23
   data() {
26
   data() {
24
     return {
27
     return {
25
-      searchItem: undefined,
28
+      searchItem: undefined
26
     };
29
     };
27
   },
30
   },
28
   props: {
31
   props: {
29
-    items: undefined,
32
+    items: undefined
30
   },
33
   },
31
   methods: {
34
   methods: {
32
     isInSelected(i) {
35
     isInSelected(i) {
33
       if (this.searchItem && this.searchItem.length > 0) {
36
       if (this.searchItem && this.searchItem.length > 0) {
34
-        return (
35
-          i.column.toLowerCase().indexOf(this.searchItem.toLowerCase()) > -1
36
-        );
37
+        return i.column.toLowerCase().indexOf(this.searchItem.toLowerCase()) > -1;
37
       }
38
       }
38
       return false;
39
       return false;
39
     },
40
     },
40
     checkItem(column, show) {
41
     checkItem(column, show) {
41
-      this.$emit('checkItem', column, show);
42
-    },
42
+      this.$emit("checkItem", column, show);
43
+    }
43
   },
44
   },
44
-  computed: {},
45
+  computed: {}
45
 };
46
 };
46
 </script>
47
 </script>
47
 <style>
48
 <style>

+ 20
- 5
src/components/shared/navBar.vue ファイルの表示

50
                       Commercial
50
                       Commercial
51
                     </a>
51
                     </a>
52
                     <ul style="margin-top:-10px; text-align:left" :class="commercialClass">
52
                     <ul style="margin-top:-10px; text-align:left" :class="commercialClass">
53
-                      <li>
54
-                        
53
+                      <li>                     
55
                       </li>
54
                       </li>
56
                       <hr />
55
                       <hr />
57
                       <li>
56
                       <li>
179
                   <li class="mx-1">
178
                   <li class="mx-1">
180
                     <router-link to="/share/contact">Contact Us</router-link>
179
                     <router-link to="/share/contact">Contact Us</router-link>
181
                   </li>
180
                   </li>
182
-                  <li v-if="isLoggedIn" class="menu-has-children mx-1">
181
+                  <li v-if="USER" class="menu-has-children mx-1">
183
                     <div
182
                     <div
184
                       @mouseover="userClass = 'ts-display'"
183
                       @mouseover="userClass = 'ts-display'"
185
                       @mouseleave="userClass = 'no-display'"
184
                       @mouseleave="userClass = 'no-display'"
186
                     ></div>
185
                     ></div>
186
+
187
                     <a href="#" class="sf-with-ul">
187
                     <a href="#" class="sf-with-ul">
188
                       {{ NAME }}
188
                       {{ NAME }}
189
                     </a>
189
                     </a>
280
                           <li>
280
                           <li>
281
                             <router-link to="/fees">Fees</router-link>
281
                             <router-link to="/fees">Fees</router-link>
282
                           </li>
282
                           </li>
283
+                          <li>
284
+                            <router-link to="/termsConditions"
285
+                              >Edit Terms and Conditions</router-link
286
+                            >
287
+                          </li>
283
                         </ul>
288
                         </ul>
284
                       </li>
289
                       </li>
285
                       <li v-if="ROLE === 'Super Admin'" class="menu-has-children">
290
                       <li v-if="ROLE === 'Super Admin'" class="menu-has-children">
326
                     </ul>
331
                     </ul>
327
                   </li>
332
                   </li>
328
 
333
 
329
-                  <li v-if="!isLoggedIn">
334
+                  <li v-if="!USER">
330
                     <router-link class="btn-white-border p-2 ml-1 mr-1" to="/user/login"
335
                     <router-link class="btn-white-border p-2 ml-1 mr-1" to="/user/login"
331
                       >Login</router-link
336
                       >Login</router-link
332
                     >
337
                     >
333
                   </li>
338
                   </li>
334
 
339
 
335
-                  <li v-if="!isLoggedIn">
340
+                  <li v-if="!USER">
336
                     <router-link class=" btn-solid-blue pt-2 pb-2" to="/user/register"
341
                     <router-link class=" btn-solid-blue pt-2 pb-2" to="/user/register"
337
                       >Register</router-link
342
                       >Register</router-link
338
                     >
343
                     >
435
     NAME() {
440
     NAME() {
436
       return Log.getPerson().name;
441
       return Log.getPerson().name;
437
     },
442
     },
443
+    USER() {
444
+      var userObj = {};
445
+      if (!this.user) {
446
+        userObj = JSON.parse(localStorage.getItem("user"));
447
+      } else {
448
+        userObj = this.user;
449
+      }
450
+
451
+      return userObj;
452
+    },
438
     ROLE() {
453
     ROLE() {
439
       var userObj = JSON.parse(localStorage.getItem("user"));
454
       var userObj = JSON.parse(localStorage.getItem("user"));
440
       return userObj.role;
455
       return userObj.role;

+ 1
- 1
src/components/timeshare/myWeeksPage.vue ファイルの表示

17
         <button
17
         <button
18
           type="button"
18
           type="button"
19
           :class="{
19
           :class="{
20
-            'form-control btn btn-primary ': 1 === 1,
20
+            'form-control btn-solid-blue ': 1 === 1,
21
             'my-disable':
21
             'my-disable':
22
               !(selectedItems.length == 1) ||
22
               !(selectedItems.length == 1) ||
23
               !items[selectedItems] ||
23
               !items[selectedItems] ||

+ 293
- 231
src/components/timeshare/sell/contentSection.vue ファイルの表示

62
             <div id="sendmessage">Your details has been sent. Thank you!</div>
62
             <div id="sendmessage">Your details has been sent. Thank you!</div>
63
             <div id="errormessage"></div>
63
             <div id="errormessage"></div>
64
             <div class="form-row">
64
             <div class="form-row">
65
-              <div class="form-group col-md-6">
65
+              <div class="form-group col-md-6 mt-2">
66
                 <div class="input-group">
66
                 <div class="input-group">
67
                   <label v-if="!sellItem.region" class="uniSelectLabel" for="weekInfoRegionSelect"
67
                   <label v-if="!sellItem.region" class="uniSelectLabel" for="weekInfoRegionSelect"
68
                     >REGION</label
68
                     >REGION</label
69
                   >
69
                   >
70
-
71
-                  <select
72
-                    id="weekInfoRegionSelect"
73
-                    class="form-control uniSelect"
74
-                    v-model="sellItem.region"
75
-                    @change="regionChange()"
76
-                    style="font-size: 15px"
77
-                  >
78
-                    <option v-for="(region, r) in regions" :key="r" :value="region">{{
79
-                      region.regionName
80
-                    }}</option>
81
-                  </select>
70
+                  <float-label label="REGION" style="width:100%">
71
+                    <select
72
+                      id="weekInfoRegionSelect"
73
+                      class="form-control uniSelect"
74
+                      v-model="sellItem.region"
75
+                      @change="regionChange()"
76
+                      style="font-size: 15px"
77
+                    >
78
+                      <option v-for="(region, r) in regions" :key="r" :value="region">{{
79
+                        region.regionName
80
+                      }}</option>
81
+                    </select>
82
+                  </float-label>
82
                 </div>
83
                 </div>
83
 
84
 
84
                 <!-- <input
85
                 <!-- <input
92
                 />-->
93
                 />-->
93
                 <div class="validation"></div>
94
                 <div class="validation"></div>
94
               </div>
95
               </div>
95
-              <div class="form-group col-md-6">
96
+              <div class="form-group col-md-6 mt-2">
96
                 <div class="input-group">
97
                 <div class="input-group">
97
                   <label v-if="!sellItem.resort" class="uniSelectLabel" for="weekInfoResortSelect"
98
                   <label v-if="!sellItem.resort" class="uniSelectLabel" for="weekInfoResortSelect"
98
                     >RESORT NAME</label
99
                     >RESORT NAME</label
99
                   >
100
                   >
100
-
101
-                  <select
102
-                    id="weekInfoResortSelect"
103
-                    class="form-control uniSelect"
104
-                    v-model="sellItem.resort"
105
-                    @change="resortChange()"
106
-                  >
107
-                    <option value="Other">Other</option>
108
-                    <option v-for="(resort, r) in filteredResort" :key="r" :value="resort">{{
109
-                      resort.resortName
110
-                    }}</option>
111
-                  </select>
101
+                  <float-label label="RESORT NAME" style="width:100%">
102
+                    <select
103
+                      id="weekInfoResortSelect"
104
+                      class="form-control uniSelect"
105
+                      v-model="sellItem.resort"
106
+                      @change="resortChange()"
107
+                    >
108
+                      <option value="Other">Other</option>
109
+                      <option v-for="(resort, r) in filteredResort" :key="r" :value="resort">{{
110
+                        resort.resortName
111
+                      }}</option>
112
+                    </select>
113
+                  </float-label>
112
                 </div>
114
                 </div>
113
                 <!-- <input
115
                 <!-- <input
114
                     type="text"
116
                     type="text"
131
                   v-model="sellItem.otherResortName"
133
                   v-model="sellItem.otherResortName"
132
                 />
134
                 />
133
               </div>
135
               </div>
134
-              <div class="form-group col-md-6">
136
+              <div class="form-group col-md-6 mt-2">
135
                 <div v-if="sellItem.otherResort">
137
                 <div v-if="sellItem.otherResort">
136
                   <label v-if="!sellItem.region" class="uniSelectLabel" for="region">REGION</label>
138
                   <label v-if="!sellItem.region" class="uniSelectLabel" for="region">REGION</label>
137
                 </div>
139
                 </div>
146
                   <option v-for="(region, r) in regions" :key="r">{{ region.regionName }}</option>
148
                   <option v-for="(region, r) in regions" :key="r">{{ region.regionName }}</option>
147
                 </select>
149
                 </select>
148
               </div>
150
               </div>
149
-              <div class="form-group col-md-6">
150
-                <input
151
-                  type="number"
152
-                  class="form-control"
153
-                  name="unitNumber"
154
-                  id="unitNumber"
155
-                  placeholder="UNIT NUMBER"
156
-                  v-model="sellItem.unitNumber"
157
-                  data-msg="Please enter unit number"
158
-                />
151
+              <div class="form-group col-md-6 mt-2">
152
+                <float-label>
153
+                  <input
154
+                    type="number"
155
+                    class="form-control"
156
+                    name="unitNumber"
157
+                    id="unitNumber"
158
+                    placeholder="UNIT NUMBER"
159
+                    v-model="sellItem.unitNumber"
160
+                    data-msg="Please enter unit number"
161
+                  />
162
+                </float-label>
163
+
159
                 <div class="validation"></div>
164
                 <div class="validation"></div>
160
               </div>
165
               </div>
161
-              <div class="form-group col-md-6">
162
-                <input
163
-                  type="number"
164
-                  class="form-control"
165
-                  name="week"
166
-                  id="week"
167
-                  placeholder="UNIT / WEEK NUMBER"
168
-                  v-model="sellItem.module"
169
-                  data-msg="Please enter week number"
170
-                />
166
+              <div class="form-group col-md-6 mt-2">
167
+                <float-label>
168
+                  <input
169
+                    type="number"
170
+                    class="form-control"
171
+                    name="week"
172
+                    id="week"
173
+                    placeholder="UNIT / WEEK NUMBER"
174
+                    v-model="sellItem.module"
175
+                    data-msg="Please enter week number"
176
+                  />
177
+                </float-label>
178
+
171
                 <div class="validation"></div>
179
                 <div class="validation"></div>
172
               </div>
180
               </div>
173
-              <div class="form-group col-md-6">
181
+              <div class="form-group col-md-6 mt-2">
174
                 <label v-if="!sellItem.season" class="uniSelectLabel" for="region">SEASON</label>
182
                 <label v-if="!sellItem.season" class="uniSelectLabel" for="region">SEASON</label>
183
+                <float-label label="SEASON">
184
+                  <select
185
+                    class="form-control uniSelect"
186
+                    name="region"
187
+                    id="region"
188
+                    v-model="sellItem.season"
189
+                  >
190
+                    <option v-for="(season, r) in seasons" :key="r">{{ season.name }}</option>
191
+                  </select>
192
+                </float-label>
175
 
193
 
176
-                <select
177
-                  class="form-control uniSelect"
178
-                  name="region"
179
-                  id="region"
180
-                  v-model="sellItem.season"
181
-                >
182
-                  <option v-for="(season, r) in seasons" :key="r">{{ season.name }}</option>
183
-                </select>
184
                 <div class="validation"></div>
194
                 <div class="validation"></div>
185
               </div>
195
               </div>
186
-              <div class="form-group col-md-6">
196
+              <div class="form-group col-md-6 mt-2">
187
                 <label v-if="!sellItem.bedrooms" class="uniSelectLabel" for="region"
197
                 <label v-if="!sellItem.bedrooms" class="uniSelectLabel" for="region"
188
                   >BEDROOM/S</label
198
                   >BEDROOM/S</label
189
                 >
199
                 >
200
+                <float-label label="BEDROOM/S">
201
+                  <select
202
+                    class="form-control uniSelect"
203
+                    name="region"
204
+                    id="region"
205
+                    v-model="sellItem.bedrooms"
206
+                  >
207
+                    <option v-for="(item, i) in resortBedrooms" :key="i">{{ item }}</option>
208
+                  </select>
209
+                </float-label>
190
 
210
 
191
-                <select
192
-                  class="form-control uniSelect"
193
-                  name="region"
194
-                  id="region"
195
-                  v-model="sellItem.bedrooms"
196
-                >
197
-                  <option v-for="(item, i) in resortBedrooms" :key="i">{{ item }}</option>
198
-                </select>
199
                 <div class="validation"></div>
211
                 <div class="validation"></div>
200
               </div>
212
               </div>
201
-              <div class="form-group col-md-6">
213
+              <div class="form-group col-md-6 mt-2">
202
                 <label v-if="!sellItem.maxSleep" class="uniSelectLabel" for="region"
214
                 <label v-if="!sellItem.maxSleep" class="uniSelectLabel" for="region"
203
                   >SLEEP MAX</label
215
                   >SLEEP MAX</label
204
                 >
216
                 >
217
+                <float-label label="SLEEP MAX">
218
+                  <select
219
+                    class="form-control uniSelect"
220
+                    name="region"
221
+                    id="region"
222
+                    v-model="sellItem.maxSleep"
223
+                  >
224
+                    <option v-for="(item, i) in maxSleep" :key="i">{{ item }}</option>
225
+                  </select>
226
+                </float-label>
205
 
227
 
206
-                <select
207
-                  class="form-control uniSelect"
208
-                  name="region"
209
-                  id="region"
210
-                  v-model="sellItem.maxSleep"
211
-                >
212
-                  <option v-for="(item, i) in maxSleep" :key="i">{{ item }}</option>
213
-                </select>
214
                 <div class="validation"></div>
228
                 <div class="validation"></div>
215
               </div>
229
               </div>
216
-              <div class="form-group col-md-6">
217
-                <input
218
-                  type="number"
219
-                  class="form-control"
220
-                  name="levy"
221
-                  id="levy"
222
-                  placeholder="Levy Amount"
223
-                  v-model="sellItem.levyAmount"
224
-                  data-msg="Please enter levy amount"
225
-                />
230
+              <div class="form-group col-md-6 mt-2">
231
+                <float-label>
232
+                  <input
233
+                    type="number"
234
+                    class="form-control"
235
+                    name="levy"
236
+                    id="levy"
237
+                    placeholder="Levy Amount"
238
+                    v-model="sellItem.levyAmount"
239
+                    data-msg="Please enter levy amount"
240
+                  />
241
+                </float-label>
242
+
226
                 <div class="validation"></div>
243
                 <div class="validation"></div>
227
               </div>
244
               </div>
228
-              <div class="form-group col-md-6">
245
+              <div class="form-group col-md-6 mt-2">
229
                 <label v-if="!sellItem.weekType" class="uniSelectLabel" for="region"
246
                 <label v-if="!sellItem.weekType" class="uniSelectLabel" for="region"
230
                   >WEEK TYPE</label
247
                   >WEEK TYPE</label
231
                 >
248
                 >
232
-                <select
233
-                  class="form-control uniSelect"
234
-                  name="region"
235
-                  id="region"
236
-                  v-model="sellItem.weekType"
237
-                >
238
-                  <option :key="0">Flexi</option>
239
-                  <option :key="1">Fixed</option>
240
-                  <option :key="2">Module</option>
241
-                  <option :key="3">Syndicate</option>
242
-                </select>
249
+                <float-label label="WEEK TYPE">
250
+                  <select
251
+                    class="form-control uniSelect"
252
+                    name="region"
253
+                    id="region"
254
+                    v-model="sellItem.weekType"
255
+                  >
256
+                    <option :key="0">Flexi</option>
257
+                    <option :key="1">Fixed</option>
258
+                    <option :key="2">Module</option>
259
+                    <option :key="3">Syndicate</option>
260
+                  </select>
261
+                </float-label>
243
               </div>
262
               </div>
244
             </div>
263
             </div>
245
           </div>
264
           </div>
283
             <h2>Detailed Individual Information</h2>
302
             <h2>Detailed Individual Information</h2>
284
           </div>
303
           </div>
285
           <div class="form">
304
           <div class="form">
286
-            <div class="row">
305
+            <div class="row mb-2">
287
               <div class="form-group col-md-6">
306
               <div class="form-group col-md-6">
288
-                <input
289
-                  type="text"
290
-                  name="name"
291
-                  class="form-control"
292
-                  id="name"
293
-                  placeholder="Name"
294
-                  data-rule="minlen:4"
295
-                  data-msg="Please enter your name"
296
-                  v-model="indiv.name"
297
-                />
307
+                <float-label>
308
+                  <input
309
+                    type="text"
310
+                    name="name"
311
+                    class="form-control"
312
+                    id="name"
313
+                    placeholder="Name"
314
+                    data-rule="minlen:4"
315
+                    data-msg="Please enter your name"
316
+                    v-model="indiv.name"
317
+                  />
318
+                </float-label>
319
+
298
                 <div class="validation"></div>
320
                 <div class="validation"></div>
299
               </div>
321
               </div>
300
               <div class="form-group col-md-6">
322
               <div class="form-group col-md-6">
301
-                <input
302
-                  type="text"
303
-                  class="form-control"
304
-                  name="surname"
305
-                  id="surname"
306
-                  placeholder="Surname"
307
-                  data-msg="Please enter your surname"
308
-                  v-model="indiv.surname"
309
-                />
323
+                <float-label>
324
+                  <input
325
+                    type="text"
326
+                    class="form-control"
327
+                    name="surname"
328
+                    id="surname"
329
+                    placeholder="Surname"
330
+                    data-msg="Please enter your surname"
331
+                    v-model="indiv.surname"
332
+                  />
333
+                </float-label>
334
+
310
                 <div class="validation"></div>
335
                 <div class="validation"></div>
311
               </div>
336
               </div>
312
             </div>
337
             </div>
313
-            <div class="row">
338
+            <div class="row mb-2">
314
               <div class="form-group col-md-6">
339
               <div class="form-group col-md-6">
315
-                <input
316
-                  type="text"
317
-                  name="idnum"
318
-                  class="form-control"
319
-                  id="idnum"
320
-                  placeholder="ID Number"
321
-                  data-rule="minlen:4"
322
-                  data-msg="Please enter your ID number"
323
-                  v-model="indiv.idNumber"
324
-                />
340
+                <float-label>
341
+                  <input
342
+                    type="text"
343
+                    name="idnum"
344
+                    class="form-control"
345
+                    id="idnum"
346
+                    placeholder="ID Number"
347
+                    data-rule="minlen:4"
348
+                    data-msg="Please enter your ID number"
349
+                    v-model="indiv.idNumber"
350
+                  />
351
+                </float-label>
352
+
325
                 <div class="validation"></div>
353
                 <div class="validation"></div>
326
               </div>
354
               </div>
327
               <div class="form-group col-md-6">
355
               <div class="form-group col-md-6">
328
-                <input
329
-                  type="text"
330
-                  class="form-control"
331
-                  name="company"
332
-                  id="company"
333
-                  placeholder="Company Reg Number"
334
-                  data-rule="minlen:4"
335
-                  data-msg="Please enter your company reg number"
336
-                  v-model="indiv.companyRegNumber"
337
-                />
356
+                <float-label>
357
+                  <input
358
+                    type="text"
359
+                    class="form-control"
360
+                    name="company"
361
+                    id="company"
362
+                    placeholder="Company Reg Number"
363
+                    data-rule="minlen:4"
364
+                    data-msg="Please enter your company reg number"
365
+                    v-model="indiv.companyRegNumber"
366
+                  />
367
+                </float-label>
368
+
338
                 <div class="validation"></div>
369
                 <div class="validation"></div>
339
               </div>
370
               </div>
340
             </div>
371
             </div>
341
-            <div class="row">
372
+            <div class="row mb-2">
342
               <div class="form-group col-md-6">
373
               <div class="form-group col-md-6">
343
                 <div class="input-group">
374
                 <div class="input-group">
344
-                  <label
345
-                    v-if="!indiv.howMarried || indiv.howMarried === 'N/A'"
346
-                    for="howMarried"
347
-                    class="uniSelectLabel"
348
-                    >Marital Status</label
349
-                  >
350
-                  <select class="form-control uniSelect" id="howMarried" v-model="indiv.howMarried">
351
-                    <option value="N/A">N/A</option>
352
-                    <option value="In Community Of Property">In Community Of Property</option>
353
-                    <option value="Out of Community Of Property"
354
-                      >Out of Community Of Property</option
375
+                  <span v-if="!indiv.howMarried">
376
+                    <label v-if="indiv.howMarried === 'N/A'" for="howMarried" class="uniSelectLabel"
377
+                      >Marital Status</label
355
                     >
378
                     >
356
-                    <option value="Other">Other</option>
357
-                    <option value="Traditional Wedding">Traditional Wedding</option>
358
-                    <option value="Single">Single</option>
359
-                    <option value="Divorced">Divorced</option>
360
-                    <option value="Widow">Widow</option>
361
-                    <option value="Committed Relationship">Committed Relationship</option>
362
-                    <option value="Partner">Partner</option>
363
-                  </select>
379
+                  </span>
380
+
381
+                  <float-label label="Marital Status" style="width:100%">
382
+                    <select
383
+                      class="form-control uniSelect"
384
+                      id="howMarried"
385
+                      v-model="indiv.howMarried"
386
+                    >
387
+                      <option value="N/A">N/A</option>
388
+                      <option value="In Community Of Property">In Community Of Property</option>
389
+                      <option value="Out of Community Of Property"
390
+                        >Out of Community Of Property</option
391
+                      >
392
+                      <option value="Other">Other</option>
393
+                      <option value="Traditional Wedding">Traditional Wedding</option>
394
+                      <option value="Single">Single</option>
395
+                      <option value="Divorced">Divorced</option>
396
+                      <option value="Widow">Widow</option>
397
+                      <option value="Committed Relationship">Committed Relationship</option>
398
+                      <option value="Partner">Partner</option>
399
+                    </select>
400
+                  </float-label>
364
                 </div>
401
                 </div>
365
                 <div class="validation"></div>
402
                 <div class="validation"></div>
366
               </div>
403
               </div>
367
               <div class="form-group col-md-6">
404
               <div class="form-group col-md-6">
368
-                <input
369
-                  type="text"
370
-                  class="form-control"
371
-                  name="email"
372
-                  id="email"
373
-                  placeholder="Email Address"
374
-                  data-msg="Please enter your email address"
375
-                  v-model="indiv.emailAddress"
376
-                />
405
+                <float-label>
406
+                  <input
407
+                    type="text"
408
+                    class="form-control"
409
+                    name="email"
410
+                    id="email"
411
+                    placeholder="Email Address"
412
+                    data-msg="Please enter your email address"
413
+                    v-model="indiv.emailAddress"
414
+                  />
415
+                </float-label>
416
+
377
                 <div class="validation"></div>
417
                 <div class="validation"></div>
378
               </div>
418
               </div>
379
             </div>
419
             </div>
380
             <div class="row">
420
             <div class="row">
381
               <div class="form-group col-md-6">
421
               <div class="form-group col-md-6">
382
-                <input
383
-                  type="text"
384
-                  name="cell"
385
-                  class="form-control"
386
-                  id="cell"
387
-                  placeholder="Cell Number"
388
-                  data-rule="minlen:4"
389
-                  data-msg="Please enter your cell number"
390
-                  v-model="indiv.cellNumner"
391
-                />
422
+                <float-label>
423
+                  <input
424
+                    type="text"
425
+                    name="cell"
426
+                    class="form-control"
427
+                    id="cell"
428
+                    placeholder="Cell Number"
429
+                    data-rule="minlen:4"
430
+                    data-msg="Please enter your cell number"
431
+                    v-model="indiv.cellNumner"
432
+                  />
433
+                </float-label>
434
+
392
                 <div class="validation"></div>
435
                 <div class="validation"></div>
393
               </div>
436
               </div>
394
               <div class="form-group col-md-6">
437
               <div class="form-group col-md-6">
395
-                <input
396
-                  type="text"
397
-                  class="form-control"
398
-                  name="landline"
399
-                  id="landline"
400
-                  placeholder="Landline Number"
401
-                  data-msg="Please enter your landline number"
402
-                  v-model="indiv.landlineNumber"
403
-                />
438
+                <float-label>
439
+                  <input
440
+                    type="text"
441
+                    class="form-control"
442
+                    name="landline"
443
+                    id="landline"
444
+                    placeholder="Landline Number"
445
+                    data-msg="Please enter your landline number"
446
+                    v-model="indiv.landlineNumber"
447
+                  />
448
+                </float-label>
449
+
404
                 <div class="validation"></div>
450
                 <div class="validation"></div>
405
               </div>
451
               </div>
406
             </div>
452
             </div>
409
             <h2>Spouse Details</h2>
455
             <h2>Spouse Details</h2>
410
           </div>
456
           </div>
411
           <div v-if="indiv.howMarried === 'In Community Of Property'" class="form">
457
           <div v-if="indiv.howMarried === 'In Community Of Property'" class="form">
412
-            <div class="form-row">
413
-              <div class="form-group col-md-6">
414
-                <input
415
-                  type="text"
416
-                  class="form-control"
417
-                  placeholder="SPOUSE NAME"
418
-                  data-msg="Please enter your spouse's name"
419
-                  v-model="indiv.spouseName"
420
-                />
458
+            <div class="form-row mb-2">
459
+              <div class="form-group col-md-6 mt-2">
460
+                <float-label>
461
+                  <input
462
+                    type="text"
463
+                    class="form-control"
464
+                    placeholder="SPOUSE NAME"
465
+                    data-msg="Please enter your spouse's name"
466
+                    v-model="indiv.spouseName"
467
+                  />
468
+                </float-label>
469
+
421
                 <div class="validation"></div>
470
                 <div class="validation"></div>
422
               </div>
471
               </div>
423
-              <div class="form-group col-md-6">
424
-                <input
425
-                  type="text"
426
-                  class="form-control"
427
-                  placeholder="SPOUSE SURNAME"
428
-                  data-msg="Please enter your spouse's surname"
429
-                  v-model="indiv.spouseSurname"
430
-                />
472
+              <div class="form-group col-md-6 mt-2">
473
+                <float-label>
474
+                  <input
475
+                    type="text"
476
+                    class="form-control"
477
+                    placeholder="SPOUSE SURNAME"
478
+                    data-msg="Please enter your spouse's surname"
479
+                    v-model="indiv.spouseSurname"
480
+                  />
481
+                </float-label>
482
+
431
                 <div class="validation"></div>
483
                 <div class="validation"></div>
432
               </div>
484
               </div>
433
-              <div class="form-group col-md-6">
434
-                <input
435
-                  type="text"
436
-                  class="form-control"
437
-                  placeholder="SPOUSE EMAIL"
438
-                  data-rule="minlen:4"
439
-                  data-msg="Please enter your spouse's email"
440
-                  v-model="indiv.spouseEmail"
441
-                />
485
+              <div class="form-group col-md-6 mt-2">
486
+                <float-label>
487
+                  <input
488
+                    type="text"
489
+                    class="form-control"
490
+                    placeholder="SPOUSE EMAIL"
491
+                    data-rule="minlen:4"
492
+                    data-msg="Please enter your spouse's email"
493
+                    v-model="indiv.spouseEmail"
494
+                  />
495
+                </float-label>
496
+
442
                 <div class="validation"></div>
497
                 <div class="validation"></div>
443
               </div>
498
               </div>
444
-              <div class="form-group col-md-6">
445
-                <input
446
-                  type="text"
447
-                  class="form-control"
448
-                  placeholder="SPOUSE TELEPHONE"
449
-                  data-rule="minlen:4"
450
-                  data-msg="Please enter your spouse's telephone number"
451
-                  v-model="indiv.spouseTelephone"
452
-                />
499
+              <div class="form-group col-md-6 mt-2">
500
+                <float-label>
501
+                  <input
502
+                    type="text"
503
+                    class="form-control"
504
+                    placeholder="SPOUSE TELEPHONE"
505
+                    data-rule="minlen:4"
506
+                    data-msg="Please enter your spouse's telephone number"
507
+                    v-model="indiv.spouseTelephone"
508
+                  />
509
+                </float-label>
510
+
453
                 <div class="validation"></div>
511
                 <div class="validation"></div>
454
               </div>
512
               </div>
455
-              <div class="form-group col-md-6">
456
-                <input
457
-                  type="text"
458
-                  class="form-control"
459
-                  placeholder="SPOUSE CELL NUMBER"
460
-                  data-rule="minlen:4"
461
-                  data-msg="Please enter your spouse's cellphone number"
462
-                  v-model="indiv.spouseCellnumber"
463
-                />
513
+              <div class="form-group col-md-6 mt-2">
514
+                <float-label>
515
+                  <input
516
+                    type="text"
517
+                    class="form-control"
518
+                    placeholder="SPOUSE CELL NUMBER"
519
+                    data-rule="minlen:4"
520
+                    data-msg="Please enter your spouse's cellphone number"
521
+                    v-model="indiv.spouseCellnumber"
522
+                  />
523
+                </float-label>
524
+
464
                 <div class="validation"></div>
525
                 <div class="validation"></div>
465
               </div>
526
               </div>
466
             </div>
527
             </div>
488
                   v-model="indiv.address.streetNumber"
549
                   v-model="indiv.address.streetNumber"
489
                   disabled
550
                   disabled
490
                 />
551
                 />
552
+
491
                 <div class="validation"></div>
553
                 <div class="validation"></div>
492
               </div>
554
               </div>
493
               <div class="form-group col-md-6">
555
               <div class="form-group col-md-6">
742
               </button>
804
               </button>
743
               <button class="btn-solid-blue" v-else @click="newSale()">NEW WEEK</button>
805
               <button class="btn-solid-blue" v-else @click="newSale()">NEW WEEK</button>
744
             </div>
806
             </div>
745
-            <div class="text-center col-12">
807
+            <!-- <div class="text-center col-12">
746
               <button class="btn-solid-blue" @click="paygateRedirect()">PayGate</button>
808
               <button class="btn-solid-blue" @click="paygateRedirect()">PayGate</button>
747
-            </div>
809
+            </div> -->
748
             <br />
810
             <br />
749
             <br />
811
             <br />
750
           </div>
812
           </div>

+ 19
- 2
src/components/user/registerAgencySection.vue ファイルの表示

130
         />
130
         />
131
       </div>
131
       </div>
132
     </div>
132
     </div>
133
-
134
-    <button v-on:click="SubmitData()" class="btn-solid-blue" type="submit">
133
+    <div class="row">
134
+      <div class="col">
135
+        <label for="tc"
136
+          ><router-link to="/termsConditionsView">Terms & Conditions</router-link></label
137
+        >
138
+        <input
139
+          name="tc"
140
+          type="checkbox"
141
+          class="ml-3 mt-2"
142
+          v-model="registerAgency.user.acceptedTerms"
143
+        />
144
+      </div>
145
+    </div>
146
+    <button
147
+      v-if="registerAgency.user.acceptedTerms"
148
+      v-on:click="SubmitData()"
149
+      class="btn-solid-blue"
150
+      type="submit"
151
+    >
135
       SUBMIT
152
       SUBMIT
136
     </button>
153
     </button>
137
     <router-link to="/user/login" class="btn-white-border mb-5" style="float:right" type="submit">
154
     <router-link to="/user/login" class="btn-white-border mb-5" style="float:right" type="submit">

+ 22
- 1
src/components/user/registerIndividual.vue ファイルの表示

91
           />
91
           />
92
         </div>
92
         </div>
93
       </div>
93
       </div>
94
+      <div class="row">
95
+        <div class="col">
96
+          <label for="tc"
97
+            ><router-link to="/termsConditionsView">Terms & Conditions</router-link></label
98
+          >
99
+
100
+          <input
101
+            name="tc"
102
+            type="checkbox"
103
+            class="ml-3 mt-2"
104
+            v-model="registerIndividual.acceptedTerms"
105
+          />
106
+        </div>
107
+      </div>
94
 
108
 
95
-      <button v-on:click="SubmitData()" class="btn-solid-blue" type="submit">
109
+      <button
110
+        v-if="registerIndividual.acceptedTerms"
111
+        v-on:click="SubmitData()"
112
+        class="btn-solid-blue"
113
+        type="submit"
114
+      >
96
         SUBMIT
115
         SUBMIT
97
       </button>
116
       </button>
98
       <router-link to="/user/login" class="btn-white-border" style="float:right" type="submit">
117
       <router-link to="/user/login" class="btn-white-border" style="float:right" type="submit">
149
       this.isPasswordShown = "password";
168
       this.isPasswordShown = "password";
150
     },
169
     },
151
     SubmitData() {
170
     SubmitData() {
171
+      console.log(this.registerIndividual);
172
+
152
       this.saveIndividual(this.registerIndividual);
173
       this.saveIndividual(this.registerIndividual);
153
 
174
 
154
       this.$router.push("/user/login");
175
       this.$router.push("/user/login");

+ 4
- 2
src/main.js ファイルの表示

8
 import store from "./store";
8
 import store from "./store";
9
 import * as VueGoogleMaps from "vue2-google-maps";
9
 import * as VueGoogleMaps from "vue2-google-maps";
10
 import Vuetify from "vuetify";
10
 import Vuetify from "vuetify";
11
-import VueShareSocial from "vue-share-social";
11
+import VueSocialSharing from "vue-social-sharing";
12
 import VueCurrencyInput from "vue-currency-input";
12
 import VueCurrencyInput from "vue-currency-input";
13
+import VueFloatLabel from "vue-float-label";
13
 
14
 
14
-Vue.use(VueShareSocial);
15
+Vue.use(VueSocialSharing);
15
 Vue.use(EvaIcons);
16
 Vue.use(EvaIcons);
16
 Vue.use(Vuetify);
17
 Vue.use(Vuetify);
18
+Vue.use(VueFloatLabel);
17
 
19
 
18
 Vue.use(VueGoogleMaps, {
20
 Vue.use(VueGoogleMaps, {
19
   load: {
21
   load: {

+ 15
- 3
src/router/index.js ファイルの表示

57
 import ContactUs from "../components/misc/contactUs.vue";
57
 import ContactUs from "../components/misc/contactUs.vue";
58
 import PrivacyPolicy from "../components/misc//privacyPolicy/privacyPolicyPage.vue";
58
 import PrivacyPolicy from "../components/misc//privacyPolicy/privacyPolicyPage.vue";
59
 import WebsiteDisclaimer from "../components/misc/Disclaimer/WebsiteDisclaimer.vue";
59
 import WebsiteDisclaimer from "../components/misc/Disclaimer/WebsiteDisclaimer.vue";
60
+import TermsConditions from "../components/admin/misc/termsConditions.vue";
61
+import TermsConditionsView from "../components/misc/TermsConditions/termsConditions.vue";
60
 
62
 
61
 import MakeOffer from "../components/processFlow/makeOffer.vue";
63
 import MakeOffer from "../components/processFlow/makeOffer.vue";
62
 import Offer from "../components/processFlow/offers.vue";
64
 import Offer from "../components/processFlow/offers.vue";
81
 import LandingPageWeek from "../components/marketing/landingPageWeek.vue";
83
 import LandingPageWeek from "../components/marketing/landingPageWeek.vue";
82
 import MarketingPage from "../components/marketing/clientView.vue";
84
 import MarketingPage from "../components/marketing/clientView.vue";
83
 import MarketingPageExp from "../components/marketing/landingPageExpired.vue";
85
 import MarketingPageExp from "../components/marketing/landingPageExpired.vue";
84
-import EnquireNow from "../components/property/commercial/enquireNow/enquirenow.vue";
86
+import EnquireNow from "../components/property/enquireNow/enquirenow.vue";
85
 import MyWeeksEdit from "../components/admin/status/editTimeShareAdminPage.vue";
87
 import MyWeeksEdit from "../components/admin/status/editTimeShareAdminPage.vue";
86
 
88
 
87
 Vue.use(Router);
89
 Vue.use(Router);
378
       name: "fees",
380
       name: "fees",
379
       component: Fees
381
       component: Fees
380
     },
382
     },
383
+    {
384
+      path: "/termsConditions",
385
+      name: "termsConditions",
386
+      component: TermsConditions
387
+    },
388
+    {
389
+      path: "/termsConditionsView",
390
+      name: "termsConditionsView",
391
+      component: TermsConditionsView
392
+    },
381
     {
393
     {
382
       path: "/carousel",
394
       path: "/carousel",
383
       name: "carousel",
395
       name: "carousel",
437
       component: MarketingPageExp
449
       component: MarketingPageExp
438
     },
450
     },
439
     {
451
     {
440
-      path: "/EnquireNow",
452
+      path: "/EnquireNow/:id",
441
       name: "EnquireNow",
453
       name: "EnquireNow",
442
       component: EnquireNow
454
       component: EnquireNow
443
     },
455
     },
449
     {
461
     {
450
       path: "/editTimeShare/:id",
462
       path: "/editTimeShare/:id",
451
       name: "EditTimeshare",
463
       name: "EditTimeshare",
452
-      component: MyWeeksEdit,
464
+      component: MyWeeksEdit
453
     }
465
     }
454
   ]
466
   ]
455
 });
467
 });

+ 2
- 0
src/store/index.js ファイルの表示

34
 import Bank from "./modules/user/bank";
34
 import Bank from "./modules/user/bank";
35
 import bank from "./modules/user/bank";
35
 import bank from "./modules/user/bank";
36
 import Fees from "./modules/financial/fees";
36
 import Fees from "./modules/financial/fees";
37
+import TermsConditions from "./modules/misc/termsConditions";
37
 
38
 
38
 Vue.use(Vuex);
39
 Vue.use(Vuex);
39
 /* eslint no-param-reassign: ["error", { "props": false }] */
40
 /* eslint no-param-reassign: ["error", { "props": false }] */
70
     campaignItem: CampaignItemModule,
71
     campaignItem: CampaignItemModule,
71
     placeHolderFormat: PlaceHolderFormat,
72
     placeHolderFormat: PlaceHolderFormat,
72
     fees: Fees,
73
     fees: Fees,
74
+    termsConditions: TermsConditions,
73
     bank: bank
75
     bank: bank
74
   }
76
   }
75
 });
77
 });

+ 32
- 0
src/store/modules/misc/termsConditions.js ファイルの表示

1
+/* eslint-disable */
2
+import axios from "axios";
3
+
4
+export default {
5
+  namespaced: true,
6
+  state: {
7
+    terms: []
8
+  },
9
+  mutations: {
10
+    getTermsAndConditions: (state, fee) => (state.terms = fee),
11
+    newTermsAndConditions: (state, fee) => (state.terms = fee)
12
+  },
13
+  getters: {
14
+    getTermsAndConditions: state => state.terms
15
+  },
16
+  actions: {
17
+    async retrieveTerms({ commit }) {
18
+      await axios.get("api/tc/").then(res => {
19
+        commit("getTermsAndConditions", res.data);
20
+      });
21
+    },
22
+    async setTerms({ commit }, terms) {
23
+      const response = await axios.post("api/tc/", terms);
24
+      if (response.status === 200) {
25
+        commit("newTermsAndConditions", response.data);
26
+        return Promise.resolve();
27
+      } else {
28
+        return Promise.reject();
29
+      }
30
+    }
31
+  }
32
+};

+ 2
- 0
src/store/modules/user/authentication.js ファイルの表示

76
         method: "POST"
76
         method: "POST"
77
       });
77
       });
78
       if (response.status === 200) {
78
       if (response.status === 200) {
79
+        console.log(response);
80
+
79
         log.clearValues();
81
         log.clearValues();
80
         log.setValues(response.data);
82
         log.setValues(response.data);
81
         commit("auth_success", response.data);
83
         commit("auth_success", response.data);

+ 53
- 51
src/store/modules/user/register.js ファイルの表示

1
-import axios from 'axios';
1
+import axios from "axios";
2
 
2
 
3
 export default {
3
 export default {
4
   namespaced: true,
4
   namespaced: true,
6
     individuals: [],
6
     individuals: [],
7
     agents: [],
7
     agents: [],
8
     registerIndividual: {
8
     registerIndividual: {
9
-      name: '',
10
-      surname: '',
11
-      email: '',
12
-      cellNumber: '',
13
-      username: '',
14
-      password: '',
9
+      name: "",
10
+      surname: "",
11
+      email: "",
12
+      cellNumber: "",
13
+      username: "",
14
+      password: "",
15
+      acceptedTerms: false
15
     },
16
     },
16
     registerAgency: {
17
     registerAgency: {
17
-      name: '',
18
-      eaabeffcNumber: '',
19
-      companyRegNumber: '',
18
+      name: "",
19
+      eaabeffcNumber: "",
20
+      companyRegNumber: "",
20
       user: {
21
       user: {
21
-        name: '',
22
-        surname: '',
23
-        email: '',
24
-        cellNumber: '',
25
-        username: '',
26
-        password: '',
27
-        role: '',
28
-      },
29
-    },
22
+        name: "",
23
+        surname: "",
24
+        email: "",
25
+        cellNumber: "",
26
+        username: "",
27
+        password: "",
28
+        role: ""
29
+      }
30
+    }
30
   },
31
   },
31
   mutations: {
32
   mutations: {
32
     setIndividual(state, type) {
33
     setIndividual(state, type) {
56
     },
57
     },
57
     updateAgency(state, type) {
58
     updateAgency(state, type) {
58
       state.registerAgency.find(item => item.id === type.id).eaabeffcNumber = type.eaabeffcNumber;
59
       state.registerAgency.find(item => item.id === type.id).eaabeffcNumber = type.eaabeffcNumber;
59
-      state.registerAgency.find(item => item.id === type.id).companyRegNumber = type.companyRegNumber;
60
+      state.registerAgency.find(item => item.id === type.id).companyRegNumber =
61
+        type.companyRegNumber;
60
     },
62
     },
61
     clearIndividual(state) {
63
     clearIndividual(state) {
62
       state.registerIndividual = {
64
       state.registerIndividual = {
63
-        name: '',
64
-        surname: '',
65
-        email: '',
66
-        cellNumber: '',
67
-        username: '',
68
-        password: '',
65
+        name: "",
66
+        surname: "",
67
+        email: "",
68
+        cellNumber: "",
69
+        username: "",
70
+        password: ""
69
       };
71
       };
70
     },
72
     },
71
     clearAgency(state) {
73
     clearAgency(state) {
72
       state.registerAgency = {
74
       state.registerAgency = {
73
-        name: '',
74
-        eaabeffcNumber: '',
75
-        companyRegNumber: '',
75
+        name: "",
76
+        eaabeffcNumber: "",
77
+        companyRegNumber: "",
76
         user: {
78
         user: {
77
-          name: '',
78
-          surname: '',
79
-          email: '',
80
-          cellNumber: '',
81
-          username: '',
82
-          password: '',
83
-        },
79
+          name: "",
80
+          surname: "",
81
+          email: "",
82
+          cellNumber: "",
83
+          username: "",
84
+          password: ""
85
+        }
84
       };
86
       };
85
     },
87
     },
86
     removeIndividual(state, id) {
88
     removeIndividual(state, id) {
91
     },
93
     },
92
     removeAgent(state, id) {
94
     removeAgent(state, id) {
93
       state.registerAgency.pop(state.registerAgency.find(a => a.id === id));
95
       state.registerAgency.pop(state.registerAgency.find(a => a.id === id));
94
-    },
96
+    }
95
   },
97
   },
96
   getters: {},
98
   getters: {},
97
   actions: {
99
   actions: {
98
     getIndividuals({ commit }) {
100
     getIndividuals({ commit }) {
99
       axios
101
       axios
100
-        .get('/api/individual')
101
-        .then(result => commit('setIndividuals', result.data))
102
+        .get("/api/individual")
103
+        .then(result => commit("setIndividuals", result.data))
102
         .catch(console.error);
104
         .catch(console.error);
103
     },
105
     },
104
     getAgents({ commit }) {
106
     getAgents({ commit }) {
105
       axios
107
       axios
106
-        .get('/api/agent')
107
-        .then(result => commit('setAgents', result.data))
108
+        .get("/api/agent")
109
+        .then(result => commit("setAgents", result.data))
108
         .catch(console.error);
110
         .catch(console.error);
109
     },
111
     },
110
     // getAgency({
112
     // getAgency({
118
 
120
 
119
     saveIndividual({ commit }, item) {
121
     saveIndividual({ commit }, item) {
120
       axios
122
       axios
121
-        .post('/api/register/register', item)
122
-        .then(result => commit('addIndividual', result.data))
123
+        .post("/api/register/register", item)
124
+        .then(result => commit("addIndividual", result.data))
123
         .catch(console.error);
125
         .catch(console.error);
124
     },
126
     },
125
     saveAgency({ commit }, item) {
127
     saveAgency({ commit }, item) {
126
       axios
128
       axios
127
-        .post('/api/register/registeragency', item)
128
-        .then(result => commit('addAgency', result.data))
129
+        .post("/api/register/registeragency", item)
130
+        .then(result => commit("addAgency", result.data))
129
         .catch(console.error);
131
         .catch(console.error);
130
     },
132
     },
131
     saveAgent({ commit }, item) {
133
     saveAgent({ commit }, item) {
132
       axios
134
       axios
133
-        .post('/api/agent', item)
134
-        .then(result => commit('addAgent', result.data))
135
+        .post("/api/agent", item)
136
+        .then(result => commit("addAgent", result.data))
135
         .catch(console.error);
137
         .catch(console.error);
136
     },
138
     },
137
     // updateIndividual({
139
     // updateIndividual({
163
     deleteIndividual({ commit }, id) {
165
     deleteIndividual({ commit }, id) {
164
       axios
166
       axios
165
         .delete(`/api/individual/${id}`)
167
         .delete(`/api/individual/${id}`)
166
-        .then(result => commit('removeIndividual', id))
168
+        .then(result => commit("removeIndividual", id))
167
         .catch(console.error);
169
         .catch(console.error);
168
     },
170
     },
169
     deleteAgent({ commit }, id) {
171
     deleteAgent({ commit }, id) {
170
       axios
172
       axios
171
         .delete(`/api/agent/${id}`)
173
         .delete(`/api/agent/${id}`)
172
-        .then(result => commit('removeAgent', id))
174
+        .then(result => commit("removeAgent", id))
173
         .catch(console.error);
175
         .catch(console.error);
174
-    },
176
+    }
175
     // deleteAgency({
177
     // deleteAgency({
176
     //   commit,
178
     //   commit,
177
     // }, id) {
179
     // }, id) {
180
     //     .then(result => commit('removeAgency', id))
182
     //     .then(result => commit('removeAgency', id))
181
     //     .catch(console.error);
183
     //     .catch(console.error);
182
     // },
184
     // },
183
-  },
185
+  }
184
 };
186
 };

読み込み中…
キャンセル
保存