@iwusong/datav-vue3/dist/cjs/components/decoration-12/index.js

Vue3 large screen data display component library

"use strict";var R=Object.defineProperty,G=Object.defineProperties;var z=Object.getOwnPropertyDescriptors;var P=Object.getOwnPropertySymbols;var S=Object.prototype.hasOwnProperty,L=Object.prototype.propertyIsEnumerable;var V=(t,e,o)=>e in t?R(t,e,{enumerable:!0,configurable:!0,writable:!0,value:o}):t[e]=o,k=(t,e)=>{for(var o in e||(e={}))S.call(e,o)&&V(t,o,e[o]);if(P)for(var o of P(e))L.call(e,o)&&V(t,o,e[o]);return t},j=(t,e)=>G(t,z(e));Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("vue"),D=require("@jiaminghi/color"),U=require("../../hooks/useResize.js"),T=require("../../hooks/useUuid.js"),C=require("../../utils/common.js"),B=require("../../utils/decoration.js"),v=require("../../utils/styled.js");require("lodash-es");require("../../utils/logger.js");const E=v.styled.div`
  position: relative;
  width: 100%;
  height: 100%;
  display: flex;
`("decoration-12"),F=v.styled.div`
  position: absolute;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
`("decoration-content"),w=["#2783ce","#2cf7fe"],A=30,O=Math.PI/3,W=3,X=1,Y=(t,e)=>{const o=100/(e-1);return new Array(e).fill(t).map((a,l)=>D.fade(t,100-l*o))};function H(){return j(k({},B.createColorProps()),{scanDuration:{type:Number,default:3},haloDuration:{type:Number,default:2}})}const h=(t,e,o,a)=>[t+Math.cos(a)*o,e+Math.sin(a)*o],J=({x:t,y:e,width:o,segment:a,sectorAngle:l})=>{const d=-Math.PI/2,p=l/a,r=o/4;let u=h(t,e,r,d);return new Array(a).fill("").map((c,i)=>{const m=h(t,e,r,d-(i+1)*p).map(g=>g.toFixed(5)),y=`M${u.join(",")} A${r}, ${r} 0 0 0 ${m.join(",")}`;return u=m,y})},K=({ringNum:t,width:e,ringWidth:o})=>{const a=(e/2-o/2)/t;return new Array(t).fill(0).map((l,d)=>a*(d+1))},Q=({x:t,y:e,width:o})=>{const a=Math.PI/6,l=o/2;return new Array(6).fill("").map((d,p)=>{const r=a*(p+1),u=r+Math.PI,c=h(t,e,l,r),i=h(t,e,l,u);return`${c.join(",")} ${i.join(",")}`})},Z=({x:t,y:e,width:o})=>{const a=Math.PI/6,l=o/2-1;return new Array(4).fill("").map((d,p)=>{const r=a*(3*p+1),u=r+a,c=h(t,e,l,r),i=h(t,e,l,u);return`M${c.join(",")} A${t}, ${e} 0 0 1 ${i.join(",")}`})},ee=C.withInstall(n.defineComponent({name:"Decoration12",props:H(),setup(t,{slots:e,expose:o}){const{autoBindRef:a,refreshLayoutSize:l,domSize:d}=U.useResize();o({refreshLayoutSize:l});const p=T.useUuid();return()=>{const{width:r,height:u}=d,c=r/2,i=u/2,{color:m,scanDuration:y,haloDuration:g}=t,N=`decoration-12-g-${p.id}`,$=`decoration-12-gradient-${p.id}`,f=C.mergeColor(w,m),M=Y(f[0],A),_=J({x:c,y:i,width:r,segment:A,sectorAngle:O}),q=K({ringNum:W,ringWidth:X,width:r}),x=Q({x:c,y:i,width:r}),b=Z({x:c,y:i,width:r});return n.createVNode(E,{ref:a},{default:()=>[n.createVNode("svg",{width:r,height:u},[n.createVNode("defs",null,[n.createVNode("g",{id:N},[_.map((s,I)=>n.createVNode("path",{stroke:M[I],"stroke-width":r/2,fill:"transparent",key:s,d:s},null))]),n.createVNode("radialGradient",{id:$,cx:"50%",cy:"50%",r:"50%"},[n.createVNode("stop",{offset:"0%","stop-color":"transparent","stop-opacity":"1"},null),n.createVNode("stop",{offset:"100%","stop-color":D.fade(f[1]||w[1],30),"stop-opacity":"1"},null)])]),q.map(s=>n.createVNode("circle",{r:s,cx:c,cy:i,stroke:f[1],"stroke-width":"0.5",fill:"transparent"},null)),n.createVNode("circle",{r:"1",cx:c,cy:i,stroke:"transparent",fill:`url(#${$})`},[n.createVNode("animate",{attributeName:"r",values:`1;${r/2}`,dur:`${g}s`,repeatCount:"indefinite"},null),n.createVNode("animate",{attributeName:"opacity",values:"1;0",dur:`${g}s`,repeatCount:"indefinite"},null)]),n.createVNode("circle",{r:"2",cx:c,cy:i,fill:f[1]},null),n.createVNode("g",null,[x.map(s=>n.createVNode("polyline",{key:s,points:s,stroke:f[1],"stroke-width":"0.5",opacity:"0.5"},null))]),b.map(s=>n.createVNode("path",{key:s,d:s,stroke:f[1],"stroke-width":"2",fill:"transparent"},null)),n.createVNode("use",{"xlink:href":`#${N}`},[n.createVNode("animateTransform",{attributeName:"transform",type:"rotate",values:`0, ${c} ${i};360, ${c} ${i}`,dur:`${y}s`,repeatCount:"indefinite"},null)])]),n.createVNode(F,null,{default:()=>{var s;return[(s=e.default)==null?void 0:s.call(e)]}})]})}}}));exports.Decoration12=ee;