Feedback Updates

src/components/admin/status/editTimeShareAdminPage.vue

                   <div class="validation"></div>
                 </div>
                 <div class="form-group col-md-6 mt-2">
-                  <label v-if="!week.askingPrice" for="tsaPrice" class="uniSelectLabel"
+                  <label v-if="week.askingPrice > 0" for="tsaPrice" class="uniSelectLabel"
                     >ASKING PRICE</label
                   >
                   <float-label label="ASKING PRICE">
                 </div>
               </div>
             </div>
-            <div class="section-header">
-              <h2>Publish Timeshare Week</h2>
-            </div>
-            <div class="form">
-              <div class="row">
-                <div class="form-group col-md-6">
-                  <label v-if="!weekParam.weekStatus" class="uniSelectLabel" for="status"
-                    >STATUS</label
-                  >
-                  <float-label label="STATUS" fixed>
-                    <select
-                      class="form-control uniSelect"
-                      name="status"
-                      id="status"
-                      v-model="weekParam.weekStatus"
+            <div v-if="!boolAwaitingPayment">
+              <div class="section-header">
+                <h2>Publish Timeshare Week</h2>
+              </div>
+              <div class="form">
+                <div class="row">
+                  <div class="form-group col-md-6">
+                    <label v-if="!weekParam.weekStatus" class="uniSelectLabel" for="status"
+                      >STATUS</label
                     >
-                      <option :key="0">For Sale</option>
-                      <option :key="1">Sold</option>
-                    </select>
-                  </float-label>
+                    <float-label label="STATUS" fixed>
+                      <select
+                        class="form-control uniSelect"
+                        name="status"
+                        id="status"
+                        v-model="weekParam.status.id"
+                      >
+                        <option :key="status.id" :value="status.id" v-for="status in statusList">{{
+                          status.description
+                        }}</option>
+                      </select>
+                    </float-label>
+                  </div>
+                  <div class="form-group col-md-6">
+                    <float-label label="Publish" fixed>
+                      <select
+                        class="form-control uniSelect"
+                        name="publish"
+                        id="publish"
+                        v-model="weekParam.publish"
+                      >
+                        <option :key="0" :value="false">No</option>
+                        <option :key="1" :value="true">Yes</option>
+                      </select>
+                    </float-label>
+                  </div>
+                  <div class="form-group col-md-6 mt-2">
+                    <float-label label="DATE PUBLISHED" fixed>
+                      <input
+                        type="date"
+                        class="form-control"
+                        name="publishDate"
+                        v-model="pubDateParam"
+                      />
+                    </float-label>
+
+                    <div class="validation"></div>
+                  </div>
                 </div>
-                <div class="form-group col-md-6">
-                  <float-label label="Publish" fixed>
-                    <select
-                      class="form-control uniSelect"
-                      name="publish"
-                      id="publish"
-                      v-model="weekParam.publish"
-                    >
-                      <option :key="0" :value="false">No</option>
-                      <option :key="1" :value="true">Yes</option>
-                    </select>
-                  </float-label>
+              </div>
+              <div class="row">
+                <div class="text-center col-6">
+                  <button class="btn-solid-blue" v-on:click="saveEdit()">Save</button>
                 </div>
-                <div class="form-group col-md-6 mt-2">
-                  <float-label label="DATE PUBLISHED" fixed>
-                    <input
-                      type="date"
-                      class="form-control"
-                      name="publishDate"
-                      v-model="pubDateParam"
-                    />
-                  </float-label>
-
-                  <div class="validation"></div>
+                <div class="text-center col-6">
+                  <button class="btn-solid-blue" v-on:click="backToListView()">Back</button>
                 </div>
               </div>
             </div>
-            <div class="row">
-              <div class="text-center col-6">
-                <button class="btn-solid-blue" v-on:click="saveEdit()">Save</button>
-              </div>
-              <div class="text-center col-6">
-                <button class="btn-solid-blue" v-on:click="backToListView()">Back</button>
+            <div v-else>
+              <div class="row">
+                <div class="text-center col-6">
+                  <button class="btn-solid-blue" v-on:click="paygateRedirect()">
+                    MAKE PAYMENT
+                  </button>
+                </div>
               </div>
             </div>
           </div>
       selectedPublish: {},
       dateParam: {},
       depDateParam: {},
