用户中心和采购计划完善

pages/workbench/cost/components/Pie.vue

@@ -0,0 +1,59 @@
+<template>
+	<view class="charts-box">
+		<qiun-data-charts type="pie" :chartData="chartData" :opts="chartOpts" />
+	</view>
+</template>
+
+<script>
+	export default {
+		props: {
+			projectList: {
+				required: true,
+				type: Array
+			}
+		},
+		data() {
+			return {
+				chartData: {},
+				chartOpts: {
+					color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4", "#ea7ccc"],
+					padding: [5, 5, 5, 5],
+					enableScroll: false,
+					extra: {
+						pie: {
+							activeOpacity: 0.5,
+							activeRadius: 10,
+							offsetAngle: 0,
+							labelWidth: 15,
+							border: false,
+							borderWidth: 3,
+							borderColor: "#FFFFFF"
+						}
+					}
+				}
+			}
+		},
+		watch: {
+			projectList: {
+				handler(newVal) {
+					const pieData = this.projectList
+						// .filter(p => p.totalPrice > 0)
+						.map(p => ({
+							name: p.projectName,
+							value: p.totalPrice,
+						}));
+					this.chartData = {
+						series: [{
+							data: pieData
+						}]
+					}
+				},
+				immediate: true,
+			},
+
+		}
+	}
+</script>
+
+<style>
+</style>