package.json

   },
   "dependencies": {
     "@nuxtjs/axios": "^5.13.1",
+    "@types/gtag.js": "0.0.20",
+    "@vue/shared": "^3.5.10",
     "animate.css": "^3.7.2",
     "aos": "^3.0.0-beta.6",
     "axios": "^0.24.0",
     "bootstrap": "^5.1.3",
     "bootstrap-vue": "^2.22.0",
     "core-js": "^2.6.12",
-    "crypto-js": "^4.0.0",
+    "crypto-js": "^4.2.0",
     "datatables.net": "^1.11.3",
     "jquery": "^3.6.0",
     "js-md5": "^0.7.3",
     "jspdf-autotable": "^3.5.14",
     "lodash": "^4.17.21",
     "material-design-icons-iconfont": "^3.0.3",
-    "moment": "^2.29.1",
+    "moment": "^2.30.1",
     "node-sass": "^4.14.1",
     "roboto-fontface": "*",
     "sass-loader": "^7.3.1",
     "uuid": "^8.3.2",
     "v-file-upload": "^3.1.7",
     "vue": "^2.6.12",
-    "vue-analytics": "^5.22.1",
     "vue-carousel": "^0.18.0",
     "vue-cryptojs": "^2.1.5",
     "vue-currency-input": "^1.22.6",
     "vue-disable-autocomplete": "0.0.4",
     "vue-eva-icons": "^1.1.1",
     "vue-float-label": "^1.6.1",
+    "vue-gtag": "^1.16.1",
     "vue-head": "^2.2.0",
     "vue-js-modal": "^1.3.35",
     "vue-json-excel": "^0.2.99",

public/googlea6e63bc009bf908f.html

+google-site-verification: googlea6e63bc009bf908f.html

src/App.vue

 .noWeeks {
   background-color: #ff4444;
 }
+.nav-tabs li a {
+  border-top: none;
+  border-left: none;
+  border-right: none;
+  margin-left: 10px;
+  margin-right: 10px;
+  background-color: white;
+  border-bottom-color: rgb(27, 117, 187);
+  border: 1px solid rgb(27, 117, 187);
+}
+
+.nav-tabs li :hover {
+  color: white;
+  background-color: rgb(27, 117, 187);
+}
+
+.nav-tabs li a.active {
+  border-top: none;
+  border-left: none;
+  border-right: none;
+  margin-left: 10px;
+  margin-right: 10px;
+  color: white;
+  background-color: rgb(80, 133, 240);
+  border-bottom-color: rgb(80, 133, 240);
+}
+
+.nav-tabs li a :hover {
+  background-color: transparent;
+  color: white;
+}
 </style>
 
 <style scoped>

src/components/admin/property/propertyList.vue

         <h6>{{ curAgency }}</h6>
       </div>
       <div v-if="ROLE === 'Agent'">
-        <h6>{{ agent[0].name + " " + agent[0].surname }}</h6>
+        <h6>{{ agent[0].name + ' ' + agent[0].surname }}</h6>
       </div>
       <div class="row">
         <div class="col-lg-6 offset-3">
-          <input class="form-control uniSelect" type="text" placeholder="SEARCH" v-model="filter" />
+          <input
+            class="form-control uniSelect"
+            type="text"
+            placeholder="SEARCH"
+            v-model="filter"
+          />
         </div>
       </div>
       <div class="row">
                 <td>{{ item.type }}</td>
                 <td v-if="!item.isPublished">
                   <a v-on:click="Publish(item)">
-                    <img src="../../../../public/img/icons/Upload.png" height="25" width="25" />
+                    <img
+                      src="../../../../public/img/icons/Upload.png"
+                      height="25"
+                      width="25"
+                    />
                   </a>
                 </td>
                 <td v-else>
                 </td>
                 <td>
                   <a v-on:click="Edit(item)">
-                    <img src="../../../../public/img/icons/Edit.png" height="25" width="25" />
+                    <img
+                      src="../../../../public/img/icons/Edit.png"
+                      height="25"
+                      width="25"
+                    />
                   </a>
                 </td>
                 <td>
                   <a v-on:click="Delete(item)">
-                    <img src="../../../../public/img/icons/delete.png" height="25" width="25" />
+                    <img
+                      src="../../../../public/img/icons/delete.png"
+                      height="25"
+                      width="25"
+                    />
                   </a>
                 </td>
               </tr>
           <div class="d-flex justify-content-between" v-if="showPager">
             <div class="p-1">
               {{
-                currentPage + " / " + PageCount + (" - (" + FilteredProperties.length + " items)")
+                currentPage +
+                ' / ' +
+                PageCount +
+                (' - (' + FilteredProperties.length + ' items)')
               }}
             </div>
             <div class="p-1">
                     v-model="visibleItemsPerPageCount"
                     @change="onChangeItemsPerPage()"
                   >
-                    <option v-for="(item, i) in itemsPerPageList" :key="i">{{ item }}</option>
+                    <option v-for="(item, i) in itemsPerPageList" :key="i">
+                      {{ item }}
+                    </option>
                   </select>
                 </div>
               </div>
           <div class="p-2">
             <div class="d-flex flex-row">
               <div>
-                <button v-if="sortKey !== 'id'" class="btn-solid-blue" @click="ClearSort">
+                <button
+                  v-if="sortKey !== 'id'"
+                  class="btn-solid-blue"
+                  @click="ClearSort"
+                >
                   Clear Sort
                 </button>
               </div>
 
 <script>
 /* eslint-disable */
-import { mapState, mapActions } from "vuex";
-import Log from "../../../assets/Log";
-import BasePagination from "../../shared/basePagination";
-import ItemsPerPageList from "../../../assets/staticData/itemsPerPageFive";
-import _ from "lodash";
+import { mapState, mapActions } from 'vuex'
+import Log from '../../../assets/Log'
+import BasePagination from '../../shared/basePagination'
+import ItemsPerPageList from '../../../assets/staticData/itemsPerPageFive'
+import _ from 'lodash'
 
 export default {
   components: {
-    BasePagination
+    BasePagination,
   },
   data() {
     return {
       itemsPerPageList: ItemsPerPageList,
       currentPage: 1,
       reverse: true,
-      sortKey: "id",
+      sortKey: 'id',
       displayColumns: [
-        "ID",
-        "Owner",
-        "Reference",
-        "Property",
-        "Unit",
-        "Size",
-        "Price Ex VAT",
-        "Region",
-        "Town",
-        "Suburb",
-        "Status",
-        "Type",
-        "Publish"
+        'ID',
+        'Owner',
+        'Reference',
+        'Property',
+        'Unit',
+        'Size',
+        'Price Ex VAT',
+        'Region',
+        'Town',
+        'Suburb',
+        'Status',
+        'Type',
+        'Publish',
       ],
       columns: [
-        "id",
-        "owner",
-        "reference",
-        "property",
-        "unit",
-        "size",
-        "price",
-        "region",
-        "town",
-        "suburb",
-        "status",
-        "type",
-        "isPublished"
-      ]
-    };
+        'id',
+        'owner',
+        'reference',
+        'property',
+        'unit',
+        'size',
+        'price',
+        'region',
+        'town',
+        'suburb',
+        'status',
+        'type',
+        'isPublished',
+      ],
+    }
   },
   methods: {
-    ...mapActions("propertyList", [
-      "getAdminProperties",
-      "deleteProperty",
-      "publishProperty",
-      "unpublishProperty"
+    ...mapActions('propertyList', [
+      'getAdminProperties',
+      'deleteProperty',
+      'publishProperty',
+      'unpublishProperty',
     ]),
-    ...mapActions("register", ["getAgentById"]),
-    ...mapActions("timeshare", ["getAgencies"]),
+    ...mapActions('register', ['getAgentById']),
+    ...mapActions('timeshare', ['getAgencies']),
     Publish(item) {
-      this.publishProperty(item);
+      this.publishProperty(item)
     },
     Unpublish(item) {
-      this.unpublishProperty(item);
+      this.unpublishProperty(item)
     },
     Edit(item) {
-      this.$router.push(`/property/edit/${item.id}`);
+      this.$router.push(`/property/edit/${item.id}`)
     },
     Delete(item) {
-      this.deleteProperty(item.id);
+      this.deleteProperty(item.id)
     },
     async pageChangeHandle(value) {
       switch (value) {
-        case "next":
-          this.currentPage += 1;
-          break;
-        case "previous":
-          this.currentPage -= 1;
-          break;
+        case 'next':
+          this.currentPage += 1
+          break
+        case 'previous':
+          this.currentPage -= 1
+          break
         default:
-          this.currentPage = value;
+          this.currentPage = value
       }
     },
     sortBy(sortKey) {
-      this.reverse = this.sortKey === sortKey ? !this.reverse : false;
-      this.sortKey = sortKey;
+      this.reverse = this.sortKey === sortKey ? !this.reverse : false
+      this.sortKey = sortKey
     },
     ClearSort() {
-      this.reverse = true;
-      this.sortKey = "id";
-    }
+      this.reverse = true
+      this.sortKey = 'id'
+    },
   },
   computed: {
-    ...mapState("propertyList", ["properties"]),
-    ...mapState("register", ["agent"]),
-    ...mapState("timeshare", ["agencies"]),
+    ...mapState('propertyList', ['properties']),
+    ...mapState('register', ['agent']),
+    ...mapState('timeshare', ['agencies']),
     FilteredProperties() {
       if (this.filter) {
-        const list = _.filter(this.properties, item =>
+        const list = _.filter(this.properties, (item) =>
           Object.values(item).some(
-            i =>
+            (i) =>
               JSON.stringify(i)
                 .toLowerCase()
-                .indexOf(this.filter.toLowerCase()) > -1
-          )
-        );
-        return _.orderBy(list, this.sortKey, this.SortDirection);
+                .indexOf(this.filter.toLowerCase()) > -1,
+          ),
+        )
+        return _.orderBy(list, this.sortKey, this.SortDirection)
       } else {
-        return _.orderBy(this.properties, this.sortKey, this.SortDirection);
+        return _.orderBy(this.properties, this.sortKey, this.SortDirection)
       }
     },
     PageCount() {
       return this.visibleItemsPerPageCount !== 0
-        ? Math.ceil(this.FilteredProperties.length / this.visibleItemsPerPageCount)
-        : 1;
+        ? Math.ceil(
+            this.FilteredProperties.length / this.visibleItemsPerPageCount,
+          )
+        : 1
     },
     curAgency() {
-      var selAgency = "";
-      this.agencies.forEach(agency => {
+      var selAgency = ''
+      this.agencies.forEach((agency) => {
         if (this.agent[0].agencyId === agency.id) {
-          selAgency = agency.agencyName;
+          selAgency = agency.agencyName
         }
-      });
-      return selAgency;
+      })
+      return selAgency
     },
     DisplayItems() {
-      const list = this.FilteredProperties;
-      const startSlice = (this.currentPage - 1) * this.visibleItemsPerPageCount;
-      let endSlice = this.currentPage * this.visibleItemsPerPageCount;
+      const list = this.FilteredProperties
+      const startSlice = (this.currentPage - 1) * this.visibleItemsPerPageCount
+      let endSlice = this.currentPage * this.visibleItemsPerPageCount
       if (endSlice > list.length) {
-        endSlice = list.length;
+        endSlice = list.length
       }
-      return list.slice(startSlice, endSlice);
+      return list.slice(startSlice, endSlice)
     },
     SortDirection() {
-      return this.reverse ? "desc" : "asc";
+      return this.reverse ? 'desc' : 'asc'
     },
     ROLE() {
-      return Log.getUser().role;
-    }
+      return Log.getUser().role
+    },
   },
   created() {
-    this.getAgentById(Log.getUser().id);
-    this.getAgencies();
+    this.getAgentById(Log.getUser().id)
+    this.getAgencies()
   },
   mounted() {
-    this.wait = true;
-    this.getAdminProperties(this.userId).then(fulfuilled => {
-      this.wait = false;
+    this.wait = true
+    this.getAdminProperties(this.userId).then((fulfuilled) => {
+      this.wait = false
       if (this.itemsPerPageList && this.itemsPerPageList.length > 0) {
-        const [startItem] = this.itemsPerPageList;
-        this.visibleItemsPerPageCount = startItem;
+        const [startItem] = this.itemsPerPageList
+        this.visibleItemsPerPageCount = startItem
       }
-    });
+    })
   },
   watch: {
     filter: {
       immediate: true,
       handler(val, oldVal) {
         if (val != oldVal) {
-          this.currentPage = 1;
+          this.currentPage = 1
         }
-      }
-    }
-  }
-};
+      },
+    },
+  },
+}
 </script>
 
 <style lang="scss" scoped>
   border-bottom: solid;
   border-width: 2px;
   border-color: rgb(27, 117, 187);
-  font-family: "Muli";
+  font-family: 'Muli';
 }
 </style>

src/components/admin/status/timeshareAdminList.vue

   <section id="contact2">
     <div class="container">
       <div class="section-header">
-        <h1>Property Admin</h1>
+        <h1>Timeshare Admin</h1>
       </div>
       <div class="row">
         <div class="col-lg-4"></div>
     <div class="container-fluid">
       <div class="row justify-content-center">
         <div class="col-auto">
-          <table class="table table-striped table-responsive" style="max-width:1920px">
+          <table
+            class="table table-striped table-responsive"
+            style="max-width: 1920px;"
+          >
             <thead>
               <tr>
                 <th scope="col" v-for="(col, c) in displayColumns" :key="c">