-      pubDateParam: {}
+      pubDateParam: {},
+      boolAwaitingPayment: false
     };
   },
   components: {
     Alert
   },
   async mounted() {
+    this.getStatusList();
     this.getWeek(this.weekParam.id).then(() => {
       this.wait = false;
     });
     this.depDateParam = depDate;
     var datePub = new Date(this.weekParam.pulbishedDate).toISOString().substring(0, 10);
     this.pubDateParam = datePub;
+    if (this.weekParam.status.description === "Awaiting Payment") {
+      if (this.ROLE !== "Super Admin") {
+        this.boolAwaitingPayment = true;
+      }
+    }
   },
   created() {
     this.initTimeshare(this.weekId);
     ...mapState("individual", ["indiv"]),
     ...mapState("authentication", ["isLoggedIn"]),
     ...mapState("myWeeks", ["items", "week"]),
+    ...mapState("status", ["statusList"]),
     ...mapGetters({
       user: "authentication/getUser",
       person: "authentication/getPerson"
     }),
     ...mapState("bank", ["banks"]),
+    ...mapGetters("fees", ["getListingFee"]),
     refAgent() {
       return this.sellItem && this.sellItem.referedByAgent;
     },
+    ROLE() {
+      var userObj = JSON.parse(localStorage.getItem("user"));
+      return userObj.role;
+    },
     filteredResort() {
       let list = [];
       if (this.week && this.week.region && this.selectedRegion) {
     ...mapActions("payment", ["addPayment"]),
     ...mapActions("bank", ["getBanks"]),
     ...mapActions("myWeeks", ["getItems", "getWeek", "editSave"]),
+    ...mapActions("status", ["getStatusList"]),
     newSale() {
       this.weekId = 0;
       this.getBlankWeek();
       delete this.weekParam.owner.howMarried;
       delete this.weekParam.cellNumber;
       //console.log(JSON.stringify(this.weekParam));
+      //console.log(this.weekParam);
       this.editSave(this.weekParam).then(() => {
         this.backToListView();
       });
     },
     backToListView() {
       this.$router.push("/status/timeshareAdmin");
+    },
+    paygateRedirect() {
+      var amount = this.getListingFee.amount;
+      var paymentObj = {
+        timeshareWeekId: this.weekParam.id, // this.sellItem.Id,
+        propertyId: 0,
+        creatydById: Log.getUser().id, //Log.getUser().id,
+        amount: amount,
+        paymentStatus: "",
+        paymentToken: ""
+      };
+
+      this.addPayment(paymentObj).then(res => {
+        this.$router.push({
+          name: "PaymentGateway",
+          params: {
+            paymentReqId: res.PAY_REQUEST_ID,
+            checksum: res.CHECKSUM
+          }
+        });
+      });
     }
   }
 };

src/components/admin/status/statusEdit.vue

+<template>
+  <main id="main" style="margin-top:200px; padding-bottom:50px">
+    <div class="container">
+      <div class="row">
+        <div class="col">
+          <div class="section-header">
+            <h2>New Status</h2>
+          </div>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col">
+          <float-label>
+            <input
+              type="text"
+              placeholder="CODE"
+              v-model="singleStatus.code"
+              class="form-control uniInput"
+            />
+          </float-label>
+        </div>
+        <div class="col">
+          <float-label>
+            <input
+              type="text"
+              placeholder="DESCRIPTION"
+              v-model="singleStatus.description"
+              class="form-control uniInput"
+            />
+          </float-label>
+        </div>
+      </div>
+      <div class="row mt-4">
+        <div class="col">
+          <button class="btn-solid-blue" @click="pushToApi()">EDIT</button>
+        </div>
+        <div class="col">
+          <router-link class="btn-solid-blue" to="/status/list">BACK</router-link>
+        </div>
+      </div>
+    </div>
+  </main>
+</template>
+
+<script>
+/* eslint-disable */
+import { mapActions, mapState } from "vuex";
+
+export default {
+  data() {
+    return {
+      status: {}
+    };
+  },
+  created() {
+    this.getSingleStatus(this.$route.params.id);
+  },
+  computed: {
+    ...mapState("status", ["singleStatus"])
+  },
+  methods: {
+    ...mapActions("status", ["updateStatus", "getSingleStatus"]),
+    pushToApi() {
+      this.updateStatus(this.singleStatus).then(this.$router.push("/status/list"));
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

src/components/admin/status/statusNew.vue

+<template>
+  <main id="main" style="margin-top:200px; padding-bottom:50px">
+    <div class="container">
+      <div class="row">
+        <div class="col">
+          <div class="section-header">
+            <h2>New Status</h2>
+          </div>
+        </div>
+      </div>
+      <div class="row">
+        <div class="col">
+          <float-label>
+            <input
+              type="text"
+              placeholder="CODE"
+              v-model="status.code"
+              class="form-control uniInput"
+            />
+          </float-label>
+        </div>
+        <div class="col">
+          <float-label>
+            <input
+              type="text"
+              placeholder="DESCRIPTION"
+              v-model="status.description"
+              class="form-control uniInput"
+            />
+          </float-label>
+        </div>
+      </div>
+      <div class="row mt-4">
+        <div class="col">
+          <button class="btn-solid-blue" @click="pushToApi()">SAVE</button>
+        </div>
+        <div class="col">
+          <router-link class="btn-solid-blue" to="/status/list">BACK</router-link>
+        </div>
+      </div>
+    </div>
+  </main>
+</template>
+
+<script>
+import { mapActions } from "vuex";
+/* eslint-disable */
+export default {
+  data() {
+    return {
+      status: {}
+    };
+  },
+  methods: {
+    ...mapActions("status", ["createNewStatus"]),
+    pushToApi() {
+      this.createNewStatus(this.status).then(this.$router.push("/status/list"));
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

src/components/admin/status/statusPage.vue

       </div>
     </div>
     <div v-if="checkAccess" class="container">
-      <ListView :items="statusList" :columnCount="4" :compact="false" :showNew="false" />
+      <ListView
+        :items="statusList"
+        :showColumnChooser="false"
+        :columnCount="4"
+        :hideSearch="true"
+        :compact="false"
+        :showNew="true"
+        :editable="true"
+        :deleteable="true"
+        @onEdit="Edit"
+        @onDelete="Delete"
+        @onNew="New"
+      />
     </div>
     <div v-else>
       <alert :text="'You don\'t have permission to view this page'" :type="'ERROR'" />
     }
   },
   methods: {
-    ...mapActions("status", ["getStatusList"])
+    ...mapActions("status", ["getStatusList", "deleteStatus"]),
+    New() {
+      this.$router.push("/status/new");
+    },
+    Edit(item) {
+      this.$router.push({
+        path: `/status/Edit/${item.id}`
+      });
+    },
+    Delete(item) {
+      this.deleteStatus(item.id);
+    }
   }
 };
 </script>

src/components/admin/status/timeshareAdminList.vue

                 <td>{{ item.region.regionName }}</td>
                 <td>{{ item.sellPrice | toCurrency }}</td>
                 <td>{{ item.pulbishedDate | toDate }}</td>
-                <td>{{ item.weekStatus }}</td>
+                <td>{{ item.status.description }}</td>
                 <td v-if="!item.publish">
                   <a v-on:click="Publish(item)">
                     <img src="../../../../public/img/icons/Upload.png" height="25" width="25" />
   },
   methods: {
     ...mapActions("myWeeks", ["getAllItems"]),
-    ...mapActions("myWeeks", ["getItems", "verifyWeek", "editSave"]),
+    ...mapActions("myWeeks", ["getItems", "verifyWeek", "editSave", "publishOnly"]),
     Publish(item) {
       var today = new Date();
       var dd = String(today.getDate()).padStart(2, "0");
       var yyyy = today.getFullYear();
       item.pulbishedDate = today.toISOString().substring(0, 19);
       item.publish = true;
-      item.owner = {
-        name: item.owner
-      };
-      item.agent = {
-        name: item.agent
-      };
+      item.status.id = 26;
+      item.status.code = "FS";
+      item.status.description = "For Sale";
+      item.status.statusType = true;
       console.log(JSON.stringify(item));
-      this.editSave(item);
+      this.publishOnly(item);
     },
     Unpublish(item) {
       item.publish = false;
-      item.owner = {
-        name: item.owner
-      };
-      item.agent = {
-        name: item.agent
-      };
+
       console.log(item);
-      this.editSave(item);
+      this.publishOnly(item);
     },
     Edit(item) {
       this.$router.push({ name: "EditTimeshare", params: { weekParam: item } });

src/components/financial/OrderThankYou.vue

         <div class="col-md-6">
           <div class="intro-content box text-center">
             <h2>Thank you!</h2>
-            <p>Your payment has been received and your propery will be listed</p>
+            <p>Your payment has been received and your property will be listed</p>
           </div>
         </div>
       </div>

src/components/financial/paymentError.vue

+<template>
+  <section id="intro">
+    <div class="container">
+      <div class="row">
+        <div class="col-md-6">
+          <div class="intro-content box text-center">
+            <h2 style="color:black">Error!</h2>
+            <p style="color:black">An error has occcured with your payment.</p>
+            <p style="color:black">Error: {{ payment[0].paymentStatus }}</p>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <carousel
+      :nav="false"
+      :dots="false"
+      :items="1"
+      :autoplay="true"
+      :loop="true"
+      :autoHeight="true"
+      id="intro-carousel"
+      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="" />
+      <img class="item" src="/img/intro-carousel/comm-1.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/comm-4.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/3.jpg" alt="" />
+      <img class="item" src="/img/intro-carousel/home-5.jpg" alt="" />
+    </carousel>
+  </section>
+</template>
+
+<script>
+/* eslint-disable */
+import carousel from "vue-owl-carousel";
+import { mapActions, mapState } from "vuex";
+export default {
+  components: {
+    carousel
+  },
+  data() {
+    return {
+      boolLoaded: false
+    };
+  },
+  created() {
+    this.getPayment(this.$route.params.id);
+  },
+  computed: {
+    ...mapState("payment", ["payment"])
+  },
+  methods: {
+    ...mapActions("payment", ["getPayment"])
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+.box {
+  background-color: rgba(255, 67, 67, 0.6) !important;
+}
+</style>

src/components/financial/payments.vue

       </div>
       <div v-if="checkAccess" class="row">
         <div class="col">
-          <listView
-            :items="payments"
-            :showNew="false"
-            :editable="true"
-            :deleteable="true"
-            @onEdit="Edit"
-            @onDelete="Delete"
-          />
+          <listView :items="payments" :showNew="false" @onEdit="Edit" @onDelete="Delete" />
         </div>
       </div>
       <div v-else class="row">
     };
   },
   methods: {
-    ...mapActions("Payment", ["getPayments"])
+    ...mapActions("payment", ["getPayments"])
   },
   mounted() {
-    this.getProperties(Object.assign(this.user.id));
+    this.getPayments();
   },
   computed: {
-    ...mapState("Payment", ["payments"]),
+    ...mapState("payment", ["payments"]),
     UserChanged() {
       this.getProperties(Object.assign(this.user.id));
       return this.user;

src/components/shared/navBar.vue

                   <a href="#">
                     <i class="fa fa-youtube"></i>
                   </a>
-                  <a href="tel:0123456789">
+                  <a href="tel:012 941 8497">
                     <i class="fa fa-phone"></i>
-                    <span class="phoneIconDetail">+27 (0) 12 492 1238</span>
+                    <span class="phoneIconDetail">+27 (0)12 941 8497</span>
                   </a>
                   <a href="#" data-toggle="modal" data-target="#bondcal">
                     <i class="fa fa-calculator" aria-hidden="true"></i>

src/components/timeshare/buy/weekListComponent.vue

             <td>{{ item.season }}</td>
             <td>{{ item.weekType }}</td>
             <td>{{ item.sellPrice | toCurrency }}</td>
-            <td v-if="item.status">{{ item.status.display }}</td>
-            <td v-else></td>
+            <td v-if="item.status">{{ item.status.description }}</td>
             <!-- <td>{{ item.region ? item.region.regionName : "" }}</td>
             <td>{{ item.resort ? item.resort.resortName : "" }}</td>
 
       getRegions: "weekList/getRegions"
     }),
     DisplayItems() {
-      const list = this.filteredWeeks;
+      const list = [];
+      this.filteredWeeks.forEach(week => {
+        if (week.publish) {
+          list.push(week);
+        }
+      });
+
       const startSlice = (this.currentPage - 1) * this.visibleItemsPerPageCount;
       let endSlice = this.currentPage * this.visibleItemsPerPageCount;
       if (endSlice > list.length) {

src/router/index.js

 import Contact from "../components/shared/contact.vue";
 
 import Status from "../components/admin/status/statusPage.vue";
+import StatusNew from '../components/admin/status/statusNew.vue'
+import StatusEdit from '../components/admin/status/statusEdit.vue'
+
 import timeshareAdminPage from "../components/admin/status/timeshareAdminPage.vue";
 import tenderWeekAdminPage from "../components/admin/status/tenderWeekAdminPage.vue";
 import userManagementPage from "../components/admin/status/userManagementPage.vue";
 import PaymentGateway from "../components/financial/paygate/paygateProcess.vue";
 import Payments from "../components/financial/payments.vue";
 import PaymentSuccess from "../components/financial/OrderThankYou.vue";
+import PaymentError from '../components/financial/paymentError.vue'
 
 import LandingPages from "../components/marketing/landingPages.vue";
 import LandingPage from "../components/marketing/landingPage.vue";
       name: "PaymentSuccess",
       component: PaymentSuccess
     },
+    {
+      path: "/payments/error/:id",
+      name: "PaymentError",
+      component: PaymentError
+    },
     {
       path: "/payments",
       name: "Payments",
       name: "emailRecipientEdit",
       component: EmailRecipientEdit,
     },
+    {
+      path: "/status/new",
+      name: "statusNew",
+      component: StatusNew,
+    },
+    {
+      path: "/status/Edit/:id",
+      name: "statusEdit",
+      component: StatusEdit,
+    },
   ]
 });

src/store/modules/timeshare/myWeeks.js

   },
   getters: {
     getNeedsVerify(state) {
-      return _.filter(state.items, x => x.status && x.status.code === "A1");
+      return state.items
     }
     // removeListing(state, id) {
     //   state.myWeeks.pop(state.myWeeks.find(w => w.id === id));
         })
         .catch(console.error);
     },
