{"version":3,"sources":["webpack:///./src/components/contents/BillPayments/Airtime.vue?7fae","webpack:///./src/components/contents/BillPayments/Airtime.vue","webpack:///./src/components/contents/BillPayments/Airtime.vue?b493"],"names":["class","_createBlock","_component_q_page","_createElementVNode","_createVNode","_component_q_form","greedy","ref","style","_normalizeStyle","$options","screenWidth","_component_AppSelect","$data","form","provider","$event","val","getBundles","options","providers","label","loading","pageLoading","placeholder","rules","autocomplete","_component_AppInput","amount","type","lazy-rules","_hoisted_1","_toDisplayString","formatMoney","businessPhone","mask","unmasked-value","phone","onClick","_cache","args","rechargeSelf","_component_AppButton","viewSummary","disabled","airtimeButtonState","_component_ConfirmationModal","showModal","showConfirmationModal","modalTitle","_ctx","mixinLoading","modalContent","contentType","onCloseCard","onEnterPin","handleSubmit","_component_SuccessModal","showSuccessModal","closeModal","components","AppInput","AppSelect","AppButton","ConfirmationModal","SuccessModal","mixins","billPaymentMixin","data","customer","bundle","billPaymentService","billerType","bundles","itemCode","itemType","myForm","providerRef","newproviderRef","amountRef","businessPhoneRef","resetButton","computed","size","this","$q","screen","xs","width","sm","Object","values","some","x","mounted","getBillerTypes","methods","billerTypes","map","billerName","value","billerCode","bundlesLoading","getBillingBundles","Number","pin","_this$form","payload","transactionPin","response","payBiller","$mixpanel","track","email","$store","getters","undefined","billType","reference","phoneNumber","splitPhone","replace","$refs","resetValidation","selectRef","inputRef","created","BillPaymentService","$api2","__exports__","render","QPage","QForm"],"mappings":"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","file":"js/chunk-61a1dadf.4dbe265e.js","sourcesContent":["export * from \"-!../../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--7-oneOf-1-0!../../../../node_modules/css-loader/dist/cjs.js??ref--7-oneOf-1-1!../../../../node_modules/vue-loader-v16/dist/stylePostLoader.js!../../../../node_modules/postcss-loader/src/index.js??ref--7-oneOf-1-2!../../../../node_modules/vue-cli-plugin-quasar/lib/loader.vue.auto-import-quasar.js??ref--1-0!../../../../node_modules/cache-loader/dist/cjs.js??ref--1-1!../../../../node_modules/vue-loader-v16/dist/index.js??ref--1-2!./Airtime.vue?vue&type=style&index=0&id=61d01bd3&scoped=true&lang=css\"","<template>\n  <q-page>\n    <div>\n      <div>\n        <q-form greedy ref=\"myForm\" class=\"form-container\" :style=\"screenWidth\">\n          <AppSelect\n            v-model=\"form.provider\"\n            :options=\"providers\"\n            label=\"Select Network\"\n            class=\"q-mb-xs\"\n            :loading=\"pageLoading\"\n            placeholder=\"Select network type\"\n            :rules=\"rules.provider\"\n            @update:model-value=\"(val) => getBundles(val)\"\n            autocomplete=\"off\"\n            ref=\"providerRef\"\n          />\n\n          <AppInput\n            label=\"Amount\"\n            placeholder=\"Enter Amount\"\n            v-model=\"form.amount\"\n            type=\"number\"\n            lazy-rules\n            :rules=\"rules.amount\"\n            ref=\"amountRef\"\n          />\n\n          <div class=\"q-mt-xs q-mb-md\">\n            AMOUNT: {{ \" \" + formatMoney(form.amount * 100) }}\n          </div>\n\n          <AppInput\n            label=\"Phone number\"\n            placeholder=\"81xxxxxxxxx\"\n            v-model=\"form.businessPhone\"\n            mask=\"##########\"\n            unmasked-value\n            type=\"tel\"\n            phone\n            :rules=\"rules.businessPhone\"\n            ref=\"businessPhoneRef\"\n          />\n\n          <p\n            class=\"q-mt-none float-right text-grey-8 cursor-pointer\"\n            @click=\"rechargeSelf\"\n          >\n            Recharge self\n          </p>\n\n          <AppButton\n            type=\"button\"\n            @click=\"viewSummary\"\n            label=\"Buy Airtime\"\n            class=\"q-mt-lg\"\n            :disabled=\"airtimeButtonState\"\n          />\n        </q-form>\n      </div>\n    </div>\n    <ConfirmationModal\n      :showModal=\"showConfirmationModal\"\n      :modalTitle=\"`Buy Airtime`\"\n      :loading=\"mixinLoading\"\n      :modalContent=\"modalContent\"\n      :contentType=\"contentType\"\n      @closeCard=\"showConfirmationModal = false\"\n      @enterPin=\"handleSubmit\"\n    />\n    <SuccessModal\n      :showSuccessModal=\"showSuccessModal\"\n      @closeCard=\"closeModal\"\n      :modalContent=\"modalContent\"\n    />\n  </q-page>\n</template>\n<script>\nimport { ref } from \"vue\";\n// import { useFormChild } from \"quasar\";\nimport AppInput from \"@/components/base/AppInput/Input.vue\";\nimport AppSelect from \"@/components/base/AppSelect/Select.vue\";\nimport AppButton from \"@/components/base/Button/Button.vue\";\nimport ConfirmationModal from \"./modals/confirmation.vue\";\nimport SuccessModal from \"./modals/success.vue\";\nimport { formatMoney } from \"@/helpers/money\";\nimport BillPaymentService from \"../../../services/billPayment.http\";\nimport { billPaymentMixin } from \"@/mixins\";\n\nexport default {\n  components: {\n    AppInput,\n    AppSelect,\n    AppButton,\n    ConfirmationModal,\n    SuccessModal,\n  },\n  // mixins: [authRulesMixin],\n  mixins: [billPaymentMixin],\n  data() {\n    return {\n      form: {\n        provider: ref(null),\n        amount: ref(null),\n        businessPhone: ref(null),\n        customer: null,\n        bundle: null,\n      },\n      showConfirmationModal: false,\n      showSuccessModal: false,\n      modalContent: null,\n      loading: false,\n      rules: {\n        provider: [(val) => !!val || \"A provider is required\"],\n        amount: [\n          (val) => !!val || \"Amount is required\",\n          (val) =>\n            (val >= 100 && val <= 50000) || \"Min: ₦ 100.00 | Max: ₦ 50,000.00\",\n        ],\n        businessPhone: [(val) => !!val || \"Enter a valid business phone\"],\n      },\n      billPaymentService: null,\n      pageLoading: false,\n      providers: null,\n      billerType: \"airtime\",\n      contentType: \"airtime\",\n      bundles: null,\n      itemCode: \"\",\n      itemType: \"\",\n      myForm: ref(),\n      providerRef: ref(null),\n      newproviderRef: ref(null),\n      amountRef: ref(null),\n      businessPhoneRef: ref(null),\n      resetButton: ref(),\n    };\n  },\n  computed: {\n    screenWidth() {\n      let size = this.$q.screen;\n      if (size.xs) {\n        return { width: \"100%\" };\n      } else if (size.sm) {\n        return { width: \"60%\" };\n      } else {\n        return { width: \"35%\" };\n      }\n    },\n    airtimeButtonState() {\n      const form = {\n        provider: !!this.form.provider || \"A provider is required\",\n        amount:\n          (!!this.form.amount || \"Amount is required\") &&\n          ((this.form.amount >= 100 && this.form.amount <= 50000) ||\n            \"Min: ₦ 100.00 | Max: ₦ 50,000.00\"),\n        businessPhone:\n          !!this.form.businessPhone || \"Enter a valid business phone\",\n      };\n      return Object.values(form).some((x) => x !== true);\n    },\n  },\n  mounted() {\n    this.getBillerTypes();\n  },\n  methods: {\n    formatMoney,\n    async getBillerTypes() {\n      this.pageLoading = true;\n      this.providers = await this.billerTypes(this.billerType);\n      this.providers.map((provider) => {\n        provider.label = provider.billerName;\n        provider.value = provider.billerCode;\n      });\n\n      this.pageLoading = false;\n    },\n    async getBundles() {\n      this.bundlesLoading = true;\n      this.bundles = await this.getBillingBundles(\n        this.form.provider.billerCode\n      );\n      this.bundles.map((bundle) => {\n        bundle.label = bundle.type;\n        bundle.value = bundle.itemCode;\n      });\n      this.itemCode = this.bundles[0].itemCode;\n      this.itemType = this.bundles[0].type;\n      this.bundlesLoading = false;\n    },\n    viewSummary() {\n      this.modalContent = {\n        amount: Number(this.form.amount),\n        customer: \"+234\" + this.form.businessPhone,\n        type: this.form.provider,\n      };\n      this.showConfirmationModal = true;\n    },\n    async handleSubmit(pin) {\n      this.mixinLoading = true;\n      let payload = {\n        amount: Number(this.form.amount) * 100,\n        transactionPin: pin,\n        type: this.itemType,\n        customer: \"+234\" + this.form.businessPhone,\n        billerCode: this.form.provider.billerCode,\n        itemCode: this.itemCode,\n      };\n\n      let response = await this.payBiller(payload);\n      this.$mixpanel.track(\"user_completes_airtime_payment\", {\n        email: this.$store.getters[\"Auth/user\"].email,\n      });\n      if (response === undefined) {\n        this.showSuccessModal = false;\n        return;\n      }\n\n      this.modalContent = {\n        billType: \"airtime\",\n        amount: this.form?.amount,\n        reference: response.reference,\n      };\n      this.mixinLoading = false;\n      this.showConfirmationModal = false;\n      this.showSuccessModal = true;\n    },\n    rechargeSelf() {\n      let phone = this.$store.getters[\"Auth/business\"].phoneNumber;\n      let splitPhone = phone.replace(/234/g, \"\");\n      this.form.businessPhone = splitPhone;\n    },\n    async closeModal() {\n      this.showSuccessModal = false;\n      this.form.provider = null;\n      this.form.amount = null;\n      this.form.businessPhone = null;\n      await this.$refs.myForm.resetValidation();\n      await this.$refs.providerRef.$refs.selectRef.resetValidation();\n      await this.$refs.amountRef.$refs.inputRef.resetValidation();\n      await this.$refs.businessPhoneRef.$refs.inputRef.resetValidation();\n    },\n  },\n  created() {\n    this.billPaymentService = new BillPaymentService(this.$api2);\n  },\n};\n</script>\n<style scoped>\n.formclass {\n  display: flex;\n  width: 343px;\n  flex-direction: column;\n  align-items: center;\n  padding: 24px 16px 16px 16px;\n  gap: 40px;\n}\n.form-container {\n  margin: auto;\n  padding: 5px;\n  margin-top: 40px;\n}\n</style>\n","import { render } from \"./Airtime.vue?vue&type=template&id=61d01bd3&scoped=true\"\nimport script from \"./Airtime.vue?vue&type=script&lang=js\"\nexport * from \"./Airtime.vue?vue&type=script&lang=js\"\n\nimport \"./Airtime.vue?vue&type=style&index=0&id=61d01bd3&scoped=true&lang=css\"\n\nimport exportComponent from \"/codebuild/output/src612567107/src/new-merchant-app/node_modules/vue-loader-v16/dist/exportHelper.js\"\nconst __exports__ = /*#__PURE__*/exportComponent(script, [['render',render],['__scopeId',\"data-v-61d01bd3\"]])\n\nexport default __exports__\nimport QPage from 'quasar/src/components/page/QPage.js';\nimport QForm from 'quasar/src/components/form/QForm.js';\nimport qInstall from \"../../../../node_modules/vue-cli-plugin-quasar/lib/runtime.auto-import.js\";\nqInstall(script, 'components', {QPage,QForm});\n"],"sourceRoot":""}