xqq_ele
Version:
框架
2 lines (1 loc) • 2.88 kB
JavaScript
;const i=require("vue"),k=require("../../util/function.js"),m=require("./config.js"),s=i.defineComponent({name:"XCardMetrics",components:{},props:m,emits:["onClick"],setup(t,{emit:c}){const r=i.ref([]),u=i.computed(()=>({width:t.width+"px",height:t.height+"px","grid-template-rows":`repeat(${r.value.length}, 1fr)`,"grid-row-gap":`${t.gap[0]}px`})),S=i.computed(()=>({...t.unitStyle,display:t.unitStyle.show?"inline-block":"none",fontSize:t.unitStyle.fontSize||"14px",fontWeight:t.unitStyle.fontWeight||400,color:t.unitStyle.color})),y=i.computed(()=>({...t.totalStyle,display:t.totalStyle.show?"inline-block":"none",fontSize:t.totalStyle.fontSize,fontWeight:t.totalStyle.fontWeight,color:t.totalStyle.color})),g=i.computed(()=>({...t.splitTotalStyle,display:t.splitTotalStyle.show?"inline-block":"none",fontSize:t.splitTotalStyle.fontSize,fontWeight:t.splitTotalStyle.fontWeight,color:t.splitTotalStyle.color})),d=e=>({fontSize:t.valueStyle.fontSize||"20px",fontWeight:t.valueStyle.fontWeight||600,color:t.valueStyle.colorType==="unite"?t.valueStyle.color:t.valueStyle.colors[e]||"#FFFFFF",...t.valueStyle}),b=e=>{const n=t.backgroundTextStyle.colorType==="unite"?String(t.backgroundTextStyle.color):String(t.backgroundTextStyle.colors[e]||"#FFFFFF");return{fontSize:t.textStyle.fontSize||"14px",fontWeight:t.textStyle.fontWeight||400,color:t.textStyle.colorType==="unite"?t.textStyle.color:t.textStyle.colors[e]||"#FFFFFF",background:n,borderRadius:`0 0 ${t.borderStyle.borderRadius} ${t.borderStyle.borderRadius}`,textAlign:t.textStyle.textAlign||"center"}},f=e=>({border:t.backgroundValueStyle.colorType==="unite"?`1px solid ${String(t.backgroundValueStyle.color)}`:`1px solid ${String(t.backgroundValueStyle.colors[e])||"#FFFFFF"}`,borderRadius:t.borderStyle.borderRadius}),F=e=>{var l;const n=t.backgroundValueStyle.colorType==="unite"?String(t.backgroundValueStyle.color):String(t.backgroundValueStyle.colors[e.idx]||"#FFFFFF"),o={textAlign:t.valueStyle.textAlign||"center","background-image":t.backgroundValueStyle.isLinear?`linear-gradient(0deg, ${k.getLinerStartColor(n)} 0%, ${n} 100%)`:n};return(l=e.valueBg)!=null&&l.show?(o["background-image"]=`url(${e.valueBg.url})`,{...o,"background-size":"contain","background-repeat":"no-repeat","background-position":"center"}):o},x=e=>({"grid-template-columns":`repeat(${e}, 1fr)`,"grid-gap":`${t.gap[1]}px`}),h=e=>{c("onClick",e)};return i.watch(t.data,()=>{const e=t.numberOfRow.filter(l=>l!==0),n=t.data.map((l,a)=>({...l,idx:a})),o=[];for(let l=0;l<e.length;l++){const a=n.length-Number(e[l]);a>=0?o[l]=n.splice(0,Number(e[l])):o[l]=[...n.splice(0,Number(e[l])),...new Array(Math.abs(a)).fill({name:null,text:null,value:null})]}r.value=o},{immediate:!0}),{data:r,cardStyle:u,unitStyle:S,totalStyle:y,splitTotalStyle:g,valueStyle:d,textStyle:b,borderStyle:f,vnStyle:F,lineStyle:x,onClick:h}}});module.exports=s;