添加权限

src/components/minheader/index.vue

@@ -1,8 +1,5 @@
 <template>
-  <div
-    :class="isStatus || isStatuser ? 'flex' : 'flex-end'"
-    class="data-table-btn"
-  >
+  <div :class="isStatus || isStatuser ? 'flex' : 'flex-end'" class="data-table-btn">
     <div v-if="isStatus || isStatuser" class="vStatus flex-act">
       <slot name="header" />
       <!-- <el-date-picker
@@ -15,27 +12,9 @@
         size="default"
       >
       </el-date-picker> -->
-      <el-date-picker
-        v-if="isTime"
-        format="YYYY-MM-DD"
-        value-format="YYYY-MM-DD"
-        v-model="startTime"
-        :rows="1"
-        size="default"
-        type="date"
-        placeholder="开始日期"
-      >
+      <el-date-picker v-if="isTime" format="YYYY-MM-DD" value-format="YYYY-MM-DD" v-model="startTime" :rows="1" size="default" type="date" placeholder="开始日期">
       </el-date-picker>
-      <el-date-picker
-        v-if="isTime"
-        format="YYYY-MM-DD"
-        value-format="YYYY-MM-DD"
-        class="L12"
-        size="default"
-        v-model="endTime"
-        type="date"
-        placeholder="结束日期"
-      >
+      <el-date-picker v-if="isTime" format="YYYY-MM-DD" value-format="YYYY-MM-DD" class="L12" size="default" v-model="endTime" type="date" placeholder="结束日期">
       </el-date-picker>
     </div>
     <!-- <div class="">
@@ -59,45 +38,22 @@
         <!-- <el-button type="danger" size="default" class="br L12">搜索</el-button> -->
       </template>
       <template v-if="isSlot">
-        <el-button type="danger" size="default" class="br L12" @click="addslot"
-          >1个插槽</el-button
-        >
+        <el-button type="danger" size="default" class="br L12" @click="addslot">1个插槽</el-button>
       </template>
       <template v-if="isJournal">
-        <el-button
-          size="default"
-          plain
-          class="btn-white P12"
-          @click="addJournal"
-          >查看日志</el-button
-        >
+        <el-button size="default" plain class="btn-white P12" @click="addJournal">查看日志</el-button>
       </template>
       <template v-if="isMeasure">
-        <el-button size="default" plain class="btn-white br" @click="addBbut"
-          >测试</el-button
-        >
+        <el-button size="default" plain class="btn-white br" @click="addBbut">测试</el-button>
       </template>
       <template v-if="isPreser">
-        <el-button
-          type="danger"
-          size="default"
-          class="br L12"
-          @click="preserBtn"
-          >保存</el-button
-        >
+        <el-button type="danger" size="default" class="br L12" @click="preserBtn">保存</el-button>
       </template>
       <template v-if="isAuth">
-        <el-button size="default" plain class="btn-white br" @click="addBbut"
-          >新增</el-button
-        >
+        <el-button size="default" plain class="btn-white br" @click="addBbut">新增</el-button>
       </template>
       <template v-if="isShow">
-        <img
-          class="btn-img"
-          src="@/assets/baggage/ic_setting.png"
-          title="列设置"
-          @click="show"
-        />
+        <img class="btn-img" src="@/assets/baggage/ic_setting.png" title="列设置" @click="show" />
       </template>
     </div>
   </div>

src/components/tableTemp/index.vue

@@ -1,38 +1,13 @@
 <template>
-  <el-table
-    ref="table"
-    v-el-table-infinite-scroll="load"
-    :row-key="tableProps.rowKey"
-    :row-style="rowStyle"
-    :data="tableData"
-    :height="tableProps.height"
-    :max-height="tableProps.maxHeight"
-    :stripe="tableProps.stripe"
-    :border="tableProps.border"
-    :highlight-current-row="tableProps.highlightCurrentRow"
-    :header-cell-class-name="tableProps.headerCellClassName"
-    :tooltip-effect="tableProps.tooltipEffect"
-    :show-summary="tableProps.showSummary"
-    :row-class-name="tableRowClassName"
-    :cell-class-name="cellClassName"
-    @row-click="rowClickHandler"
-    @cell-click="cellClickHandler"
-    @select="selectHandler"
-  >
+  <el-table ref="table" v-el-table-infinite-scroll="load" :row-key="tableProps.rowKey" :row-style="rowStyle" :data="tableData" :height="tableProps.height" :max-height="tableProps.maxHeight" :stripe="tableProps.stripe" :border="tableProps.border" :highlight-current-row="tableProps.highlightCurrentRow" :header-cell-class-name="tableProps.headerCellClassName" :tooltip-effect="tableProps.tooltipEffect" :show-summary="tableProps.showSummary" :row-class-name="tableRowClassName" :cell-class-name="cellClassName" @row-click="rowClickHandler" @cell-click="cellClickHandler" @select="selectHandler">
     <el-table-column v-if="selectionEnable" type="selection" width="35" />
     <el-table-column v-if="isStatus" width="55">
       <template #default="scope">
         <div class="tableStatus">
-          <div
-            v-if="tableData[scope.$index].nodeState === '运行'"
-            class="status0"
-          >
+          <div v-if="tableData[scope.$index].nodeState === '运行'" class="status0">
             <span class="icon"></span>
           </div>
-          <div
-            v-else-if="tableData[scope.$index].nodeState === '停止'"
-            class="status1"
-          >
+          <div v-else-if="tableData[scope.$index].nodeState === '停止'" class="status1">
             <span class="icon"></span>
           </div>
           <div v-else class="status2"><span class="icon"></span></div>
@@ -40,30 +15,13 @@
       </template>
     </el-table-column>
     <!-- label-class-name  可通过 tableHeader中传入class来修改某一个或某一类表头的样式-->
