确定树形菜单数据，开发考评指标管理页面

package-lock.json

@@ -1463,6 +1463,11 @@
       "integrity": "sha512-a5Sab1C4/icpTZVzZc5Ghpz88yQtGOyNqYXcZgOssB2uuAr+wF/MvN6bgtW32q7HHrvBki+BsZ0OuNv6EV3K9g==",
       "dev": true
     },
+    "@popperjs/core": {
+      "version": "npm:@sxzz/popperjs-es@2.11.7",
+      "resolved": "https://registry.npmjs.org/@sxzz/popperjs-es/-/popperjs-es-2.11.7.tgz",
+      "integrity": "sha512-Ccy0NlLkzr0Ex2FKvh2X+OyERHXJ88XJ1MXtsI9y9fGexlaXaVTPzBCRBwIxFkORuOb+uBqeu+RqnpgYTEZRUQ=="
+    },
     "@sideway/address": {
       "version": "4.1.4",
       "resolved": "https://registry.npmmirror.com/@sideway/address/-/address-4.1.4.tgz",
@@ -2065,49 +2070,6 @@
         "webpack-merge": "^5.7.3",
         "webpack-virtual-modules": "^0.4.2",
         "whatwg-fetch": "^3.6.2"
-      },
-      "dependencies": {
-        "@vue/vue-loader-v15": {
-          "version": "npm:vue-loader@15.10.1",
-          "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.10.1.tgz",
-          "integrity": "sha512-SaPHK1A01VrNthlix6h1hq4uJu7S/z0kdLUb6klubo738NeQoLbS6V9/d8Pv19tU0XdQKju3D1HSKuI8wJ5wMA==",
-          "dev": true,
-          "requires": {
-            "@vue/component-compiler-utils": "^3.1.0",
-            "hash-sum": "^1.0.2",
-            "loader-utils": "^1.1.0",
-            "vue-hot-reload-api": "^2.3.0",
-            "vue-style-loader": "^4.1.0"
-          },
-          "dependencies": {
-            "hash-sum": {
-              "version": "1.0.2",
-              "resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
-              "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
-              "dev": true
-            }
-          }
-        },
-        "json5": {
-          "version": "1.0.2",
-          "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
-          "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
-          "dev": true,
-          "requires": {
-            "minimist": "^1.2.0"
-          }
-        },
-        "loader-utils": {
-          "version": "1.4.2",
-          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.2.tgz",
-          "integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==",
-          "dev": true,
-          "requires": {
-            "big.js": "^5.2.2",
-            "emojis-list": "^3.0.0",
-            "json5": "^1.0.1"
-          }
-        }
       }
     },
     "@vue/cli-shared-utils": {
@@ -2351,6 +2313,47 @@
       "resolved": "https://registry.npmmirror.com/@vue/shared/-/shared-3.2.37.tgz",
       "integrity": "sha512-4rSJemR2NQIo9Klm1vabqWjD8rs/ZaJSzMxkMNeJS6lHiUjjUeYFbooN19NgFjztubEKh3WlZUeOLVdbbUWHsw=="
     },
+    "@vue/vue-loader-v15": {
+      "version": "npm:vue-loader@15.10.1",
+      "resolved": "https://registry.npmjs.org/vue-loader/-/vue-loader-15.10.1.tgz",
+      "integrity": "sha512-SaPHK1A01VrNthlix6h1hq4uJu7S/z0kdLUb6klubo738NeQoLbS6V9/d8Pv19tU0XdQKju3D1HSKuI8wJ5wMA==",
+      "dev": true,
+      "requires": {
+        "@vue/component-compiler-utils": "^3.1.0",
+        "hash-sum": "^1.0.2",
+        "loader-utils": "^1.1.0",
+        "vue-hot-reload-api": "^2.3.0",
+        "vue-style-loader": "^4.1.0"
+      },
+      "dependencies": {
+        "hash-sum": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/hash-sum/-/hash-sum-1.0.2.tgz",
+          "integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
+          "dev": true
+        },
+        "json5": {
+          "version": "1.0.2",
+          "resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz",
+          "integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==",
+          "dev": true,
+          "requires": {
+            "minimist": "^1.2.0"
+          }
+        },
+        "loader-utils": {
+          "version": "1.4.2",
+          "resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.2.tgz",
+          "integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==",
+          "dev": true,
+          "requires": {
+            "big.js": "^5.2.2",
+            "emojis-list": "^3.0.0",
+            "json5": "^1.0.1"
+          }
+        }
+      }
+    },
     "@vue/web-component-wrapper": {
       "version": "1.3.0",
       "resolved": "https://registry.npmmirror.com/@vue/web-component-wrapper/-/web-component-wrapper-1.3.0.tgz",
@@ -4454,13 +4457,6 @@
         "lodash-unified": "^1.0.2",
         "memoize-one": "^6.0.0",
         "normalize-wheel-es": "^1.1.2"
-      },
-      "dependencies": {
-        "@popperjs/core": {
-          "version": "npm:@sxzz/popperjs-es@2.11.7",
-          "resolved": "https://registry.npmjs.org/@sxzz/popperjs-es/-/popperjs-es-2.11.7.tgz",
-          "integrity": "sha512-Ccy0NlLkzr0Ex2FKvh2X+OyERHXJ88XJ1MXtsI9y9fGexlaXaVTPzBCRBwIxFkORuOb+uBqeu+RqnpgYTEZRUQ=="
-        }
       }
     },
     "element-ui": {

src/components/Overview.vue

@@ -1,127 +0,0 @@
-<template>
-    <div>
-        <div style="display:flex">
-            <div style="width: 600px">
-                <Editor
-                    :code="toString(dataformParams)"
-                    height="650px"
-                    :showDefaultTips="false"
-                    @change="setXhrParam"
-                />
-            </div>
-            <div style="padding: 20px">
-                <div style="border: 1px solid #d6d6d6; margin-bottom: 10px">
-                    <div id="echarts_test" style="width: 800px;height:500px"></div>
-                </div>
-                <el-button type="primary" @click="ceshisss">刷新</el-button>
-            </div>
-        </div>
-    </div>
-</template>
-
-<script>
-import Editor from "./editorCode/index.vue";
-export default {
-    components: {
-        Editor
-    },
-    data() {
-        return {
-            dataformParams: {},
-            getData: ''
-        }
-    },
-    mounted() {
-        this.$nextTick(() =>{
-            this.getEcharts()
-        })
-    },
-    methods: {
-        setXhrParam(value) {
-            this.getData = value
-        },
-        ceshisss() {
-            console.log(this.dataformParams)
-            this.getData = eval("(" + this.getData + ")")
-            
-            this.getEcharts(this.getData)
-        },
-        // 数组转字符串
-        toString(obj = {}) {
-            return String(JSON.stringify(obj, null, 2));
-        },
-        getEcharts(val) {
-            let option = {}
-            if (!val) {
-                option = {
-                    tooltip: {
-                        trigger: 'axis'
-                    },
-                    legend: {
-                        data: ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine']
-                    },
-                    grid: {
-                        left: '3%',
-                        right: '4%',
-                        bottom: '3%',
-                        containLabel: true
-                    },
-                    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]
-                        }
-                    ]
-                };
-            } else {
-                option = val
-            }
-            let dom = document.getElementById('echarts_test');
-            dom.removeAttribute("_echarts_instance_")
-            let myChart = this.$echarts.init(dom);
-            myChart.setOption(option);
-            window.addEventListener("resize", function () {
-                myChart.resize()
-            })
-        }
-    }
-}
-</script>
-
-<style>
-
-</style>

