ProductSetCreativity1.1d1c4bb0.js 17 KB

1
  1. import{z as Se,g as Le,v as Ue,p as Ae,a as De,E as S}from"./elementPlus.4833989a.js";import{d as _t,B as Me,ay as mt,r as n,Z as K,w as Ee,k as Ne,j as vt,Y as gt,ai as r,aq as yt,o as p,c as v,U as a,O as s,P as N,a as o,S as c,M as Y,u as h,R as Fe,F as Q,a8 as Z,T as g,I as Pe,aF as ht,aG as bt}from"./vue.adf17aba.js";import{u as ze,i as Ge,l as xt,m as $e,k as Ct,n as wt,e as kt}from"./index.6717ff78.js";import{u as It}from"./index.b098562c.js";import{e as F}from"./emitter.c27b7986.js";import{_ as Vt}from"./_plugin-vue_export-helper.c27b6911.js";import"./echarts.72dc8373.js";const u=P=>(ht("data-v-80fd33d7"),P=P(),bt(),P),St={class:"customize-container"},Lt=u(()=>o("div",{style:{"font-weight":"700","padding-bottom":"18px"}},[o("span",{style:{color:"#306cd7","font-size":"26px"}},"|"),o("span",{style:{"font-size":"18px","padding-left":"5px"}},"创意")],-1)),Ut={style:{display:"flex",border:"1px solid #dddfe6",padding:"0 0 0 5px","margin-bottom":"20px"}},At={style:{width:"50%","padding-left":"5px","border-right":"1px solid #dddfe6"}},Dt=u(()=>o("span",{style:{color:"#e47470","margin-right":"4px"}},"*",-1)),Mt=["src"],Et={class:"el-upload-list__item-actions"},Nt=["onClick"],Ft=["onClick"],Pt={style:{"margin-top":"10px"}},zt={style:{display:"flex","align-items":"center","justify-content":"space-between"}},Gt=u(()=>o("span",{style:{"line-height":"17px","font-weight":"600",color:"#1e2128"}},"徽标规格",-1)),$t=u(()=>o("div",{class:"introduce-item"},"1、图片大小: 400x400 像素或更大",-1)),Ot=u(()=>o("div",{class:"introduce-item"},"2、文件大小: 1MB 或更小",-1)),Tt=u(()=>o("div",{class:"introduce-item"},"3、文件格式: PNG 或 JPG",-1)),Bt={class:"introduce-item"},jt={style:{"margin-left":"25px",position:"relative"}},qt=["src"],Rt=["src"],Jt={class:"el-upload-list__item-actions"},Kt=["onClick"],Yt=["onClick"],Qt={style:{"margin-top":"10px"}},Zt={style:{display:"flex","align-items":"center","justify-content":"space-between"}},Ht=u(()=>o("span",{style:{"line-height":"17px","font-weight":"600",color:"#1e2128"}},"图片规格",-1)),Wt=u(()=>o("div",{class:"introduce-item"},"1、图片大小: 1200 x 628 像素或更大",-1)),Xt=u(()=>o("div",{class:"introduce-item"},"2、文件大小: 5MB 或更小",-1)),el=u(()=>o("div",{class:"introduce-item"},"3、文件格式: PNG 或 JPG",-1)),tl=u(()=>o("div",{class:"introduce-item"},"4、内容: 图片中未添加文本、图形或徽标",-1)),ll=["src"],ol=u(()=>o("span",{style:{color:"#e47470","margin-right":"4px"}},"*",-1)),al={style:{"margin-right":"8px","line-height":"normal"}},sl={style:{position:"relative"}},il={class:"double-line"},nl=u(()=>o("span",{style:{color:"#6d7784"}},"ASIN: ",-1)),dl={class:"data-color",style:{"margin-right":"8px"}},rl=u(()=>o("span",{style:{color:"#e47470","margin-right":"4px"}},"*",-1)),cl={style:{width:"50%",padding:"0 10px",position:"relative"}},ul={class:"grid-container"},pl=["onClick","onMouseover"],fl={style:{padding:"10px"}},_l={class:"bottom"},ml={class:"bottom-item"},vl={class:"bottom-item"},gl=u(()=>o("div",{class:"bottom-item"},"徽标",-1)),yl={class:"dialog-footer"},hl={class:"grid-container"},bl=["onClick","onMouseover"],xl={style:{padding:"10px"}},Cl={class:"bottom"},wl={class:"bottom-item"},kl={class:"bottom-item"},Il=u(()=>o("div",{class:"bottom-item"},"徽标",-1)),Vl={class:"dialog-footer"},Sl={style:{padding:"10px",display:"flex","align-items":"center"}},Ll={style:{"margin-right":"8px","line-height":"normal"}},Ul={style:{position:"relative"}},Al={class:"double-line"},Dl=u(()=>o("span",{style:{color:"#6d7784"}},"ASIN: ",-1)),Ml={class:"data-color",style:{"margin-right":"8px"}},El={style:{"margin-top":"20px",display:"flex","justify-content":"center"}},Nl=_t({__name:"ProductSetCreativity1",setup(P){const Oe=Me("respAdGroupId"),Te=It(),{profile:y}=mt(Te),ne=n(),b=K({name:"",brandName:"",title:""}),Be=K({name:[{required:!0,message:"请输入广告名称",trigger:"blur"}],brandName:[{required:!0,message:"请输入品牌名称",trigger:"blur"}],title:[{required:!0,message:"请输入标题",trigger:"blur"}]}),je=async l=>{l&&await l.validate((e,i)=>{e?(console.log("submit!"),Xe()):console.log("error submit!",i)})},de=n(["1"]),qe=l=>{l.includes("commodity")&&we()},z=n(""),H=n(!1),W=n(!1),re=n(!1);n([]);const w=n([]),ce=n(null),k=n(null),x=n([]),ue=n(""),C=n(!1),G=K([]);n("");const L=n(!1);function X(l){w.value=[]}function Re(l){ee.value=[]}function Je(l){z.value=l.url,H.value=!0}function Ke(l){z.value=l.url,W.value=!0}const ee=n([]),Ye=n(!1);let pe="";function Qe(l){Ze(l)}async function Ze(l){const e=new FormData;e.append("file",l.raw),e.append("profile_id",y.value.profile_id),e.append("brandEntityId",ie.value),e.append("assetType","IMAGE"),e.append("assetSubTypeList",JSON.stringify(["LOGO"])),L.value=!0;try{const m=(await ze(e)).data.file_name,f={profile_id:y.value.profile_id,file_name:m},d=await Ge(f);pe=d.data.assetId;const{width:A,height:D}=d.data.fileMetadata;me={width:A,height:D,top:0,left:0},d.data.checkresult=="success"?S({message:"上传成功",type:"success"}):S.error("上传失败")}catch(i){console.error("上传失败:",i)}finally{L.value=!1}}const te=n(!1),fe=n("");let _e={},me={},ve="",ge="",ye="";function He(l){We(l)}async function We(l){const e=new FormData;e.append("file",l.raw),e.append("profile_id",y.value.profile_id),e.append("brandEntityId",ie.value),e.append("assetType","IMAGE"),e.append("assetSubTypeList",JSON.stringify(["LOGO"])),L.value=!0;try{const m=(await ze(e)).data.file_name,f={profile_id:y.value.profile_id,file_name:m},d=await Ge(f);ye=d.data.assetId;const{width:A,height:D}=d.data.fileMetadata;_e={width:A,height:D,top:0,left:0},d.data.checkresult=="success"?S({message:"上传成功",type:"success"}):S.error("上传失败")}catch(i){console.error("上传失败:",i)}finally{L.value=!1}}async function Xe(){te.value=!0;try{const l={profile_id:y.value.profile_id,casins:fe.value,lasins:[],url:ve,name:b.name,state:"PAUSED",adGroupId:Oe.value,brandName:ge,brandLogoCrop:_e,brandLogoAssetID:ye,customImageCrop:me,customImageAssetId:pe,headline:b.title};(await xt(l)).data.creative_state=="success"?S({message:"创建成功",type:"success"}):S.error("上传失败")}catch(l){console.error("error:",l)}finally{te.value=!1}}function he(l){le(l.id)?x.value=x.value.filter(e=>e.id!==l.id):x.value.push(l),ce.value=l.id}function et(){if(x.value.length>0){w.value.length=0,ue.value=x.value[0].imageUrl;const l={name:x.value[0].title,url:ue.value};w.value.push(l)}x.value=[],C.value=!1}function le(l){return ce.value===l}async function tt(){const l={profile_id:y.value.profile_id,assetType:"IMAGE",assetSubType:"LOGO"},e=await Ct(l);G.splice(0,G.length),e.data.forEach(i=>{G.push({id:i.assetId,title:i.name,imageUrl:i.storageLocationUrls.defaultUrl,width:i.fileMetadata.width,height:i.fileMetadata.height,size:be(i.fileMetadata.sizeInBytes)})})}function be(l){return(l/1024).toFixed(2)}function lt(){C.value=!0,tt()}const oe=n(!1),$=K([]);async function ot(){try{const l={profile_id:y.value.profile_id,assetType:"IMAGE",assetSubType:"LIFESTYLE_IMAGE"},e=await wt(l);console.log("🚀 ~ getLifeStyleAssetsData ~ response-->>",e),$.splice(0,$.length),e.data.forEach(i=>{$.push({id:i.assetId,title:i.name,imageUrl:i.storageLocationUrls.defaultUrl,width:i.fileMetadata.width,height:i.fileMetadata.height,size:be(i.fileMetadata.sizeInBytes)})})}catch(l){console.log("error:",l)}}function at(){oe.value=!0,ot()}const xe=Me("pageOptionsValue"),ae=n([]),I=n(!1);async function st(){I.value=!0;try{const l={profile_id:y.value.profile_id,pageurl:xe.value},e=await kt(l);ae.value=e.data.asinList}catch(l){console.log("error:",l)}finally{I.value=!1}}let Ce=[];const U=n([]);async function we(){try{I.value=!0;const l=ae.value.slice(0,3),e=l.filter(i=>!Ce.includes(i));if(e.length===0){I.value=!1;return}Ce=[...l],U.value=[];for(const i of e){const m={profile_id:y.value.profile_id,asin:i};try{const f=await $e(m);U.value.push(f.data)}catch(f){console.log("Error for ASIN",i,":",f)}}}catch(l){console.log("Outer error:",l)}finally{I.value=!1}}const O=n(!1),V=n(),T=n([]),se=n(!1);let B=n(null);function it(l){B.value=l,O.value=!0}async function nt(){try{se.value=!0;const l=ae.value.slice(3);T.value=[];for(const e of l){const i={profile_id:y.value.profile_id,asin:e};try{const m=await $e(i);T.value.push(m.data),console.log("🚀 ~ getAdditionalCommodityData ~ replaceableCommodity-->>",T.value)}catch(m){console.log("Error for additional ASIN",e,":",m)}}}catch(l){console.log("Outer error:",l)}finally{se.value=!1}}function dt(){if(B.value!==null&&V.value){const l=Ie.value.find(e=>e.asin===V.value);l&&(U.value[B.value]=l),O.value=!1,console.log("commodityCard",U.value),B.value=null,V.value=null}}Ee(()=>xe.value,async()=>{await st(),we(),nt()});const ke=Ne(()=>U.value.flat()),Ie=Ne(()=>T.value.flat());Ee(ke,l=>{fe.value=l.map(e=>e.asin)},{deep:!0});const ie=n("");return vt(()=>{F.on("send-brandEntityId",l=>{ie.value=l.brandEntityId[0].brandEntityId}),F.on("page",l=>{ve=l}),F.on("video-shop",l=>{ge=l.brandRegistryName})}),gt(()=>{F.off("send-brandEntityId"),F.off("page")}),(l,e)=>{const i=r("el-input"),m=r("el-form-item"),f=r("el-icon"),d=r("el-button"),A=r("Link"),D=r("el-link"),Ve=r("el-upload"),M=r("el-dialog"),j=r("el-collapse-item"),q=r("el-image"),R=r("el-tooltip"),J=r("el-card"),rt=r("el-collapse"),ct=r("el-scrollbar"),ut=r("el-form"),pt=r("el-radio"),ft=r("el-radio-group"),E=yt("loading");return p(),v("div",St,[a(J,{"body-style":"padding: 20px 80px 0 80px;"},{default:s(()=>[Lt,a(ut,{ref_key:"ruleFormRef",ref:ne,model:b,rules:Be,"label-width":"120px",class:"demo-ruleForm",size:"default","label-position":"top","status-icon":""},{default:s(()=>[a(m,{label:"广告名称",prop:"name"},{default:s(()=>[a(i,{modelValue:b.name,"onUpdate:modelValue":e[0]||(e[0]=t=>b.name=t),style:{width:"50%"}},null,8,["modelValue"])]),_:1}),N((p(),v("div",Ut,[o("div",At,[a(ct,{height:"700px"},{default:s(()=>[a(rt,{modelValue:de.value,"onUpdate:modelValue":e[7]||(e[7]=t=>de.value=t),onChange:qe,style:{"border-top":"none","border-bottom":"none"}},{default:s(()=>[a(j,{name:"1",style:{"padding-right":"10px"}},{title:s(()=>[Dt,c("品牌名称和徽标")]),default:s(()=>[a(m,{prop:"brandName"},{default:s(()=>[a(i,{modelValue:b.brandName,"onUpdate:modelValue":e[1]||(e[1]=t=>b.brandName=t),placeholder:"请输入品牌名称",style:{padding:"0 0 5px 0"}},null,8,["modelValue"])]),_:1}),N((p(),Y(Ve,{"file-list":w.value,"onUpdate:fileList":e[2]||(e[2]=t=>w.value=t),"on-change":He,"on-remove":X,action:"#",accept:".png, .jpg",limit:1,"list-type":"picture-card","auto-upload":!1},{file:s(({file:t})=>[o("div",null,[o("img",{class:"el-upload-list__item-thumbnail",src:t.url,alt:""},null,8,Mt),o("span",Et,[o("span",{class:"el-upload-list__item-preview",onClick:_=>Je(t)},[a(f,null,{default:s(()=>[a(h(Se))]),_:1})],8,Nt),re.value?Fe("",!0):(p(),v("span",{key:0,class:"el-upload-list__item-delete",onClick:_=>X(t)},[a(f,null,{default:s(()=>[a(h(Le))]),_:1})],8,Ft))])])]),tip:s(()=>[o("div",Pt,[o("div",zt,[Gt,a(d,{type:"primary",icon:h(Ue),onClick:lt},{default:s(()=>[c("从素材库中选择")]),_:1},8,["icon"])]),$t,Ot,Tt,o("div",Bt,[c(" 4、内容: 徽标必须填满图片或置于白色或透明背景上详细了解我们的徽标要求 "),o("span",jt,[a(f,{size:"14",style:{position:"absolute",left:"-14px",top:"1px"}},{default:s(()=>[a(A)]),_:1}),a(D,{type:"primary",underline:!1,href:"https://advertising.amazon.com/resources/ad-policy/sponsored-ads-policies#brandlogo",target:"_blank"},{default:s(()=>[c("查看要求")]),_:1})])])])]),default:s(()=>[a(f,null,{default:s(()=>[a(h(Ae))]),_:1})]),_:1},8,["file-list"])),[[E,L.value]]),a(M,{modelValue:H.value,"onUpdate:modelValue":e[3]||(e[3]=t=>H.value=t)},{default:s(()=>[o("img",{"w-full":"",src:z.value,alt:"Preview Image"},null,8,qt)]),_:1},8,["modelValue"])]),_:1}),a(j,{name:"2",style:{"padding-right":"10px"}},{title:s(()=>[c("自定义图片(可选)")]),default:s(()=>[N((p(),Y(Ve,{"file-list":ee.value,"onUpdate:fileList":e[4]||(e[4]=t=>ee.value=t),"on-change":Qe,"on-remove":Re,action:"#",accept:".png, .jpg",limit:1,"list-type":"picture-card","auto-upload":!1},{file:s(({file:t})=>[o("div",null,[o("img",{class:"el-upload-list__item-thumbnail",src:t.url,alt:""},null,8,Rt),o("span",Jt,[o("span",{class:"el-upload-list__item-preview",onClick:_=>Ke(t)},[a(f,null,{default:s(()=>[a(h(Se))]),_:1})],8,Kt),re.value?Fe("",!0):(p(),v("span",{key:0,class:"el-upload-list__item-delete",onClick:_=>X(t)},[a(f,null,{default:s(()=>[a(h(Le))]),_:1})],8,Yt))])])]),tip:s(()=>[o("div",Qt,[o("div",Zt,[Ht,a(d,{type:"primary",icon:h(Ue),onClick:at},{default:s(()=>[c("从素材库中选择")]),_:1},8,["icon"])]),Wt,Xt,el,tl])]),default:s(()=>[a(f,null,{default:s(()=>[a(h(Ae))]),_:1})]),_:1},8,["file-list"])),[[E,Ye.value]]),a(M,{modelValue:W.value,"onUpdate:modelValue":e[5]||(e[5]=t=>W.value=t)},{default:s(()=>[o("img",{"w-full":"",src:z.value,alt:"Preview Image"},null,8,ll)]),_:1},8,["modelValue"])]),_:1}),N((p(),Y(j,{name:"commodity",style:{"padding-right":"10px"}},{title:s(()=>[ol,c("商品")]),default:s(()=>[(p(!0),v(Q,null,Z(ke.value,(t,_)=>(p(),v("div",{key:_,style:{margin:"0 0 5px 0"}},[a(J,{shadow:"hover","body-style":"padding: 10px; display: flex;"},{default:s(()=>[o("div",al,[a(q,{class:"img-box",src:t.image_link},null,8,["src"])]),o("div",sl,[a(R,{class:"box-item",effect:"dark",content:t.title,placement:"top"},{default:s(()=>[o("div",il,g(t.title),1)]),_:2},1032,["content"]),o("span",null,[nl,o("span",dl,g(t.asin),1)]),a(d,{type:"primary",size:"small",link:"",onClick:()=>it(_),style:{position:"absolute",bottom:"2px",right:"0"}},{default:s(()=>[c(" 更换商品 ")]),_:2},1032,["onClick"])])]),_:2},1024)]))),128))]),_:1})),[[E,I.value]]),a(j,{name:"4",style:{"padding-right":"10px"}},{title:s(()=>[rl,c("标题")]),default:s(()=>[a(m,{prop:"title"},{default:s(()=>[a(i,{modelValue:b.title,"onUpdate:modelValue":e[6]||(e[6]=t=>b.title=t),maxlength:"50",placeholder:"请输入标题","show-word-limit":"",style:{padding:"0 10px 0 0"}},null,8,["modelValue"])]),_:1})]),_:1})]),_:1},8,["modelValue"])]),_:1})]),o("div",cl,[a(d,{type:"primary",plain:"",onClick:e[8]||(e[8]=t=>je(ne.value)),disabled:!w.value.length,style:{position:"absolute",top:"92%",left:"46%"}},{default:s(()=>[c(" 保存")]),_:1},8,["disabled"])])])),[[E,te.value]])]),_:1},8,["model","rules"])]),_:1}),a(M,{modelValue:C.value,"onUpdate:modelValue":e[11]||(e[11]=t=>C.value=t),title:"从素材库中选择",width:"65%"},{footer:s(()=>[o("span",yl,[a(d,{onClick:e[10]||(e[10]=t=>C.value=!1)},{default:s(()=>[c("取消")]),_:1}),a(d,{type:"primary",onClick:et},{default:s(()=>[c("确定")]),_:1})])]),default:s(()=>[a(i,{"prefix-icon":h(De)},null,8,["prefix-icon"]),o("div",ul,[(p(!0),v(Q,null,Z(G,t=>(p(),v("div",{class:Pe(["grid-item",{selected:le(t.id),hover:k.value===t.id}]),key:t.id,onClick:_=>he(t),onMouseover:_=>k.value=t.id,onMouseleave:e[9]||(e[9]=_=>k.value=null)},[a(J,{"body-style":{padding:"0px"}},{default:s(()=>[a(q,{class:"image",src:t.imageUrl,fit:"cover"},null,8,["src"]),o("div",fl,[o("span",null,[a(R,{placement:"top",content:t.title},{default:s(()=>[c(g(t.title),1)]),_:2},1032,["content"])]),o("div",_l,[o("div",ml,g(t.size)+"KB",1),o("div",vl,g(t.width)+" * "+g(t.height),1),gl])])]),_:2},1024)],42,pl))),128))])]),_:1},8,["modelValue"]),a(M,{modelValue:oe.value,"onUpdate:modelValue":e[15]||(e[15]=t=>oe.value=t),title:"从素材库中选择",width:"65%"},{footer:s(()=>[o("span",Vl,[a(d,{onClick:e[13]||(e[13]=t=>C.value=!1)},{default:s(()=>[c("取消")]),_:1}),a(d,{type:"primary",onClick:e[14]||(e[14]=t=>C.value=!1)},{default:s(()=>[c("确定")]),_:1})])]),default:s(()=>[a(i,{"prefix-icon":h(De)},null,8,["prefix-icon"]),o("div",hl,[(p(!0),v(Q,null,Z($,t=>(p(),v("div",{class:Pe(["grid-item",{selected:le(t.id),hover:k.value===t.id}]),key:t.id,onClick:_=>he(t),onMouseover:_=>k.value=t.id,onMouseleave:e[12]||(e[12]=_=>k.value=null)},[a(J,{"body-style":{padding:"0px"}},{default:s(()=>[a(q,{class:"image",src:t.imageUrl,fit:"cover"},null,8,["src"]),o("div",xl,[o("span",null,[a(R,{placement:"top",content:t.title},{default:s(()=>[c(g(t.title),1)]),_:2},1032,["content"])]),o("div",Cl,[o("div",wl,g(t.size)+"KB",1),o("div",kl,g(t.width)+" * "+g(t.height),1),Il])])]),_:2},1024)],42,bl))),128))])]),_:1},8,["modelValue"]),a(M,{modelValue:O.value,"onUpdate:modelValue":e[17]||(e[17]=t=>O.value=t),title:"更换商品",width:"50%"},{default:s(()=>[N((p(),Y(ft,{modelValue:V.value,"onUpdate:modelValue":e[16]||(e[16]=t=>V.value=t),style:{display:"flex","flex-direction":"column","align-content":"flex-start","align-items":"flex-start"}},{default:s(()=>[(p(!0),v(Q,null,Z(Ie.value,(t,_)=>(p(),v("div",{key:_},[a(pt,{label:t.asin,style:{height:"80px","border-bottom":"1px solid #ccc"}},{default:s(()=>[o("div",Sl,[o("div",Ll,[a(q,{class:"img-box",src:t.image_link},null,8,["src"])]),o("div",Ul,[a(R,{class:"box-item",effect:"dark",content:t.title,placement:"top"},{default:s(()=>[o("div",Al,g(t.title),1)]),_:2},1032,["content"]),o("span",null,[Dl,o("span",Ml,g(t.asin),1)])])])]),_:2},1032,["label"])]))),128))]),_:1},8,["modelValue"])),[[E,se.value]]),o("div",El,[a(d,{type:"primary",disabled:!V.value,onClick:dt},{default:s(()=>[c("确定")]),_:1},8,["disabled"])])]),_:1},8,["modelValue"])])}}});const Bl=Vt(Nl,[["__scopeId","data-v-80fd33d7"]]);export{Bl as default};