-    <el-table-column
-      class="infinite-list-item"
-      v-for="(items, index) in tableHeaderList"
-      :key="index"
-      :label="items.columnLabel"
-      :prop="items.columnName"
-      :width="items.width ? items.width : tableColumnProperty.width"
-      :sortable="items.needSort ? items.needSort : tableColumnProperty.sortable"
-      :show-overflow-tooltip="tableColumnProperty.showOverflowTooltip"
-      :align="items.align ? items.align : tableColumnProperty.align"
-      :header-align="
+    <el-table-column class="infinite-list-item" v-for="(items, index) in tableHeaderList" :key="index" :label="items.columnLabel" :prop="items.columnName" :width="items.width ? items.width : tableColumnProperty.width" :sortable="items.needSort ? items.needSort : tableColumnProperty.sortable" :show-overflow-tooltip="tableColumnProperty.showOverflowTooltip" :align="items.align ? items.align : tableColumnProperty.align" :header-align="
         items.headerAlign ? items.headerAlign : tableColumnProperty.headerAlign
-      "
-      :label-class-name="items.lableClass ? items.lableClass : ''"
-      :class-name="items.columnClassName"
-    >
+      " :label-class-name="items.lableClass ? items.lableClass : ''" :class-name="items.columnClassName">
       <template #default="scope">
         <!-- 枚举值则为 items.key+'-enum' -->
         <template v-if="isChild(scope.row[items.columnName])">
-          <div
-            class="child-list"
-            v-for="(newItem, i) in childDatas(scope.row[items.columnName])"
-            :key="i"
-          >
+          <div class="child-list" v-for="(newItem, i) in childDatas(scope.row[items.columnName])" :key="i">
             {{ newItem }}
           </div>
         </template>
@@ -76,26 +34,32 @@
         </template>
       </template>
     </el-table-column>
-    <el-table-column
-      v-if="tableBtnGroup.length"
-      label="操作"
-      :align="tableColumnProperty.align"
-      :width="btnGroupWidth"
-    >
+    <el-table-column v-if="tableBtnGroup.length" label="操作" :align="tableColumnProperty.align" :width="btnGroupWidth">
       <template #default="scope">