src/components/Overview1.vue

@@ -1,127 +0,0 @@
-<template>
-    <div>
-        <div style="display:flex">
-            <div style="width: 600px">
-                <Editor
-                    :code="toString(dataformParams)"
-                    height="650px"
-                    :showDefaultTips="false"
-                    @change="setXhrParam"
-                />
-            </div>
-            <div style="padding: 20px">
-                <div style="border: 1px solid #d6d6d6; margin-bottom: 10px">
-                    <div id="echarts_test" style="width: 800px;height:500px"></div>
-                </div>
-                <el-button type="primary" @click="ceshisss">刷新</el-button>
-            </div>
-        </div>
-    </div>
-</template>
-
-<script>
-import Editor from "./editorCode/index.vue";
-export default {
-    components: {
-        Editor
-    },
-    data() {
-        return {
-            dataformParams: {},
-            getData: ''
-        }
-    },
-    mounted() {
-        this.$nextTick(() =>{
-            this.getEcharts()
-        })
-    },
-    methods: {
-        setXhrParam(value) {
-            this.getData = value
-        },
-        ceshisss() {
-            console.log(this.dataformParams)
-            this.getData = eval("(" + this.getData + ")")
-            
-            this.getEcharts(this.getData)
-        },
-        // 数组转字符串
-        toString(obj = {}) {
-            return String(JSON.stringify(obj, null, 2));
-        },
-        getEcharts(val) {
-            let option = {}
-            if (!val) {
-                option = {
-                    tooltip: {
-                        trigger: 'axis'
-                    },
-                    legend: {
-                        data: ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine']
-                    },
-                    grid: {
-                        left: '3%',
-                        right: '4%',
-                        bottom: '3%',
-                        containLabel: true
-                    },
-                    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]
-                        }
-                    ]
-                };
-            } else {
-                option = val
-            }
-            let dom = document.getElementById('echarts_test');
-            dom.removeAttribute("_echarts_instance_")
-            let myChart = this.$echarts.init(dom);
-            myChart.setOption(option);
-            window.addEventListener("resize", function () {
-                myChart.resize()
-            })
-        }
-    }
-}
-</script>
-
-<style>
-
-</style>

src/components/Overview2.vue

@@ -1,89 +0,0 @@
-<template>
-    <div>
-        <div>
-            <div id="echarts_test" style="width: 700px;height:300px"></div>
-        </div>
-    </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {}
-    },
-    mounted() {
-        this.$nextTick(() =>{
-            this.getEcharts()
-        })
-    },
-    methods: {
-        getEcharts() {
-            let option = {
-                tooltip: {
-                    trigger: 'axis'
-                },
-                legend: {
-                    data: ['Email', 'Union Ads', 'Video Ads', 'Direct', 'Search Engine']
-                },
-                grid: {
-                    left: '3%',
-                    right: '4%',
-                    bottom: '3%',
-                    containLabel: true
-                },
-                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]
-                    }
-                ]
-            };
-            let dom = document.getElementById('echarts_test');
-            dom.removeAttribute("_echarts_instance_")
-            let myChart = this.$echarts.init(dom);
-            myChart.setOption(option);
-            window.addEventListener("resize", function () {
-                myChart.resize()
-            })
-        }
-    }
-}
-</script>
-
-<style>
-
-</style>

