动态路由

Fixiaobai

2023-08-28 6cc81f9de0c87c40a9f1181ab35e8dff792a1884

动态路由

 .env.development

@@ -2,4 +2,4 @@
ENV = 'development'

# base api
VUE_APP_BASE_API =  'http://192.168.110.87:1234/'
VUE_APP_BASE_API =  'http://localhost:1234/'

 src/api/laboratory/role.js

@@ -31,4 +31,21 @@
      method: 'get',
      params
    })
  }

  export function deleteRole(params) {
    return request({
      url: '/role-manager/deleteRole',
      method: 'get',
      params
    })
  }

  //updateRoleMenu
  export function updateRoleMenu(data) {
    return request({
      url: '/role-manager/updateRoleMenu',
      method: 'post',
      data
    })
  }

 src/components/Breadcrumb/index.vue

@@ -11,8 +11,8 @@
  </el-breadcrumb>
  </el-col>
  <el-col :span="12" style="background-color: #fff;display: flex;justify-content: end; align-items: center;">
    <el-button v-if="backPlan" type="primary" icon="el-icon-refresh-left" size="mini" plain @click="backPlanUp">返回</el-button>
    <el-button v-if="add" size="mini" @click="breadd" style="width: 60px;" type="primary">保存</el-button>
    <!-- <el-button v-if="backPlan" type="primary" icon="el-icon-refresh-left" size="mini" plain @click="backPlanUp">返回</el-button> -->
    <!-- <el-button v-if="add" size="mini" @click="breadd" style="width: 60px;" type="primary">保存</el-button> -->
  <el-col :span="1"></el-col>
  </el-col>
</div>

 src/layout/components/Navbar.vue

@@ -64,6 +64,10 @@
        newPwd: '',
        confirmPwd: ''
      },
      user: {
                id: null,
                name: 'value'
            },
      dialogFormVisible: false,
      formLabelWidth: '120px'
    }
@@ -78,14 +82,6 @@
      'avatar'
    ])
  },
    data() {
        return {
            user: {
                id: null,
                name: 'value'
            }
        }
    },
    mounted() {
        this.getUser()
    },
@@ -107,11 +103,15 @@
    },
    async logout() {
      // await this.$store.dispatch('user/logout')
      this.$router.push(`/login?redirect=${this.$route.fullPath}`)
      localStorage.removeItem("user")
      this.$router.push(`/login?redirect=${this.$route.fullPath}`)     
      this.$router.replace({path: '/login'});
      location.reload();
    },
        getUser(){
            get(this.$url.info).then(res=>{
                this.user = res.data
        localStorage.setItem("user",JSON.stringify(res.data))
            })
        }
  }

 src/layout/components/Sidebar/Item.vue

