Timeshare chages to Vuex

Added Proxy file

package.json

@@ -9,6 +9,7 @@
     "lint": "vue-cli-service lint"
   },
   "dependencies": {
+    "@nuxtjs/axios": "^5.6.0",
     "animate.css": "^3.7.2",
     "axios": "^0.19.0",
     "core-js": "^2.6.5",
@@ -33,4 +34,4 @@
     "vue-cli-plugin-vuetify": "^0.5.0",
     "vue-template-compiler": "^2.6.10"
   }
-}
+}

src/components/misc/contactUs.vue

@@ -22,6 +22,7 @@
       <br />
       <br />
     </div>
+
     <div class="row mb-8">
       <div class="col-md-6">
         <form action="mailto:info@univateproperties.co.za" method="post" enctype="text/plain">

src/components/timeshare/sell/sellPage.vue

@@ -14,6 +14,7 @@
         <hr />
       </div>
     </div>
+    <div v-for="(item, i) in unitConfigurationList" :key="i">{{item}}</div>
     <div class="row mb-4">
       <div class="col-md-12">
         <form
@@ -89,15 +90,7 @@
               <label for="Region"></label>
               <select class="form-control" name="region" id="region">
                 <option value>Please select Region</option>
-                <option value="gauteng">Gauteng</option>
-                <option value="Kwazulu Natal">Kwazulu Natal</option>
-                <option value="mpumalanga">Mpumalanga</option>
-                <option value="north west">North West</option>
-                <option value="free state">Free State</option>
-                <option value="eastern cape">Eastern Cape</option>
-                <option value="western cape">Western Cape</option>
-                <option value="northern cape">Northern Cape</option>
-                <option value="limpopo">Limpopo</option>
+                <option v-for="(region, r) in regions" :key="r">{{region.regionName}}</option>
               </select>
             </div>
             <div class="col-md-6">
@@ -385,35 +378,36 @@
   </div>
 </template>
 <script>
-import { mapState, mapActions } from "vuex";
+import { mapState, mapActions } from 'vuex';
 
 export default {
-  name: "TimeshareToSell",
+  name: 'TimeshareToSell',
   created() {
     this.initTimeshare();
   },
   computed: {
-    ...mapState("timeshare", [
-      "resorts",
-      "regions",
-      "detailedRegion",
-      "seasons",
-      "resortBedrooms",
-      "maxBedrooms",
-      "bankedEntities",
-      "sellItem",
-      "agencies",
-      "agents"
+    ...mapState('timeshare', [
+      'resorts',
+      'regions',
+      'detailedRegion',
+      'seasons',
+      'unitConfigurationList',
+      'resortBedrooms',
+      'maxBedrooms',
+      'bankedEntities',
+      'sellItem',
+      'agencies',
+      'agents',
     ]),
     refAgent() {
       return this.sellItem && this.sellItem.referedByAgent;
-    }
+    },
   },
   methods: {
     changeRef() {
       this.sellItem.referedByAgent = !this.sellItem.referedByAgent;
     },
-    ...mapActions("timeshare", ["initTimeshare"])
-  }
+    ...mapActions('timeshare', ['initTimeshare']),
+  },
 };
 </script>

src/store/modules/timeshare/status.js

@@ -13,7 +13,7 @@ export default {
   getters: {},
   actions: {
     getStatusList({
-      commit,
+      commit
     }) {
       axios.get('http://localhost:57260/api/status')
         .then(result => commit('setStatusList', result.data))

src/store/modules/timeshare/timeshare.js

@@ -10,6 +10,7 @@ export default {
     regions: [],
     detailedRegion: [],
     seasons: [],
+    unitConfigurationList: [],
     resortBedrooms: [],
     maxBedrooms: [],
     bankedEntities: [],
@@ -38,6 +39,9 @@ export default {
     },
   },
   mutations: {
+    setUnitConfigurationList(state, list) {
+      state.unitConfigurationList = list;
+    },
     setAgency(state, agencies) {
       state.agencies = agencies;
     },
@@ -77,12 +81,23 @@ export default {
       commit('setResortBedrooms', MyData.resortBedrooms);
       commit('setMaxBedrooms', MyData.maxBedrooms);
       commit('setBankedEntities', MyData.bankedEntities);
+      dispatch('getUnitConfigurationList');
       dispatch('getSeason');
       dispatch('getAgents');
       dispatch('getAgencies');
       dispatch('getResorts');
       dispatch('getRegions');
     },
+    getUnitConfigurationList({
+      commit,
+      state,
+    }) {
+      console.log(111);
+      axios.get('/api/unitConfiguration')
+        .then(result => commit('setUnitConfigurationList', result.data))
+        .catch(console.error);
+      console.log(state.unitConfigurationList);
+    },
     getSeasons({
       commit,
     }) {

vue.config.js

@@ -0,0 +1,10 @@
+module.exports = {
+  devServer: {
+    proxy: {
+      '/api': {
+        target: 'http://localhost:57260',
+        changeOrigin: true,
+      },
+    },
+  },
+};