-                  <div @click="sortBy(columns[c])" style="cursor: pointer">
+                  <div @click="sortBy(columns[c])" style="cursor: pointer;">
                     <div class="d-flex bd-highlight">
                       <div class="w-100 bd-highlight">{{ col }}</div>
                       <div class="flex-shrink-1 bd-highlight">
                 <td>{{ item.sellPrice | toCurrency }}</td>
                 <td>{{ item.pulbishedDate | toDate }}</td>
                 <td>{{ item.status.description }}</td>
+                <td>{{ item.consent }}</td>
                 <td v-if="!item.publish">
                   <a v-on:click="Publish(item)">
-                    <img src="../../../../public/img/icons/Upload.png" height="25" width="25" />
+                    <img
+                      src="../../../../public/img/icons/Upload.png"
+                      height="25"
+                      width="25"
+                    />
                   </a>
                 </td>
                 <td v-else>
                 </td>
                 <td>
                   <a v-on:click="Edit(item)">
-                    <img src="../../../../public/img/icons/Edit.png" height="25" width="25" />
+                    <img
+                      src="../../../../public/img/icons/Edit.png"
+                      height="25"
+                      width="25"
+                    />
                   </a>
                 </td>
                 <td>
                   <a v-on:click="Delete(item)">
-                    <img src="../../../../public/img/icons/delete.png" height="25" width="25" />
+                    <img
+                      src="../../../../public/img/icons/delete.png"
+                      height="25"
+                      width="25"
+                    />
                   </a>
                 </td>
               </tr>
           </table>
           <div class="d-flex justify-content-between" v-if="showPager">
             <div class="p-1">
-              {{ currentPage + " / " + PageCount + (" - (" + FilteredListings.length + " items)") }}
+              {{
+                currentPage +
+                ' / ' +
+                PageCount +
+                (' - (' + FilteredListings.length + ' items)')
+              }}
             </div>
             <div class="p-1">
               <BasePagination
           <div class="p-2">
             <div class="d-flex flex-row">
               <div>
-                <button v-if="sortKey !== 'id'" class="btn-solid-blue" @click="ClearSort">
+                <button
+                  v-if="sortKey !== 'id'"
+                  class="btn-solid-blue"
+                  @click="ClearSort"
+                >
                   Clear Sort
                 </button>
               </div>
 
 <script>
 /* eslint-disable */
-import { mapState, mapActions, mapGetters } from "vuex";
-import Log from "../../../assets/Log";
-import BasePagination from "../../shared/basePagination";
-import ItemsPerPageList from "../../../assets/staticData/itemsPerPageFive";
-import _ from "lodash";
+import { mapState, mapActions, mapGetters } from 'vuex'
+import Log from '../../../assets/Log'
+import BasePagination from '../../shared/basePagination'
+import ItemsPerPageList from '../../../assets/staticData/itemsPerPageFive'
+import _ from 'lodash'
 
 export default {
   components: {
-    BasePagination
+    BasePagination,
   },
   data() {
     return {
       itemsPerPageList: ItemsPerPageList,
       currentPage: 1,
       reverse: true,
-      sortKey: "id",
-      selectedExcelDownload: "",
+      sortKey: 'id',
+      selectedExcelDownload: '',
       excelFields: {
-        Ref: "id",
-        Owner: "owner",
-        agent: "Agent",
-        Resort: "resort.resortName",
-        Module: "module",
-        Unit: "unitNumber",
-        Beds: "bedrooms",
-        MaxSleep: "maxSleep",
-        Season: "season",
-        Region: "region.regionName",
+        Ref: 'id',
+        Owner: 'owner',
+        agent: 'Agent',
+        Resort: 'resort.resortName',
+        Module: 'module',
+        Unit: 'unitNumber',
+        Beds: 'bedrooms',
+        MaxSleep: 'maxSleep',
+        Season: 'season',
+        Region: 'region.regionName',
         Amount: {
-          field: "sellPrice",
-          callback: value => {
-            return "R " + value;
-          }
+          field: 'sellPrice',
+          callback: (value) => {
+            return 'R ' + value
+          },
         },
         Levy: {
-          field: "levyAmount",
-          callback: value => {
-            return "R " + value;
-          }
+          field: 'levyAmount',
+          callback: (value) => {
+            return 'R ' + value
+          },
         },
         ArrivalDate: {
-          field: "arrivalDate",
-          callback: value => {
-            return value.substring(0, 10);
-          }
+          field: 'arrivalDate',
+          callback: (value) => {
+            return value.substring(0, 10)
+          },
         },
         DepartureDate: {
-          field: "departureDate",
-          callback: value => {
-            return value.substring(0, 10);
-          }
+          field: 'departureDate',
+          callback: (value) => {
+            return value.substring(0, 10)
+          },
         },
         Submitted: {
-          field: "pulbishedDate",
-          callback: value => {
-            return value.substring(0, 10);
-          }
+          field: 'pulbishedDate',
+          callback: (value) => {
+            return value.substring(0, 10)
+          },
         },
-        Status: "status.description"
+        Status: 'status.description',
       },
       displayColumns: [
-        "Ref",
-        "Owner",
-        "Agent",
-        "Resort",
-        "Week Module",
-        "Unit",
-        "Beds",
-        "Season",
-        "Region",
-        "Amount",
-        "Submitted",
-        "Status"
+        'Ref',
+        'Owner',
+        'Agent',
+        'Resort',
+        'Week Module',
+        'Unit',
+        'Beds',
+        'Season',
+        'Region',
+        'Amount',
+        'Submitted',
+        'Status',
+        'Consent',
       ],
       columns: [
-        "id",
-        "owner",
-        "agent",
-        "resort",
-        "module",
-        "unitNumber",
-        "bedrooms",
-        "season",
-        "region",
-        "sellPrice",
-        "weekStatus"
-      ]
-    };
+        'id',
+        'owner',
+        'agent',
+        'resort',
+        'module',
+        'unitNumber',
+        'bedrooms',
+        'season',
+        'region',
+        'sellPrice',
+        'weekStatus',
+        'consent',
+      ],
+    }
   },
   methods: {
-    ...mapActions("myWeeks", ["getAllItems"]),
-    ...mapActions("timeshare", ["updateFilter"]),
-    ...mapActions("myWeeks", [
-      "getItems",
-      "verifyWeek",
-      "editSave",
-      "publishWeek",
-      "unpublishWeek",
-      "deleteListing"
+    ...mapActions('myWeeks', ['getAllItems']),
+    ...mapActions('timeshare', ['updateFilter']),
+    ...mapActions('myWeeks', [
+      'getItems',
+      'verifyWeek',
+      'editSave',
+      'publishWeek',
+      'unpublishWeek',
+      'deleteListing',
     ]),
     updateLazyFilter() {
-      this.updateFilter(this.filter);
+      this.updateFilter(this.filter)
     },
     downloadExcelSheet() {
-      if (this.selectedExcelDownload == "displayItems") {
-        const elem = this.$refs.dlDisplay;
-        elem.$el.click();
-      } else if (this.selectedExcelDownload == "allPublished") {
-        const elem = this.$refs.dlPublished;
-        elem.$el.click();
-      } else if (this.selectedExcelDownload == "allItems") {
-        const elem = this.$refs.dlAll;
-        elem.$el.click();
+      if (this.selectedExcelDownload == 'displayItems') {
+        const elem = this.$refs.dlDisplay
+        elem.$el.click()
+      } else if (this.selectedExcelDownload == 'allPublished') {
+        const elem = this.$refs.dlPublished
+        elem.$el.click()
+      } else if (this.selectedExcelDownload == 'allItems') {
+        const elem = this.$refs.dlAll
+        elem.$el.click()
       }
     },
     Publish(item) {
-      var today = new Date();
-      var dd = String(today.getDate()).padStart(2, "0");
-      var mm = String(today.getMonth() + 1).padStart(2, "0"); //January is 0!
-      var yyyy = today.getFullYear();
-      item.pulbishedDate = today.toISOString().substring(0, 19);
-      item.publish = true;
+      var today = new Date()
+      var dd = String(today.getDate()).padStart(2, '0')
+      var mm = String(today.getMonth() + 1).padStart(2, '0') //January is 0!
+      var yyyy = today.getFullYear()
+      item.pulbishedDate = today.toISOString().substring(0, 19)
+      item.publish = true
       // item.status.id = 26;
       // item.status.code = "FS";
       // item.status.description = "For Sale";
       // item.status.statusType = true;
       // console.log(JSON.stringify(item));
       // this.publishOnly(item);
-      this.publishWeek(item);
+      this.publishWeek(item)
     },
     Unpublish(item) {
-      this.unpublishWeek(item);
+      this.unpublishWeek(item)
     },
     Edit(item) {
-      this.$router.push({ name: "EditTimeshare", params: { weekParam: item } });
+      this.$router.push({ name: 'EditTimeshare', params: { weekParam: item } })
       // this.$router.push(`/editTimeShare/${item.id}`);
     },
     Delete(item) {
-      this.deleteListing(item.id);
+      this.deleteListing(item.id)
     },
     async pageChangeHandle(value) {
       switch (value) {
-        case "next":
-          this.currentPage += 1;
-          break;
-        case "previous":
-          this.currentPage -= 1;
-          break;
+        case 'next':
+          this.currentPage += 1
+          break
+        case 'previous':
+          this.currentPage -= 1
+          break
         default:
-          this.currentPage = value;
+          this.currentPage = value
       }
     },
     sortBy(sortKey) {
-      this.reverse = this.sortKey === sortKey ? !this.reverse : false;
-      this.sortKey = sortKey;
+      this.reverse = this.sortKey === sortKey ? !this.reverse : false
+      this.sortKey = sortKey
     },
     ClearSort() {
-      this.reverse = true;
-      this.sortKey = "id";
-    }
+      this.reverse = true
+      this.sortKey = 'id'
+    },
   },
   computed: {
-    ...mapState("propertyList", ["properties"]),
-    ...mapState("timeshare", ["timeshareFilter"]),
-    ...mapGetters({ getNeedsVerify: "myWeeks/getNeedsVerify" }),
+    ...mapState('propertyList', ['properties']),
+    ...mapState('timeshare', ['timeshareFilter']),
+    ...mapGetters({ getNeedsVerify: 'myWeeks/getNeedsVerify' }),
     FilteredListings() {
       if (this.timeshareFilter) {
-        const list = _.filter(this.getNeedsVerify, item =>
+        const list = _.filter(this.getNeedsVerify, (item) =>
           Object.values(item).some(
-            i =>
+            (i) =>
               JSON.stringify(i)
                 .toLowerCase()
-                .indexOf(this.timeshareFilter.toLowerCase()) > -1
-          )
-        );
-        return _.orderBy(list, this.sortKey, this.SortDirection);
+                .indexOf(this.timeshareFilter.toLowerCase()) > -1,
+          ),
+        )
+        return _.orderBy(list, this.sortKey, this.SortDirection)
       } else {
-        return _.orderBy(this.getNeedsVerify, this.sortKey, this.SortDirection);
+        return _.orderBy(this.getNeedsVerify, this.sortKey, this.SortDirection)
       }
     },
     AllListingsSortedById() {
-      return _.orderBy(this.getNeedsVerify, "id", "desc");
+      return _.orderBy(this.getNeedsVerify, 'id', 'desc')
     },
     OnlyPublished() {
-      var list = [];
-      this.FilteredListings.forEach(listing => {
+      var list = []
+      this.FilteredListings.forEach((listing) => {
         if (listing.publish) {
-          list.push(listing);
+          list.push(listing)
         }
-      });
-      return list;
+      })
+      return list
     },
     PageCount() {
       return this.visibleItemsPerPageCount !== 0
-        ? Math.ceil(this.FilteredListings.length / this.visibleItemsPerPageCount)
-        : 1;
+        ? Math.ceil(
+            this.FilteredListings.length / this.visibleItemsPerPageCount,
+          )
+        : 1
     },
     DisplayItems() {
-      const list = this.FilteredListings;
-      const startSlice = (this.currentPage - 1) * this.visibleItemsPerPageCount;
-      let endSlice = this.currentPage * this.visibleItemsPerPageCount;
+      const list = this.FilteredListings
+      const startSlice = (this.currentPage - 1) * this.visibleItemsPerPageCount
+      let endSlice = this.currentPage * this.visibleItemsPerPageCount
       if (endSlice > list.length) {
-        endSlice = list.length;
+        endSlice = list.length
       }
-      return list.slice(startSlice, endSlice);
+      return list.slice(startSlice, endSlice)
     },
     SortDirection() {
-      return this.reverse ? "desc" : "asc";
-    }
+      return this.reverse ? 'desc' : 'asc'
+    },
   },
   created() {
     this.getItems(this.userId).then(() => {
-      this.wait = false;
-    });
+      this.wait = false
+    })
   },
   mounted() {
-    if (this.timeshareFilter !== "") {
-      this.filter = this.timeshareFilter;
+    if (this.timeshareFilter !== '') {
+      this.filter = this.timeshareFilter
     }
     // this.getAdminProperties(this.userId).then(fulfuilled => {
     //   this.wait = false;
       immediate: true,
       handler(val, oldVal) {
         if (val != oldVal) {
-          this.currentPage = 1;
+          this.currentPage = 1
         }
-      }
-    }
-  }
-};
+      },
+    },
+  },
+}
 </script>
 
 <style lang="scss" scoped>
   border-bottom: solid;
   border-width: 2px;
   border-color: rgb(27, 117, 187);