@@ -16,6 +16,9 @@
      default: ''
    }
  },
  created(){
    
  },
  render(h, context) {
    const { icon, title } = context.props
    const vnodes = []

 src/router/index.js

@@ -30,465 +30,588 @@
 * a base page that does not have permission requirements
 * all roles can be accessed
 */
export const constantRoutes = [
  {
    path: '/login',
    component: () => import('@/views/login/index'),
    hidden: true
  },
  {
    path: '/404',
    component: () => import('@/views/404'),
    hidden: true
  },
  {
    path: '/addCommision',
    component: () => import('@/views/inspectionManagement/commissionInspection/addCommision'),
    hidden:true
  },
  {
    path: '/',
    component: Layout,
    redirect: '/home',
    // meta: { title: '主页', icon: 'el-icon-s-home' },
    children: [{
      path: 'home',
      name: 'Home',
      component: () => import('@/views/home/index'),
      meta: { title: '主页', icon: 'el-icon-s-home' }
    }]
  },
    {
      path: '/addCommision/:viewId',
      hidden: true,
      component: () => import('@/views/inspectionManagement/commissionInspection/addCommision'),
    },
  {
    path: '/standardLibrary',
    component: Layout,
    redirect: '/standardLibrary/index',
    meta: { title: '标准库', icon: 'el-icon-s-help' },
    children: [
      {
        path: 'index',
        name: 'StandardLibrary',
        component: () => import('@/views/standardLibrary/index'),
        meta: { title: '标准库', icon: 'form' }
      },
      {
        path: 'specificationDetails/:id',
        name: 'SpecificationDetails',
        // hidden: true,
        component: () => import('@/views/standardLibrary/SpecificationDetails'),
        meta: { title: '产品规格详情', icon: 'form', show: false }
      }
    ]
  },
  // {
  //   path: '/rawMaterials',
  //   component: Layout,
  //   redirect: '/rawMaterials/reportForInspection',
  //   name: 'rawMaterials',
  //   meta: { title: '检验', icon: 'el-icon-s-help' },
  //   children: [
  //     {
  //       path: 'reportForInspection',
  //       name: 'ReportForInspection',
  //       component: () => import('@/views/rawMaterials/reportForInspection/index'),
  //       meta: { title: '原材料报检', icon: 'table' },
  //       children: [
  //         // {
  //         //   path: 'index',
  //         //   name: 'ReportForInspectionIndex',
  //         //   // hidden: true,
  //         //   component: () => import('@/views/rawMaterials/reportForInspection/index'),
  //         //   meta: { title: '原材料报检', icon: 'table' }
  //         // },
  //         {
  //           path: 'forInspectionDetail',
  //           name: 'ForInspectionDetail',
  //           hidden: true,
  //           component: () => import('@/views/rawMaterials/reportForInspection/forInspectionDetail'),
  //           meta: { title: '新增检验单详情', icon: 'table' }
  //         }
  //       ]
  //     },
  //     {
  //       path: 'print',
  //       name: 'Print',
  //       component: () => import('@/views/rawMaterials/print/index'),
  //       meta: { title: '条码打印', icon: 'tree' }
  //     },
  //     {
  //       path: 'planAssignments',
  //       name: 'PlanAssignments',
  //       component: () => import('@/views/rawMaterials/planAssignments/index'),
  //       meta: { title: '检验计划分配', icon: 'tree' }
  //     },
  //     {
  //       path: 'rawMaterialInspection',
  //       name: 'RawMaterialInspection',
  //       component: () => import('@/views/rawMaterials/rawMaterialInspection/index'),
  //       meta: { title: '原材料检验', icon: 'tree' }
  //     },
  //     {
  //       path: 'checkTheReport',
  //       name: 'CheckTheReport',
  //       component: () => import('@/views/rawMaterials/checkTheReport/index'),
  //       meta: { title: '检验报告', icon: 'tree' }
  //     },
  //     {
  //       path: 'reportAuditing',
  //       name: 'ReportAuditing',
  //       component: () => import('@/views/rawMaterials/reportAuditing/index'),
  //       meta: { title: '报告审核', icon: 'tree' }
  //     },
  //     {
  //       path: 'nonConformanceReview',
  //       name: 'NonConformanceReview',
  //       component: () => import('@/views/rawMaterials/nonConformanceReview/index'),
  //       meta: { title: '不合格反馈', icon: 'tree' }
  //     },
  //     {
  //       path: 'nonConformingFeedback',
  //       name: 'NonConformingFeedback',
  //       component: () => import('@/views/rawMaterials/nonConformingFeedback/index'),
  //       meta: { title: '不合格评审', icon: 'tree' }
  //     },
  //     {
  //       path: 'passRateStatistics',
  //       name: 'PassRateStatistics',
  //       component: () => import('@/views/rawMaterials/passRateStatistics/index'),
  //       meta: { title: '合格率统计', icon: 'tree' }
  //     }
  //   ]
  // },
  {
    path: '/inspectionManagement',
    component: Layout,
    redirect: '/inspectionManagement/commissionInspection',
    name: 'InspectionManagement',
    meta: { title: '报检管理', icon: 'el-icon-s-help' },
    children: [
      {
        path: 'commissionInspection',
        name: 'CommissionInspection',
        component: () => import('@/views/inspectionManagement/commissionInspection/index'),
        meta: { title: '委托检验', icon: 'table' }
      },
      {
        path: 'reportForInspection',
        name: 'ReportForInspection',
        component: () => import('@/views/inspectionManagement/reportForInspection/index'),
        meta: { title: '原材料报检', icon: 'tree' }
      }
    ]
  },
  {
    path: '/experiment',
    component: Layout,
    redirect: '/experiment/inspectionApplication',
    name: 'Experiment',
    meta: { title: '试验管理', icon: 'el-icon-s-help' },
    children: [
      {
        path: 'inspectionApplication',
        name: 'inspectionApplication',
        component: () => import('@/views/experiment/inspectionApplication/index'),
        meta: { title: '新增检验', icon: 'tree' }
      },
function getRoutes() {
  let constantRoutes = [
    {
      path: '/login',
      component: () => import('@/views/login/index'),
      hidden: true
    },
    {
      path: '/404',
      component: () => import('@/views/404'),
      hidden: true
    },
    {
      path: '/addCommision',
      component: () => import('@/views/inspectionManagement/commissionInspection/addCommision'),
      hidden: true
    },
    {
      path: '/',
      component: Layout,
      redirect: '/home',
      // meta: { title: '主页', icon: 'el-icon-s-home' },
      children: [{
        path: 'home',
        name: 'Home',
        component: () => import('@/views/home/index'),
        meta: { title: '主页', icon: 'el-icon-s-home' }
      }]
    },
    {
      path: '/addCommision/:viewId',
      hidden: true,
      component: () => import('@/views/inspectionManagement/commissionInspection/addCommision'),
    },
    {
      path: '/standardLibrary',
      component: Layout,
      redirect: '/standardLibrary/index',
      meta: { title: '标准库', icon: 'el-icon-s-help' },
      children: [
        {
          path: 'index',
          name: 'StandardLibrary',
          component: () => import('@/views/standardLibrary/index'),
          meta: { title: '标准库', icon: 'form' }
        },
        {
          path: 'specificationDetails/:id',
          name: 'SpecificationDetails',
          // hidden: true,
          component: () => import('@/views/standardLibrary/SpecificationDetails'),
          meta: { title: '产品规格详情', icon: 'form', show: false }
        }
      ]
    },
    // {
    //   path: '/rawMaterials',
    //   component: Layout,
    //   redirect: '/rawMaterials/reportForInspection',
    //   name: 'rawMaterials',
    //   meta: { title: '检验', icon: 'el-icon-s-help' },
    //   children: [
    //     {
    //       path: 'reportForInspection',
    //       name: 'ReportForInspection',
    //       component: () => import('@/views/rawMaterials/reportForInspection/index'),
    //       meta: { title: '原材料报检', icon: 'table' },
    //       children: [
    //         // {
    //         //   path: 'index',
    //         //   name: 'ReportForInspectionIndex',
    //         //   // hidden: true,
    //         //   component: () => import('@/views/rawMaterials/reportForInspection/index'),
    //         //   meta: { title: '原材料报检', icon: 'table' }
    //         // },
    //         {
    //           path: 'forInspectionDetail',
    //           name: 'ForInspectionDetail',
    //           hidden: true,
    //           component: () => import('@/views/rawMaterials/reportForInspection/forInspectionDetail'),
    //           meta: { title: '新增检验单详情', icon: 'table' }
    //         }
    //       ]
    //     },
    //     {
    //       path: 'print',
    //       name: 'Print',
    //       component: () => import('@/views/rawMaterials/print/index'),
    //       meta: { title: '条码打印', icon: 'tree' }
    //     },
    //     {
    //       path: 'planAssignments',
    //       name: 'PlanAssignments',
    //       component: () => import('@/views/rawMaterials/planAssignments/index'),
    //       meta: { title: '检验计划分配', icon: 'tree' }
    //     },
    //     {
    //       path: 'rawMaterialInspection',
    //       name: 'RawMaterialInspection',
    //       component: () => import('@/views/rawMaterials/rawMaterialInspection/index'),
    //       meta: { title: '原材料检验', icon: 'tree' }
    //     },
    //     {
    //       path: 'checkTheReport',
    //       name: 'CheckTheReport',
    //       component: () => import('@/views/rawMaterials/checkTheReport/index'),
    //       meta: { title: '检验报告', icon: 'tree' }
    //     },
    //     {
    //       path: 'reportAuditing',
    //       name: 'ReportAuditing',
    //       component: () => import('@/views/rawMaterials/reportAuditing/index'),
    //       meta: { title: '报告审核', icon: 'tree' }
    //     },
    //     {
    //       path: 'nonConformanceReview',
    //       name: 'NonConformanceReview',
    //       component: () => import('@/views/rawMaterials/nonConformanceReview/index'),
    //       meta: { title: '不合格反馈', icon: 'tree' }
    //     },
    //     {
    //       path: 'nonConformingFeedback',
    //       name: 'NonConformingFeedback',
    //       component: () => import('@/views/rawMaterials/nonConformingFeedback/index'),
    //       meta: { title: '不合格评审', icon: 'tree' }
    //     },
    //     {
    //       path: 'passRateStatistics',
    //       name: 'PassRateStatistics',
    //       component: () => import('@/views/rawMaterials/passRateStatistics/index'),
    //       meta: { title: '合格率统计', icon: 'tree' }
    //     }
    //   ]
    // },
    {
      path: '/inspectionManagement',
      component: Layout,
      redirect: '/inspectionManagement/commissionInspection',
      name: 'InspectionManagement',
      meta: { title: '报检管理', icon: 'el-icon-s-help' },
      children: [
        {
          path: 'commissionInspection',
          name: 'CommissionInspection',
          component: () => import('@/views/inspectionManagement/commissionInspection/index'),
          meta: { title: '委托检验', icon: 'table' }
        },
        {
          path: 'reportForInspection',
          name: 'ReportForInspection',
          component: () => import('@/views/inspectionManagement/reportForInspection/index'),
          meta: { title: '原材料报检', icon: 'tree' }
        }
      ]
    },
    {
      path: '/experiment',
      component: Layout,
      redirect: '/experiment/inspectionApplication',
      name: 'Experiment',
      meta: { title: '试验管理', icon: 'el-icon-s-help' },
      children: [
        {
          path: 'inspectionApplication',
          name: 'inspectionApplication',
          component: () => import('@/views/experiment/inspectionApplication/index'),
          meta: { title: '新增检验', icon: 'tree' }
        },
        {
          path: 'Viewdetails',
          name: 'Viewdetails',
          hidden: true ,
          hidden: true,
          component: () => import('@/views/experiment/inspectionApplication/Viewdetails/index'),
          meta: { title: '详情页', icon: 'tree' }
        },
      {
        path: 'planAssignments',
        name: 'PlanAssignments',
        component: () => import('@/views/experiment/planAssignments/plan'),
        meta: { title: '检验计划', icon: 'tree' }
      },
      {
        path: 'checkTheReport',
        name: 'CheckTheReport',
        component: () => import('@/views/experiment/checkTheReport/index'),
        meta: { title: '检验报告', icon: 'tree' }
      },
      {
        path: 'reportAuditing',
        name: 'ReportAuditing',
        component: () => import('@/views/experiment/reportAuditing/index'),
        meta: { title: '报告审核', icon: 'tree' }
      },
      {
        path: 'nonConformanceReview',
        name: 'NonConformanceReview',
        component: () => import('@/views/experiment/nonConformanceReview/index'),
        meta: { title: '不合格品反馈', icon: 'tree' }
      },
      {
        path: 'nonConformingFeedback',
        name: 'NonConformingFeedback',
        component: () => import('@/views/experiment/nonConformingFeedback/index'),
        meta: { title: '不合格品评审', icon: 'tree' }
      },
      {
        path: 'passRateStatistics',
        name: 'PassRateStatistics',
        component: () => import('@/views/experiment/passRateStatistics/index'),
        meta: { title: '合格率统计', icon: 'tree' }
      }
    ]
  },
  // {
  //   path: '/finishedProduct',
  //   component: Layout,
  //   redirect: '/finishedProduct/reportForInspection',
  //   name: 'FinishedProduct',
  //   meta: { title: '成品检验', icon: 'el-icon-s-help' },
  //   children: [
  //     {
  //       path: 'reportForInspection',
  //       name: 'ReportForInspection',
  //       component: () => import('@/views/rawMaterials/reportForInspection/index'),
  //       meta: { title: '成品送检登记', icon: 'table' }
  //     },
  //     {
  //       path: 'print',
  //       name: 'Print',
  //       component: () => import('@/views/rawMaterials/print/index'),
  //       meta: { title: '条码打印', icon: 'tree' }
  //     },
  //     {
  //       path: 'planAssignments',
  //       name: 'PlanAssignments',
  //       component: () => import('@/views/rawMaterials/planAssignments/index'),
  //       meta: { title: '检验计划分配', icon: 'tree' }
  //     },
  //     {
  //       path: 'rawMaterialInspection',
  //       name: 'RawMaterialInspection',
  //       component: () => import('@/views/rawMaterials/rawMaterialInspection/index'),
  //       meta: { title: '成品检验', icon: 'tree' }
  //     },
  //     {
  //       path: 'checkTheReport',
  //       name: 'CheckTheReport',
  //       component: () => import('@/views/rawMaterials/checkTheReport/index'),
  //       meta: { title: '检验报告', icon: 'tree' }
  //     },
  //     {
  //       path: 'reportAuditing',
  //       name: 'ReportAuditing',
  //       component: () => import('@/views/rawMaterials/reportAuditing/index'),
  //       meta: { title: '报告审核', icon: 'tree' }
  //     },
  //     {
  //       path: 'nonConformanceReview',
  //       name: 'NonConformanceReview',
  //       component: () => import('@/views/rawMaterials/nonConformanceReview/index'),
  //       meta: { title: '不合格反馈', icon: 'tree' }
  //     },
  //     {
  //       path: 'nonConformingFeedback',
  //       name: 'NonConformingFeedback',
  //       component: () => import('@/views/rawMaterials/nonConformingFeedback/index'),
  //       meta: { title: '不合格评审', icon: 'tree' }
  //     },
  //     {
  //       path: 'passRateStatistics',
  //       name: 'PassRateStatistics',
  //       component: () => import('@/views/rawMaterials/passRateStatistics/index'),
  //       meta: { title: '合格率统计', icon: 'tree' }
  //     }
  //   ]
  // },
  {
    path: '/laboratory',
    component: Layout,
    redirect: '/laboratory/ledger',
    name: 'Laboratory',
    meta: { title: '实验室管理', icon: 'el-icon-s-help' },
    children: [
      {
        path: 'ledger',
        name: 'Ledger',
        component: () => import('@/views/laboratory/ledger/index'),
        meta: { title: '设备台账', icon: 'table' }
      },
      {
        path: 'measure',
        name: 'Measure',
        component: () => import('@/views/laboratory/measure/index'),
        meta: { title: '计量管理', icon: 'tree' }
      },
      {
        path: 'gather',
        name: 'Gather',
        component: () => import('@/views/laboratory/gather/index'),
        meta: { title: '设备采集', icon: 'tree' }
      },
      {
        path: 'personnel',
        name: 'Personnel',
        component: () => import('@/views/laboratory/personnel/index'),
        meta: { title: '人员管理', icon: 'tree' }
      },
      {
        path: 'org',
        name: 'Organizational',
        component: () => import('@/views/laboratory/organizational/index.vue'),
        meta: { title: '组织架构', icon: 'tree'}
      },
      {
        path: 'role',
        name: 'Role',
        component: () => import('@/views/laboratory/role/index'),
        meta: { title: '角色管理', icon: 'tree' }
      }
    ]
  },
  {
    path: '/CNAS',
    component: Layout,
    redirect: '/CNAS/reviewAnnualPlan',
    name: 'CNAS',
    meta: { title: 'CNAS管理', icon: 'el-icon-s-help' },
    children: [
      {
        path: 'reviewAnnualPlan',
        name: 'ReviewAnnualPlan',
        component: () => import('@/views/CNAS/reviewAnnualPlan/index'),
        meta: { title: '审核年度计划', icon: 'table' }
      },
      {
        path: 'nonConformanceManage',
        name: 'NonConformanceManage',
        component: () => import('@/views/CNAS/nonConformanceManage/index'),
        meta: { title: '不符合项管理', icon: 'tree' }
      },
      {
        path: 'nonConformanceStatistics',
        name: 'NonConformanceStatistics',
        component: () => import('@/views/CNAS/nonConformanceStatistics/index'),
        meta: { title: '不符合项统计', icon: 'tree' }
      },
      {
        path: 'satisfactionSurveys',
        name: 'SatisfactionSurveys',
        component: () => import('@/views/CNAS/satisfactionSurveys/index'),
        meta: { title: '满意度调查', icon: 'tree' }
      }
    ]
  },
  {
    path: '/chart',
    component: Layout,
    redirect: '/chart/center',
    name: 'Chart',
    meta: { title: '智能图表', icon: 'el-icon-s-help' },
    children: [
      {
        path: 'center',
        name: 'center',
        component: () => import('@/views/chart/center/index'),
        meta: { title: '实验中心', icon: 'table' }
      },
      {
        path: 'spc',
        name: 'Spc',
        component: () => import('@/views/chart/spc/index'),
        meta: { title: 'SPC控制图', icon: 'tree' }
      },
      {
        path: 'shota',
        name: 'Shota',
        component: () => import('@/views/chart/shota/index'),
        meta: { title: '正太分布图', icon: 'tree' }
      },
      {
        path: 'work',
        name: 'Work',
        component: () => import('@/views/chart/work/index'),
        meta: { title: '工作统计', icon: 'tree' }
      }
    ]
  },
  {
    path: '/message',
    component: Layout,
    redirect: '/message/toDo',
    name: 'Message',
    meta: { title: '消息待办', icon: 'el-icon-s-help' },
    children: [
        {
          path: 'planAssignments',
          name: 'PlanAssignments',
          component: () => import('@/views/experiment/planAssignments/plan'),
          meta: { title: '检验计划', icon: 'tree' }
        },
        {
          path: 'checkTheReport',
          name: 'CheckTheReport',
          component: () => import('@/views/experiment/checkTheReport/index'),
          meta: { title: '检验报告', icon: 'tree' }
        },
        {
          path: 'reportAuditing',
          name: 'ReportAuditing',
          component: () => import('@/views/experiment/reportAuditing/index'),
          meta: { title: '报告审核', icon: 'tree' }
        },
        {
          path: 'nonConformanceReview',
          name: 'NonConformanceReview',
          component: () => import('@/views/experiment/nonConformanceReview/index'),
          meta: { title: '不合格品反馈', icon: 'tree' }
        },
        {
          path: 'nonConformingFeedback',
          name: 'NonConformingFeedback',
          component: () => import('@/views/experiment/nonConformingFeedback/index'),
          meta: { title: '不合格品评审', icon: 'tree' }
        },
        {
          path: 'passRateStatistics',
          name: 'PassRateStatistics',
          component: () => import('@/views/experiment/passRateStatistics/index'),
          meta: { title: '合格率统计', icon: 'tree' }
        }
      ]
    },
    // {
    //   path: '/finishedProduct',
    //   component: Layout,
    //   redirect: '/finishedProduct/reportForInspection',
    //   name: 'FinishedProduct',
    //   meta: { title: '成品检验', icon: 'el-icon-s-help' },
    //   children: [
    //     {
    //       path: 'reportForInspection',
    //       name: 'ReportForInspection',
    //       component: () => import('@/views/rawMaterials/reportForInspection/index'),
    //       meta: { title: '成品送检登记', icon: 'table' }
    //     },
    //     {
    //       path: 'print',
    //       name: 'Print',
    //       component: () => import('@/views/rawMaterials/print/index'),
    //       meta: { title: '条码打印', icon: 'tree' }
    //     },
    //     {
    //       path: 'planAssignments',
    //       name: 'PlanAssignments',
    //       component: () => import('@/views/rawMaterials/planAssignments/index'),
    //       meta: { title: '检验计划分配', icon: 'tree' }
    //     },
    //     {
    //       path: 'rawMaterialInspection',
    //       name: 'RawMaterialInspection',
    //       component: () => import('@/views/rawMaterials/rawMaterialInspection/index'),
    //       meta: { title: '成品检验', icon: 'tree' }
    //     },
    //     {
    //       path: 'checkTheReport',
    //       name: 'CheckTheReport',
    //       component: () => import('@/views/rawMaterials/checkTheReport/index'),
    //       meta: { title: '检验报告', icon: 'tree' }
    //     },
    //     {
    //       path: 'reportAuditing',
    //       name: 'ReportAuditing',
    //       component: () => import('@/views/rawMaterials/reportAuditing/index'),
    //       meta: { title: '报告审核', icon: 'tree' }
    //     },
    //     {
    //       path: 'nonConformanceReview',
    //       name: 'NonConformanceReview',
    //       component: () => import('@/views/rawMaterials/nonConformanceReview/index'),
    //       meta: { title: '不合格反馈', icon: 'tree' }
    //     },
    //     {
    //       path: 'nonConformingFeedback',
    //       name: 'NonConformingFeedback',
    //       component: () => import('@/views/rawMaterials/nonConformingFeedback/index'),
    //       meta: { title: '不合格评审', icon: 'tree' }
    //     },
    //     {
    //       path: 'passRateStatistics',
    //       name: 'PassRateStatistics',
    //       component: () => import('@/views/rawMaterials/passRateStatistics/index'),
    //       meta: { title: '合格率统计', icon: 'tree' }
    //     }
    //   ]
    // },
    {
      path: '/laboratory',
      component: Layout,
      redirect: '/laboratory/ledger',
      name: 'Laboratory',
      meta: { title: '实验室管理', icon: 'el-icon-s-help' },
      children: [
        {
          path: 'ledger',
          name: 'Ledger',
          component: () => import('@/views/laboratory/ledger/index'),
          meta: { title: '设备台账', icon: 'table' }
        },
        {
          path: 'measure',
          name: 'Measure',
          component: () => import('@/views/laboratory/measure/index'),
          meta: { title: '计量管理', icon: 'tree' }
        },
        {
          path: 'gather',
          name: 'Gather',
          component: () => import('@/views/laboratory/gather/index'),
          meta: { title: '设备采集', icon: 'tree' }
        },
        {
          path: 'personnel',
          name: 'Personnel',
          component: () => import('@/views/laboratory/personnel/index'),
          meta: { title: '人员管理', icon: 'tree' }
        },
        {
          path: 'org',
          name: 'Organizational',
          component: () => import('@/views/laboratory/organizational/index.vue'),
          meta: { title: '组织架构', icon: 'tree' }
        },
        {
          path: 'role',
          name: 'Role',
          component: () => import('@/views/laboratory/role/index'),
          meta: { title: '角色管理', icon: 'tree' }
        }
      ]
    },
    {
      path: '/CNAS',
      component: Layout,
      redirect: '/CNAS/reviewAnnualPlan',
      name: 'CNAS',
      meta: { title: 'CNAS管理', icon: 'el-icon-s-help' },
      children: [
        {
          path: 'reviewAnnualPlan',
          name: 'ReviewAnnualPlan',
          component: () => import('@/views/CNAS/reviewAnnualPlan/index'),
          meta: { title: '审核年度计划', icon: 'table' }
        },
        {
          path: 'nonConformanceManage',
          name: 'NonConformanceManage',
          component: () => import('@/views/CNAS/nonConformanceManage/index'),
          meta: { title: '不符合项管理', icon: 'tree' }
        },
        {
          path: 'nonConformanceStatistics',
          name: 'NonConformanceStatistics',
          component: () => import('@/views/CNAS/nonConformanceStatistics/index'),
          meta: { title: '不符合项统计', icon: 'tree' }
        },
        {
          path: 'satisfactionSurveys',
          name: 'SatisfactionSurveys',
          component: () => import('@/views/CNAS/satisfactionSurveys/index'),
          meta: { title: '满意度调查', icon: 'tree' }
        }
      ]
    },
    {
      path: '/chart',
      component: Layout,
      redirect: '/chart/center',
      name: 'Chart',
      meta: { title: '智能图表', icon: 'el-icon-s-help' },
      children: [
        {
          path: 'center',
          name: 'center',
          component: () => import('@/views/chart/center/index'),
          meta: { title: '实验中心', icon: 'table' }
        },
        {
          path: 'spc',
          name: 'Spc',
          component: () => import('@/views/chart/spc/index'),
          meta: { title: 'SPC控制图', icon: 'tree' }
        },
        {
          path: 'shota',
          name: 'Shota',
          component: () => import('@/views/chart/shota/index'),
          meta: { title: '正太分布图', icon: 'tree' }
        },
        {
          path: 'work',
          name: 'Work',
          component: () => import('@/views/chart/work/index'),
          meta: { title: '工作统计', icon: 'tree' }
        }
      ]
    },
    {
      path: '/message',
      component: Layout,
      redirect: '/message/toDo',
      name: 'Message',
      meta: { title: '消息待办', icon: 'el-icon-s-help' },
      children: [
        {
          path: 'toDo',
          name: 'ToDo',
          component: () => import('@/views/message/toDo/index'),
          meta: { title: '我的待办', icon: 'tree' }
        },
      {
        path: 'message',
        name: 'Message',
        // hidden: true,
        component: () => import('@/views/message/message/index'),
        // meta: { title: '我的消息', icon: 'table' }
      },
    ]
  },
  {
    path: '/personal',
    component: Layout,
    redirect: '/personal/myInformation',
    name: 'Personal',
    meta: { title: '个人管理', icon: 'el-icon-s-help' },
    children: [
      {
        path: 'myInformation',
        name: 'MyInformation',
        component: () => import('@/views/personal/myInformation/index'),
        meta: { title: '我的信息', icon: 'table' }
      },
      {
        path: 'myBusiness',
        name: 'MyBusiness',
        component: () => import('@/views/personal/myBusiness/index'),
        meta: { title: '我的企业', icon: 'tree', show: false }
      }
    ]
  },
  {
    path: '/baseData',
    component: Layout,
    redirect: '/baseData/basicDataMessage',
    meta: { title: '基础数据', icon: 'el-icon-s-tools' },
    children: [
      {
        path: '/basicDataMessage',
        name: 'BasicDataMessage',
        component: () => import('@/views/basicData/index'),
        meta: { title: '基础数据', icon: 'el-icon-s-tools' }
      }
    ]
  },
  // 404 page must be placed at the end !!!
  { path: '*', redirect: '/404', hidden: true }
]

const createRouter = () => new Router({
  // mode: 'history', // require service support
  scrollBehavior: () => ({ y: 0 }),
  routes: constantRoutes
})

const router = createRouter()

// Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465
export function resetRouter() {
  const newRouter = createRouter()
  router.matcher = newRouter.matcher // reset router
        {
          path: 'message',
          name: 'Message',
          // hidden: true,
          component: () => import('@/views/message/message/index'),
          // meta: { title: '我的消息', icon: 'table' }
        },
      ]
    },
    {
      path: '/personal',
      component: Layout,
      redirect: '/personal/myInformation',
      name: 'Personal',
      meta: { title: '个人管理', icon: 'el-icon-s-help' },
      children: [
        {
          path: 'myInformation',
          name: 'MyInformation',
          component: () => import('@/views/personal/myInformation/index'),
          meta: { title: '我的信息', icon: 'table' }
        },
        {
          path: 'myBusiness',
          name: 'MyBusiness',
          component: () => import('@/views/personal/myBusiness/index'),
          meta: { title: '我的企业', icon: 'tree', show: false }
        }
      ]
    },
    {
      path: '/baseData',
      component: Layout,
      redirect: '/baseData/basicDataMessage',
      name: 'BaseData',
      meta: { title: '基础数据', icon: 'el-icon-s-tools' },
      children: [
        {
          path: 'basicDataMessage',
          name: 'BasicDataMessage',
          component: () => import('@/views/basicData/index'),
          meta: { title: '基础数据', icon: 'el-icon-s-tools' }
        }
      ]
    },
    { path: '*', redirect: '/404', hidden: true }
  ]
  return constantRoutes
}

const baseRouter = [{
  path: '/login',
  component: () => import('@/views/login/index'),
  hidden: true
},
{
  path: '/404',
  component: () => import('@/views/404'),
  hidden: true
},
{
  path: '/addCommision',
  component: () => import('@/views/inspectionManagement/commissionInspection/addCommision'),
  hidden: true
},
{
  path: '/',
  component: Layout,
  redirect: '/home',
  // meta: { title: '主页', icon: 'el-icon-s-home' },
  children: [{
    path: 'home',
    name: 'Home',
    component: () => import('@/views/home/index'),
    meta: { title: '主页', icon: 'el-icon-s-home' }
  }]
}, {
  path: '/addCommision/:viewId',
  hidden: true,
  component: () => import('@/views/inspectionManagement/commissionInspection/addCommision'),
}]

function fn3(tempArr) {
  let result = [];
  let obj = {};
  for (let i = 0; i < tempArr.length; i++) {
      if (!obj[tempArr[i].path]) {
          result.push(tempArr[i]);
          obj[tempArr[i].path] = true;
      };
  };
  return result;
};


function createRouter(Routees) {
  if (JSON.parse(localStorage.getItem("user")) != undefined && JSON.parse(localStorage.getItem("user")) != null) {
    let role = JSON.parse(localStorage.getItem("user")).role
    let menuFather = baseRouter
    const dataMenuFather = fn3(menuFather)
    role.roleMenuList.forEach((r) => {
      dataMenuFather.push(Routees.filter(item => {
        return item.path === r.menuUrl
      })[0])
    })
    let eqChildren = [];
    role.roleMenuList.forEach((r) => {
      dataMenuFather.forEach(m => {
        if (r.menuUrl === m.path) {
          r.children.forEach(rc => {
            m.children.forEach(mc => {
              if (mc.meta != undefined) {
                eqChildren.push({ "path": mc.path, "meta": JSON.parse(JSON.stringify(mc.meta)) })
                delete mc["meta"]
              }
            })
          })
        }
      })
    })
    let once = []
    role.roleMenuList.forEach((r) => {
      r.children.forEach(rc => {
        eqChildren.forEach(eq => {
          if (eq != undefined) {
            if (eq.path == rc.menuUrl.split("/")[1]) {
              once.push(eq)
            }
          }
        })
      })
    })
    dataMenuFather.forEach(m => {
      let i = 0
      if (m.children != undefined) {
        m.children.forEach(mc => {
          once.forEach(eq => {
            if (eq != undefined) {
              if (mc.path == eq.path) {
                if (i === 0) {
                  m.redirect = m.path + "/" + eq.path
                }
                i++;
                mc.meta = eq.meta
              }
            }
          })
        })
      }
    })
    dataMenuFather.push({path: '*', redirect: '/404', hidden: true})
    dataMenuFather.push()
    Routees = dataMenuFather
  } else {
    Routees = baseRouter
  }
  return new Router({
    // mode: 'history', // require service support
    scrollBehavior: () => ({ y: 0 }),
    routes: Routees
  })
}
let router =  createRouter(getRoutes())

// Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465
export async function resetRouter() {
  let newRouter = createRouter(getRoutes())
  router.matcher =  newRouter.matcher
}
router.beforeEach(async (to, from, next) => {
  // 1. 判断是不是登录页面
  // 是登录页面
  if (to.path === '/login') {
    next()
  } else {
    // 不是登录页面
    // 2. 判断 是否登录过
    let token = localStorage.getItem('user')
    if(token!=null&&token!=undefined){
      await resetRouter()
    }
    token ? next() : next('/login')
  }
})
export default router

 src/utils/request.js

@@ -48,7 +48,22 @@

    // if the custom code is not 20000, it is judged as an error.
    if (res.code !== 200) {
      console.log(res.message || 'Error')
      if(res.code===400){
        Message({
        message: res.message,
        type: 'warning',
        duration: 5 * 1000
      })
      }
      if(res.code===401){
        Message({
        message: res.message,
        type: 'warning',
        duration: 5 * 1000
      })
      localStorage.removeItem("user")
      this.$router.push({ path: '/login' })
      }
      // Message({
      //   message: res.message || 'Error',
      //   type: 'error',

 src/views/home/index.vue

@@ -124,7 +124,7 @@
    this.getcheckProjectNum();
    this.getVerifiedData();
    this.getUncheckedData();
    this.getPieChart();
    this.getPieChart();  
  },
  methods: {
    cell({ row, column, rowIndex, columnIndex }) {

 src/views/laboratory/measure/index.vue

@@ -117,6 +117,13 @@
          </div>
        </div>
      </div>
      <div>
        <el-button v-if="selectInfoBtn" @click="combackLookPlan" style="position: fixed;top: 43px;right: 14px; z-index: 1000;" type="primary" icon="el-icon-refresh-left" size="mini" plain >返回</el-button>
        <div v-if="addBtn" style="display: flex;justify-content: center;width: 10%;position: fixed;top: 43px;right: 14px; z-index: 1000;">
          <el-button @click="addTop = -82;addBtn=false" size="mini" style="width: 60px;" >返回</el-button>
          <el-button size="mini" @click="measureAdd" style="width: 60px;" type="primary">保存</el-button>
        </div>
      </div>
      <div
        :style="`position: absolute;top:${addTop}vh;left: 9px;transition: 1s;width: 99%;height: 82vh;background-color: #fff;z-index: 21;`">
        <Add ref="add" />
@@ -276,6 +283,8 @@
    return {
      dialogVisible: false,
      tableIndex: null,
      selectInfoBtn: false,
      addBtn: false,
      measureUpInfo: {
        id: null,
        code: null,
@@ -370,15 +379,12 @@
      this.measureUpInfo.termValidity = scope.row.termValidity
    },
    measureAdd() {
      let add = this.$refs.add.add()
      if (add) {
        this.addTop = -82
      this.addTop = -82
        this.$message({
          message: '操作成功！',
          type: 'success'
        });
        this.lookVisible = false
      }
    },
    async handleSizeChangePlan(num) {
      this.pageSizePlan = num
@@ -392,6 +398,7 @@
      this.addTop = 2
      this.lookVisible = true
      this.$parent.mainShowAdd()
      this.addBtn=true
    },
    async limitGetPlanMeasureInstrument() {
      let param = {
@@ -408,6 +415,7 @@
      this.getPlanAndInfoAndIns(id)
      this.lookVisible = true
      this.mymodelTop = 2
      this.selectInfoBtn=true
      this.$parent.triggerMainBtnPlan()
    },
    async getPlanAndInfoAndIns(id) {
@@ -429,6 +437,7 @@
    combackLookPlan() {
      this.lookVisible = false
      this.mymodelTop = -85
      this.selectInfoBtn=false
    },
    blurSearch() {
      if (this.radioValue === 1) {

 src/views/laboratory/role/index.vue

@@ -8,7 +8,7 @@
            </el-input>
          </el-form-item>
          <el-form-item class="rightBtn">
            <el-button type="primary">查询</el-button>
            <el-button type="primary" @click="searchRole">查询</el-button>
            <el-button type="primary" plain>重置</el-button>
          </el-form-item>
        </el-form>
@@ -16,7 +16,6 @@
          <el-form-item class="rightBtn">
            <el-button type="primary" @click="addClickRole" icon="el-icon-plus">新增角色</el-button>
          </el-form-item>
        </el-form>
        </el-form>
      </div>
      <div class="library-table">
@@ -30,8 +29,9 @@
            <el-table-column prop="updateTime" label="更新时间" min-width="20%" />
            <el-table-column label="操作" min-width="12%">
              <template slot-scope="scope">
                <el-button type="text" size="small">编辑</el-button>
                <el-button type="text" size="small">删除</el-button>
                <el-button type="text" @click="selectRoleInfo(scope)" size="small">查看</el-button>
                <el-button type="text" @click="upRole(scope)" size="small">编辑</el-button>
                <el-button type="text" @click="removeRole(scope)" size="small">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
@@ -67,10 +67,10 @@
          :default-expand-all="false" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
          <el-table-column highlight-current-row prop="parentId" label="菜单类型" sortable width="180">
            <template slot-scope="scope">
              <span v-if="scope.row.parentId == 0 && scope.row.children != undefined" style="color: #409eff;">主菜单</span>
              <span v-if="scope.row.parentId == 0 && scope.row.children === undefined" style="color: #409eff;">
              <span v-if="scope.row.parentId == 0" style="color: #409eff;">主菜单</span>
              <!-- <span v-if="scope.row.parentId == 0 && scope.row.children === undefined" style="color: #409eff;">
                主菜单
              </span>
              </span> -->
            </template>
          </el-table-column>
          <el-table-column prop="name" label="菜单名" sortable width="180">
@@ -103,11 +103,125 @@
        <el-button type="primary" @click="addRole">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog top="5vh" title="编辑角色" :visible.sync="dialogTableVisibleUpdate" width="50%">
      <el-form :model="updateRole" ref="updateRole" label-position="right" label-width="100px">
        <el-col :span="24" style="display: flex;justify-content: space-between;">
          <el-form-item :rules="nameaRules" label="角色名:">
            <el-input @blur="assertUpName" style="width: 300px" v-model="updateRole.roleName" placeholder="请输入角色名">
            </el-input>
          </el-form-item>
          <!-- <el-form-item label="菜单选择:">
            <el-cascader style="width: 300px" collapse-tags size="medium " filterable :props="props"
              v-model="roleAdd.menuData" :options="menuInfo">
              <template slot-scope="{ data }">
                <span>{{ data.label }}</span>
              </template>
            </el-cascader>
          </el-form-item> -->
        </el-col>
      </el-form>
      <el-col :span="24">
        <el-table height="500" :data="menuUpdateInfo" style="width: 100%;margin-bottom: 20px;" row-key="id"
          :default-expand-all="true" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
          <el-table-column highlight-current-row prop="parentId" label="菜单类型" sortable width="180">
            <template slot-scope="scope">
              <span v-if="scope.row.parentId == 0" style="color: #409eff;">主菜单</span>
              <!-- <span v-if="scope.row.parentId == 0 && scope.row.children === undefined" style="color: #409eff;">
                主菜单
              </span> -->
            </template>
          </el-table-column>
          <el-table-column prop="name" label="菜单名" sortable width="180">
            <template slot-scope="scope">
              <el-col v-if="scope.row.parentId == 0">
                <span style="color: #409eff;">{{ scope.row.name }}</span>
              </el-col>
              <el-col v-else>
                <span style="color: #40b815;">{{ scope.row.name }}</span>
              </el-col>
            </template>
          </el-table-column>
          <el-table-column prop="id" label="操作权限">
            <template slot-scope="scope">
              <el-col v-if="scope.row.parentId == 0 && scope.row.children != undefined">
                <!-- <el-checkbox v-model="scope.row.select">查询</el-checkbox> -->
              </el-col>
              <el-col v-else>
                <el-checkbox size="medium" v-model="scope.row.selected" @change="chekSelect(scope)">查询</el-checkbox>
                <el-checkbox size="medium" v-model="scope.row.added" @change="chekAdd(scope)">添加</el-checkbox>
                <el-checkbox size="medium" v-model="scope.row.updated" @change="chekUpdate(scope)">修改</el-checkbox>
                <el-checkbox size="medium" v-model="scope.row.deleted" @change="chekDelet(scope)">删除</el-checkbox>
              </el-col>
            </template>
          </el-table-column>
        </el-table>
      </el-col>
      <span slot="footer" class="dialog-footer">
        <el-button @click="clearUPAll">取 消</el-button>
        <el-button type="primary" @click="cilckUP">确 定</el-button>
      </span>
    </el-dialog>

    <el-dialog top="5vh" title="角色察看" :visible.sync="dialogTableSelectVisible" width="50%">
      <el-form :model="selectMenuInfo" ref="selectMenuInfo" label-position="right" label-width="100px">
        <el-col :span="24" style="display: flex;justify-content: space-between;">
          <el-form-item label="角色名:">
            <el-input style="width: 300px" v-model="selectMenuInfo.roleName" readonly>
            </el-input>
          </el-form-item>
          <!-- <el-form-item label="菜单选择:">
            <el-cascader style="width: 300px" collapse-tags size="medium " filterable :props="props"
              v-model="roleAdd.menuData" :options="menuInfo">
              <template slot-scope="{ data }">
                <span>{{ data.label }}</span>
              </template>
            </el-cascader>
          </el-form-item> -->
        </el-col>
      </el-form>
      <el-col :span="24">
        <el-table height="500" :data="selectMenuInfo.menuData" style="width: 100%;margin-bottom: 20px;" row-key="menuId"
          :default-expand-all="true" :tree-props="{ children: 'children', hasChildren: 'hasChildren' }">
          <el-table-column highlight-current-row prop="parentId" label="菜单类型" sortable width="180">
            <template slot-scope="scope">
              <span v-if="scope.row.parentId == 0" style="color: #409eff;">主菜单</span>
              <!-- <span v-if="scope.row.parentId == 0 && scope.row.children === undefined" style="color: #409eff;">
                主菜单
              </span> -->
            </template>
          </el-table-column>
          <el-table-column prop="menuName" label="菜单名" sortable width="180">
            <template slot-scope="scope">
              <el-col v-if="scope.row.parentId == 0">
                <span style="color: #409eff;">{{ scope.row.menuName }}</span>
              </el-col>
              <el-col v-else>
                <span style="color: #40b815;">{{ scope.row.menuName }}</span>
              </el-col>
            </template>
          </el-table-column>
          <el-table-column prop="menuId" label="操作权限">
            <template slot-scope="scope">
              <el-col v-if="scope.row.parentId == 0 && scope.row.children.length > 0">
                <!-- <el-checkbox v-model="scope.row.select">查询</el-checkbox> -->
              </el-col>
              <el-col id="selectRoleCheck" class="selectRoleCheck" v-else>
                <el-checkbox size="medium" disabled v-model="scope.row.selected">查询</el-checkbox>
                <el-checkbox size="medium" disabled v-model="scope.row.added">添加</el-checkbox>
                <el-checkbox size="medium" disabled v-model="scope.row.updated">修改</el-checkbox>
                <el-checkbox size="medium" disabled v-model="scope.row.deleted">删除</el-checkbox>
              </el-col>
            </template>
          </el-table-column>
        </el-table>
      </el-col>
    </el-dialog>
  </div>
</template>

<script>
import { getMenusTree, addRoleInfo, assertRepeat, getAllRoleAndMenuInfo } from '@/api/laboratory/role'
import { getMenusTree, addRoleInfo, assertRepeat, getAllRoleAndMenuInfo, deleteRole, updateRoleMenu } from '@/api/laboratory/role'
import { default as menuPower } from './menuPower.vue'
export default {
  components: {
@@ -116,6 +230,15 @@
  data() {
    return {
      props: { multiple: true },
      dialogTableVisibleUpdate: false,
      updateRole: {
        roleId: null,
        roleName: null,
        lastName: null,
        menuData: null,
        lastMenuSelect: null
      },
      selectRole: [],
      roleAdd: {
        roleName: null,
        menuData: null
@@ -124,10 +247,14 @@
      menuTableTree: null,
      searchData: {
        roleName: '',
        permission: ''
      },
      assertRepeatName: true,
      menuInfo: [],
      menuUpdateInfo: [],
      selectMenuInfo: {
        roleName: null,
        menuData: null
      },
      roleTable: [],
      updateData: {
        oldPassWord: '',
@@ -135,6 +262,8 @@
        confirmPassWord: ''
      },
      dialogTableVisible: false,
      dialogTableSelectVisible: false,
      addOrUp: false,
      currentPage: 1,
      pageSize: 5,
      total: 20
@@ -147,13 +276,169 @@
    this.start()
  },
  methods: {
    chekSelect(scope) {
    selectRoleInfo(scope) {
      this.selectMenuInfo.roleName = scope.row.roleName
      this.selectMenuInfo.menuData = scope.row.roleMenuList
      console.log(this.selectMenuInfo.menuData);
      this.dialogTableSelectVisible = true
    },
    searchRole() {
      this.start()
    },
    clearUPAll() {
      this.updateRole = {
        roleId: null,
        roleName: null,
        lastName: null,
        menuData: null,
        lastMenuSelect: null
      }
      this.menuUpdateInfo = []
      this.dialogTableVisibleUpdate = false
    },
    async cilckUP() {
      if (this.updateRole.roleName == null || this.updateRole.roleName == '') {
        this.$message({
          message: '请输入角色名',
          type: 'warning'
        });
        return
      }
      if (!this.assertRepeatName) {
        this.$message({
          message: '角色名重复，请重新输入',
          type: 'warning'
        });
        return
      }
      this.menuUpdateInfo.forEach(item => {
        if (item.children != undefined) {
          item.children.forEach(c => {
            if (c.added) {
              item.selected = true
            }
            if (c.selected) {
              item.selected = true
            }
            if (c.updated) {
              item.selected = true
            }
            if (c.deleted) {
              item.selected = true
            }
          })
        }
      })
      console.log(this.menuUpdateInfo);
      this.updateRole.menuData = JSON.parse(JSON.stringify(this.menuUpdateInfo));
      this.updateRole.menuData.forEach(item => {
        if (item.children != undefined) {
          let child = item.children.filter(c => {
            return c.added == true || c.selected == true || c.deleted == true || c.updated === true
          })
          item.children = child
        }
      })
      this.updateRole.menuData = this.updateRole.menuData.filter(item => {
        return item.selected == true
      })
      this.assertDeleteOrUp()
      console.log(this.updateRole);
      let up = await updateRoleMenu(this.updateRole)
      if (up.data) {
        this.$message({
          type: 'success',
          message: '编辑成功!'
        });
        this.start()
        this.clearUPAll()
      } else {
        this.$message.error('编辑失败！请重新操作');
      }

    },
    async upRole(scope) {
      console.log(scope);
      this.updateRole.roleId = scope.row.roleId
      this.updateRole.roleName = scope.row.roleName
      this.updateRole.lastName = scope.row.roleName
      let menuSelect = scope.row.roleMenuList
      this.updateRole.lastMenuSelect = scope.row.roleMenuList
      console.log(menuSelect);
      let res = await getMenusTree();
      this.menuUpdateInfo = res.data
      this.menuUpdateInfo.forEach(item => {
        this.$set(item, 'added', false);
        this.$set(item, 'updated', false);
        this.$set(item, 'deleted', false);
        this.$set(item, 'selected', false);
        if (item.children.length == 0) {
          delete item['children']
        } else {
          item.children.forEach(c => {
            this.$set(c, 'selected', false);
            this.$set(c, 'added', false);
            this.$set(c, 'updated', false);
            this.$set(c, 'deleted', false);
            if (c.children.length == 0) {
              delete c['children']
            }
          })
        }
      })
      console.log(this.menuUpdateInfo);
      menuSelect.forEach(ms => {
        this.menuUpdateInfo.forEach(item => {
          if (ms.menuName === item.name) {
            item.selected = ms.selected
            item.added = ms.added
            item.deleted = ms.deleted
            item.updated = ms.updated
            ms.children.forEach(msc => {
              if (item.children != undefined) {
                item.children.forEach(itemc => {
                  if (itemc.name === msc.menuName) {
                    itemc.selected = msc.selected
                    itemc.added = msc.added
                    itemc.deleted = msc.deleted
                    itemc.updated = msc.updated
                  }
                })
              }
            })
          }
        })
      })
      this.dialogTableVisibleUpdate = true
    },
    removeRole(scope) {
      this.$confirm('此操作将删除该角色, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(async () => {
        this.roleTable = this.roleTable.filter(item => {
          return item.roleId != scope.row.roleId
        });
        this.$message({
          type: 'success',
          message: '删除成功!'
        });
        await deleteRole({ id: scope.row.roleId })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },
    async start() {
      let res = await getAllRoleAndMenuInfo()
      this.roleTable = res.data
      console.log(res);
      let res = await getAllRoleAndMenuInfo({ currentPage: this.currentPage, pageSize: this.pageSize, name: this.searchData.roleName })
      res.data.list.forEach(item => {
        item.roleId = String(item.roleId)
      })
      this.roleTable = res.data.list
      this.total = res.data.total
    },
    async assertName() {
      if (this.roleAdd.roleName == null || this.roleAdd.roleName == '') {
@@ -175,13 +460,81 @@
      }
    },
    chekAdd(scope) {
      scope.row.selected = true
      if (scope.row.added) {
        scope.row.selected = true
      }
      this.updateFatherState(scope)
    },
    chekUpdate(scope) {
      scope.row.selected = true
      if (scope.row.updated) {
        scope.row.selected = true
      }
      this.updateFatherState(scope)
    },
    chekDelet(scope) {
      scope.row.selected = true
      if (scope.row.deleted) {
        scope.row.selected = true
      }
      this.updateFatherState(scope)
    },
    chekSelect(scope) {
      this.updateFatherState(scope)
    },
    updateFatherState(scope) {
      if (this.menuUpdateInfo != []) {
        this.menuUpdateInfo.forEach(item => {
          if (item.id == scope.row.parentId) {
            if (item.children != undefined) {
              let childrenFalse = item.children.length * 4;
              let countFalse = 0;
              item.children.forEach(c => {
                if (c.added == false) {
                  countFalse++;
                }
                if (c.deleted == false) {
                  countFalse++;
                }
                if (c.updated == false) {
                  countFalse++;
                }
                if (c.selected == false) {
                  countFalse++;
                }
              })
              if (childrenFalse === countFalse) {
                item.selected = false
              }
            }
          }
        })
      }
      if (this.menuInfo != []) {
        this.menuInfo.forEach(item => {
          if (item.id == scope.row.parentId) {
            if (item.children != undefined) {
              let childrenFalse = item.children.length * 4;
              let countFalse = 0;
              item.children.forEach(c => {
                if (c.added == false) {
                  countFalse++;
                }
                if (c.deleted == false) {
                  countFalse++;
                }
                if (c.updated == false) {
                  countFalse++;
                }
                if (c.selected == false) {
                  countFalse++;
                }
              })
              if (childrenFalse === countFalse) {
                item.selected = false
              }
            }
          }
        })
      }
    },
    async addClickRole() {
      let res = await getMenusTree();
@@ -254,6 +607,7 @@
        return item.selected == true
      })
      let res = await addRoleInfo(this.roleAdd);
      this.start()
      if (res.data) {
        this.$message({
          message: '添加角色成功',
@@ -287,6 +641,92 @@
      this.menuInfo = []
      this.assertRepeatName = true
      this.dialogTableVisible = false
    },
    assertDeleteOrUp() {
      console.log("---------");
      console.log(this.updateRole.menuData);
      this.updateRole.lastMenuSelect
      this.updateRole.menuData
      let newTree = []
      let oldTree = []
      this.updateRole.menuData.forEach(item => {
        const obj = {
          menuId: item.id,
          menuName: item.name,
          added: item.added,
          parentId: item.parentId,
          deleted: item.deleted,
          updated: item.updated,
          selected: item.selected
        }
        newTree.push(obj)
        if (item.children != undefined && obj.selected != false) {
          item.children.forEach(c => {
            const objc = {
              menuId: c.id,
              menuName: c.name,
              parentId: c.parentId,
              added: c.added,
              deleted: c.deleted,
              updated: c.updated,
              selected: c.selected
            }
            newTree.push(objc)
          })
        }
      })
      console.log(newTree);
      // this.updateRole.lastMenuSelect.forEach(item => {
      //   const obj = {
      //     menuId: item.menuId,
      //     menuName: item.menuName,
      //     added: item.added,
      //     deleted: item.deleted,
      //     updated: item.updated,
      //     selected: item.selected
      //   }
      //   if (obj.selected) {
      //     oldTree.push(obj)
      //   }
      //   if (item.children != [] && obj.selected != false) {
      //     item.children.forEach(c => {
      //       const objc = {
      //         menuId: c.menuId,
      //         menuName: c.menuName,
      //         added: c.added,
      //         deleted: c.deleted,
      //         updated: c.updated,
      //         selected: c.selected
      //       }
      //       oldTree.push(objc)
      //     })
      //   }
      // })
      console.log(oldTree);
      // this.updateRole.lastMenuSelect = oldTree
      this.updateRole.menuData = newTree
    },
    async assertUpName() {
      if (this.updateRole.roleName == null || this.updateRole.roleName == '') {
        this.$message({
          message: '请输入角色名称！',
          type: 'warning'
        });
        return
      }
      if (this.updateRole.roleName === this.updateRole.lastName) {
        return
      }
      let res = await assertRepeat({ roleName: this.updateRole.roleName })
      if (!res.data) {
        this.assertRepeatName = false
        this.$message({
          message: '角色名重复，请重新输入！',
          type: 'warning'
        });
      } else {
        this.assertRepeatName = true
      }
    }
  }
}
@@ -336,5 +776,16 @@
    justify-content: end;
    margin-top: 20px
  }

}
</style>

<style>
#selectRolecheck .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after {
  border-color: #fff !important;
}
#selectRoleCheck .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
  background-color: #409EFF;
  border-color: #409EFF;
}
</style>

 src/views/login/index.vue

@@ -11,38 +11,23 @@
        <span class="svg-container">
          <svg-icon icon-class="user" />
        </span>
        <el-input
          ref="username"
          v-model="loginForm.username"
          placeholder="Username"
          name="username"
          type="text"
          tabindex="1"
          auto-complete="on"
        />
        <el-input ref="username" v-model="loginForm.username" placeholder="Username" name="username" type="text"
          tabindex="1" auto-complete="on" />
      </el-form-item>

      <el-form-item prop="password">
        <span class="svg-container">
          <svg-icon icon-class="password" />
        </span>
        <el-input
          :key="passwordType"
          ref="password"
          v-model="loginForm.password"
          :type="passwordType"
          placeholder="Password"
          name="password"
          tabindex="2"
          auto-complete="on"
          @keyup.enter.native="handleLogin"
        />
        <el-input :key="passwordType" ref="password" v-model="loginForm.password" :type="passwordType"
          placeholder="Password" name="password" tabindex="2" auto-complete="on" @keyup.enter.native="handleLogin" />
        <span class="show-pwd" @click="showPwd">
          <svg-icon :icon-class="passwordType === 'password' ? 'eye' : 'eye-open'" />
        </span>
      </el-form-item>

      <el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;" @click.native.prevent="handleLogin">Login</el-button>
      <el-button :loading="loading" type="primary" style="width:100%;margin-bottom:30px;"
        @click.native.prevent="handleLogin">Login</el-button>
      <!-- <div class="tips">
        <span style="margin-right:20px;">username: admin</span>
        <span> password: any</span>
@@ -53,7 +38,7 @@

<script>
import { validUsername } from '@/utils/validate'

import { get } from "@/api/util/requestUtil.js"
export default {
  name: 'Login',
  data() {
@@ -87,7 +72,7 @@
  },
  watch: {
    $route: {
      handler: function(route) {
      handler: function (route) {
        this.redirect = route.query && route.query.redirect
      },
      immediate: true
@@ -108,7 +93,11 @@
      this.$refs.loginForm.validate(valid => {
        if (valid) {
          this.loading = true
          this.$store.dispatch('user/login', this.loginForm).then(() => {
          this.$store.dispatch('user/login', this.loginForm).then(async () => {
            await get(this.$url.info).then(res => {
              this.user = res.data
              localStorage.setItem("user", JSON.stringify(res.data))
            })
            this.$router.push({ path: this.redirect || '/' })
            this.loading = false
          }).catch(() => {
@@ -128,8 +117,8 @@
/* 修复input 背景不协调 和光标变色 */
/* Detail see https://github.com/PanJiaChen/vue-element-admin/pull/927 */

$bg:#283443;
$light_gray:#fff;
$bg: #283443;
$light_gray: #fff;
$cursor: #fff;

@supports (-webkit-mask: none) and (not (cater-color: $cursor)) {
@@ -172,27 +161,28 @@
</style>

<style lang="scss" scoped>
$bg:#2d3a4b;
$dark_gray:#889aa4;
$light_gray:#eee;
$bg: #2d3a4b;
$dark_gray: #889aa4;
$light_gray: #eee;

.login-container {
  min-height: 100%;
  width: 100%;
  background:url('../../assets/404_images/backgroud.png') no-repeat;
  background: url('../../assets/404_images/backgroud.png') no-repeat;
  background-size: 100vw 100vh;
  overflow: hidden;

  .login-form {
    position: relative;
    width: 520px;
    max-width: 100%;
    padding: 0 35px ;
    padding: 0 35px;
    margin: 0 auto;
    overflow: hidden;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    transform: translate(-50%, -50%);

  }