Payment Option

src/components/admin/status/editTimeShareAdminPage.vue

               </div>
               <div class="row">
                 <div class="text-center col-6">
-                  <button class="btn-solid-blue" v-on:click="saveEdit()">Save</button>
+                  <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>
+                  <button class="btn-solid-blue" v-on:click="backToListView()">BACK</button>
                 </div>
               </div>
             </div>

src/components/financial/paymentOption.vue

+<template>
+  <section id="intro">
+    <div class="container">
+      <div class="row">
+        <div class="col-md-6">
+          <div class="intro-content box text-center">
+            <h2>Payment Option</h2>
+            <select name="" id="" v-model="selectedOption" class="uniSelect form-control">
+              <option value="CC">Credit/Debit Card</option>
+              <option value="EFT">EFT</option>
+            </select>
+            <button class="btn-solid-blue mt-5" @click="pushToApi()">Continue</button>
+          </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 { mapState, mapActions, mapGetters } from "vuex";
+import carousel from "vue-owl-carousel";
+import Log from "../../assets/Log";
+export default {
+  components: {
+    carousel
+  },
+  props: {
+    week: {}
+  },
+  data() {
+    return {
+      boolLoaded: false,
+      selectedOption: "CC"
+    };
+  },
+  computed: {
+    ...mapGetters("fees", ["getListingFee"])
+  },
+  methods: {
+    ...mapActions("payment", ["addPayment"]),
+    ...mapActions("myWeeks", ["editSave"]),
+    pushToApi() {
+      if (this.selectedOption == "CC") {
+        this.paygateRedirect();
+      } else {
+        this.week.statusId = 1033; // change this value to link with status
+        if (this.week.owner.telephone === "") {
+          delete this.week.owner.telephone;
+        }
+        console.log(JSON.stringify(this.week));
+        this.editSave(this.week).then(ex => {
+          console.log("It was here");
+        });
+      }
+    },
+    paygateRedirect() {
+      var amount = this.getListingFee.amount;
+      var paymentObj = {
+        timeshareWeekId: this.week.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
+          }
+        });
+      });
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

src/components/shared/navBar.vue

                         </ul>
                       </li> -->
                       <hr />
-                      <li>
+                      <li v-if="ROLE === 'Super Admin'">
                         <router-link to="/Offers">Offers</router-link>
                       </li>
                       <!-- <li v-if="ROLE === 'Super Admin'">

src/components/timeshare/sell/contentSection.vue

                 <p class="alert myError">Please ensure that you add spouse details.</p>
               </div>
             </div>
+            <div class="form-row" v-if="profileEmailError">
+              <div class="col-md-12">
+                <p class="alert myError">
+                  Please ensure that your email is correct before adding a timeshare week.
+                </p>
+              </div>
+            </div>
             <div class="text-center col-12" v-if="CanSave">
               <button class="btn-solid-blue" v-if="!sellItem.id" @click="submitSale()">
                 SUBMIT
   data() {
     return {
       wait: false,
-      userLoggedIn: Log.isLoggedIn()
+      userLoggedIn: Log.isLoggedIn(),
+      profileEmailError: false
     };
   },
   components: {
       if (this.userLoggedIn) {
         this.sellItem.ownerObject = this.indiv;
         this.sellItem.weekStatus = "For Sale";
-        this.saveWeek(this.sellItem).then(fulfilled => {
-          this.paygateRedirect();
-        });
+        this.saveWeek(this.sellItem)
+          .then(fulfilled => {
+            console.log(fulfilled);
+            this.$router.push({ name: "PaymentOption", params: { week: fulfilled } });
+            //this.paygateRedirect();
+          })
+          .catch(ex => {
+            this.profileEmailError = true;
+          });
       } else {
         this.$router.push("/user/login");
       }

src/router/index.js

 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 PaymentError from '../components/financial/paymentError.vue';
+import PaymentOption from '../components/financial/paymentOption.vue'
 
 import LandingPages from "../components/marketing/landingPages.vue";
 import LandingPage from "../components/marketing/landingPage.vue";
       name: "statusNew",
       component: StatusNew,
     },
+    {
+      path: "/financial/paymentOption",
+      name: "PaymentOption",
+      props: route => ({
+        ...route.params
+      }),
+      component: PaymentOption,
+    },
     {
       path: "/status/Edit/:id",
       name: "statusEdit",

src/store/modules/timeshare/timeshare.js

     onResortChange({ commit }, resort) {
       commit("changeResort", resort);
     },
-    saveWeek({ commit }, week) {
-      return new Promise((resolve, reject) => {
+    async saveWeek({ commit }, week) {
+      return await new Promise((resolve, reject) => {
         axios
           .post("/api/timeshareweek", week)
           .then(result => {
             commit("setWeekDetail", result.data);
-            resolve();
+            resolve(result.data);
           })
           .catch(error => reject(new Error(error.message)));
       });