From c4d687aacfb4e7b6ee5ce67df93cf2f8d8df80c1 Mon Sep 17 00:00:00 2001
From: xiejun <xj@2023>
Date: 星期日, 26 十一月 2023 14:05:48 +0800
Subject: [PATCH] Merge remote-tracking branch 'origin/master'

---
 Source/UBCS-WEB/src/components/StatisticsComponent/mixCart.vue |  124 +++++++++++++++++++++++++++++++++++++++++
 1 files changed, 124 insertions(+), 0 deletions(-)

diff --git a/Source/UBCS-WEB/src/components/StatisticsComponent/mixCart.vue b/Source/UBCS-WEB/src/components/StatisticsComponent/mixCart.vue
new file mode 100644
index 0000000..c9c5034
--- /dev/null
+++ b/Source/UBCS-WEB/src/components/StatisticsComponent/mixCart.vue
@@ -0,0 +1,124 @@
+<template>
+  <basic-container>
+    <v-chart id="chart" :auto-resize="true" :options="chartOptions"></v-chart>
+  </basic-container>
+</template>
+
+<script>
+import 'echarts'
+import 'echarts/lib/chart/line'
+import 'echarts/lib/chart/pie'
+import 'echarts/lib/chart/bar'
+import 'echarts/lib/component/tooltip'
+import 'echarts/lib/component/title'
+import 'echarts/lib/component/legend'
+
+export default {
+  name: "mixCart",
+  props: {
+    mixData: {
+      type: Array,
+      default: []
+    },
+    chartName: {
+      type: String,
+      default: ""
+    }
+  },
+  data() {
+    return {
+      chartOptions: {
+        title: {
+          text: "",
+        },
+        grid: {
+          left: "3%",
+          right: "4%",
+          bottom: "3%",
+          containLabel: true,
+        },
+        tooltip: {
+          trigger: "axis",
+          axisPointer: {
+            type: "shadow",
+          },
+        },
+        legend: {
+          data: ["鎬婚噺", "鏂板"],
+          left: "center",
+          textStyle: {
+            fontSize: 14 // 璋冩暣瀛椾綋澶у皬
+          }
+        },
+        xAxis: {
+          type: "category",
+          data: [
+            "涓�鏈�",
+            "浜屾湀",
+            "涓夋湀",
+            "鍥涙湀",
+            "浜旀湀",
+            "鍏湀",
+            "涓冩湀",
+            "鍏湀",
+            "涔濇湀",
+            "鍗佹湀",
+            "鍗佷竴鏈�",
+            "鍗佷簩鏈�",
+          ],
+        },
+        yAxis: {
+          type: "value",
+        },
+        series: [],
+      },
+    };
+  },
+  watch: {
+    mixData: {
+      immediate: true,
+      handler(newval, oldval) {
+        if (newval) {
+          const colors = ["#8fef5b", "#db3c3c"];
+
+          const seriesData = newval.map((data, index) => ({
+            name: index === 0 ? "鎬婚噺" : "鏂板",
+            type: index === 0 ? "bar" : "line",
+            stack: index === 0 ? "鎬婚噺" : null,
+            data: data.map(value => ({value})),
+            barWidth: 68,
+            label: {
+              show: true,
+              position: "top"
+            },
+            itemStyle: {
+              color: colors[index]
+            },
+            emphasis: {
+              focus: "series"
+            }
+          }));
+
+          this.chartOptions.series = seriesData;
+        }
+      },
+    },
+    chartName:{
+      handler(newval,oldval){
+        if(newval){
+          this.chartOptions.title.text = newval + "鏁版嵁缁熻"
+        }
+      },
+      immediate:true,
+      deep:true
+    }
+  },
+};
+</script>
+
+<style scoped lang="scss">
+#chart {
+  width: 100%;
+  height: 560px;
+}
+</style>

--
Gitblit v1.9.3