From 832100f39db5303e949d4414616e49384ed308e5 Mon Sep 17 00:00:00 2001
From: pixel <303176530@qq.com>
Date: Fri, 17 Apr 2020 14:15:41 +0800
Subject: [PATCH 1/9] =?UTF-8?q?=E8=8F=9C=E5=8D=95=20=E8=A7=92=E8=89=B2?=
 =?UTF-8?q?=E9=80=89=E6=8B=A9=E6=9B=B4=E6=94=B9=E4=B8=BA=E6=A0=91=E5=BD=A2?=
 =?UTF-8?q?=E9=80=89=E6=8B=A9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../view/superAdmin/authority/authority.vue   | 88 +++++++++----------
 web/src/view/superAdmin/menu/menu.vue         | 88 ++++++++-----------
 web/src/view/superAdmin/user/user.vue         | 71 ++++++++-------
 3 files changed, 118 insertions(+), 129 deletions(-)

diff --git a/web/src/view/superAdmin/authority/authority.vue b/web/src/view/superAdmin/authority/authority.vue
index 56cfde31..09053280 100644
--- a/web/src/view/superAdmin/authority/authority.vue
+++ b/web/src/view/superAdmin/authority/authority.vue
@@ -27,20 +27,14 @@
     <el-dialog :visible.sync="dialogFormVisible" :title="dialogTitle">
       <el-form :model="form" :rules="rules" ref="authorityForm">
         <el-form-item label="父级角色"  prop="parentId">
-           <el-select
-           :disabled="dialogType=='add'"
-            placeholder="请选择"
-            v-model="form.parentId"
-            filterable
-          >
-            <el-option
-              :disabled="canSelect(item)"
-              :key="item.authorityId"
-              :label="item.authorityName"
-              :value="item.authorityId"
-              v-for="item in AuthorityOption"
-            ></el-option>
-          </el-select>
+           <el-cascader
+              :disabled="dialogType=='add'"
+              v-model="form.parentId"
+              :options="AuthorityOption"
+              :show-all-levels="false"
+              :props="{ checkStrictly: true,label:'authorityName',value:'authorityId',disabled:'disabled',emitPath:false}"
+              filterable>
+              </el-cascader>
         </el-form-item>
         <el-form-item label="角色ID" prop="authorityId">
           <el-input autocomplete="off" :disabled="dialogType=='edit'" v-model="form.authorityId"></el-input>
@@ -218,60 +212,58 @@ export default {
         }
       })
     },