src/components/assessmentPage.vue

@@ -0,0 +1,345 @@
+<template>
+    <div class="assessmentPage">
+        <div class="treeList" :style="allHeight">
+            <p>全业务域对标考评系统</p>
+            <el-tree ref="tree" :data="forecastDatas" :props="defaultProps" highlight-current node-key="id"
+             :default-expanded-keys="['5']" @node-click="handleNodeClick">
+                <template #default="{ node, data }">
+                    <span class="custom-tree-node">
+                        <el-icon size="small" v-if="node.level === 1"><FolderOpened /></el-icon>
+                        <span style="margin-left:5px;font-size:14px">{{node.label}}</span>
+                    </span>
+                </template>
+            </el-tree>
+        </div>
+        <div class="mainMessage" :style="mainHeight">
+            <router-view/>
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            forecastDatas:[],
+            defaultProps: {
+                children: 'children',
+                label: 'label',
+            }
+        }
+    },
+    computed:{
+        allHeight() {
+            return {
+                'height': document.documentElement.clientHeight-40 + 'px'
+            }
+        },
+        mainHeight() {
+            return {
+                'height': document.documentElement.clientHeight-50 + 'px'
+            }
+        }
+    },
+    created() {
+        this.forecastDatas = [
+            {
+                id: '1',
+                label: '对标业务',
+                icon: 'FolderOpened',
+                children: [
+                    {
+                        id: '1-1',
+                        label: '排行榜',
+                    },
+                    {
+                        id: '1-2',
+                        label: '分类对标',
+                    },
+                    {
+                        id: '1-3',
+                        label: '综合对标',
+                    },
+                    {
+                        id: '1-4',
+                        label: '立标管理',
+                    },
+                    {
+                        id: '1-5',
+                        label: '寻标管理',
+                    },
+                    {
+                        id: '1-6',
+                        label: '达标管理',
+                    },
+                    {
+                        id: '1-7',
+                        label: '超标管理',
+                    },
+                    {
+                        id: '1-8',
+                        label: '对标报告'
+                    }
+                ]
+            },
+            {
+                id: '2',
+                label: '考评业务',
+                children: [
+                    {
+                        id: '2-1',
+                        label: '考评总览'
+                    },
+                    {
+                        id: '2-2',
+                        label: '考评启动'
+                    },
+                    {
+                        id: '2-3',
+                        label: '考评修订'
+                    },
+                    {
+                        id: '2-4',
+                        label: '考评目标分解'
+                    },
+                    {
+                        id: '2-5',
+                        label: '月/季度考评'
+                    },
+                    {
+                        id: '2-6',
+                        label: '考评项对标'
+                    },
+                    {
+                        id: '2-7',
+                        label: '考评项预警'
+                    },
+                    {
+                        id: '2-8',
+                        label: '年度考评'
+                    },
+                    {
+                        id: '2-9',
+                        label: '人员考评'
+                    },
+                    {
+                        id: '2-10',
+                        label: '任期考评'
+                    },
+                    {
+                        id: '2-11',
+                        label: '考评监督'
+                    },
+                    {
+                        id: '2-12',
+                        label: '考评评级'
+                    },
+                    {
+                        id: '2-13',
+                        label: '考评报告'
+                    },
+                    {
+                        id: '2-14',
+                        label: '考评公告'
+                    },
+                    {
+                        id: '2-15',
+                        label: '奖金及薪资总额调整'
+                    },
+                ]
+            },
+            {
+                id: '3',
+                label: '对标考评知识',
+                children: [
+                    {
+                        id: '3-1',
+                        label: '对标指标标准',
+                    },
+                    {
+                        id: '3-2',
+                        label: '对标算法规则',
+                    },
+                    {
+                        id: '3-3',
+                        label: '对标预警规则',
+                    },
+                    {
+                        id: '3-4',
+                        label: '考评得分规则',
+                    },
+                    {
+                        id: '3-5',
+                        label: '考评评级规则',
+                    },
+                    {
+                        id: '3-6',
+                        label: '考评预警规则',
+                    },
+                ]
+            },
+            {
+                id: '4',
+                label: '对标体系配置',
+                children: [
+                    {
+                        id: '4-1',
+                        label: '对标指标管理',
+                    },
+                    {
+                        id: '4-2',
+                        label: '指标规则配置',
+                    },
+                    {
+                        id: '4-3',
+                        label: '对标结构配置',
+                    },
+                ]
+            },
+            {
+                id: '5',
+                label: '考评体系配置',
+                children: [
+                    {
+                        id: '5-1',
+                        label: '考评指标管理',
+                        path: '/assessment/evaluationSystem/evaluationIndexPage'
+                    },
+                    {
+                        id: '5-2',
+                        label: '考评规则配置',
+                    },
+                    {
+                        id: '5-3',
+                        label: '考评单位配置',
+                    },
+                    {
+                        id: '5-4',
+                        label: '考评部门配置',
+                    },
+                    {
+                        id: '5-5',
+                        label: '考评人员配置',
+                    },
+                ]
+            },
+            {
+                id: '6',
+                label: '基础信息配置',
+                children: [
+                    {
+                        id: '6-1',
+                        label: '人员权限配置',
+                    },
+                    {
+                        id: '6-2',
+                        label: '工作流程配置',
+                    }
+                ]
+            }
+        ]
+        // this.forecastDatas = [
+        //     {
+        //         id: '1',
+        //         label: '首页'
+        //     },
+        //     {
+        //         id: '2',
+        //         label: '对标业务'
+        //     },
+        //     {
+        //         id: '3',
+        //         label: '目标责任书',
+        //         children: [
+        //             {
+        //                 id: '3-1',
+        //                 label: '目标责任书',
+        //                 children: []
+        //             },
+        //             {
+        //                 id: '3-2',
+        //                 label: '草稿箱'
+        //             },
+        //         ]
+        //     },
+        //     {
+        //         id: '4',
+        //         label: '绩效考评'
+        //     },
+        //     {
+        //         id: '5',
+        //         label: '知识库',
+        //         children: [
+        //             {
+        //                 id: '5-1',
+        //                 label: '指标体系',
+        //                 children: []
+        //             },
+        //             {
+        //                 id: '5-2',
+        //                 label: '评分规则'
+        //             },
+        //         ]
+        //     },
+        //     {
+        //         id: '6',
+        //         label: '基础配置'
+        //     }
+        // ]
+    },
+    mounted() {
+        this.$nextTick(() => {
+            this.$refs.tree.setCurrentKey('5-1')
+        })
+    },
+    methods: {
+        handleNodeClick(val) {
+            this.$router.push({ path: val.path})
+        }
+    }
+}
+</script>
+
+<style lang="less">
+.assessmentPage{
+    display: flex;
+    width: 100%;
+    padding: 0 10px;
+    .treeList{
+        margin-left: 5px;
+        width: 15%;
+        // background: #fff;
+        border-radius: 20px;
+        p{
+            font-size: 18px;
+            font-family: '微软雅黑';
+            font-weight: bold;
+            color: #171e28;
+            position: relative;
+            left: 30px;
+            top: 5px;
+            letter-spacing: 1px;
+        }
+        .el-tree{
+            position: relative;
+            top: 15px;
+            padding: 0 0 0 20px;
+            background: transparent;
+        }
+        .el-tree--highlight-current
+        .el-tree-node.is-current
+        > .el-tree-node__content {
+            background-color: rgba(135, 206, 235, 0.2);
+            color: #007aab;
+            font-weight: bold;
+        }
+    }
+    .mainMessage{
+        width: 84%;
+        padding-top: 10px;
+        margin-left: 10px;
+        background: #fff;
+        border-radius: 20px;
+    }
+}
+</style>