+    async publishOnly({ commit }, week) {
+      await axios
+        .put(`/api/timeshareweek/publishOnly`, week)
+        .then(r => {
+          commit("setItem", week);
+        })
+        .catch(console.error);
+    },
     async editSave({ commit }, week) {
       await axios
         .put(`/api/timeshareweek`, week)

src/store/modules/timeshare/status.js

+/* eslint-disable */
 import axios from 'axios';
 
 export default {
   namespaced: true,
   state: {
     statusList: [],
+    singleStatus: {}
   },
   mutations: {
     setStatusList(state, list) {
       state.statusList = list;
     },
+    addNewStatus(state, status){
+      state.statusList.push(status)
+    },
+    setSingleStatus(state, status){
+      state.singleStatus = status
+    },
+    deleteStatus(state, id){
+      var index = state.statusList.findIndex((stat) => stat.id == id)
+      state.statusList.splice(index, 1)
+    }
   },
   getters: {},
   actions: {
         .then(result => commit('setStatusList', result.data))
         .catch(console.error);
     },
+    async getSingleStatus({commit}, id){
+      await axios.get('/api/status/'+ id)
+      .then((result) => {
+        commit("setSingleStatus", result.data[0])
+      })
+      .catch((e) => {
+        console.log(e);
+      })
+    },
+    async createNewStatus({commit}, status){
+      await axios.post("/api/status", status)
+      .then((result) => {
+        commit("addNewStatus", result.data)
+      })
+      .catch((e) => {
+        console.log(e);
+      })
+    },
+    async updateStatus({commit}, status){
+      await axios.put("/api/status", status)
+      .then((result) => {
+        
+      })
+      .catch((e) => {
+        console.log(e);
+      })
+    },
+    async deleteStatus({commit}, id){
+      await axios.delete('/api/status/'+id)
+      .then(() => {
+        commit("deleteStatus", id)
+      })
+    }
   },
 };