-    getAuthorityList(AuthorityData){
-      AuthorityData.map(item=>{
-        this.AuthorityOption.push({
-          authorityId:item.authorityId,
-          authorityName:item.authorityName
-        })
-        if(item.children){
-          this.getAuthorityList(item.children)
+    setOptions(){
+       this.AuthorityOption = [{
+          authorityId:"0",
+          authorityName:"根角色"
+        }]
+      this.setAuthorityOptions(this.tableData,this.AuthorityOption,false)
+    },
+    setAuthorityOptions(AuthorityData,optionsData,disabled){
+      AuthorityData&&AuthorityData.map(item=>{
+        if(item.children.length){
+          const option = {
+            authorityId:item.authorityId,
+            authorityName:item.authorityName,
+            disabled:disabled||item.authorityId == this.form.authorityId,
+            children:[]
+        }
+          this.setAuthorityOptions(item.children,option.children,disabled||item.authorityId == this.form.authorityId)
+          optionsData.push(option)
+        }else{
+          const option = {
+              authorityId:item.authorityId,
+              authorityName:item.authorityName,
+              disabled:disabled||item.authorityId == this.form.authorityId,
+          }
+          optionsData.push(option)
         }
       })
     },
-    findAuthoritySelf(authority,authData,outData){
-      authData.some(item=>{
-        if(item.authorityId == authority.authorityId){
-          outData.push(item)
-          return true
-        }
-        this.findAuthoritySelf(authority,item.children,outData)
-      })
-    },
-    findAllChild(authority,array){
-      authority&&authority.map(item=>{
-        array.push(item.authorityId)
-        this.findAllChild(item.children,array)
-      })
-    },
-    canSelect(authority){
-      const array = []
-      const arrayIds = []
-      this.findAuthoritySelf({authorityId:this.form.authorityId},this.tableData,array)
-      this.findAllChild(array,arrayIds)
-      return arrayIds.indexOf(authority.authorityId)>-1
-    },
     // 增加角色
     addAuthority(parentId) {
-      this. dialogTitle = "新增角色"
+      this.dialogTitle = "新增角色"
       this.dialogType = "add"
       this.form.parentId = parentId
+      this.setOptions()
       this.dialogFormVisible = true
+      
     },
-    // 增加角色
+    // 编辑角色
     editAuthority(row) {
-      this. dialogTitle = "编辑角色"
+      this.setOptions()
+      this.dialogTitle = "编辑角色"
       this.dialogType = "edit"
       for(let key in this.form){
         this.form[key] = row[key]
       }
+      this.setOptions()
       this.dialogFormVisible = true
     }
   },
   async created() {
     this.pageSize = 999
     await this.getTableData()
-    this.getAuthorityList(this.tableData)
   }
 }
 </script>
diff --git a/web/src/view/superAdmin/menu/menu.vue b/web/src/view/superAdmin/menu/menu.vue
index 7c742f0e..76fd5881 100644
--- a/web/src/view/superAdmin/menu/menu.vue
+++ b/web/src/view/superAdmin/menu/menu.vue
@@ -47,21 +47,14 @@
           </el-select>
         </el-form-item>
         <el-form-item label="父节点Id">
-           <el-select
-            placeholder="请选择"
-            v-model="form.parentId"
-            :disabled="!this.isEdit"
-            filterable 
-          >
-            <el-option
-              :disabled="canSelect(item)"
-              :key="item.ID"
-              :label="item.title"
-              :value="item.ID"
-              v-for="item in menuOption"
-            >
-            </el-option>
-          </el-select>
+           <el-cascader
+              :disabled="!this.isEdit"
+              v-model="form.parentId"
+              :options="menuOption"
+              :show-all-levels="false"
+              :props="{ checkStrictly: true,label:'title',value:'ID',disabled:'disabled',emitPath:false}"
+              filterable>
+              </el-cascader>
         </el-form-item>
         <el-form-item label="文件路径" prop="component">
           <el-input autocomplete="off" v-model="form.component"></el-input>
@@ -143,6 +136,34 @@ export default {
     }
   },
   methods: {
+    setOptions(){
+       this.menuOption = [{
+          ID:"0",
+          title:"根目录"
+        }]
+      this.setMenuOptions(this.tableData,this.menuOption,false)
+    },
+    setMenuOptions(menuData,optionsData,disabled){
+      menuData&&menuData.map(item=>{
+        if(item.children.length){
+          const option = {
+            title:item.meta.title,
+            ID:String(item.ID),
+            disabled:disabled||item.ID == this.form.ID,
+            children:[]
+        }
+          this.setMenuOptions(item.children,option.children,disabled||item.ID == this.form.ID)
+          optionsData.push(option)
+        }else{
+          const option = {
+              title:item.meta.title,
+              ID:String(item.ID),
+              disabled:disabled||item.ID == this.form.ID,
+          }
+          optionsData.push(option)
+        }
+      })
+    },
     handleClose(done) {
       this.initForm()
       done()
@@ -239,6 +260,7 @@ export default {
       this.dialogTitle = "新增菜单"
       this.form.parentId = String(id)
       this.isEdit = false
+      this.setOptions()
       this.dialogFormVisible = true
     },
     // 修改菜单方法
@@ -246,41 +268,9 @@ export default {
       this.dialogTitle = "编辑菜单"
       const res = await getBaseMenuById({ id })
       this.form = res.data.menu
-      this.dialogFormVisible = true
       this.isEdit = true
-    },
-    getMenuList(MenuData){
-      MenuData.map(item=>{
-        this.menuOption.push({
-          ID:String(item.ID),
-          title:item.meta.title
-        })
-        if(item.children){
-          this.getMenuList(item.children)
-        }
-      })
-    },
-    findAuthoritySelf(mune,muneData,outData){
-      muneData&&muneData.some(item=>{
-        if(item.ID == mune.ID){
-          outData.push(item)
-          return true
-        }
-        this.findAuthoritySelf(mune,item.children,outData)
-      })
-    },
-    findAllChild(menu,array){
-      menu&&menu.map(item=>{
-        array.push(String(item.ID))
-        this.findAllChild(item.children,array)
-      })
-    },
-    canSelect(authority){
-      const array = []
-      const arrayIds = []
-      this.findAuthoritySelf({ID:this.form.ID},this.tableData,array)
-      this.findAllChild(array,arrayIds)
-      return arrayIds.indexOf(authority.ID)>-1
+      this.setOptions()
+      this.dialogFormVisible = true
     },
   },
    async created() {
diff --git a/web/src/view/superAdmin/user/user.vue b/web/src/view/superAdmin/user/user.vue
index 7d5be00a..b1ede5ba 100644
--- a/web/src/view/superAdmin/user/user.vue
+++ b/web/src/view/superAdmin/user/user.vue
@@ -16,18 +16,14 @@
       <el-table-column label="昵称" min-width="150" prop="nickName"></el-table-column>
       <el-table-column label="用户角色" min-width="150">
         <template slot-scope="scope">
-          <el-select
+          <el-cascader
             @change="changeAuthority(scope.row)"
-            placeholder="请选择"
-            v-model="scope.row.authority.authorityId"
-          >
-            <el-option
-              :key="item.authorityId"
-              :label="item.authorityName"
-              :value="item.authorityId"
-              v-for="item in authOptions"
-            ></el-option>
-          </el-select>
+              v-model="scope.row.authority.authorityId"
+              :options="authOptions"
+              :show-all-levels="false"
+              :props="{ checkStrictly: true,label:'authorityName',value:'authorityId',disabled:'disabled',emitPath:false}"
+              filterable>
+              </el-cascader>
         </template>
       </el-table-column>
       <el-table-column label="操作" min-width="150">
@@ -82,14 +78,14 @@
           </el-upload>
         </el-form-item>
         <el-form-item label="用户角色" label-width="80px" prop="authorityId">
-          <el-select placeholder="请选择" v-model="userInfo.authorityId">
-            <el-option
-              :key="item.authorityId"
-              :label="item.authorityName"
-              :value="item.authorityId"
-              v-for="item in authOptions"
-            ></el-option>
-          </el-select>
+          <el-cascader
+            @change="changeAuthority(scope.row)"
+              v-model="userInfo.authorityId"
+              :options="authOptions"
+              :show-all-levels="false"
+              :props="{ checkStrictly: true,label:'authorityName',value:'authorityId',disabled:'disabled',emitPath:false}"
+              filterable>
+              </el-cascader>
         </el-form-item>
       </el-form>
       <div class="dialog-footer" slot="footer">
@@ -142,23 +138,35 @@ export default {
     ...mapGetters('user', ['token'])
   },
   methods: {
+     setOptions(authData){
+      this.authOptions = []
+      this.setAuthorityOptions(authData,this.authOptions)
+    },
+    setAuthorityOptions(AuthorityData,optionsData){
+      AuthorityData&&AuthorityData.map(item=>{
+        if(item.children.length){
+          const option = {
+            authorityId:item.authorityId,
+            authorityName:item.authorityName,
+            children:[]
+        }
+          this.setAuthorityOptions(item.children,option.children)
+          optionsData.push(option)
+        }else{
+          const option = {
+              authorityId:item.authorityId,
+              authorityName:item.authorityName,
+          }
+          optionsData.push(option)
+        }
+      })
+    },
     async deleteUser(row){
       const res = await deleteUser({id:row.ID})
       if(res.code == 0){
         this.getTableData()
         row.visible = false
       }
-    },
-     getAuthorityList(AuthorityData){
-      AuthorityData.map(item=>{
-        this.authOptions.push({
-          authorityId:item.authorityId,
-          authorityName:item.authorityName
-        })
-        if(item.children){
-          this.getAuthorityList(item.children)
-        }
-      })
     },
     async enterAddUserDialog() {
       this.$refs.userForm.validate(async valid => {
@@ -195,8 +203,7 @@ export default {
   async created() {
     this.getTableData()
     const res = await getAuthorityList({ page: 1, pageSize: 999 })
-    this.authOptions = res.data.list
-    
+    this.setOptions(res.data.list)
   }
 
   

From 093cde16c23c4ca64be843a3569fb9d03e5dbed2 Mon Sep 17 00:00:00 2001
From: klausY <emosick@qq.com>
Date: Fri, 17 Apr 2020 18:10:54 +0800
Subject: [PATCH 2/9] =?UTF-8?q?=E9=A6=96=E9=A1=B5=E7=BE=8E=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 server/config.yaml                            |   2 +-
 web/package-lock.json                         |  39 +-
 web/package.json                              |   2 +
 web/src/main.js                               |  18 +-
 .../view/dashboard/component/RaddarChart.vue  | 120 ++++++
 web/src/view/dashboard/component/Sunburst.vue | 391 ++++++++++++++++++
 .../view/dashboard/component/musicPlayer.vue  |  48 +++
 web/src/view/dashboard/component/stackMap.vue | 167 ++++++++
 .../dashboard/component/todoList/Todo.vue     |  81 ++++
 .../dashboard/component/todoList/index.vue    | 127 ++++++
 web/src/view/dashboard/index.vue              | 220 ++++++++--
 web/src/view/layout/index.vue                 |  11 +-
 12 files changed, 1185 insertions(+), 41 deletions(-)
 create mode 100644 web/src/view/dashboard/component/RaddarChart.vue
 create mode 100644 web/src/view/dashboard/component/Sunburst.vue
 create mode 100644 web/src/view/dashboard/component/musicPlayer.vue
 create mode 100644 web/src/view/dashboard/component/stackMap.vue
 create mode 100644 web/src/view/dashboard/component/todoList/Todo.vue
 create mode 100644 web/src/view/dashboard/component/todoList/index.vue

diff --git a/server/config.yaml b/server/config.yaml
index 0f10318a..c0bfed12 100644
--- a/server/config.yaml
+++ b/server/config.yaml
@@ -13,7 +13,7 @@ mysql:
     username: root
     password: 'Aa@6447985'
     path: '127.0.0.1:3306'
-    db-name: 'qmPlus'
+    db-name: 'yx'
     config: 'charset=utf8&parseTime=True&loc=Local'
     max-idle-conns: 10
     max-open-conns: 10
diff --git a/web/package-lock.json b/web/package-lock.json
index 334084a0..3a5897a4 100644
--- a/web/package-lock.json
+++ b/web/package-lock.json
@@ -870,6 +870,14 @@
                 "postcss": "^7.0.0"
             }
         },
+        "@moefe/vue-aplayer": {
+            "version": "2.0.0-beta.5",
+            "resolved": "https://registry.npmjs.org/@moefe/vue-aplayer/-/vue-aplayer-2.0.0-beta.5.tgz",
+            "integrity": "sha512-ytzp4GStzjftuh7H1rIS/ziqwV1FO67iTLSkDxgN0J2bqlO+rBgDDr83Y+pZKBIgRUc30uu/UZHqmE4QiBHHeg==",
+            "requires": {
+                "vue": "^2.5.17"
+            }
+        },
         "@mrmlnc/readdir-enhanced": {
             "version": "2.2.1",
             "resolved": "https://registry.npm.taobao.org/@mrmlnc/readdir-enhanced/download/@mrmlnc/readdir-enhanced-2.2.1.tgz",
@@ -1280,7 +1288,7 @@
                 "@vue/component-compiler-utils": "^3.0.0",
                 "@vue/preload-webpack-plugin": "^1.1.0",
                 "@vue/web-component-wrapper": "^1.2.0",
-                "acorn": "^6.4.1",
+                "acorn": "^6.1.1",
                 "acorn-walk": "^6.1.1",
                 "address": "^1.0.3",
                 "autoprefixer": "^9.5.1",
@@ -1310,7 +1318,7 @@
                 "lodash.mapvalues": "^4.6.0",
                 "lodash.transform": "^4.6.0",
                 "mini-css-extract-plugin": "^0.6.0",
-                "minimist": "^1.2.3",
+                "minimist": "^1.2.0",
                 "ora": "^3.4.0",
                 "portfinder": "^1.0.20",
                 "postcss-loader": "^3.0.0",
@@ -1331,6 +1339,18 @@
                 "webpack-merge": "^4.2.1"
             },
             "dependencies": {
+                "acorn": {
+                    "version": "6.4.1",
+                    "resolved": "https://registry.npmjs.org/acorn/-/acorn-6.4.1.tgz",
+                    "integrity": "sha512-ZVA9k326Nwrj3Cj9jlh3wGFutC2ZornPNARZwsNYqQYgN0EsV2d53w5RN/co65Ohn4sUAUtb1rSUAOD6XN9idA==",
+                    "dev": true
+                },
+                "minimist": {
+                    "version": "1.2.5",
+                    "resolved": "https://registry.npmjs.org/minimist/-/minimist-1.2.5.tgz",
+                    "integrity": "sha512-FM9nNUYrRBAELZQT3xeZQ7fmMOBg6nWNmJKTcgsJeaLstP/UODVpGsr5OhXhhXg6f+qtJ8uiZ+PUxkDWcgIXLw==",
+                    "dev": true
+                },
                 "semver": {
                     "version": "6.3.0",
                     "resolved": "https://registry.npm.taobao.org/semver/download/semver-6.3.0.tgz",
@@ -4059,6 +4079,14 @@
                 "safer-buffer": "^2.1.0"
             }
         },
+        "echarts": {
+            "version": "4.7.0",
+            "resolved": "https://registry.npmjs.org/echarts/-/echarts-4.7.0.tgz",
+            "integrity": "sha512-NlOTdUcAsIyCCG+N4uh0ZEvXtrPW2jvcuqf03RyqYeCKzyPbiOQ4I3MdKXMhxG3lBdqQNdNXVT71SB4KTQjN0A==",
+            "requires": {
+                "zrender": "4.3.0"
+            }
+        },
         "ee-first": {
             "version": "1.1.1",
             "resolved": "https://registry.npm.taobao.org/ee-first/download/ee-first-1.1.1.tgz",
@@ -12379,6 +12407,11 @@
                     "dev": true
                 }
             }
+        },
+        "zrender": {
+            "version": "4.3.0",
+            "resolved": "https://registry.npmjs.org/zrender/-/zrender-4.3.0.tgz",
+            "integrity": "sha512-Dii6j2bDsPkxQayuVf2DXJeruIB/mKVxxcGRZQ9GExiBd4c3w7+oBuvo1O/JGHeFeA1nCmSDVDs/S7yKZG1nrA=="
         }
     }
-}
\ No newline at end of file
+}
diff --git a/web/package.json b/web/package.json
index 5080427d..f4db3dbe 100644
--- a/web/package.json
+++ b/web/package.json
@@ -8,8 +8,10 @@
         "lint": "vue-cli-service lint"
     },
     "dependencies": {
+        "@moefe/vue-aplayer": "^2.0.0-beta.5",
         "axios": "^0.19.0",
         "core-js": "^2.6.5",
+        "echarts": "^4.7.0",
         "element-ui": "^2.12.0",
         "mavon-editor": "^2.7.7",
         "node-sass": "^4.12.0",
diff --git a/web/src/main.js b/web/src/main.js
index 7d9129c4..ccba01db 100644
--- a/web/src/main.js
+++ b/web/src/main.js
@@ -35,8 +35,24 @@ Vue.config.productionTip = false
 // 路由守卫
 import Bus from '@/utils/bus.js'
 Vue.use(Bus)
+
+import APlayer from '@moefe/vue-aplayer';
+
+Vue.use(APlayer, {
+    defaultCover: 'https://github.com/u3u.png',
+    productionTip: true,
+});
+
+
 new Vue({
     render: h => h(App),
     router,
     store
-}).$mount('#app')
\ No newline at end of file
+}).$mount('#app')
+
+//引入echarts
+import echarts from 'echarts'
+Vue.prototype.$echarts = echarts;
+
+
+
diff --git a/web/src/view/dashboard/component/RaddarChart.vue b/web/src/view/dashboard/component/RaddarChart.vue
new file mode 100644
index 00000000..351f8f72
--- /dev/null
+++ b/web/src/view/dashboard/component/RaddarChart.vue
@@ -0,0 +1,120 @@
+<template>
+    <div :class="className" :style="{height:height,width:width}" />
+</template>
+
+<script>
+    import echarts from 'echarts'
+    require('echarts/theme/macarons') // echarts theme
+
+    const animationDuration = 3000
+
+    export default {
+        name:'RaddarChart',
+        props: {
+            className: {
+                type: String,
+                default: 'chart'
+            },
+            width: {
+                type: String,
+                default: '100%'
+            },
+            height: {
+                type: String,
+                default: '300px'
+            }
+        },
+        data() {
+            return {
+                chart: null
+            }
+        },
+        mounted() {
+            this.initChart()
+           /* this.__resizeHandler = debounce(() => {
+                if (this.chart) {
+                    this.chart.resize()
+                }
+            }, 100)
+            window.addEventListener('resize', this.__resizeHandler)*/
+        },
+        beforeDestroy() {
+            if (!this.chart) {
+                return
+            }
+            // window.removeEventListener('resize', this.__resizeHandler)
+            this.chart.dispose()
+            this.chart = null
+        },
+        methods: {
+            initChart() {
+                this.chart = echarts.init(this.$el, 'light')
+
+                this.chart.setOption({
+                    tooltip: {
+                        trigger: 'axis',
+                        axisPointer: { // 坐标轴指示器，坐标轴触发有效
+                            type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
+                        }
+                    },
+                    radar: {
+                        radius: '66%',
+                        center: ['50%', '42%'],
+                        splitNumber: 8,
+                        splitArea: {
+                            areaStyle: {
+                                color: 'rgba(255,192,203,.3)',
+                                opacity: 1,
+                                shadowBlur: 45,
+                                shadowColor: 'rgba(0,0,0,.5)',
+                                shadowOffsetX: 0,
+                                shadowOffsetY: 15
+                            }
+                        },
+                        indicator: [
+                            { name: 'Sales', max: 10000 },
+                            { name: 'Administration', max: 20000 },
+                            { name: 'Information Techology', max: 20000 },
+                            { name: 'Customer Support', max: 20000 },
+                            { name: 'Development', max: 20000 },
+                            { name: 'Marketing', max: 20000 }
+                        ]
+                    },
+                    legend: {
+                        left: 'center',
+                        bottom: '10',
+                        data: ['Allocated Budget', 'Expected Spending', 'Actual Spending']
+                    },
+                    series: [{
+                        type: 'radar',
+                        symbolSize: 0,
+                        areaStyle: {
+                            normal: {
+                                shadowBlur: 13,
+                                shadowColor: 'rgba(0,0,0,.2)',
+                                shadowOffsetX: 0,
+                                shadowOffsetY: 10,
+                                opacity: 1
+                            }
+                        },
+                        data: [
+                            {
+                                value: [5000, 7000, 12000, 11000, 15000, 14000],
+                                name: 'Allocated Budget'
+                            },
+                            {
+                                value: [4000, 9000, 15000, 15000, 13000, 11000],
+                                name: 'Expected Spending'
+                            },
+                            {
+                                value: [5500, 11000, 12000, 15000, 12000, 12000],
+                                name: 'Actual Spending'
+                            }
+                        ],
+                        animationDuration: animationDuration
+                    }]
+                })
+            }
+        }
+    }
+</script>
diff --git a/web/src/view/dashboard/component/Sunburst.vue b/web/src/view/dashboard/component/Sunburst.vue
new file mode 100644
index 00000000..01fac5c6
--- /dev/null
+++ b/web/src/view/dashboard/component/Sunburst.vue
@@ -0,0 +1,391 @@
+<template>
+    <div :class="className" :style="{height:height,width:width}" />
+</template>
+
+<script>
+    import echarts from 'echarts'
+    require('echarts/theme/macarons') // echarts theme
+
+    const animationDuration = 3000
+
+    export default {
+        name: "Sunburst",
+        props: {
+            className: {
+                type: String,
+                default: 'chart'
+            },
+            width: {
+                type: String,
+                default: '100%'
+            },
+            height: {
+                type: String,
+                default: '300px'
+            }
+        },
+        data() {
+            return {
+                chart: null,
+                datas:[
+                    {
+                    name: 'Flora',
+                    itemStyle: {
+                        color: '#da0d68'
+                    },
+                    children: [{
+                        name: 'Black Tea',
+                        value: 1,
+                        itemStyle: {
+                            color: '#975e6d'
+                        }
+                    }, {
+                        name: 'Floral',
+                        itemStyle: {
+                            color: '#e0719c'
+                        },
+                        children: [{
+                            name: 'Chamomile',
+                            value: 1,
+                            itemStyle: {
+                                color: '#f99e1c'
+                            }
+                        }, {
+                            name: 'Rose',
+                            value: 1,
+                            itemStyle: {
+                                color: '#ef5a78'
+                            }
+                        }, {
+                            name: 'Jasmine',
+                            value: 1,
+                            itemStyle: {
+                                color: '#f7f1bd'
+                            }
+                        }]
+                    }]
+                },
+                    {
+                    name: 'Fruity',
+                    itemStyle: {
+                        color: '#da1d23'
+                    },
+                    children: [{
+                        name: 'Berry',
+                        itemStyle: {
+                            color: '#dd4c51'
+                        },
+                        children: [{
+                            name: 'Blackberry',
+                            value: 1,
+                            itemStyle: {
+                                color: '#3e0317'
+                            }
+                        }, {
+                            name: 'Raspberry',
+                            value: 1,
+                            itemStyle: {
+                                color: '#e62969'
+                            }
+                        }, {
+                            name: 'Blueberry',
+                            value: 1,
+                            itemStyle: {
+                                color: '#6569b0'
+                            }
+                        }, {
+                            name: 'Strawberry',
+                            value: 1,
+                            itemStyle: {
+                                color: '#ef2d36'
+                            }
+                        }]
+                    }, {
+                        name: 'Dried Fruit',
+                        itemStyle: {
+                            color: '#c94a44'
+                        },
+                        children: [{
+                            name: 'Raisin',
+                            value: 1,
+                            itemStyle: {
+                                color: '#b53b54'
+                            }
+                        }, {
+                            name: 'Prune',
+                            value: 1,
+                            itemStyle: {
+                                color: '#a5446f'
+                            }
+                        }]
+                    }, {
+                        name: 'Other Fruit',
+                        itemStyle: {
+                            color: '#dd4c51'
+                        },
+                        children: [{
+                            name: 'Coconut',
+                            value: 1,
+                            itemStyle: {
+                                color: '#f2684b'
+                            }
+                        }, {
+                            name: 'Cherry',
+                            value: 1,
+                            itemStyle: {
+                                color: '#e73451'
+                            }
+                        }, {
+                            name: 'Pomegranate',
+                            value: 1,
+                            itemStyle: {
+                                color: '#e65656'
+                            }
+                        }, {
+                            name: 'Pineapple',
+                            value: 1,
+                            itemStyle: {
+                                color: '#f89a1c'
+                            }
+                        }, {
+                            name: 'Grape',
+                            value: 1,
+                            itemStyle: {
+                                color: '#aeb92c'
+                            }
+                        }, {
+                            name: 'Apple',
+                            value: 1,
+                            itemStyle: {
+                                color: '#4eb849'
+                            }
+                        }, {
+                            name: 'Peach',
+                            value: 1,
+                            itemStyle: {
+                                color: '#f68a5c'
+                            }
+                        }, {
+                            name: 'Pear',
+                            value: 1,
+                            itemStyle: {
+                                color: '#baa635'
+                            }
+                        }]
+                    }, {
+                        name: 'Citrus Fruit',
+                        itemStyle: {
+                            color: '#f7a128'
+                        },
+                        children: [{
+                            name: 'Grapefruit',
+                            value: 1,
+                            itemStyle: {
+                                color: '#f26355'
+                            }
+                        }, {
+                            name: 'Orange',
+                            value: 1,
+                            itemStyle: {
+                                color: '#e2631e'
+                            }
+                        }, {
+                            name: 'Lemon',
+                            value: 1,
+                            itemStyle: {
+                                color: '#fde404'
+                            }
+                        }, {
+                            name: 'Lime',
+                            value: 1,
+                            itemStyle: {
+                                color: '#7eb138'
+                            }
+                        }]
+                    }]
+                },
+                    {
+                    name: 'Other',
+                    itemStyle: {
+                        color: '#0aa3b5'
+                    },
+                    children: [{
+                        name: 'Papery/Musty',
+                        itemStyle: {
+                            color: '#9db2b7'
+                        },
+                        children: [{
+                            name: 'Stale',
+                            value: 1,
+                            itemStyle: {
+                                color: '#8b8c90'
+                            }
+                        }, {
+                            name: 'Cardboard',
+                            value: 1,
+                            itemStyle: {
+                                color: '#beb276'
+                            }
+                        }, {
+                            name: 'Papery',
+                            value: 1,
+                            itemStyle: {
+                                color: '#fefef4'
+                            }
+                        }, {
+                            name: 'Woody',
+                            value: 1,
+                            itemStyle: {
+                                color: '#744e03'
+                            }
+                        }, {
+                            name: 'Moldy/Damp',
+                            value: 1,
+                            itemStyle: {
+                                color: '#a3a36f'
+                            }
+                        }, {
+                            name: 'Musty/Dusty',
+                            value: 1,
+                            itemStyle: {
+                                color: '#c9b583'
+                            }
+                        }, {
+                            name: 'Musty/Earthy',
+                            value: 1,
+                            itemStyle: {
+                                color: '#978847'
+                            }
+                        }, {
+                            name: 'Animalic',
+                            value: 1,
+                            itemStyle: {
+                                color: '#9d977f'
+                            }
+                        }, {
+                            name: 'Meaty Brothy',
+                            value: 1,
+                            itemStyle: {
+                                color: '#cc7b6a'
+                            }
+                        }, {
+                            name: 'Phenolic',
+                            value: 1,
+                            itemStyle: {
+                                color: '#db646a'
+                            }
+                        }]
+                    }, {
+                        name: 'Chemical',
+                        itemStyle: {
+                            color: '#76c0cb'
+                        },
+                        children: [{
+                            name: 'Bitter',
+                            value: 1,
+                            itemStyle: {
+                                color: '#80a89d'
+                            }
+                        }, {
+                            name: 'Salty',
+                            value: 1,
+                            itemStyle: {
+                                color: '#def2fd'
+                            }
+                        }, {
+                            name: 'Medicinal',
+                            value: 1,
+                            itemStyle: {
+                                color: '#7a9bae'
+                            }
+                        }, {
+                            name: 'Petroleum',
+                            value: 1,
+                            itemStyle: {
+                                color: '#039fb8'
+                            }
+                        }, {
+                            name: 'Skunky',
+                            value: 1,
+                            itemStyle: {
+                                color: '#5e777b'
+                            }
+                        }, {
+                            name: 'Rubber',
+                            value: 1,
+                            itemStyle: {
+                                color: '#120c0c'
+                            }
+                        }]
+                    }]
+                },
+                ]
+            }
+        },
+        mounted() {
+            this.initChart()
+            /* this.__resizeHandler = debounce(() => {
+                 if (this.chart) {
+                     this.chart.resize()
+                 }
+             }, 100)
+             window.addEventListener('resize', this.__resizeHandler)*/
+        },
+        beforeDestroy() {
+            if (!this.chart) {
+                return
+            }
+            // window.removeEventListener('resize', this.__resizeHandler)
+            this.chart.dispose()
+            this.chart = null
+        },
+        methods: {
+            initChart() {
+                this.chart = echarts.init(this.$el, 'macarons')
+
+                this.chart.setOption({
+
+                        series: {
+                            type: 'sunburst',
+                            highlightPolicy: 'ancestor',
+                            data: this.datas,
+                            radius: [0, '95%'],
+                            sort: null,
+                            levels: [{}, {
+                                r0: '15%',
+                                r: '35%',
+                                itemStyle: {
+                                    borderWidth: 2
+                                },
+                                label: {
+                                    rotate: 'tangential'
+                                }
+                            }, {
+                                r0: '35%',
+                                r: '70%',
+                                label: {
+                                    align: 'right'
+                                }
+                            }, {
+                                r0: '70%',
+                                r: '72%',
+                                label: {
+                                    position: 'outside',
+                                    padding: 3,
+                                    silent: false
+                                },
+                                itemStyle: {
+                                    borderWidth: 3
+                                }
+                            }]
+                        },
+                animationDuration: animationDuration
+                })
+            }
+        }
+    }
+</script>
+
+<style scoped>
+
+</style>
diff --git a/web/src/view/dashboard/component/musicPlayer.vue b/web/src/view/dashboard/component/musicPlayer.vue
new file mode 100644
index 00000000..7ed59f4a
--- /dev/null
+++ b/web/src/view/dashboard/component/musicPlayer.vue
@@ -0,0 +1,48 @@
+<template>
+    <div>
+        <div style="width: 100%">
+            <APlayer :audio="audio"></APlayer>
+        </div>
+    </div>
+</template>
+
+<script>
+    import { APlayer } from '@moefe/vue-aplayer';
+    export default {
+        name: "musicPlayer",
+        components:{
+            APlayer
+        },
+        data(){
+            return {
+                audio :[
+                    {
+                        name: '东西（Cover：林俊呈）',
+                        artist: '纳豆',
+                        url: 'https://cdn.moefe.org/music/mp3/thing.mp3',
+                        cover: 'https://p1.music.126.net/5zs7IvmLv7KahY3BFzUmrg==/109951163635241613.jpg?param=300y300', // prettier-ignore
+                        lrc: 'https://cdn.moefe.org/music/lrc/thing.lrc',
+                    },
+                    {
+                        name: '响喜乱舞（Cover：MARiA）',
+                        artist: '泠鸢yousa',
+                        url: 'https://cdn.moefe.org/music/mp3/kyoukiranbu.mp3',
+                        cover: 'https://p1.music.126.net/AUGVPQ_rVrngDH9ocQrn3Q==/109951163613037822.jpg?param=300y300', // prettier-ignore
+                        lrc: 'https://cdn.moefe.org/music/lrc/kyoukiranbu.lrc',
+                    },
+                    {
+                        name: '啵唧',
+                        artist: 'Hanser',
+                        url: 'https://cdn.moefe.org/music/mp3/kiss.mp3',
+                        cover: 'https://p1.music.126.net/K0-IPcIQ9QFvA0jXTBqoWQ==/109951163636756693.jpg?param=300y300', // prettier-ignore
+                        lrc: 'https://cdn.moefe.org/music/lrc/kiss.lrc',
+                    },
+                ]
+            }
+        }
+    }
+</script>
+
+<style scoped>
+
+</style>
diff --git a/web/src/view/dashboard/component/stackMap.vue b/web/src/view/dashboard/component/stackMap.vue
new file mode 100644
index 00000000..ffb04947
--- /dev/null
+++ b/web/src/view/dashboard/component/stackMap.vue
@@ -0,0 +1,167 @@
+<template>
+    <div :class="className" :style="{height:height,width:width}" />
+</template>
+
+<script>
+    import echarts from 'echarts'
+    require('echarts/theme/macarons') // echarts theme
+
+    const animationDuration = 3000
+
+    export default {
+        name: "stackMap",
+        props: {
+            className: {
+                type: String,
+                default: 'chart'
+            },
+            width: {
+                type: String,
+                default: '100%'
+            },
+            height: {
+                type: String,
+                default: '300px'
+            }
+        },
+        data() {
+            return {
+                chart: null
+            }
+        },
+        mounted() {
+            this.initChart()
+            /* this.__resizeHandler = debounce(() => {
+                 if (this.chart) {
+                     this.chart.resize()
+                 }
+             }, 100)
+             window.addEventListener('resize', this.__resizeHandler)*/
+        },
+        beforeDestroy() {
+            if (!this.chart) {
+                return
+            }
+            // window.removeEventListener('resize', this.__resizeHandler)
+            this.chart.dispose()
+            this.chart = null
+        },
+        methods: {
+            initChart() {
+                this.chart = echarts.init(this.$el, 'light')
+
+                this.chart.setOption({
+                    tooltip: {
+                        trigger: 'axis',
+                        axisPointer: {            // 坐标轴指示器，坐标轴触发有效
+                            type: 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
+                        }
+                    },
+                    legend: {
+                        data: ['Javascript', 'Java', 'Python', 'Ruby', 'PHP']
+                    },
+                    grid: {
+                        left: '3%',
+                        right: '4%',
+                        bottom: '3%',
+                        containLabel: true
+                    },
+                    xAxis: {
+                        type: 'value',
+                        axisLabel: {
+                            show: true,
+                            textStyle: {
+                                color: 'rgb(192,192,192)',  //更改坐标轴文字颜色
+                                fontSize : 12     //更改坐标轴文字大小
+                            }
+                        },
+                        axisTick: {
+                            show: false
+                        },
+                        axisLine:{
+                            lineStyle:{
+                                color:'rgb(192,192,192)' //更改坐标轴颜色
+                            }
+                        },
+                    },
+                    yAxis: {
+                        type: 'category',
+                        data: ['Mon', 'Tue', 'Wen', 'Thu', 'Fri', 'Sat', 'Sun'],
+                        axisLabel: {
+                            show: true,
+                            textStyle: {
+                                color: 'rgb(192,192,192)',  //更改坐标轴文字颜色
+                                fontSize: 12     //更改坐标轴文字大小
+                            }
+                        },
+                        axisTick: {
+                            show: false
+                        },
+                        axisLine: {
+                            lineStyle: {
+                                color: 'rgb(192,192,192)' //更改坐标轴颜色
+                            }
+                        }
+                    },
+                    series: [
+                        {
+                            name: 'Javascript',
+                            type: 'bar',
+                            stack: '总量',
+                            label: {
+                                show: true,
+                                position: 'insideRight'
+                            },
+                            data: [320, 302, 301, 334, 390, 330, 320]
+                        },
+                        {
+                            name: 'Java',
+                            type: 'bar',
+                            stack: '总量',
+                            label: {
+                                show: true,
+                                position: 'insideRight'
+                            },
+                            data: [120, 132, 101, 134, 90, 230, 210]
+                        },
+                        {
+                            name: 'Python',
+                            type: 'bar',
+                            stack: '总量',
+                            label: {
+                                show: true,
+                                position: 'insideRight'
+                            },
+                            data: [220, 182, 191, 234, 290, 330, 310]
+                        },
+                        {
+                            name: 'Ruby',
+                            type: 'bar',
+                            stack: '总量',
+                            label: {
+                                show: true,
+                                position: 'insideRight'
+                            },
+                            data: [150, 212, 201, 154, 190, 330, 410]
+                        },
+                        {
+                            name: 'PHP',
+                            type: 'bar',
+                            stack: '总量',
+                            label: {
+                                show: true,
+                                position: 'insideRight'
+                            },
+                            data: [820, 832, 901, 934, 1290, 1330, 1320]
+                        }
+                    ],
+                    animationDuration: animationDuration
+                })
+            }
+        }
+    }
+</script>
+
+<style scoped>
+
+</style>
diff --git a/web/src/view/dashboard/component/todoList/Todo.vue b/web/src/view/dashboard/component/todoList/Todo.vue
new file mode 100644
index 00000000..1ca0af92
--- /dev/null
+++ b/web/src/view/dashboard/component/todoList/Todo.vue
@@ -0,0 +1,81 @@
+<template>
+    <li :class="{ completed: todo.done, editing: editing }" class="todo">
+        <div class="view">
+            <input
+                    :checked="todo.done"
+                    class="toggle"
+                    type="checkbox"
+                    @change="toggleTodo( todo)"
+            >
+            <label @dblclick="editing = true" v-text="todo.text" />
+            <button class="destroy" @click="deleteTodo( todo )" />
+        </div>
+        <input
+                v-show="editing"
+                v-focus="editing"
+                :value="todo.text"
+                class="edit"
+                @keyup.enter="doneEdit"
+                @keyup.esc="cancelEdit"
+                @blur="doneEdit"
+        >
+    </li>
+</template>
+
+<script>
+    export default {
+        name: 'Todo',
+        directives: {
+            focus(el, { value }, { context }) {
+                if (value) {
+                    context.$nextTick(() => {
+                        el.focus()
+                    })
+                }
+            }
+        },
+        props: {
+            todo: {
+                type: Object,
+                default: function() {
+                    return {}
+                }
+            }
+        },
+        data() {
+            return {
+                editing: false
+            }
+        },
+        methods: {
+            deleteTodo(todo) {
+                this.$emit('deleteTodo', todo)
+            },
+            editTodo({ todo, value }) {
+                this.$emit('editTodo', { todo, value })
+            },
+            toggleTodo(todo) {
+                this.$emit('toggleTodo', todo)
+            },
+            doneEdit(e) {
+                const value = e.target.value.trim()
+                const { todo } = this
+                if (!value) {
+                    this.deleteTodo({
+                        todo
+                    })
+                } else if (this.editing) {
+                    this.editTodo({
+                        todo,
+                        value
+                    })
+                    this.editing = false
+                }
+            },
+            cancelEdit(e) {
+                e.target.value = this.todo.text
+                this.editing = false
+            }
+        }
+    }
+</script>
diff --git a/web/src/view/dashboard/component/todoList/index.vue b/web/src/view/dashboard/component/todoList/index.vue
new file mode 100644
index 00000000..4972fd2d
--- /dev/null
+++ b/web/src/view/dashboard/component/todoList/index.vue
@@ -0,0 +1,127 @@
+<template>
+    <section class="todoapp">
+        <!-- header -->
+        <header class="header">
+            <input class="new-todo" autocomplete="off" placeholder="Todo List" @keyup.enter="addTodo">
+        </header>
+        <!-- main section -->
+        <section v-show="todos.length" class="main">
+            <input id="toggle-all" :checked="allChecked" class="toggle-all" type="checkbox" @change="toggleAll({ done: !allChecked })">
+            <label for="toggle-all" />
+            <ul class="todo-list">
+                <todo
+                        v-for="(todo, index) in filteredTodos"
+                        :key="index"
+                        :todo="todo"
+                        @toggleTodo="toggleTodo"
+                        @editTodo="editTodo"
+                        @deleteTodo="deleteTodo"
+                />
+            </ul>
+        </section>
+        <!-- footer -->
+        <footer v-show="todos.length" class="footer">
+      <span class="todo-count">
+        <strong>{{ remaining }}</strong>
+        {{ remaining | pluralize('item') }} left
+      </span>
+            <ul class="filters">
+                <li v-for="(val, key) in filters" :key="key">
+                    <a :class="{ selected: visibility === key }" @click.prevent="visibility = key">{{ key | capitalize }}</a>
+                </li>
+            </ul>
+            <!-- <button class="clear-completed" v-show="todos.length > remaining" @click="clearCompleted">
+              Clear completed
+            </button> -->
+        </footer>
+    </section>
+</template>
+
+<script>
+    import Todo from './Todo.vue'
+
+    const STORAGE_KEY = 'todos'
+    const filters = {
+        all: todos => todos,
+        active: todos => todos.filter(todo => !todo.done),
+        completed: todos => todos.filter(todo => todo.done)
+    }
+    const defalutList = [
+        { text: 'star this repository', done: false },
+        { text: 'fork this repository', done: false },
+        { text: 'follow author', done: false },
+        { text: 'vue-element-admin', done: true },
+        { text: 'vue', done: true },
+        { text: 'element-ui', done: true },
+        { text: 'axios', done: true },
+        { text: 'webpack', done: true }
+    ]
+    export default {
+        components: { Todo },
+        filters: {
+            pluralize: (n, w) => n === 1 ? w : w + 's',
+            capitalize: s => s.charAt(0).toUpperCase() + s.slice(1)
+        },
+        data() {
+            return {
+                visibility: 'all',
+                filters,
+                // todos: JSON.parse(window.localStorage.getItem(STORAGE_KEY)) || defalutList
+                todos: defalutList
+            }
+        },
+        computed: {
+            allChecked() {
+                return this.todos.every(todo => todo.done)
+            },
+            filteredTodos() {
+                return filters[this.visibility](this.todos)
+            },
+            remaining() {
+                return this.todos.filter(todo => !todo.done).length
+            }
+        },
+        methods: {
+            setLocalStorage() {
+                window.localStorage.setItem(STORAGE_KEY, JSON.stringify(this.todos))
+            },
+            addTodo(e) {
+                const text = e.target.value
+                if (text.trim()) {
+                    this.todos.push({
+                        text,
+                        done: false
+                    })
+                    this.setLocalStorage()
+                }
+                e.target.value = ''
+            },
+            toggleTodo(val) {
+                val.done = !val.done
+                this.setLocalStorage()
+            },
+            deleteTodo(todo) {
+                this.todos.splice(this.todos.indexOf(todo), 1)
+                this.setLocalStorage()
+            },
+            editTodo({ todo, value }) {
+                todo.text = value
+                this.setLocalStorage()
+            },
+            clearCompleted() {
+                this.todos = this.todos.filter(todo => !todo.done)
+                this.setLocalStorage()
+            },
+            toggleAll({ done }) {
+                this.todos.forEach(todo => {
+                    todo.done = done
+                    this.setLocalStorage()
+                })
+            }
+        }
+    }
+</script>
+
+<style lang="scss">
+    /*@import './index.scss';*/
+</style>
diff --git a/web/src/view/dashboard/index.vue b/web/src/view/dashboard/index.vue
index b6b02927..7c4213a2 100644
--- a/web/src/view/dashboard/index.vue
+++ b/web/src/view/dashboard/index.vue
@@ -1,48 +1,204 @@
 <template>