src/components/benchmarkingPage.vue

@@ -0,0 +1,27 @@
+<template>
+    <div class="gatewayPage">
+        <div class="mainMessage">
+            gatewayPage
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            
+        }
+    },
+    created() {
+    },
+    mounted() {
+    },
+    methods: {
+    }
+}
+</script>
+
+<style>
+
+</style>

src/components/evaluationSystem/evaluationIndexPage.vue

@@ -0,0 +1,454 @@
+<template>
+    <div class="evaluationIndex">
+        <div class="menuBtn">
+            <p class="titleSty">考评指标管理</p>
+            <div style="display:flex;justify-content: space-between;padding: 10px;">
+                <el-row :gutter="10" class="regionalBtn">
+                    <el-col :span="1.5">
+                        <el-button
+                        type="primary"
+                        plain
+                        icon="Plus"
+                        size="mini"
+                        @click="handleAdd"
+                        >新增</el-button>
+                    </el-col>
+                    <el-col :span="1.5">
+                        <el-button
+                        type="success"
+                        plain
+                        icon="Edit"
+                        size="mini"
+                        @click="handleUpdate"
+                        >修改</el-button>
+                    </el-col>
+                    <el-col :span="1.5">
+                        <el-button
+                        type="danger"
+                        plain
+                        icon="Delete"
+                        size="mini"
+                        @click="handleDelete"
+                        >删除</el-button>
+                    </el-col>
+                </el-row>
+            </div>
+            <div class="menuTableData">
+                <el-table :data="menuTableData" border style="width: 100%" @row-click="rowClick">
+                    <el-table-column label="操作" width="60" align="center">
+                        <template #default="scope">
+                            <el-radio v-model="menuradio" :label="scope.row"></el-radio>
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="菜单名称" prop="menuName">
+                    </el-table-column>
+                    <!-- <el-table-column label="菜单层级">
+                        <template #default="scope">
+                            <span>{{showMenuLeavel(scope.row.parentId)}}</span>
+                        </template>
+                    </el-table-column> -->
+                    <el-table-column label="创建时间" prop="createTime">
+                    </el-table-column>
+                </el-table>
+                <el-pagination
+                    @size-change="handleSizeChange"
+                    @current-change="handleCurrentChange"
+                    :current-page="page.currentPage"
+                    :page-size="page.pagesize"
+                    layout="total, prev, pager, next, jumper"
+                    :total="page.total">
+                </el-pagination>
+            </div>
+        </div>
+        <el-dialog :title="title" v-model="dialogVisible" width="600px" :close-on-click-modal="false" @close="closeDialog">
+            <div class="windframFromsxx">
+                <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px" class="demo-ruleForm">
+                    <el-form-item label="菜单名称" prop="menus">
+                        <el-select v-model="ruleForm.menus" placeholder="请选择菜单名称">
+                            <el-option
+                            v-for="item in menuNameOptions"
+                            :key="item.label"
+                            :label="item.label"
+                            :value="item.label">
+                            </el-option>
+                        </el-select>
+                    </el-form-item>
+                    <!-- <el-form-item label="菜单编号" prop="menuNum">
+                        <el-select v-model="ruleForm.menuNum" placeholder="请选择菜单编号">
+                            <el-option
+                            v-for="item in menuOptions"
+                            :key="item.value"
+                            :label="item.label"
+                            :value="item.value">
+                            </el-option>
+                        </el-select>
+                    </el-form-item> -->
+                </el-form>
+            </div>
+            <template #footer>
+                <span class="dialog-footer">
+                    <el-button @click="resetForm" v-if="!single">重 置</el-button>
+                    <el-button @click="dialogVisible = false" v-else>取 消</el-button>
+                    <el-button type="primary" @click="submitForm('ruleForm')">确 定</el-button>
+                </span>
+            </template>
+        </el-dialog>
+    </div>
+</template>
+
+<script>
+import {apiGetgetMenuList, apiGetStation, apiGetgetaddmenuMsg, apiGetgetuploadmenuMsg, apiGetgetdeletemenuMsg} from '../../api/api'
+export default {
+    data() {
+        return {
+            title:'',
+            menuTableData:[],
+            menuradio: {},
+            single: false,
+            dialogVisible:false,
+            roleName: '',
+            typeWh: '',
+            menuOptions: [],
+            menuNameOptions: [],
+            page:{
+                pagesize: 10,
+                currentPage: 1,
+                total: 0
+            },
+            ruleForm: {
+                menus: '',
+                // menuNum: null
+            },
+            rules: {
+                menus: [
+                    { required: true, message: '请选择菜单名称', trigger: 'change' }
+                ],
+                // menuNum: [
+                //     { required: true, message: '请选择菜单编号', trigger: 'change' }
+                // ]
+            }
+        }
+    },
+    created() {
+        this.menuOptions = [
+            {
+                label: '一级菜单',
+                value: 0
+            },
+            // {
+            //     label: '二级菜单',
+            //     value: 1
+            // },
+            // {
+            //     label: '三级菜单',
+            //     value: 2
+            // }
+        ]
+        this.menuNameOptions = [
+            {
+                label: '概要'
+            },
+            {
+                label: '全景功率'
+            },
+            {
+                label: '功率预测'
+            },
+            {
+                label: '电量预测'
+            },
+            {
+                label: '功率管控'
+            },
+            {
+                label: '天气预报'
+            },
+            {
+                label: '统计汇总'
+            },
+            {
+                label: '智能营销'
+            }
+        ]
+        // this.getAllStations()
+    },
+    mounted() {
+        // this.getPersonListFn()
+    },
+    methods:{
+        // 获取所有场站
+        getAllStations() {
+            apiGetStation().then(datas =>{
+                if (datas && datas.data && datas.data.list) {
+                    datas.data.list.forEach(item =>{
+                        let obj = {
+                            label: item.stationName
+                        }
+                        this.menuNameOptions.push(obj)
+                    })
+                }
+            })
+        },
+        getSeachData() {
+            this.getPersonListFn('seach')
+        },
+        reset() {
+            this.roleName = ''
+            this.page = {
+                pagesize: 10,
+                currentPage: 1,
+                total: 0
+            }
+            this.getPersonListFn()
+        },
+        showMenuLeavel(id) {
+            let str = ''
+            this.menuOptions.forEach(item =>{
+                if (item.value === id) {
+                    str = item.label
+                }
+            })
+            return str
+        },
+        handleSizeChange(val){
+            this.page.pagesize = val
+            this.getPersonListFn('seach')
+        },
+        handleCurrentChange(val){
+            this.page.currentPage =val
+            this.getPersonListFn('seach')
+        },
+        handleChange(file, fileList) {
+            this.ruleForm.fileList = fileList.slice(-3);
+        },
+        closeDialog() {
+            this.$refs['ruleForm'].clearValidate()
+        },
+        submitForm(formName) {
+            this.$refs[formName].validate((valid) => {
+                if (valid) {
+                    let that = this
+                    that.addOrUpdatemenuDate()
+                }
+            });
+        },
+        // 新增/修改风电场配置
+        addOrUpdatemenuDate() {
+            let that = this
+            let params = {
+                menuName: that.ruleForm.menus,
+                // parentId: that.ruleForm.menuNum
+                parentId: 0
+            }
+            if (!that.single) {
+                apiGetgetaddmenuMsg(params).then(datas =>{
+                    that.changeshowData(datas)
+                })
+            } else {
+                params.menuId = this.menuradio.menuId
+                apiGetgetuploadmenuMsg(params).then(datas =>{
+                    that.changeshowData(datas)
+                })
+            }
+        },
+        changeshowData(datas) {
+            if (datas.msg === '操作成功') {
+                this.dialogVisible = false
+                if (!this.single) {
+                    this.$message({
+                        message: '菜单新增成功',
+                        type: 'success'
+                    });
+                } else {
+                    this.$message({
+                        message: '菜单修改成功',
+                        type: 'success'
+                    });
+                }
+                this.single = false
+                this.reset()
+            }
+        },
+        resetForm() {
+            this.ruleForm = {
+                menus: '',
+                // menuNum: null
+            }
+        },
+        // 新增区域信息
+        handleAdd() {
+            this.dialogVisible = true
+            this.single = false
+            this.title = '新增菜单'
+            this.$nextTick(() =>{
+                this.resetForm()
+                this.$refs['ruleForm'].clearValidate()
+            })
+        },
+        // 修改区域信息
+        handleUpdate() {
+            this.dialogVisible = true
+            this.single = true
+            this.title = '修改菜单'
+            this.ruleForm = {
+                menus: this.menuradio.menuName,
+                // menuNum: this.menuradio.parentId
+            }
+        },
+        rowClick(row, column, event) {
+            this.menuradio = row
+        },
+        // 删除区域信息
+        handleDelete() {
+            this.$confirm('此操作将永久删除该数据, 是否继续?', '提示', {
+                confirmButtonText: '确定',
+                cancelButtonText: '取消',
+                type: 'warning'
+            }).then(() => {
+                let that = this
+                let params = {
+                    menuId: that.menuradio.menuId
+                }
+                apiGetgetdeletemenuMsg(params).then(datas =>{
+                    if (datas.msg === '操作成功') {
+                        that.getPersonListFn()
+                    }
+                })
+                if (that.menuTableData.length>0) {
+                    that.menuradio = that.menuTableData[0]
+                }
+                that.$message({
+                    type: 'success',
+                    message: '删除成功!'
+                });
+            })
+        },
+        //获取风电场列表数据
+        getPersonListFn(type) {
+            let that = this
+            let params = {
+                pageNum: that.page.currentPage,
+                pageSize: that.page.pagesize
+            }
+            apiGetgetMenuList(params).then(datas =>{
+                if (datas && datas.rows) {
+                    that.menuTableData = datas.rows
+                    that.menuradio = datas.rows[0]
+                    that.page.total = datas.total
+                }
+            })
+        }
+    }
+}
+</script>
+
+<style lang="less">
+.evaluationIndex{
+    .menuBtn{
+        padding: 10px 20px 0 20px;
+        .titleSty{
+            border-left: 4px solid #007aab;
+            padding-left: 5px;
+            font-size: 16px;
+            font-weight: bold;
+            font-family: '微软雅黑';
+            margin-left:20px;
+            margin-bottom: 15px;
+        }
+        .periodSeach{
+            display: flex;
+            margin:20px;
+                .exceed{
+                    display: flex;
+                    margin-right:20px;
+                    .el-input{
+                        width: 200px;
+                        margin-right:10px;
+                        .el-input__inner{
+                            height:30px;
+                        }
+                        .el-input__suffix{
+                            .el-select__caret{
+                                line-height:30px;
+                            }
+                        }
+                    }
+                }
+        }
+        span{
+            font-size:14px;
+        }
+        .regionalBtn{
+            padding-left: 10px;
+        }
+
+        .exceed{
+            display: flex;
+            margin-right:20px;
+            .exTime{
+                width: 240px;
+                .el-select__tags{
+                    left: 1px;
+                    background:#fff;
+                }
+            }
+        }
+        .el-select{
+            // width: 160px;
+            margin-right:10px;
+            .el-input__inner{
+                height:30px;
+            }
+            .el-input__suffix{
+                .el-select__caret{
+                    line-height:30px;
+                }
+            }
+        }
+        .el-button{
+            height: 30px;
+            // width:100px;
+            padding: 0 30px ;
+            // padding-top: 8px;
+            span{
+                margin:0;
+            }
+        }
+    }
+    .menuTableData{
+        padding: 10px 20px;
+        .el-table{
+        .el-table__body-wrapper{
+            .el-table__empty-block{
+                height: 70vh !important;
+            }
+        }
+        .el-input__inner{
+            height: 30px !important;
+        }
+        .el-radio__label{
+            display: none;
+        }
+        }
+        .el-pagination{
+            margin-top: 20px;
+            text-align: end;
+            position: relative;
+        }
+    }
+    .el-overlay{
+        .el-dialog{
+            .el-dialog__body{
+                padding: 30px 60px 30px 20px !important;
+                .windframFromsxx{
+                    padding-right: 20px !important;
+                    .el-select{
+                        width: 100%;
+                    }
+                }
+            }
+        }
+    }
+    
+}
+</style>

