feat: ma-echarts

mineadmin · Oct 31, 2024 · e2e9170 · e2e9170
1 parent fbbd722
commit e2e9170
Show file tree

Hide file tree

Showing 4 changed files with 71 additions and 3 deletions.
diff --git a/docs/demos/ma-echarts/index.vue b/docs/demos/ma-echarts/index.vue
@@ -1,9 +1,76 @@
 <script setup lang="ts">
+import useEcharts from "@mineadmin/echarts";
+import {ref} from "vue";
 
+const echarts = ref()
+const { setOption } = useEcharts(echarts)
+
+setOption({
+  title: {
+    text: 'Stacked Line'
+  },
+  tooltip: {
+    trigger: 'axis'
+  },
+  legend: {
+    data: ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine']
+  },
+  grid: {
+    left: '3%',
+    right: '4%',
+    bottom: '3%',
+    containLabel: true
+  },
+  toolbox: {
+    feature: {
+      saveAsImage: {}
+    }
+  },
+  xAxis: {
+    type: 'category',
+    boundaryGap: false,
+    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
+  },
+  yAxis: {
+    type: 'value'
+  },
+  series: [
+    {
+      name: 'Email',
+      type: 'line',
+      stack: 'Total',
+      data: [120, 132, 101, 134, 90, 230, 210]
+    },
+    {
+      name: 'Union Ads',
+      type: 'line',
+      stack: 'Total',
+      data: [220, 182, 191, 234, 290, 330, 310]
+    },
+    {
+      name: 'Video Ads',
+      type: 'line',
+      stack: 'Total',
+      data: [150, 232, 201, 154, 190, 330, 410]
+    },
+    {
+      name: 'Direct',
+      type: 'line',
+      stack: 'Total',
+      data: [320, 332, 301, 334, 390, 330, 320]
+    },
+    {
+      name: 'Search Engine',
+      type: 'line',
+      stack: 'Total',
+      data: [820, 932, 901, 934, 1290, 1330, 1320]
+    }
+  ]
+})
 </script>
 
 <template>
-
+  <div ref="echarts" class="w-full h-300px"></div>
 </template>
 
 <style scoped>

diff --git a/docs/demos/ma-search/index.vue b/docs/demos/ma-search/index.vue
@@ -22,7 +22,7 @@ const searchItem = ref<MaSearchItem>([
     :options="{ fold: true }"
     :form-options="{ labelWidth: '80px'}"
     :search-items="searchItem"
-    @search="(form) => {
+    @search="(form: any) => {
       ElMessage.success('提交的数据：' + JSON.stringify(form))
     }"
   />

diff --git a/docs/zh/front/component/ma-echarts.md b/docs/zh/front/component/ma-echarts.md
@@ -7,3 +7,4 @@
 :::
 
 ## 使用
+<DemoPreview dir="demos/ma-echarts" />
diff --git a/docs/zh/front/high/provider.md b/docs/zh/front/high/provider.md
@@ -45,7 +45,7 @@ export default [
 这个提供了 `echarts` 组件的初始化，包括引入需要使用的 `echarts` 组件（默认并没有全量引入，后续可自己修改添加），
 以及将 `echarts` 绑定到 `Vue` 的 `globalProperties` 对象上: **$echarts**，还有黑暗模式下主题的注册等等。
 
-在 `vue` 页面里通过 `useGlobal().$echarts` 获取实例，具体如何使用可参考 [MaEcharts](/zh/front/component/echarts) 章节 
+在 `vue` 页面里通过 `useGlobal().$echarts` 获取实例，具体如何使用可参考 [MaEcharts](/zh/front/component/ma-echarts) 章节 
 
 
 ### plugins
Original file line number	Diff line number	Diff line change
Expand Up		@@ -7,3 +7,4 @@
		:::

		## 使用
		<DemoPreview dir="demos/ma-echarts" />