-  <div>
-    <h2 style="text-align:center">gin-vue-admin by 奇淼 And krank666</h2>
-    <h2 style="text-align:center;margin:15px">点击动画获取联系方式</h2>
+ <div class="big">
+     <div class="mid">
+         <el-row :gutter="32">
+             <el-col :xs="24" :sm="24" :lg="8">
+                 <div class="chart-wrapper">
+                     <raddar-chart />
+                 </div>
+             </el-col>
+             <el-col :xs="24" :sm="24" :lg="8">
+                 <div class="chart-wrapper">
+                     <stackMap />
+                 </div>
+             </el-col>
+             <el-col :xs="24" :sm="24" :lg="8">
+                 <div class="chart-wrapper">
+                     <Sunburst/>
+                 </div>
+             </el-col>
+         </el-row>
+     </div>
+     <div class="top">
+         <div id="main" class="chart-container"></div>
+     </div>
+     <div class="bottom">
+         <el-row :gutter="32">
+             <el-col :xs="24" :sm="24" :lg="12">
+                 <div class="chart-player">
+                     <musicPlayer />
+                 </div>
+             </el-col>
+             <el-col :xs="24" :sm="24" :lg="12">
+                 <div  style="background:pink;">
+                 </div>
+             </el-col>
+         </el-row>
+     </div>
+ </div>
 
