feat：对接消息相关接口

2025-01-08 18:05:12 +08:00
parent ab1ab210a9
commit 9ee304c8c2
39 changed files with 2081 additions and 1926 deletions
--- a/src/views/workOrder/components/pie.vue
+++ b/src/views/workOrder/components/pie.vue
@@ -0,0 +1,157 @@
+<template>
+  <div class="pie" :id="id" />
+</template>
+
+<script setup>
+  import { fitChartSize } from '@/utils/dataUtil'
+  import { useEchart } from '@/hooks/echart'
+
+  const { id, setOption } = useEchart()
+
+  let option = {
+    backgroundColor: 'transparent',
+    title: [
+      {
+        text: '45.5%',
+        x: 'center',
+        top: '42%',
+        textStyle: {
+          color: '#02F9FA',
+          fontSize: fitChartSize(24)
+        }
+      },
+      {
+        text: '完成率',
+        x: 'center',
+        top: '54%',
+        textStyle: {
+          color: '#fff',
+          fontSize: fitChartSize(12)
+        }
+      }
+    ],
+    series: [
+      {
+        type: 'gauge',
+        radius: '100%',
+        center: ['50%', '50%'],
+        min: 0,
+        max: 100,
+        startAngle: 90,
+        endAngle: 450,
+        clockwise: false,
+        itemStyle: {
+          color: '#00D0FF'
+        },
+        axisLine: {
+          show: true,
+          roundCap: false,
+          lineStyle: {
+            color: [
+              [0, '#075199'],
+              [1, '#075199']
+            ],
+            width: fitChartSize(6)
+          }
+        },
+        progress: {
+          show: true,
+          roundCap: false,
+          width: fitChartSize(6)
+        },
+        pointer: {
+          // 指针
+          show: false
+        },
+        axisTick: {
+          // 刻度
+          show: false
+        },
+        splitLine: {
+          // 分割线
+          show: false
+        },
+        axisLabel: {
+          // 刻度标签
+          show: false
+        },
+        detail: {
+          // 仪表盘详情
+          show: false
+        },
+        data: [
+          {
+            value: 50
+          }
+        ]
+      },
+      {
+        type: 'gauge',
+        radius: '95%',
+        center: ['50%', '50%'],
+        min: 0,
+        max: 100,
+        startAngle: 90,
+        endAngle: 450,
+        clockwise: false,
+        itemStyle: {
+          color: '#057EB9'
+        },
+        axisLine: {
+          roundCap: false,
+          lineStyle: {
+            color: [
+              [0, '#075199'],
+              [1, '#075199']
+            ],
+            width: fitChartSize(10)
+          }
+        },
+        progress: {
+          show: true,
+          roundCap: false,
+          width: fitChartSize(10)
+        },
+        pointer: {
+          // 指针
+          show: false
+        },
+        axisTick: {
+          // 刻度
+          show: false
+        },
+        splitLine: {
+          // 分割线
+          show: false
+        },
+        axisLabel: {
+          // 刻度标签
+          show: false
+        },
+        detail: {
+          // 仪表盘详情
+          show: false
+        },
+        data: [
+          {
+            value: 50
+          }
+        ]
+      }
+    ]
+  }
+  const init = () => {
+    setOption(option)
+  }
+
+  onMounted(() => {
+    init()
+  })
+</script>
+
+<style lang="scss" scoped>
+  .pie {
+    width: vw(200);
+    height: vh(200);
+  }
+</style>