-  font-family: "Muli";
+  font-family: 'Muli';
 }
 </style>

src/components/home/carouselSection.vue

                   </div>
                 </div>
               </div>
-
-              <div></div>
+              <div>
+                <p>
+                  <strong class="color-black">
+                    Please note that Uni-Vate Properties will be closed for the
+                    festive season from 15th December and will reopen on the 5th
+                    of January.
+                  </strong>
+                </p>
+              </div>
             </div>
           </div>
         </div>
   border-top: none;
   border-left: none;
   border-right: none;
+  margin-left: 10px;
+  margin-right: 10px;
   background-color: white;
   border-bottom-color: rgb(27, 117, 187);
   border: 1px solid rgb(27, 117, 187);
 }
-
 .nav-tabs li :hover {
   color: white;
   background-color: rgb(27, 117, 187);
   border-right: none;
   color: white;
   background-color: rgb(80, 133, 240);
-  border-bottom-color: rgb(80, 133, 240);
+  border-bottom-color: rgb(221, 221, 221);
 }
 
 .nav-tabs li a :hover {

src/components/home/homePage.vue

   </div>
 </template>
 <script>
-import CarouselSection from "./carouselSection.vue";
+import CarouselSection from './carouselSection.vue'
 //import ServiceSection from "./serviceSection.vue";
-import PropertySection from "./propertySection.vue";
+import PropertySection from './propertySection.vue'
 //import NewsSection from "./newsSection.vue";
 //import TestimonialSection from "./testimonialSection.vue";
-import AOS from "aos";
-import "aos/dist/aos.css";
+import AOS from 'aos'
+import 'aos/dist/aos.css'
 export default {
   created() {
-    AOS.init();
+    AOS.init()
   },
   components: {
     CarouselSection,
     //ServiceSection,
-    PropertySection
+    PropertySection,
     //NewsSection,
     //TestimonialSection
   },
   head: {
     title: {
-      inner: "Uni-Vate Properties"
+      inner: 'Uni-Vate Properties',
     },
     meta: [
-      { name: "google-site-verification", content: "wgxKi_f6JKZBurr242rfYmwmyjrcdkbWWBxrkcNvn90" }
-    ]
-  }
-};
+      {
+        name: 'google-site-verification',
+        content: 'wgxKi_f6JKZBurr242rfYmwmyjrcdkbWWBxrkcNvn90',
+      },
+    ],
+  },
+}
 </script>

src/components/processFlow/offers.vue

         'price',
         'offer',
         'madeBy',
+        'consent',
+      ],
+      formats: [
+        'date',
+        'text',
+        'text',
+        'text',
+        'money',
+        'money',
+        'text',
+        'boolean',
+      ],
+      columnHeaders: [
+        '',
+        '',
+        'description',
+        '',
+        '',
+        'offerPrice',
+        'offerBy',
+        'Consent',
       ],
-      formats: ['date', 'text', 'text', 'text', 'money', 'money', 'text'],
-      columnHeaders: ['', '', 'description', '', '', 'offerPrice', 'offerBy'],
     }
   },
   methods: {

src/components/property/commercial/singleView/contentSection.vue

     <div class="container">
       <div class="row" id="resort-profile">
         <div class="col-md-4">
-          <div class="resPortfolioSection" style="margin-top:-5px">
+          <div class="resPortfolioSection" style="margin-top: -5px;">
             <iframe
               v-if="property.video !== null"
               width="100%"
               frameborder="0"
               allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
               allowfullscreen
-              style="margin-bottom:-6px"
+              style="margin-bottom: -6px;"
             ></iframe>
             <div v-if="propertyImages.length > 0">
-              <div v-for="(image, i) in propertyImages" @click="index = i" :key="i">
+              <div
+                v-for="(image, i) in propertyImages"
+                @click="index = i"
+                :key="i"
+              >
                 <div v-if="i < 3">
                   <img
                     v-if="i === 0"
-                    style="width:100%; height:201px;object-fit: cover"
+                    style="width: 100%; height: 201px; object-fit: cover;"
                     :src="image.image"
                   />
                   <div v-else-if="i !== 0">
                     <img
                       v-if="i % 2 === 0"
-                      style="width:50%; height:140px; float:right;"
+                      style="width: 50%; height: 140px; float: right;"
+                      :src="image.image"
+                    />
+                    <img
+                      v-else
+                      style="width: 50%; height: 140px; float: left;"
                       :src="image.image"
                     />
-                    <img v-else style="width:50%; height:140px; float:left" :src="image.image" />
                   </div>
                 </div>
               </div>
-              <gallery :images="Images" :index="index" @close="index = null"></gallery>
+              <gallery
+                :images="Images"
+                :index="index"
+                @close="index = null"
+              ></gallery>
             </div>
           </div>
 
           <div
             class="panel-left p-5"
-            :class="propertyImages.length > 0 ? 'galleryImages' : 'noGalleryImages'"
+            :class="
+              propertyImages.length > 0 ? 'galleryImages' : 'noGalleryImages'
+            "
           >
             <h2>Property Detail</h2>
-            <p v-if="property.showAddress">{{ property.streetNumber }} {{ property.streetName }}</p>
+            <p v-if="property.showAddress">
+              {{ property.streetNumber }} {{ property.streetName }}
+            </p>
             <p>{{ property.city }}, {{ property.suburb }}</p>
             <div v-if="property.displayData.length > 0">
               <div v-for="(data, i) in property.displayData" :key="i">
             </div>-->
             <p>{{ property.shortDescription }}</p>
 
-            <p v-if="property.statusString === 'For Sale'">{{ property.price | toCurrency }}</p>
+            <p v-if="property.statusString === 'For Sale'">
+              {{ property.price | toCurrency }}
+            </p>
             <p v-else>{{ property.price | toCurrency }} Per Month</p>
           </div>
           <div class="panel-left px-5 pb-5 text-center">
               href="http://www.facebook.com/sharer.php?u=https://www.univateproperties.co.za/"
               target="_blank"
             >
-              <img src="img/icon-facebook.svg" alt="Share on Facebook" class="col-3 p-1 mx-1" />
+              <img
+                src="img/icon-facebook.svg"
+                alt="Share on Facebook"
+                class="col-3 p-1 mx-1"
+              />
             </a>
             <a
               href="mailto:?Subject=Simple Share Buttons&amp;Body=I%20saw%20this%20and%20thought%20of%20you!%20 https://www.univateproperties.co.za/"
             >
-              <img src="/img/icon-email.svg" alt="Share on email" class="col-3 p-1 mx-1" />
+              <img
+                src="/img/icon-email.svg"
+                alt="Share on email"
+                class="col-3 p-1 mx-1"
+              />
             </a>
             <a
               href="whatsapp://send?text=Have a look at this property: https://www.univateproperties.co.za"
               data-action="share/whatsapp/share"
               target="_blank"
             >
-              <img src="img/icon-whatsapp.svg" alt="Share on whatsapp" class="col-3 p-1 mx-1" />
+              <img
+                src="img/icon-whatsapp.svg"
+                alt="Share on whatsapp"
+                class="col-3 p-1 mx-1"
+              />
             </a>
           </div>
         </div>
         <div class="col-md-8 p-5 resort-profile">
           <h2 v-if="property.showAddress">
-            <div style="display:inline" v-if="property.propertyName !== null">
+            <div style="display: inline;" v-if="property.propertyName !== null">
               {{ property.propertyName }} /
             </div>
             {{ property.streetNumber }} {{ property.streetName }}
           <p>{{ property.shortDescription }}</p>
           <h4>Property Features</h4>
           <div v-if="property.displayData.length > 0">
-            <div v-for="(data, i) in property.displayData" :key="i" class="row my-3">
+            <div
+              v-for="(data, i) in property.displayData"
+              :key="i"
+              class="row my-3"
+            >
               <div v-for="(field, j) in data.values" :key="j" class="col-md-6">
                 <div
-                  :style="field.value.toUpperCase() === 'FALSE' ? 'display:none' : 'display:show'"
+                  :style="
+                    field.value.toUpperCase() === 'FALSE'
+                      ? 'display:none'
+                      : 'display:show'
+                  "
                   v-if="field.value.toUpperCase() != 'TRUE'"
                 >
                   <i class="fa fa-check-circle"></i>
 
           <div class="mt-5" v-html="property.description"></div>
           <button
-            style="float:right; white-space: nowrap;"
+            style="float: right; white-space: nowrap;"
             :class="checkStatus() ? 'btn-disabled mt-3' : 'btn-solid-blue mt-3'"
             :disabled="checkStatus()"
             @click="goToSingle()"
             ENQUIRE NOW
           </button>
 
-          <h4 v-if="property.virtualTour !== null" style="margin-top:150px">Virtual Tour</h4>
+          <h4 v-if="property.virtualTour !== null" style="margin-top: 150px;">
+            Virtual Tour
+          </h4>
           <iframe
             v-if="property.virtualTour !== null"
             width="100%"
             frameborder="0"
             allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
             allowfullscreen
-            style="margin-bottom:-6px"
+            style="margin-bottom: -6px;"
             class="mt-3"
           ></iframe>
           <h4 v-if="property.video !== null" class="mt-5">Video</h4>
             frameborder="0"
             allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture"
             allowfullscreen
-            style="margin-bottom:-6px"
+            style="margin-bottom: -6px;"
             class="mt-3"
           ></iframe>
         </div>
 
 <script>
 /* eslint-disable */
-import gallery from "../../../shared/gallerySlideShow";
-import { mapState, mapActions } from "vuex";
+import gallery from '../../../shared/gallerySlideShow'
+import { mapState, mapActions } from 'vuex'
 export default {
   components: {
-    gallery
+    gallery,
   },
   props: {
     property: {},
-    propertyImages: {}
+    propertyImages: {},
   },
   data() {
     return {
       index: null,
-      date: new Date()
-    };
+      date: new Date(),
+    }
   },
   computed: {
-    ...mapState("status", ["singleStatus"]),
+    ...mapState('status', ['singleStatus']),
     Images() {
-      const list = [];
+      const list = []
       if (this.propertyImages) {
         for (let i = 0; i < this.propertyImages.length; i++) {
-          list.push(this.propertyImages[i].image);
+          list.push(this.propertyImages[i].image)
         }
       }
-      return list;
-    }
+      return list
+    },
   },
   methods: {
-    ...mapActions("status", ["getSingleStatus"]),
+    ...mapActions('status', ['getSingleStatus']),
     goToSingle() {
-      this.$router.push({ name: "EnquireNow", params: { id: this.$route.params.id } });
+      this.$router.push({
+        name: 'EnquireNow',
+        params: { id: this.$route.params.id },
+      })
     },
     checkStatus() {
-      this.getSingleStatus(this.property.statusId);
+      this.getSingleStatus(this.property.statusId)
       if (
-        this.singleStatus.code === "CIP" ||
-        this.singleStatus.code === "S" ||
-        this.singleStatus.code === "P"
+        this.singleStatus.code === 'CIP' ||
+        this.singleStatus.code === 'S' ||
+        this.singleStatus.code === 'P'
       ) {
-        return true;
+        return true
       } else {
-        return false;
+        return false
       }
-    }
+    },
   },
   mounted() {
-    if (this.property.video === "") {
-      this.property.video = null;
+    if (this.property.video === '') {
+      this.property.video = null
     }
-    if (this.property.virtualTour === "") {
-      this.property.virtualTour = null;
+    if (this.property.virtualTour === '') {
+      this.property.virtualTour = null
     }
-    this.$emit("Loaded", true);
-  }
-};
+    this.$emit('Loaded', true)
+  },
+}
 </script>
 
 <style lang="scss" scoped>
 .btn-disabled {
-  font-family: "Muli";
+  font-family: 'Muli';
   font-size: 15px;
   letter-spacing: 1px;
   display: inline-block;

src/components/propertyManagement/rentalManagement/carouselSection.vue

 <template>
   <section id="intro">
     <div class="container">
-      <div class="row">
-        <div align="left" class="col-sm-12 col-md-10">
-          <div class="intro-content box">
-            <div style="margin-top:-40px">
-              <h2>Let us manage your property</h2>
-              <p>
-                At Uni-Vate we appreciate the significant and positive relationship between
-                effective Property Management and property prices. We understand that effective
-                management not only relies on administrative processes being intact, but also on a
-                clear plan and good communication with our clients based on respect, trust
-                understanding, openness and accountability. We have access to a comprehensive set of
-                human and other resources to ensure that your property is proactively managed to
-                protect your investment and to ensure the contentedness of occupants. We offer
-                comprehensive property management services, whether it being Sectional Title
-                Management, HOA Management or Rental Property Portfolio Management.
-              </p>
-              <a href="#" class="btn-solid-blue">LIST YOUR PROPERTY WITH UNI-VATE PROPERTIES</a>
-              <router-link v-if="!isLoggedIn" to="/user/login" class="btn-white-border"
-                >LOGIN TO OWNERS PORTAL</router-link
-              >
+      <div class="form">
+        <div class="row">
+          <div align="left" class="col-sm-12 col-md-10">
+            <div class="intro-content box">
+              <div style="margin-top: -40px;">
+                <h2>Let us manage your property</h2>
+                <p>
+                  At Uni-Vate we appreciate the significant and positive
+                  relationship between effective Property Management and
+                  property prices. We understand that effective management not
+                  only relies on administrative processes being intact, but also
+                  on a clear plan and good communication with our clients based
+                  on respect, trust understanding, openness and accountability.
+                  We have access to a comprehensive set of human and other
+                  resources to ensure that your property is proactively managed
+                  to protect your investment and to ensure the contentedness of
+                  occupants. We offer comprehensive property management
+                  services, whether it being Sectional Title Management, HOA
+                  Management or Rental Property Portfolio Management.
+                </p>
+                <a href="#" class="btn-white-border">
+                  List your property with Uni-vate Properties
+                </a>
+                <router-link
+                  v-if="!isLoggedIn"
+                  to="/user/login"
+                  class="btn-white-border"
+                >
+                  Login to owner portal
+                </router-link>
+              </div>
             </div>
           </div>
         </div>
       :loop="true"
       :autoHeight="true"
       id="intro-carousel"
-      style="margin-top:-50px;"
-      :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
+      style="margin-top: -50px;"
+      :responsive="{
+        0: { items: 1, nav: false },
+        600: { items: 1, nav: false },
+      }"
     >
       <img class="item" src="/img/intro-carousel/home-1.jpg" alt="" />
       <img class="item" src="/img/intro-carousel/16.jpg" alt="" />
 
 <script>
 /* eslint-disable */