-    <el-drawer
-      :visible.sync="drawer"
-      title="联系方式"
-    >
-      <div style="text-align:center;margin-top:30px;">
-        <img src="http://qmplusimg.henrongyi.top/yx.jpg" width="180" />
-        <H3>krank666微信</H3>
-      </div>
-      <div style="text-align:center;margin-top:30px;">
-        <img src="http://qmplusimg.henrongyi.top/jjz.jpg" width="180" />
-        <H3>Mr.奇淼微信</H3>
-      </div>
-    </el-drawer>
-    <div @click="drawer = true">
-      <Animition />
-    </div>
-    <h2 style="text-align:right;margin:40px;">
-      当前版本号：v0.1.0
-    </h2>
-  </div>
 </template>
 
 <script>
-import { mapGetters } from 'vuex'
-import Animition from '@/view/dashboard/component/animition.vue'
+import echarts from 'echarts'
+require('echarts/theme/macarons') // echarts theme
+import RaddarChart from "./component/RaddarChart"
+import stackMap from "./component/stackMap"
+import Sunburst from "./component/Sunburst"
+import musicPlayer from "./component/musicPlayer"
 export default {
   name: 'Dashboard',
   data() {
     return {
-      drawer: false
+
     }
   },
-  computed: {
-    ...mapGetters('user', ['userInfo'])
-  },
-  components: {
-    Animition
+    components:{
+        RaddarChart, //雷达图
+        stackMap, //堆叠图
+        Sunburst, //旭日图
+        musicPlayer  //音乐播放器
+    },
+  mounted() {
+      let myChart = echarts.init(document.getElementById('main'),'macarons');
+      // let stackMap = echarts.init(document.getElementById('stackMap'));
+      let  option = {
+          legend: {},
+          tooltip: {
+              trigger: 'axis',
+              showContent: false
+          },
+          dataset: {
+              source: [
+                  ['product', '2012', '2013', '2014', '2015', '2016', '2017','2018','2019','2020'],
+                  ['Matcha Latte', 41.1, 30.4, 65.1, 53.3, 83.8, 70.0,6.4, 65.2, 82.5],
+                  ['Milk Tea', 86.5, 92.1, 85.7, 83.1, 73.4, 55.1,2, 67.1, 69.2],
+                  ['Cheese Cocoa', 24.1, 67.2, 79.5, 86.4, 65.2, 82.5,65.1, 53.3, 83.8],
+                  ['Walnut Brownie', 55.2, 67.1, 69.2, 72.4, 53.9, 39.1,86.5, 92.1, 85.7]
+              ]
+          },
+          xAxis: {
+              type: 'category',
+              axisLabel: {
+                  show: true,
+                  textStyle: {
+                      color: 'rgb(192,192,192)',  //更改坐标轴文字颜色
+                      fontSize : 14    //更改坐标轴文字大小
+                  }
+              },
+              axisTick: {
+                  show: false
+              },
+              axisLine:{
+                  lineStyle:{
+                      color:'rgb(192,192,192)' //更改坐标轴颜色
+                  }
+              },
+          },
+          yAxis: {
+              gridIndex:0,
+              axisLabel: {
+                  show: true,
+                  textStyle: {
+                      color: 'rgb(192,192,192)',  //更改坐标轴文字颜色
+                      fontSize: 14    //更改坐标轴文字大小
+                  }
+              },
+              axisTick: {
+                  show: false
+              },
+              axisLine: {
+                  lineStyle: {
+                      color: 'rgb(192,192,192)' //更改坐标轴颜色
+                  }
+              }
+          },
+          grid: {top: '55%'},
+          series: [
+              {type: 'line', smooth: true, seriesLayoutBy: 'row'},
+              {type: 'line', smooth: true, seriesLayoutBy: 'row'},
+              {type: 'line', smooth: true, seriesLayoutBy: 'row'},
+              {type: 'line', smooth: true, seriesLayoutBy: 'row'},
+              {
+                  type: 'pie',
+                  id: 'pie',
+                  radius: '30%',
+                  center: ['50%', '25%'],
+                  label: {
+                      formatter: '{b}: {@2012} ({d}%)'
+                  },
+                  encode: {
+                      itemName: 'product',
+                      value: '2012',
+                      tooltip: '2012'
+                  }
+              }
+          ]
+      };
+      //点记标记点时的动效
+      myChart.on('updateAxisPointer', function (event) {
+          var xAxisInfo = event.axesInfo[0];
+          if (xAxisInfo) {
+              var dimension = xAxisInfo.value + 1;
+              myChart.setOption({
+                  series: {
+                      id: 'pie',
+                      label: {
+                          formatter: '{b}: {@[' + dimension + ']} ({d}%)'
+                      },
+                      encode: {
+                          value: dimension,
+                          tooltip: dimension
+                      }
+                  }
+              });
+          }
+      });
+
+      window.addEventListener('resize',function() {myChart.resize()});
+      myChart.setOption(option);
+
   }
 }
 </script>
 
 <style lang="scss" scoped>
-</style>
\ No newline at end of file
+    .big{
+        width: 100%;
+        .top{
+            width: 98%;
+            height: 360px;
+            margin-top: 20px;
+            overflow: hidden;
+            .chart-container{
+                position: relative;
+                width: 100%;
+                height: 100%;
+                padding: 20px;
+                background-color: #fff;
+            }
+        }
+        .mid{
+            width: 98%;
+            height: 380px;
+            .chart-wrapper {
+                height: 340px;
+                background: #fff;
+                padding: 16px 16px 0;
+                margin-bottom: 32px;
+            }
+        }
+        .bottom{
+            width: 98%;
+            height: 230px;
+            margin-top: 20px;
+            .chart-player{
+                width: 100%;
+                height: 100%;
+                padding: 20px;
+                background-color: #fff;
+            }
+        }
+    }
+
+</style>
diff --git a/web/src/view/layout/index.vue b/web/src/view/layout/index.vue
index 35632400..6098ff29 100644
--- a/web/src/view/layout/index.vue
+++ b/web/src/view/layout/index.vue
@@ -60,10 +60,10 @@
               </div>
             </el-dialog>
           </div>
-      
+
         </el-header>
         <!-- 当前面包屑用路由自动生成可根据需求修改 -->
-        <!-- 
+        <!--
         :to="{ path: item.path }" 暂时注释不用-->
         <HistoryComponent />
         <transition mode="out-in" name="el-fade-in-linear">
@@ -114,7 +114,7 @@ export default {
           }
         ]
       },