src/components/gatewayPage.vue

@@ -0,0 +1,27 @@
+<template>
+    <div class="gatewayPage">
+        <div class="mainMessage">
+            gatewayPage
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            
+        }
+    },
+    created() {
+    },
+    mounted() {
+    },
+    methods: {
+    }
+}
+</script>
+
+<style>
+
+</style>

src/components/knowledgePage.vue

@@ -0,0 +1,102 @@
+<template>
+    <div class="configurePage">
+        <div class="treeList" :style="mainHeight">
+            <el-tree ref="tree" :data="forecastDatas" :props="defaultProps" highlight-current node-key="id"
+             default-expand-all @node-click="handleNodeClick" />
+        </div>
+        <div class="mainMessage" :style="mainHeight">
+        </div>
+    </div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            forecastDatas:[],
+            defaultProps: {
+                children: 'children',
+                label: 'label',
+            }
+        }
+    },
+    computed:{
+        mainHeight() {
+            return {
+                'height': document.documentElement.clientHeight-90 + 'px'
+            }
+        },
+    },
+    created() {
+        this.forecastDatas = [
+            {
+                id: '1',
+                label: '基础配置'
+            },
+            {
+                id: '2',
+                label: '业务配置',
+                children: [
+                    {
+                        id: '2-1',
+                        label: '考评单位管理'
+                    },
+                    {
+                        id: '2-2',
+                        label: '考评部门管理'
+                    },
+                    {
+                        id: '2-3',
+                        label: '考评策略管理'
+                    },
+                    {
+                        id: '2-4',
+                        label: '考评预警知识管理'
+                    },
+                ]
+            }
+        ]
+    },
+    mounted() {
+        this.$nextTick(() => {
+            this.$refs.tree.setCurrentKey(1)
+        })
+    },
+    methods: {
+        handleNodeClick() {}
+    }
+}
+</script>
+
+<style lang="less">
+.configurePage{
+    display: flex;
+    width: 100%;
+    padding: 0 10px;
+    .treeList{
+        margin-left: 5px;
+        width: 15%;
+        background: #fff;
+        border-radius: 20px;
+        .el-tree{
+            position: relative;
+            top: 15px;
+            padding: 0 0 0 20px;
+            // background: transparent;
+        }
+        .el-tree--highlight-current
+        .el-tree-node.is-current
+        > .el-tree-node__content {
+            background-color: rgba(135, 206, 235, 0.2);
+            color: #409eff;
+            font-weight: bold;
+        }
+    }
+    .mainMessage{
+        width: 84%;
+        margin-left: 10px;
+        background: #fff;
+        border-radius: 20px;
+    }
+}
+</style>

