https://static.surfit.io/js/chunks/858.085a296e83922f044639.js

1(this.webpackChunk=this.webpackChunk||[]).push([[858],{91858:(e,n,t)=>{"use strict";t.r(n),t.d(n,{default:()=>p});var i,r,o,a=t(10832),s=t(27040);function c(e){return(c="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}const l={name:"report",components:{ReportContainer:a.ZP.div(i||(r=["\n    .report-container {\n        width: 420px;\n        height: 496px;\n        background: ",";\n        box-shadow: ",";\n        border-radius: 15px;\n        .header {\n            position: relative;\n            display: flex;\n            align-items: center;\n            justify-content: center;\n            flex-direction: column;\n            text-align: center;\n            padding: 26px 0;\n            .title {\n                display: block;\n                font-weight: 700;\n                font-size: 20px;\n                line-height: 140%;\n                color: ",";\n            }\n            &:after {\n                position: absolute;\n                bottom: 0;\n                content: '';\n                width: 372px;\n                height: 1px;\n                background: ",";\n            }\n        }\n        .content-section {\n            .main {\n                padding: 30px 40px 12px 40px;\n                .radio {\n                    label {\n                        display: block;\n                        margin-bottom: 16px;\n                        margin-left: 10px;\n                    }\n                }\n            }\n            .footer {\n                display: flex;\n                padding: 30px 40px 40px 40px;\n                justify-content: flex-end;\n                align-items: center;\n                a {\n                    display: flex;\n                    align-items: center;\n                    .question-icon {\n                        margin-right: 4px;\n                        g {\n                            fill: ",";\n                        }\n                    }\n                    span {\n                        color: ",";\n                        font-size: 14px;\n                        line-height: 150%;\n                    }\n                }\n            }\n        }\n    }\n    // 768\n    @media screen and (max-width: ",") {\n        .report-container {\n            width: 400px;\n            height: 448px;\n            .header {\n                height: 60px;\n                padding: 20px 0 15px 0;\n                .title {\n                    font-weight: 600;\n                    font-size: 18px;\n                }\n                &::after {\n                    height: 0;\n                }\n            }\n            .content-section {\n                .main {\n                    padding: 30px 20px 12px 20px;\n                }\n                .footer {\n                    padding: 20px 20px 30px 20px;\n                }\n            }\n        }\n    }\n\n    @media screen and (max-width: 424px) {\n        .report-container {\n            height: initial;\n            width: calc(100vw - 24px);\n            .content-section {\n                max-height: calc(var(--vh) * 100 - 180px);\n                overflow-y: scroll;\n\n                &::-webkit-scrollbar-thumb,\n                &::-webkit-scrollbar {\n                    display: none;\n                }\n            }\n        }\n    }\n"],o||(o=r.slice(0)),i=Object.freeze(Object.defineProperties(r,{raw:{value:Object.freeze(o)}}))),(function(e){return e.theme.color.elevate[1]}),(function(e){return e.theme.shadow.large}),(function(e){return e.theme.color.text.primary}),(function(e){return e.theme.color.border.normal}),(function(e){return e.theme.color.text.secondary}),(function(e){return e.theme.color.text.secondary}),(function(e){return e.theme.token.media.screen.mobile}))},props:{id:{type:String},targetType:{type:String},targetId:{type:String},modalOpen:{type:Boolean,default:!1}},computed:{hasContent:function(){return null!==this.reportType||""!==this.description.trim()}},watch:{},data:function(){return{isLoading:!1,reportTypeList:[{text:"제대로 작동하지 않아요",value:"ERROR"},{text:"불편하거나 부적절한 내용이 포함됐어요",value:"HATE"},{text:"저작권·도용 등 불법적인 내용이 포함됐어요",value:"ILLEGAL"},{text:"기타",value:"ETC"}],reportType:null,description:"",screen:null}},methods:{onModalClose:function(e){var n=this;this.hasContent?this.$feedback.confirm({title:"입력 화면을<br/>닫으시겠어요?",message:"입력하신 정보는 저장되지 않습니다.",confirmText:"닫기",confirmFeel:"negative",confirmCallback:function(){n.$modal.close(n.id)},cancelText:"잠깐만요",cancelCallback:function(){e()}}

1):this.$modal.close(this.id)},submitReport:function(){var e=this;if(document.activeElement.blur(),this.isLoading)return!1;if(!this.reportType)return this.$feedback.alert({message:"리포트 유형을 선택해주세요."}),!1;if("ETC"===this.reportType&&""===this.description.trim())return this.$feedback.alert({message:"리포트 내용을 입력해주세요."}),!1;this.isLoading=!0;var n={};document.referrer&&(n.referrer=document.referrer),n.appVersion=context.version,this.screen&&"object"===c(this.screen)&&"function"==typeof this.screen.toDataURL&&(n.attachScreen=this.screen.toDataURL("image/jpeg",.5)),n.currentPage=location.href,n.targetType=this.targetType,n.targetId=this.targetId,n.reportType=this.reportType,n.description=this.description;return new Promise((function(t,i){(0,s.default)().post("/service/report",n).then((function(e){return e.data})).then((function(n){e.isLoading=!1,e.$feedback.alert({title:"리포트를 전달했어요",confirmText:"확인",confirmCallback:function(){return e.$modal.close(e.id)}}),t()})).catch((function(){e.isLoading=!1,e.$feedback.alert({title:"앗, 처리하는 동안 서버에 문제가 생겼어요",message:"잠시 후 다시 시도해주세요."})}))}))}},beforeCreate:function(){var e=this;t.e(5).then(t.t.bind(t,61120,23)).then((function(e){return(0,e.default)(document.body,{foreignObjectRendering:!0,backgroundColor:document.body.style.backgroundColor,useCORS:!0})})).then((function(n){e.screen=n}))},mounted:function(){}};const p=(0,t(51900).Z)(l,(function(){var e=this,n=e.$createElement,t=e._self._c||n;return t("ReportContainer",[t("div",{staticClass:"report-container"},[t("div",{staticClass:"header"},[t("span",{staticClass:"title"},[e._v("어떤 문제가 있나요?")])]),e._v(" "),t("div",{staticClass:"content-section"},[t("div",{staticClass:"main"},[t("sf-radio",{staticClass:"radio",attrs:{name:"report","item-list":e.reportTypeList},model:{value:e.reportType,callback:function(n){e.reportType=n},expression:"reportType"}}),e._v(" "),t("sf-textarea",{staticClass:"textarea",attrs:{placeholder:"추가 정보 입력(선택 사항)",isResize:!1,max:"1000","min-height":"100"},model:{value:e.description,callback:function(n){e.description=n},expression:"description"}})],1),e._v(" "),t("div",{staticClass:"footer"},[t("sf-main-button",{attrs:{isLoading:e.isLoading,size:"mobile"===e.$screen.breakpoint?"sm":"md"},on:{click:e.submitReport}},[e._v("\n                    리포트 제출\n                ")])],1)])])])}),[],!1,null,null,null).exports}}]);