-        <el-button
-          v-for="(btn, index) in tableBtnGroup"
-          :key="index"
-          size="small"
-          :class="btn.className"
-          @click="handleClick(scope.$index, scope.row, btn.param)"
-        >
-          {{
+        <div class="flex-wrap btn-all">
+          <div v-for="(btn, index) in tableBtnGroup" :key="index" class="btn-list">
+            <template v-if="btn.is">
+              <div v-permission="[btn.is]">
+                <el-button size="small" :class="btn.className" @click="handleClick(scope.$index, scope.row, btn.param)">
+                  {{
+            btn.name === "停止" && scope.row.runState === "停止"
+              ? "启动"
+              : btn.name
+          }}
+                </el-button>
+              </div>
+            </template>
+            <template v-else>
+              <el-button size="small" :class="btn.className" @click="handleClick(scope.$index, scope.row, btn.param)">
+                {{
             btn.name === "停止" && scope.row.runState === "停止"
               ? "启动"
               : btn.name
           }}
-        </el-button>
+              </el-button>
+            </template>
+          </div>
+        </div>
       </template>
     </el-table-column>
   </el-table>
@@ -113,6 +77,7 @@ export interface TableButton {
   name: string;
   className: string;
   param: number;
+  is?: string;
 }
 
 const props = defineProps({
@@ -322,6 +287,15 @@ defineExpose({
     font-weight: 400;
     color: #101116;
   }
+  .btn-all {
+    justify-content: center;
+    .btn-list {
+      margin-right: 10px;
+      &:last-child {
+        margin-right: 0;
+      }
+    }
+  }
   .el-table__body .el-table__cell {
     &.el-table-column--selection > .cell {
       display: block;

src/directives/permission.ts

@@ -28,5 +28,5 @@ export default {
   },
   componentUpdated(el: any, binding: any) {
     checkPermission(el, binding)
-  }
+  },
 }

src/router/routes/routes-file-five.ts

@@ -1,32 +1,32 @@
-import Layout from "@/layout";
+import Layout from '@/layout'
 
 const HomeRoutes = {
-  path: "/dataQuery",
+  path: '/dataQuery',
   component: Layout,
-  name: "dataQuery",
-  redirect: "/dataQuery/flightQuery",
+  name: 'dataQuery',
+  redirect: '/dataQuery/flightQuery',
   //using el svg icon, the elSvgIcon first when at the same time using elSvgIcon and icon
-  meta: { title: "数据查询", elSvgIcon: "Search" },
+  meta: { title: '数据查询', elSvgIcon: 'Search', roles: ['data_query_menu'] },
   children: [
     {
-      path: "/dataQuery/flightQuery",
-      name: "FlightQuery",
-      meta: { title: "航班查询" },
-      component: () => import("@/views/dataQuery/flightQuery/index.vue"),
+      path: '/dataQuery/flightQuery',
+      name: 'FlightQuery',
+      meta: { title: '航班查询', roles: ['flight_query_page'] },
+      component: () => import('@/views/dataQuery/flightQuery/index.vue'),
     },
     {
-      path: "/dataQuery/waybillQuery",
-      name: "WaybillQuery",
-      meta: { title: "运单查询" },
-      component: () => import("@/views/dataQuery/waybillQuery/index.vue"),
+      path: '/dataQuery/waybillQuery',
+      name: 'WaybillQuery',
+      meta: { title: '运单查询', roles: ['waybill_query_page'] },
+      component: () => import('@/views/dataQuery/waybillQuery/index.vue'),
     },
     {
-      path: "/dataQuery/freightInquiry",
-      name: "FreightInquiry",
-      meta: { title: "货物查询"},
-      component: () => import("@/views/dataQuery/freightInquiry/index.vue"),
+      path: '/dataQuery/freightInquiry',
+      name: 'FreightInquiry',
+      meta: { title: '货物查询', roles: ['freight_inquiry_page'] },
+      component: () => import('@/views/dataQuery/freightInquiry/index.vue'),
     },
   ],
-};
+}
 
-export default [HomeRoutes];
+export default [HomeRoutes]

src/router/routes/routes-file-four.ts

@@ -6,14 +6,19 @@ const HomeRoutes = {
   name: 'systemSettings',
   redirect: '/systemSettings/warningSet',
   //using el svg icon, the elSvgIcon first when at the same time using elSvgIcon and icon
-  meta: { title: '系统配置', elSvgIcon: 'Tools', breadcrumb: false },
+  meta: {
+    title: '系统配置',
+    elSvgIcon: 'Tools',
+    breadcrumb: false,
+    roles: ['system_settings_menu'],
+  },
   children: [
     {
-      path: "/systemSettings/securityPolicy",
-      name: "SecurityPolicy",
-      meta: { title: "登录策略" },
+      path: '/systemSettings/securityPolicy',
+      name: 'SecurityPolicy',
+      meta: { title: '登录策略', roles: ['login_strategy_page'] },
       component: () =>
-        import("@/views/systemSettings/securityPolicy/index.vue"),
+        import('@/views/systemSettings/securityPolicy/index.vue'),
     },
     {
       path: '/systemSettings/securityPolicyedit',
@@ -26,7 +31,7 @@ const HomeRoutes = {
     {
       path: '/systemSettings/warningSet',
       name: 'WarningSet',
-      meta: { title: '预警告警策略' },
+      meta: { title: '预警告警策略', roles: ['alert_alarm_settings_page'] },
       redirect: '/systemSettings/warningSet',
       component: {
         render: () => h(resolveComponent('router-view')),
@@ -52,7 +57,7 @@ const HomeRoutes = {
     {
       path: '/systemSettings/log',
       name: 'log',
-      meta: { title: '日志管理' },
+      meta: { title: '日志管理', roles: ['log_management_page'] },
       component: () => import('@/views/systemSettings/log/index.vue'),
     },
     {
@@ -65,7 +70,7 @@ const HomeRoutes = {
         {
           path: '/systemSettings/serviceManagement',
           name: 'ServiceHome',
-          meta: { title: '服务管理' },
+          meta: { title: '服务管理', roels: ['service_management_page'] },
           component: () =>
             import('@/views/systemSettings/serviceManagement/index.vue'),
         },
@@ -73,7 +78,7 @@ const HomeRoutes = {
           path: '/systemSettings/serviceTopology',
           name: 'ServiceTopology',
           hidden: true,
-          meta: { title: '服务拓扑' },
+          meta: { title: '服务拓扑', roles: ['slot_edit_page'] },
           component: () =>
             import(
               '@/views/systemSettings/serviceManagement/serviceTopology.vue'
@@ -83,7 +88,7 @@ const HomeRoutes = {
           path: '/systemSettings/serviceEdit',
           name: 'ServiceEdit',
           hidden: true,
-          meta: { title: '服务编辑' },
+          meta: { title: '服务编辑', roles: ['service_editor_page'] },
           component: () =>
             import('@/views/systemSettings/serviceManagement/serviceEdit.vue'),
         },
@@ -92,7 +97,7 @@ const HomeRoutes = {
     {
       path: '/systemSettings/queryTemplate',
       name: 'QueryTemplate',
-      meta: { title: '查询模板' },
+      meta: { title: '查询模板', roles: ['query_template_page'] },
       redirect: '/systemSettings/queryTemplate',
       component: {
         render: () => h(resolveComponent('router-view')),
@@ -127,7 +132,10 @@ const HomeRoutes = {
           path: '/systemSettings/queryTemplateColumn',
           name: 'QueryTemplateColumn',
           hidden: true,
-          meta: { title: '查询模板设置' },
+          meta: {
+            title: '查询模板设置',
+            roles: ['query_template_column_settings_button'],
+          },
           component: () =>
             import(
               '@/views/systemSettings/queryTemplate/queryTemplateColumn.vue'
@@ -152,20 +160,23 @@ const HomeRoutes = {
     {
       path: '/systemSettings/sourceTube',
       name: 'SourceTube',
-      meta: { title: '数据源管理' },
+      meta: { title: '数据源管理', roles: ['data_source_management_page'] },
       component: () => import('@/views/systemSettings/sourceTube/index.vue'),
     },
     {
       path: '/systemSettings/protocolManagement',
       name: 'ProtocolManagement',
-      meta: { title: '协议管理' },
+      meta: { title: '协议管理', roles: ['agreement_management_page'] },
       component: () =>
         import('@/views/systemSettings/protocolManagement/index.vue'),
     },
     {
       path: '/systemSettings/datastructure',
       name: 'Datastructure',
-      meta: { title: '数据结构管理' },
+      meta: {
+        title: '数据结构管理',
+        roles: ['data_structure_management_page'],
+      },
       redirect: '/systemSettings/datastructure',
       component: {
         render: () => h(resolveComponent('router-view')),

src/router/routes/routes-file-one.ts

@@ -13,35 +13,42 @@ const HomeRoutes = {
         render: () => h(resolveComponent('router-view')),
       },
       //using el svg icon, the elSvgIcon first when at the same time using elSvgIcon and icon
-      meta: { title: '决策管理驾驶舱', elSvgIcon: 'Histogram' },
+      meta: {
+        title: '决策管理驾驶舱',
+        elSvgIcon: 'Histogram',
+        roles: ['decision_management_cockpit_menu'],
+      },
       children: [
         {
           path: '/homein',
           name: 'Homein',
           component: () => import('@/views/dashboard/index.vue'),
-          meta: { title: '国内进港'}
+          meta: { title: '国内进港', roles: ['domestic_arrival_page'] },
         },
         {
           path: '/homeOut',
           name: 'HomeOut',
           component: () => import('@/views/dashboard/indexHomeOut.vue'),
-          meta: { title: '国内出港'}
+          meta: {
+            title: '国内出港',
+            roles: ['domestic_departure_page'],
+          },
         },
         {
           path: '/indexIn',
           name: 'IndexIn',
           component: () => import('@/views/dashboard/indexIn.vue'),
-          meta: { title: '国际进港'}
+          meta: { title: '国际进港', roles: ['international_arrival_page'] },
         },
         {
           path: '/indexOut',
           name: 'IndexOut',
           component: () => import('@/views/dashboard/indexOut.vue'),
-          meta: { title: '国际出港'}
-        }
-      ]
-    }
-  ]
+          meta: { title: '国际出港', roles: ['international_departure_page'] },
+        },
+      ],
+    },
+  ],
 }
 
 // const DemoRoutes = {

src/router/routes/routes-file-six.ts

@@ -7,7 +7,12 @@ const ActualTimeRoutes = {
   name: 'realTime',
   redirect: '/realTime/departure',
   //using el svg icon, the elSvgIcon first when at the same time using elSvgIcon and icon
-  meta: { title: '综合可视化', elSvgIcon: 'DataAnalysis', breadcrumb: false },
+  meta: {
+    title: '综合可视化',
+    elSvgIcon: 'DataAnalysis',
+    breadcrumb: false,
+    roles: ['integrated_visualization_menu'],
+  },
   children: [
     {
       path: '/realTime/departure',
@@ -15,6 +20,7 @@ const ActualTimeRoutes = {
       redirect: '/realTime/departure/airport',
       meta: {
         title: '国内出港',
+        roles: ['view_of_domestic_departure_termina_page'],
       },
       component: {
         render: () => h(resolveComponent('router-view')),
@@ -92,7 +98,7 @@ const ActualTimeRoutes = {
       redirect: '/realTime/internationalDeparture/airport',
       meta: {
         title: '国际出港',
-
+        roles: ['view_of_international_departure_terminal_page'],
         breadcrumb: false,
       },
       component: {
@@ -176,7 +182,7 @@ const ActualTimeRoutes = {
       redirect: '/realTime/arrival/airport',
       meta: {
         title: '国内进港',
-
+        roles: ['view_of_domestic_inbound_termina_page'],
         breadcrumb: false,
       },
       component: {
@@ -252,7 +258,7 @@ const ActualTimeRoutes = {
       redirect: '/realTime/internationalArrival/airport',
       meta: {
         title: '国际进港',
-
+        roles: ['view_of_international_inbound_terminal_page'],
         breadcrumb: false,
       },
       component: {
@@ -333,7 +339,7 @@ const ActualTimeRoutes = {
     {
       path: '/realTime/trackMap',
       name: 'TrackMap',
-      meta: { title: '轨迹地图' },
+      meta: { title: '轨迹地图', roles: ['track_map_page'] },
       component: () => import('@/views/realTime/trackMap/index.vue'),
     },
   ],

src/router/routes/routes-file-three.ts

@@ -1,65 +1,82 @@
-import Layout from "@/layout";
+import Layout from '@/layout'
 
 const HomeRoutes = {
-  path: "/BasicsData",
+  path: '/BasicsData',
   component: Layout,
-  name: "BasicsData",
-  redirect: "/BasicsData/airlineCompany",
+  name: 'BasicsData',
+  redirect: '/BasicsData/airlineCompany',
   //using el svg icon, the elSvgIcon first when at the same time using elSvgIcon and icon
-  meta: { title: "基础数据", elSvgIcon: "Operation" },
+  meta: {
+    title: '基础数据',
+    elSvgIcon: 'Operation',
+    roles: ['basic_data_menu'],
+  },
   children: [
     {
-      path: "/BasicsData/airlineCompany",
-      name: "AirlineCompany",
-      meta: { title: "航司信息维护" },
-      component: () => import("@/views/BasicsData/airlineCompany/index.vue"),
+      path: '/BasicsData/airlineCompany',
+      name: 'AirlineCompany',
+      meta: {
+        title: '航司信息维护',
+        roles: ['airline_information_maintenance_page'],
+      },
+      component: () => import('@/views/BasicsData/airlineCompany/index.vue'),
     },
     {
-      path: "/BasicsData/airportCompany",
-      name: "AirportCompany",
-      meta: { title: "机场公司维护" },
-      component: () => import("@/views/BasicsData/airportCompany/index.vue"),
+      path: '/BasicsData/airportCompany',
+      name: 'AirportCompany',
+      meta: {
+        title: '机场公司维护',
+        roles: ['airport_company_maintenance_page'],
+      },
+      component: () => import('@/views/BasicsData/airportCompany/index.vue'),
     },
     {
-      path: "/BasicsData/airportInfo",
-      name: "AirportInfo",
-      meta: { title: "机场信息维护" },
-      redirect: "/BasicsData/airportInfo",
+      path: '/BasicsData/airportInfo',
+      name: 'AirportInfo',
+      meta: {
+        title: '机场信息维护',
+        roles: ['airport_information_maintenance_page'],
+      },
+      redirect: '/BasicsData/airportInfo',
       component: {
-        render: () => h(resolveComponent("router-view")),
+        render: () => h(resolveComponent('router-view')),
       },
       children: [
         {
-          path: "/BasicsData/airportInfo",
+          path: '/BasicsData/airportInfo',
           hidden: true,
-          component: () => import("@/views/BasicsData/airportInfo/index.vue"),
+          component: () => import('@/views/BasicsData/airportInfo/index.vue'),
         },
         {
-          path: "/BasicsData/airportInfoChild",
-          name: "AirportInfoChild",
+          path: '/BasicsData/airportInfoChild',
+          name: 'AirportInfoChild',
           hidden: true,
-          meta: { title: "区域设置", keepAlive: true },
-          redirect: "/BasicsData/airportInfoChild",
+          meta: {
+            title: '区域设置',
+            keepAlive: true,
+            roles: ['terminal_setting_page'],
+          },
+          redirect: '/BasicsData/airportInfoChild',
           component: {
-            render: () => h(resolveComponent("router-view")),
+            render: () => h(resolveComponent('router-view')),
           },
           children: [
             {
-              path: "/BasicsData/airportInfoChild",
+              path: '/BasicsData/airportInfoChild',
               hidden: true,
               component: () =>
                 import(
-                  "@/views/BasicsData/airportInfo/airportInfoChild/index.vue"
+                  '@/views/BasicsData/airportInfo/airportInfoChild/index.vue'
                 ),
             },
             {
-              path: "/BasicsData/positionSetting",
-              name: "PositionSetting",
+              path: '/BasicsData/positionSetting',
+              name: 'PositionSetting',
               hidden: true,
-              meta: { title: "位置设置" },
+              meta: { title: '位置设置', roles: ['position_setting_page'] },
               component: () =>
                 import(
-                  "@/views/BasicsData/airportInfo/positionSetting/index.vue"
+                  '@/views/BasicsData/airportInfo/positionSetting/index.vue'
                 ),
             },
           ],
@@ -67,64 +84,73 @@ const HomeRoutes = {
       ],
     },
     {
-      path: "/BasicsData/deployNode",
-      name: "DeployNode",
-      meta: { title: "节点信息维护" },
-      component: () => import("@/views/BasicsData/deployNode/index.vue"),
+      path: '/BasicsData/deployNode',
+      name: 'DeployNode',
+      meta: {
+        title: '节点信息维护',
+        roles: ['node_information_maintenance_page'],
+      },
+      component: () => import('@/views/BasicsData/deployNode/index.vue'),
     },
     {
-      path: "/BasicsData/modelMaintenance",
-      name: "ModelMaintenance",
-      redirect: "/BasicsData/modelMaintenance",
-      meta: { title: "机型维护" },
+      path: '/BasicsData/modelMaintenance',
+      name: 'ModelMaintenance',
+      redirect: '/BasicsData/modelMaintenance',
+      meta: { title: '机型维护', roles: ['model_maintenance_page'] },
       component: {
-        render: () => h(resolveComponent("router-view")),
+        render: () => h(resolveComponent('router-view')),
       },
       children: [
         {
-          path: "/BasicsData/modelMaintenance",
-          name: "ModelMaintenance",
+          path: '/BasicsData/modelMaintenance',
+          name: 'ModelMaintenance',
           hidden: true,
           component: () =>
-            import("@/views/BasicsData/modelMaintenance/index.vue"),
+            import('@/views/BasicsData/modelMaintenance/index.vue'),
         },
         {
-          path: "/BasicsData/modelMaintenance/shippingSpace",
-          name: "ShippingSpace",
+          path: '/BasicsData/modelMaintenance/shippingSpace',
+          name: 'ShippingSpace',
           hidden: true,
-          meta: { title: "舱位管理" },
-          component: () => import("@/views/BasicsData/shippingSpace/index.vue"),
+          meta: { title: '舱位管理', roles: ['cabin_editor_page'] },
+          component: () => import('@/views/BasicsData/shippingSpace/index.vue'),
         },
       ],
     },
     {
-      path: "/BasicsData/containerMaintenance",
-      name: "ContainerMaintenance",
-      meta: { title: "容器维护" },
+      path: '/BasicsData/containerMaintenance',
+      name: 'ContainerMaintenance',
+      meta: { title: '容器维护', roles: ['container_maintenance_page'] },
       component: () =>
-        import("@/views/BasicsData/containerMaintenance/index.vue"),
+        import('@/views/BasicsData/containerMaintenance/index.vue'),
     },
     {
-      path: "/BasicsData/cargoInformation",
-      name: "CargoInformation",
-      meta: { title: "货代信息维护" },
-      component: () => import("@/views/BasicsData/cargoInformation/index.vue"),
+      path: '/BasicsData/cargoInformation',
+      name: 'CargoInformation',
+      meta: {
+        title: '货代信息维护',
+        roles: ['freight_forwarding_information_maintenance_page'],
+      },
+      component: () => import('@/views/BasicsData/cargoInformation/index.vue'),
     },
     {
-      path: "/BasicsData/specialCargoMaintenance",
-      name: "SpecialCargoMaintenance",
-      meta: { title: "特殊货物类型维护" },
+      path: '/BasicsData/specialCargoMaintenance',
+      name: 'SpecialCargoMaintenance',
+      meta: {
+        title: '特殊货物类型维护',
+        roles: ['special_cargo_type_maintenance_page'],
+      },
       component: () =>
-        import("@/views/BasicsData/specialCargoMaintenance/index.vue"),
+        import('@/views/BasicsData/specialCargoMaintenance/index.vue'),
     },
     {
-      path: "/BasicsData/equipmentMaintenance",
-      name: "EquipmentMaintenance",
-      meta: { title: "设备维护" },
+      path: '/BasicsData/equipmentMaintenance',
+      name: 'EquipmentMaintenance',
+      meta: { title: '设备维护', roles: ['equipment_maintenance_page'] },
       component: () =>
-        import("@/views/BasicsData/equipmentMaintenance/index.vue"),
+        import('@/views/BasicsData/equipmentMaintenance/index.vue'),
     },
   ],
-};
+}
 
-export default [HomeRoutes];
+export default [HomeRoutes]

src/router/routes/routes-file-two.ts

@@ -6,18 +6,22 @@ const HomeRoutes = {
   name: 'UserManagement',
   redirect: '/userManagement/permission',
   //using el svg icon, the elSvgIcon first when at the same time using elSvgIcon and icon
-  meta: { title: '权限管理', elSvgIcon: 'Avatar' },
+  meta: {
+    title: '权限管理',
+    elSvgIcon: 'Avatar',
+    roles: ['permission_management_menu'],
+  },
   children: [
     {
       path: '/userManagement/permission',
       name: 'Permission',
-      meta: { title: '权限项管理' },
+      meta: { title: '权限项管理', roles: ['permission_item_management_page'] },
       component: () => import('@/views/userManagement/permission/index.vue'),
     },
     {
       path: '/userManagement/role',
       name: 'Role',
-      meta: { title: '角色管理' },
+      meta: { title: '角色管理', roles: ['role_management_page'] },
       redirect: '/userManagement/role',
       component: {
         render: () => h(resolveComponent('router-view')),
@@ -41,7 +45,7 @@ const HomeRoutes = {
     {
       path: '/userManagement/account',
       name: 'Account',
-      meta: { title: '账号管理' },
+      meta: { title: '账号管理', roles: ['account_management_page'] },
       redirect: '/userManagement/account',
       component: {
         render: () => h(resolveComponent('router-view')),
@@ -64,13 +68,13 @@ const HomeRoutes = {
     {
       path: '/userManagement/accountGroup',
       name: 'AccountGroup',
-      meta: { title: '账号组管理' },
+      meta: { title: '账号组管理', roles: ['account_group_management_page'] },
       component: () => import('@/views/userManagement/accountGroup/index.vue'),
     },
     {
       path: '/userManagement/application',
       name: 'Application',
-      meta: { title: '应用管理' },
+      meta: { title: '应用管理', roles: ['application_managemen_page'] },
       component: () => import('@/views/userManagement/application/index.vue'),
     },
   ],

src/views/BasicsData/airlineCompany/index.vue

@@ -6,109 +6,48 @@
           <div class="status flex-wrap">
             <div class="manageTitle">航司信息维护</div>
           </div>
-        </template></Minheader
-      >
+        </template>
+      </Minheader>
       <div class="app-containers">
-        <DataTable
-          :tableHeader="tableCols"
-          :tableData="tableData"
-          :tableBtnGroup="tableBtnGroup"
-          :tableProperty="{ rowKey: 'ID' }"
-          @btnClick="btnClick"
-        />
+        <DataTable :tableHeader="tableCols" :tableData="tableData" :tableBtnGroup="tableBtnGroup" :tableProperty="{ rowKey: 'ID' }" @btnClick="btnClick" />
       </div>
-      <Dialog
-        :flag="flag"
-        :type="type"
-        :msgTitle="msgTitle"
-        :delName="tableForm.fullName"
-        @resetForm="resetForm"
-        @delRest="delRest"
-        @submitForm="submitForm"
-        @delRemove="delRemove"
-      >
+      <Dialog :flag="flag" :type="type" :msgTitle="msgTitle" :delName="tableForm.fullName" @resetForm="resetForm" @delRest="delRest" @submitForm="submitForm" @delRemove="delRemove">
         <div class="diacont">
-          <el-form
-            :model="tableForm"
-            :rules="formRules"
-            ref="airlineCompanyForm"
-          >
+          <el-form :model="tableForm" :rules="formRules" ref="airlineCompanyForm">
             <el-row :gutter="24">
               <el-col>
-                <el-form-item
-                  label="中文名称"
-                  size="default"
-                  prop="fullName"
-                  :rules="formRules.isNotNull"
-                >
-                  <el-input
-                    v-model="tableForm.fullName"
-                    placeholder="请输入中文名称"
-                  />
+                <el-form-item label="中文名称" size="default" prop="fullName" :rules="formRules.isNotNull">
+                  <el-input v-model="tableForm.fullName" placeholder="请输入中文名称" />
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item
-                  label="中文简称"
-                  size="default"
-                  prop="abbreviation"
-                  :rules="formRules.isNotNull"
-                >
-                  <el-input
-                    v-model="tableForm.abbreviation"
-                    placeholder="请输入中文简称"
-                  />
+                <el-form-item label="中文简称" size="default" prop="abbreviation" :rules="formRules.isNotNull">
+                  <el-input v-model="tableForm.abbreviation" placeholder="请输入中文简称" />
                 </el-form-item>
               </el-col>
               <el-col>
                 <el-form-item label="英文全称" size="default">
-                  <el-input
-                    v-model="tableForm.englishFullName"
-                    placeholder="请输入英文全称"
-                  />
+                  <el-input v-model="tableForm.englishFullName" placeholder="请输入英文全称" />
                 </el-form-item>
               </el-col>
               <el-col>
                 <el-form-item label="英文简称" size="default">
-                  <el-input
-                    v-model="tableForm.englishAbbreviation"
-                    placeholder="请输入英文简称"
-                  />
+                  <el-input v-model="tableForm.englishAbbreviation" placeholder="请输入英文简称" />
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item
-                  label="航司二字码"
-                  size="default"
-                  prop="ITATCode"
-                  :rules="formRules.isNotNull"
-                >
-                  <el-input
-                    v-model="tableForm.ITATCode"
-                    placeholder="请输入航司二字码"
-                  />
+                <el-form-item label="航司二字码" size="default" prop="ITATCode" :rules="formRules.isNotNull">
+                  <el-input v-model="tableForm.ITATCode" placeholder="请输入航司二字码" />
                 </el-form-item>
               </el-col>
               <el-col>
-                <el-form-item
-                  label="航司三字码"
-                  size="default"
-                  prop="ICAOCode"
-                  :rules="formRules.isNotNull"
-                >
-                  <el-input
-                    v-model="tableForm.ICAOCode"
-                    placeholder="请输入航司三字码"
-                  />
+                <el-form-item label="航司三字码" size="default" prop="ICAOCode" :rules="formRules.isNotNull">
+                  <el-input v-model="tableForm.ICAOCode" placeholder="请输入航司三字码" />
                 </el-form-item>
               </el-col>
               <el-col>
                 <el-form-item label="备注" size="default">
-                  <el-input
-                    type="textarea"
-                    v-model="tableForm.remarks"
-                    placeholder="请输入备注"
-                  />
+                  <el-input type="textarea" v-model="tableForm.remarks" placeholder="请输入备注" />
                 </el-form-item>
               </el-col>
             </el-row>

src/views/userManagement/account/index.vue

@@ -4,7 +4,7 @@
       <div class="manageTitle">账号管理</div>
       <div class="flex-wrap">
         <Search @clear="clear" @search="search" />
-        <el-button size="default" @click="addApp" plain>新增</el-button>
+        <el-button v-permission="['add_account_button']" size="default" @click="addApp" plain>新增</el-button>
       </div>
     </div>
     <div class="application-content flex">
@@ -58,16 +58,19 @@ const tableBtnGroup = <any>[
     name: "编辑",
     className: "editBtn",
     param: "edit",
+    is: "account_editing_button",
   },
   {
     name: "查看权限",
     className: "editBtn",
     param: "auth",
+    is: "account_authorization_button",
   },
   {
     name: "删除",
     className: "delBtn",
     param: "del",
+    is: "account_deletion_button",
   },
 ];
 const flag = ref(false);

src/views/userManagement/accountGroup/index.vue

@@ -4,7 +4,7 @@
       <div class="manageTitle">账号组管理</div>
       <div class="flex-wrap">
         <Search @clear="clear" @search="search" />
-        <el-button size="default" @click="addApp" plain>新增</el-button>
+        <el-button v-permission="['add_account_group_button']" size="default" @click="addApp" plain>新增</el-button>
       </div>
     </div>
     <div class="application-content">
@@ -41,11 +41,13 @@ const tableBtnGroup = [
     name: "编辑",
     className: "editBtn",
     param: "edit",
+    is: "account_group_editing_button",
   },
   {
     name: "删除",
     className: "delBtn",
     param: "del",
+    is: "account_group_deletion_button",
   },
 ];
 const flag = ref(false);

src/views/userManagement/application/index.vue

@@ -2,82 +2,29 @@
   <div class="application scroll-y">
     <div class="application-head flex">
       <div class="manageTitle">应用管理</div>
-      <div>
+      <div v-permission="['add_application_button']">
         <el-button size="default" @click="addApp" plain>新增</el-button>
       </div>
     </div>
     <div class="application-content">
-      <Table
-        :tableHeader="tableHeader"
-        @btnClick="btnClick"
-        :tableBtnGroup="tableBtnGroup"
-        :tableData="tableData"
-      />
+      <Table :tableHeader="tableHeader" @btnClick="btnClick" :tableBtnGroup="tableBtnGroup" :tableData="tableData" />
     </div>
     <!--删除弹框-->
-    <Dialog
-      :flag="flag"
-      msgTitle="删除应用"
-      type="del"
-      :delName="title"
-      @delRest="delRest"
-      @delRemove="remove"
-    />
+    <Dialog :flag="flag" msgTitle="删除应用" type="del" :delName="title" @delRest="delRest" @delRemove="remove" />
     <!--新增/编辑-->
-    <Dialog
-      :flag="editDialogVisible"
-      :msgTitle="editDialogTitle"
-      @submitForm="submitForm(ruleFormRef)"
-      @resetForm="resetForm(ruleFormRef)"
-      :show-flag="true"
-    >
-      <el-form
-        ref="ruleFormRef"
-        :model="ruleForm"
-        label-width="110px"
-        class="demo-ruleForm"
-      >
-        <el-form-item
-          label="应用名称"
-          prop="app_name"
-          :rules="formRules.isNotNull"
-        >
-          <el-input
-            v-model="ruleForm.app_name"
-            size="default"
-            placeholder="请输入应用名称"
-          />
+    <Dialog :flag="editDialogVisible" :msgTitle="editDialogTitle" @submitForm="submitForm(ruleFormRef)" @resetForm="resetForm(ruleFormRef)" :show-flag="true">
+      <el-form ref="ruleFormRef" :model="ruleForm" label-width="110px" class="demo-ruleForm">
+        <el-form-item label="应用名称" prop="app_name" :rules="formRules.isNotNull">
+          <el-input v-model="ruleForm.app_name" size="default" placeholder="请输入应用名称" />
         </el-form-item>
-        <el-form-item
-          label="应用链接账号"
-          prop="app_show_id"
-          :rules="formRules.isNotNull"
-        >
-          <el-input
-            v-model="ruleForm.app_show_id"
-            size="default"
-            placeholder="请输入应用链接账号"
-          />
+        <el-form-item label="应用链接账号" prop="app_show_id" :rules="formRules.isNotNull">
+          <el-input v-model="ruleForm.app_show_id" size="default" placeholder="请输入应用链接账号" />
         </el-form-item>
-        <el-form-item
-          label="应用链接密钥"
-          prop="app_show_id"
-          :rules="formRules.isNotNull"
-        >
-          <el-input
-            v-model="ruleForm.app_show_secret"
-            size="default"
-            placeholder="请输入应用链接密钥"
-          />
+        <el-form-item label="应用链接密钥" prop="app_show_id" :rules="formRules.isNotNull">
+          <el-input v-model="ruleForm.app_show_secret" size="default" placeholder="请输入应用链接密钥" />
         </el-form-item>
         <el-form-item label="应用描述" prop="app_comment">
-          <el-input
-            v-model="ruleForm.app_comment"
-            size="default"
-            type="textarea"
-            :rows="3"
-            placeholder="请输入应用描述"
-          />
+          <el-input v-model="ruleForm.app_comment" size="default" type="textarea" :rows="3" placeholder="请输入应用描述" />
         </el-form-item>
       </el-form>
     </Dialog>
@@ -99,11 +46,13 @@ const tableBtnGroup = [
     name: "编辑",
     className: "editBtn",
     param: "edit",
+    is: "apply_edit_button",
   },
   {
     name: "删除",
     className: "delBtn",
     param: "del",
+    is: "apply_delete_button",
   },
 ];
 const flag = ref(false);

src/views/userManagement/permission/index.vue

@@ -17,7 +17,7 @@
         <div class="grid-contentBottom">
           <div class="capTitle rowBS">
             <div class="manageTitle">下级权限</div>
-            <div class="btn-create">
+            <div v-permission="['button_permission_item_add_button']" class="btn-create">
               <el-button size="default" plain class="btn-white" @click="addAuth">新增</el-button>
             </div>
           </div>
@@ -35,7 +35,7 @@
                           </div>
                           <div v-if="data.auth_type > 0" class="icon">
                             <el-tooltip effect="dark" :content="`修改${data.auth_name}`" placement="bottom">
-                              <span class="cap cap-edit" @click="renderEdit(data)"></span>
+                              <span v-permission="['permission_item_editing_button']" class="cap cap-edit" @click="renderEdit(data)"></span>
                             </el-tooltip>
                           </div>
                         </div>
@@ -43,13 +43,13 @@
                           <div class="details-msg">
                             状态：<span :class="data.auth_status ? 'success' : 'error'">{{ data.auth_status ? "启用" : "禁用" }}</span>
                           </div>
-                          <div class="details-info">
+                          <div v-permission="['permission_item_status_switch_button']" class="details-info">
                             <el-switch v-model="data.auth_status" active-color="#AC014D" @change="renderChange(data)"> </el-switch>
                           </div>
                         </div>
                       </div>
                     </div>
-                    <div>
+                    <div v-permission="['permission_item_deletion_button']">
                       <div v-if="data.auth_type !== 0" class="info-close" @click.stop="onNodeClick(data)">
                         <CloseBold class="icon" :class="data.auth_type === 1 ? 'close1' : data.auth_type > 2 ? 'close2' : ''" />
                       </div>
@@ -141,6 +141,7 @@ const ruleForm = ref<any>({
   app_id: "",
   auth_status: true,
   auth_id: "",
+  up_auth_id: "",
 });
 const optionsType = ref([
   {
@@ -178,9 +179,9 @@ onBeforeMount(() => {
 
 //权限树点击
 const handleNodeClick = (data) => {
+  currData.value = _.cloneDeep(data);
   if (data.children) {
     const newData = _.cloneDeep(data);
-    currData.value = newData;
     childrenData.value = newData.children;
   } else {
     childrenData.value = [];
@@ -196,6 +197,19 @@ const renderChange = (data) => {
   changeAuth(data);
 };
 
+// 重置表单
+const resetFormData = (data) => {
+  ruleForm.value.app_id = data.app_id ?? "";
+  ruleForm.value.app_name = data.app_name ?? "";
+  ruleForm.value.auth_comment = data.auth_comment ?? "";
+  ruleForm.value.auth_id = data.auth_id ?? "";
+  ruleForm.value.auth_ident = data.auth_ident ?? "";
+  ruleForm.value.auth_name = data.auth_name ?? "";
+  ruleForm.value.auth_status = data.auth_status ?? "";
+  ruleForm.value.auth_type = data.auth_type ?? "";
+  ruleForm.value.up_auth_id = data.up_auth_id ?? "";
+};
+
 //修改
 const renderEdit = (data) => {
   optionsApp.value = [];
@@ -203,7 +217,8 @@ const renderEdit = (data) => {
   editDialogVisible.value = true;
   editDialogTitle.value = "编辑下级权限";
   editType.value = "edit";
-  ruleForm.value = _.cloneDeep(data);
+  // ruleForm.value = _.cloneDeep(data);
+  resetFormData(data);
   optionsApp.value.push({
     label: data.app_name,
     value: data.app_id,
@@ -239,6 +254,9 @@ const addAuth = () => {
     ElMessage.error("请选择权限后再操作");
     return false;
   }
+  resetFormData({});
+  ruleForm.value.auth_type = currData.value.auth_type;
+  ruleForm.value.auth_id = currData.value.auth_id;
   optionsApp.value = [];
   optionsParent.value = [];
   editDialogVisible.value = true;
@@ -263,6 +281,7 @@ const changeAuth = async (obj?, type?) => {
   if (code == 0) {
     ElMessage.success(message);
     getAuthTree();
+    childrenData.value = [];
   } else {
     ElMessage.error(message);
   }

src/views/userManagement/role/index.vue

@@ -4,7 +4,9 @@
       <div class="manageTitle">角色管理</div>
       <div class="flex-wrap">
         <Search @clear="clear" @search="search" />
-        <el-button size="default" @click="addApp" plain>新增</el-button>
+        <div v-permission="['new_role_button']">
+          <el-button size="default" @click="addApp" plain>新增</el-button>
+        </div>
       </div>
     </div>
     <div class="application-content">
@@ -48,16 +50,19 @@ const tableBtnGroup = [
     name: "编辑",
     className: "editBtn",
     param: "edit",
+    is: "role_editing_button",
   },
   {
     name: "查看权限",
     className: "editBtn",
     param: "auth",
+    is: "role_authorization_button",
   },
   {
     name: "删除",
     className: "delBtn",
     param: "del",
+    is: "role_deletion_button",
   },
 ];
 const flag = ref(false);