src/router/index.js

@@ -10,14 +10,65 @@ const routes = [
             import(
                 '../views/homePage.vue'
             ),
-    },
-    { // 总览
-        path: '/systemSettings/Overview',
-        name:'Overview',
-        component: () =>
-            import(
-                '../components/Overview.vue'
-            ),
+        children:[
+            {
+                path: '/',
+                name: 'assessment',
+                meta: {
+                    title: '考评业务',
+                },
+                component: () =>
+                    import(
+                        '../components/assessmentPage.vue'
+                    ),
+                children: [
+                    {
+                        path: '/assessment/home',
+                        name: 'homePage',
+                        meta: {
+                            title: '首页',
+                        },
+                        component: () =>
+                            import(
+                                '../components/gatewayPage.vue'
+                            ),
+                    },
+                    {
+                        path: '/assessment/benchmark',
+                        name: 'benchmark',
+                        meta: {
+                            title: '对标业务',
+                        },
+                        component: () =>
+                            import(
+                                '../components/benchmarkingPage.vue'
+                            ),
+                    },
+                    {
+                        path: '/assessment/knowledge',
+                        name: 'knowledge',
+                        meta: {
+                            title: '知识库',
+                        },
+                        component: () =>
+                            import(
+                                '../components/knowledgePage.vue'
+                            ),
+                    },
+                    {
+                        path: '/assessment/evaluationSystem/evaluationIndexPage',
+                        name: 'evaluationSystem',
+                        meta: {
+                            title: '考评指标管理',
+                        },
+                        component: () =>
+                            import(
+                                '../components/evaluationSystem/evaluationIndexPage.vue'
+                            ),
+                    },
+                ]
+            }
+        ]
     },
 ]
 