-      
+
     }
   },
   components: {
@@ -216,6 +216,9 @@ $mainHight: 100vh;
 .dropdown-group {
   min-width: 100px;
 }
+.admin-box{
+  background-color: rgb(243,243,243);
+}
 .el-scrollbar__wrap {
   padding-bottom: 17px;
 }
@@ -318,4 +321,4 @@ $mainHight: 100vh;
     }
   }
 }
-</style>
\ No newline at end of file
+</style>

From a766be61d836a63784027dd3db9cc39af20866c7 Mon Sep 17 00:00:00 2001
From: QM303176530 <303176530@qq.com>
Date: Fri, 17 Apr 2020 21:45:29 +0800
Subject: [PATCH 3/9] =?UTF-8?q?=E8=BF=98=E5=8E=9Fdbname?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 server/config.yaml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/server/config.yaml b/server/config.yaml
index c0bfed12..02631245 100644
--- a/server/config.yaml
+++ b/server/config.yaml
@@ -13,7 +13,7 @@ mysql:
     username: root
     password: 'Aa@6447985'
     path: '127.0.0.1:3306'
-    db-name: 'yx'
+    db-name: 'qmplus'
     config: 'charset=utf8&parseTime=True&loc=Local'
     max-idle-conns: 10
     max-open-conns: 10

