{"version":3,"sources":["webpack:///./src/views/GiftBox.vue","webpack:///src/views/GiftBox.vue","webpack:///./src/views/GiftBox.vue?f16a","webpack:///./src/views/GiftBox.vue?e697","webpack:///./src/views/GiftBox.vue?a2e8"],"names":["render","_vm","this","_c","_self","attrs","staticClass","staticRenderFns","components","StripeElements","data","formData","alternatePayment","emailFormConfirmation","checkoutDialog","loading","paymentLoading","orderID","computed","_objectSpread","mapGetters","user","userData","methods","giftForSelfClick","giftForSelf","toFullName","fullName","placeOrder","_this","$refs","impactBoxForm","validate","$store","dispatch","then","result","parseInt","$swal","tokenCreated","_tokenCreated","_asyncToGenerator","regeneratorRuntime","mark","_callee","token","payload","_this2","wrap","_context","prev","next","id","Result","$router","push","stop","_x","apply","arguments","checkout","checkoutForm","submit","openGiftBoxSite","window","open","component"],"mappings":"uHAAA,IAAIA,EAAS,WAAkB,IAAIC,EAAIC,KAAKC,EAAGF,EAAIG,MAAMD,GAAG,OAAOA,EAAG,cAAc,CAACE,MAAM,CAAC,cAAc,GAAG,eAAe,KAAK,CAACF,EAAG,WAAW,CAACE,MAAM,CAAC,iBAAiB,GAAG,KAAO,KAAK,CAACF,EAAG,cAAc,CAACG,YAAY,cAAcD,MAAM,CAAC,eAAe,KAAK,CAACF,EAAG,WAAW,CAACE,MAAM,CAAC,IAAM,GAAG,KAAO,GAAG,eAAe,OAAO,IAAI,IAAI,IAEpUE,EAAkB,G,sqBCwUtB,OACAC,WAAA,CACAC,oCAEAC,KAAA,kBACAC,SAAA,CACAC,kBAAA,GAEAC,uBAAA,EACAC,gBAAA,EACAC,SAAA,EACAC,gBAAA,EACAC,QAAA,OAEAC,SAAAC,EAAA,GACAC,eAAA,CACAC,KAAA,OACAC,SAAA,mBAGAC,QAAA,CACAC,iBAAA,WACA,KAAAb,SAAAc,YACA,KAAAd,SAAAe,WAAA,KAAAf,SAAAgB,SAEA,KAAAhB,SAAAe,WAAA,IAGAE,WAAA,eAAAC,EAAA,KACA,KAAAC,MAAAC,cAAAC,YACA,KAAAjB,SAAA,EACA,KAAAkB,OACAC,SAAA,yBAAAvB,UACAwB,MAAA,SAAAC,GACAP,EAAAd,SAAA,EACA,WAAAqB,UACAP,EAAAZ,QAAAoB,SAAAD,EAAAnB,SACAY,EAAAlB,SAAAC,iBACAiB,EAAAS,MACA,oBACA,qCACA,WAGAT,EAAAf,gBAAA,GAGAe,EAAAS,MACA,QACA,kDACA,aAKA,KAAAA,MAAA,wDAGAC,aAAA,eAAAC,EAAAC,eAAAC,mBAAAC,MAAA,SAAAC,EAAAC,GAAA,IAAAC,EAAAC,EAAA,YAAAL,mBAAAM,MAAA,SAAAC,GAAA,eAAAA,EAAAC,KAAAD,EAAAE,MAAA,OACAL,EAAA,CACAD,QACAO,GAAA,KAAAnC,SAEA,KAAAgB,OAAAC,SAAA,qBAAAY,GAAAX,MAAA,SAAAC,GACAW,EAAA/B,gBAAA,EACA,eAAAoB,EAAAiB,QACAN,EAAAT,MACA,qBACA,+BACA,WAEAS,EAAAjC,gBAAA,EACAiC,EAAAO,QAAAC,KAAA,MAEAR,EAAAT,MACA,uBACA,sGACA,YAGA,wBAAAW,EAAAO,UAAAZ,EAAA,mBAtBAL,EAAAkB,GAAA,OAAAjB,EAAAkB,MAAA,KAAAC,WAAA,OAAApB,EAAA,GAwBAqB,SAAA,WACA,KAAA5C,gBAAA,EACA,KAAAc,MAAA+B,aAAAC,UAEAC,gBAAA,WACAC,OAAAC,KACA,0GClagV,I,wBCQ5UC,EAAY,eACd,EACAlE,EACAO,GACA,EACA,KACA,WACA,MAIa,aAAA2D,E,2CCnBf,W","file":"js/chunk-3ed932c4.d9ba175e.js","sourcesContent":["var render = function render(){var _vm=this,_c=_vm._self._c;return _c('v-container',{attrs:{\"fill-height\":\"\",\"grid-list-xl\":\"\"}},[_c('v-layout',{attrs:{\"justify-center\":\"\",\"wrap\":\"\"}},[_c('v-container',{staticClass:\"pageContent\",attrs:{\"grid-list-xl\":\"\"}},[_c('v-layout',{attrs:{\"row\":\"\",\"wrap\":\"\",\"align-center\":\"\"}})],1)],1)],1)\n}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\n  <v-container fill-height grid-list-xl>\n    <v-layout justify-center wrap>\n      <!-- <section\n        id=\"causeSectionHeader\"\n        style=\"position: relative; min-width: 100vw; top: -24px\"\n      >\n        <v-img\n          height=\"100%\"\n          position=\"center center\"\n          src=\"https://firebasestorage.googleapis.com/v0/b/upstream-nz.appspot.com/o/appImages%2FRED%20Banner%20for%20web%20-%201920X300pxH%20(1).jpg?alt=media&token=b776a7b8-0537-40c4-92b9-c7b3e6264fa0\"\n          class=\"hidden-xs-only\"\n        />\n        <v-img\n          position=\"center center\"\n          src=\"https://firebasestorage.googleapis.com/v0/b/upstream-nz.appspot.com/o/appImages%2FRed%20Banner%20for%20web%20-%20300pxH.jpg?alt=media&token=a6130918-d197-435c-871d-09556f4da0a6\"\n          class=\"hidden-sm-and-up\"\n        />\n      </section> -->\n\n      <v-container grid-list-xl class=\"pageContent\">\n        <v-layout row wrap align-center>\n<!--          <v-flex xs12 style=\"text-align: center\">-->\n<!--            <h3-->\n<!--              style=\"-->\n<!--                font-weight: bold !important;-->\n<!--                font-size: 30pt !important;-->\n<!--                color: black;-->\n<!--              \"-->\n<!--            >-->\n<!--              Upstream Impact Boxes-->\n<!--            </h3>-->\n<!--            <v-btn-->\n<!--              class=\"text-capitalize pa-4\"-->\n<!--              :href=\"`#tab-2`\"-->\n<!--              ripple-->\n<!--              @click=\"openGiftBoxSite\"-->\n<!--              depressed-->\n<!--              :color=\"'primary'\"-->\n<!--              style=\"color: white\"-->\n<!--            >-->\n<!--              Order Here-->\n<!--            </v-btn>-->\n<!--            &lt;!&ndash; <h5 class=\"christmasSubHeader mt-0\">-->\n<!--              Impact Boxes will be made up and delivered during the week of 7th-->\n<!--              - 12th Dec-->\n<!--            </h5> &ndash;&gt;-->\n<!--          </v-flex>-->\n          <!-- <v-flex xs12 style=\"text-align: left\">\n            <p>\n              Here's an Impactful way to say thank you to your staff, clients or\n              treat someone special. We have teamed up with Trade Aid to provide\n              these unique Christmas Impact Boxes. Benefit from easy ordering,\n              free shipping and 20% of your purchase goes towards the Upstream\n              Foundation which exists to strengthen the wellbeing of children\n              and young people.\n            </p>\n          </v-flex> -->\n          <!-- <v-flex xs12 style=\"text-align: center\">\n            <h3\n              style=\"\n                font-weight: bold !important;\n                font-family: 'Aleo' !important;\n                font-size: 15pt !important;\n                color: black;\n              \"\n            >\n              Bulk order for Christmas ? Multiple addresses needed : Save time\n              and download our bulk order form -\n              <v-btn\n                :href=\"`https://firebasestorage.googleapis.com/v0/b/upstream-nz.appspot.com/o/appImages%2FUpstreamNZ%20Impact%20Box%20_%20Bulk%20Order%20Form.xlsx?alt=media&token=c8af29b9-2318-4eb1-a247-ce0d79441cf3`\"\n                target=\"”_blank”\"\n                class=\"info text-capitalize\"\n              >\n                Click Here\n              </v-btn>\n            </h3>\n          </v-flex> -->\n          <!-- <v-flex sm12> -->\n          <!-- <v-form ref=\"impactBoxForm\" style=\"max-width: 90%; margin: auto\">\n              <v-layout wrap>\n                <v-flex xs12>\n                  <h4\n                    style=\"\n                      font-family: 'Aleo' !important;\n                      font-size: 20pt !important;\n                      color: #4cc7e8;\n                    \"\n                  >\n                    Your Contact Details\n                  </h4>\n                </v-flex>\n                <v-flex xs12 sm6>\n                  <v-text-field\n                    v-model=\"formData.fullName\"\n                    :rules=\"[(v) => !!v || 'Full name is required']\"\n                    label=\"Full name*\"\n                  />\n                </v-flex>\n                <v-flex xs12 sm6>\n                  <v-text-field\n                    v-model=\"formData.phone\"\n                    :rules=\"[(v) => !!v || 'Phone number is required']\"\n                    label=\"Your phone number*\"\n                  />\n                </v-flex>\n                <v-flex xs12>\n                  <v-text-field\n                    v-model=\"formData.email\"\n                    :rules=\"[(v) => !!v || 'Email is required']\"\n                    label=\"Your Email Address*\"\n                  />\n                </v-flex>\n                <v-flex xs12>\n                  <v-checkbox\n                    v-model=\"formData.mailingList\"\n                    :label=\"`Keep me up to date on Upstream impact stories and other offers.`\"\n                  ></v-checkbox>\n                </v-flex>\n\n                <v-flex xs12>\n                  <h4\n                    style=\"\n                      font-family: 'Aleo' !important;\n                      font-size: 20pt !important;\n                      color: #4cc7e8;\n                    \"\n                  >\n                    How many Christmas Impact Boxes would you like?\n                  </h4>\n                  <h5\n                    style=\"\n                      font-family: 'Aleo' !important;\n                      font-size: 12pt !important;\n                      color: black;\n                    \"\n                  >\n                    Whats Inside?\n                  </h5>\n                  <ul>\n                    <li>\n                      Local Ginger Beer ( using ethically imported Trade Aid\n                      Sugar & Ginger )\n                    </li>\n                    <li>\n                      Trade Aid Chocolate Dusted Almonds ( Cerftified Organic /\n                      Fair Trade )\n                    </li>\n                    <li>\n                      Trade Aid Milk Choc Bar ( Cerftified Organic / Fair Trade\n                      )\n                    </li>\n                    <li>\n                      Trade Aid Christmas Scroggin ( using ethically imported\n                      Trade Aid Cashews & Almonds )\n                    </li>\n                    <li>Personalized Card with your message</li>\n                  </ul>\n                  <h5\n                    style=\"\n                      font-family: 'Aleo' !important;\n                      font-size: 12pt !important;\n                      color: black;\n                    \"\n                  >\n                    $30 per Impact Box ( Free delivery anywhere in NZ & GST is\n                    inclusive )\n                  </h5>\n                </v-flex>\n                <v-flex xs12>\n                  <v-img\n                    style=\"max-width: 600px; margin: auto\"\n                    src=\"https://firebasestorage.googleapis.com/v0/b/upstream-nz.appspot.com/o/appImages%2FHero%20low%20res%20179KB.png?alt=media&token=aebd25f6-a59f-44d9-a06c-3df0fc94f560\"\n                  />\n                </v-flex>\n\n                <v-flex xs12>\n                  <v-text-field\n                    v-model=\"formData.quantity\"\n                    :rules=\"[\n                      (v) => !!v || 'Quantity is required',\n                      (v) => v > 0 || 'Quantity cannot be less than 1',\n                    ]\"\n                    label=\"Quantity\"\n                    type=\"number\"\n                  />\n                </v-flex>\n\n                <v-flex xs12>\n                  <h4\n                    style=\"\n                      font-family: 'Aleo' !important;\n                      font-size: 20pt !important;\n                      color: #4cc7e8;\n                    \"\n                  >\n                    Who are we sending this gift to?\n                  </h4>\n                </v-flex>\n\n                <v-flex xs12>\n                  <v-checkbox\n                    v-model=\"formData.giftForSelf\"\n                    @change=\"giftForSelfClick()\"\n                    :label=\"`Is it for you?`\"\n                  ></v-checkbox>\n                </v-flex>\n\n                <v-flex xs12 sm6>\n                  <v-text-field\n                    v-model=\"formData.toFullName\"\n                    :rules=\"[(v) => !!v || 'Full name is required']\"\n                    label=\"Full name*\"\n                  />\n                </v-flex>\n                <v-flex xs12 sm6>\n                  <v-text-field\n                    v-model=\"formData.building\"\n                    label=\"Company / Building / Appt # ( Optional )\"\n                  />\n                </v-flex>\n                <v-flex xs12>\n                  <v-text-field\n                    v-model=\"formData.address\"\n                    :rules=\"[(v) => !!v || 'Address is required']\"\n                    label=\"Address*\"\n                  />\n                </v-flex>\n\n                <v-flex xs12 sm6>\n                  <v-text-field\n                    v-model=\"formData.suburb\"\n                    :rules=\"[(v) => !!v || 'Suburb is required']\"\n                    label=\"Suburb*\"\n                  />\n                </v-flex>\n\n                <v-flex xs12 sm6>\n                  <v-text-field\n                    v-model=\"formData.postCode\"\n                    :rules=\"[(v) => !!v || 'Post Code is required']\"\n                    label=\"Post Code*\"\n                  />\n                </v-flex>\n\n                <v-flex xs12 sm6>\n                  <v-text-field\n                    v-model=\"formData.city\"\n                    :rules=\"[(v) => !!v || 'City is required']\"\n                    label=\"City*\"\n                  />\n                </v-flex>\n\n                <v-flex xs12>\n                  <v-textarea\n                    v-model=\"formData.giftMessage\"\n                    label=\"Your Gift Message\"\n                    counter=\"160\"\n                    maxlength=\"160\"\n                  ></v-textarea>\n                </v-flex>\n\n                <v-flex xs12>\n                  <v-textarea\n                    v-model=\"formData.specialRequests\"\n                    label=\"Special Requests (This will let our admin know any specific requests)\"\n                  ></v-textarea>\n                </v-flex>\n\n                <v-flex xs12>\n                  <v-radio-group v-model=\"formData.alternatePayment\" mandatory>\n                    <v-radio\n                      label=\"I will pay for this with my credit card now\"\n                      :value=\"false\"\n                    ></v-radio>\n                    <v-radio\n                      label=\"I want to be invoiced or pay bank deposit\"\n                      :value=\"true\"\n                    ></v-radio>\n                  </v-radio-group>\n                </v-flex>\n\n                <v-flex xs12>\n                  <v-btn class=\"info\" :loading=\"loading\" @click=\"placeOrder()\"\n                    >Place Order</v-btn\n                  >\n                  <p v-if=\"!formData.alternatePayment\">\n                    You will be transported to our Stripe payment checkout\n                  </p>\n                  <p v-else>You will be Invoiced by Upstream</p>\n                </v-flex>\n              </v-layout>\n            </v-form> -->\n          <!-- </v-flex> -->\n        </v-layout>\n      </v-container>\n    </v-layout>\n\n    <!-- <v-dialog v-model=\"checkoutDialog\" max-width=\"600px\">\n      <v-card>\n        <v-card-title>Upstream Checkout</v-card-title>\n        <v-card-text>\n          <h3>{{ formData.quantity }} x Christmas Impact Boxes</h3>\n          <h3>Your total is : ${{ formData.quantity * 30 }}</h3>\n          <stripe-elements\n            ref=\"checkoutForm\"\n            pk=\"pk_live_51GwfMuCdvCqlJd9GRPzADulbIwEAJL831fZeHQdRiC62JjEizgamQ2Oj0ylKvasjOcM9FcldzLt60GvMOokvh0gL00Ncm5pvWm\"\n            :amount=\"formData.quantity * 30\"\n            required\n            :description=\"`ClickOrder for`\"\n            currency=\"NZD\"\n            @token=\"tokenCreated\"\n          ></stripe-elements>\n        </v-card-text>\n        <v-card-actions>\n          <h3>We are using Stripe as our protection gateway</h3>\n          <v-spacer></v-spacer>\n          <v-btn :loading=\"paymentLoading\" @click=\"checkout()\" color=\"primary\"\n            >Pay Now</v-btn\n          >\n        </v-card-actions>\n      </v-card>\n    </v-dialog> -->\n  </v-container>\n</template>\n\n<script>\n  import { mapGetters } from \"vuex\";\n  import { StripeElements } from \"vue-stripe-checkout\";\n\n  export default {\n    components: {\n      StripeElements,\n    },\n    data: () => ({\n      formData: {\n        alternatePayment: false,\n      },\n      emailFormConfirmation: false,\n      checkoutDialog: false,\n      loading: false,\n      paymentLoading: false,\n      orderID: null,\n    }),\n    computed: {\n      ...mapGetters({\n        user: \"user\",\n        userData: \"user/userData\",\n      }),\n    },\n    methods: {\n      giftForSelfClick() {\n        if (this.formData.giftForSelf) {\n          this.formData.toFullName = this.formData.fullName;\n        } else {\n          this.formData.toFullName = \"\";\n        }\n      },\n      placeOrder() {\n        if (this.$refs.impactBoxForm.validate()) {\n          this.loading = true;\n          this.$store\n            .dispatch(\"stripe/submitForm\", this.formData)\n            .then((result) => {\n              this.loading = false;\n              if (result.result == \"Success\") {\n                this.orderID = parseInt(result.orderID);\n                if (this.formData.alternatePayment) {\n                  this.$swal(\n                    \"Request Submitted\",\n                    \"We will be incontact with you ASAP\",\n                    \"success\"\n                  );\n                } else {\n                  this.checkoutDialog = true;\n                }\n              } else {\n                this.$swal(\n                  \"Error\",\n                  \"There was an error with this form unfortunately\",\n                  \"error\"\n                );\n              }\n            });\n        } else {\n          this.$swal(\"Error\", \"Please fill out the Required Fields\", \"error\");\n        }\n      },\n      async tokenCreated(token) {\n        let payload = {\n          token: token,\n          id: this.orderID,\n        };\n        this.$store.dispatch(\"stripe/makePayment\", payload).then((result) => {\n          this.paymentLoading = false;\n          if (result.Result === \"Successful\") {\n            this.$swal(\n              \"Payment  received!\",\n              \"Thank you for your purchase!\",\n              \"success\"\n            );\n            this.checkoutDialog = false;\n            this.$router.push(\"/\");\n          } else {\n            this.$swal(\n              \"Payment unsuccessful\",\n              \"Please check your details and try again. If you continue to have problems please contact your bank.\",\n              \"error\"\n            );\n          }\n        });\n      },\n      checkout() {\n        this.paymentLoading = true;\n        this.$refs.checkoutForm.submit();\n      },\n      openGiftBoxSite() {\n        window.open(\n          \"https://docs.google.com/forms/d/e/1FAIpQLSeSP1TC-kK9zP13zmLrn8dzxRoJpkKcs3lIa7gJmZ8-B_fzww/viewform\"\n        );\n      },\n    },\n  };\n</script>\n\n<style scoped>\n  .christmasSubHeader {\n    color: red;\n    font-family: Gotham !important;\n    font-weight: bold;\n  }\n</style>\n","import mod from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./GiftBox.vue?vue&type=script&lang=js\"; export default mod; export * from \"-!../../node_modules/cache-loader/dist/cjs.js??ref--12-0!../../node_modules/thread-loader/dist/cjs.js!../../node_modules/babel-loader/lib/index.js!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./GiftBox.vue?vue&type=script&lang=js\"","import { render, staticRenderFns } from \"./GiftBox.vue?vue&type=template&id=d47a8d4e&scoped=true\"\nimport script from \"./GiftBox.vue?vue&type=script&lang=js\"\nexport * from \"./GiftBox.vue?vue&type=script&lang=js\"\nimport style0 from \"./GiftBox.vue?vue&type=style&index=0&id=d47a8d4e&prod&scoped=true&lang=css\"\n\n\n/* normalize component */\nimport normalizer from \"!../../node_modules/vue-loader/lib/runtime/componentNormalizer.js\"\nvar component = normalizer(\n  script,\n  render,\n  staticRenderFns,\n  false,\n  null,\n  \"d47a8d4e\",\n  null\n  \n)\n\nexport default component.exports","export * from \"-!../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../node_modules/css-loader/index.js??ref--6-oneOf-1-1!../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../node_modules/postcss-loader/src/index.js??ref--6-oneOf-1-2!../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../node_modules/vue-loader/lib/index.js??vue-loader-options!./GiftBox.vue?vue&type=style&index=0&id=d47a8d4e&prod&scoped=true&lang=css\""],"sourceRoot":""}