sda-lib-demo/lib/packages/co-picture-wall-hexagon/index2.js

## 安装启动

"use strict";Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});var e=require("vue");require("./index.vue_vue_type_style_index_0_scoped_true_lang.js");var t=require("../../_virtual/plugin-vue_export-helper.js");const a=e.defineComponent({name:"CoPictureWallHexagon",props:{width:{type:String},height:{type:String},pictureWallType:{type:String,default:"hexagon"},firstLineCount:{type:Number,default:3},marginNum:{type:Number,default:3},isPageJump:{type:Boolean,default:!1},maskBgColor:{type:String,default:"rgba(0, 128, 128, 0.8)"},titleSize:{type:Number,default:20},textSize:{type:Number,default:14},titleColor:{type:String,default:"rgab(255,255,255,1)"},textColor:{type:String,default:"rgab(255,255,255,1)"},randomBgColor:{type:String,default:"rgab(255,255,255,1)"},randomBorderColor:{type:String,default:"rgab(221,221,221,1)"},maxWidth:{type:Number,default:300},maxHeight:{type:Number,default:300},topInitNum:{type:Number,default:220},leftInitNum:{type:Number,default:224},list:{type:Array,default:()=>{}}},setup(t){const a=e.ref(t.list),l=e.ref(),r=e.ref(),o=e.ref(),i=e.ref([]),n=e.ref([]),u=e.ref(!0),c=()=>{i.value=[],n.value=[],r.value=(96/t.firstLineCount).toFixed(2),o.value=(110.85/t.firstLineCount).toFixed(2);var e=[];a.value.forEach(((t,a)=>{e.push(a)}));let l=Math.floor(e.length/(t.firstLineCount-.5)),u=0,c=[];for(let a=1;a<=l;a++)a%2==1?(u+=t.firstLineCount,c=e.slice(u,u+t.firstLineCount-1),i.value.push(...c)):u=u+t.firstLineCount-1,n.value.push(u)},d=e.ref(!0),p=e.ref([]),m=()=>{p.value=a.value,s.value=[],g.value=[],f.value=[],v.value=0,h.value=0,x()},s=e.ref([]),g=e.ref([]),f=e.ref([]),h=e.ref(0),v=e.ref(0),x=()=>{p.value.forEach(((e,a)=>{a%t.firstLineCount==0&&0!==a&&(v.value=0,h.value+=t.topInitNum),s.value.push(h.value),g.value.push(t.leftInitNum*v.value);let l=Math.floor(60*Math.random());l>=30&&(l=30-l),f.value.push(l),v.value++}))},y=e.ref(0),k=e.ref(0),C=e.ref(0),B=()=>{d.value=!1,e.nextTick((()=>{d.value=!0,e.nextTick((()=>{m()}))}))},w=()=>{"hexagon"===t.pictureWallType?(u.value=!1,e.nextTick((()=>{u.value=!0,e.nextTick((()=>{c()}))}))):"random"===t.pictureWallType&&(d.value=!1,e.nextTick((()=>{d.value=!0,e.nextTick((()=>{m()}))})))};return e.watch((()=>t.firstLineCount),(()=>{"hexagon"===t.pictureWallType?(u.value=!1,e.nextTick((()=>{u.value=!0,e.nextTick((()=>{c()}))}))):"random"===t.pictureWallType&&(d.value=!1,e.nextTick((()=>{d.value=!0,e.nextTick((()=>{m()}))})))})),e.watch((()=>t.maxWidth),(()=>{"random"===t.pictureWallType&&B()})),e.watch((()=>t.maxHeight),(()=>{"random"===t.pictureWallType&&B()})),e.watch((()=>t.topInitNum),(()=>{"random"===t.pictureWallType&&B()})),e.watch((()=>t.leftInitNum),(()=>{"random"===t.pictureWallType&&B()})),e.watch((()=>t.list),(()=>{a.value=t.list,w()})),e.onMounted((()=>{"hexagon"===t.pictureWallType?c():"random"===t.pictureWallType&&m()})),{listData:a,rowWidth:r,rowPadding:o,doubleArr:i,rowOneNumArr:n,isFirstLineCount:u,topData:s,leftData:g,rotateData:f,isRandomBox:d,pictureWallBox:l,actualWidth:k,actualHeight:C,pageJump:e=>{e&&t.isPageJump&&window.open(e)},dataRandomCenter:()=>{if(y.value++,y.value>=s.value.length){var e=l.value.children,t=s.value.lastIndexOf(Math.max(...s.value)),a=e[g.value.lastIndexOf(Math.max(...g.value))].offsetWidth,r=e[t].offsetHeight;k.value=Math.max(...g.value)-Math.min(...g.value)+a,C.value=Math.max(...s.value)-Math.min(...s.value)+r}},updataList:e=>{a.value=e,w()},...e.toRefs(t)}}}),l={key:0,class:"picture-wall-type"},r={key:0,id:"picture-wall__hexGrid"},o=["onClick"],i=["src"],n=["title"],u=["title"],c={key:1,class:"picture-wall-type picture-wall__random_box"},d=["src","onClick"];var p=t.default(a,[["render",function(t,a,p,m,s,g){return e.openBlock(),e.createElementBlock("div",{class:"co-picture-wall-hexagon",style:e.normalizeStyle({width:t.width||"100%",height:t.height||"100%"})},["hexagon"===t.pictureWallType?(e.openBlock(),e.createElementBlock("div",l,[t.isFirstLineCount?(e.openBlock(),e.createElementBlock("ul",r,[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.listData,((a,l)=>(e.openBlock(),e.createElementBlock("li",{class:"picture-wall-hexagon__hex",key:l,style:e.normalizeStyle({width:t.rowWidth+"%",paddingBottom:t.rowPadding+"%",transform:t.doubleArr.includes(l)?"translateX(50%) rotate(-60deg) skewY(30deg)":"",marginTop:t.doubleArr.includes(l)?"-"+t.marginNum+"%":"",marginBottom:t.doubleArr.includes(l)?"-"+t.marginNum+"%":"",clear:t.rowOneNumArr.includes(l)?"left":"unset",marginLeft:t.rowOneNumArr.includes(l)?"0.8%":""})},[e.createElementVNode("div",{class:"picture-wall-hexagon__hexIn",onClick:e=>t.pageJump(a.link),style:e.normalizeStyle({cursor:t.isPageJump?"pointer":"auto"})},[e.createElementVNode("img",{src:a.imgSrc,alt:""},null,8,i),e.createElementVNode("h1",{style:e.normalizeStyle({backgroundColor:t.maskBgColor,color:t.titleColor,fontSize:t.titleSize+"px"}),title:a.title},e.toDisplayString(a.title),13,n),e.createElementVNode("div",{class:"picture-wall-hexagon__p",style:e.normalizeStyle({backgroundColor:t.maskBgColor,color:t.textColor,fontSize:t.textSize+"px"}),title:a.text},[e.createElementVNode("p",null,e.toDisplayString(a.text),1)],12,u)],12,o)],4)))),128))])):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0),"random"===t.pictureWallType?(e.openBlock(),e.createElementBlock("div",c,[t.isRandomBox?(e.openBlock(),e.createElementBlock("div",{key:0,ref:"pictureWallBox",class:"picture-wall__random",style:e.normalizeStyle({width:t.actualWidth+"px",height:t.actualHeight+"px"})},[(e.openBlock(!0),e.createElementBlock(e.Fragment,null,e.renderList(t.list,((l,r)=>(e.openBlock(),e.createElementBlock("img",{src:l.imgSrc,style:e.normalizeStyle({width:t.maxWidth+"px",height:t.maxHeight+"px",top:t.topData[r]+"px"||"",left:t.leftData[r]+"px"||"",transform:"rotate("+t.rotateData[r]+"deg)"||"",transition:"1s",backgroundColor:t.randomBgColor,borderColor:t.randomBorderColor}),key:r,onClick:e=>t.pageJump(l.link),onLoad:a[0]||(a[0]=(...e)=>t.dataRandomCenter&&t.dataRandomCenter(...e)),onError:a[1]||(a[1]=(...e)=>t.dataRandomCenter&&t.dataRandomCenter(...e))},null,44,d)))),128))],4)):e.createCommentVNode("",!0)])):e.createCommentVNode("",!0)],4)}],["__scopeId","data-v-07954021"]]);exports.default=p;