From 992b8446cf6606f8d9d8d4f1489cded95e8e0513 Mon Sep 17 00:00:00 2001
From: QM303176530 <303176530@qq.com>
Date: Fri, 17 Apr 2020 23:31:08 +0800
Subject: [PATCH 4/9] =?UTF-8?q?=E6=9A=82=E6=97=B6=E9=9A=90=E8=97=8F?=
 =?UTF-8?q?=E9=9F=B3=E4=B9=90=E6=92=AD=E6=94=BE=E5=99=A8=20=E4=BF=AE?=
 =?UTF-8?q?=E6=94=B9=E5=85=A8=E5=B1=80css?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/view/dashboard/index.vue               | 9 +++++----
 web/src/view/example/breakpoint/breakpoint.vue | 4 ++--
 web/src/view/layout/index.vue                  | 2 +-
 3 files changed, 8 insertions(+), 7 deletions(-)

diff --git a/web/src/view/dashboard/index.vue b/web/src/view/dashboard/index.vue
index 7c4213a2..3288211a 100644
--- a/web/src/view/dashboard/index.vue
+++ b/web/src/view/dashboard/index.vue
@@ -22,7 +22,7 @@
      <div class="top">
          <div id="main" class="chart-container"></div>
      </div>
-     <div class="bottom">
+     <!-- <div class="bottom">
          <el-row :gutter="32">
              <el-col :xs="24" :sm="24" :lg="12">
                  <div class="chart-player">