-import { mapState, mapActions } from "vuex";
-import Log from "../../../assets/Log";
-import carousel from "vue-owl-carousel";
+import { mapState, mapActions } from 'vuex'
+import Log from '../../../assets/Log'
+import carousel from 'vue-owl-carousel'
 export default {
   components: {
-    carousel
+    carousel,
   },
   computed: {
-    ...mapState("authentication", ["user", "flag", "status", "person", "token"]),
+    ...mapState('authentication', [
+      'user',
+      'flag',
+      'status',
+      'person',
+      'token',
+    ]),
     isLoggedIn() {
-      console.log(Log.isLoggedIn());
-      return Log.isLoggedIn();
-    }
-  }
-};
+      console.log(Log.isLoggedIn())
+      return Log.isLoggedIn()
+    },
+  },
+}
 </script>
 
 <style lang="scss" scoped></style>

src/components/propertyManagement/sectionalTitle/carouselSection.vue

 <template>
   <section id="intro">
     <div class="container">
-      <div class="row">
-        <div align="left" class="col-sm-12 col-md-10">
-          <div class="intro-content box">
-            <div style="margin-top:-40px">
-              <h2>Let us manage your property</h2>
-              <p>
-                At Uni-Vate we appreciate the significant and positive relationship between
-                effective Property Management and property prices. We understand that effective
-                management not only relies on administrative processes being intact, but also on a
-                clear plan and good communication with our clients based on respect, trust
-                understanding, openness and accountability. We have access to a comprehensive set of
-                human and other resources to ensure that your property is proactively managed to
-                protect your investment and to ensure the contentedness of occupants. We offer
-                comprehensive property management services, whether it being Sectional Title
-                Management, HOA Management or Rental Property Portfolio Management.
-              </p>
-              <a href="#" class="btn-solid-blue">LIST YOUR PROPERTY WITH UNI-VATE PROPERTIES</a>
-              <router-link v-if="!isLoggedIn" to="/user/login" class="btn-white-border"
-                >LOGIN TO OWNERS PORTAL</router-link
-              >
+      <div class="form">
+        <div class="row">
+          <div align="left" class="col-sm-12 col-md-10">
+            <div class="intro-content box">
+              <div style="margin-top: -40px;">
+                <h2>Let us manage your property</h2>
+                <p>
+                  At Uni-Vate we appreciate the significant and positive
+                  relationship between effective Property Management and
+                  property prices. We understand that effective management not
+                  only relies on administrative processes being intact, but also
+                  on a clear plan and good communication with our clients based
+                  on respect, trust understanding, openness and accountability.
+                  We have access to a comprehensive set of human and other
+                  resources to ensure that your property is proactively managed
+                  to protect your investment and to ensure the contentedness of
+                  occupants. We offer comprehensive property management
+                  services, whether it being Sectional Title Management, HOA
+                  Management or Rental Property Portfolio Management.
+                </p>
+                <a href="#" class="btn-white-border">
+                  List your property with Uni-vate Properties
+                </a>
+                <router-link
+                  v-if="!isLoggedIn"
+                  to="/user/login"
+                  class="btn-white-border"
+                >
+                  Login to owners portal
+                </router-link>
+              </div>
             </div>
           </div>
         </div>
       :loop="true"
       :autoHeight="true"
       id="intro-carousel"
-      style="margin-top:-50px;"
-      :responsive="{ 0: { items: 1, nav: false }, 600: { items: 1, nav: false } }"
+      style="margin-top: -50px;"
+      :responsive="{
+        0: { items: 1, nav: false },
+        600: { items: 1, nav: false },
+      }"
     >
       <img class="item" src="/img/intro-carousel/home-1.jpg" alt="" />
       <img class="item" src="/img/intro-carousel/16.jpg" alt="" />
 
 <script>
 /* eslint-disable */
-import { mapState, mapActions } from "vuex";
-import Log from "../../../assets/Log";
-import carousel from "vue-owl-carousel";
+import { mapState, mapActions } from 'vuex'
+import Log from '../../../assets/Log'
+import carousel from 'vue-owl-carousel'
 export default {
   components: {
-    carousel
+    carousel,
   },
   computed: {
-    ...mapState("authentication", ["user", "flag", "status", "person", "token"]),
+    ...mapState('authentication', [
+      'user',
+      'flag',
+      'status',
+      'person',
+      'token',
+    ]),
     isLoggedIn() {
-      console.log(Log.isLoggedIn());
-      return Log.isLoggedIn();
-    }
-  }
-};
+      console.log(Log.isLoggedIn())
+      return Log.isLoggedIn()
+    },
+  },
+}
 </script>
 
 <style lang="scss" scoped></style>

src/components/timeshare/buy/weekListComponent.vue

     },
   },
   mounted() {
-    //if (this.resortCode) {
-    //  this.applyResortFilter(this.resortCode);
-    //}
     this.getByResortCode(this.$route.params.resortCode)
-    //this.getWeeks();
   },
   methods: {
     ...mapActions('weekList', [
       'getByResortCode',
     ]),
     View(item) {
-      this.$router.push(`/resort/${item.resort.resortCode}/${item.unitNumber}`)
+      this.$router.push(`/resort/${item.resort.resortCode}/${item.id}`)
     },
     onChangeItemsPerPage() {
       if (this.currentPage !== 1) {

src/components/timeshare/myWeeksPage.vue

 <template>
   <!-- eslint-disable max-len -->
-  <main id="main" style="margin-top:-30px;padding-bottom:50px">
+  <main id="main" style="margin-top: -30px; padding-bottom: 50px;">
     <div class="container">
       <div class="row">
         <div class="col">
     <div class="container-fluid">
       <div class="row justify-content-center">
         <div class="col-auto">
-          <table class="table table-striped table-responsive" style="max-width:1920px">
+          <table
+            class="table table-striped table-responsive"
+            style="max-width: 1920px;"
+          >
             <thead>
               <tr>
                 <th scope="col" v-for="(col, c) in displayColumns" :key="c">
-                  <div @click="sortBy(columns[c])" style="cursor: pointer">
+                  <div @click="sortBy(columns[c])" style="cursor: pointer;">
                     <div class="d-flex bd-highlight">
                       <div class="w-100 bd-highlight">{{ col }}</div>
                       <div class="flex-shrink-1 bd-highlight">
                 <td>{{ item.sellPrice | toCurrency }}</td>
                 <td>{{ item.pulbishedDate | toDate }}</td>
                 <td>{{ item.status.description }}</td>
+                <td>{{ item.consent }}</td>
                 <!-- <td v-if="!item.publish">
                   <a v-on:click="Publish(item)">
                     <img src="../../../public/img/icons/Upload.png" height="25" width="25" />
                 </td> -->
                 <td>
                   <a v-on:click="Edit(item)">
-                    <img src="../../../public/img/icons/Edit.png" height="25" width="25" />
+                    <img
+                      src="../../../public/img/icons/Edit.png"
+                      height="25"
+                      width="25"
+                    />
                   </a>
                 </td>
                 <td>
                   <a v-on:click="Delete(item)">
-                    <img src="../../../public/img/icons/delete.png" height="25" width="25" />
+                    <img
+                      src="../../../public/img/icons/delete.png"
+                      height="25"
+                      width="25"
+                    />
                   </a>
                 </td>
               </tr>
           </table>
           <div class="d-flex justify-content-between" v-if="showPager">
             <div class="p-1">
-              {{ currentPage + " / " + PageCount + (" - (" + FilteredListings.length + " items)") }}
+              {{
+                currentPage +
+                ' / ' +
+                PageCount +
+                (' - (' + FilteredListings.length + ' items)')
+              }}
             </div>
             <div class="p-1">
               <BasePagination
           <div class="p-2">
             <div class="d-flex flex-row">
               <div>
-                <button v-if="sortKey !== 'id'" class="btn-solid-blue" @click="ClearSort">
+                <button
+                  v-if="sortKey !== 'id'"
+                  class="btn-solid-blue"
+                  @click="ClearSort"
+                >
                   Clear Sort
                 </button>
               </div>
 </template>
 <script>
 /* eslint-disable */
-import { mapState, mapActions, mapGetters } from "vuex";
-import Log from "../../assets/Log";
-import ListView from "../shared/listView.vue";
-import BasePagination from "../shared/basePagination";
-import ItemsPerPageList from "../../assets/staticData/itemsPerPageFive";
-import _ from "lodash";
+import { mapState, mapActions, mapGetters } from 'vuex'
+import Log from '../../assets/Log'
+import ListView from '../shared/listView.vue'
+import BasePagination from '../shared/basePagination'
+import ItemsPerPageList from '../../assets/staticData/itemsPerPageFive'
+import _ from 'lodash'
 
 export default {
   components: {
     ListView,
-    BasePagination
+    BasePagination,
   },
   data() {
     return {
       itemsPerPageList: ItemsPerPageList,
       reverse: true,
       currentPage: 1,
-      sortKey: "id",
+      sortKey: 'id',
       displayColumns: [
-        "Ref",
-        "Owner",
-        "Agent",
-        "Resort",
-        "Week Module",
-        "Unit",
-        "Beds",
-        "Season",
-        "Region",
-        "Amount",
-        "Submitted",
-        "Status"
+        'Ref',
+        'Owner',
+        'Agent',
+        'Resort',
+        'Week Module',
+        'Unit',
+        'Beds',
+        'Season',
+        'Region',
+        'Amount',
+        'Submitted',
+        'Status',
+        'Consent',
       ],
       columns: [
-        "id",
-        "owner",
-        "agent",
-        "resort",
-        "module",
-        "unitNumber",
-        "bedrooms",
-        "season",
-        "region",
-        "sellPrice",
-        "weekStatus"
-      ]
-    };
+        'id',
+        'owner',
+        'agent',
+        'resort',
+        'module',
+        'unitNumber',
+        'bedrooms',
+        'season',
+        'region',
+        'sellPrice',
+        'weekStatus',
+        'consent',
+      ],
+    }
   },
   created() {
     this.getItems(Log.getUser().id).then(() => {
-      this.wait = false;
-    });
+      this.wait = false
+    })
   },
   mounted() {},
   computed: {
-    ...mapGetters({ getNeedsVerify: "myWeeks/getNeedsVerify" }),
-    ...mapState("myWeeks", ["items"]),
+    ...mapGetters({ getNeedsVerify: 'myWeeks/getNeedsVerify' }),
+    ...mapState('myWeeks', ['items']),
     FilteredListings() {
       if (this.filter) {
-        const list = _.filter(this.getNeedsVerify, item =>
+        const list = _.filter(this.getNeedsVerify, (item) =>
           Object.values(item).some(
-            i =>
+            (i) =>
               JSON.stringify(i)
                 .toLowerCase()
-                .indexOf(this.filter.toLowerCase()) > -1
-          )
-        );
-        return _.orderBy(list, this.sortKey, this.SortDirection);
+                .indexOf(this.filter.toLowerCase()) > -1,
+          ),
+        )
+        return _.orderBy(list, this.sortKey, this.SortDirection)
       } else {
-        return _.orderBy(this.getNeedsVerify, this.sortKey, this.SortDirection);
+        return _.orderBy(this.getNeedsVerify, this.sortKey, this.SortDirection)
       }
     },
     PageCount() {
       return this.visibleItemsPerPageCount !== 0
         ? Math.ceil(this.items.length / this.visibleItemsPerPageCount)
-        : 1;
+        : 1
     },
     DisplayItems() {
-      const list = this.FilteredListings;
-      const startSlice = (this.currentPage - 1) * this.visibleItemsPerPageCount;
-      let endSlice = this.currentPage * this.visibleItemsPerPageCount;
+      const list = this.FilteredListings
+      const startSlice = (this.currentPage - 1) * this.visibleItemsPerPageCount
+      let endSlice = this.currentPage * this.visibleItemsPerPageCount
       if (endSlice > list.length) {
-        endSlice = list.length;
+        endSlice = list.length
       }
-      return list.slice(startSlice, endSlice);
+      return list.slice(startSlice, endSlice)
     },
     SortDirection() {
-      return this.reverse ? "desc" : "asc";
-    }
+      return this.reverse ? 'desc' : 'asc'
+    },
   },
   methods: {
-    ...mapActions("myWeeks", ["getItems"]),
+    ...mapActions('myWeeks', ['getItems']),
     onEdit(item) {
-      this.$router.push(`/timeshare/${item.id}`);
+      this.$router.push(`/timeshare/${item.id}`)
     },
     onNew() {
-      this.$router.push("/timeshare/sell");
+      this.$router.push('/timeshare/sell')
     },
     onRowClick(items) {
-      this.selectedItems = items;
+      this.selectedItems = items
     },
     onClearSelected() {
-      this.selectedItems = [];
+      this.selectedItems = []
     },
     Edit(item) {
-      this.$router.push({ name: "EditTimeshare", params: { weekParam: item } });
+      this.$router.push({ name: 'EditTimeshare', params: { weekParam: item } })
       // this.$router.push(`/editTimeShare/${item.id}`);
     },
     Delete(item) {
-      this.deleteListing(item.id);
+      this.deleteListing(item.id)
     },
     async pageChangeHandle(value) {
       switch (value) {
-        case "next":
-          this.currentPage += 1;
-          break;
-        case "previous":
-          this.currentPage -= 1;
-          break;
+        case 'next':
+          this.currentPage += 1
+          break
+        case 'previous':
+          this.currentPage -= 1
+          break
         default:
-          this.currentPage = value;
+          this.currentPage = value
       }
     },
     sortBy(sortKey) {
-      this.reverse = this.sortKey === sortKey ? !this.reverse : false;
-      this.sortKey = sortKey;
+      this.reverse = this.sortKey === sortKey ? !this.reverse : false
+      this.sortKey = sortKey
     },
     ClearSort() {
-      this.reverse = true;
-      this.sortKey = "id";
-    }
-  }
-};
+      this.reverse = true
+      this.sortKey = 'id'
+    },
+  },
+}
 </script>
 <style scoped>
 .my-disable {

src/components/timeshare/resort/resortPageNew.vue

     <main id="main" style="margin-top: 20px;">
       <section>
         <div class="container">
-          <div class="row" id="resort-profile">
-            <div class="col-md-3">
-              <gallerySection :images="resort.images" />
-              <FilterComponent :hideTop="true" />
-            </div>
-            <div
-              class="col-md-9 resort-profile"
-              style="margin-top: 15px; margin-bottom: 15px;"
-            >
-              <h2>{{ resort.prName }}</h2>
-              <WeekList :resortCode="resortCode" />
-              <p v-if="description && description !== ''">
-                {{ description }}
-              </p>
-              <br v-if="description && description !== ''" />
-              <div class="d-flex mt-3">
-                <iframe
-                  width="100%"
-                  height="200"
-                  id="gmap_canvas"
-                  :src="
-                    'https://maps.google.com/maps?q=' +
-                    resort.prLatitude +
-                    ',' +
-                    resort.prLongitude +
-                    '&hl=en&z=14&amp;output=embed'
-                  "
-                  frameborder="0"
-                  scrolling="no"
-                  marginheight="0"
-                  marginwidth="0"
-                ></iframe>
+          <div class="form">
+            <div class="row" id="resort-profile">
+              <div class="col-md-3">
+                <gallerySection :images="resort.images" />
+                <FilterComponent :hideTop="true" />
               </div>
-            </div>
-          </div>
-          <div class="row">
-            <div class="col">
-              <router-link
-                style="float: right;"
-                class="btn-white-border mb-4"
-                to="/timeshare/buy"
+              <div
+                class="col-md-9 resort-profile"
+                style="margin-top: 15px; margin-bottom: 15px;"
               >
-                Back
-              </router-link>
+                <h2>{{ resort.prName }}</h2>
+                <WeekList :resortCode="resortCode" />
+                <p v-if="description && description !== ''">
+                  {{ description }}
+                </p>
+                <br v-if="description && description !== ''" />
+                <div class="d-flex mt-3">
+                  <iframe
+                    width="100%"
+                    height="200"
+                    id="gmap_canvas"
+                    :src="
+                      'https://maps.google.com/maps?q=' +
+                      resort.prLatitude +
+                      ',' +
+                      resort.prLongitude +
+                      '&hl=en&z=14&amp;output=embed'
+                    "
+                    frameborder="0"
+                    scrolling="no"
+                    marginheight="0"
+                    marginwidth="0"
+                  ></iframe>
+                </div>
+              </div>
+            </div>
+            <div class="row">
+              <div class="col">
+                <router-link
+                  style="float: right;"
+                  class="btn-white-border mb-4"
+                  to="/timeshare/buy"
+                >
+                  Back
+                </router-link>
+              </div>
             </div>
           </div>
         </div>
     ...mapState('resort', ['resort', 'images', 'description']),
   },
   created() {
-    console.log('Resort Description')
-    console.log(this.resortCode)
     this.getDescription(this.resortCode)
 
-    console.log(this.resort.description)
     this.getResortData(
       this.resortCode.includes('SILV') ? 'SILV1' : this.resortCode,
     ).then(() => (this.wait = false))

src/components/timeshare/resort/unit/summarySection.vue

     <div class="row">
       <div class="col">
         <div class="section-header">
-          <h2>{{ week ? week.resort.resortName : '' }}</h2>
+          <!--<h2>{{ week ? week.resort.resortName : '' }}</h2> -->
         </div>
       </div>
     </div>
             <tr>
               <th scope="col">Unit</th>
               <th scope="col">Week / Module</th>
-              <th scope="col">2020 Arrival Date</th>
+              <th scope="col">Arrival Date</th>
               <th scope="col">Bedrooms</th>
               <th scope="col">Season</th>
               <th scope="col">Current Year Levy</th>
     makeOffer,
     gallerySection,
   },
