From da4257bc32483409af02a06dd342c6981ec786ec Mon Sep 17 00:00:00 2001
From: liulijun <liulijun@hnkhzn.com>
Date: 星期一, 17 十一月 2025 17:14:14 +0800
Subject: [PATCH] 更新大屏幕页面和任务信息页面
---
项目代码/BigScreen/src/components/echart/bottom/bottomCenterChart/chart.vue | 184 ++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 184 insertions(+), 0 deletions(-)
diff --git "a/\351\241\271\347\233\256\344\273\243\347\240\201/BigScreen/src/components/echart/bottom/bottomCenterChart/chart.vue" "b/\351\241\271\347\233\256\344\273\243\347\240\201/BigScreen/src/components/echart/bottom/bottomCenterChart/chart.vue"
new file mode 100644
index 0000000..3a9de3f
--- /dev/null
+++ "b/\351\241\271\347\233\256\344\273\243\347\240\201/BigScreen/src/components/echart/bottom/bottomCenterChart/chart.vue"
@@ -0,0 +1,184 @@
+<template>
+ <div>
+ <Echart
+ :options="options"
+ id="bottomLeftChart"
+ height="480px"
+ width="100%"
+ ></Echart>
+ </div>
+</template>
+
+<script>
+import Echart from "@/common/echart";
+export default {
+ data() {
+ return {
+ options: {},
+ };
+ },
+ components: {
+ Echart,
+ },
+ props: {
+ cdata: {
+ type: Object,
+ default: () => ({}),
+ },
+ },
+ watch: {
+ cdata: {
+ handler(newData) {
+ this.options = {
+ title: {
+ text: "",
+ },
+ tooltip: {
+ trigger: "axis",
+ backgroundColor: "rgba(255,255,255,0.1)",
+ axisPointer: {
+ type: "shadow",
+ label: {
+ show: true,
+ backgroundColor: "#7B7DDC",
+ },
+ },
+ },
+ legend: {
+ data: [
+ "绋煎姩鐜�",
+ ],
+ textStyle: {
+ color: "#fff",
+ fontSize: 14,
+ },
+ top: "0%",
+ right:"5%"
+ },
+ grid: {
+ x: "7%",
+ width: "93%",
+ bottom:"10%"
+ },
+ xAxis: {
+ data: newData.category,
+ name:'鏃ユ湡',
+ nameLocation:"middle",
+ nameTextStyle:{
+ color: ["white"],
+ padding:[15,0,0,0],
+ fontSize:16
+ },
+
+ splitLine: {
+ show: true,
+ lineStyle: {
+ color: ["#273169"],
+ },
+ },
+ axisLine: {
+ lineStyle: {
+ color: "#B4B4B4",
+ },
+ },
+ axisTick: {
+ show: false,
+ },
+ },
+ calculable: true,
+ yAxis: [
+ {
+ min: 0, // 鍒诲害鏈�灏忓��
+ max: 100, // 鍒诲害鏈�澶у�硷紙闇�瑕佸姩鎬佽幏鍙栨渶澶у��,骞朵笖鑳借3鏁撮櫎锛堝悜涓嬪彇鏁村啀涔樺洖鏉ワ級锛�
+ splitNumber: 10, // 妯嚎鏁�
+ interval: 10, // 鍒诲害闂撮殧
+ axisLine: {
+ lineStyle: {
+ color: "#B4B4B4",
+ },
+ },
+ splitLine: {
+ show: true,
+ lineStyle: {
+ color: ["#273169"],
+ },
+ },
+ axisLabel: {
+ formatter: "{value} ",
+ },
+ name: "鍗曚綅(%)",
+ nameTextStyle: {
+ color: "#ffffff",
+ nameLocation: "start",
+ padding:[0,0,10,0],
+ fontSize:14
+ },
+ },
+ {
+
+ axisLine: {
+ lineStyle: {
+ color: "#B4B4B4",
+ },
+ },
+ axisLabel: {
+ formatter: "{value} ",
+ },
+ },
+ ],
+ series: [
+ {
+ name: "绋煎姩鐜�",
+ type: "bar",
+ barWidth: 20,
+ areaStyle: {
+ color: {
+ type: "linear",
+ x: 0,
+ y: 0,
+ x2: 0,
+ y2: 0,
+ colorStops: [
+ {
+ offset: 0,
+ color: "rgba(255, 255, 0,0.5)",
+ },
+ {
+ offset: 0.6, //杩欐槸浜庝笅鏂圭嚎鐨勮窛绂�,璁剧疆1灏变笉鐣欑┖闅�
+ color: "rgba(255, 255, 0,0.1)",
+ },
+ ],
+ global: false,
+ },
+ },
+ itemStyle: {
+ normal: {
+ barBorderRadius: 2,
+ color: new this.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ { offset: 0, color: "#ffff00" },
+ { offset: 1, color: "#ffff00" },
+ ]),
+ label: {
+ show: true, //寮�鍚樉绀�
+ position: 'top', //鍦ㄤ笂鏂规樉绀�
+ textStyle: { //鏁板�兼牱寮�
+ color: 'white',
+ fontSize: 12
+ },
+ formatter: function (params) {
+ return params.value + '%';
+ },
+ }
+ },
+ },
+ data: newData.actionData,
+ },
+ ],
+ };
+ },
+ immediate: true,
+ deep: true,
+ },
+ },
+};
+</script>
\ No newline at end of file
--
Gitblit v1.9.3