src/views/homePage.vue

@@ -1,12 +1,12 @@
 <template>
     <div class="homePage">
-        <div class="leftMenu">
+        <!-- <div class="leftMenu">
             <div class="logoSty">
                 <img src="../assets/logoG.png" alt="">
             </div>
             <div class="firstLevel">
-                <div class="firstLevel_icon" v-for="item in leftLevelData" :key="item.index">
-                    <div class="firstLevel_img">
+                <div class="firstLevel_icon" v-for="item in leftLevelData" :key="item.index" @click="changeRoute(item)">
+                    <div class="firstLevel_img" :class="getBac(item.showBac)">
                         <img :src="item.image">
                     </div>
                     <div class="firstLevel_title">
@@ -14,23 +14,22 @@
                     </div>
                 </div>
             </div>
-        </div>
+        </div> -->
         <div class="frameMain" :style="mainHeight">
-            <div class="topMain">
-                <!-- <div class="topMain_tit">
-                    <span>全业务域对标考评系统</span>
-                </div> -->
+            <!-- <div class="topMain">
                 <p>全业务域对标考评系统</p>
-                <div></div>
-            </div>
-            <div class="bottomMain">
-                <!-- <div class="treeList">
-                    <el-tree :data="forecastData" :props="defaultProps" @node-click="handleNodeClick" />
+                <div class="messageTit">
+                    <el-badge is-dot>
+                        <el-icon size="large"><Message /></el-icon>
+                    </el-badge>
+                    <div class="avatar">
+                        <el-avatar size="small">
+                            <el-icon size="large"><UserFilled /></el-icon>
+                        </el-avatar>
+                    </div>
                 </div>
-                <div class="mainMessage">
-                    <overview v-if="showActive === '1'"></overview>
-                    <overview1 v-if="showActive === '2'"></overview1>
-                </div> -->
+            </div> -->
+            <div class="bottomMain">
                 <router-view></router-view>
             </div>
         </div>
@@ -38,118 +37,92 @@
 </template>
 
 <script>