+  mounted() {
+    this.getWeek(this.weekId)
+  },
   computed: {
     ...mapState('resort', ['resort', 'description', 'images', 'layout']),
-
-    ...mapGetters({
-      weekById: 'weekList/weekById',
-    }),
-    week() {
-      return this.weekById(this.resortCode, this.unitNumber)
-    },
-    // ...mapState('week', ['currentWeek']),
+    ...mapState('weekList', ['week']),
   },
   props: {
-    resortCode: {},
-    unitNumber: {},
+    weekId: {},
   },
   methods: {
-    ...mapActions('weekList', ['getWeeks', 'applyResortFilter']),
-    ...mapActions('resort', ['initResort']),
-    // ...mapActions('week', ['initWeek']),
+    ...mapActions('weekList', ['getWeek']),
     formatPrice(value) {
       if (value) {
         const val = (value / 1).toFixed(2)

src/components/timeshare/resort/unit/unitPageNew.vue

 <template>
-  <main id="main" style="padding-bottom:50px">
+  <main id="main" style="padding-bottom: 50px;">
     <!-- <carouselSection v-if="!wait" :resortImages="resort.images" /> -->
-    <summarySection :resortCode="resortCode" :unitNumber="unitNumber" />
+    <summarySection :weekId="weekId" />
     <div class="container">
       <div class="row mt-5">
         <div class="col">
           <tabSection
-            style="margin-bottom:100px"
+            style="margin-bottom: 100px;"
             :resortCode="calculatedCode"
             :resortCoords="resort.prPostAdd1"
             :layoutImages="layouts"
 
 <script>
 /* eslint-disable */
-import { mapState, mapActions, mapGetters } from "vuex";
-import gallerySection from "../gallerySection";
-import tabSection from "./tabSection";
-import summarySection from "./summarySection";
-import carouselSection from "./carouselSection";
+import { mapState, mapActions, mapGetters } from 'vuex'
+import gallerySection from '../gallerySection'
+import tabSection from './tabSection'
+import summarySection from './summarySection'
+import carouselSection from './carouselSection'
 
 export default {
-  name: "unit",
+  name: 'unit',
   components: {
     gallerySection,
     tabSection,
     summarySection,
-    carouselSection
+    carouselSection,
   },
   props: {
     resortCode: {},
-    unitNumber: {}
+    weekId: {},
   },
   data() {
     return {
-      wait: false
-    };
+      wait: false,
+    }
   },
   mounted() {
     // await this.initResort(this.resortCode);
     // setTimeout(() => {
     //   this.boolLoaded = true;
     // }, 500);
-    this.wait = true;
-    this.getResortData(this.resortCode.includes("SILV") ? "SILV1" : this.resortCode).then(
-      fulfilled => {
-        this.applyResortFilter(this.resortCode.includes("SILV") ? "SILV1" : this.resortCode);
-        this.getWeeks();
-        this.wait = false;
-      }
-    );
+    this.wait = true
+    console.log(this.weekId)
+    this.getResortData(
+      this.resortCode.includes('SILV') ? 'SILV1' : this.resortCode,
+    ).then((fulfilled) => {
+      this.applyResortFilter(
+        this.resortCode.includes('SILV') ? 'SILV1' : this.resortCode,
+      )
+      this.getWeeks()
+      this.wait = false
+    })
   },
   computed: {
-    ...mapState("resort", ["resort"]),
-
-    ...mapGetters({
-      weekById: "weekList/weekById"
-    }),
-    week() {
-      return this.weekById(
-        this.resortCode.includes("SILV") ? "SILV1" : this.resortCode,
-        this.unitNumber
-      );
-    },
+    ...mapState('resort', ['resort']),
+    ...mapState('weekList', ['weeks', 'week']),
     layouts() {
-      var layouts = [];
-      layouts.push(this.resort.layout);
-      return layouts;
+      var layouts = []
+      layouts.push(this.resort.layout)
+      return layouts
     },
     calculatedCode() {
-      return this.resortCode.includes("SILV") ? "SILV1" : this.resortCode;
-    }
-    // ...mapState('week', ['currentWeek']),
+      return this.resortCode.includes('SILV') ? 'SILV1' : this.resortCode
+    },
   },
   methods: {
-    ...mapActions("weekList", ["getWeeks", "applyResortFilter"]),
-    ...mapActions("resort", ["getResortData"]),
-    // ...mapActions('week', ['initWeek']),
+    ...mapActions('weekList', ['getWeeks', 'getWeek', 'applyResortFilter']),
+    ...mapActions('resort', ['getResortData']),
     formatPrice(value) {
       if (value) {
-        const val = (value / 1).toFixed(2);
-        return val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, " ");
+        const val = (value / 1).toFixed(2)
+        return val.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ' ')
       }
-      return "";
-    }
-  }
-};
+      return ''
+    },
+  },
+}
 </script>
 
 <style lang="scss" scoped>

src/components/timeshare/sell/contentSectionNew.vue

                         data-msg="Please enter your cell number"
                         v-model="indiv.cellNumber"
                         v-bind:class="{
-                          'is-valid': indiv.cellNumber,
+                          'is-valid':
+                            indiv.cellNumber &&
+                            validPhoneNumber(indiv.cellNumber),
                           'is-invalid':
-                            !requiredField(
-                              validPhoneNumber(indiv.cellNumber),
-                            ) && cellNumberLoad,
+                            !requiredField(indiv.cellNumber) ||
+                            (indiv.cellNumber &&
+                              !validPhoneNumber(indiv.cellNumber) &&
+                              cellNumberLoad),
                         }"
                         v-on:keyup="cellNumberLoad = true"
                         v-on:blur="cellNumberLoad = true"
                     </p>
                   </div>
                 </div>
-                <div class="form-row">
-                  <div class="col-md-12">
-                    <alert :text="errorMessage" :type="errorOccurred" />
-                  </div>
-                </div>
                 <div align="left" class="custom-control custom-switch mb-2">
                   <div class="row">
                     <div align="center" class="col">
                     v-if="!sellItem.id"
                     @click="submitSale()"
                   >
-                    SUBMIT
+                    Submit
                   </button>
                   <button class="btn-white-border" v-else @click="newSale()">
-                    NEW WEEK
+                    New Week
                   </button>
                 </div>
+                <div class="row">
+                  <div v-if="boolMessage" class="row">
+                    <div class="col">
+                      <alert
+                        :text="'Your Information has been updated!'"
+                        :type="'SUCCESS'"
+                      />
+                    </div>
+                  </div>
+                  <div v-if="boolValidationError" class="row">
+                    <div class="col">
+                      <alert :text="errorMessage" :type="errorOccurred" />
+                    </div>
+                  </div>
+                </div>
                 <!-- <div class="text-center col-12">
               <button class="btn-solid-blue" @click="paygateRedirect()">PayGate</button>
             </div>-->
-                <br />
-                <br />
               </div>
             </div>
           </div>
