{"version":3,"sources":["webpack:///./src/components/component/LpEmail.vue?ddf1","webpack:///./src/components/component/LpEmail.vue?2ae1","webpack:///./src/utils/helper/format-helper.js","webpack:///src/components/component/LpEmail.vue","webpack:///./src/components/component/LpEmail.vue?4256","webpack:///./src/components/component/LpEmail.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","staticClass","staticStyle","directives","name","rawName","value","expression","ref","style","attrs","disabled","domProps","on","$event","type","indexOf","_k","keyCode","key","clickValid","target","composing","inputValue","valid","success","clickResend","_v","inputDisabled","_s","errorMsg","_e","class","errorValid","validNum","remainNum","remain","confirm","errorValidMsg","staticRenderFns","numToTime","num","parseInt","numeral","format","component"],"mappings":"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","file":"js/chunk-1354acfc.0e7d8086.js","sourcesContent":["export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--11-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.js??ref--11-oneOf-1-1!../../../node_modules/vue-loader/lib/loaders/stylePostLoader.js!../../../node_modules/postcss-loader/src/index.js??ref--11-oneOf-1-2!../../../node_modules/stylus-loader/index.js??ref--11-oneOf-1-3!../../../node_modules/cache-loader/dist/cjs.js??ref--0-0!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./LpEmail.vue?vue&type=style&index=0&id=3680de2a&lang=stylus&scoped=true&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('div',{staticClass:\"flex-align\",staticStyle:{\"gap\":\"8px\"}},[_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.inputValue),expression:\"inputValue\"}],ref:\"input\",staticClass:\"input\",style:(_vm.wrapperStyle),attrs:{\"type\":\"email\",\"maxlength\":200,\"placeholder\":\"example@gmail.com\",\"disabled\":_vm.disabled},domProps:{\"value\":(_vm.inputValue)},on:{\"keyup\":function($event){if(!$event.type.indexOf('key')&&_vm._k($event.keyCode,\"enter\",13,$event.key,\"Enter\")){ return null; }return _vm.clickValid($event)},\"input\":function($event){if($event.target.composing){ return; }_vm.inputValue=$event.target.value}}}),(!_vm.valid)?_c('button',{staticClass:\"button is-primary\",attrs:{\"disabled\":_vm.inputDisabled},on:{\"click\":_vm.clickValid}},[_vm._v(\"인증\")]):_c('button',{staticClass:\"button is-primary\",attrs:{\"disabled\":_vm.success},on:{\"click\":_vm.clickResend}},[_vm._v(\"재전송\")])]),(_vm.error)?_c('div',{staticClass:\"msg-error\"},[_c('img',{attrs:{\"src\":\"/static/icon/ic_warning_circle_error.svg\"}}),_c('div',{staticClass:\"size-12 highlight\"},[_vm._v(_vm._s(_vm.errorMsg))])]):_vm._e(),(_vm.valid)?_c('div',{staticClass:\"flex-align\",staticStyle:{\"margin-top\":\"8px\",\"gap\":\"8px\"}},[_c('div',{staticClass:\"position-relative\",staticStyle:{\"flex\":\"1\"}},[_c('input',{directives:[{name:\"model\",rawName:\"v-model\",value:(_vm.validNum),expression:\"validNum\"}],staticClass:\"input\",class:{'success': _vm.success, 'error': _vm.errorValid},attrs:{\"maxlength\":\"6\",\"placeholder\":\"인증번호 6자리\",\"type\":\"text\",\"readonly\":_vm.success},domProps:{\"value\":(_vm.validNum)},on:{\"input\":function($event){if($event.target.composing){ return; }_vm.validNum=$event.target.value}}}),(_vm.remainNum > -1)?_c('div',{staticClass:\"remain highlight\"},[_vm._v(_vm._s(_vm.remain))]):_vm._e()]),_c('button',{staticClass:\"button is-primary\",attrs:{\"disabled\":_vm.success},on:{\"click\":_vm.confirm}},[_vm._v(\"확인\")])]):_vm._e(),(_vm.success)?_c('div',{staticClass:\"msg-success\"},[_c('i',{staticClass:\"material-icons\"},[_vm._v(\"check\")]),_c('div',{staticClass:\"size-12\"},[_vm._v(\"인증이 완료되었습니다.\")])]):(_vm.errorValid)?_c('div',{staticClass:\"msg-error\"},[_c('img',{attrs:{\"src\":\"/static/icon/ic_exclamation.svg\"}}),_c('div',{staticClass:\"size-12 highlight\"},[_vm._v(_vm._s(_vm.errorValidMsg))])]):_vm._e()])}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","import numeral from 'numeral'\r\n\r\nfunction numToTime(num) {\r\n  num = parseInt(num);\r\n  return numeral(num).format('00:00:00');\r\n}\r\n\r\nexport { \r\n  numToTime \r\n}\r\n\r\n","<template>\r\n  <div>\r\n    <div class=\"flex-align\" style=\"gap:8px\">\r\n      <input\r\n          :style=\"wrapperStyle\"\r\n          class=\"input\"\r\n          ref=\"input\"\r\n          type=\"email\"\r\n          v-model=\"inputValue\"\r\n          :maxlength=\"200\"\r\n          @keyup.enter=\"clickValid\"\r\n          placeholder=\"example@gmail.com\"\r\n          :disabled=\"disabled\"/>\r\n        <button v-if=\"!valid\" :disabled=\"inputDisabled\" \r\n                class=\"button is-primary\" @click=\"clickValid\">인증</button>\r\n        <button v-else :disabled=\"success\"\r\n                class=\"button is-primary\" @click=\"clickResend\">재전송</button>\r\n    </div>\r\n    <div class=\"msg-error\" v-if=\"error\">\r\n      <img src=\"/static/icon/ic_warning_circle_error.svg\">\r\n      <div class=\"size-12 highlight\">{{ errorMsg }}</div>\r\n    </div>\r\n    <div v-if=\"valid\" class=\"flex-align\" style=\"margin-top:8px;gap: 8px\">\r\n      <div class=\"position-relative\" style=\"flex:1\">\r\n        <input maxlength=\"6\" placeholder=\"인증번호 6자리\" type=\"text\" v-model=\"validNum\"\r\n               class=\"input\" :class=\"{'success': success, 'error': errorValid}\" :readonly=\"success\">\r\n            <div class=\"remain highlight\" v-if=\"remainNum > -1\">{{ remain }}</div>\r\n      </div>\r\n      <button class=\"button is-primary\" :disabled=\"success\" @click=\"confirm\">확인</button>\r\n    </div>\r\n    <div class=\"msg-success\" v-if=\"success\">\r\n      <i class=\"material-icons\">check</i>\r\n      <div class=\"size-12\">인증이 완료되었습니다.</div>\r\n    </div>\r\n    <div class=\"msg-error\" v-else-if=\"errorValid\">\r\n      <img src=\"/static/icon/ic_exclamation.svg\">\r\n      <div class=\"size-12 highlight\">{{ errorValidMsg }}</div>\r\n    </div>\r\n  </div>\r\n</template>\r\n<script>\r\n  import {numToTime} from '@/utils/helper/format-helper'\r\n  import FormMixin from \"@/mixins/FormMixin\";\r\n  export default {\r\n    name: \"LpEmail\",\r\n    mixins: [\r\n      FormMixin\r\n    ],\r\n    props: {\r\n      value: {\r\n        type: String\r\n      },\r\n      disabled: {\r\n        type: Boolean,\r\n        required: false\r\n      },\r\n      placeholder: {\r\n        type: String,\r\n        default: ''\r\n      },\r\n      width: {\r\n        type: String\r\n      }\r\n    },\r\n    data() {\r\n      return {\r\n        inputValue: '',\r\n        validNum: '',\r\n        valid: false,\r\n        success: false,\r\n        error: false,\r\n        errorMsg: '필수입력 사항입니다.',\r\n        errorValid: false,\r\n        errorValidMsg: '필수입력 사항입니다.',\r\n        remainNum: -1,\r\n        itv: undefined,\r\n        inputDisabled: false\r\n      }\r\n    },\r\n    computed: {\r\n      remain() {\r\n        return numToTime(this.remainNum).substring(2);\r\n      },\r\n      wrapperStyle() {\r\n        let style = {};\r\n        if(this.width) {\r\n          style.width = this.width;\r\n        }\r\n        return style;\r\n      }\r\n    },\r\n    methods: {\r\n      clickValid() {\r\n         // 인증 관련 로직 실행\r\n         if(this.inputValue === '') {\r\n          this.error = true;\r\n          this.errorMsg = '필수입력 사항입니다.';\r\n        } else if(/[0-9a-zA-Z][_0-9a-zA-Z-]*@[_0-9a-zA-Z-]+(\\.[_0-9a-zA-Z-]+){1,2}$/.test(this.inputValue) === false) {\r\n          this.error = true;\r\n          this.errorMsg = '이메일 주소를 정확히 입력해주세요';\r\n        } else {\r\n          this.$store.commit('setLoading', true);\r\n          this.$axios.post('auth/user/check/email', {email: this.inputValue}).then(res => {\r\n            if(res.data.result === 'ok') {\r\n              // 인증 처리\r\n              this.$axios.post('public/email/verify/send', {email: this.inputValue}).then(() => {\r\n                this.$store.commit('setLoading', false);\r\n                this.toast('인증번호가 발송되었습니다.');\r\n                this.inputDisabled = true;\r\n                this.error = false;\r\n                this.valid = true;\r\n                this.remainNum = 300;\r\n                this.itv = setInterval(this.intervalRemain, 1000);\r\n              }).catch(() => {\r\n                this.$store.commit('setLoading', false);\r\n                this.toast('인증번호 발송에 실패했습니다.');\r\n              })\r\n            } else {\r\n              this.$store.commit('setLoading', false);\r\n              this.errorMsg = `이미 가입된 ${res.data.login_type}${res.data.login_type === 'SNS' ? ' ' + '(' + res.data.sns + ')' : ''} 계정이 있습니다.`;\r\n              this.error = true;\r\n            }\r\n          }).catch(() => {\r\n            this.$store.commit('setLoading', false);\r\n          });\r\n        }\r\n      },\r\n      clickResend() {\r\n        if (!this.success) {\r\n          this.$store.commit('setLoading', true);\r\n          this.$axios.post('public/email/verify/send', {email: this.inputValue}).then(() => {\r\n            this.$store.commit('setLoading', false);\r\n            this.toast('인증번호가 메일로 발송되었습니다.');\r\n            clearInterval(this.itv);\r\n            this.inputDisabled = true;\r\n            this.error = false;\r\n            this.valid = true;\r\n            this.remainNum = 300;\r\n            this.itv = setInterval(this.intervalRemain, 1000);\r\n          }).catch(() => {\r\n            this.$store.commit('setLoading', false);\r\n            this.toast('인증번호 발송에 실패했습니다.');\r\n          })\r\n        }\r\n      },\r\n      confirm() {\r\n        let params = {\r\n          email: this.inputValue,\r\n          verify_num: this.validNum\r\n        }\r\n        this.$axios.post('public/email/verify/confirm', params).then(() => {\r\n          if (this.remainNum > 0) {\r\n            this.errorValid = false;\r\n            this.success = true;\r\n            this.remainNum = -1;\r\n            clearInterval(this.itv);\r\n            this.$emit('update:value', this.inputValue);\r\n            this.$emit('auth',this.inputValue);\r\n          } else {\r\n            this.errorValidMsg = '인증번호가 만료되었습니다.';\r\n            this.errorValid = true;\r\n            this.inputDisabled = false;\r\n          }\r\n        }).catch(() => {\r\n          this.toast('인증번호가 일치하지 않습니다.');\r\n          this.errorValidMsg = '인증번호가 일치하지 않습니다.';\r\n          this.errorValid = true;\r\n        })\r\n      },\r\n      intervalRemain() {\r\n        this.remainNum--;\r\n        if(this.remainNum===0) {\r\n          clearInterval(this.itv);\r\n          this.errorValidMsg = '인증번호가 만료되었습니다.';\r\n          this.errorValid = true;\r\n          this.inputDisabled = false;\r\n        }\r\n      },\r\n    }\r\n  }\r\n</script>\r\n<style lang=\"stylus\" scoped>\r\n  @import '~assets/css/lp_main'\r\n  input\r\n    height 48px\r\n    flex 1\r\n\r\n  .error\r\n    border 1px solid $error !important\r\n\r\n  .success\r\n    border 1px solid $success !important\r\n\r\n\r\n  .button\r\n    width 80px\r\n    height 48px\r\n    font-size 16px\r\n  .msg-error\r\n  .msg-success\r\n    display flex\r\n    align-items center\r\n    margin-top 8px\r\n    gap 0 4px\r\n\r\n  .msg-success\r\n    color $success\r\n    i\r\n      font-size 12px\r\n\r\n  .highlight\r\n    color #FF3B3B\r\n\r\n  .remain\r\n    position absolute\r\n    top calc(50% - 12px)\r\n    right 20px\r\n    font-size 15px\r\n\r\n  .button:disabled\r\n    background #ddd\r\n    border 1px solid #ddd\r\n    cursor default\r\n  .button:disabled:hover\r\n    background #ddd\r\n    border 1px solid #ddd\r\n</style>\r\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!./LpEmail.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!./LpEmail.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./LpEmail.vue?vue&type=template&id=3680de2a&scoped=true&\"\nimport script from \"./LpEmail.vue?vue&type=script&lang=js&\"\nexport * from \"./LpEmail.vue?vue&type=script&lang=js&\"\nimport style0 from \"./LpEmail.vue?vue&type=style&index=0&id=3680de2a&lang=stylus&scoped=true&\"\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  \"3680de2a\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}