huangbin 4 лет назад
Родитель
Сommit
2e00e507fd

+ 4 - 1
src/layout/components/menu.vue

@@ -31,6 +31,7 @@ import APP from '@/services';
 import { initData } from '@/common/methods';
 import { OperationTabMenu } from '@/services/go/commonService/interface';
 import { getHasBottom } from '@/common/setup/order/orderData';
+import { useRoute } from 'vue-router';
 
 function handleMenu(context: SetupContext) {
     const selectedKeys = ref<string[]>(['1-1']);
@@ -94,16 +95,18 @@ export default defineComponent({
             }
         });
         const filterMenu = () => menuList.value.filter((e: OperationTabMenu) => e.type === 1);
+        const route = useRoute();
         initData(() => {
             // 处理路由跳转到菜单栏里第一个对应的页面
             const list = filterMenu();
             if (list.length && list[0].children && list[0].children.length) {
+                const matched = route.matched;
                 // 处理修改具体某个菜单栏,主要处理页面刷新
                 let firstIndex = 0,
                     secondeIndex = 0;
                 for (let i = 0; i < list.length; i++) {
                     for (let j = 0; j < list[i].children.length; j++) {
-                        if (window.location.hash === list[i].children[j].code) {
+                        if (matched[1].name === list[i].children[j].code) {
                             firstIndex = i;
                             secondeIndex = j;
                             break;

+ 1 - 0
src/layout/components/top.vue

@@ -66,6 +66,7 @@ export default defineComponent({
                 temp = matched[len - 1].name as string;
             }
             let name = temp;
+
             if (temp === 'home') {
                 // 第一次进入项目
                 if (value?.children.length) {

+ 52 - 3
src/views/business/exposure/list/history/index.vue

@@ -1,19 +1,64 @@
 <template>
   <!-- 采购: 历史敞口-->
   <div class="purchase-history">
-    采购:历史敞口
+    <div class="chart-main"
+         id="main"></div>
   </div>
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineComponent, onMounted } from 'vue';
 import { initData } from '@/common/methods';
+import * as echarts from 'echarts/core';
+import {
+    BarChart,
+    // 系列类型的定义后缀都为 SeriesOption
+    BarSeriesOption,
+    LineChart,
+    LineSeriesOption,
+} from 'echarts/charts';
+import {
+    TitleComponent,
+    // 组件类型的定义后缀都为 ComponentOption
+    TitleComponentOption,
+    GridComponent,
+    GridComponentOption,
+} from 'echarts/components';
+import { CanvasRenderer } from 'echarts/renderers';
 
+// 通过 ComposeOption 来组合出一个只有必须组件和图表的 Option 类型
+type ECOption = echarts.ComposeOption<BarSeriesOption | LineSeriesOption | TitleComponentOption | GridComponentOption>;
+
+// 注册必须的组件
+echarts.use([TitleComponent, GridComponent, LineChart, BarChart, CanvasRenderer]);
 export default defineComponent({
     name: 'purchase-history',
     components: {},
     setup() {
-        initData(() => {});
+        const option = {
+            xAxis: {
+                type: 'category',
+                data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'],
+            },
+            yAxis: {
+                type: 'value',
+            },
+            series: [
+                {
+                    data: [820, 932, 901, 934, 1290, 1330, 1320],
+                    type: 'line',
+                    smooth: true,
+                },
+            ],
+        };
+        onMounted(() => {
+            const ele = document.getElementById('main') as HTMLElement;
+            const myChart = echarts.init(ele);
+            myChart.setOption(option);
+        });
+        initData(() => {
+            option;
+        });
         return {};
     },
 });
@@ -21,6 +66,10 @@ export default defineComponent({
 
 <style lang="less">
 .purchase-history {
+    height: 100%;
+    .chart-main {
+        height: 100%;
+    }
 }
 </style
 >;