-          <br />
-          <br />
         </div>
         <div v-if="wait" id="preloader"></div>
       </div>
             console.log('saveweek')
             this.saveWeek(this.sellItem)
               .then((fulfilled) => {
+                this.boolMessage = true
                 // this.$router.push({
                 //   name: "PaymentOption",
                 //   params: { week: fulfilled, indiv: this.indiv }
         this.sellItem.levyAmount &&
         this.sellItem.arrivalDate &&
         this.sellItem.departureDate &&
-        this.sellItem.sellPrice &&
-        this.validEmail(individual.emailAddress) &&
-        this.validPhoneNumber(this.sellItem.cellNumber) &&
-        this.validPhoneNumber(this.sellItem.landlineNumber)
+        this.sellItem.sellPrice
       ) {
         if (this.selectedUserType === 'custom') {
           if (
-            this.nameLoad &&
-            this.surnameLoad &&
-            this.emailAddressLoad &&
-            this.cellNumberLoad &&
-            this.spouseEmailLoad
+            this.indiv.name &&
+            this.indiv.surname &&
+            this.indiv.emailAddress &&
+            this.indiv.cellNumber &&
+            this.validEmail(this.indiv.emailAddress) &&
+            this.validPhoneNumber(this.indiv.cellNumber) &&
+            this.validPhoneNumber(this.indiv.landlineNumber)
           ) {
             console.log('passed custom')
             this.errorOccurred = ''
             this.surnameLoad = true
             this.emailAddressLoad = true
             this.cellNumberLoad = true
-            this.spouseEmailLoad = true
             this.boolValidationError = true
             this.errorOccurred = 'ERROR'
             this.errorMessage =

src/components/user/registerIndividual.vue

         this.indivUser.username &&
         this.indivUser.password &&
         this.indivUser.password === this.indivUser.confirmPassword &&
-        this.validEmail(this.indiviUser.email) &&
         this.validPhoneNumber(this.indivUser.cellNumber) &&
         this.validPhoneNumber(this.indivUser.telephone)
       ) {
         return true
       } else {
         this.boolValidationError = true
-        ;(this.nameLoad = true),
-          (this.surnameLoad = true),
-          (this.emailLoad = true),
-          (this.cellNumberLoad = true),
-          (this.telephoneLoad = true),
-          (this.usernameLoad = true),
-          (this.passwordLoad = true),
-          (this.confirmPasswordLoad = true),
-          (this.errorOccurred = 'ERROR')
+        this.nameLoad = true
+        this.surnameLoad = true
+        this.emailLoad = true
+        this.cellNumberLoad = true
+        this.telephoneLoad = true
+        this.usernameLoad = true
+        this.passwordLoad = true
+        this.confirmPasswordLoad = true
+        this.errorOccurred = 'ERROR'
         this.errorMessage = 'Please check form and correct all input fields!'
         return false
       }

src/components/user/updateAgentProfile.vue

         <div class="form">
           <div class="row">
             <div class="section-header">
-              <h2>Update Agent Info</h2>
+              <h2>update agent info</h2>
             </div>
           </div>
-          <div class="row">
-            <div class="col">
-              <float-label>
+          <div class="row mb-4">
+            <div class="col-md-6">
+              <float-label fixed label="Username">
                 <input
                   type="text"
-                  name="name"
-                  class="form-control uniInput"
-                  id="name"
-                  placeholder="USERNAME"
+                  name="username"
+                  class="form-control uniinput"
+                  id="username"
+                  placeholder="Username"
                   data-rule="minlen:4"
-                  data-msg="Please enter your name"
+                  data-msg="please enter your username"
                   v-model="agent.user.username"
+                  v-bind:class="{
+                    'is-valid': agent.user.username,
+                    'is-invalid':
+                      !requiredField(agent.user.username) && usernameLoad,
+                  }"
+                  v-on:keyup="usernameLoad = true"
+                  v-on:blur="usernameLoad = true"
                 />
+                <div class="invalid-feedback">Username is Required!</div>
               </float-label>
             </div>
-            <div class="col">
-              <float-label>
+            <div class="form-group col-md-6">
+              <float-label fixed label="Name">
                 <input
                   type="text"
                   name="name"
                   class="form-control uniInput"
                   id="name"
-                  placeholder="NAME"
+                  placeholder="Name"
                   data-rule="minlen:4"
                   data-msg="Please enter your name"
                   v-model="agent.name"
+                  v-bind:class="{
+                    'is-valid': agent.name,
+                    'is-invalid': !requiredField(agent.name) && nameLoad,
+                  }"
+                  v-on:keyup="nameLoad = true"
+                  v-on:blur="nameLoad = true"
                 />
+                <div class="invalid-feedback">Name is Required!</div>
               </float-label>
             </div>
           </div>
           <div class="row mt-4">
-            <div class="col-md-6">
-              <float-label>
+            <div class="form-group col-md-6">
+              <float-label fixed label="Surname">
                 <input
                   type="text"
                   class="form-control uniInput"
                   name="surname"
                   id="surname"
-                  placeholder="SURNAME"
+                  placeholder="Surname"
                   data-msg="Please enter your surname"
                   v-model="agent.surname"
+                  v-bind:class="{
+                    'is-valid': agent.surname,
+                    'is-invalid': !requiredField(agent.surname) && surnameLoad,
+                  }"
+                  v-on:keyup="surnameLoad = true"
+                  v-on:blur="surnameLoad = true"
                 />
+                <div class="invalid-feedback">Surname is Required!</div>
               </float-label>
             </div>
-            <div class="col">
-              <float-label>
+            <div class="form-group col-md-6">
+              <float-label fixed label="Email">
                 <input
                   type="text"
                   class="form-control uniInput"
                   name="email"
                   id="email"
-                  placeholder="EMAIL ADDRESS"
+                  placeholder="Email Address"
                   data-msg="Please enter your email address"
                   v-model="agent.email"
+                  v-bind:class="{
+                    'is-valid': agent.email && validEmail(agent.email),
+                    'is-invalid': !validEmail(agent.email) && emailAddressLoad,
+                  }"
+                  v-on:keyup="emailAddressLoad = true"
+                  v-on:blur="emailAddressLoad = true"
                 />
+                <div class="invalid-feedback">
+                  Valid Email address is Required!
+                </div>
               </float-label>
             </div>
-            <!-- <div class="col">
-            <float-label>
-              <input
-                type="text"
-                name="idnum"
-                class="form-control uniInput"
-                id="idnum"
-                placeholder="ID NUMBER"
-                data-rule="minlen:4"
-                data-msg="Please enter your ID number"
-              />
-            </float-label>
-          </div> -->
-          </div>
-          <!-- <div class="row mt-4">
-          <div class="col-md-6">
-            <float-label>
-              <input
-                type="text"
-                class="form-control uniInput"
-                name="company"
-                id="company"
-                placeholder="COMPANY REG NUMBER"
-                data-rule="minlen:4"
-                data-msg="Please enter your company reg number"
-              />
-            </float-label>
           </div>
-        </div> -->
           <div class="row mt-4">
-            <div class="col">
-              <float-label>
+            <div class="form-group col-md-6">
+              <float-label fixed label="Cell Number">
                 <input
                   type="text"
                   name="cell"
                   class="form-control uniInput"
                   id="cell"
-                  placeholder="CELL NUMBER"
+                  placeholder="Cell Number"
                   data-rule="minlen:4"
                   data-msg="Please enter your cell number"
                   v-model="agent.cellNumber"
+                  v-bind:class="{
+                    'is-valid':
+                      agent.cellNumber && validPhoneNumber(agent.cellNumber),
+                    'is-invalid':
+                      !requiredField(agent.cellNumber) ||
+                      (agent.cellNumber &&
+                        !validPhoneNumber(agent.cellNumber) &&
+                        cellNumberLoad),
+                  }"
+                  v-on:keyup="cellNumberLoad = true"
+                  v-on:blur="cellNumberLoad = true"
                 />
+                <div class="invalid-feedback">
+                  Valid Cell Number is Required!
+                </div>
               </float-label>
             </div>
-            <div class="col">
-              <float-label>
+            <div class="form-group col-md-6">
+              <float-label fixed label="Telephone Number">
                 <input
                   type="text"
                   class="form-control uniInput"
-                  name="landline"
-                  id="landline"
-                  placeholder="TELEPHONE NUMBER"
+                  name="telephone"
+                  id="telephone"
+                  placeholder="Telephone Number"
                   data-msg="Please enter your Telephone number"
                   v-model="agent.telephone"
+                  v-bind:class="{
+                    'is-valid':
+                      agent.telephone && validPhoneNumber(agent.telephone),
+                    'is-invalid':
+                      agent.telephone && !validPhoneNumber(agent.telephone),
+                  }"
                 />
-              </float-label>
-            </div>
-          </div>
-          <div class="row mt-4">
-            <div class="col">
-              <float-label fixed label="AGENCY">
-                <select
-                  v-model="agent.agencyId"
-                  class="form-control uniSelect"
-                  name=""
-                  id=""
-                >
-                  <option
-                    v-for="agency in agencies"
-                    :key="agency.id"
-                    :value="agency.id"
-                  >
-                    {{ agency.agencyName }}
-                  </option>
-                </select>
-              </float-label>
-            </div>
-          </div>
-          <div v-if="pullUserRole === 'Super Admin'">
-            <div class="row">
-              <div class="col">
-                <div class="section-header">
-                  <h2>Access Control</h2>
+                <div class="invalid-feedback">
+                  Valid telephone number is required!!
                 </div>
-              </div>
+              </float-label>
             </div>
-            <div class="row">
+
+            <div class="row mt-4">
               <div class="col-md-6">
-                <float-label label="User Role" style="width: 100%;">
+                <float-label fixed label="Agency" style="width: 100%;">
                   <select
                     class="form-control uniSelect"
-                    id="howMarried"
-                    v-model="agent.user.role"
+                    v-model="agent.agencyId"
+                    v-bind:class="{
+                      'is-valid': agent.agencyId,
+                      'is-invalid':
+                        !requiredField(agent.agencyId) && inputAgencyLoad,
+                    }"
+                    v-on:keyup="inputAgencyLoad = true"
+                    v-on:blur="inputAgencyLoad = true"
                   >
+                    <option value="">Private User</option>
                     <option
-                      v-for="role in getRoles"
-                      :key="role.id"
-                      :value="role.roleName"
+                      v-for="(item, i) in agencies"
+                      :key="i"
+                      :value="item.id"
                     >
-                      {{ role.roleName }}
+                      {{ item.agencyName }}
                     </option>
                   </select>
                 </float-label>
               </div>
-              <div class="col-md-6">
-                <input
-                  class="mr-2 mt-3"
-                  name="changePass"
-                  type="checkbox"
-                  v-model="agent.user.loginPasswordChange"
-                />
-                <label for="changePass">Change Password on Next Login</label>
-              </div>
             </div>
-          </div>
-          <div class="row">
-            <div class="col">
-              <Alert :text="errorMessage" :type="errorOccurred" />
+
+            <div v-if="pullUserRole === 'Super Admin'">
+              <div class="row">
+                <div class="col">
+                  <div class="section-header">
+                    <h2>Access Control</h2>
+                  </div>
+                </div>
+              </div>
+
+              <div class="row">
+                <div class="col-md-6">
+                  <float-label label="User Role" style="width: 100%;">
+                    <select
+                      class="form-control uniSelect"
+                      id="howMarried"
+                      v-model="agent.user.role"
+                      v-bind:class="{
+                        'is-valid': agent.user.role,
+                        'is-invalid':
+                          !requiredField(agent.user.role) && userRoleLoad,
+                      }"
+                      v-on:keyup="userRoleLoad = true"
+                      v-on:blur="userRoleLoad = true"
+                    >
+                      <option
+                        v-for="role in getRoles"
+                        :key="role.id"
+                        :value="role.roleName"
+                      >
+                        {{ role.roleName }}
+                      </option>
+                    </select>
+                    <div class="invalid-feedback">
+                      User Role is Required!
+                    </div>
+                  </float-label>
+                </div>
+
+                <div class="col-md-6">
+                  <input
+                    class="mr-2 mt-3"
+                    name="changePass"
+                    type="checkbox"
+                    v-model="agent.user.loginPasswordChange"
+                  />
+                  <label for="changePass">Change Password on Next Login</label>
+                </div>
+              </div>
             </div>
-          </div>
-          <div class="row mt-5 mb-5">
-            <div class="col">
-              <button class="btn-solid-blue" @click="sendToApi()">SAVE</button>
+            <div class="row">
+              <div v-if="boolMessage" class="row">
+                <div class="col">
+                  <alert
+                    :text="'Your Information has been updated!'"
+                    :type="'SUCCESS'"
+                  />
+                </div>
+              </div>
+              <div v-if="boolValidationError" class="row">
+                <div class="col">
+                  <alert :text="errorMessage" :type="errorOccurred" />
+                </div>
+              </div>
             </div>