-import MenuTree from '../components/menuTreeconfig.vue'
-import Overview from '../components/Overview.vue'
-import Overview1 from '../components/Overview1.vue'
 
 import gateway from "../assets/indexIcon/gateway.png"
 import benchmarking from "../assets/indexIcon/benchmarking.png"
 import Assessment from "../assets/indexIcon/Assessment.png"
 import configure from "../assets/indexIcon/configure.png"
 export default {
-    components: {
-        MenuTree,
-        Overview,
-        Overview1,
-    },
     data() {
         return {
-            showDia:false,   
-            leftLevelData: [],         
-            forecastData:[],
-            defaultProps: {
-                children: 'children',
-                label: 'label',
+            leftLevelData: [],
+        }
+    },
+    watch:{
+        $route: {
+            handler: function(route) {
+                console.log(route)
+                this.leftLevelData.forEach(it =>{
+                    if (it.index === route.path) {
+                        it.showBac = true
+                    } else {
+                        it.showBac = false
+                    }
+                })
             },
-            openeds:['1'],
-            showActive: '1',
-            preLeftMeun: 1,
-            windowWidth: document.documentElement.clientWidth,  //实时屏幕宽度
-            windowHeight: document.documentElement.clientHeight-60
+            immediate: true
         }
     },
     created(){
         this.leftLevelData = [
+            // {
+            //     index: '/index',
+            //     name: '系统门户',
+            //     image: gateway,
+            //     showBac: true
+            // },
+            // {
+            //     index: '/benchmark',
+            //     name: '对标业务',
+            //     image: benchmarking
+            // },
             {
-                index: '1',
-                name: '系统门户',
-                image: gateway
-            },
-            {
-                index: '2',
-                name: '对标业务',
-                image: benchmarking
-            },
-            {
-                index: '3',
+                index: '/assessment',
                 name: '考评业务',
                 image: Assessment
             },
-            {
-                index: '4',
-                name: '系统配置',
-                image: configure
-            }
-        ]
-        this.forecastData = [
-            {
-                label: '考评启动',
-                children: [
-                    {
-                        label: '目标值设定'
-                    },
-                    {
-                        label: '责任书签订'
-                    },
-                ]
-            },
-            {
-                label: '考评修订',
-                children: [
-                    {
-                        label: '调整建议'
-                    },
-                    {
-                        label: '调整审议'
-                    },
-                ]
-            },
-            {
-                label: '考评监控',
-                children: [
-                    {
-                        label: '考评目标分解'
-                    },
-                    {
-                        label: '考评基层单位监控'
-                    },
-                    {
-                        label: '考评项监控'
-                    },
-                    {
-                        label: '月度完成情况监控'
-                    },
-                    {
-                        label: '季度完成情况监控'
-                    }
-                ]
-            },
+            // {
+            //     index: '/configure',
+            //     name: '系统配置',
+            //     image: configure
+            // }
         ]
+        // if (this.$route?.path) {
+        //     let path = this.$route?.path
+        //     this.leftLevelData.forEach(it =>{
+        //         debugger
+        //         if (it.index === path) {
+        //             it.showBac = true
+        //         } else {
+        //             it.showBac = false
+        //         }
+        //     })
+        // }
     },
     computed:{
         mainHeight() {
             return {
                 'width': '100%',
-                'height': document.documentElement.clientHeight-20 + 'px'
+                'height': document.documentElement.clientHeight-40 + 'px'
             }
         },
     },
     mounted() {
-        this.showDia = true
+        
     },
     methods:{
-        selectMenu(index) {
-            this.showActive = index
+        getBac(val) {
+            let strWea = ''
+            debugger
+            if (val) {
+                strWea = 'changeBacksty'
+            } else {
+                strWea = 'defaultBacksty'
+            }
+            return strWea
+        },
+        changeRoute(item) {
+            this.$router.push({ path: item.index})
         }
     }
 }
@@ -172,12 +145,29 @@ export default {
             margin-top: 30px;
             .firstLevel_icon{
                 margin-bottom: 30px;
+                cursor: pointer;
                 .firstLevel_img{
-                    margin: 0 0 10px 17px;
+                    width: 35px;
+                    height: 37px;
+                    text-align: center;
+                    border-radius: 5px;
+                    position: relative;
+                    left: 10px;
                     img{
+                        position: relative;
+                        top: 6px;
                         width: 20px;
                         height: 20px;
                     }
+                    &:hover{
+                        background: rgba(255,255,255,.2);
+                    }
+                }
+                .changeBacksty{
+                    background: rgba(255,255,255,.2);
+                }
+                .defaultBacksty{
+                    background: rgba(255,255,255,0);
                 }
                 .firstLevel_title{
                     margin-left: 5px;
@@ -192,32 +182,37 @@ export default {
     .frameMain{
         background: #f3f7f8;
         border-radius: 30px;
+        padding: 10px 0;
         .topMain{
             display: flex;
+            justify-content: space-between;
             height: 60px;
             p{
-                font-size: 20px;
+                font-size: 18px;
                 font-family: '微软雅黑';
                 font-weight: bold;
                 color: #171e28;
                 position: relative;
                 left: 30px;
                 top: 15px;
-                letter-spacing: 2px;
+                letter-spacing: 1px;
+            }
+            .messageTit{
+                margin-right: 50px;
+                display: flex;
+                .el-badge{
+                    margin: 15px 25px 0 0;
+                    cursor: pointer;
+                }
+                .avatar{
+                    margin-top: 10px;
+                    cursor: pointer;
+                }
             }
         }
         .bottomMain{
             display: flex;
-            .treeList{
-                width: 13%;
-                .el-tree{
-                    padding: 0 0 0 20px;
-                    background: transparent;
-                }
-            }
-            .mainMessage{
-                width: 87%;
-            }
+            
         }
     }
 }