{"version":3,"sources":["webpack:///./src/views/sms-reward/use-reward.vue?bd39","webpack:///./src/views/sms-reward/modalForm.vue?c02c","webpack:///./src/views/sms-reward/modalFormPassword.vue?bb97","webpack:///./src/views/sms-reward/modalFormPassword.vue?62c8","webpack:///src/views/sms-reward/modalFormPassword.vue","webpack:///./src/views/sms-reward/modalFormPassword.vue?3ede","webpack:///./src/views/sms-reward/modalFormPassword.vue","webpack:///./src/views/sms-reward/modalForm.vue?de35","webpack:///src/views/sms-reward/modalForm.vue","webpack:///./src/views/sms-reward/modalForm.vue?3f5f","webpack:///./src/views/sms-reward/modalForm.vue","webpack:///./src/views/sms-reward/use-reward.vue?01c7","webpack:///src/views/sms-reward/use-reward.vue","webpack:///./src/views/sms-reward/use-reward.vue?5fa5","webpack:///./src/views/sms-reward/use-reward.vue"],"names":["render","_vm","this","_h","$createElement","_c","_self","attrs","padding","visible","staticClass","_v","_s","$t","staticStyle","style","marginPassword","password","length","$device","class","fontSize","visible_password","on","$event","onPinPress","cancel","create","staticRenderFns","component","data","step","title","domProps","message","key","confirm","onCloseError","back_path","member_id","priv_id_from_sms","width","reward","plivilege","Number","count_time","$router","replace","path","useReward","modal_visible","ref","modal_data","modal_step","onModalSave","onModalCancel","modal_visible2","modal_data2","onCancelModalError"],"mappings":"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","file":"js/chunk-b25d12dc.1607abf5.js","sourcesContent":["export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.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!./use-reward.vue?vue&type=style&index=0&id=6d708197&scoped=true&lang=css&\"","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.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!./modalForm.vue?vue&type=style&index=0&id=01a987f9&scoped=true&lang=css&\"","export * from \"-!../../../node_modules/mini-css-extract-plugin/dist/loader.js??ref--6-oneOf-1-0!../../../node_modules/css-loader/dist/cjs.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!./modalFormPassword.vue?vue&type=style&index=0&id=003fe8f0&scoped=true&lang=css&\"","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[_c('a-modal',{attrs:{\"centered\":\"\",\"bodyStyle\":{ padding: 0 },\"visible\":_vm.visible,\"closable\":false,\"footer\":null}},[_c('div',{staticClass:\"custom-modal-header\"},[_c('label',{staticClass:\"custom-modal-header-title fs-20\"},[_vm._v(\" \"+_vm._s(_vm.$t('กรุณากรอกเลขบัตรประชาชน 4 หลักสุดท้ายเพื่อยืนยันตัวตนก่อนใช้คูปอง'))+\" \")])]),_c('div',{staticStyle:{\"width\":\"100%\",\"display\":\"inline-block\"}},[_c('div',{staticClass:\"custom-modal-body\"},[(_vm.visible_password)?_c('div',{staticClass:\"dots-width\"},[_c('span',{staticClass:\"dot animated\",style:({\n                            'margin-left': 0,\n                        })},[_c('span',{staticClass:\"show-password\",style:({\n                                'margin-left': _vm.marginPassword(_vm.password[0]),\n                            })},[_vm._v(_vm._s(_vm.password[0]))])]),_c('span',{staticClass:\"dot animated\"},[_c('span',{staticClass:\"show-password\",style:({\n                                'margin-left': _vm.marginPassword(_vm.password[1]),\n                            })},[_vm._v(_vm._s(_vm.password[1]))])]),_c('span',{staticClass:\"dot animated\"},[_c('span',{staticClass:\"show-password\",style:({\n                                'margin-left': _vm.marginPassword(_vm.password[2]),\n                            })},[_vm._v(_vm._s(_vm.password[2]))])]),_c('span',{staticClass:\"dot animated\"},[_c('span',{staticClass:\"show-password\",style:({\n                                'margin-left': _vm.marginPassword(_vm.password[3]),\n                            })},[_vm._v(_vm._s(_vm.password[3]))])])]):_c('div',{staticClass:\"dots-width\"},[_c('span',{staticClass:\"dot animated\",style:({\n                            'margin-left': 0,\n                            'background-color': _vm.password.length > 0 ? '#cc0000' : 'transparent',\n                        })}),_c('span',{staticClass:\"dot animated\",style:({\n                            'background-color': _vm.password.length > 1 ? '#cc0000' : 'transparent',\n                        })}),_c('span',{staticClass:\"dot animated\",style:({\n                            'background-color': _vm.password.length > 2 ? '#cc0000' : 'transparent',\n                        })}),_c('span',{staticClass:\"dot animated\",style:({\n                            'background-color': _vm.password.length > 3 ? '#cc0000' : 'transparent',\n                        })})]),_c('span',{staticClass:\"eye\",style:({\n                        'padding-right': _vm.$device == 'mobile' ? '' : '25%',\n                    })},[_c('a-icon',{class:\"icon-eye\",style:({ fontSize: '30px' }),attrs:{\"type\":_vm.visible_password ? 'eye' : 'eye-invisible'},on:{\"click\":function($event){_vm.visible_password = !_vm.visible_password}}})],1),_c('div',{staticClass:\"center1\"},[_c('div',{staticClass:\"pinC animated bounceInUp\"},[_c('div',{staticClass:\"pinB\",attrs:{\"nr\":\"1\"},on:{\"click\":function($event){return _vm.onPinPress(1)}}},[_c('label',{staticClass:\"pin_T\"},[_vm._v(\"1\")])]),_c('div',{staticClass:\"pinB\",attrs:{\"nr\":\"2\"},on:{\"click\":function($event){return _vm.onPinPress(2)}}},[_c('label',{staticClass:\"pin_T\"},[_vm._v(\"2\")])]),_c('div',{staticClass:\"pinB\",attrs:{\"nr\":\"3\"},on:{\"click\":function($event){return _vm.onPinPress(3)}}},[_c('label',{staticClass:\"pin_T\"},[_vm._v(\"3\")])]),_c('div',{staticClass:\"pinB\",attrs:{\"nr\":\"4\"},on:{\"click\":function($event){return _vm.onPinPress(4)}}},[_c('label',{staticClass:\"pin_T\"},[_vm._v(\"4\")])]),_c('div',{staticClass:\"pinB\",attrs:{\"nr\":\"5\"},on:{\"click\":function($event){return _vm.onPinPress(5)}}},[_c('label',{staticClass:\"pin_T\"},[_vm._v(\"5\")])]),_c('div',{staticClass:\"pinB\",attrs:{\"nr\":\"6\"},on:{\"click\":function($event){return _vm.onPinPress(6)}}},[_c('label',{staticClass:\"pin_T\"},[_vm._v(\"6\")])]),_c('div',{staticClass:\"pinB\",attrs:{\"nr\":\"7\"},on:{\"click\":function($event){return _vm.onPinPress(7)}}},[_c('label',{staticClass:\"pin_T\"},[_vm._v(\"7\")])]),_c('div',{staticClass:\"pinB\",attrs:{\"nr\":\"8\"},on:{\"click\":function($event){return _vm.onPinPress(8)}}},[_c('label',{staticClass:\"pin_T\"},[_vm._v(\"8\")])]),_c('div',{staticClass:\"pinB\",attrs:{\"nr\":\"9\"},on:{\"click\":function($event){return _vm.onPinPress(9)}}},[_c('label',{staticClass:\"pin_T\"},[_vm._v(\"9\")])]),_c('div',{staticClass:\"pinB\"}),_c('div',{staticClass:\"pinB\",attrs:{\"nr\":\"0\"},on:{\"click\":function($event){return _vm.onPinPress(0)}}},[_c('label',{staticClass:\"pin_T\"},[_vm._v(\"0\")])]),_c('div',{staticClass:\"pinB pDelete\",on:{\"click\":function($event){return _vm.onPinPress('del')}}},[_c('label',{staticClass:\"pin_T pDelete\"},[_vm._v(\"ลบ\")])])])])])]),_c('div',{staticClass:\"custom-modal-footer\"},[_c('div',{staticStyle:{\"width\":\"100%\"}},[_c('a-button',{staticClass:\"text-center gray ant-button-label-custom fs-20\",on:{\"click\":function($event){return _vm.cancel()}}},[_vm._v(\" ยกเลิก \")]),_c('a-button',{staticClass:\"custom-modal-footer-single-confirm-btn ml-16 fs-20\",on:{\"click\":function($event){return _vm.create()}}},[_vm._v(\" ยืนยัน \")])],1)])])],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n    <div>\r\n        <a-modal centered :bodyStyle=\"{ padding: 0 }\" :visible=\"visible\" :closable=\"false\" :footer=\"null\">\r\n            <!-- header -->\r\n            <div class=\"custom-modal-header\">\r\n                <label class=\"custom-modal-header-title fs-20\">\r\n                    {{ $t('กรุณากรอกเลขบัตรประชาชน 4 หลักสุดท้ายเพื่อยืนยันตัวตนก่อนใช้คูปอง') }}\r\n                </label>\r\n            </div>\r\n            <div style=\"width: 100%; display: inline-block\">\r\n                <div class=\"custom-modal-body\">\r\n                    <div class=\"dots-width\" v-if=\"visible_password\">\r\n                        <span\r\n                            class=\"dot animated\"\r\n                            :style=\"{\r\n                                'margin-left': 0,\r\n                            }\"\r\n                            ><span\r\n                                class=\"show-password\"\r\n                                :style=\"{\r\n                                    'margin-left': marginPassword(password[0]),\r\n                                }\"\r\n                                >{{ password[0] }}</span\r\n                            ></span\r\n                        >\r\n                        <span class=\"dot animated\"\r\n                            ><span\r\n                                class=\"show-password\"\r\n                                :style=\"{\r\n                                    'margin-left': marginPassword(password[1]),\r\n                                }\"\r\n                                >{{ password[1] }}</span\r\n                            ></span\r\n                        >\r\n                        <span class=\"dot animated\"\r\n                            ><span\r\n                                class=\"show-password\"\r\n                                :style=\"{\r\n                                    'margin-left': marginPassword(password[2]),\r\n                                }\"\r\n                                >{{ password[2] }}</span\r\n                            ></span\r\n                        >\r\n                        <span class=\"dot animated\"\r\n                            ><span\r\n                                class=\"show-password\"\r\n                                :style=\"{\r\n                                    'margin-left': marginPassword(password[3]),\r\n                                }\"\r\n                                >{{ password[3] }}</span\r\n                            ></span\r\n                        >\r\n                    </div>\r\n                    <div class=\"dots-width\" v-else>\r\n                        <span\r\n                            class=\"dot animated\"\r\n                            :style=\"{\r\n                                'margin-left': 0,\r\n                                'background-color': password.length > 0 ? '#cc0000' : 'transparent',\r\n                            }\"\r\n                        ></span>\r\n                        <span\r\n                            class=\"dot animated\"\r\n                            :style=\"{\r\n                                'background-color': password.length > 1 ? '#cc0000' : 'transparent',\r\n                            }\"\r\n                        ></span>\r\n                        <span\r\n                            class=\"dot animated\"\r\n                            :style=\"{\r\n                                'background-color': password.length > 2 ? '#cc0000' : 'transparent',\r\n                            }\"\r\n                        ></span>\r\n                        <span\r\n                            class=\"dot animated\"\r\n                            :style=\"{\r\n                                'background-color': password.length > 3 ? '#cc0000' : 'transparent',\r\n                            }\"\r\n                        ></span>\r\n                    </div>\r\n                    <span\r\n                        class=\"eye\"\r\n                        :style=\"{\r\n                            'padding-right': $device == 'mobile' ? '' : '25%',\r\n                        }\"\r\n                        ><a-icon @click=\"visible_password = !visible_password\" :type=\"visible_password ? 'eye' : 'eye-invisible'\" :style=\"{ fontSize: '30px' }\" :class=\"`icon-eye`\"\r\n                    /></span>\r\n                    <div class=\"center1\">\r\n                        <div class=\"pinC animated bounceInUp\">\r\n                            <div class=\"pinB\" nr=\"1\" @click=\"onPinPress(1)\">\r\n                                <label class=\"pin_T\">1</label>\r\n                            </div>\r\n                            <div class=\"pinB\" nr=\"2\" @click=\"onPinPress(2)\">\r\n                                <label class=\"pin_T\">2</label>\r\n                            </div>\r\n                            <div class=\"pinB\" nr=\"3\" @click=\"onPinPress(3)\">\r\n                                <label class=\"pin_T\">3</label>\r\n                            </div>\r\n                            <div class=\"pinB\" nr=\"4\" @click=\"onPinPress(4)\">\r\n                                <label class=\"pin_T\">4</label>\r\n                            </div>\r\n                            <div class=\"pinB\" nr=\"5\" @click=\"onPinPress(5)\">\r\n                                <label class=\"pin_T\">5</label>\r\n                            </div>\r\n                            <div class=\"pinB\" nr=\"6\" @click=\"onPinPress(6)\">\r\n                                <label class=\"pin_T\">6</label>\r\n                            </div>\r\n                            <div class=\"pinB\" nr=\"7\" @click=\"onPinPress(7)\">\r\n                                <label class=\"pin_T\">7</label>\r\n                            </div>\r\n                            <div class=\"pinB\" nr=\"8\" @click=\"onPinPress(8)\">\r\n                                <label class=\"pin_T\">8</label>\r\n                            </div>\r\n                            <div class=\"pinB\" nr=\"9\" @click=\"onPinPress(9)\">\r\n                                <label class=\"pin_T\">9</label>\r\n                            </div>\r\n                            <div class=\"pinB\"></div>\r\n                            <div class=\"pinB\" nr=\"0\" @click=\"onPinPress(0)\">\r\n                                <label class=\"pin_T\">0</label>\r\n                            </div>\r\n                            <div class=\"pinB pDelete\" @click=\"onPinPress('del')\">\r\n                                <label class=\"pin_T pDelete\">ลบ</label>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n            <!-- footer -->\r\n            <div class=\"custom-modal-footer\">\r\n                <div style=\"width: 100%\">\r\n                    <a-button class=\"text-center gray ant-button-label-custom fs-20\" @click=\"cancel()\"> ยกเลิก </a-button>\r\n                    <a-button class=\"custom-modal-footer-single-confirm-btn ml-16 fs-20\" @click=\"create()\"> ยืนยัน </a-button>\r\n                </div>\r\n            </div>\r\n        </a-modal>\r\n    </div>\r\n</template>\r\n<script>\r\nexport default {\r\n    props: ['visible', 'data'],\r\n    beforeCreate() {\r\n        this.form = this.$form.createForm(this, { name: 'form_in_modal' });\r\n    },\r\n    data() {\r\n        return {\r\n            visible_password: false,\r\n            password: '',\r\n        };\r\n    },\r\n    methods: {\r\n        cancel() {\r\n            this.$emit('on-cancel');\r\n        },\r\n        create() {\r\n            this.$emit('on-save', this.password);\r\n        },\r\n        onPinPress(pin) {\r\n            if (pin == 'del') {\r\n                this.password = this.password.slice(0, -1);\r\n            } else {\r\n                if (this.password.length >= 4) return;\r\n                this.password += String(pin);\r\n            }\r\n        },\r\n        marginPassword(value) {\r\n            var margin = '';\r\n            if (value == 0) {\r\n                margin = '-6.3px';\r\n            } else if (value == 1) {\r\n                margin = '-4px';\r\n            } else if (value == 2) {\r\n                margin = '-5px';\r\n            } else if (value == 3) {\r\n                margin = '-5px';\r\n            } else if (value == 4) {\r\n                margin = '-6px';\r\n            } else if (value == 6) {\r\n                margin = '-6px';\r\n            } else if (value == 8) {\r\n                margin = '-6px';\r\n            } else if (value == 9) {\r\n                margin = '-6px';\r\n            }\r\n\r\n            return margin;\r\n        },\r\n    },\r\n};\r\n</script>\r\n<style scoped>\r\n.custom-modal-header {\r\n    background: transparent;\r\n    padding: 16px 10px;\r\n    padding-bottom: 0;\r\n    text-align: center;\r\n}\r\n.custom-modal-header-title {\r\n    color: #141322 !important;\r\n    font-weight: 600;\r\n}\r\n.custom-modal-body {\r\n    background: transparent;\r\n    padding: 16px 10px;\r\n    padding-bottom: 0;\r\n    text-align: center;\r\n}\r\n.custom-modal-body-detail {\r\n    color: #141322 !important;\r\n    font-size: 14px;\r\n}\r\n.custom-modal-footer {\r\n    background: transparent;\r\n    padding: 16px 10px;\r\n    text-align: center;\r\n}\r\n.custom-modal-footer-single-confirm-btn {\r\n    background: linear-gradient(0deg, #ff7105, #ff9500 100%) no-repeat;\r\n    color: #fff;\r\n}\r\n.custom-modal-footer-single-close-btn {\r\n    background: linear-gradient(0deg, #ff7105, #ff9500 100%) no-repeat;\r\n    color: #fff;\r\n    width: 100%;\r\n}\r\n.pinC {\r\n    display: block;\r\n    position: relative;\r\n    width: 270px;\r\n    height: 220px;\r\n    margin: 0 auto;\r\n}\r\n.pinC > .pinB {\r\n    position: relative;\r\n    float: left;\r\n    width: calc(270px / 3);\r\n    height: calc(220px / 3);\r\n    text-align: center;\r\n    /* line-height: 3; */\r\n    -webkit-transition: all 0.2s ease;\r\n    -moz-transition: all 0.2s ease;\r\n    -o-transition: all 0.2s ease;\r\n    transition: all 0.2s ease;\r\n    -webkit-touch-callout: none;\r\n    -webkit-user-select: none;\r\n    -khtml-user-select: none;\r\n    -moz-user-select: none;\r\n    -ms-user-select: none;\r\n    user-select: none;\r\n}\r\n.pinC > .pinB:not(.empty) {\r\n    /* background-color: #dcdcdc; */\r\n    background-color: transparent;\r\n    border: 2px solid #ffffff;\r\n}\r\n.pinC > .pinB:not(.empty):hover {\r\n    /*     border: 2px dotted #fefefe; */\r\n    cursor: pointer;\r\n}\r\n.pinC > .pinB:not(.empty)::before {\r\n    content: ' ';\r\n    position: absolute;\r\n    top: 0;\r\n    left: 0;\r\n    right: 0;\r\n    bottom: 0;\r\n    width: 100%;\r\n    height: 100%;\r\n    background-color: rgba(100, 100, 100, 0);\r\n    /* background-color: transparent; */\r\n    -webkit-transition: all 0.4s ease;\r\n    -moz-transition: all 0.4s ease;\r\n    -o-transition: all 0.4s ease;\r\n    transition: all 0.4s ease;\r\n    -webkit-touch-callout: none;\r\n    -webkit-user-select: none;\r\n    -khtml-user-select: none;\r\n    -moz-user-select: none;\r\n    -ms-user-select: none;\r\n    user-select: none;\r\n}\r\n.pinC > .pinB:not(.empty):active::before {\r\n    background-color: rgba(200, 200, 200, 0.45);\r\n}\r\n.pinC > .pinB > .pin_T {\r\n    /* position: absolute;\r\n  width: 100%;\r\n  left: 0%;\r\n  height: 100%; */\r\n    position: absolute;\r\n    left: 50%;\r\n    top: 50%;\r\n    -webkit-transform: translate(-50%, -50%);\r\n    transform: translate(-50%, -50%);\r\n    font-size: 26px;\r\n    font-weight: 600;\r\n}\r\n.pin_T.pDelete {\r\n    font-weight: 300 !important;\r\n}\r\n.pinC > .pinB > .pin_t {\r\n    font-size: 75%;\r\n    position: absolute;\r\n    bottom: -5px;\r\n    left: 50%;\r\n    color: darkgrey;\r\n    transform: translate(-50%, 0);\r\n}\r\n.pinC > .pinB.input > .pinpart {\r\n    border: 2px solid #000000;\r\n    border-radius: 50%;\r\n    float: left;\r\n    width: 10px;\r\n    height: 10px;\r\n    position: relative;\r\n    top: calc(50% - 5px);\r\n    margin-left: 4.5px;\r\n    background-color: rgba(100, 100, 100, 0);\r\n    /* background-color: transparent; */\r\n    -webkit-transition: all 0.4s ease;\r\n    -moz-transition: all 0.4s ease;\r\n    -o-transition: all 0.4s ease;\r\n    transition: all 0.4s ease;\r\n    -webkit-touch-callout: none;\r\n    -webkit-user-select: none;\r\n    -khtml-user-select: none;\r\n    -moz-user-select: none;\r\n    -ms-user-select: none;\r\n    user-select: none;\r\n}\r\n.pinC > .pinB.input > .pinpart.active {\r\n    background-color: #000000;\r\n}\r\n.confirmed {\r\n    animation: removec ease-out 1s;\r\n    animation-iteration-count: 1;\r\n    transform-origin: 0% 50%;\r\n    animation-fill-mode: forwards;\r\n    /*when the spec is finished*/\r\n    -webkit-animation: removec ease-out 1s;\r\n    -webkit-animation-iteration-count: 1;\r\n    -webkit-transform-origin: 0% 50%;\r\n    -webkit-animation-fill-mode: forwards;\r\n    /*Chrome 16+, Safari 4+*/\r\n    -moz-animation: removec ease-out 1s;\r\n    -moz-animation-iteration-count: 1;\r\n    -moz-transform-origin: 0% 50%;\r\n    -moz-animation-fill-mode: forwards;\r\n    /*FF 5+*/\r\n    -o-animation: removec ease-out 1s;\r\n    -o-animation-iteration-count: 1;\r\n    -o-transform-origin: 0% 50%;\r\n    -o-animation-fill-mode: forwards;\r\n    /*Not implemented yet*/\r\n    -ms-animation: removec ease-out 1s;\r\n    -ms-animation-iteration-count: 1;\r\n    -ms-transform-origin: 0% 50%;\r\n    -ms-animation-fill-mode: forwards;\r\n    /*IE 10+*/\r\n}\r\n@keyframes removec {\r\n    0% {\r\n        opacity: 1;\r\n        transform: translate(0px, 0px) scaleX(1);\r\n    }\r\n    20% {\r\n        opacity: 1;\r\n        transform: translate(0px, 10px) scaleX(1);\r\n    }\r\n    25% {\r\n        transform: translate(0px, 0px) scaleX(1);\r\n    }\r\n    27% {\r\n        opacity: 0;\r\n        transform: translate(0px, 0px) scaleX(0);\r\n    }\r\n    100% {\r\n        opacity: 0;\r\n        transform: translate(0px, 0px) scaleX(0);\r\n    }\r\n}\r\n@-moz-keyframes removec {\r\n    0% {\r\n        opacity: 1;\r\n        -moz-transform: translate(0px, 0px) scaleX(1);\r\n    }\r\n    20% {\r\n        opacity: 1;\r\n        -moz-transform: translate(0px, 10px) scaleX(1);\r\n    }\r\n    25% {\r\n        -moz-transform: translate(0px, 0px) scaleX(1);\r\n    }\r\n    27% {\r\n        opacity: 0;\r\n        -moz-transform: translate(0px, 0px) scaleX(0);\r\n    }\r\n    100% {\r\n        opacity: 0;\r\n        -moz-transform: translate(0px, 0px) scaleX(0);\r\n    }\r\n}\r\n@-webkit-keyframes removec {\r\n    0% {\r\n        opacity: 1;\r\n        -webkit-transform: translate(0px, 0px) scaleX(1);\r\n    }\r\n    20% {\r\n        opacity: 1;\r\n        -webkit-transform: translate(0px, 10px) scaleX(1);\r\n    }\r\n    25% {\r\n        -webkit-transform: translate(0px, 0px) scaleX(1);\r\n    }\r\n    27% {\r\n        opacity: 0;\r\n        -webkit-transform: translate(0px, 0px) scaleX(0);\r\n    }\r\n    100% {\r\n        opacity: 0;\r\n        -webkit-transform: translate(0px, 0px) scaleX(0);\r\n    }\r\n}\r\n@-o-keyframes removec {\r\n    0% {\r\n        opacity: 1;\r\n        -o-transform: translate(0px, 0px) scaleX(1);\r\n    }\r\n    20% {\r\n        opacity: 1;\r\n        -o-transform: translate(0px, 10px) scaleX(1);\r\n    }\r\n    25% {\r\n        -o-transform: translate(0px, 0px) scaleX(1);\r\n    }\r\n    27% {\r\n        opacity: 0;\r\n        -o-transform: translate(0px, 0px) scaleX(0);\r\n    }\r\n    100% {\r\n        opacity: 0;\r\n        -o-transform: translate(0px, 0px) scaleX(0);\r\n    }\r\n}\r\n@-ms-keyframes removec {\r\n    0% {\r\n        opacity: 1;\r\n        -ms-transform: translate(0px, 0px) scaleX(1);\r\n    }\r\n    20% {\r\n        opacity: 1;\r\n        -ms-transform: translate(0px, 10px) scaleX(1);\r\n    }\r\n    25% {\r\n        -ms-transform: translate(0px, 0px) scaleX(1);\r\n    }\r\n    27% {\r\n        opacity: 0;\r\n        -ms-transform: translate(0px, 0px) scaleX(0);\r\n    }\r\n    100% {\r\n        opacity: 0;\r\n        -ms-transform: translate(0px, 0px) scaleX(0);\r\n    }\r\n}\r\n.dots-width {\r\n    width: 100%;\r\n    margin: 0 auto;\r\n}\r\n.dot {\r\n    border: 2px solid #bbb;\r\n    border-radius: 50%;\r\n    width: 35px;\r\n    height: 35px;\r\n    display: inline-block;\r\n    margin-left: 22px;\r\n}\r\n.footer-label {\r\n    padding: 0;\r\n    font-weight: 300;\r\n    color: #cc0000;\r\n    margin-top: 12px;\r\n}\r\n.เข้าใช้งานด้วยหมายเลขสมาชิกอื่น {\r\n    text-align: left;\r\n    width: 50%;\r\n}\r\n.ลืมรหัส {\r\n    text-align: right;\r\n    width: 50%;\r\n}\r\n.container-password {\r\n    padding: 20px 16px;\r\n    text-align: center;\r\n    border: unset;\r\n    box-shadow: unset !important;\r\n    /* width: 90%; */\r\n    width: 260px;\r\n    background-color: #fff !important;\r\n    border-radius: 0;\r\n    position: absolute;\r\n    left: 50%;\r\n    top: 50%;\r\n    -webkit-transform: translate(-50%, -50%);\r\n    transform: translate(-50%, -50%);\r\n}\r\n.container-password.is-desktop,\r\n.container-password.is-tablet {\r\n    /* width: auto; */\r\n    width: 360px;\r\n}\r\n.container_forgot_password {\r\n    padding: 8px;\r\n    text-align: center;\r\n    border: unset;\r\n    box-shadow: unset !important;\r\n    width: 260px;\r\n    background-color: #fff !important;\r\n    border-radius: 0;\r\n    position: absolute;\r\n    left: 50%;\r\n    top: 50%;\r\n    -webkit-transform: translate(-50%, -50%);\r\n    transform: translate(-50%, -50%);\r\n}\r\n.container_forgot_password.is-desktop,\r\n.container_forgot_password.is-tablet {\r\n    width: 360px;\r\n}\r\n.icon-eye {\r\n    margin-left: 16px;\r\n}\r\n.eye {\r\n    float: right;\r\n    padding-right: 25px;\r\n    vertical-align: top;\r\n    margin-top: -34px;\r\n}\r\n.show-password {\r\n    text-align: center;\r\n    color: #000000;\r\n    font-size: 22px;\r\n    text-align: center;\r\n    position: absolute;\r\n    margin-left: -4.4px;\r\n    margin-top: -2px;\r\n    /* position: fixed;\r\n    top: 34%;\r\n    margin-left: -207px; */\r\n}\r\n/* font-weight: 600;\r\n    margin-top: -4px;\r\n    margin-left: -3.5px;\r\n    text-align: center;\r\n    position: absolute; */\r\n\r\n@media (max-device-width: 413px) {\r\n    .pinC {\r\n        width: 270px;\r\n        height: 220px;\r\n    }\r\n    .pinC > .pinB {\r\n        width: calc(270px / 3);\r\n        height: calc(220px / 3);\r\n    }\r\n    .pinC > .pinB > .pin_T {\r\n        font-size: 25px;\r\n    }\r\n    .dot {\r\n        border: 2px solid #bbb;\r\n        border-radius: 50%;\r\n        width: 33px;\r\n        height: 33px;\r\n        display: inline-block;\r\n        margin-left: 20px;\r\n    }\r\n    .eye {\r\n        float: right;\r\n        padding-right: 25px;\r\n        vertical-align: top;\r\n        margin-top: -34px;\r\n    }\r\n    .show-password {\r\n        text-align: center;\r\n        color: #000000;\r\n        font-size: 22px;\r\n        text-align: center;\r\n        position: absolute;\r\n        margin-left: -4.4px;\r\n        margin-top: -3px;\r\n        /* position: fixed;\r\n    top: 34%;\r\n    margin-left: -207px; */\r\n    }\r\n}\r\n@media (max-device-width: 374px) {\r\n    .dots-width {\r\n        width: 80%;\r\n    }\r\n    .dot {\r\n        width: 30px;\r\n        height: 30px;\r\n        margin-left: 20px;\r\n    }\r\n    .pinC {\r\n        width: 250px;\r\n        height: 200px;\r\n    }\r\n    .pinC > .pinB {\r\n        width: calc(250px / 3);\r\n        height: calc(200px / 3);\r\n    }\r\n    .pinC > .pinB > .pin_T {\r\n        font-size: 25px;\r\n    }\r\n    .eye {\r\n        float: right;\r\n        padding-right: 10px;\r\n        vertical-align: top;\r\n        margin-top: -34px;\r\n    }\r\n    .show-password {\r\n        margin-top: -4px;\r\n    }\r\n}\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!./modalFormPassword.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!./modalFormPassword.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./modalFormPassword.vue?vue&type=template&id=003fe8f0&scoped=true&\"\nimport script from \"./modalFormPassword.vue?vue&type=script&lang=js&\"\nexport * from \"./modalFormPassword.vue?vue&type=script&lang=js&\"\nimport style0 from \"./modalFormPassword.vue?vue&type=style&index=0&id=003fe8f0&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  \"003fe8f0\",\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',[(_vm.data.step == 'back')?[_c('a-modal',{attrs:{\"centered\":\"\",\"bodyStyle\":{ padding: 0 },\"visible\":_vm.visible,\"closable\":false,\"footer\":null}},[_c('div',{staticClass:\"custom-modal-header\"},[_c('label',{staticClass:\"custom-modal-header-title\"},[_vm._v(\" \"+_vm._s(_vm.data.title)+\" \")])]),_c('div',{staticClass:\"custom-modal-body\"},[_c('label',{staticClass:\"custom-modal-body-detail\",domProps:{\"innerHTML\":_vm._s(_vm.data.message)}})]),_c('div',{staticClass:\"custom-modal-footer\"},[_c('a-button',{key:\"back\",staticClass:\"text-center gray ant-button-label-custom\",on:{\"click\":function($event){return _vm.cancel()}}},[_vm._v(\" \"+_vm._s(_vm.$t('ยกเลิก'))+\" \")]),_c('a-button',{key:\"back\",staticClass:\"custom-modal-footer-single-confirm-btn ml-16\",on:{\"click\":function($event){return _vm.confirm()}}},[_vm._v(\" \"+_vm._s(_vm.$t('ยืนยัน'))+\" \")])],1)])]:(_vm.data.step == 'error')?[_c('a-modal',{attrs:{\"centered\":\"\",\"bodyStyle\":{ padding: 0 },\"visible\":_vm.visible,\"closable\":false,\"footer\":null}},[_c('div',{staticClass:\"custom-modal-body\"},[_c('label',{staticClass:\"custom-modal-body-detail\",domProps:{\"innerHTML\":_vm._s(_vm.data.message)}})]),_c('div',{staticClass:\"custom-modal-footer\"},[_c('a-button',{key:\"back\",staticClass:\"custom-modal-footer-single-close-btn\",staticStyle:{\"width\":\"100% !important\"},on:{\"click\":function($event){return _vm.onCloseError()}}},[_vm._v(\" \"+_vm._s(_vm.$t('ปิดหน้าต่าง'))+\" \")])],1)])]:[_c('a-modal',{attrs:{\"centered\":\"\",\"bodyStyle\":{ padding: 0 },\"visible\":_vm.visible,\"closable\":false,\"footer\":null}},[_c('div',{staticClass:\"custom-modal-body\"},[_c('label',{staticClass:\"custom-modal-body-detail\",domProps:{\"innerHTML\":_vm._s(_vm.data.message)}})]),_c('div',{staticClass:\"custom-modal-footer\"},[_c('a-button',{key:\"back\",staticClass:\"custom-modal-footer-single-close-btn\",staticStyle:{\"width\":\"100% !important\"},on:{\"click\":function($event){return _vm.cancel()}}},[_vm._v(\" \"+_vm._s(_vm.$t('ปิดหน้าต่าง'))+\" \")])],1)])]],2)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n    <div>\r\n        <template v-if=\"data.step == 'back'\">\r\n            <a-modal centered :bodyStyle=\"{ padding: 0 }\" :visible=\"visible\" :closable=\"false\" :footer=\"null\">\r\n                <div class=\"custom-modal-header\">\r\n                    <label class=\"custom-modal-header-title\">\r\n                        {{ data.title }}\r\n                    </label>\r\n                </div>\r\n                <div class=\"custom-modal-body\">\r\n                    <label class=\"custom-modal-body-detail\" v-html=\"data.message\"> </label>\r\n                </div>\r\n                <div class=\"custom-modal-footer\">\r\n                    <a-button key=\"back\" class=\"text-center gray ant-button-label-custom\" @click=\"cancel()\">\r\n                        {{ $t('ยกเลิก') }}\r\n                    </a-button>\r\n                    <a-button key=\"back\" class=\"custom-modal-footer-single-confirm-btn ml-16\" @click=\"confirm()\">\r\n                        {{ $t('ยืนยัน') }}\r\n                    </a-button>\r\n                </div>\r\n            </a-modal>\r\n        </template>\r\n        <template v-else-if=\"data.step == 'error'\">\r\n            <a-modal centered :bodyStyle=\"{ padding: 0 }\" :visible=\"visible\" :closable=\"false\" :footer=\"null\">\r\n                <div class=\"custom-modal-body\">\r\n                    <label class=\"custom-modal-body-detail\" v-html=\"data.message\"> </label>\r\n                </div>\r\n                <!-- footer -->\r\n                <div class=\"custom-modal-footer\">\r\n                    <a-button key=\"back\" class=\"custom-modal-footer-single-close-btn\" style=\"width: 100% !important\" @click=\"onCloseError()\">\r\n                        {{ $t('ปิดหน้าต่าง') }}\r\n                    </a-button>\r\n                </div>\r\n            </a-modal>\r\n        </template>\r\n        <template v-else>\r\n            <a-modal centered :bodyStyle=\"{ padding: 0 }\" :visible=\"visible\" :closable=\"false\" :footer=\"null\">\r\n                <div class=\"custom-modal-body\">\r\n                    <label class=\"custom-modal-body-detail\" v-html=\"data.message\"> </label>\r\n                </div>\r\n                <!-- footer -->\r\n                <div class=\"custom-modal-footer\">\r\n                    <a-button key=\"back\" class=\"custom-modal-footer-single-close-btn\" style=\"width: 100% !important\" @click=\"cancel()\">\r\n                        {{ $t('ปิดหน้าต่าง') }}\r\n                    </a-button>\r\n                </div>\r\n            </a-modal>\r\n        </template>\r\n    </div>\r\n</template>\r\n<script>\r\nexport default {\r\n    props: ['visible', 'data'],\r\n    beforeCreate() {\r\n        this.form = this.$form.createForm(this, { name: 'form_in_modal' });\r\n    },\r\n    data() {\r\n        return {};\r\n    },\r\n    mounted() {\r\n        console.log('visible s', this.visible);\r\n        console.log('data', this.data);\r\n    },\r\n    methods: {\r\n        cancel() {\r\n            this.$emit('on-cancel');\r\n        },\r\n        create() {\r\n            this.$emit('on-save');\r\n        },\r\n        confirm() {\r\n            this.$emit('on-confirm');\r\n        },\r\n        onCloseError() {\r\n            this.$router.push({\r\n                path: '/privilege',\r\n            });\r\n        },\r\n    },\r\n};\r\n</script>\r\n<style scoped>\r\n.custom-modal-header {\r\n    background: transparent;\r\n    padding: 16px 10px;\r\n    padding-bottom: 0;\r\n    text-align: center;\r\n}\r\n.custom-modal-header-title {\r\n    color: #000 !important;\r\n    font-size: 16px;\r\n    font-weight: 600;\r\n}\r\n.custom-modal-body {\r\n    color: #ff7105 !important;\r\n    background: transparent;\r\n    padding: 16px 10px;\r\n    padding-bottom: 0;\r\n    text-align: center;\r\n}\r\n.custom-modal-body-detail {\r\n    color: #000 !important;\r\n    font-size: 14px;\r\n    font-weight: 300;\r\n}\r\n.custom-modal-body-detail-2 {\r\n    color: #141322 !important;\r\n    font-size: 14px;\r\n    font-weight: 300;\r\n}\r\n.custom-modal-footer {\r\n    background: transparent;\r\n    padding: 16px 10px;\r\n    text-align: center;\r\n}\r\n.custom-modal-footer-single-confirm-btn {\r\n    background: linear-gradient(0deg, #ff7105, #ff9500 100%) no-repeat;\r\n    color: #fff;\r\n}\r\n.custom-modal-footer-single-close-btn {\r\n    background: linear-gradient(0deg, #ff7105, #ff9500 100%) no-repeat;\r\n    color: #fff;\r\n    width: 100%;\r\n}\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!./modalForm.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!./modalForm.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./modalForm.vue?vue&type=template&id=01a987f9&scoped=true&\"\nimport script from \"./modalForm.vue?vue&type=script&lang=js&\"\nexport * from \"./modalForm.vue?vue&type=script&lang=js&\"\nimport style0 from \"./modalForm.vue?vue&type=style&index=0&id=01a987f9&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  \"01a987f9\",\n  null\n  \n)\n\nexport default component.exports","var render = function () {var _vm=this;var _h=_vm.$createElement;var _c=_vm._self._c||_h;return _c('div',{staticStyle:{\"background-color\":\"#fff\",\"width\":\"100vw\",\"height\":\"100vh\"}},[_c('navbar',{attrs:{\"back_path\":_vm.back_path || '/sms/reward/' + _vm.member_id + '/' + _vm.priv_id_from_sms,\"hide_search\":true}}),_c('div',{staticClass:\"mt-24\"},[_c('div',{staticClass:\"text-center mt-16\",staticStyle:{\"margin\":\"8px\"}},[_c('img',{style:({ width: _vm.$device == 'mobile' ? '25%' : 'auto' }),attrs:{\"src\":\"/resources/images/icon-countdown-reward.png\"}}),_c('div',{staticClass:\"mt-16\"},[_c('label',{staticClass:\"title fs-20\"},[_vm._v(\" \"+_vm._s(_vm.reward.title)+\" \")])]),_c('div',{staticClass:\"mt-16\"},[_c('label',{staticClass:\"title-2 fs-20\",domProps:{\"innerHTML\":_vm._s(_vm.reward.plivilege)}})]),_c('div',{staticStyle:{\"margin\":\"16px 8px\"}},[_c('label',{staticClass:\"detail fs-20\"},[_vm._v(\" รหัสคูปองมีอายุ \"+_vm._s(Number(_vm.reward.count_time / 60))+\" นาที หลังกดปุ่ม \\\"ยืนยัน\\\" กรุณากดใช้คูปองต่อหน้าเจ้าหน้าที่ และศึกษาเงื่อนไขก่อนใช้บริการ \")])]),_c('div',{staticClass:\"text-center\"},[_c('a-button',{staticClass:\"gray ant-button-label-custom custom-btn fs-20\",on:{\"click\":function($event){return _vm.$router.replace({ path: '/sms/reward/' + _vm.member_id + '/' + _vm.priv_id_from_sms })}}},[_c('strong',[_vm._v(\"ยกเลิก\")])]),_c('a-button',{staticClass:\"primary-btn ant-button-label-custom custom-btn ml-16 fs-20\",on:{\"click\":function($event){return _vm.useReward($event, _vm.reward)}}},[_c('span',{staticClass:\"fs-18 color-white fw-600\"},[_vm._v(\"ยืนยัน\")])])],1)])]),_c('modal-form-password',{key:_vm.modal_visible,ref:\"modalFormPassword\",attrs:{\"visible\":_vm.modal_visible,\"data\":_vm.modal_data,\"step\":_vm.modal_step},on:{\"on-save\":_vm.onModalSave,\"on-cancel\":_vm.onModalCancel}}),_c('modal-form',{key:_vm.modal_visible2,ref:\"modalForm\",attrs:{\"visible\":_vm.modal_visible2,\"data\":_vm.modal_data2},on:{\"on-cancel\":_vm.onCancelModalError}})],1)}\nvar staticRenderFns = []\n\nexport { render, staticRenderFns }","<template>\r\n    <div style=\"background-color: #fff; width: 100vw; height: 100vh\">\r\n        <navbar :back_path=\"back_path || '/sms/reward/' + member_id + '/' + priv_id_from_sms\" :hide_search=\"true\" />\r\n        <div class=\"mt-24\">\r\n            <div class=\"text-center mt-16\" style=\"margin: 8px\">\r\n                <img src=\"/resources/images/icon-countdown-reward.png\" :style=\"{ width: $device == 'mobile' ? '25%' : 'auto' }\" />\r\n                <div class=\"mt-16\">\r\n                    <label class=\"title fs-20\"> {{ reward.title }} </label>\r\n                </div>\r\n                <div class=\"mt-16\">\r\n                    <label class=\"title-2 fs-20\" v-html=\"reward.plivilege\"> </label>\r\n                </div>\r\n                <div style=\"margin: 16px 8px\">\r\n                    <label class=\"detail fs-20\"> รหัสคูปองมีอายุ {{ Number(reward.count_time / 60) }} นาที หลังกดปุ่ม \"ยืนยัน\" กรุณากดใช้คูปองต่อหน้าเจ้าหน้าที่ และศึกษาเงื่อนไขก่อนใช้บริการ </label>\r\n                </div>\r\n                <div class=\"text-center\">\r\n                    <a-button class=\"gray ant-button-label-custom custom-btn fs-20\" @click=\"$router.replace({ path: '/sms/reward/' + member_id + '/' + priv_id_from_sms })\">\r\n                        <strong>ยกเลิก</strong>\r\n                    </a-button>\r\n                    <a-button class=\"primary-btn ant-button-label-custom custom-btn ml-16 fs-20\" @click=\"useReward($event, reward)\">\r\n                        <span class=\"fs-18 color-white fw-600\">ยืนยัน</span>\r\n                    </a-button>\r\n                </div>\r\n            </div>\r\n        </div>\r\n        <modal-form-password ref=\"modalFormPassword\" :key=\"modal_visible\" :visible=\"modal_visible\" :data=\"modal_data\" :step=\"modal_step\" @on-save=\"onModalSave\" @on-cancel=\"onModalCancel\" />\r\n        <modal-form ref=\"modalForm\" :key=\"modal_visible2\" :visible=\"modal_visible2\" :data=\"modal_data2\" @on-cancel=\"onCancelModalError\" />\r\n    </div>\r\n</template>\r\n<script>\r\nimport navbar from '../../components/navbar';\r\nimport modalFormPassword from './modalFormPassword';\r\nimport modalForm from './modalForm';\r\nexport default {\r\n    components: {\r\n        navbar,\r\n        modalFormPassword,\r\n        modalForm,\r\n    },\r\n    data: function () {\r\n        return {\r\n            modal_visible: false,\r\n            modal_visible2: false,\r\n            modal_data: {},\r\n            modal_data2: {},\r\n            reward: this.$route.query.reward,\r\n            back_path: this.$route.query.back_path,\r\n            member_id: this.$route.params.member_id,\r\n            priv_id: this.$route.params.priv_id,\r\n            priv_id_from_sms: this.$route.params.priv_id_from_sms,\r\n        };\r\n    },\r\n    methods: {\r\n        useReward(event) {\r\n            event.stopPropagation();\r\n            this.modal_visible = true;\r\n        },\r\n        onModalSave(password) {\r\n            if (password) {\r\n                if (password.length < 4) {\r\n                    this.modal_visible2 = true;\r\n                    this.modal_data2.message = 'กรุณากรอกข้อมูลให้ครบถ้วน';\r\n                } else {\r\n                    this.$store.dispatch('user/POST', {\r\n                        payload: {\r\n                            path: '/api/sms/reward/generate/' + this.member_id + '/' + this.priv_id,\r\n                            data: {\r\n                                password: password,\r\n                            },\r\n                            callback: (res) => {\r\n                                if (res && res.result == 'errors') {\r\n                                    // const errors = {\r\n                                    //     title: '',\r\n                                    // };\r\n                                    // for (const [, value] of Object.entries(res.errors)) {\r\n                                    //     errors.title += value[0];\r\n                                    // }\r\n                                    this.modal_visible2 = true;\r\n                                    this.modal_data2.message = 'ขออภัยท่านกรอกข้อมูลไม่ถูกต้อง กรุณากรอกใหม่อีกครั้ง';\r\n                                } else {\r\n                                    var url = '/sms/reward/code/' + this.member_id + '/' + this.priv_id_from_sms + '/' + this.priv_id;\r\n                                    this.$router.replace({\r\n                                        path: url,\r\n                                        query: {\r\n                                            reward_generate: res,\r\n                                        },\r\n                                    });\r\n                                }\r\n                            },\r\n                        },\r\n                    });\r\n                }\r\n            } else {\r\n                this.modal_visible2 = true;\r\n                this.modal_data2.message = 'กรุณากรอกข้อมูลให้ครบถ้วย';\r\n            }\r\n        },\r\n        onModalCancel() {\r\n            this.modal_visible = false;\r\n            this.$refs.modalFormPassword.form.resetFields();\r\n        },\r\n        onCancelModalError() {\r\n            this.modal_visible2 = false;\r\n            this.modal_data2 = {};\r\n        },\r\n    },\r\n};\r\n</script>\r\n<style scoped>\r\n.title {\r\n    font-weight: 600;\r\n    margin: 0;\r\n    color: #cc0000 !important;\r\n}\r\n.title-2 {\r\n    font-weight: 300;\r\n    margin: 0;\r\n    color: #000 !important;\r\n}\r\n.detail {\r\n    font-weight: 300;\r\n    margin: 0;\r\n    color: #000 !important;\r\n}\r\n.custom-btn {\r\n    border: 0;\r\n    border-radius: 0;\r\n    height: 32px;\r\n    line-height: 32px;\r\n}\r\n</style>","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!./use-reward.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!./use-reward.vue?vue&type=script&lang=js&\"","import { render, staticRenderFns } from \"./use-reward.vue?vue&type=template&id=6d708197&scoped=true&\"\nimport script from \"./use-reward.vue?vue&type=script&lang=js&\"\nexport * from \"./use-reward.vue?vue&type=script&lang=js&\"\nimport style0 from \"./use-reward.vue?vue&type=style&index=0&id=6d708197&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  \"6d708197\",\n  null\n  \n)\n\nexport default component.exports"],"sourceRoot":""}