vol-line 进度条(多条对比)

vol-line 适合多条统计进度。不传 rate 时按 value 合计自动算百分比。

参数属性

属性说明类型默认
data数据,每项 { title, value, rate, unit, color }Array[]
border显示底部分割Booleanfalse
<template>
	<vol-line :data="lineData"></vol-line>
	<vol-line :data="lineData" :border="true"></vol-line>
</template>
<script setup>
const lineData = [
	{ title: '在制工单数', value: 1800, rate: 98, unit: '件' },
	{ title: '在制工单计划生产数', value: 1500, rate: 80, unit: '件' },
	{ title: '工制工单超期生产数', value: 300, color: '#c0dfff', unit: '件' },
	{ title: '在制工序任务数', value: 1200, rate: 75, unit: '件' },
	{ title: '在制工序计划生产数', value: 1000, unit: '件' },
	{ title: '工制工序超期生产数', value: 500, color: '#c0dfff', unit: '件' }
]
</script>
Last Updated 2026/10/23 15:32:21
ON THIS PAGE