refactor(echarts): 重构 ECharts 使用方式并优化图表配置- 在 main.js 中引入 ECharts 及相关组件，并通过 Vue.prototype.$echarts 使 ECharts 在全局可用

- 修改 echarts.vue 组件，使用全局的 $echarts 替代局部引入的 echarts
- 优化 overview.vue 中的图表配置，调整颜色渐变和偏移

src/main.js

@@ -29,6 +29,36 @@ for (let item in generatedComponents) {
 }
 import '@/icons' // icon
 import '@/assets/js/utils/permission' // permission control
+import * as echarts from 'echarts'
+// 引入柱状图图表，图表后缀都为 Chart
+import { LineChart } from 'echarts/charts'
+// 引入标题，提示框，直角坐标系，数据集，内置数据转换器组件，组件后缀都为 Component
+import {
+  TitleComponent,
+  TooltipComponent,
+  GridComponent,
+  DatasetComponent,
+  TransformComponent
+} from 'echarts/components'
+// 标签自动布局、全局过渡动画等特性
+import { LabelLayout, UniversalTransition } from 'echarts/features'
+// 引入 Canvas 渲染器，注意引入 CanvasRenderer 或者 SVGRenderer 是必须的一步
+import { CanvasRenderer } from 'echarts/renderers'
+
+// 注册必须的组件
+echarts.use([
+  TitleComponent,
+  TooltipComponent,
+  GridComponent,
+  DatasetComponent,
+  TransformComponent,
+  LineChart,
+  LabelLayout,
+  UniversalTransition,
+  CanvasRenderer
+])
+
+Vue.prototype.$echarts = echarts
 // set ElementUI lang to EN
 Vue.use(ElementUI, { locale })
 //二次封装的el-table

src/views/intelligent-agent/children/Logs&overview/components/echarts.vue

@@ -4,7 +4,7 @@
   </div>
 </template>
 <script>
-import * as echarts from 'echarts'
+// import * as echarts from 'echarts'
 import uuid from 'uuid'
 
 export default {
@@ -44,11 +44,11 @@ export default {
   filters: {},
   methods: {
     drawEcharts() {
-      let myChart = echarts.init(document.getElementById(this.echartsId))
+      let myChart = this.$echarts.init(document.getElementById(this.echartsId))
       let option = {
         ...this.options
       }
-      myChart.setOption(this.options)
+      myChart.setOption(option)
     }
   },
   created() {},

src/views/intelligent-agent/children/Logs&overview/components/overview.vue

@@ -61,13 +61,13 @@ export default {
                   color: '#0694A2'
                 },
                 areaStyle: {
-                  color: new echarts.graphic.LinearGradient(0, 0, 0, 2, [
+                  color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
                     {
                       offset: 0,
-                      color: '#F3F9FA'
+                      color: '#0694A2'
                     },
                     {
-                      offset: 0.2,
+                      offset: 1,
                       color: '#F3F9FA'
                     }
                   ])