@@ -34,7 +34,7 @@
                  </div>
              </el-col>
          </el-row>
-     </div>
+     </div> -->
  </div>
 
 </template>
@@ -45,7 +45,7 @@ require('echarts/theme/macarons') // echarts theme
 import RaddarChart from "./component/RaddarChart"
 import stackMap from "./component/stackMap"
 import Sunburst from "./component/Sunburst"
-import musicPlayer from "./component/musicPlayer"
+// import musicPlayer from "./component/musicPlayer"
 export default {
   name: 'Dashboard',
   data() {
@@ -57,7 +57,7 @@ export default {
         RaddarChart, //雷达图
         stackMap, //堆叠图
         Sunburst, //旭日图
-        musicPlayer  //音乐播放器
+        // musicPlayer  //音乐播放器
     },
   mounted() {
       let myChart = echarts.init(document.getElementById('main'),'macarons');
@@ -165,6 +165,7 @@ export default {
 <style lang="scss" scoped>
     .big{
         width: 100%;
+        background-color: rgb(243,243,243);;
         .top{
             width: 98%;
             height: 360px;
diff --git a/web/src/view/example/breakpoint/breakpoint.vue b/web/src/view/example/breakpoint/breakpoint.vue
index 0a2ea941..2a198629 100644
--- a/web/src/view/example/breakpoint/breakpoint.vue
+++ b/web/src/view/example/breakpoint/breakpoint.vue
@@ -63,9 +63,9 @@ export default {
       fileR.readAsArrayBuffer(file) // 把文件读成ArrayBuffer  主要为了保持跟后端的流一致
       fileR.onload = async e => {
         // 读成arrayBuffer的回调 e 为方法自带参数 相当于 dom的e 流存在e.target.result 中
-        const bolb = e.target.result
+        const blob = e.target.result
         let spark = new SparkMD5.ArrayBuffer() // 创建md5制造工具 （md5用于检测文件一致性 这里不懂就打电话问我）
-        spark.append(bolb) // 文件流丢进工具
+        spark.append(blob) // 文件流丢进工具
         this.fileMd5 = spark.end() // 工具结束 产生一个a 总文件的md5
         const FileSliceCap = 1 * 1024 * 1024 // 分片字节数
         let start = 0 // 定义分片开始切的地方
diff --git a/web/src/view/layout/index.vue b/web/src/view/layout/index.vue
index 0b82d217..52736e27 100644
--- a/web/src/view/layout/index.vue
+++ b/web/src/view/layout/index.vue
@@ -222,7 +222,7 @@ $mainHight: 100vh;
   min-width: 100px;
 }
 .admin-box{
-  background-color: rgb(243,243,243);
+  background-color: rgb(255,255,255);
 }
 .el-scrollbar__wrap {
   padding-bottom: 17px;

From 72f725bb4fec359067cba96306733ec670e2e232 Mon Sep 17 00:00:00 2001
From: QM303176530 <303176530@qq.com>
Date: Sat, 18 Apr 2020 10:15:03 +0800
Subject: [PATCH 5/9] =?UTF-8?q?=E5=88=A0=E9=99=A4=E5=A4=9A=E4=BD=99?=
 =?UTF-8?q?=E5=87=BD=E6=95=B0=E8=B0=83=E7=94=A8?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/view/superAdmin/menu/menu.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/web/src/view/superAdmin/menu/menu.vue b/web/src/view/superAdmin/menu/menu.vue
index 76fd5881..8dd98a02 100644
--- a/web/src/view/superAdmin/menu/menu.vue
+++ b/web/src/view/superAdmin/menu/menu.vue
@@ -276,7 +276,6 @@ export default {
    async created() {
     this.pageSize = 999
     await this.getTableData()
-    await this.getMenuList(this.tableData)
   }
 }
 </script>

From 645d0fd8422cbfc34913327fd982d82f9fc5dd58 Mon Sep 17 00:00:00 2001
From: QM303176530 <303176530@qq.com>
Date: Sun, 19 Apr 2020 12:28:53 +0800
Subject: [PATCH 6/9] =?UTF-8?q?=E4=BF=AE=E6=94=B9api=E7=BC=96=E8=BE=91?=
 =?UTF-8?q?=E4=BF=9D=E5=AD=98=E6=97=B6=E5=87=BA=E7=8E=B0=E7=9A=84bug?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 server/service/sys_api.go | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/server/service/sys_api.go b/server/service/sys_api.go
index b3bf56c1..6c3a605c 100644
--- a/server/service/sys_api.go
+++ b/server/service/sys_api.go
@@ -136,7 +136,7 @@ func UpdateApi(api model.SysApi) (err error) {
 		if err != nil {
 			return err
 		} else {
-			err = global.GVA_DB.Save(api).Error
+			err = global.GVA_DB.Save(&api).Error
 		}
 	}
 	return err

From e3aae896ad4170cd26ab16ccb6d0594aabdb6f89 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=92=8B=E5=90=89=E5=85=86?= <303176530@qq.com>
Date: Mon, 20 Apr 2020 11:44:07 +0800
Subject: [PATCH 7/9] Update README.md

---
 README.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/README.md b/README.md
index 7f646b96..3ecefe56 100644
--- a/README.md
+++ b/README.md
@@ -180,6 +180,7 @@ go run main.go;
     │  ├─model          （model and services）
     │  ├─resource       （resources, such as static pages, templates）
     │  ├─router         （routers）
+    │  ├─service         (services)
     │  └─utils	        （common utilities）
     └─web            （frontend）
         ├─public        （deploy templates）

From 538c8ba0dfd7528da218d5188886ca80058044f7 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E8=92=8B=E5=90=89=E5=85=86?= <303176530@qq.com>
Date: Mon, 20 Apr 2020 11:46:27 +0800
Subject: [PATCH 8/9] Update README-zh_CN.md

---
 README-zh_CN.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/README-zh_CN.md b/README-zh_CN.md
index 9de0e7ce..2ed395a2 100644
--- a/README-zh_CN.md
+++ b/README-zh_CN.md
@@ -183,6 +183,7 @@ go run main.go;
     │  ├─model          （结构体层）
     │  ├─resource       （资源）
     │  ├─router         （路由）
+    │  ├─service         (服务)
     │  └─utils	        （公共功能）
     └─web            （前端文件）
         ├─public        （发布模板）

From 75035b903840a36b741d39c93a46b52ab3b8a88d Mon Sep 17 00:00:00 2001
From: pixel <303176530@qq.com>
Date: Mon, 20 Apr 2020 12:10:50 +0800
Subject: [PATCH 9/9] =?UTF-8?q?=E4=BF=AE=E5=A4=8D=E8=8F=9C=E5=8D=95?=
 =?UTF-8?q?=E5=B1=95=E7=A4=BA=E4=B8=8B=E7=BA=A7=E5=8F=AA=E6=9C=89=E4=B8=80?=
 =?UTF-8?q?=E4=B8=AA=E9=9A=90=E8=97=8F=E8=8F=9C=E5=8D=95=E6=97=B6=E5=80=99?=
 =?UTF-8?q?=E7=9A=84=E4=BA=A4=E4=BA=92=E9=94=99=E8=AF=AF?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 web/src/view/example/breakpoint/breakpoint.vue     | 2 +-
 web/src/view/layout/aside/asideComponent/index.vue | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/web/src/view/example/breakpoint/breakpoint.vue b/web/src/view/example/breakpoint/breakpoint.vue
index 2a198629..40ca7bb3 100644
--- a/web/src/view/example/breakpoint/breakpoint.vue
+++ b/web/src/view/example/breakpoint/breakpoint.vue
@@ -10,7 +10,7 @@
     <div class="el-upload__tip">请上传不超过5MB的文件</div>
     <div class="list">
       <transition-group name="list" tag="p">
-        <div class="list-item" v-for="(item,i) in uploadList" :key="i" >
+        <div class="list-item" v-for="item in uploadList" :key="item.name" >
           <i class="el-icon-document"></i>
           <span>{{ item.name }}</span>
           <span v-if="file" class="percentage" >{{percentage}}%</span>
diff --git a/web/src/view/layout/aside/asideComponent/index.vue b/web/src/view/layout/aside/asideComponent/index.vue
index 3bbcad7b..cb9fdddf 100644
--- a/web/src/view/layout/aside/asideComponent/index.vue
+++ b/web/src/view/layout/aside/asideComponent/index.vue
@@ -14,7 +14,7 @@ export default {
   name: 'AsideComponent',
   computed: {
     menuComponent() {
-      if (this.routerInfo.children.length) {
+      if (this.routerInfo.children.filter(item=>!item.hidden).length) {
         return 'AsyncSubmenu'
       } else {
         return 'MenuItem'