{"version":3,"file":"static/chunks/916-266d151d3fc6d26d.js","mappings":"AACA","sources":["webpack://_N_E/./src/components/Formik.tsx","webpack://_N_E/./src/components/HasContentsPopupWrapper.tsx","webpack://_N_E/./src/components/Panel.tsx","webpack://_N_E/./src/components/Suffix.tsx","webpack://_N_E/./src/lib/apiService/index.ts","webpack://_N_E/./src/lib/viewModels/useViewModel.ts","webpack://_N_E/./src/lib/viewModels/index.ts","webpack://_N_E/./src/lib/web-ui/Button.tsx","webpack://_N_E/./src/lib/web-ui/basicStyle.tsx","webpack://_N_E/./src/lib/web-ui/Row.tsx","webpack://_N_E/./src/lib/web-ui/Col.tsx","webpack://_N_E/./src/lib/web-ui/index.tsx","webpack://_N_E/./src/modules/landings/protection/ProtectionReportForm.tsx","webpack://_N_E/"],"sourcesContent":["import { getIn } from \"formik\";\nexport const getError = (name, param)=>{\n let { touched , errors , status } = param;\n const fieldTouched = getIn(touched, name);\n const backendError = getIn(status, [\n \"apiErrors\",\n name\n ]);\n const clientError = getIn(errors, name);\n if (clientError && fieldTouched) {\n return clientError;\n }\n if (backendError && !fieldTouched) {\n return backendError;\n }\n return undefined;\n};\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n .ant-modal-content:has(&) {\\n padding: 0;\\n border-radius: 2px;\\n\\n .ant-modal-close {\\n top: 0;\\n right: 0;\\n }\\n\\n .ant-modal-close-x span {\\n top: 0;\\n right: 0;\\n }\\n\\n .ant-modal-body,\\n .panel_body {\\n padding: 0;\\n\\n .ant-modal-confirm-body-wrapper {\\n .ant-modal-confirm-body {\\n display: block;\\n\\n .ant-modal-confirm-content {\\n margin: 0;\\n }\\n }\\n }\\n }\\n\\n .ant-modal-body {\\n .panel_wrapper {\\n padding-top: 0;\\n }\\n }\\n }\\n\\n .titleWrapper {\\n display: flex;\\n flex-direction: row;\\n align-items: center;\\n padding: 20px 24px;\\n border-bottom: solid 1px #1b1b29;\\n @media (max-width: 1200px) {\\n }\\n @media (max-width: 768px) {\\n flex-wrap: wrap;\\n }\\n }\\n\\n .popupTitle {\\n font-size: 16px;\\n font-weight: bold;\\n color: \",\n \";\\n @media (max-width: 1200px) {\\n }\\n @media (max-width: 768px) {\\n display: block;\\n width: 100%;\\n margin-bottom: 8px;\\n }\\n }\\n .baseLicenseTitle {\\n margin-top: -32px;\\n }\\n .alertIcon {\\n display: inline-block;\\n vertical-align: middle;\\n color: #ff4d4f;\\n margin: 0 4px;\\n\\n @media (max-width: 1200px) {\\n }\\n @media (max-width: 768px) {\\n margin-left: 0;\\n }\\n }\\n\\n .alertComment {\\n font-size: 14px;\\n color: rgba(27, 27, 41, 0.7);\\n }\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nimport styled from \"styled-components\";\nimport { themeGet } from \"@styled-system/theme-get\";\nexport const HasContentsPopupWrapper = styled.div.withConfig({\n componentId: \"sc-d42031de-0\"\n})(_templateObject(), themeGet(\"text.0\", \"#1B1B29\"));\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n width: 100%;\\n padding: 24px 24px 32px;\\n\\n input,\\n textarea {\\n border-radius: 2px;\\n }\\n\\n textarea {\\n resize: none;\\n }\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nimport styled from \"styled-components\";\nexport const Panel = styled.div.withConfig({\n componentId: \"sc-18eb7b3e-0\"\n})(_templateObject());\n","import { jsx as _jsx } from \"react/jsx-runtime\";\nimport React from \"react\";\nexport const suffix = /*#__PURE__*/ _jsx(\"span\", {});\n","export * from \"./ICommand\";\nexport * from \"./RestfulApiService\";\nexport const isAxiosError = (error)=>!!error.isAxiosError;\n","import { useRef } from \"react\";\nimport { useRouter } from \"next/router\";\n/**\n * Create ref to the functional component (It will not re-run on each render)\n * @param ViewModelConstructor\n * @param props context\n * @return ViewModelConstructor\n */ export function useViewModel(props, ViewModelConstructor) {\n const router = useRouter();\n let vmRef = useRef(ViewModelConstructor({\n ...props,\n router\n }));\n return vmRef.current;\n}\n","export * from \"./interface\";\nexport * from \"./useViewModel\";\n","import { jsx as _jsx } from \"react/jsx-runtime\";\nimport React from \"react\";\nexport const Button = ()=>{\n return /*#__PURE__*/ _jsx(\"button\", {\n children: \"Solvook Boop\"\n });\n};\n","const rowStyle = {\n // width: '100%',\n display: \"flex\",\n flexFlow: \"row wrap\"\n};\nconst colStyle = {\n};\nconst gutter = 16;\nexport const basicStyle = {\n rowStyle,\n colStyle,\n gutter\n};\n","import { jsx as _jsx } from \"react/jsx-runtime\";\nimport React from \"react\";\nimport ARow from \"antd/lib/row\";\nimport { basicStyle } from \"./basicStyle\";\nconst Row = (param)=>{\n let { children , ...props } = param;\n return /*#__PURE__*/ _jsx(ARow, {\n ...props,\n gutter: (props === null || props === void 0 ? void 0 : props.gutter) || basicStyle.gutter,\n style: (props === null || props === void 0 ? void 0 : props.style) || basicStyle.rowStyle,\n children: children\n });\n};\nexport { Row };\n","import { jsx as _jsx } from \"react/jsx-runtime\";\nimport React from \"react\";\nimport ACol from \"antd/lib/col\";\nimport { basicStyle } from \"./basicStyle\";\n// HoC 를 사용하여 기본 스타일을 적용한다.\n// High order Component\n// curry function\n// https://levelup.gitconnected.com/devmade-curry-ing-powder-recipe-in-functional-programming-c6e0e45cfbae\n// 데코레이터 패턴\n// https://refactoring.guru/ko/design-patterns/decorator\n// const withDefaultPropsCol = (Component) => {\n// \tconst defaultProps = {\n// \t\t...basicStyle,\n// \t}\n//\n// \treturn (props: ColProps) => \n// }\n//\n// const ColWithHoc = withDefaultPropsCol(Col)\n// const Col = withDefaultPropsCol(Col)\nconst Col = (param)=>{\n let { children , ...props } = param;\n return /*#__PURE__*/ _jsx(ACol, {\n ...props,\n style: (props === null || props === void 0 ? void 0 : props.style) || basicStyle.colStyle,\n children: children\n });\n};\nexport { Col };\n","export * from \"./Button\";\nexport * from \"./Row\";\nexport * from \"./Col\";\nexport * from \"./basicStyle\";\n","import { _ as _tagged_template_literal } from \"@swc/helpers/_/_tagged_template_literal\";\nfunction _templateObject() {\n const data = _tagged_template_literal([\n \"\\n .fileUploaderLabel {\\n width: 100%;\\n display: flex;\\n flex-direction: row;\\n justify-content: space-between;\\n }\\n .ant-upload-list {\\n display: flex;\\n }\\n .uploadDescription {\\n color: rgba(27, 27, 41, 0.7);\\n }\\n\\n .imgUploadAlert {\\n width: 100%;\\n font-size: 12px;\\n line-height: 1.5;\\n color: \",\n \";\\n padding-top: 8px;\\n margin: 0 8px 24px;\\n border-top: 1px solid \",\n \";\\n }\\n\\n .ant-upload-wrapper {\\n div.ant-upload {\\n .ant-upload {\\n .fileUploaderLabel {\\n .ant-btn {\\n font-size: 12px;\\n font-weight: bold;\\n color: #1890ff;\\n height: auto;\\n border: 0;\\n padding: 0 0 0 6px;\\n margin-top: -8px;\\n\\n .anticon {\\n & + span {\\n font-size: 12px;\\n font-weight: bold;\\n color: #1890ff;\\n margin-left: 2px;\\n }\\n }\\n }\\n\\n .uploadDescription {\\n font-size: 12px;\\n color: rgba(27, 27, 41, 0.7);\\n padding-top: 4px;\\n }\\n }\\n }\\n }\\n\\n .ant-upload-list {\\n }\\n }\\n\\n .uploadFileBox {\\n margin-bottom: 15px;\\n }\\n\\n .ant-upload.ant-upload-select {\\n width: 100%;\\n }\\n\\n .ant-upload-list {\\n background-color: rgba(27, 27, 41, 0.03);\\n padding: 10px;\\n min-height: 100px;\\n }\\n\\n @media (max-width: 1200px) {\\n }\\n @media (max-width: 768px) {\\n .ant-col-3,\\n .ant-col-5,\\n .ant-col-7 {\\n flex: 0 0 50%;\\n max-width: 50%;\\n }\\n .ant-col-12 {\\n flex: 0 0 100%;\\n max-width: 100%;\\n }\\n }\\n\"\n ]);\n _templateObject = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject1() {\n const data = _tagged_template_literal([\n \"\\n margin-bottom: 24px;\\n\\n .ant-row {\\n .ant-col {\\n label {\\n font-size: 14px;\\n font-weight: 600;\\n color: \",\n \";\\n }\\n\\n .ant-form-item-control-input {\\n .ant-form-item-control-input-content {\\n .ant-select .ant-select-selector,\\n .ant-input-affix-wrapper,\\n .ant-input,\\n .ant-picker {\\n border-radius: 2px;\\n border-color: #dbdbdb;\\n }\\n }\\n }\\n\\n .ant-picker {\\n width: 100%;\\n }\\n }\\n }\\n\"\n ]);\n _templateObject1 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject2() {\n const data = _tagged_template_literal([\n \"\\n margin-bottom: 8px;\\n font-weight: bold;\\n\"\n ]);\n _templateObject2 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject3() {\n const data = _tagged_template_literal([\n \"\\n background: rgba(27, 27, 41, 0.3) !important;\\n\\n &:hover {\\n background: rgba(0, 47, 168, 0.9) !important;\\n }\\n \"\n ]);\n _templateObject3 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject4() {\n const data = _tagged_template_literal([\n \"\\n background: #002fa8 !important;\\n \"\n ]);\n _templateObject4 = function() {\n return data;\n };\n return data;\n}\nfunction _templateObject5() {\n const data = _tagged_template_literal([\n \"\\n display: block;\\n width: 100%;\\n padding: 0;\\n border-radius: 2px;\\n \",\n \";\\n &,\\n &:disabled {\\n background-color: #002fa8;\\n }\\n\\n &:not(:disabled):hover {\\n background-color: #113ac3;\\n }\\n\\n span {\\n display: block;\\n height: 100%;\\n font-size: 16px;\\n font-weight: bold;\\n color: #fff;\\n line-height: 46px;\\n }\\n\"\n ]);\n _templateObject5 = function() {\n return data;\n };\n return data;\n}\nimport { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { getError } from \"@/components/Formik\";\nimport { Col, Row } from \"@/lib/web-ui\";\nimport { PlusOutlined } from \"@ant-design/icons\";\nimport { themeGet } from \"@styled-system/theme-get\";\nimport { Button, DatePicker, Upload } from \"antd\";\nimport { Formik } from \"formik\";\nimport { Form, FormItem, Input, Select, SubmitButton } from \"formik-antd\";\nimport React, { useState } from \"react\";\nimport styled, { css } from \"styled-components\";\nimport * as Yup from \"yup\";\nimport { suffix } from \"@/components/Suffix\";\nconst TextArea = Input.TextArea;\nconst { Dragger } = Upload;\nexport const ProtectionReportFormSchema = Yup.object().shape({\n type: Yup.string().required(\"선택해주세요\"),\n publisher: Yup.string().required(\"선택해주세요\"),\n title: Yup.string().required(\"최소 1글자 이상 입력 필요\"),\n link: Yup.string().required(\"최소 1글자 이상 입력 필요\"),\n name: Yup.string().required(\"최소 1글자 이상 입력 필요\"),\n channel: Yup.string().required(\"선택해주세요\"),\n profit: Yup.string().required(\"선택해주세요\"),\n content: Yup.string().required(\"설명은 반드시 입력이 필요합니다.\").max(1000, \"최대 1,000자 이내(공백포함)로 작성해주세요\")\n});\nconst ProtectionReportFormWrapper = styled.div.withConfig({\n componentId: \"sc-49bf2a93-0\"\n})(_templateObject(), themeGet(\"text.0\", \"#1B1B29\"), themeGet(\"border.1\", \"#E8E8EA\"));\nconst StyledFormItem = styled(FormItem).withConfig({\n componentId: \"sc-49bf2a93-1\"\n})(_templateObject1(), themeGet(\"text.0\", \"#1B1B29\"));\nconst FieldTitle = styled.p.withConfig({\n componentId: \"sc-49bf2a93-2\"\n})(_templateObject2());\nconst StyledSubmitButton = styled(SubmitButton).withConfig({\n componentId: \"sc-49bf2a93-3\"\n})(_templateObject5(), (props)=>props.disabled ? css(_templateObject3()) : css(_templateObject4()));\nconst getBase64 = (img, callback)=>{\n const reader = new FileReader();\n reader.addEventListener(\"load\", ()=>callback(reader.result));\n reader.readAsDataURL(img);\n};\nexport const ProtectionReportForm = (param)=>{\n let { name , onSubmit , forwardRef , initialStatus , initialValues , publisherOptions , onSetImageFile , onSetPdfFile } = param;\n // /*업로드 로직*/\n const [loading, setLoading] = useState(false);\n // const [imageUrl, setImageUrl] = useState()\n const imgUploadChange = (info)=>{\n if (info.file.status === \"uploading\") {\n setLoading(true);\n return;\n }\n if (info.file.status === \"done\") {\n // Get this url from response in real world.\n getBase64(info.file.originFileObj, (url)=>{\n setLoading(false);\n // setImageUrl(url)\n });\n }\n };\n const pdfUploadChange = (info)=>{\n if (info.file.status === \"uploading\") {\n setLoading(true);\n return;\n }\n if (info.file.status === \"done\") {\n // Get this url from response in real world.\n getBase64(info.file.originFileObj, (url)=>{\n setLoading(false);\n // setImageUrl(url)\n });\n }\n };\n return /*#__PURE__*/ _jsx(ProtectionReportFormWrapper, {\n children: /*#__PURE__*/ _jsx(Formik, {\n innerRef: (instance)=>{\n if (forwardRef) {\n forwardRef.current = instance;\n }\n },\n validationSchema: ProtectionReportFormSchema,\n onSubmit: onSubmit,\n initialValues: initialValues,\n initialStatus: initialStatus,\n children: (param)=>{\n let { handleChange , handleBlur , touched , errors , isValid , handleSubmit , setValues , values , isSubmitting , status } = param;\n // const emailError = getError('email', { touched, errors, status })\n const contentError = getError(\"content\", {\n touched,\n errors,\n status\n });\n const typeError = getError(\"type\", {\n touched,\n errors,\n status\n });\n const publisherError = getError(\"publisher\", {\n touched,\n errors,\n status\n });\n const titleError = getError(\"title\", {\n touched,\n errors,\n status\n });\n const linkError = getError(\"link\", {\n touched,\n errors,\n status\n });\n const nameError = getError(\"name\", {\n touched,\n errors,\n status\n });\n const onDateChange = (date, dateString)=>{\n values.start_date = new Date(dateString);\n };\n const fileNullCheck = values.fileImage.length !== 0 && values.fileData.length !== 0;\n return /*#__PURE__*/ _jsxs(Form, {\n layout: \"vertical\",\n children: [\n /*#__PURE__*/ _jsxs(Row, {\n children: [\n /*#__PURE__*/ _jsx(Col, {\n span: 3,\n children: /*#__PURE__*/ _jsx(StyledFormItem, {\n name: \"type\",\n label: \"구분\",\n children: /*#__PURE__*/ _jsx(Select, {\n placeholder: \"선택\",\n onChange: handleChange(\"type\"),\n autoFocus: true,\n onBlur: handleBlur(\"type\"),\n name: \"type\",\n options: [\n {\n value: \"normal\",\n label: \"일반\"\n },\n {\n value: \"enterprise\",\n label: \"기업\"\n }\n ]\n })\n })\n }),\n /*#__PURE__*/ _jsx(Col, {\n span: 3,\n children: /*#__PURE__*/ _jsx(StyledFormItem, {\n name: \"profit\",\n label: \"영리여부\",\n children: /*#__PURE__*/ _jsx(Select, {\n onChange: handleChange(\"profit\"),\n defaultValue: \"비영리\",\n name: \"profit\",\n options: [\n {\n value: \"영리\",\n label: \"영리\"\n },\n {\n value: \"비영리\",\n label: \"비영리\"\n }\n ]\n })\n })\n }),\n /*#__PURE__*/ _jsx(Col, {\n span: 3,\n children: /*#__PURE__*/ _jsx(StyledFormItem, {\n name: \"channel\",\n label: \"침해채널\",\n children: /*#__PURE__*/ _jsx(Select, {\n onChange: handleChange(\"channel\"),\n placeholder: \"선택\",\n name: \"channel\",\n options: [\n {\n value: \"유튜브\",\n label: \"유튜브\"\n },\n {\n value: \"블로그\",\n label: \"블로그\"\n },\n {\n value: \"카페\",\n label: \"카페\"\n },\n {\n value: \"개인사이트\",\n label: \"개인사이트\"\n },\n {\n value: \"어플리케이션\",\n label: \"어플리케이션\"\n },\n {\n value: \"기타\",\n label: \"기타\"\n }\n ]\n })\n })\n }),\n /*#__PURE__*/ _jsx(Col, {\n span: 3,\n children: /*#__PURE__*/ _jsx(StyledFormItem, {\n name: \"publisher\",\n label: \"출판사\",\n children: /*#__PURE__*/ _jsx(Select, {\n onChange: handleChange(\"publisher\"),\n placeholder: \"선택\",\n name: \"publisher\",\n options: publisherOptions\n })\n })\n }),\n /*#__PURE__*/ _jsx(Col, {\n span: 12,\n children: /*#__PURE__*/ _jsx(StyledFormItem, {\n name: \"title\",\n label: \"교재명\",\n children: /*#__PURE__*/ _jsx(Input, {\n name: \"title\",\n placeholder: \"교재명을 입력하세요\",\n suffix: suffix\n })\n })\n })\n ]\n }),\n /*#__PURE__*/ _jsxs(Row, {\n children: [\n /*#__PURE__*/ _jsx(Col, {\n span: 12,\n children: /*#__PURE__*/ _jsx(StyledFormItem, {\n hasFeedback: false,\n name: \"link\",\n label: \"게시물 링크\",\n children: /*#__PURE__*/ _jsx(Input, {\n name: \"link\",\n placeholder: \"www.link.com\",\n suffix: suffix\n })\n })\n }),\n /*#__PURE__*/ _jsx(Col, {\n span: 7,\n children: /*#__PURE__*/ _jsx(StyledFormItem, {\n hasFeedback: false,\n name: \"name\",\n label: \"침해자명\",\n children: /*#__PURE__*/ _jsx(Input, {\n name: \"name\",\n placeholder: \"입력하세요\",\n suffix: suffix\n })\n })\n }),\n /*#__PURE__*/ _jsx(Col, {\n span: 5,\n children: /*#__PURE__*/ _jsx(StyledFormItem, {\n name: \"startDate\",\n label: \"침해시작일(선택)\",\n children: /*#__PURE__*/ _jsx(DatePicker, {\n placeholder: \"날짜를 선택하세요\",\n onChange: onDateChange,\n name: \"startDate\"\n })\n })\n })\n ]\n }),\n /*#__PURE__*/ _jsxs(Row, {\n gutter: 16,\n children: [\n /*#__PURE__*/ _jsx(\"div\", {\n className: \"imgUploadAlert\",\n children: \"* 침해 이미지 , 침해 자료 중 1개 이상 등록해 주세요.\"\n }),\n /*#__PURE__*/ _jsx(Col, {\n span: 12,\n children: /*#__PURE__*/ _jsx(Upload, {\n // listType=\"picture-card\"\n maxCount: 5,\n multiple: true,\n // fileList={fileList}\n beforeUpload: (info)=>{\n onSetImageFile([\n info\n ]);\n return false;\n },\n accept: \".jpg, .jpeg, .png\",\n onChange: imgUploadChange,\n style: {\n width: \"100%\",\n marginTop: \"25px\"\n },\n children: /*#__PURE__*/ _jsxs(\"div\", {\n className: \"fileUploaderLabel\",\n children: [\n /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n display: \"flex\"\n },\n children: [\n /*#__PURE__*/ _jsx(FieldTitle, {\n children: \"침해 이미지\"\n }),\n /*#__PURE__*/ _jsx(Button, {\n icon: /*#__PURE__*/ _jsx(PlusOutlined, {}),\n children: \"등록하기\"\n })\n ]\n }),\n /*#__PURE__*/ _jsx(\"div\", {\n className: \"uploadDescription\",\n children: \"*최대 10장까지 첨부 가능\"\n })\n ]\n })\n })\n }),\n /*#__PURE__*/ _jsxs(Col, {\n span: 12,\n children: [\n /*#__PURE__*/ _jsx(Upload, {\n name: \"data\",\n // listType=\"picture-card\"\n maxCount: 10,\n accept: \".pdf\",\n beforeUpload: (info)=>{\n onSetPdfFile([\n info\n ]);\n return false;\n },\n onChange: pdfUploadChange,\n children: /*#__PURE__*/ _jsxs(\"div\", {\n className: \"fileUploaderLabel\",\n children: [\n /*#__PURE__*/ _jsxs(\"div\", {\n style: {\n display: \"flex\"\n },\n children: [\n /*#__PURE__*/ _jsx(FieldTitle, {\n children: \"침해 자료\"\n }),\n /*#__PURE__*/ _jsx(Button, {\n icon: /*#__PURE__*/ _jsx(PlusOutlined, {}),\n children: \"등록하기\"\n })\n ]\n }),\n /*#__PURE__*/ _jsx(\"div\", {\n className: \"uploadDescription\",\n children: \"*최대 5개까지 첨부 가능\"\n })\n ]\n })\n }),\n /*#__PURE__*/ _jsx(\"div\", {\n className: \"uploadFileBox\"\n })\n ]\n })\n ]\n }),\n /*#__PURE__*/ _jsx(Row, {\n children: /*#__PURE__*/ _jsx(Col, {\n span: 24,\n children: /*#__PURE__*/ _jsx(StyledFormItem, {\n name: \"content\",\n label: \"침해 상세 내용\",\n children: /*#__PURE__*/ _jsx(TextArea, {\n style: {\n width: \"100%\",\n minHeight: 100\n },\n name: \"content\",\n placeholder: \"최대 1,000자 이내(공백포함)로 작성해주세요.\"\n })\n })\n })\n }),\n /*#__PURE__*/ _jsx(Row, {\n children: /*#__PURE__*/ _jsx(Col, {\n span: 24,\n children: /*#__PURE__*/ _jsx(StyledSubmitButton, {\n disabled: values.title === \"\" || values.publisher === \"\" || values.name === \"\" || values.content === \"\" || values.link === \"\" || values.profit === null || values.channel === null || fileNullCheck,\n onSubmit: handleSubmit,\n loading: isSubmitting,\n style: {\n width: \"100%\",\n height: 48\n },\n children: \"신고\"\n })\n })\n })\n ]\n });\n }\n })\n });\n};\n"],"names":[],"sourceRoot":""}