-            <div class="col">
-              <button class="btn-solid-blue" @click="$router.go(-1)">
-                CLOSE
-              </button>
+            <div class="row mt-5 mb-5">
+              <div class="col">
+                <button class="btn-white-border" @click="sendToApi()">
+                  Update
+                </button>
+              </div>
+              <div class="col">
+                <button class="btn-white-border" @click="$router.go(-1)">
+                  Cancel
+                </button>
+              </div>
             </div>
           </div>
         </div>
 import Alert from '../shared/alert'
 
 export default {
-  props: {
-    agent: {},
-  },
+  name: 'UpdateAgentProfile',
   components: {
     Alert,
   },
   data() {
     return {
+      selectedItem: {},
+      agent: {},
       errorOccurred: '',
       errorMessage: '',
-      boolError: false,
+      boolMessage: false,
+      boolValidationError: false,
+      usernameLoad: false,
+      nameLoad: false,
+      surnameLoad: false,
+      emailAddressLoad: false,
+      cellNumberLoad: false,
+      telephoneNumberLoad: false,
+      spouseEmailLoad: false,
+      userRoleLoad: false,
+      inputAgencyLoad: false,
     }
   },
+  props: {},
   created() {
     this.retrieveUserRoles()
+    this.getIndividual(Log.getUser().id).then(() => {
+      if (this.$route.params.agent) {
+        this.agent = this.$route.params.agent
+
+        if (this.agent.address === null) {
+          this.agent.address = {}
+        }
+
+        if (
+          this.agent.user.role === 'Agent' ||
+          this.agent.user.role === 'Agency' ||
+          this.agent.user.role === 'Management Agent'
+        ) {
+          this.getAgentById(this.agent.userId)
+          this.agent.agencyId = this.agent.agencyId
+        }
+      } else {
+        this.agent = this.indiv
+        this.agent.email = this.indiv.emailAddress
+        this.agent.user = Log.getUser()
+      }
+    })
     this.getAgencies()
+    this.selectedItem = this.currentUser
   },
   computed: {
+    ...mapState('individual', ['indiv']),
+    ...mapState('register', ['agencies']),
+    ...mapGetters({
+      user: 'authentication/getUser',
+      person: 'authentication/getPerson',
+    }),
     ...mapGetters('role', ['getRoles']),
-    ...mapState('timeshare', ['agencies']),
+    isLoggedIn() {
+      return this.user && this.person
+    },
     pullUserRole() {
       return Log.getUser().role
     },
   },
   methods: {
+    ...mapActions('individual', ['getIndividual', 'updateIndividual']),
     ...mapActions('role', ['retrieveUserRoles']),
-    ...mapActions('timeshare', ['getAgencies', 'updateAgent']),
-    ...mapActions('register', ['saveAgent']),
-    validPhoneNumber(number) {
-      const rx = /^[\+]?[(]?[0-9]{3}[)]?[-\s\.]?[0-9]{3}[-\s\.]?[0-9]{4,6}$/im
-      return rx.test(String(number))
+    ...mapActions('register', [
+      'getAgentById',
+      'getAgencies',
+      'saveAgent',
+      'updateAgent',
+    ]),
+    onSelectedItemItemChange(item) {
+      this.currentUser = item
     },
     sendToApi() {
       this.boolError = false
       this.agent.fullName = this.agent.name + ' ' + this.agent.surname
-      if (this.agent.telephone !== '') {
-        if (this.agent.telephone !== null) {
-          if (!this.validPhoneNumber(this.agent.telephone)) {
-            this.boolError = true
-            this.errorOccurred = 'ERROR'
-            this.errorMessage =
-              'The telephone number is not in the correct format.'
+      this.agent.emailAddress = this.agent.email
+      if (this.validatePage()) {
+        if (!this.boolValidationError) {
+          if (
+            this.agent.user.role === 'Agent' ||
+            this.agent.user.role === 'Agency' ||
+            this.agent.user.role === 'Managing Agent'
+          ) {
+            this.saveAgent(this.agent)
+              .then(() => {
+                this.boolMessage = true
+                if (Log.getUser().role === 'Super Admin') {
+                  if (
+                    this.agent.id ===
+                    JSON.parse(localStorage.getItem('person')).id
+                  ) {
+                    var newPerson = {
+                      id: JSON.parse(localStorage.getItem('person')).id,
+                      email: this.agent.email,
+                      fullname: this.agent.name + ' ' + this.agent.surname,
+                      name: this.agent.name,
+                      surname: this.agent.surname,
+                    }
+                    localStorage.setItem('person', JSON.stringify(newPerson))
+                    this.$router.go()
+                  }
+                  //this.$router.push('/status/agentuserManagementPage')
+                } else {
+                  var newPerson = {
+                    id: JSON.parse(localStorage.getItem('person')).id,
+                    email: this.agent.email,
+                    fullname: this.agent.name + ' ' + this.agent.surname,
+                    name: this.agent.name,
+                    surname: this.agent.surname,
+                  }
+                  localStorage.setItem('person', JSON.stringify(newPerson))
+                  this.$router.go()
+                }
+              })
+              .catch((err) => {
+                this.errorOccurred = 'ERROR'
+                this.errorMessage = 'Server Error: CONNECTION_REFUSED'
+                if (err.status) {
+                  if (err.data.message) {
+                    this.errorMessage = err.data.message
+                  } else {
+                    this.errorMessage = err
+                  }
+                }
+              })
+          } else {
+            this.updateAgent(this.agent).then(() => {
+              this.boolMessage = true
+              if (Log.getUser().role === 'Super Admin') {
+                if (
+                  this.agent.id ===
+                  JSON.parse(localStorage.getItem('person')).id
+                ) {
+                  var newPerson = {
+                    id: JSON.parse(localStorage.getItem('person')).id,
+                    email: this.agent.email,
+                    fullname: this.agent.name + ' ' + this.agent.surname,
+                    name: this.agent.name,
+                    surname: this.agent.surname,
+                  }
+                  localStorage.setItem('person', JSON.stringify(newPerson))
+                  //this.$router.go()
+                }
+                //this.$router.push('/status/userManagementPage')
+              } else {
+                var newPerson = {
+                  id: JSON.parse(localStorage.getItem('person')).id,
+                  email: this.agent.email,
+                  fullname: this.agent.name + ' ' + this.agent.surname,
+                  name: this.agent.name,
+                  surname: this.agent.surname,
+                }
+                localStorage.setItem('person', JSON.stringify(newPerson))
+                //this.$router.go()
+              }
+            })
           }
         }
+      }
+    },
+    requiredField: function (tfield) {
+      if (tfield) {
+        return true
       } else {
-        this.agent.telephone = null
+        return false
       }
-      if (this.agent.cellNumber !== '') {
-        if (this.agent.cellNumber !== null) {
-          if (!this.validPhoneNumber(this.agent.cellNumber)) {
-            this.boolError = true
-            this.errorOccurred = 'ERROR'
-            this.errorMessage =
-              'The cellphone number is not in the correct format.'
-          }
-        }
+    },
+    validEmail: function (email) {
+      var re = /(.+)@(.+){2,}\.(.+){2,}/
+      if (email) {
+        return re.test(email.toLowerCase())
       } else {
-        this.agent.cellNumber = null
+        return re.test(email)
       }
+    },
+    validPhoneNumber(number) {
+      if (number) {
+        const rx = /^\(?\d{3}\)?[-\s]?\d{3}[-\s]?\d{4}$/
+        // const rx = /^[\+]?[(]?[0-9]{3}[)]?[-\s\.]?[0-9]{3}[-\s\.]?[0-9]{4,6}$/im
+        return rx.test(String(number))
+      } else {
+        return true
+      }
+    },
+    validatePage: function () {
+      if (
+        this.agent.name &&
+        this.agent.surname &&
+        this.agent.emailAddress &&
+        this.agent.cellNumber &&
+        this.agent.user.role &&
+        this.validEmail(this.agent.emailAddress) &&
+        this.validPhoneNumber(this.agent.cellNumber) &&
+        this.validPhoneNumber(this.agent.telephone)
+      ) {
+        this.errorOccurred = ''
+        this.errorMessage = ''
+        this.boolValidationError = false
 
-      if (!this.boolError) {
-        if (
-          this.agent.user.role === 'Agent' ||
-          this.agent.user.role === 'Agency' ||
-          this.agent.user.role === 'Managing Agent'
-        ) {
-          this.updateAgent(this.agent).then(() => {
-            var newPerson = {
-              id: JSON.parse(localStorage.getItem('person')).id,
-              email: this.agent.email,
-              fullname: this.agent.name + ' ' + this.agent.surname,
-              name: this.agent.name,
-              surname: this.agent.surnmame,
-            }
-            localStorage.setItem('person', JSON.stringify(newPerson))
-            console.log(newPerson)
-            this.$router.push('/')
-          })
-        } else {
-          this.saveAgent(this.agent)
-            .then(() => {
-              if (Log.getUser().role === 'Super Admin') {
-                this.$router.push('/status/userManagementPage')
-              } else {
-                this.$router.push('/')
-              }
-            })
-            .catch((ex) => {
-              console.log(ex)
-            })
-        }
+        return true
+      } else {
+        this.nameLoad = true
+        this.surnameLoad = true
+        this.emailAddressLoadLoad = true
+        this.cellNumberLoad = true
+        this.telephoneLoad = true
+        this.userRoleLoad = true
+        this.boolValidationError = true
+        this.errorOccurred = 'ERROR'
+        this.errorMessage = 'Please check form and correct all input fields!'
+        return false
       }
     },
   },

src/components/user/updateProfileInfo.vue

                 type="text"
                 name="username"
                 class="form-control uniInput"
-                id="name"
+                id="username"
                 placeholder="Name"
                 data-rule="minlen:4"
                 data-msg="Please enter your name"
                 data-msg="Please enter your cell number"
                 v-model="individual.cellNumber"
                 v-bind:class="{
-                  'is-valid': individual.cellNumber,
+                  'is-valid':
+                    individual.cellNumber &&
+                    validPhoneNumber(individual.cellNumber),
                   'is-invalid':
-                    !requiredField(validPhoneNumber(individual.cellNumber)) &&
-                    cellNumberLoad,
+                    !requiredField(individual.cellNumber) ||
+                    (individual.cellNumber &&
+                      !validPhoneNumber(individual.cellNumber) &&
+                      cellNumberLoad),
                 }"
                 v-on:keyup="cellNumberLoad = true"
                 v-on:blur="cellNumberLoad = true"
               />
               <div class="invalid-feedback">
-                Cell Number is Required!
+                Valid Cell Number is Required!
               </div>
             </float-label>
           </div>
               <input
                 type="text"
                 class="form-control uniInput"
-                name="landline"
-                id="landline"
+                name="telephone"
+                id="telephone"
                 placeholder="Telephone Number"
-                data-msg="Please enter your landline number"
+                data-msg="Please enter your Telephone number"
                 v-model="individual.telephone"
                 v-bind:class="{
                   'is-valid':
                     individual.telephone &&
                     !validPhoneNumber(individual.telephone),
                 }"
-                v-on:keyup="landlineNumberLoad = true"
-                v-on:blur="landlineNumberLoad = true"
               />
               <div class="invalid-feedback">
                 Valid telephone number is required!!
                 <input
                   type="text"
                   class="form-control uniInput"
-                  placeholder="SPOUSE CELL NUMBER"
+                  placeholder="Spouse Cell Number"
                   data-rule="minlen:4"
                   data-msg="Please enter your spouse's cellphone number"
                   v-model="individual.spouseCellnumber"
                   v-model="individual.agencyId"
                   v-bind:class="{
                     'is-valid': individual.agencyId,
+                    'is-invalid':
+                      !requiredField(individual.agencyId) && inputAgencyLoad,
                   }"
+                  v-on:keyup="inputAgencyLoad = true"
+                  v-on:blur="inputAgencyLoad = true"
                 >
                   <option value="">Private User</option>
                   <option
       landlineNumberLoad: false,
       spouseEmailLoad: false,
       userRoleLoad: false,
+      inputAgencyLoad: false,
     }
   },
   props: {},
 
         if (
           this.individual.user.role === 'Agent' ||
-          this.individual.user.role === 'Agency'
+          this.individual.user.role === 'Agency' ||
+          this.individual.user.role === 'Managment Agent'
         ) {
           this.getAgentById(this.individual.userId)
           this.individual.agencyId = this.agent[0].agencyId
       } else {
         this.individual = this.indiv
         this.individual.email = this.indiv.emailAddress
-        console.log(this.indiv)
         this.individual.user = Log.getUser()
       }
       this.getAgencies()
     })
   },
   computed: {
-    ...mapState('timeshare', [
-      'resorts',
-      'regions',
-      'detailedRegion',
-      'seasons',
-      'result',
-      'resortBedrooms',
-      'maxSleep',
-      'bankedEntities',
-      'sellItem',
-      'agencies',
-      'agents',
-    ]),
     ...mapState('individual', ['indiv']),
     ...mapState('authentication', ['isLoggedIn', 'user']),
-    ...mapState('register', ['agent']),
+    ...mapState('register', ['agent', 'agencies']),
     ...mapGetters({
       user: 'authentication/getUser',
       person: 'authentication/getPerson',
   methods: {
     ...mapActions('individual', ['getIndividual', 'updateIndividual']),
     ...mapActions('role', ['retrieveUserRoles']),
-    ...mapActions('register', ['getAgentById', 'saveAgent']),
-    ...mapActions('timeshare', ['getAgencies']),
+    ...mapActions('register', ['getAgentById', 'getAgencies', 'saveAgent']),
     onSelectedItemItemChange(item) {
       this.currentUser = item
     },
     isAgent() {
       if (
-        this.individual.user.role.toUpperCase() === 'AGENCY' ||
-        this.individual.user.role.toUpperCase() === 'AGENT' ||
-        this.individual.user.role.toUpperCase() === 'MANAGING AGENT'
+        this.individual.user.role === 'Agency' ||
+        this.individual.user.role === 'Agent' ||
+        this.individual.user.role === 'Managing Agent'
       ) {
         return true
       } else {
               .then(() => {
                 this.boolMessage = true
                 if (Log.getUser().role === 'Super Admin') {
-                  // console.log(this.individual);
-                  // console.log(JSON.parse(localStorage.getItem("person")));
                   if (
                     this.individual.id ===
                     JSON.parse(localStorage.getItem('person')).id
                   this.$router.go()
                 }
               })
-              .catch((ex) => {
-                console.log(ex)
-                this.errorOccurred = 'ERRORHTML'
-
+              .catch((err) => {
                 this.errorOccurred = 'ERROR'
                 this.errorMessage = 'Server Error: CONNECTION_REFUSED'
-                console.log(err.status)
                 if (err.status) {
                   if (err.data.message) {
                     this.errorMessage = err.data.message
                   } else {
-                    this.errorMessage = ex
+                    this.errorMessage = err
                   }
                 }
               })
       }
     },
     validatePage: function () {
-      console.log('validatePage')
       if (
         this.individual.name &&
         this.individual.surname &&
         this.validPhoneNumber(this.individual.cellNumber) &&
         this.validPhoneNumber(this.individual.telephone)
       ) {
-        console.log('passed')
         this.errorOccurred = ''
         this.errorMessage = ''
         this.boolValidationError = false
+
         return true
       } else {
-        console.log('failed')
         this.nameLoad = true
         this.surnameLoad = true
         this.emailAddressLoadLoad = true
         this.cellNumberLoad = true
+        this.telephoneLoad = true
         this.userRoleLoad = true
         this.boolValidationError = true
         this.errorOccurred = 'ERROR'

src/main.js

 import axios from 'axios'
 import moment from 'moment'
 import App from './App.vue'
+import VueGtag from "vue-gtag";
 import router from './router'
 import store from './store'
 import * as VueGoogleMaps from 'vue2-google-maps'
 import VueCurrencyInput from 'vue-currency-input'
 import VueFloatLabel from 'vue-float-label'
 import VueCryptojs from 'vue-cryptojs'
-import VueAnalytics from 'vue-analytics'
+//import VueAnalytics from 'vue-analytics'
 import JsonExcel from 'vue-json-excel'
 import VModal from 'vue-js-modal'
 import vueFloatLabel from 'vue-float-label'
         },
     })
     //More info @ https://webdeasy.de/en/vue-analytics-en/
-Vue.use(VueAnalytics, {
-    id: 'UA-128891091-1',
-    router,
-})
+// Vue.use(VueAnalytics, {
+//     id: 'UA-128891091-1',
+//     router,
+// })
+Vue.use(VueGtag, {
+    config: {
+        id: 'G-WG43TKF30K',
+        params: {
+            send_page_view: false
+        }
+    }
+}, router)
 
 Vue.config.productionTip = false
-axios.defaults.baseURL = 'http://localhost:57260'
-    //axios.defaults.baseURL = "https://www.pvsl.co.za:86/";
+//axios.defaults.baseURL = 'http://localhost:57260'
+    axios.defaults.baseURL = 'https://www.pvsl.co.za:86/'
     //axios.defaults.baseURL = 'http://training.provision-sa.com:120/'
 
 Vue.prototype.$axios = axios

src/router/index.js

             props: true,
         },
         {
-            path: '/resort/:resortCode/:unitNumber',
+            path: '/resort/:resortCode/:weekId',
             name: 'UnitPage',
             component: UnitPage,
             props: true,

src/store/modules/timeshare/status.js

     namespaced: true,
     state: {
         statusList: [],
-        status: {},
+        singleStatus: {},
     },
     mutations: {
         setStatusList(state, list) {
             state.statusList = list
         },
-        addNewStatus(state, status) {
-            state.statusList.push(status)
+        addNewStatus(state, jsstatus) {
+            state.statusList.push(jsstatus)
         },
-        setSingleStatus(state, status) {
-            state.status = status
+        setSingleStatus(state, jsstatus) {
+            state.singleStatus = jsstatus
         },
-        deleteStatus(state, id) {
-            var index = state.statusList.findIndex((stat) => stat.id == id)
+        deleteStatus(state, jsid) {
+            var index = state.statusList.findIndex((stat) => stat.id == jsid)
             state.statusList.splice(index, 1)
         },
         clearStatus(state) {
-            state.status = {
+            state.singleStatus = {
                 code: '',
                 description: '',
             }

src/store/modules/timeshare/timeshare.js

         filterStore(state, input) {
             state.timeshareFilter = input
         },
-        setAgency(state, agencies) {
-            state.agencies = agencies
+        setAgency(state, jstimesharetype) {
+            state.agencies = jstimesharetype
         },
-        setAgent(state, agents) {
-            state.agents = agents
+        setAgent(state, jstimesharetype) {
+            state.agents = jstimesharetype
         },
-        setSeason(state, seasons) {
-            state.seasons = seasons
+        setSeason(state, jstimesharetype) {
+            state.seasons = jstimesharetype
         },
-        setResortBedrooms(state, resortBedrooms) {
-            state.resortBedrooms = resortBedrooms
+        setResortBedrooms(state, jstimesharetype) {
+            state.resortBedrooms = jstimesharetype
         },
-        setMaxSleep(state, maxSleep) {
-            state.maxSleep = maxSleep
+        setMaxSleep(state, jstimesharetype) {
+            state.maxSleep = jstimesharetype
         },
-        setBankedEntities(state, bankedEntities) {
-            state.bankedEntities = bankedEntities
+        setBankedEntities(state, jstimesharetype) {
+            state.bankedEntities = jstimesharetype
         },
-        addResort(state, resorts) {
-            state.resorts = resorts
+        addResort(state, jstimesharetype) {
+            state.resorts = jstimesharetype
         },
-        addRegion(state, regions) {
-            state.regions = regions
+        addRegion(state, jstimesharetype) {
+            state.regions = jstimesharetype
         },
-        addDetailedRegion(state, detailedRegion) {
-            state.detailedRegion.push(detailedRegion)
+        addDetailedRegion(state, jstimesharetype) {
+            state.detailedRegion.push(jstimesharetype)
         },
         changeResort(state, resort) {
             for (const reg in state.detailedRegion) {

src/store/modules/timeshare/weekList.js

     namespaced: true,
     state: {
         weeks: [],
+        week: {},
         status: undefined,
         filter: {
             season: undefined,
         onError(state) {
             state.status = 'Error occurred getting data.'
         },
-        onClearFilter(state, filter) {
-            state.filter[filter] = undefined
+        onClearFilter(state, jsfilter) {
+            state.filter[jsfilter] = undefined
         },
-        setWeeks(state, weeks) {
-            state.weeks = weeks
+        setWeeks(state, jsweeks) {
+            state.weeks = jsweeks
             state.status = ''
         },
-        addWeek(state, week) {
-            state.weeks.push(week)
+        setWeek(state, jsweek) {
+            state.week = jsweek
         },
-        applyResort(state, resort) {
-            state.filter.resort = resort
+        addWeek(state, jsweek) {
+            state.weeks.push(jsweek)
+        },
+        applyResort(state, jsresort) {
+            state.filter.resort = jsresort
         },
     },
     getters: {
             return rootGetters['timeshare/getRegionCode']('KK')
         },
         weekById(state) {
-            return (resortCode, unitNumber) => {
-                const w = state.weeks.find(
-                    (week) =>
-                    week.resort !== undefined &&
-                    week.resort.resortCode === resortCode &&
-                    week.unitNumber === unitNumber,
-                )
-                console.log(resortCode, unitNumber)
-
+            return (week) => {
+                const w = state.weeks.find((week) => week.id === weekId)
                 if (w) {
                     return w
                 }
                 .get('/api/timeshareweek/getByResortCode/' + resortCode)
                 .then((result) => {
                     commit('setWeeks', result.data)
-                    console.log(result)
                 })
         },
         async getWeeks({ commit, rootGetters }) {
                         if (myItem !== undefined) {
                             const code = myItem.resort.resortCode
                             myItem.region = {
-                                regionName: rootGetters['timeshare/getRegionCode'](code),
+                                regionName: rootGetters['timeshare/getRegionCode'](this.code),
                             }
                             myItem.resort = {
-                                resortName: rootGetters['timeshare/getResortName'](code),
-                                resortCode: code,
+                                resortName: rootGetters['timeshare/getResortName'](this.code),
+                                resortCode: this.code,
                             }
                         }
                     }
-
-                    console.log(code)
-                        //console.log(arr3)
                     commit('setWeeks', arr2)
                 })
                 .catch(console.error)
         },
-        // getWeeks({ commit }) {
-        //   axios.get("api/timeshareweek").then(result =>
-        //     commit(
-        //       "setWeeks",
-        //       result.data.filter(x => x.region !== null)
-        //     )
-        //   );
-        // },
+        async getWeek({ commit }, jsweekId) {
+            commit('onLoading')
+            await axios.get('/api/timeshareweek/' + jsweekId).then((result) => {
+                commit('setWeek', result.data)
+            })
+        },
+
         clearFilter({ commit }, filter) {
             commit('onClearFilter', filter)
         },

src/store/modules/user/register.js

         },
     },
     mutations: {
-        setIndividual(state, type) {
-            state.registerIndividual = type
+        setIndividual(state, jsregistertype) {
+            state.registerIndividual = jsregistertype
         },
-        setIndividuals(state, type) {
-            state.individuals = type
+        setIndividuals(state, jsregistertype) {
+            state.individuals = jsregistertype
         },
-        setAgents(state, type) {
-            state.agents = type
+        setAgents(state, jsregistertype) {
+            state.agents = jsregistertype
         },
-        setSingleAgent(state, agent) {
-            state.agent = agent
+        setSingleAgent(state, jsregistertype) {
+            state.agent = jsregistertype
         },
-        setAgencies(state, type) {
-            state.agencies = type
+        setAgencies(state, jsregistertype) {
+            state.agencies = jsregistertype
         },
-        setAgency(state, type) {
-            state.registerAgency = type
+        setAgency(state, jsregistertype) {
+            state.registerAgency = jsregistertype
         },
-        addIndividual(state, type) {
-            state.registerIndividual = type
+        addIndividual(state, jsregistertype) {
+            state.registerIndividual = jsregistertype
         },
-        addAgency(state, type) {
-            state.registerAgency = type
+        addAgency(state, jsregistertype) {
+            state.registerAgency = jsregistertype
         },
-        addAgent(state, type) {
-            state.registerIndividual = type
+        addAgent(state, jsregistertype) {
+            state.registerIndividual = jsregistertype
         },
-        updateIndividual(state, type) {
-            state.registerIndividual.find((item) => item.id === type.id).username =
-                type.username
-            state.registerIndividual.find((item) => item.id === type.id).password =
-                type.password
+        updateIndividual(state, jsregistertype) {
+            state.registerIndividual.find(
+                (item) => item.id === jsregistertype.id,
+            ).username = type.username
+            state.registerIndividual.find(
+                (item) => item.id === jsregistertype.id,
+            ).password = type.password
         },
-        updateAgency(state, type) {
-            state.registerAgency.find((item) => item.id === type.id).eaabeffcNumber =
-                type.eaabeffcNumber
+        updateAgency(state, jsregistertype) {
             state.registerAgency.find(
-                (item) => item.id === type.id,
-            ).companyRegNumber = type.companyRegNumber
+                (item) => item.id === jsregistertype.id,
+            ).eaabeffcNumber = jsregistertype.eaabeffcNumber
+            state.registerAgency.find(
+                (item) => item.id === jsregistertype.id,
+            ).companyRegNumber = jsregistertype.companyRegNumber
+        },
+        agentUpdate(state, jsregistertype) {
+            var index
+            var count = 0
+            state.agents.forEach((item) => {
+                if (item.id === jsregistertype.id) {
+                    index = count
+                }
+                count++
+            })
+            Object.assign(state.agents[index], jsregistertype)
         },
         clearIndividual(state) {
             state.registerIndividual = {
                 surname: '',
                 email: '',
                 cellNumber: '',
+                telephone: '',
                 username: '',
                 password: '',
                 acceptedTerms: false,
             axios
                 .get('/api/agent')
                 .then((result) => {
-                    //console.log('Agents')
-                    //console.log(result)
                     commit('setAgents', result.data)
                 })
                 .catch(console.error)
             await axios
                 .get('/api/agent/single/' + userId)
                 .then((result) => {
-                    console.log(result)
-                    commit('setSingleAgent', result.data)
+                    commit('setSingleAgent', result.data[0])
                 })
                 .catch((e) => {
                     console.log(e)
             axios
                 .get('/api/agency')
                 .then((result) => {
-                    //console.log('Agencies')
-                    //console.log(result)
                     commit('setAgencies', result.data)
                 })
                 .catch(console.error)
                     return promise.resolve()
                 })
                 .catch((ex) => {
-                    //console.log(ex.response)
                     return promise.reject(ex.response)
-                        //console.error;
                 })
         },
         async saveAgency({ commit }, item) {
                 .post('/api/register/registeragency', item)
                 .then((res) => {
                     commit('addAgency', res.data)
-                    console.log(promise.resolve())
-                    console.log('Agency Added')
                     return promise.resolve()
                 })
                 .catch((ex) => {
-                    console.log('regAgency API failed')
-                        //console.log(ex.response)
                     return promise.reject(ex.response)
                 })
         },
         async updateIndividual({ commit }, userParam) {
             await axios
                 .put('/api/user/', userParam)
-                .then((result) => console.log(result))
+                .then((result) => {})
                 .catch(console.error)
         },
         updateAgency({ commit }, item) {
                 .then((result) => commit('updateAgency', item))
                 .catch(console.error)
         },
+        async updateAgent({ commit }, agent) {
+            await axios
+                .put('/api/agent', agent)
+                .then((result) => {
+                    commit('updateAgent', result.data)
+                })
+                .catch((ex) => {
+                    console.log(ex)
+                })
+        },
         // clearIndividual({
         //   commit,
         // }) {

vue.config.js

     devServer: {
         proxy: {
             '/api': {
-                target: 'http://localhost:57260/',
+                //target: 'http://localhost:57260/',
                 //target: 'http://training.provision-sa.com:120/',
-                //target: "https://www.pvsl.co.za:86/",
+                target: 'https://www.pvsl.co.za:86/',
                 changeOrigin: true,
             },
             '/nph-srep': {