fix(数据大屏): 修复三角形组件无法关闭边框问题

This commit is contained in:
wangjiahao 2024-12-02 14:05:08 +08:00
parent 4fac7db590
commit 6df09e3976
2 changed files with 8 additions and 2 deletions

View File

@ -509,6 +509,7 @@ const list = [
borderWidth: 1,
borderStyle: 'solid',
borderColor: '#cccccc',
borderActive: true,
backgroundColor: 'rgba(236,231,231,0.1)',
backdropFilter: 'blur(0px)'
}
@ -524,6 +525,7 @@ const list = [
height: 200,
borderWidth: 1,
borderColor: '#cccccc',
borderActive: true,
backgroundColor: 'rgba(236,231,231,0.1)',
backdropFilter: 'blur(0px)'
}

View File

@ -6,14 +6,14 @@
:points="points"
:stroke="element.style.borderColor"
:fill="element.style.backgroundColor"
:stroke-width="element.style.borderWidth"
:stroke-width="borderWidth"
/>
</svg>
</div>
</template>
<script setup lang="ts">
import { onMounted, ref, toRefs, watch } from 'vue'
import { computed, onMounted, ref, toRefs, watch } from 'vue'
const props = defineProps({
propValue: {
@ -51,6 +51,10 @@ onMounted(() => {
draw()
})
const borderWidth = computed(() => {
return element.value.style.borderActive ? element.value.style.borderWidth : 0
})
const draw = () => {
const { width, height } = element.value.style
drawPolygon(width, height)