@iwusong/datav-vue3
Version:
Vue3 large screen data display component library
12 lines (11 loc) • 1.7 kB
JavaScript
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("vue"),y=require("../../hooks/useResize.js"),s=require("../../utils/borderBox.js"),g=require("../../utils/common.js"),c=require("../../utils/styled.js"),i=require("../styled/borderBox.js");require("lodash-es");require("../../utils/logger.js");const h=["#fff","rgba(255, 255, 255, 0.6)"],m=c.styled.svg`
position: absolute;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
}
.__STYLED__ > polyline {
fill: none;
stroke-width: 1;
`("border-svg-container"),b=g.withInstall(e.defineComponent({name:"BorderBox2",props:s.createBorderBoxCommonProps(),setup(d,{slots:l,expose:u}){const{autoBindRef:a,refreshLayoutSize:f,domSize:B}=y.useResize();return u({refreshLayoutSize:f}),()=>{const{color:p,backgroundColor:x}=d,{width:o,height:r}=B,t=s.mergeColor(h,p);return e.createVNode(i.BorderBoxContainer,{class:c.styled.getClassNameForBind("border-box-2"),ref:a},{default:()=>[e.createVNode(m,{width:o,height:r},{default:()=>[e.createVNode("polygon",{fill:x,points:`7, 7 ${o-7}, 7 ${o-7}, ${r-7} 7, ${r-7}`},null),e.createVNode("polyline",{stroke:t[0],points:`2, 2 ${o-2} ,2 ${o-2}, ${r-2} 2, ${r-2} 2, 2`},null),e.createVNode("polyline",{stroke:t[1],points:`6, 6 ${o-6}, 6 ${o-6}, ${r-6} 6, ${r-6} 6, 6`},null),e.createVNode("circle",{fill:t[0],cx:"11",cy:"11",r:"1"},null),e.createVNode("circle",{fill:t[0],cx:o-11,cy:"11",r:"1"},null),e.createVNode("circle",{fill:t[0],cx:o-11,cy:r-11,r:"1"},null),e.createVNode("circle",{fill:t[0],cx:"11",cy:r-11,r:"1"},null)]}),e.createVNode(i.BorderBoxContent,null,{default:()=>{var n;return[(n=l.default)==null?void 0:n.call(l)]}})]})}}}));exports.BorderBox2=b;