@iwusong/datav-vue3
Version:
Vue3 large screen data display component library
22 lines (21 loc) • 3.12 kB
JavaScript
"use strict";var f=Object.defineProperty,m=Object.defineProperties;var x=Object.getOwnPropertyDescriptors;var d=Object.getOwnPropertySymbols;var N=Object.prototype.hasOwnProperty,V=Object.prototype.propertyIsEnumerable;var a=(s,e,r)=>e in s?f(s,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):s[e]=r,c=(s,e)=>{for(var r in e||(e={}))N.call(e,r)&&a(s,r,e[r]);if(d)for(var r of d(e))V.call(e,r)&&a(s,r,e[r]);return s},u=(s,e)=>m(s,x(e));Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("vue"),b=require("classnames"),C=require("../../hooks/useResize.js"),h=require("../../utils/borderBox.js"),q=require("../../utils/common.js"),k=require("../../utils/styled.js"),p=require("../styled/borderBox.js");require("lodash-es");require("../../utils/logger.js");const v=["red","rgba(0,0,255,0.8)"],S=k.styled.svg`
position: absolute;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
}
.__STYLED__ > polyline {
fill: none;
}
.__STYLED__.reverse {
transform: rotate(180deg);
}
.__STYLED__ .stroke-width1 {
stroke-width: 1;
}
.__STYLED__ .stroke-width3 {
stroke-width: 3px;
stroke-linecap: round;
`("border-svg-container"),j=()=>u(c({},h.createBorderBoxCommonProps()),{reverse:{type:Boolean,default:!1}}),D=q.withInstall(o.defineComponent({name:"BorderBox4",props:j(),setup(s,{slots:e,expose:r}){const{autoBindRef:y,refreshLayoutSize:_,domSize:B}=C.useResize();return r({refreshLayoutSize:_}),()=>{const{color:w,backgroundColor:g,reverse:$}=s,{width:n,height:t}=B,l=h.mergeColor(v,w);return o.createVNode(p.BorderBoxContainer,{class:k.styled.getClassNameForBind("border-box-4"),ref:y},{default:()=>[o.createVNode(S,{class:b({reverse:$}),width:n,height:t},{default:()=>[o.createVNode("polygon",{fill:g,points:`${n-15}, 22 170, 22 150, 7 40, 7 28, 21 32, 24
16, 42 16, ${t-32} 41, ${t-7} ${n-15}, ${t-7}`},null),o.createVNode("polyline",{class:"stroke-width1",stroke:l[0],points:`145, ${t-5} 40, ${t-5} 10, ${t-35} 10, 40 40, 5 150, 5 170, 20 ${n-15}, 20`},null),o.createVNode("polyline",{stroke:l[1],class:"stroke-width1",points:`245, ${t-1} 36, ${t-1} 14, ${t-23} 14, ${t-100}`},null),o.createVNode("polyline",{class:"stroke-width3",stroke:l[0],points:`7, ${t-40} 7, ${t-75}`},null),o.createVNode("polyline",{class:"stroke-width3",stroke:l[0],points:"28, 24 13, 41 13, 64"},null),o.createVNode("polyline",{class:"stroke-width1",stroke:l[0],points:"5, 45 5, 140"},null),o.createVNode("polyline",{class:"stroke-width1",stroke:l[1],points:"14, 75 14, 180"},null),o.createVNode("polyline",{class:"stroke-width1",stroke:l[1],points:"55, 11 147, 11 167, 26 250, 26"},null),o.createVNode("polyline",{class:"stroke-width3",stroke:l[1],points:"158, 5 173, 16"},null),o.createVNode("polyline",{class:"stroke-width3",style:{strokeDasharray:"100 250"},stroke:l[0],points:`200, 17 ${n-10}, 17`},null),o.createVNode("polyline",{class:"stroke-width1",style:{strokeDasharray:"80 270"},stroke:l[1],points:`385, 17 ${n-10}, 17`},null)]}),o.createVNode(p.BorderBoxContent,null,{default:()=>{var i;return[(i=e.default)==null?void 0:i.call(e)]}})]})}}}));exports.BorderBox4=D;