https://snapbox.ai/assets/ContentsWrite-Fk6Q0-kL.js

1import{_ as ue,r as y,m as pe,p as ge,c as k,b as e,w as g,s as ve,e as j,v as P,F as U,f as R,q as m,i as B,t as L,u as fe,g as C,k as me}from"./index-GRB8Jcml.js";import{S as ce}from"./ContentsService-DKa2qyOq.js";import{C as I}from"./compressor.esm-FeJMiU6q.js";const _e={name:"ContentsWrite",setup(){var d=y([]),l=y(""),x=y(""),a=y(""),w=y(""),T=y(!1),t=y({title:"",info:"",link:"",photo:"",file:""}),v=y({title:"",info:"",link:"",photo:"",file:""});const o=pe({alert_display:!1,alert_confirm:!1,msg:"",is_uploading:!1,photo_display:!1,photo_index:0,add_tag:!1,photo_height:"",photo_src:"",edit_tag_modal:!1,is_tag_dragged:!1});let f=y([]),r=y({brand:"",name:"",price:"",link:"",color:"",size:"",code:""});const s=y({brand:"",name:"",price:"",link:"",color:"",size:"",code:"",top:"50%",left:"50%",topP:"50%",leftP:"50%"}),E=fe();let F=0;const N=i=>{document.getElementById(i).click()},M=i=>{if(d.value.length==20)return o.alert_display=!0,o.alert_confirm=!1,o.msg="최대 20장 선택 가능합니다.",i.preventDefault(),!1},W=i=>{d.value.splice(i,1),this.$refs.uploadfile.value=""},A=i=>{document.getElementById("top_link_"+i).click()},J=(i,n)=>{const u=i.target.files[0];if(console.log(u),u.type!="image/png"&&u.type!="image/jpeg"&&u.type!="image/jpg")return o.alert_display=!0,o.alert_confirm=!1,o.msg="이미지 파일을 선택해주세요.",!1;var c=.1;new I(u,{quality:c,success(p){n=="common"?(t.value.photo=URL.createObjectURL(p),t.value.file=p):(v.value.photo=URL.createObjectURL(p),v.value.file=p)},error(p){console.log(p.message)}})},H=(i,n)=>{const u=i.target.files[0];if(u.type!="image/png"&&u.type!="image/jpeg"&&u.type!="image/jpg")return o.alert_display=!0,o.alert_confirm=!1,o.msg="이미지 파일을 선택해주세요.",!1;var c=.1;new I(u,{quality:c,success(p){n.photo=URL.createObjectURL(p),n.file=p},error(p){console.log(p.message)}})},X=i=>{console.log(i);const n=i.target.files;let u=20-d.value.length;n.length+d.value.length>20&&(o.alert_display=!0,o.alert_confirm=!1,o.msg="최대 20장 선택 가능합니다.");for(var c=0;c<u;c++){let b=n[c];if(b){if(b.type!="image/png"&&b.type!="image/jpeg"&&b.type!="image/jpg")return o.alert_display=!0,o.alert_confirm=!1,o.msg="이미지 파일을 선택해주세요.",!1;var p=1;b.size>6194304?p=.1:b.size>5194304?p=.2:b.size>4194304?p=.3:b.size>3145728?p=.4:b.size>2097152?p=.5:p=1,new I(b,{quality:p,success(z){let re={file:z,photo:URL.createObjectURL(z),photo_product:F++,is_video:0};d.value.push(re),console.log(d.value)},error(z){console.log(z.message)}})}}},Y=()=>{var n;if(d.value.length==0)return o.alert_display=!0,o.alert_confirm=!1,o.msg="사진을 선택해주세요.",!1;let i=0;if(d.value.length>0&&(i=d.value[0].tags?(n=d.value[0].tags)==null?void 0:n.length:0),i<1)return o.alert_display=!0,o.alert_confirm=!1,o.msg="메인 사진에 한개 이상의 태그를 등록해주세요.",!1;o.alert_display=!0,o.alert_confirm=!0,o.msg="등록하시겠습니까?"};let K=()=>{if(o.alert_confirm){if(o.is_uploading==!1){o.is_uploading=!0;const n=new FormData;var i="";w.value&&(i=w.value),n.append("code",i),n.append("link_price",x.value),n.append("link_type",a.value),(t.value.photo||t.value.title||t.value.info||t.value.link)&&n.append("top_link_common",JSON.stringify(t.value)),(v.value.photo||v.value.title||v.value.info||v.value.link)&&n.append("top_link_custom",JSON.stringify(v.value)),t.value.file&&n.append("top_link_common_file",t.value.file),v.value.file&&n.append("top_link_custom_file",v.value.file),T.value==!0?n.append("is_hidden",1):n.append("is_hidden",0),n.append("contents",l.value),n.append("photos",JSON.stringify(d.value)),d.value.forEach(u=>{n.append("file_photos[]",u.file),console.log(u.file)}

1),console.log(d.value),ce.upload(n).then(u=>{console.log(u),u.status==200&&(o.alert_display=!0,o.alert_confirm=!1,o.msg="등록되었습니다."),o.is_uploading=!1}).catch(u=>{alert(u.response.data),o.is_uploading=!1})}}else o.msg=="등록되었습니다."?E.push("home"):o.alert_display=!1},q=i=>{o.photo_index=i,o.photo_src=d.value[i].photo,d.value[i].tags&&(f.value=Object.assign([],d.value[i].tags)),f.value.forEach(n=>{n.top!=n.topP&&(n.topP=n.top,n.leftP=n.left)}),document.body.classList.add("notscroll"),o.photo_display=!0,console.log(i)},D=()=>{document.body.classList.remove("notscroll"),o.add_tag=!1,o.photo_display=!1,s.value.brand="",s.value.name="",s.value.price="",s.value.code="",s.value.color="",s.value.size="",s.value.top="50%",s.value.left="50%",s.value.topP="50%",s.value.leftP="50%",f.value.length=0},G=()=>{f.value.forEach(n=>{n.top=n.topP,n.left=n.leftP});const i=Object.assign({},f.value);d.value[o.photo_index].tags=Object.assign([],i),console.log(d.value[o.photo_index]),document.body.classList.remove("notscroll"),D()},Q=()=>{o.edit_tag_modal=!1,o.add_tag=!0},Z=()=>{if(s.value.brand!=""&&s.value.name!=""&&s.value.price!=""&&s.value.link!=""&&s.value.color!=""&&s.value.size!=""){s.value.brand=s.value.brand.toUpperCase();let i=Object.assign({},s.value);f.value.push(i),console.log(f.value),o.add_tag=!1,s.value.brand="",s.value.name="",s.value.price="",s.value.link="",s.value.color="",s.value.size="",s.value.top="50%",s.value.left="50%",s.value.topP="50%",s.value.leftP="50%"}else o.alert_display=!0,o.alert_confirm=!1,s.value.brand==""?o.msg="브랜드명을 입력해주세요.":s.value.name==""?o.msg="상품명을 입력해주세요.":s.value.size==""?o.msg="사이즈를 입력해주세요.":s.value.color==""?o.msg="색상을 입력해주세요.":s.value.link==""&&(o.msg="링크를 입력해주세요.")},$=i=>{f.value.splice(i,1),o.is_tag_dragged=!0},ee=i=>"₩ "+i.toString().replace(/\B(?=(\d{3})+(?!\d))/g,","),O=0,S=0,_="",V="",h="",le=i=>parseInt(i.style.left.replace("px","")),te=i=>parseInt(i.style.top.replace("px","")),oe=(i,n)=>{if(o.is_tag_dragged)return!1;console.log("tag clicked"),o.edit_tag_modal=!0,r.value={...n},r.value.index=i,console.log(r.value),console.log(f.value)},ae=()=>{if(console.log(r.value),console.log(f.value),r.value.brand!=""&&r.value.name!=""&&r.value.price!=""&&r.value.link!=""&&r.value.color!=""&&r.value.size!=""){r.value.brand=r.value.brand.toUpperCase();let i=Object.assign({},r.value);f.value[r.value.index]=i,console.log(f.value),r.value.brand="",r.value.name="",r.value.price="",r.value.link="",r.value.color="",r.value.size="",r.value.top="50%",r.value.left="50%",r.value.topP="50%",r.value.leftP="50%",o.edit_tag_modal=!1}else o.alert_display=!0,o.alert_confirm=!1,r.value.brand==""?o.msg="브랜드명을 입력해주세요.":r.value.name==""?o.msg="상품명을 입력해주세요.":r.value.size==""?o.msg="사이즈를 입력해주세요.":r.value.color==""?o.msg="색상을 입력해주세요.":r.value.link==""&&(o.msg="링크를 입력해주세요.")},ie=i=>{console.log("move tag"),o.is_tag_dragged=!0;let n=window.event?window.event:i,u=parseInt(n.clientX+O),c=parseInt(n.clientY+S);return u<=0?u=0:h.width-u<=_.offsetWidth&&(u=h.width-_.offsetWidth),c<=0?c=0:h.height-c<=_.offsetHeight&&(c=h.height-_.offsetHeight),_.style.left=u+"px",_.style.top=c+"px",!1},ne=(i,n)=>{if(o.is_tag_dragged=!1,n){_=n.currentTarget,V=i;let u=parseInt(f.value[i].topP.replace("%","")),c=parseInt(f.value[i].leftP.replace("%",""));h=document.getElementsByClassName("clicked_photo")[0],_.style.top=u/100*h.height+"px",_.style.left=c/100*h.width+"px";let p=window.event?window.event:n;O=le(_)-p.clientX,S=te(_)-p.clientY,document.onpointermove=ie,document.onpointerup=se,p.preventDefault&&p.preventDefault()}},se=()=>{let i=_.style.left,n=_.style.top;f.value[V].leftP=Math.round(parseInt(i.replace("px",""))*100/h.width,6)+"%",f.value[V].topP=Math.round(parseInt(n.replace("px",""))*100/h.height,6)+"%",document.onpointermove=null,document.onpointerup=null},de=()=>{o.add_tag=!1,s.value.brand="",s.value.name="",s.value.price="",s.value.code="",s.value.link="",s.value.color="",s.value.size="",s.value.top="50%",s.value.left="50%",s.value.topP="50%",s.value.leftP="50%"};return{photos:d,intro:l,link_price:x,link_type:a,code:w,is_hidden:T,top_link_common:t,top_link_custom:v,tag:s,tags:f,editing_tag:r,...ge(o),selectFileDialog:M,updateProductPhoto:N,deletePhoto:W,onPhotoChange:X,onProductPhotoChange:H,upload:Y,clickConfirm:K,openTopLink:A,onTopLinkCommonPhotoChange:J,photoClick:q,photoCancel:D,photoSave:G,tagAtImage:Q,addTag:Z,removeTag:$,priceFormat:ee,addTagClose:de,startDrag:ne,clickTag:oe,updateTag:ae}}},ye={class:"inner"},be={class:"feed_write_area"},he={class:"feed_hidden"},ke={class:"feed_write_photo"},Ce={class:"feed_write_photo_body"},Pe=["src","onClick"],we=["onClick"],ze={key:0,class:"popup_layer",style:{display:"block"}},Ue={class:"write_photo_popup"},xe={class:"popup_box_header"},Te={class:"popup_box_img"},Ve=["onPointerdown","onClick"],je={type:"button"},Le=["onClick"],Ie=["src"],De={class:"btn_area",style:{padding:"50px 0px"}},Oe={class:"btn_tag"},Se={class:"add_tag",style:{display:"block"}},Re={type:"button"},Be={class:"add_tag_write"},Ee={class:"thumbnail"},Fe=["src"],Ne={style:{display:"flex",gap:"5px"}},Me={class:"add_tag",style:{display:"block"}},We={type:"button"},Ae={class:"add_tag_write"},Je={class:"thumbnail"},He=["src"],Xe={style:{display:"flex",gap:"5px"}},Ye={class:"feed_write_txt"},Ke={class:"feed_write_code"},qe={class:"btn_area"},Ge={class:"popup_layer"},Qe={class:"alert"},Ze={class:"msg"},$e={class:"btn_area"};function el(d,l,x,a,w,T){return C(),k(U,null,[l[44]||(l[44]=e("div",{class:"page_header"},[e("h1",null,"글올리기")],-1)),e("section",null,[e("div",ye,[e("div",be,[e("div",he,[e("p",null,[g(e("input",{type:"checkbox",id:"feed_hidden","onUpdate:modelValue":l[0]||(l[0]=t=>this.is_hidden=t)},null,512),[[ve,this.is_hidden]]),l[32]||(l[32]=e("label",{for:"feed_hidden"},"숨기기",-1)),l[33]||(l[33]=e("span",{class:"material-symbols-outlined hidden"},"image_not_supported",-1)),l[34]||(l[34]=e("span",{class:"material-symbols-outlined visible"},"image",-1))])]),e("div",ke,[l[37]||(l[37]=e("h2",null,[j(" 사진을 눌러 태그를 달아주세요. "),e("br"),e("span",null,"태그 1개를 필수"),j("로 등록해주셔야 합니다."),e("br")],-1)),e("ul",null,[g(e("li",Ce,l[35]||(l[35]=[e("div",null,null,-1)]),512),[[P,this.photos.length==0]]),(C(!0),k(U,null,R(this.photos,(t,v)=>(C(),k("li",{key:v},[e("div",null,[e("img",{src:t.photo,style:{"object-fit":"cover","image-orientation":"from-image"},onClick:o=>a.photoClick(v)},null,8,Pe),e("button",{type:"button",class:"btn_delete",onClick:o=>(a.photos.splice(v,1),this.$refs.uploadfile.value=null)}," 삭제 ",8,we)])]))),128)),g(e("li",{style:{cursor:"pointer"},onClick:l[1]||(l[1]=t=>d.$refs.uploadfile.click())},l[36]||(l[36]=[e("div",null,null,-1)]),512),[[P,this.photos.length<20]]),e("input",{type:"file",multiple:"",onChange:l[2]||(l[2]=(...t)=>a.onPhotoChange&&a.onPhotoChange(...t)),onClick:l[3]||(l[3]=(...t)=>a.selectFileDialog&&a.selectFileDialog(...t)),ref:"uploadfile",id:"photo",style:{display:"none"}},null,544)])]),d.photo_display?(C(),k("div",ze,[e("div",Ue,[e("div",xe,[e("button",{type:"button",class:"btn_close",onClick:l[4]||(l[4]=(...t)=>a.photoCancel&&a.photoCancel(...t))}," 닫기 ")]),e("div",Te,[(C(!0),k(U,null,R(a.tags,(t,v)=>(C(),k("div",{class:"imgTag",style:me({position:"absolute",top:t.topP,left:t.leftP}),onPointerdown:o=>a.startDrag(v,o),key:v,onClick:o=>a.clickTag(v,t)},[e("button",je,[e("span",{class:"material-symbols-outlined",onClick:o=>a.removeTag(v)},"close",8,Le)]),e("ul",null,[e("li",null,L(t.brand),1),e("li",null,L(t.price),1)])],44,Ve))),128)),e("img",{src:d.photo_src,class:"clicked_photo"}

1,null,8,Ie)]),e("div",De,[e("div",Oe,[e("ul",null,[e("li",null,[e("button",{type:"button",onClick:l[5]||(l[5]=(...t)=>a.tagAtImage&&a.tagAtImage(...t))},l[38]||(l[38]=[e("span",{class:"material-symbols-outlined",style:{"line-height":"1"}},"add",-1)])),l[39]||(l[39]=e("span",null,"직접입력",-1))])])]),e("div",null,[e("button",{type:"button",class:"btn_save",onClick:l[6]||(l[6]=(...t)=>a.photoSave&&a.photoSave(...t))}," 저장 ")])]),g(e("div",Se,[e("div",null,[e("button",Re,[e("span",{class:"material-symbols-outlined",onClick:l[7]||(l[7]=(...t)=>a.addTagClose&&a.addTagClose(...t))},"close")])]),e("div",Be,[e("div",Ee,[e("img",{src:d.photo_src},null,8,Fe),l[40]||(l[40]=e("button",{type:"file"},"사진추가",-1))]),e("ul",null,[e("li",null,[g(e("input",{type:"text",placeholder:"브랜드명","onUpdate:modelValue":l[8]||(l[8]=t=>a.tag.brand=t)},null,512),[[m,a.tag.brand,void 0,{lazy:!0}]])]),e("li",null,[g(e("input",{type:"text",placeholder:"상품명","onUpdate:modelValue":l[9]||(l[9]=t=>a.tag.name=t)},null,512),[[m,a.tag.name,void 0,{lazy:!0}]])]),e("li",Ne,[g(e("input",{type:"text",placeholder:"사이즈","onUpdate:modelValue":l[10]||(l[10]=t=>a.tag.size=t)},null,512),[[m,a.tag.size,void 0,{lazy:!0}]]),g(e("input",{type:"text",placeholder:"색상","onUpdate:modelValue":l[11]||(l[11]=t=>a.tag.color=t)},null,512),[[m,a.tag.color,void 0,{lazy:!0}]])]),e("li",null,[g(e("input",{type:"text",placeholder:"가격","onUpdate:modelValue":l[12]||(l[12]=t=>a.tag.price=t)},null,512),[[m,a.tag.price,void 0,{lazy:!0}]])]),e("li",null,[g(e("input",{type:"text",placeholder:"링크","onUpdate:modelValue":l[13]||(l[13]=t=>a.tag.link=t)},null,512),[[m,a.tag.link]])]),e("li",null,[g(e("input",{type:"text",placeholder:"상품코드","onUpdate:modelValue":l[14]||(l[14]=t=>a.tag.code=t)},null,512),[[m,a.tag.code]])])])]),e("div",null,[e("button",{type:"button",class:"btn_save_black",onClick:l[15]||(l[15]=(...t)=>a.addTag&&a.addTag(...t))}," 추가하기 ")])],512),[[P,d.add_tag]]),g(e("div",Me,[a.editing_tag?(C(),k(U,{key:0},[e("div",null,[e("button",We,[e("span",{class:"material-symbols-outlined",onClick:l[16]||(l[16]=t=>d.edit_tag_modal=!1)},"close")])]),e("div",Ae,[e("div",Je,[e("img",{src:d.photo_src},null,8,He),l[41]||(l[41]=e("button",{type:"file"},"사진추가",-1))]),e("ul",null,[e("li",null,[g(e("input",{type:"text",placeholder:"브랜드명","onUpdate:modelValue":l[17]||(l[17]=t=>a.editing_tag.brand=t)},null,512),[[m,a.editing_tag.brand,void 0,{lazy:!0}]])]),e("li",null,[g(e("input",{type:"text",placeholder:"상품명","onUpdate:modelValue":l[18]||(l[18]=t=>a.editing_tag.name=t)},null,512),[[m,a.editing_tag.name,void 0,{lazy:!0}]])]),e("li",Xe,[g(e("input",{type:"text",placeholder:"사이즈","onUpdate:modelValue":l[19]||(l[19]=t=>a.editing_tag.size=t)},null,512),[[m,a.editing_tag.size,void 0,{lazy:!0}]]),g(e("input",{type:"text",placeholder:"색상","onUpdate:modelValue":l[20]||(l[20]=t=>a.editing_tag.color=t)},null,512),[[m,a.editing_tag.color,void 0,{lazy:!0}]])]),e("li",null,[g(e("input",{type:"text",placeholder:"가격","onUpdate:modelValue":l[21]||(l[21]=t=>a.editing_tag.price=t)},null,512),[[m,a.editing_tag.price,void 0,{lazy:!0}]])]),e("li",null,[g(e("input",{type:"text",placeholder:"링크","onUpdate:modelValue":l[22]||(l[22]=t=>a.editing_tag.link=t)},null,512),[[m,a.editing_tag.link]])]),e("li",null,[g(e("input",{type:"text",placeholder:"상품코드","onUpdate:modelValue":l[23]||(l[23]=t=>a.editing_tag.code=t)},null,512),[[m,a.editing_tag.code]])])])]),e("div",null,[e("button",{type:"button",class:"btn_save",onClick:l[24]||(l[24]=(...t)=>a.updateTag&&a.updateTag(...t))}," 변경하기 ")])],64)):B("",!0)],512),[[P,d.edit_tag_modal]])])])):B("",!0),e("div",Ye,[g(e("textarea",{"onUpdate:modelValue":l[25]||(l[25]=t=>a.intro=t)},null,512),[[m,a.intro]])]),e("div",Ke,[l[42]||(l[42]=e("h2",null,"추가정보를 입력해주세요.",-1)),g(e("textarea",{"onUpdate:modelValue":l[26]||(l[26]=t=>a.code=t)},null,512),[[m,a.code]])]),e("div",qe,[e("button",{type:"button",class:"btn_cancel",onClick:l[27]||(l[27]=t=>d.$router.go(-1))}," 취소 "),e("button",{type:"button",class:"btn_save",onClick:l[28]||(l[28]=(...t)=>a.upload&&a.upload(...t))}," 저장 ")])])]),g(e("div",Ge,[e("div",Qe,[e("h1",null,[l[43]||(l[43]=j(" 알림")),e("button",{type:"button",class:"btn_close",onClick:l[29]||(l[29]=t=>d.alert_display=!1)}," 닫기 ")]),e("div",Ze,L(d.msg),1),e("div",$e,[g(e("button",{type:"button",class:"btn_basic",onClick:l[30]||(l[30]=t=>d.alert_display=!1)}," 취소 ",512),[[P,d.alert_confirm]]),e("button",{type:"button",class:"btn_basic btn_color_BK",style:{"margin-left":"5px"},onClick:l[31]||(l[31]=(...t)=>a.clickConfirm&&a.clickConfirm(...t))}," 확인 ")])])],512),[[P,d.alert_display]])])],64)}const al=ue(_e,[["render",el]]);export{al as default};