ykxiao/DemuMesDataV
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

update dist and lib

Browse Source
This commit is contained in:
JM
2019-12-06 21:07:16 +08:00
parent aeb021e5e4
commit 6876dec1ca
43 changed files with 7026 additions and 3592 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
lib/components/borderBox4/src/main.css
View File

@ -16,12 +16,6 @@
.dv-border-box-4 .dv-border-svg-container polyline {
fill: none;
}
.dv-border-box-4 .sred {
stroke: red;
}
.dv-border-box-4 .sblue {
stroke: rgba(0, 0, 255, 0.8);
}
.dv-border-box-4 .sw1 {
stroke-width: 1;
}
@ -30,48 +24,38 @@
stroke-linecap: round;
}
.dv-border-box-4 .dv-bb4-line-1 {
stroke: red;
stroke-width: 1;
}
.dv-border-box-4 .dv-bb4-line-2 {
stroke: rgba(0, 0, 255, 0.8);
stroke-width: 1;
}
.dv-border-box-4 .dv-bb4-line-3 {
stroke: red;
stroke-width: 3px;
stroke-linecap: round;
}
.dv-border-box-4 .dv-bb4-line-4 {
stroke: red;
stroke-width: 3px;
stroke-linecap: round;
}
.dv-border-box-4 .dv-bb4-line-5 {
stroke: red;
stroke-width: 1;
}
.dv-border-box-4 .dv-bb4-line-6 {
stroke: rgba(0, 0, 255, 0.8);
stroke-width: 1;
}
.dv-border-box-4 .dv-bb4-line-7 {
stroke: rgba(0, 0, 255, 0.8);
stroke-width: 1;
}
.dv-border-box-4 .dv-bb4-line-8 {
stroke: rgba(0, 0, 255, 0.8);
stroke-width: 3px;
stroke-linecap: round;
}
.dv-border-box-4 .dv-bb4-line-9 {
stroke: red;
stroke-width: 3px;
stroke-linecap: round;
stroke-dasharray: 100 250;
}
.dv-border-box-4 .dv-bb4-line-10 {
stroke: rgba(0, 0, 255, 0.8);
stroke-width: 1;
stroke-dasharray: 80 270;
}

72
lib/components/borderBox4/src/main.vue
View File

@ -1,18 +1,25 @@
<template>
<div class="dv-border-box-4" :ref="ref">
<svg :class="`dv-border-svg-container ${reverse && 'dv-reverse'}`" :width="width" :height="height">
<polyline class="dv-bb4-line-1" :points="`145, ${height - 5} 40, ${height - 5} 10, ${height - 35}
10, 40 40, 5 150, 5 170, 20 ${width - 15}, 20`"/>
<polyline class="dv-bb4-line-2" :points="`245, ${height - 1} 36, ${height - 1} 14, ${height - 23}
14, ${height - 100}`" />
<polyline class="dv-bb4-line-3" :points="`7, ${height - 40} 7, ${height - 75}`" />
<polyline class="dv-bb4-line-4" :points="`28, 24 13, 41 13, 64`" />
<polyline class="dv-bb4-line-5" :points="`5, 45 5, 140`" />
<polyline class="dv-bb4-line-6" :points="`14, 75 14, 180`" />
<polyline class="dv-bb4-line-7" :points="`55, 11 147, 11 167, 26 250, 26`" />
<polyline class="dv-bb4-line-8" :points="`158, 5 173, 16`" />
<polyline class="dv-bb4-line-9" :points="`200, 17 ${width - 10}, 17`" />
<polyline class="dv-bb4-line-10" :points="`385, 17 ${width - 10}, 17`" />
<polyline class="dv-bb4-line-1"
:stroke="mergedColor[0]"
:points="`145, ${height - 5} 40, ${height - 5} 10, ${height - 35}
10, 40 40, 5 150, 5 170, 20 ${width - 15}, 20`"
/>
<polyline
:stroke="mergedColor[1]"
class="dv-bb4-line-2" :points="`245, ${height - 1} 36, ${height - 1} 14, ${height - 23}
14, ${height - 100}`"
/>
<polyline class="dv-bb4-line-3" :stroke="mergedColor[0]" :points="`7, ${height - 40} 7, ${height - 75}`" />
<polyline class="dv-bb4-line-4" :stroke="mergedColor[0]" :points="`28, 24 13, 41 13, 64`" />
<polyline class="dv-bb4-line-5" :stroke="mergedColor[0]" :points="`5, 45 5, 140`" />
<polyline class="dv-bb4-line-6" :stroke="mergedColor[1]" :points="`14, 75 14, 180`" />
<polyline class="dv-bb4-line-7" :stroke="mergedColor[1]" :points="`55, 11 147, 11 167, 26 250, 26`" />
<polyline class="dv-bb4-line-8" :stroke="mergedColor[1]" :points="`158, 5 173, 16`" />
<polyline class="dv-bb4-line-9" :stroke="mergedColor[0]" :points="`200, 17 ${width - 10}, 17`" />
<polyline class="dv-bb4-line-10" :stroke="mergedColor[1]" :points="`385, 17 ${width - 10}, 17`" />
</svg>
<div class="border-box-content">
@ -24,19 +31,50 @@
<script>
import autoResize from '../../../mixin/autoResize'
import { deepMerge } from '@jiaminghi/charts/lib/util/index'
import { deepClone } from '@jiaminghi/c-render/lib/plugin/util'
export default {
name: 'DvBorderBox4',
mixins: [autoResize],
data () {
return {
ref: 'border-box-4'
}
},
props: {
color: {
type: Array,
default: () => ([])
},
reverse: {
type: Boolean,
default: false
}
},
data () {
return {
ref: 'border-box-4',
defaultColor: ['red', 'rgba(0,0,255,0.8)'],
mergedColor: []
}
},
watch: {
color () {
const { mergeColor } = this
mergeColor()
}
},
methods: {
mergeColor () {
const { color, defaultColor } = this
this.mergedColor = deepMerge(deepClone(defaultColor, true), color || [])
}
},
mounted () {
const { mergeColor } = this
mergeColor()
}
}
</script>