修复菜单折叠时，打开菜单子项弹出问题

src/components/chart/Radar.vue

@@ -0,0 +1,83 @@
+<template>
+    <v-chart>
+      <v-tooltip :forceFit="true" height="400" :data="data" :padding="[20, 20, 95, 20]" :scale="scale" />
+      <v-axis :dataKey="axis1Opts.dataKey" :line="axis1Opts.line" :tickLine="axis1Opts.tickLine" :grid="axis1Opts.grid" />
+      <v-axis :dataKey="axis2Opts.dataKey" :line="axis2Opts.line" :tickLine="axis2Opts.tickLine" :grid="axis2Opts.grid" />
+      <v-legend dataKey="user" marker="circle" :offset="30" />
+      <v-coord type="polar" radius="0.8" />
+      <v-line position="item*score" color="user" :size="2" />
+      <v-point position="item*score" color="user" :size="4" shape="circle" />
+    </v-chart>
+</template>
+
+<script>
+const DataSet = require('@antv/data-set')
+
+const sourceData = [
+  { item: 'Design', a: 70, b: 30 },
+  { item: 'Development', a: 60, b: 70 },
+  { item: 'Marketing', a: 50, b: 60 },
+  { item: 'Users', a: 40, b: 50 },
+  { item: 'Test', a: 60, b: 70 },
+  { item: 'Language', a: 70, b: 50 },
+  { item: 'Technology', a: 50, b: 40 },
+  { item: 'Support', a: 30, b: 40 },
+  { item: 'Sales', a: 60, b: 40 },
+  { item: 'UX', a: 50, b: 60 }
+]
+
+const dv = new DataSet.View().source(sourceData)
+dv.transform({
+  type: 'fold',
+  fields: ['a', 'b'],
+  key: 'user',
+  value: 'score'
+})
+
+const scale = [{
+  dataKey: 'score',
+  min: 0,
+  max: 80
+}]
+
+const data = dv.rows
+
+const axis1Opts = {
+  dataKey: 'item',
+  line: null,
+  tickLine: null,
+  grid: {
+    lineStyle: {
+      lineDash: null
+    },
+    hideFirstLine: false
+  }
+}
+const axis2Opts = {
+  dataKey: 'score',
+  line: null,
+  tickLine: null,
+  grid: {
+    type: 'polygon',
+    lineStyle: {
+      lineDash: null
+    }
+  }
+}
+
+export default {
+  name: 'Radar',
+  data () {
+    return {
+      data,
+      axis1Opts,
+      axis2Opts,
+      scale
+    }
+  }
+}
+</script>
+
+<style scoped>
+
+</style>

src/components/dashboard/WorkPlace.vue

@@ -70,7 +70,9 @@
             </div>
           </a-card>
           <a-card title="XX指数" style="margin-bottom: 24px" :bordered="false" :body-style="{padding: 0}">
-            <div style="min-height: 400px;"></div>
+            <div style="min-height: 400px;">
+              <radar />
+            </div>
           </a-card>
           <a-card title="团队" :bordered="false">
             <a-row>
@@ -102,12 +104,14 @@ import AList from 'vue-antd-ui/es/list/index'
 import AListItem from 'vue-antd-ui/es/list/Item'
 import AButton from 'vue-antd-ui/es/button/button'
 import AIcon from 'vue-antd-ui/es/icon/icon'
+import Radar from '../chart/Radar'
 
 const AListItemMeta = AListItem.Meta
 
 export default {
   name: 'WorkPlace',
   components: {
+    Radar,
     AIcon,
     AButton,
     AListItemMeta,

src/components/layout/GloablLayout.vue

@@ -7,7 +7,7 @@
           <h1>Vue Ant Pro</h1>
         </a>
       </div>
-      <i-menu :menuData="menuData" />
+      <i-menu :collapsed="collapsed" :menuData="menuData" />
     </a-layout-sider>
     <a-layout>
       <gloabl-header :collapsed="collapsed" @toggleCollapse="toggleCollapse"/>

src/components/menu/menu.js

@@ -42,6 +42,11 @@ export default {
       type: String,
       required: false,
       default: 'inline'
+    },
+    collapsed: {
+      type: Boolean,
+      required: false,
+      default: false
     }
   },
   data () {
@@ -50,6 +55,13 @@ export default {
       openKeys: []
     }
   },
+  watch: {
+    collapsed (val) {
+      if (val) {
+        this.openKeys = []
+      }
+    }
+  },
   methods: {
     renderIcon: function (h, icon) {
       return icon === 'none' ? null

src/main.js

@@ -6,7 +6,7 @@ import router from './router'
 import 'vue-antd-ui/dist/antd.css'
 import Viser from 'viser-vue'
 import axios from 'axios'
-import '@/mock/index'
+import '@/mock'
 
 Vue.prototype.$axios = axios
 Vue.config.productionTip = false

src/router/index.js

@@ -18,6 +18,7 @@ import CardList from '@/components/list/CardList'
 import SearchLayout from '@/components/list/SearchLayout'
 import ArticleList from '@/components/list/ArticleList'
 import WorkPlace from '@/components/dashboard/WorkPlace'
+import Radar from '@/components/chart/Radar'
 
 Vue.use(Router)
 
@@ -120,7 +121,7 @@ export default new Router({
           path: '/detail/basic',
           name: '基础详情页',
           icon: 'none',
-          component: NotFound
+          component: Radar
         },
         {
           path: '/detail/advanced',