diff --git a/.beagle.yml b/.beagle.yml
index a357db629bb4bd224d14bd2df8387f882668c10a..d54834be26a8b5c02233da8b778d01db8eeb9581 100644
--- a/.beagle.yml
+++ b/.beagle.yml
@@ -62,7 +62,7 @@ steps: # 定义流水线执行步骤，这些步骤将顺序执行
       base: registry.cn-qingdao.aliyuncs.com/wod/nginx:1.19.5 # 基础镜像,根据项目需求进行使用，如果第三方登录改成ui-base
       dockerfile: .beagle/dockerfile
       repo: wod/apaas-system-ui # 生成镜像的 分组/名称
-      version: "5.3.0" # 版本号
+      version: "5.0.7" # 版本号
       channel: alpha # 后缀 example: alpha test fix-alpha fix等
       args: "TARGETOS=linux,TARGETARCH=amd64" # 不同架构的构建参数
       registry: registry.cn-qingdao.aliyuncs.com # 私有仓库地址
@@ -77,7 +77,7 @@ steps: # 定义流水线执行步骤，这些步骤将顺序执行
       namespace: apaas-v5
       deployment: apaas-manage-ui
       container: apaas-manage-ui
-      image: registry.cn-qingdao.aliyuncs.com/wod/apaas-system-ui:5.3.0-alpha
+      image: registry.cn-qingdao.aliyuncs.com/wod/apaas-system-ui:5.0.7-alpha
     environment:
       KUBERNETES_SERVER:
         from_secret: KUBERNETES_SERVER
@@ -93,7 +93,7 @@ steps: # 定义流水线执行步骤，这些步骤将顺序执行
       base: registry.cn-qingdao.aliyuncs.com/wod/nginx:1.19.5-arm64
       dockerfile: .beagle/dockerfile
       repo: wod/apaas-system-ui
-      version: "5.3.0"
+      version: "5.0.7"
       channel: alpha-arm64
       args: "TARGETOS=linux,TARGETARCH=arm64"
       registry: registry.cn-qingdao.aliyuncs.com
diff --git a/src/assets/css/index.css b/src/assets/css/index.css
index cbc2e1c0eed1220c9b8612f7af5aee22eeac2adf..def943dcb8ef1054064ffdf506ab879b7b76677b 100644
--- a/src/assets/css/index.css
+++ b/src/assets/css/index.css
@@ -9,7 +9,7 @@
 }
 
 /* 返回按钮颜色 */
-.from_return>.el-button--primary {
+.from_return > .el-button--primary {
   background-color: #edf0ff !important;
   border-color: #edf0ff !important;
   color: #264dd9 !important;
@@ -71,12 +71,15 @@
   cursor: pointer;
 }
 
-.space_bet {}
+.space_bet {
+}
 
 /* reset */
-html {}
+html {
+}
 
-html,body {
+html,
+body {
   margin: 0;
   font-family: Microsoft YaHei, sans-serif;
   /* font-size: 17px; */
@@ -101,16 +104,16 @@ h5 {
   font-weight: normal;
 }
 
-h1{
+h1 {
   font-size: 32px;
 }
-h2{
+h2 {
   font-size: 24px;
 }
-h3{
+h3 {
   font-size: 18.7px;
 }
-h4{
+h4 {
   font-size: 16px;
 }
 
@@ -154,7 +157,7 @@ div {
   align-items: flex-start;
 }
 
-.ss_card>.sc_left_container {
+.ss_card > .sc_left_container {
   width: 6rem;
   height: 6rem;
   flex-shrink: 0;
@@ -163,19 +166,19 @@ div {
   font-size: 0;
 }
 
-.ss_card>.sc_right_container {
+.ss_card > .sc_right_container {
   width: calc(100% - 7rem);
   flex-grow: 1;
   margin-left: 1.2rem;
 }
 
-.ss_card>.sc_right_container>.sc_title {
+.ss_card > .sc_right_container > .sc_title {
   font-size: 1.6rem;
   font-weight: bold;
   line-height: 2.6rem;
 }
 
-.ss_card>.sc_right_container>.sc_info {
+.ss_card > .sc_right_container > .sc_info {
   display: flex;
   justify-content: space-between;
 }
@@ -202,13 +205,13 @@ div {
   position: relative;
 }
 
-.from_return>.el-button--primary {
+.from_return > .el-button--primary {
   position: absolute;
   top: 15px;
   left: 20px;
 }
 
-.from_return>span {
+.from_return > span {
   color: #1a2236;
   font-size: 16px;
 }
@@ -621,7 +624,7 @@ border-radius:8px;
   background-color: #fff;
 }
 
-.el-radio__input.is-checked+.el-radio__label {
+.el-radio__input.is-checked + .el-radio__label {
   color: #1a2236;
   font-weight: 700;
 }
@@ -674,18 +677,18 @@ border-radius:8px;
 }
 
 /* common */
-.apass_breadcrumb>.el-breadcrumb {
+.apass_breadcrumb > .el-breadcrumb {
   padding: 10px 0;
 }
 
-.apass_breadcrumb>.el-breadcrumb .el-breadcrumb__inner {
+.apass_breadcrumb > .el-breadcrumb .el-breadcrumb__inner {
   font-size: 14px;
   font-weight: 400;
   color: #898d9e;
   line-height: 23px;
 }
 
-.apass_breadcrumb>.el-breadcrumb .el-breadcrumb__item:last-child .el-breadcrumb__inner {
+.apass_breadcrumb > .el-breadcrumb .el-breadcrumb__item:last-child .el-breadcrumb__inner {
   color: #242c43;
   font-weight: normal;
 }
@@ -758,8 +761,7 @@ border-radius:8px;
   border-color: #ebeef5;
 }
 
-
-.apass_table .el-table th>.cell {
+.apass_table .el-table th > .cell {
   color: #1a2236;
 }
 
@@ -838,7 +840,7 @@ border-radius:8px;
   border-color: #515fe7;
 }
 
-.apass_checkbox .el-checkbox__input.is-checked+.el-checkbox__label {
+.apass_checkbox .el-checkbox__input.is-checked + .el-checkbox__label {
   color: #58617a;
 }
 
@@ -921,7 +923,7 @@ border-radius:8px;
   margin-top: 50px;
 }
 
-.apaas_detail_container .detail_action .el-button+.el-button {
+.apaas_detail_container .detail_action .el-button + .el-button {
   margin-left: 30px;
 }
 
@@ -992,7 +994,7 @@ border-radius:8px;
   width: 124px;
 }
 
-.apaas_steps .apaas_step .apaas_step_action .el-button+.el-button {
+.apaas_steps .apaas_step .apaas_step_action .el-button + .el-button {
   margin-left: 20px;
 }
 
@@ -1004,7 +1006,7 @@ border-radius:8px;
   flex-grow: 1;
   font-size: 0;
 }
-.filter_list>.filter_item {
+.filter_list > .filter_item {
   display: flex;
   align-items: center;
   margin: 0 34px 16px 0;
@@ -1015,7 +1017,7 @@ border-radius:8px;
   vertical-align: middle;
 } */
 
-.filter_list>.filter_item>.filter_title {
+.filter_list > .filter_item > .filter_title {
   text-align: right;
   font-size: 14px;
   color: #242c43;
@@ -1045,14 +1047,14 @@ border-radius:8px;
   text-align: right;
 }
 
-.filter_action>.el-button {
+.filter_action > .el-button {
   /* min-width: 90px; */
   height: 36px;
   margin-top: 16px;
   padding: 12px 17px;
 }
 
-.filter_action>.el-button+.el-button {
+.filter_action > .el-button + .el-button {
   margin-left: 10px;
 }
 
@@ -1091,7 +1093,7 @@ border-radius:8px;
   margin-top: 5px;
 }
 
-.meassage_detail_dialog .detail_item .full_content>.apaas_scroll {
+.meassage_detail_dialog .detail_item .full_content > .apaas_scroll {
   height: 176px;
   overflow: auto;
 }
@@ -1266,11 +1268,11 @@ border-radius:8px;
 .el-date-table td.in-range div:hover,
 .el-date-table.is-week-mode .el-date-table__row.current div,
 .el-date-table.is-week-mode .el-date-table__row:hover div {
-  background-color: #eff2fa!important;
+  background-color: #eff2fa !important;
 }
-.el-date-table td.end-date .el-date-table-cell__text, 
+.el-date-table td.end-date .el-date-table-cell__text,
 .el-date-table td.start-date .el-date-table-cell__text {
-  background-color: #3759be!important;
+  background-color: #3759be !important;
 }
 .el-date-table td.end-date span,
 .el-date-table td.start-date span {
@@ -1450,8 +1452,6 @@ border-radius:8px;
   padding-right: 10px;
 }
 
-
-
 .page_container {
   width: 100%;
   padding: 0 24px;
@@ -1463,11 +1463,10 @@ border-radius:8px;
   align-items: stretch;
 }
 .page_content {
-    background-color: #fff;
-    height: calc(100% - 46px - 20px);
-    box-shadow: 0px 1px 4px 0px 
-		rgba(0, 7, 101, 0.15);
-	  border-radius: 6px;
+  background-color: #fff;
+  height: calc(100% - 46px - 20px);
+  box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+  border-radius: 6px;
 }
 
 .flex_row {
@@ -1483,19 +1482,16 @@ border-radius:8px;
   overflow: hidden;
 }
 .flex_right {
-  
   height: calc(100% - 16px);
   flex: 1;
-  
+
   overflow: hidden;
 }
 
 .bgc_white {
-  box-shadow: 0px 1px 4px 0px 
-		rgba(0, 7, 101, 0.15);
-	border-radius: 6px;
+  box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+  border-radius: 6px;
   background-color: #fff;
- 
 }
 
 .tree::-webkit-scrollbar {
@@ -1519,7 +1515,7 @@ border-radius:8px;
 }
 .header_info {
   font-size: 14px;
-	color: #404a62;
+  color: #404a62;
   padding-left: 20px;
 }
 .fr {
@@ -1533,8 +1529,8 @@ border-radius:8px;
   color: #404a62;
 }
 .icon_eye {
-  font-size: 12px; 
-  color: #a9b1c7; 
+  font-size: 12px;
+  color: #a9b1c7;
   margin-right: 8px;
   vertical-align: baseline;
   cursor: pointer;
@@ -1554,7 +1550,7 @@ border-radius:8px;
 .warning_info {
   background-color: #f7f7f9;
   font-size: 14px;
-	color: #404a62;
+  color: #404a62;
   padding: 5px;
   text-align: left;
   margin: 20px 0;
@@ -1563,6 +1559,7 @@ border-radius:8px;
   color: #d75138;
 }
 
+<<<<<<< HEAD
 .register_btn {
   background-color: #eff2fa;
   border-radius: 4px;
@@ -1581,3 +1578,15 @@ border-radius:8px;
   padding: 20px;
 }
 
+=======
+.tip-image {
+  position: absolute;
+  right: -24px;
+  bottom: 9px;
+  width: 16px;
+  height: 16px;
+  margin-left: 8px;
+  background-image: url("../imgs/ic_tips.png");
+  background-size: contain;
+}
+>>>>>>> a152210490b057d5d9be08d415be67274b954aaf
diff --git a/src/bg-ui/bg-form-gap.vue b/src/bg-ui/bg-form-gap.vue
new file mode 100644
index 0000000000000000000000000000000000000000..1379940732a191c58dffc9a052d6cdc6a54c93ab
--- /dev/null
+++ b/src/bg-ui/bg-form-gap.vue
@@ -0,0 +1,43 @@
+<template>
+  <div class="gap-title">
+    <span>{{ title }}</span>
+  </div>
+</template>
+
+<script setup>
+const props = defineProps({
+  title: {
+    type: [Number, String],
+    default: "",
+  },
+});
+</script>
+
+<style scoped>
+.gap-title {
+  font-size: 18px;
+  font-weight: 600;
+  color: #1a1a1a;
+  display: flex;
+  align-items: center;
+  margin-bottom: 20px;
+}
+.gap-title span {
+  margin-right: 8px;
+}
+.gap-title::before {
+  content: "";
+  display: inline-block;
+  margin-right: 8px;
+  width: 4px;
+  height: 14px;
+  background-color: #3759be;
+  border-radius: 2px;
+}
+/* .gap-title::after {
+  content: "";
+  display: inline-block;
+  flex: 1;
+  border-top: 1px dashed #dadee7;
+} */
+</style>
diff --git a/src/bg-ui/index.js b/src/bg-ui/index.js
index cdd71637986a1a20aeca3318c09acc9ed4de3dc9..1374c3573eacf8a4e885219b22011ca3ee9c8723 100644
--- a/src/bg-ui/index.js
+++ b/src/bg-ui/index.js
@@ -1,43 +1,44 @@
 /**
  * 全局组件
  */
- import BgIcon from './bg-icon.vue' 
- import BgNav from './bg-nav.vue'
- import BgList from './bg-list.vue'
- import BgDetail from './bg-detail.vue'
- import BgFiltrate from './bg-filtrate.vue'
- import BgTable from './bg-table.vue'
- import BgTablePro from './bg-table-pro.vue'
- import BgTableBtn from './bg-table-btn.vue'
- import BgTabs from './bg-tabs.vue'
- import BgTab from './bg-tab.vue'
- import BgLayoutCard from './bg-layout-card.vue'
- import BgCard from './bg-card.vue'
- import BgInfo from './bg-info.vue'
- import BgBtns from './bg-btns.vue'
- import BgUpload from './bg-upload.vue'
- import BgUploadImage from './bg-upload-image.vue'
- import BgTags from './bg-tags.vue'
- import BgSwitch from './bg-switch.vue'
- import BgRichText from './bg-rich-text.vue'
- import BgCodeEditor from './bg-code-editor.vue'
- import BgFilter from './bg-filter.vue'
- import BgSort from './bg-sort.vue'
- import BgFilterDate from './bg-filter-date.vue'
- import bgUserUploadImage from './bg-user-upload-image.vue'
- import bgDetailTable from './bg-detail-table.vue'
- import bgDetailTable2 from './bg-detail-table2.vue'
- import debounce from './debounce'
- import BgPagination from './bg-pagination.vue'
- import BgInnerTabs from './bg-inner-tabs.vue'
- import BgFilterGroup from './bg-filter-group.vue'
- import BgSwitchEle from './bg-switch-ele.vue'
- import BgTableBtns from './bg-table-btns.vue'
- import BgTableBtns2 from './bg-table-btns2.vue'
- import BgPermission from './bg-permission.vue'
- 
+import BgIcon from "./bg-icon.vue";
+import BgNav from "./bg-nav.vue";
+import BgList from "./bg-list.vue";
+import BgDetail from "./bg-detail.vue";
+import BgFiltrate from "./bg-filtrate.vue";
+import BgTable from "./bg-table.vue";
+import BgTablePro from "./bg-table-pro.vue";
+import BgTableBtn from "./bg-table-btn.vue";
+import BgTabs from "./bg-tabs.vue";
+import BgTab from "./bg-tab.vue";
+import BgLayoutCard from "./bg-layout-card.vue";
+import BgCard from "./bg-card.vue";
+import BgInfo from "./bg-info.vue";
+import BgBtns from "./bg-btns.vue";
+import BgUpload from "./bg-upload.vue";
+import BgUploadImage from "./bg-upload-image.vue";
+import BgTags from "./bg-tags.vue";
+import BgSwitch from "./bg-switch.vue";
+import BgRichText from "./bg-rich-text.vue";
+import BgCodeEditor from "./bg-code-editor.vue";
+import BgFilter from "./bg-filter.vue";
+import BgSort from "./bg-sort.vue";
+import BgFilterDate from "./bg-filter-date.vue";
+import bgUserUploadImage from "./bg-user-upload-image.vue";
+import bgDetailTable from "./bg-detail-table.vue";
+import bgDetailTable2 from "./bg-detail-table2.vue";
+import debounce from "./debounce";
+import BgPagination from "./bg-pagination.vue";
+import BgInnerTabs from "./bg-inner-tabs.vue";
+import BgFilterGroup from "./bg-filter-group.vue";
+import BgSwitchEle from "./bg-switch-ele.vue";
+import BgTableBtns from "./bg-table-btns.vue";
+import BgTableBtns2 from "./bg-table-btns2.vue";
+import BgPermission from "./bg-permission.vue";
+import BgFormGap from "./bg-form-gap.vue";
+
 const components = {
-  BgIcon,//字体图标
+  BgIcon, //字体图标
   BgNav, // 左侧导航
   BgList, // 列表页布局
   BgDetail, // 详情页布局
@@ -56,21 +57,22 @@ const components = {
   BgTags, // 标签
   BgSwitch, // 开关
   BgRichText, // 富文本
-  BgCodeEditor,//代码输入
+  BgCodeEditor, //代码输入
   BgFilter, // 首页筛选
   BgSort, // 首页排序
   BgFilterDate,
   bgUserUploadImage,
-  bgDetailTable,//详情展示组件1
-  bgDetailTable2,//详情展示组件2
-  debounce,//防抖组件
-  BgPagination,// 分页组件
-  BgInnerTabs,//内部tab
-  BgFilterGroup,//高级搜索
-  BgSwitchEle,// 基于element-plus封装的switch
-  BgTableBtns,// 表格按钮组
-  BgPermission,// 菜单选择 
+  bgDetailTable, //详情展示组件1
+  bgDetailTable2, //详情展示组件2
+  debounce, //防抖组件
+  BgPagination, // 分页组件
+  BgInnerTabs, //内部tab
+  BgFilterGroup, //高级搜索
+  BgSwitchEle, // 基于element-plus封装的switch
+  BgTableBtns, // 表格按钮组
+  BgPermission, // 菜单选择
   BgTableBtns2, // 表格按钮组-新
+  BgFormGap,
 };
 
 const install = (Vue) => {
diff --git a/src/main.js b/src/main.js
index 51d01fe6f4fe0d31af36276f5507e3dbaf982a56..3356de67b91b6b5dee8d90952e936c25f06c07ef 100644
--- a/src/main.js
+++ b/src/main.js
@@ -1,115 +1,109 @@
-import { createApp } from 'vue'
+import { createApp } from "vue";
 
-import ElementPlus from 'element-plus'
-import 'element-plus/dist/index.css'
-import locale from 'element-plus/lib/locale/lang/zh-cn'
+import ElementPlus from "element-plus";
+import "element-plus/dist/index.css";
+import locale from "element-plus/lib/locale/lang/zh-cn";
 
-import * as ElementPlusIconsVue from '@element-plus/icons-vue'
+import * as ElementPlusIconsVue from "@element-plus/icons-vue";
 
 import bgui from "@/bg-ui";
 import "@/bg-ui/index.scss";
 
-import msgSdk from './msg-sdk/index.js';
+import msgSdk from "./msg-sdk/index.js";
 
-import App from './App.vue'
+import App from "./App.vue";
 
-import router from './router'
-import {generateRoutes} from './router/index.js'
+import router from "./router";
+import { generateRoutes } from "./router/index.js";
 
+import "../src/assets/css/font.css";
+import "../src/assets/css/index.css";
+import "../src/assets/item.css";
 
-import '../src/assets/css/font.css'
-import '../src/assets/css/index.css'
-import '../src/assets/item.css'
+import store from "@/store";
 
-import store from '@/store';
+import i18n from "./i18n/i18n.js";
 
-import i18n from './i18n/i18n.js'
+import axios from "./request/http.js";
 
-import axios from './request/http.js'
-
-const createVue = createApp(App)
+const createVue = createApp(App);
 createVue.use(ElementPlus, { locale });
 
 function getMsgAppid() {
-  axios.get(`/apaas/system/v5/message/account`).then(res => {
+  axios.get(`/apaas/system/v5/message/account`).then((res) => {
     if (res.data.code == 200) {
       createVue.use(msgSdk, {
-        requestUrl: 'https://msg.wodcloud.com', // 请求地址
+        requestUrl: "https://msg.wodcloud.com", // 请求地址
         appID: decodeURIComponent(escape(window.atob(res.data.data.app_id))), // 应用id
         secretKey: decodeURIComponent(escape(window.atob(res.data.data.secret_key))), // 应用密钥
-        userId: '',
-        userType: '',
-        roleId: '',
-        organization: '',
-      })
+        userId: "",
+        userType: "",
+        roleId: "",
+        organization: "",
+      });
     }
-  })
+  });
 }
 
 // getMsgAppid()
 
 for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
-  createVue.component(key, component)
+  createVue.component(key, component);
 }
 
-createVue.config.globalProperties.$axios = axios
+createVue.config.globalProperties.$axios = axios;
 
-import menu from './router/function.js'
+import menu from "./router/function.js";
 
 //获取用户信息
 function getUser() {
-    return axios.get(`/apaas/system/v5/user/getUserInfo`)
+  return axios.get(`/apaas/system/v5/user/getUserInfo`);
 }
 
 //获取用户菜单信息
 function getMenu(search) {
-  return axios.get(`/apaas/system/v5/menu/user/tree?search=${search}`)
+  return axios.get(`/apaas/system/v5/menu/user/tree?search=${search}`);
 }
 
 //处理菜单成为对象
-function getMenuObj(menu,parentRowPath,menuObj){
-  menu.forEach((e,idx) => {
-    e.rowPath = parentRowPath + '.' + idx
-    menuObj[e.path] = e
-    if(e.children&&e.children.length){
-      getMenuObj(e.children,e.rowPath,menuObj)
+function getMenuObj(menu, parentRowPath, menuObj) {
+  menu.forEach((e, idx) => {
+    e.rowPath = parentRowPath + "." + idx;
+    menuObj[e.path] = e;
+    if (e.children && e.children.length) {
+      getMenuObj(e.children, e.rowPath, menuObj);
     }
   });
 }
 
-
-Promise.all([getUser(),getMenu('dadb2d3f-e263-48d1-9389-42acb9ea49f8')]).then(res => {
-    console.log(res);
-    if (res[0].data.code == 200&&res[1].data.code == 200) {
+Promise.all([getUser(), getMenu("dadb2d3f-e263-48d1-9389-42acb9ea49f8")])
+  .then((res) => {
+    if (res[0].data.code == 200 && res[1].data.code == 200) {
       //已登录则记录菜单和用户信息
-      let data = res[1].data.data&&res[1].data.data[0].children||[]
-      store.commit('setUserInfo', res[0].data.data)
-  
+      let data = (res[1].data.data && res[1].data.data[0].children) || [];
+      store.commit("setUserInfo", res[0].data.data);
+
       // if (res[0].data.data.userType == 1) {//超管
-        store.commit('setMenu', data)
-        menu.menuToRouter(data)
-        console.log(menu);
-        store.commit('setRoute',data)
-
-        //存储菜单对象信息
-        let menuObj = {}
-        getMenuObj(data,'',menuObj)
-        store.commit('setMenuObj',menuObj)
-        console.log(menuObj);
-        
+      store.commit("setMenu", data);
+      console.log("data", data);
+      menu.menuToRouter(data);
+      store.commit("setRoute", data);
+
+      //存储菜单对象信息
+      let menuObj = {};
+      getMenuObj(data, "", menuObj);
+      store.commit("setMenuObj", menuObj);
+
       // }
     }
-    generateRoutes()
-    
-    createVue.use(ElementPlus).use(store).use(router).use(i18n).use(bgui)
-    createVue.mount('#app')
-  }).catch(() => {
-    createVue.use(ElementPlus).use(store).use(router).use(i18n).use(bgui)
-    createVue.mount('#app')
+    generateRoutes();
+
+    createVue.use(ElementPlus).use(store).use(router).use(i18n).use(bgui);
+    createVue.mount("#app");
   })
+  .catch(() => {
+    createVue.use(ElementPlus).use(store).use(router).use(i18n).use(bgui);
+    createVue.mount("#app");
+  });
 
 //后期加入权限处理，参考msg/ui
-
-
-
-
diff --git a/src/page/main/config/accessRule/index.vue b/src/page/main/config/accessRule/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..921a85a8d6813d499a518334df2307f55eb3f6bb
--- /dev/null
+++ b/src/page/main/config/accessRule/index.vue
@@ -0,0 +1,490 @@
+<template>
+  <div class="page_container">
+    <bg-breadcrumb></bg-breadcrumb>
+    <div class="main_container">
+      <bg-filter-group @search="changeSearch" v-model="filter.keyword" placeholder="请输入规则名称或规则">
+        <template v-slot:left_action>
+          <div class="apaas_button">
+            <el-button type="primary" @click="addRule">
+              <bg-icon style="font-size: 12px; color: #fff; margin-right: 8px" icon="#bg-ic-add"></bg-icon>
+              新增
+            </el-button>
+            <el-button @click="deleteBatch"> 批量删除 </el-button>
+            <span class="sleceted_tip">已选<span class="num">3</span>项</span>
+            <span class="clean" @click="cleanSelected">清空</span>
+          </div>
+        </template>
+
+        <template v-slot:filter_group>
+          <div class="left-filter filter_list">
+            <div class="filter_item">
+              <span class="filter_title">修改时间</span>
+              <el-date-picker
+                v-model="filter.time"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                value-format="YYYY-MM-DD"
+                style="width: 300px" />
+            </div>
+          </div>
+          <div class="right-action apaas_button">
+            <el-button type="primary" @click="filterAction"> 查询 </el-button>
+            <el-button type="default" @click="filterClear"> 重置 </el-button>
+          </div>
+        </template>
+      </bg-filter-group>
+      <div class="table_container">
+        <bg-table ref="bgTable" :headers="headers" :rows="tableRows" :stripe="true" select>
+          <template v-slot:ability_name="{ row }">
+            <span @click="goDetail(row)" class="can_click_text">
+              {{ row.ability_name }}
+              <span v-if="row.include_mock_service" class="mock_tip"> mock </span>
+            </span>
+          </template>
+          <template v-slot:ability_state="{ row }">
+            <span class="circle" :class="'bgc_' + row.ability_state"></span>
+            {{ ["待上架", "已上架", "已下架", "上架中", "下架中"][row.ability_state] }}
+          </template>
+          <template v-slot:start_use="{ row }">
+            <el-switch></el-switch>
+          </template>
+          <template v-slot:action="{ row }">
+            <bg-table-btns2 :limit="3" :key="row.id">
+              <bg-table-btn @click="edit(row)">编辑</bg-table-btn>
+              <bg-table-btn @click="deleteCurrent(row)">删除</bg-table-btn>
+            </bg-table-btns2>
+          </template>
+        </bg-table>
+        <bg-pagination
+          :page="filter.page"
+          :size="filter.size"
+          :total="tableTotal"
+          @change-page="changePage"
+          @change-size="changeSize">
+        </bg-pagination>
+      </div>
+    </div>
+
+    <el-dialog class="dialog_box_detail" title="用户详情" v-model="dialogDetail" width="1062px">
+      <div class="content_detail">
+        <div class="form_filter">
+          <div class="left">
+            <el-select placeholder="全部类型" style="width: 200px; margin-left: 16px">
+              <el-option label="选共享1" value="1"> </el-option>
+              <el-option label="选共享2" value="2"> </el-option>
+            </el-select>
+            <el-select placeholder="请选择所属组织" style="width: 200px; margin-left: 16px">
+              <el-option label="选共享1" value="1"> </el-option>
+              <el-option label="选共享2" value="2"> </el-option>
+            </el-select>
+            <el-input placeholder="请输入关键词" style="width: 200px; margin-left: 16px" :prefix-icon="Search" />
+          </div>
+          <div class="right">
+            <el-button type="primary" @click="cancelCache">查询</el-button>
+            <el-button type="default" @click="confirmCache">重置</el-button>
+          </div>
+        </div>
+
+        <div class="table_content">
+          <bg-table ref="bgTable" :headers="detailHeaders" :rows="tableRows" height="430" :stripe="true">
+            <template v-slot:ability_name="{ row }">
+              <span @click="goDetail(row)" class="can_click_text">
+                {{ row.ability_name }}
+                <span v-if="row.include_mock_service" class="mock_tip"> mock </span>
+              </span>
+            </template>
+            <template v-slot:ability_state="{ row }">
+              <span class="circle" :class="'bgc_' + row.ability_state"></span>
+              {{ ["待上架", "已上架", "已下架", "上架中", "下架中"][row.ability_state] }}
+            </template>
+            <template v-slot:action="{ row }">
+              <bg-table-btns2 :limit="3" :key="row.id">
+                <bg-table-btn @click="approve(row)">审批</bg-table-btn>
+                <bg-table-btn @click="approveDetail(row)">审批详情</bg-table-btn>
+              </bg-table-btns2>
+            </template>
+          </bg-table>
+          <bg-pagination
+            :page="filter.page"
+            :size="filter.size"
+            :total="tableTotal"
+            @change-page="changePage"
+            @change-size="changeSize">
+          </bg-pagination>
+        </div>
+      </div>
+    </el-dialog>
+
+    <el-dialog class="dialog_box" title="提示" v-model="cacheDialog" width="400px">
+      <div style="font-size: 16px; color: #404a62">你有未提交的服务，是否继续编辑该服务？</div>
+      <template v-slot:footer>
+        <div class="apaas_button">
+          <el-button type="default" @click="cancelCache">取 消</el-button>
+          <el-button type="primary" @click="confirmCache">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { reactive, toRefs, computed, onBeforeMount } from "vue";
+import { Search } from "@element-plus/icons-vue";
+
+import { useRouter } from "vue-router";
+import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
+import store from "@/store";
+import axios from "@/request/http.js";
+import { ElMessage } from "element-plus";
+
+const router = useRouter();
+const state = reactive({
+  filter: {
+    state: "",
+    keyword: "",
+    page: 1,
+    size: 10,
+    abilityType: 0,
+    time: [],
+  },
+  stateOptions: [
+    {
+      name: "全部",
+      value: "",
+    },
+    {
+      name: "已上架",
+      value: "1",
+    },
+    {
+      name: "已下架",
+      value: "2",
+    },
+    {
+      name: "上架中",
+      value: "3",
+    },
+    {
+      name: "下架中",
+      value: "4",
+    },
+    {
+      name: "待上架",
+      value: "0",
+    },
+  ],
+  headers: [
+    {
+      label: "规则名称",
+      prop: "ability_name",
+      // minWidth: 280,
+    },
+    {
+      label: "规则类型",
+      prop: "synopsis",
+      // minWidth: 360,
+    },
+    {
+      label: "用户数量",
+      prop: "created_time",
+      // width: 200,
+    },
+    {
+      label: "规则",
+      prop: "ability_state",
+      // width: 120,
+    },
+    {
+      label: "是否启用",
+      prop: "start_use",
+      // width: 120,
+    },
+    {
+      label: "修改时间",
+      prop: "ability_state",
+      width: 240,
+    },
+    {
+      label: "操作",
+      prop: "action",
+      width: 120,
+      fixed: "right",
+    },
+  ],
+  detailHeaders: [
+    {
+      label: "账号",
+      prop: "ability_name",
+      // minWidth: 280,
+    },
+    {
+      label: "类型",
+      prop: "synopsis",
+      // minWidth: 360,
+    },
+    {
+      label: "用户手机号",
+      prop: "created_time",
+      // width: 200,
+    },
+    {
+      label: "所属组织",
+      prop: "ability_state",
+      // width: 120,
+    },
+  ],
+  tableRows: [],
+  tableTotal: 0,
+  actionRow: {},
+  dialogDetail: false,
+  cacheDialog: false,
+});
+
+const { filter, stateOptions, headers, detailHeaders, tableRows, tableTotal, dialogDetail, cacheDialog } =
+  toRefs(state);
+// 认证方案未确定，暂时使用假数据registerValid，后续更改
+const registerValid = computed(() => {
+  return store.state.registerValid;
+});
+//新增
+const addRule = () => {
+  router.push("/develop/menu/add");
+};
+
+//批量删除
+const deleteBatch = () => {};
+//清空
+const cleanSelected = () => {};
+const cancelCache = () => {
+  axios
+    .get(`/apaas/service/v5/ability/clear/cach?abilityType=0`)
+    .then((res) => {
+      if (res.data.code == 200) {
+        state.cacheDialog = false;
+        router.push("/ability-register/add");
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    })
+    .catch((err) => {
+      router.push("/ability-register/add");
+    });
+}; // 取消按钮，清空缓存跳转注册页
+const confirmCache = () => {
+  state.cacheDialog = false;
+  router.push("/ability-register/add");
+}; // 确定按钮，直接跳转注册页
+const changeSearch = (val) => {
+  state.filter.keyword = val;
+  changePage(1);
+};
+const changePage = (page) => {
+  state.filter.page = page;
+  getTableRows();
+};
+const getTableRows = () => {
+  let params = { ...state.filter };
+  params.registerStartTime = params.time ? params.time[0] || "" : "";
+  params.registerEndTime = params.time ? params.time[1] || "" : "";
+  delete params.time;
+  axios
+    .get(`/apaas/service/v5/ability/list`, {
+      params,
+    })
+    .then((res) => {
+      if (res.data.code == 200) {
+        state.tableRows = res.data.data || [];
+        state.tableTotal = res.data.total;
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    });
+};
+const filterAction = () => {
+  changePage(1);
+};
+const changeSize = (size) => {
+  state.filter.size = size;
+  changePage(1);
+};
+const filterClear = () => {
+  state.filter = {
+    state: "",
+    keyword: "",
+    page: 1,
+    size: 10,
+    abilityType: 0,
+    time: [],
+  };
+  changePage(1);
+};
+//编辑
+const edit = (row) => {
+  state.dialogDetail = true;
+  // router.push(`/develop/account/add`);
+};
+//删除
+const deleteCurrent = (row) => {
+  router.push(`/develop/account/detail`);
+};
+
+const goDetail = (row) => {
+  router.push({
+    path: "/ability-manage/real-list/detail",
+    query: {
+      id: row.id,
+    },
+  });
+};
+onBeforeMount(() => {
+  getTableRows();
+});
+</script>
+
+<style lang="scss" scoped>
+.page_container {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: stretch;
+  width: 100%;
+  padding: 0 24px;
+  min-height: 100%;
+  .main_container {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: stretch;
+    flex-grow: 1;
+    width: 100%;
+    background-color: #fff;
+    box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+    border-radius: 6px;
+    padding: 0 0 16px 0;
+    margin-bottom: 16px;
+    position: relative;
+    .sleceted_tip {
+      margin: 0 24px 0 40px;
+      vertical-align: middle;
+      font-size: 14px;
+      color: #404a62;
+      .num {
+        margin: 0 3px 0 3px;
+        font-weight: 600;
+        color: #202531;
+      }
+    }
+    .clean {
+      vertical-align: middle;
+      font-size: 14px;
+      color: #3759be;
+      cursor: pointer;
+    }
+    .filter-group {
+      .left-filter {
+        flex: 1;
+        display: flex;
+        justify-content: start;
+        flex-wrap: wrap;
+        .filter_item {
+          display: flex;
+          align-items: center;
+          .filter_title {
+            width: 84px;
+            white-space: pre-wrap;
+            font-weight: normal;
+          }
+        }
+      }
+      .right-action {
+        width: 144px;
+        padding-bottom: 16px;
+        .el-button {
+          width: 64px;
+        }
+      }
+    }
+    .table_container {
+      padding: 0 16px;
+      .el-table {
+        flex: 1;
+        .circle {
+          display: inline-block;
+          width: 6px;
+          height: 6px;
+          border-radius: 3px;
+          margin-right: 8px;
+          transform: translateY(-2px);
+        }
+        .bgc_1 {
+          background-color: #48ad97;
+        }
+        .bgc_2 {
+          background-color: #d75138;
+        }
+        .bgc_3 {
+          background-color: #3759be;
+        }
+        .bgc_4 {
+          background-color: #ea7d19;
+        }
+        .bgc_0 {
+          background-color: #9e9e9e;
+        }
+        .mock_tip {
+          display: inline-block;
+          margin-left: 4px;
+          width: 43px;
+          height: 20px;
+          font-size: 12px;
+          color: #2b4695;
+          text-align: center;
+          background-color: #eff2fa;
+          border-radius: 3px;
+          border: solid 1px #b0bee8;
+        }
+        ::v-deep td {
+          padding: 9px 0 !important;
+        }
+        ::v-deep .el-switch {
+          height: 20px;
+          width: 44px;
+          .el-switch__core {
+            height: 20px;
+            min-width: 44px;
+          }
+        }
+      }
+    }
+  }
+
+  ::v-deep .dialog_box_detail {
+    .el-dialog__body {
+      padding: 0 0 18px 0;
+      height: 580px;
+    }
+
+    .form_filter {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      height: 69px;
+      border-bottom: 1px solid #e6e9ef;
+      .right {
+        margin-right: 16px;
+        .el-button {
+          width: 64px;
+          &:last-child {
+            margin-left: 16px;
+          }
+        }
+      }
+    }
+    .table_content {
+      padding: 0 16px;
+    }
+  }
+}
+</style>
diff --git a/src/page/main/config/loginPage/index.vue b/src/page/main/config/loginPage/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..425ce1576bab48a4d86df9f0fa4b7d0ed86e0198
--- /dev/null
+++ b/src/page/main/config/loginPage/index.vue
@@ -0,0 +1,135 @@
+<!-- 角色管理 -->
+<template>
+  <div class="page_container">
+    <bg-breadcrumb></bg-breadcrumb>
+    <div class="main_container">
+      <div class="form_content apaas_scroll_nor">
+        <el-form ref="refForm" :model="formData" :rules="rules" label-width="82px" class="registerForm">
+          <el-form-item label="LOGO" prop="logo">
+            <bg-upload-image
+              v-model="formData.logo"
+              :fileSize="1"
+              :showTips="true"
+              customTips="请选择图片上传：支持jpg、png等格式，图片需小于500KBB"
+              :limit="1"
+              listType="picture-card"
+              :accept="['.jpg', '.jpeg', '.png']"></bg-upload-image>
+          </el-form-item>
+          <el-form-item label="登录背景图" prop="banner">
+            <bg-upload-image
+              v-model="formData.banner"
+              :fileSize="1"
+              :showTips="true"
+              customTips="请选择图片上传：大小1920 * 1026像素支持jpg、png等格式，图片需小于1MB"
+              :limit="1"
+              listType="picture-card"
+              :accept="['.jpg', '.jpeg', '.png']"></bg-upload-image>
+          </el-form-item>
+          <bg-form-gap title="底部所有权内容"></bg-form-gap>
+          <el-form-item label="内容" prop="force">
+            <el-input placeholder="例如：Copyright © 某某大数据, All Rights Reserved." maxlength="100"></el-input>
+          </el-form-item>
+
+          <bg-form-gap title="底部ICP备案"></bg-form-gap>
+          <el-form-item label="内容" prop="force">
+            <el-input placeholder="请输入" maxlength="100"></el-input>
+          </el-form-item>
+          <el-form-item label="跳转连接" prop="force">
+            <el-input placeholder="例如：https://...或http://..." maxlength="100"></el-input>
+          </el-form-item>
+          <bg-form-gap title="底部公安网备案"></bg-form-gap>
+          <el-form-item label="内容" prop="force">
+            <el-input placeholder="请输入" maxlength="100"></el-input>
+          </el-form-item>
+          <el-form-item label="跳转连接" prop="force">
+            <el-input placeholder="例如：https://...或http://..." maxlength="100"></el-input>
+          </el-form-item>
+
+          <bg-form-gap title="法律声明"></bg-form-gap>
+          <el-form-item label="跳转连接" prop="force">
+            <el-input placeholder="例如：https://...或http://..." maxlength="100"></el-input>
+          </el-form-item>
+
+          <bg-form-gap title="隐私政策"></bg-form-gap>
+          <el-form-item label="跳转连接" prop="force">
+            <el-input placeholder="例如：https://...或http://..." maxlength="100"></el-input>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="operate_btns">
+        <el-button type="primary" @click="save"> 保存 </el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { Search } from "@element-plus/icons-vue";
+import { reactive, toRefs, ref, onBeforeMount, nextTick } from "vue";
+import axios from "../../../../request/http.js";
+import { ElMessage } from "element-plus";
+import { useRouter } from "vue-router";
+import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
+
+//表单数据
+const formData = reactive({
+  logo: "",
+});
+//表单校验规则
+const rules = reactive({});
+</script>
+
+<style lang="scss" scoped>
+.page_container {
+  .main_container {
+    position: relative;
+    margin: 0 0 16px;
+    width: 100%;
+    height: calc(100% - 62px);
+    padding: 32px 0 70px;
+    overflow: auto;
+    background-color: #fff;
+    box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+    border-radius: 6px;
+    .form_content {
+      overflow: auto;
+      height: 100%;
+      padding-left: 24px;
+      .el-form {
+        width: 60%;
+        ::v-deep .el-form-item {
+          &:nth-of-type(1) {
+            .el-upload--picture-card {
+              width: 120px;
+              height: 120px;
+            }
+          }
+          &:nth-of-type(2) {
+            .el-upload--picture-card {
+              width: 367px;
+              height: 196px;
+            }
+          }
+        }
+      }
+      ::v-deep .gap-title {
+        font-size: 16px;
+        color: #202531;
+      }
+    }
+    .operate_btns {
+      position: absolute;
+      bottom: 0;
+      width: 100%;
+      height: 70px;
+      text-align: right;
+      line-height: 68px;
+      border-top: solid 1px #e6e9ef;
+      .el-button {
+        width: 92px;
+        margin-right: 16px;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/page/main/config/preference/index.vue b/src/page/main/config/preference/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..a3f52a542faae32c50ca6dd98b560ef76c803b1d
--- /dev/null
+++ b/src/page/main/config/preference/index.vue
@@ -0,0 +1,331 @@
+<template>
+  <div class="page_container">
+    <bg-breadcrumb></bg-breadcrumb>
+    <div class="parent_container">
+      <div class="left_container bgc_white">
+        <el-menu default-active="1" @select="switchMenu">
+          <el-menu-item index="1">
+            <span>授权信息</span>
+          </el-menu-item>
+          <el-menu-item index="2">
+            <span>安全相关</span>
+          </el-menu-item>
+          <el-menu-item index="3">
+            <span>登录注册配置</span>
+          </el-menu-item>
+        </el-menu>
+      </div>
+      <div class="right_container bgc_white">
+        <!-- 授权信息表单 -->
+        <el-form
+          v-if="activeIndex == 1"
+          ref="authorizeFormRef"
+          :model="authorizeFormData"
+          :rules="authorizeRules"
+          label-width="110px"
+          class="authorizeForm">
+          <el-form-item label="当前版本号" prop="system_version">
+            <el-input disabled v-model="authorizeFormData.system_version" maxlength="20" />
+          </el-form-item>
+          <el-form-item label="User" prop="system_user">
+            <el-input placeholder="统一管理用户认证平台" v-model="authorizeFormData.system_user" maxlength="50" />
+          </el-form-item>
+          <el-form-item label="Key" prop="license">
+            <el-input
+              placeholder="请输入"
+              rows="5"
+              maxlength="300"
+              v-model="authorizeFormData.license"
+              show-word-limit
+              type="textarea" />
+            <el-tooltip placement="top-start" effect="light">
+              <template #content> 支持中文、英文（区分大小写）、数字、_、/、-、.,最多不超过64个字 </template>
+              <div class="tip-image"></div>
+            </el-tooltip>
+          </el-form-item>
+          <el-form-item label="有效期至" prop="license_dead_date">
+            <el-input disabled v-model="authorizeFormData.license_dead_date" maxlength="50" />
+          </el-form-item>
+          <el-form-item label="剩余有效期提醒" prop="license_inform_day">
+            <el-input placeholder="请输入" v-model="authorizeFormData.license_inform_day" maxlength="2">
+              <template #append>天</template>
+            </el-input>
+            <el-tooltip placement="top-start" effect="light">
+              <template #content>
+                范围（0~90），单位：天， 当剩余有效期在配置区间内时，系统会在用户登录系统时发出提醒，0表示不提醒
+              </template>
+              <div class="tip-image"></div>
+            </el-tooltip>
+          </el-form-item>
+        </el-form>
+        <!-- 安全相关表单 -->
+        <el-form
+          v-if="activeIndex == 2"
+          ref="secureFormRef"
+          :model="secureFormData"
+          :rules="secureRules"
+          label-width="110px"
+          class="secureForm">
+          <div class="passwordItem">
+            <el-form-item label="最低密码强度" prop="synopsis">
+              <el-select placeholder="请选择">
+                <el-option label="低" value="1"> </el-option>
+                <el-option label="高" value="2"> </el-option>
+              </el-select>
+              <el-tooltip placement="top-start" effect="light">
+                <template #content> 支持中文、英文（区分大小写）、数字、_、/、-、.,最多不超过64个字 </template>
+                <div class="tip-image"></div>
+              </el-tooltip>
+            </el-form-item>
+            <el-form-item label="是否强制修改" prop="force">
+              <el-switch></el-switch>
+            </el-form-item>
+          </div>
+          <el-form-item label="密码有效期" prop="synopsis">
+            <el-input placeholder="请输入" maxlength="20">
+              <template #append>天</template>
+            </el-input>
+            <el-tooltip placement="top-start" effect="light">
+              <template #content> 支持中文、英文（区分大小写）、数字、_、/、-、.,最多不超过64个字 </template>
+              <div class="tip-image"></div>
+            </el-tooltip>
+          </el-form-item>
+          <el-form-item label="会话有效期" prop="synopsis">
+            <el-input placeholder="请输入" maxlength="20">
+              <template #append>分钟</template>
+            </el-input>
+            <el-tooltip placement="top-start" effect="light">
+              <template #content> 支持中文、英文（区分大小写）、数字、_、/、-、.,最多不超过64个字 </template>
+              <div class="tip-image"></div>
+            </el-tooltip>
+          </el-form-item>
+          <el-form-item label="访问规则模式" prop="synopsis">
+            <el-select placeholder="请选择">
+              <el-option label="关闭" value="1"> </el-option>
+              <el-option label="打开" value="2"> </el-option>
+            </el-select>
+            <el-tooltip placement="top-start" effect="light">
+              <template #content> 支持中文、英文（区分大小写）、数字、_、/、-、.,最多不超过64个字 </template>
+              <div class="tip-image"></div>
+            </el-tooltip>
+          </el-form-item>
+        </el-form>
+        <!-- 登录注册配置表单 -->
+        <el-form
+          v-if="activeIndex == 3"
+          ref="registerFormRef"
+          :model="registerFormData"
+          :rules="registerRules"
+          label-width="125px"
+          class="registerForm">
+          <bg-form-gap title="登录受限配置"></bg-form-gap>
+          <el-form-item label="登录受限是否启用" prop="force">
+            <el-switch></el-switch>
+          </el-form-item>
+          <div class="input_password_config">
+            <span>在</span>
+            <el-form-item prop="minutes" label-width="0">
+              <el-input placeholder="请输入小时数" maxlength="3"></el-input>
+            </el-form-item>
+            <span>小时内</span>
+            <el-form-item prop="times" label-width="0">
+              <el-input placeholder="请输入密码输错次数" maxlength="3"></el-input>
+            </el-form-item>
+            <span>次输错密码，自动锁定</span>
+            <el-form-item prop="times" label-width="0">
+              <el-input placeholder="请输入分钟数" maxlength="3"></el-input>
+            </el-form-item>
+            <span>分钟</span>
+            <el-button type="primary"> 一键还原受限 </el-button>
+            <el-tooltip placement="top-start" effect="light">
+              <template #content> 支持中文、英文（区分大小写）、数字、_、/、-、.,最多不超过64个字 </template>
+              <div class="tip-image"></div>
+            </el-tooltip>
+          </div>
+          <bg-form-gap title="注册配置"></bg-form-gap>
+
+          <el-form-item label="允许注册" prop="times">
+            <el-radio-group>
+              <el-radio label="1"> 是 </el-radio>
+              <el-radio label="1"> 否 </el-radio>
+            </el-radio-group>
+          </el-form-item>
+        </el-form>
+        <div class="operate_btns">
+          <el-button type="primary" @click="save"> 保存 </el-button>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { reactive, toRefs, onBeforeMount } from "vue";
+import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
+import { ElMessage } from "element-plus";
+import axios from "@/request/http.js";
+const state = reactive({
+  //授权信息表单
+  authorizeFormData: {
+    id: "",
+    system_version: "",
+    system_user: "",
+    license: "",
+    license_dead_date: "",
+    license_inform_day: "",
+  },
+  //授权表单校验规则
+  authorizeRules: {},
+
+  //安全相关信息表单
+  secureFormData: {},
+
+  //安全相关表单校验规则
+  secureRules: {},
+  //登录注册配置表单
+  registerFormData: {},
+  //登录注册配置表单校验规则
+  registerRules: {},
+  //选中项索引
+  activeIndex: 1,
+  //首选项配置
+  preferenceConfig: {},
+});
+const {
+  authorizeFormData,
+  authorizeRules,
+  secureFormData,
+  secureRules,
+  registerFormData,
+  registerRules,
+  activeIndex,
+  preferenceConfig,
+} = toRefs(state);
+onBeforeMount(() => {
+  getPreferenceConfig();
+});
+//切换菜单选项
+const switchMenu = (index) => {
+  state.activeIndex = index;
+};
+//获取首选项配置
+const getPreferenceConfig = () => {
+  axios.get("/apaas/system/v5/sysOptions").then((res) => {
+    if (res.data.code == 200) {
+      state.preferenceConfig = res.data.data;
+    } else {
+      ElMessage.error(res.data.data);
+    }
+  });
+};
+//保存表单项
+const save = () => {};
+</script>
+
+<style lang="scss" scoped>
+.parent_container {
+  display: flex;
+  justify-content: space-between;
+  height: calc(100% - 46px - 20px);
+  .left_container {
+    width: 240px;
+    height: 100%;
+    padding: 24px 16px 0;
+    .el-menu {
+      border: none;
+      .el-menu-item {
+        justify-content: center;
+        height: 36px;
+        color: #404a62 !important;
+        &.is-active,
+        &:hover {
+          background-color: #f2f3f7;
+          border-radius: 4px;
+        }
+      }
+    }
+  }
+  .right_container {
+    position: relative;
+    width: calc(100% - 256px);
+    height: 100%;
+    padding: 32px 0 68px 24px;
+
+    .authorizeForm,
+    .secureForm,
+    .registerForm {
+      ::v-deep .el-form-item {
+        margin-bottom: 24px;
+        width: 750px;
+        font-size: 14px;
+        .el-form-item__label,
+        .el-radio__label {
+          color: var(--el-text-color-primary);
+        }
+        .el-select {
+          width: 100%;
+        }
+        .el-input-group__append {
+          width: 60px;
+          color: #404a62;
+          border-radius: 0 6px 6px 0;
+          background: #f7f7f9;
+        }
+      }
+    }
+    .secureForm {
+      .passwordItem {
+        display: flex;
+        align-items: center;
+        .el-form-item:nth-of-type(1) {
+          flex-shrink: 0;
+          margin-right: 56px;
+        }
+      }
+    }
+
+    .registerForm {
+      .input_password_config {
+        position: relative;
+        display: flex;
+        align-items: center;
+        width: 798px;
+        margin-bottom: 24px;
+        font-size: 14px;
+        color: var(--el-text-color-primary);
+        .el-form-item {
+          margin: 0px 8px;
+          &:nth-of-type(1),
+          &:nth-of-type(3) {
+            width: 120px;
+          }
+          &:nth-of-type(2) {
+            width: 150px;
+          }
+        }
+        .el-button {
+          margin-left: 18px;
+        }
+      }
+      .el-radio {
+        margin-right: 54px;
+      }
+    }
+
+    .operate_btns {
+      position: absolute;
+      bottom: 0;
+      left: 0;
+      width: 100%;
+      height: 68px;
+      padding-right: 16px;
+      line-height: 68px;
+      text-align: right;
+      border-top: solid 1px #e6e9ef;
+      .el-button {
+        width: 92px;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/page/main/develop/systemApproval/approval/index.vue b/src/page/main/develop/systemApproval/approval/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..1db8a42284c1bad08f70a3c4d14d0edd67a6dbb0
--- /dev/null
+++ b/src/page/main/develop/systemApproval/approval/index.vue
@@ -0,0 +1,278 @@
+<template>
+  <div class="page_container">
+    <bg-breadcrumb></bg-breadcrumb>
+    <div class="page_content">
+      <bg-form-gap title="注册信息"></bg-form-gap>
+      <bg-detail-table2 class="register_info" :list="instanceData.approveBasicInfo">
+        <!-- <template v-slot:approvalStatus="{ data }">
+          <p class="detail-module">
+            <span>{{ data.label }}</span>
+            <span>{{ data.value }}</span>
+          </p>
+        </template> -->
+      </bg-detail-table2>
+      <bg-form-gap title="审批"></bg-form-gap>
+      <div class="approve">
+        <div class="header">
+          <div class="left">
+            <span class="approve_person">平台运营者审批</span>
+            <span class="approve_status">待审批</span>
+          </div>
+          <div class="right">
+            <span class="label">申请时间：</span>
+            <span class="value">{{ instanceData.approveBasicInfo[5].value }}</span>
+          </div>
+        </div>
+        <el-form
+          ref="approveFormRef"
+          :model="instanceData.formData"
+          :rules="instanceData.rules"
+          label-width="80px"
+          class="approveForm">
+          <el-form-item label="审批单位">
+            <el-input disabled v-model="userInfo.organization_name" maxlength="20" />
+          </el-form-item>
+          <el-form-item label="审批人">
+            <el-input disabled v-model="userInfo.contact_name" maxlength="20" />
+          </el-form-item>
+          <el-form-item label="审批结果" prop="status">
+            <el-radio-group v-model="instanceData.formData.status">
+              <el-radio :label="1"> 通过 </el-radio>
+              <el-radio :label="0"> 驳回 </el-radio>
+            </el-radio-group>
+          </el-form-item>
+          <el-form-item label="审批意见" prop="comments">
+            <el-input
+              placeholder="请输入"
+              rows="5"
+              maxlength="200"
+              v-model="instanceData.formData.comments"
+              show-word-limit
+              type="textarea" />
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="operate_btns">
+        <el-button type="default" @click="cancel"> 取消 </el-button>
+        <el-button type="primary" @click="save"> 保存 </el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { reactive, onBeforeMount, computed, ref } from "vue";
+import { useRouter, useRoute } from "vue-router";
+import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
+import axios from "@/request/http.js";
+import { ElMessage } from "element-plus";
+// import { dateStringTransform } from "@/services/helper";
+import store from "@/store";
+
+const route = useRoute();
+const router = useRouter();
+const approveFormRef = ref(null);
+const instanceData = reactive({
+  approveBasicInfo: [
+    {
+      key: "organization_name",
+      label: "所属机构",
+      value: "",
+      // slot: "approvalStatus",
+    },
+    {
+      key: "business_name",
+      label: "业务系统名称",
+      value: "",
+    },
+    {
+      key: "system_account",
+      label: "账号",
+      value: "",
+    },
+    {
+      key: "phone",
+      label: "手机号",
+      value: "",
+    },
+    {
+      key: "develop_name",
+      label: "开发厂商名称",
+      value: "",
+    },
+    {
+      key: "created_time",
+      label: "提交时间",
+      value: "",
+    },
+    {
+      key: "contact_name",
+      label: "联系人",
+      value: "",
+    },
+    {
+      key: "contact_phone",
+      label: "联系人手机号",
+      value: "",
+    },
+    {
+      key: "business_desc",
+      label: "业务系统描述",
+      value: "",
+    },
+  ],
+  formData: {
+    status: "",
+    comments: "",
+  },
+  rules: {
+    status: [
+      {
+        required: true,
+        message: "请选择状态",
+      },
+    ],
+  },
+});
+const userInfo = computed(() => {
+  return store.state.userInfo;
+});
+onBeforeMount(() => {
+  getApproveInfo();
+});
+const getApproveInfo = () => {
+  axios
+    .get(`/apaas/system/v5/user/approval/detail/${route.query.id}`)
+    .then((res) => {
+      if (res.data.code == 200) {
+        const result = res.data.data || {};
+        instanceData.approveBasicInfo.forEach((item) => {
+          // if (item.key === "created_time") {
+          //   item.value = dateStringTransform(result[item.key]);
+          //   return;
+          // }
+          item.value = result[item.key];
+        });
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    })
+    .catch((err) => {
+      ElMessage.error(err);
+    });
+};
+//取消
+const cancel = () => {};
+//保存
+const save = () => {
+  approveFormRef.value.validate((val) => {
+    if (val) {
+      const params = {
+        ...instanceData.formData,
+        id: +route.query.id,
+      };
+      axios.post(`/apaas/system/v5/user/approval`, params).then((res) => {
+        if (res.data.code == "200") {
+          ElMessage.success("操作成功");
+          router.push("/develop/systemApproval");
+        } else {
+          ElMessage.error(res.data.data);
+        }
+      });
+    }
+  });
+};
+</script>
+
+<style lang="scss" scoped>
+.page_content {
+  position: relative;
+  padding: 24px 0 68px 24px;
+  .register_info {
+    margin-bottom: 24px;
+    width: 960px;
+  }
+  .approve {
+    overflow: hidden;
+    width: 1127px;
+    height: 378px;
+    background-color: #ffffff;
+    border-radius: 4px;
+    border: solid 1px #e3e4ef;
+
+    .header {
+      display: flex;
+      justify-content: space-between;
+      height: 38px;
+      padding: 0 16px;
+      border-bottom: 1px solid #e3e4ef;
+      background-color: #f9fafc;
+
+      .left {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        width: 150px;
+        height: 100%;
+        .approve_person {
+          display: inline-block;
+          width: 98px;
+          font-size: 14px;
+          font-weight: 600;
+          color: #242c43;
+        }
+        .approve_status {
+          display: inline-block;
+          width: 46px;
+          height: 18px;
+          font-size: 12px;
+          text-align: center;
+          color: #e56600;
+          background-color: #fcf0e6;
+          border-radius: 3px;
+          border: solid 1px #f2b380;
+        }
+      }
+      .right {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        width: 210px;
+        height: 100%;
+        font-size: 14px;
+        color: #7784a6;
+        .value {
+          color: #242c43;
+        }
+      }
+    }
+    .approveForm {
+      padding: 24px 24px 0 24px;
+      ::v-deep .el-form-item {
+        margin-bottom: 24px;
+      }
+      ::v-deep .el-form-item__label,
+      ::v-deep .el-radio__label {
+        color: var(--el-text-color-primary);
+      }
+    }
+  }
+  .operate_btns {
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 64px;
+    padding-right: 16px;
+    line-height: 64px;
+    text-align: right;
+    border-top: solid 1px #e6e9ef;
+    .el-button {
+      width: 92px;
+      & + .el-button {
+        margin-left: 16px;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/page/main/develop/systemApproval/detail/index.vue b/src/page/main/develop/systemApproval/detail/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..f126878e8b2ee99035ae2ec2c5f554b637413e84
--- /dev/null
+++ b/src/page/main/develop/systemApproval/detail/index.vue
@@ -0,0 +1,136 @@
+<template>
+  <div class="page_container">
+    <bg-breadcrumb></bg-breadcrumb>
+    <div class="page_content">
+      <bg-form-gap title="注册信息"></bg-form-gap>
+      <bg-detail-table2 class="register_info" :list="instanceData.approveBasicInfo"> </bg-detail-table2>
+      <bg-form-gap title="审批信息"></bg-form-gap>
+      <bg-detail-table2 class="approve_info" :list="instanceData.approveInfo"> </bg-detail-table2>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { reactive, onBeforeMount } from "vue";
+import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
+import { useRoute } from "vue-router";
+import axios from "@/request/http.js";
+import { ElMessage } from "element-plus";
+
+const route = useRoute();
+
+const instanceData = reactive({
+  approveBasicInfo: [
+    {
+      key: "organization_name",
+      label: "所属机构",
+      value: "",
+      // slot: "approvalStatus",
+    },
+    {
+      key: "business_name",
+      label: "业务系统名称",
+      value: "",
+    },
+    {
+      key: "system_account",
+      label: "账号",
+      value: "",
+    },
+    {
+      key: "phone",
+      label: "手机号",
+      value: "",
+    },
+    {
+      key: "develop_name",
+      label: "开发厂商名称",
+      value: "",
+    },
+    {
+      key: "created_time",
+      label: "提交时间",
+      value: "",
+    },
+    {
+      key: "contact_name",
+      label: "联系人",
+      value: "",
+    },
+    {
+      key: "contact_phone",
+      label: "联系人手机号",
+      value: "",
+    },
+    {
+      key: "business_desc",
+      label: "业务系统描述",
+      value: "",
+    },
+  ],
+  approveInfo: [
+    {
+      key: "status",
+      label: "审核状态",
+      value: "",
+    },
+    {
+      key: "approval_by",
+      label: "审核人",
+      value: "",
+    },
+    {
+      key: "approval_time",
+      label: "审批时间",
+      value: "",
+    },
+    {
+      key: "comments",
+      label: "审批意见",
+      value: "",
+    },
+  ],
+});
+onBeforeMount(() => {
+  getApproveInfo();
+});
+const getApproveInfo = () => {
+  axios
+    .get(`/apaas/system/v5/user/approval/detail/${route.query.id}`)
+    .then((res) => {
+      if (res.data.code == 200) {
+        const result = res.data.data || {};
+        instanceData.approveBasicInfo.forEach((item) => {
+          // if (item.key === "created_time") {
+          //   item.value = dateStringTransform(result[item.key]);
+          //   return;
+          // }
+          item.value = result[item.key];
+        });
+        instanceData.approveInfo.forEach((item) => {
+          if (item.key === "status") {
+            item.value = result[item.key] === 1 ? "通过" : "驳回";
+          }
+          item.value = result[item.key];
+        });
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    })
+    .catch((err) => {
+      ElMessage.error(err);
+    });
+};
+</script>
+
+<style lang="scss" scoped>
+.page_content {
+  position: relative;
+  padding: 24px 0 68px 24px;
+  .register_info,
+  .approve_info {
+    margin-bottom: 24px;
+    width: 960px;
+  }
+}
+</style>
diff --git a/src/page/main/develop/systemApproval/index.vue b/src/page/main/develop/systemApproval/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..e0e445cf9fa54ef8e8a4788996b18cdd16540050
--- /dev/null
+++ b/src/page/main/develop/systemApproval/index.vue
@@ -0,0 +1,358 @@
+<template>
+  <div class="page_container">
+    <bg-breadcrumb></bg-breadcrumb>
+    <div class="main_container">
+      <bg-filter-group @search="changeSearch" v-model="filter.search" placeholder="请输入业务系统名称、账号或所属机构">
+        <template v-slot:filter_group>
+          <div class="left-filter filter_list">
+            <div class="filter_item">
+              <span class="filter_title">审批状态</span>
+              <el-select v-model="filter.status" placeholder="请选择" style="width: 300px">
+                <el-option
+                  v-for="(item, index) in stateOptions"
+                  :key="'pushOptions' + index"
+                  :label="item.name"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </div>
+            <div class="filter_item">
+              <span class="filter_title">提交时间</span>
+              <el-date-picker
+                v-model="filter.time"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                value-format="YYYY-MM-DD"
+                style="width: 300px" />
+            </div>
+          </div>
+          <div class="right-action apaas_button">
+            <el-button type="primary" @click="filterAction"> 查询 </el-button>
+            <el-button type="default" @click="filterClear"> 重置 </el-button>
+          </div>
+        </template>
+      </bg-filter-group>
+      <div class="table_container">
+        <bg-table ref="bgTable" :headers="headers" :rows="tableRows" :isIndex="true" :stripe="true">
+          <template v-slot:ability_name="{ row }">
+            <span @click="goDetail(row)" class="can_click_text">
+              {{ row.ability_name }}
+              <span v-if="row.include_mock_service" class="mock_tip"> mock </span>
+            </span>
+          </template>
+          <template v-slot:ability_state="{ row }">
+            <span class="circle" :class="'bgc_' + row.ability_state"></span>
+            {{ ["待上架", "已上架", "已下架", "上架中", "下架中"][row.ability_state] }}
+          </template>
+          <template v-slot:action="{ row }">
+            <bg-table-btns2>
+              <bg-table-btn v-if="row.status === 0" @click="approve(row)">审批</bg-table-btn>
+              <bg-table-btn v-else @click="approveDetail(row)">审批详情</bg-table-btn>
+            </bg-table-btns2>
+          </template>
+        </bg-table>
+        <bg-pagination
+          :page="filter.page"
+          :size="filter.limit"
+          :total="tableTotal"
+          @change-page="changePage"
+          @change-size="changeSize">
+        </bg-pagination>
+      </div>
+    </div>
+
+    <el-dialog class="dialog_box" title="删除" v-model="dialogDelete" width="400px">
+      <div style="text-align: left">
+        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;确定要删除数据吗？数据删除后不能恢复，请谨慎操作
+      </div>
+      <template v-slot:footer>
+        <div class="apaas_button">
+          <el-button type="default" @click="dialogDelete = false">取 消</el-button>
+          <el-button type="primary" @click="deleteData">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+
+    <el-dialog class="dialog_box" title="提示" v-model="cacheDialog" width="400px">
+      <div style="font-size: 16px; color: #404a62">你有未提交的服务，是否继续编辑该服务？</div>
+      <template v-slot:footer>
+        <div class="apaas_button">
+          <el-button type="default" @click="cancelCache">取 消</el-button>
+          <el-button type="primary" @click="confirmCache">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { reactive, toRefs, computed, onBeforeMount } from "vue";
+import { useRouter } from "vue-router";
+import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
+import axios from "@/request/http.js";
+import { ElMessage } from "element-plus";
+
+const router = useRouter();
+const state = reactive({
+  filter: {
+    search: "",
+    status: "",
+    time: [],
+    page: 1,
+    limit: 10,
+  },
+  stateOptions: [
+    {
+      name: "全部",
+      value: "",
+    },
+    {
+      name: "待审批",
+      value: 0,
+    },
+    {
+      name: "通过",
+      value: 1,
+    },
+    {
+      name: "驳回",
+      value: 2,
+    },
+  ],
+  headers: [
+    {
+      label: "业务系统名称",
+      prop: "business_name",
+      minWidth: 120,
+    },
+    {
+      label: "账号",
+      prop: "system_account",
+      minWidth: 120,
+    },
+    {
+      label: "所属机构",
+      prop: "organization_name",
+      width: 200,
+    },
+    {
+      label: "审批状态",
+      prop: "status",
+      width: 120,
+    },
+    {
+      label: "提交时间",
+      prop: "created_time",
+      minWidth: 180,
+    },
+    {
+      label: "操作",
+      prop: "action",
+      width: 180,
+      fixed: "right",
+    },
+  ],
+  tableRows: [],
+  tableTotal: 0,
+  actionRow: {},
+  dialogDelete: false,
+  cacheDialog: false,
+});
+
+const { filter, stateOptions, headers, tableRows, tableTotal, dialogDelete, cacheDialog } = toRefs(state);
+const cancelCache = () => {
+  axios
+    .get(`/apaas/service/v5/ability/clear/cach?abilityType=0`)
+    .then((res) => {
+      if (res.data.code == 200) {
+        state.cacheDialog = false;
+        router.push("/ability-register/add");
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    })
+    .catch((err) => {
+      router.push("/ability-register/add");
+    });
+}; // 取消按钮，清空缓存跳转注册页
+const confirmCache = () => {
+  state.cacheDialog = false;
+  router.push("/ability-register/add");
+}; // 确定按钮，直接跳转注册页
+const changeSearch = (val) => {
+  state.filter.search = val;
+  changePage(1);
+};
+const changePage = (page) => {
+  state.filter.page = page;
+  getTableRows();
+};
+const getTableRows = () => {
+  let params = { ...state.filter };
+  params.start_at = params.time ? params.time[0] || "" : "";
+  params.end_at = params.time ? params.time[1] || "" : "";
+  delete params.time;
+  if (!params.status.toString()) delete params.status;
+  axios
+    .get(`/apaas/system/v5/user/approval/list`, {
+      params,
+    })
+    .then((res) => {
+      if (res.data.code == 200) {
+        state.tableRows = res.data.data || [];
+        state.tableTotal = res.data.total;
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    });
+};
+const filterAction = () => {
+  changePage(1);
+};
+const changeSize = (limit) => {
+  state.filter.limit = limit;
+  changePage(1);
+};
+const filterClear = () => {
+  state.filter = {
+    search: "",
+    status: 0,
+    time: [],
+    page: 1,
+    limit: 10,
+  };
+  changePage(1);
+};
+const approve = (row) => {
+  router.push({
+    path: "/develop/systemApproval/approval",
+    query: {
+      id: row.id,
+    },
+  });
+};
+const approveDetail = (row) => {
+  router.push({
+    path: "/develop/systemApproval/detail",
+    query: {
+      id: row.id,
+    },
+  });
+};
+const deleteData = () => {
+  axios.delete(`/apaas/service/v5/ability/${state.actionRow.id}`).then((res) => {
+    if (res.data.code == 200) {
+      ElMessage.success(res.data.msg);
+      state.dialogDelete = false;
+      changePage(1);
+    } else {
+      ElMessage.error(res.data.data);
+    }
+  });
+};
+
+const goDetail = (row) => {
+  router.push({
+    path: "/ability-manage/real-list/detail",
+    query: {
+      id: row.id,
+    },
+  });
+};
+onBeforeMount(() => {
+  getTableRows();
+});
+</script>
+
+<style lang="scss" scoped>
+.page_container {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: stretch;
+  width: 100%;
+  padding: 0 24px;
+  min-height: 100%;
+  .main_container {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: stretch;
+    flex-grow: 1;
+    width: 100%;
+    background-color: #fff;
+    box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+    border-radius: 6px;
+    padding: 0 0 16px 0;
+    margin-bottom: 16px;
+    position: relative;
+    .filter-group {
+      .left-filter {
+        flex: 1;
+        display: flex;
+        justify-content: start;
+        flex-wrap: wrap;
+        .filter_item {
+          display: flex;
+          align-items: center;
+          .filter_title {
+            width: 84px;
+            white-space: pre-wrap;
+            font-weight: normal;
+          }
+        }
+      }
+      .right-action {
+        width: 144px;
+        padding-bottom: 16px;
+        .el-button {
+          width: 64px;
+        }
+      }
+    }
+    .table_container {
+      padding: 0 16px;
+      .el-table {
+        flex: 1;
+        .circle {
+          display: inline-block;
+          width: 6px;
+          height: 6px;
+          border-radius: 3px;
+          margin-right: 8px;
+          transform: translateY(-2px);
+        }
+        .bgc_1 {
+          background-color: #48ad97;
+        }
+        .bgc_2 {
+          background-color: #d75138;
+        }
+        .bgc_3 {
+          background-color: #3759be;
+        }
+        .bgc_4 {
+          background-color: #ea7d19;
+        }
+        .bgc_0 {
+          background-color: #9e9e9e;
+        }
+        .mock_tip {
+          display: inline-block;
+          margin-left: 4px;
+          width: 43px;
+          height: 20px;
+          font-size: 12px;
+          color: #2b4695;
+          text-align: center;
+          background-color: #eff2fa;
+          border-radius: 3px;
+          border: solid 1px #b0bee8;
+        }
+      }
+    }
+  }
+}
+</style>
diff --git a/src/page/main/log/system/index.vue b/src/page/main/log/system/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..18edfbc65a6946554bafce8c71e3dcae68cdc328
--- /dev/null
+++ b/src/page/main/log/system/index.vue
@@ -0,0 +1,469 @@
+<template>
+  <div class="detail_container">
+    <bg-breadcrumb></bg-breadcrumb>
+    <div class="flex_row">
+      <div class="flex_left">
+        <div class="box">
+          <el-date-picker style="width: 100%" type="date" placeholder="请选择日期" />
+
+          <div class="type_station bg-scroll">
+            <div
+              class="type-box"
+              :class="{ 'current-type': nodeClassifyId == item.classify_id }"
+              @click="nodeClick(item)"
+              v-for="(item, index) in typeList"
+              :key="'type' + index + 200">
+              {{ item.classify_name }}
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="flex_right">
+        <div class="form-filter">
+          <el-form inline>
+            <el-form-item label="级别" prop="force">
+              <el-select placeholder="全部" style="width: 160px">
+                <el-option label="选项1" value="1"> </el-option>
+                <el-option label="选项2" value="2"> </el-option>
+              </el-select>
+            </el-form-item>
+            <el-form-item label="关键字" prop="force">
+              <el-input placeholder="请输入" maxlength="100" style="width: 240px"></el-input>
+            </el-form-item>
+          </el-form>
+          <div class="operate_btns">
+            <el-button type="primary"> 查询 </el-button>
+            <el-button type="default"> 重置 </el-button>
+          </div>
+        </div>
+        <div class="search-result"></div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { reactive, ref, onBeforeMount, toRefs, computed, watch, nextTick } from "vue";
+import { useRouter } from "vue-router";
+import { ElMessage } from "element-plus";
+import axios from "../../../../request/http.js";
+import { Search } from "@element-plus/icons-vue";
+import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
+const bgForm = ref(null);
+const state = reactive({
+  bgForm,
+  typeList: [], // 分类数据
+  typeKeyword: "", // 分类删选关键词
+  nodeClassifyId: null, // 当前选中分类的uuid  用于新增字典
+  nodeId: null, // 当前选中分类的id  用于请求列表
+  timer: null, // 定时器
+  headers: [
+    {
+      label: "名称",
+      prop: "name",
+    },
+    {
+      label: "描述",
+      prop: "describe",
+      minWidth: 360,
+    },
+    {
+      label: "更新时间",
+      prop: "updated_time",
+      width: 220,
+    },
+    {
+      label: "是否启用",
+      prop: "state",
+    },
+    {
+      label: "操作",
+      prop: "action",
+      width: 176,
+      fixed: "right",
+    },
+  ], // 表格数据表头
+  tableRows: [], // 表格数据
+  tableTotal: 0, // 表格数据条数
+  filter: {
+    state: "",
+    search: "",
+    page: 1,
+    limit: 10,
+  }, // 表格筛选项
+  stateOptions: [
+    {
+      name: "全部",
+      value: "",
+    },
+    {
+      name: "启用",
+      value: "1",
+    },
+    {
+      name: "禁用",
+      value: "0",
+    },
+  ], // 启用禁用
+  actionRow: null, // 当前操作的数据
+  dialogDelete: false, // 删除弹窗
+  addType: 0, //
+  addDialog: false,
+  formData: {
+    name: "",
+    describe: "",
+    state: 1,
+  },
+  rules: {
+    name: [{ required: true, message: "请输入名称", trigger: "blur" }],
+    describe: [
+      { required: true, message: "请输入描述", trigger: "blur" },
+      { max: 200, message: "描述最大为200字", trigger: "blur" },
+    ],
+    state: [{ required: true, message: "请选择是否启用", trigger: "change" }],
+  },
+});
+
+const nodeClick = (item) => {
+  state.nodeId = item.id;
+  state.nodeClassifyId = item.classify_id;
+  state.filter = {
+    state: "",
+    search: "",
+    page: 1,
+    limit: 10,
+  };
+  changePage(1);
+}; // 切换字典分类
+
+const getTypeList = () => {
+  let params = {
+    name: state.typeKeyword,
+  };
+  axios
+    .get(`/apaas/system/v5/dictionary/classify/list`, { params })
+    .then((res) => {
+      if (res.data.code == 200) {
+        state.typeList = res.data.data || [];
+        state.nodeClassifyId = state.typeList[0].classify_id || null;
+        state.nodeId = state.typeList[0].id || null;
+        if (state.nodeId) {
+          getTableRows();
+        }
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    })
+    .catch((err) => {
+      console.log(err);
+    });
+}; // 获取字典分类
+
+const changeSearch = (val) => {
+  state.filter.search = val;
+  changePage(1);
+}; // 表格关键字筛选
+
+const filterAction = () => {
+  changePage(1);
+}; // 查询按钮
+
+const filterClear = () => {
+  state.filter = {
+    state: "",
+    search: "",
+    limit: 10,
+    page: 1,
+  };
+  changePage(1);
+}; // 重置筛选项
+
+const getTableRows = () => {
+  let params = { ...state.filter };
+  params.id = state.nodeId;
+  axios
+    .get(`/apaas/system/v5/dictionary/list`, {
+      params,
+    })
+    .then((res) => {
+      if (res.data.code == 200) {
+        state.tableRows = res.data.data || [];
+        state.tableTotal = res.data.total;
+        if (state.tableRows.length > 0) {
+          state.tableRows.forEach((e) => {
+            e.canMoveUp = true;
+            e.canMoveDown = true;
+          });
+          state.tableRows[0].canMoveUp = false;
+          state.tableRows[state.tableRows.length - 1].canMoveDown = false;
+        }
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    });
+}; // 获取表格数据
+
+const changeUseRow = (row) => {
+  axios.put(`/apaas/system/v5/dictionary/state?id=${row.id}&state=${row.state}`).then((res) => {
+    if (res.data.code == 200) {
+      ElMessage.success(res.data.msg);
+      changePage(1);
+    } else {
+      ElMessage.error(res.data.data);
+      row.state = row.state == 0 ? 1 : 0;
+    }
+  });
+}; // 启用禁用
+
+const changePage = (page) => {
+  state.filter.page = page;
+  getTableRows();
+}; // 改变页码
+
+const changeSize = (size) => {
+  state.filter.limit = size;
+  changePage(1);
+}; // 改变每页条数
+
+const register = () => {
+  state.formData = {
+    name: "",
+    describe: "",
+    state: 1,
+  };
+  if (state.bgForm) {
+    nextTick().then(() => {
+      state.bgForm.validate((valid) => {
+        if (!valid) {
+          state.bgForm.clearValidate();
+        }
+      });
+    });
+  }
+  state.addType = 1;
+  state.addDialog = true;
+}; // 新增字典按钮
+
+const edit_row = (row) => {
+  axios
+    .get(`/apaas/system/v5/dictionary/${row.id}`)
+    .then((res) => {
+      if (res.data.code == 200) {
+        state.actionRow = res.data.data;
+        state.formData = {
+          name: state.actionRow.name,
+          describe: state.actionRow.describe,
+          state: state.actionRow.state,
+        };
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    })
+    .catch((err) => {
+      console.log(err);
+    });
+  if (state.bgForm) {
+    nextTick().then(() => {
+      state.bgForm.validate((valid) => {
+        if (!valid) {
+          state.bgForm.clearValidate();
+        }
+      });
+    });
+  }
+  state.addType = 2;
+  state.addDialog = true;
+}; // 编辑按钮
+
+const addConfirm = () => {
+  state.bgForm.validate((valid) => {
+    if (valid) {
+      if (state.addType == 1) {
+        // 新增
+        let params = {
+          classify_id: state.nodeClassifyId,
+          ...state.formData,
+        };
+        axios.post(`/apaas/system/v5/dictionary/add`, params).then((res) => {
+          if (res.data.code == 200) {
+            ElMessage.success(res.data.msg);
+            state.addDialog = false;
+            changePage(1);
+          } else {
+            ElMessage.error(res.data.data);
+          }
+        });
+      } else {
+        // 编辑
+        let params = {
+          id: state.actionRow.id,
+          ...state.formData,
+        };
+        axios.put(`/apaas/system/v5/dictionary/update`, params).then((res) => {
+          if (res.data.code == 200) {
+            ElMessage.success(res.data.msg);
+            state.addDialog = false;
+            changePage(1);
+          } else {
+            ElMessage.error(res.data.data);
+          }
+        });
+      }
+    }
+  });
+}; // 确定新增/编辑
+
+const delete_row = (row) => {
+  state.dialogDelete = true;
+  state.actionRow = row;
+}; // 删除按钮
+
+const deleteData = () => {
+  axios.delete(`/apaas/system/v5/dictionary/${state.actionRow.id}`).then((res) => {
+    if (res.data.code == 200) {
+      ElMessage.success(res.data.msg);
+      state.dialogDelete = false;
+      changePage(1);
+    } else {
+      ElMessage.error(res.data.data);
+    }
+  });
+}; // 确定删除
+
+const moveRow = (row, type) => {
+  let index;
+  state.tableRows.forEach((e, i) => {
+    if (e.id == row.id) {
+      index = i;
+    }
+  });
+  let nextRow;
+  if (type == 1) {
+    // 上移
+    nextRow = state.tableRows[index - 1];
+  } else {
+    // 下移
+    nextRow = state.tableRows[index + 1];
+  }
+  let params = [
+    {
+      id: row.id,
+      sort: nextRow.sort,
+    },
+    {
+      id: nextRow.id,
+      sort: row.sort,
+    },
+  ];
+  axios
+    .put(`/apaas/system/v5/dictionary/sort`, [...params])
+    .then((res) => {
+      if (res.data.code == 200) {
+        ElMessage.success(res.data.msg);
+        changePage(1);
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    })
+    .catch((err) => {
+      console.log(err);
+    });
+};
+
+onBeforeMount(() => {
+  getTypeList();
+});
+
+const { typeList, typeKeyword, nodeClassifyId, headers, tableRows, tableTotal, filter, stateOptions } = toRefs(state);
+</script>
+
+<style lang="scss" scoped>
+.detail_container {
+  width: 100%;
+  height: calc(100vh - 56px);
+  padding: 0 24px;
+  min-height: 100%;
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: stretch;
+  .flex_row {
+    // flex-grow: 1;
+    width: 100%;
+    display: flex;
+
+    margin-bottom: 16px;
+    position: relative;
+    height: calc(100% - 62px);
+    .flex_left {
+      width: 240px;
+      background-color: #fff;
+      margin-right: 16px;
+      border-radius: 6px;
+      padding: 16px;
+      height: 100%;
+      box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+      overflow: hidden;
+
+      .box {
+        width: 208px;
+        height: 100%;
+        overflow: hidden;
+        .type_station {
+          width: 100%;
+          margin-top: 16px;
+          height: calc(100% - 50px);
+          .type-box {
+            height: 32px;
+            line-height: 32px;
+            text-align: center;
+            font-size: 14px;
+            color: #404a62;
+            cursor: pointer;
+            &:hover {
+              background-color: #f2f3f7;
+            }
+          }
+          .current-type {
+            background-color: #f2f3f7;
+            border-radius: 4px;
+          }
+        }
+      }
+    }
+    .flex_right {
+      flex: 1;
+      height: 100%;
+
+      .form-filter {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        margin-bottom: 16px;
+        height: 68px;
+        width: 100%;
+        padding: 16px 16px 16px 24px;
+        background-color: #ffffff;
+        box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+        border-radius: 6px;
+        .el-form {
+          width: calc(100% - 144px);
+        }
+        .el-form-item {
+          margin-bottom: 0px;
+        }
+        .operate_btns {
+          width: 144px;
+        }
+      }
+      .search-result {
+        width: 100%;
+        height: calc(100% - 84px);
+        background-color: #1a1a1a;
+        box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.1);
+        border-radius: 6px;
+      }
+    }
+  }
+}
+</style>
diff --git a/src/page/main/log/userAccount/index.vue b/src/page/main/log/userAccount/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..f99ed732590967d3fe1c7ab340b111a2441cbae8
--- /dev/null
+++ b/src/page/main/log/userAccount/index.vue
@@ -0,0 +1,527 @@
+<template>
+  <div class="page_container">
+    <bg-breadcrumb></bg-breadcrumb>
+    <div class="main_container">
+      <bg-filter-group @search="changeSearch" v-model="filter.keyword" placeholder="请输入账号、手机号和所属机构">
+        <template v-slot:left_action>
+          <div class="apaas_button">
+            <el-button type="primary" @click="addRule">
+              <bg-icon style="font-size: 12px; color: #fff; margin-right: 8px" icon="#bg-ic-file-send"></bg-icon>
+              导出
+            </el-button>
+            <el-button @click="deleteBatch"> 强制修改密码 </el-button>
+            <span class="sleceted_tip">已选<span class="num">3</span>项</span>
+            <span class="clean" @click="cleanSelected">清空</span>
+          </div>
+        </template>
+
+        <template v-slot:filter_group>
+          <div class="left-filter filter_list">
+            <div class="filter_item">
+              <span class="filter_title">用户类型</span>
+              <el-select v-model="filter.state" placeholder="请选择" style="width: 300px">
+                <el-option
+                  v-for="(item, index) in stateOptions"
+                  :key="'pushOptions' + index"
+                  :label="item.name"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </div>
+            <div class="filter_item">
+              <span class="filter_title">上次访问时间</span>
+              <el-date-picker
+                v-model="filter.time"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                value-format="YYYY-MM-DD"
+                style="width: 300px" />
+            </div>
+            <div class="filter_item">
+              <span class="filter_title">活跃度</span>
+              <el-select v-model="filter.state" placeholder="请选择" style="width: 300px">
+                <el-option
+                  v-for="(item, index) in stateOptions"
+                  :key="'pushOptions' + index"
+                  :label="item.name"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </div>
+            <div class="filter_item">
+              <span class="filter_title">密码强度</span>
+              <el-select v-model="filter.state" placeholder="请选择" style="width: 300px">
+                <el-option
+                  v-for="(item, index) in stateOptions"
+                  :key="'pushOptions' + index"
+                  :label="item.name"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </div>
+          </div>
+          <div class="right-action apaas_button">
+            <el-button type="primary" @click="filterAction"> 查询 </el-button>
+            <el-button type="default" @click="filterClear"> 重置 </el-button>
+          </div>
+        </template>
+      </bg-filter-group>
+      <div class="table_container">
+        <bg-table ref="bgTable" :headers="headers" :rows="tableRows" :stripe="true" select>
+          <template v-slot:ability_name="{ row }">
+            <span @click="goDetail(row)" class="can_click_text">
+              {{ row.ability_name }}
+              <span v-if="row.include_mock_service" class="mock_tip"> mock </span>
+            </span>
+          </template>
+          <template v-slot:ability_state="{ row }">
+            <span class="circle" :class="'bgc_' + row.ability_state"></span>
+            {{ ["待上架", "已上架", "已下架", "上架中", "下架中"][row.ability_state] }}
+          </template>
+          <template v-slot:start_use="{ row }">
+            <el-switch></el-switch>
+          </template>
+          <template v-slot:action="{ row }">
+            <bg-table-btns2 :limit="3" :key="row.id">
+              <bg-table-btn @click="edit(row)">编辑</bg-table-btn>
+              <bg-table-btn @click="deleteCurrent(row)">删除</bg-table-btn>
+            </bg-table-btns2>
+          </template>
+        </bg-table>
+        <bg-pagination
+          :page="filter.page"
+          :size="filter.size"
+          :total="tableTotal"
+          @change-page="changePage"
+          @change-size="changeSize">
+        </bg-pagination>
+      </div>
+    </div>
+
+    <el-dialog class="dialog_box_detail" title="用户详情" v-model="dialogDetail" width="1062px">
+      <div class="content_detail">
+        <div class="form_filter">
+          <div class="left">
+            <el-select placeholder="全部类型" style="width: 200px; margin-left: 16px">
+              <el-option label="选共享1" value="1"> </el-option>
+              <el-option label="选共享2" value="2"> </el-option>
+            </el-select>
+            <el-select placeholder="请选择所属组织" style="width: 200px; margin-left: 16px">
+              <el-option label="选共享1" value="1"> </el-option>
+              <el-option label="选共享2" value="2"> </el-option>
+            </el-select>
+            <el-input placeholder="请输入关键词" style="width: 200px; margin-left: 16px" :prefix-icon="Search" />
+          </div>
+          <div class="right">
+            <el-button type="primary" @click="cancelCache">查询</el-button>
+            <el-button type="default" @click="confirmCache">重置</el-button>
+          </div>
+        </div>
+
+        <div class="table_content">
+          <bg-table ref="bgTable" :headers="detailHeaders" :rows="tableRows" height="430" :stripe="true">
+            <template v-slot:ability_name="{ row }">
+              <span @click="goDetail(row)" class="can_click_text">
+                {{ row.ability_name }}
+                <span v-if="row.include_mock_service" class="mock_tip"> mock </span>
+              </span>
+            </template>
+            <template v-slot:ability_state="{ row }">
+              <span class="circle" :class="'bgc_' + row.ability_state"></span>
+              {{ ["待上架", "已上架", "已下架", "上架中", "下架中"][row.ability_state] }}
+            </template>
+            <template v-slot:action="{ row }">
+              <bg-table-btns2 :limit="3" :key="row.id">
+                <bg-table-btn @click="approve(row)">审批</bg-table-btn>
+                <bg-table-btn @click="approveDetail(row)">审批详情</bg-table-btn>
+              </bg-table-btns2>
+            </template>
+          </bg-table>
+          <bg-pagination
+            :page="filter.page"
+            :size="filter.size"
+            :total="tableTotal"
+            @change-page="changePage"
+            @change-size="changeSize">
+          </bg-pagination>
+        </div>
+      </div>
+    </el-dialog>
+
+    <el-dialog class="dialog_box" title="提示" v-model="cacheDialog" width="400px">
+      <div style="font-size: 16px; color: #404a62">你有未提交的服务，是否继续编辑该服务？</div>
+      <template v-slot:footer>
+        <div class="apaas_button">
+          <el-button type="default" @click="cancelCache">取 消</el-button>
+          <el-button type="primary" @click="confirmCache">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { reactive, toRefs, computed, onBeforeMount } from "vue";
+import { Search } from "@element-plus/icons-vue";
+
+import { useRouter } from "vue-router";
+import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
+import store from "@/store";
+import axios from "@/request/http.js";
+import { ElMessage } from "element-plus";
+
+const router = useRouter();
+const state = reactive({
+  filter: {
+    state: "",
+    keyword: "",
+    page: 1,
+    size: 10,
+    abilityType: 0,
+    time: [],
+  },
+  stateOptions: [
+    {
+      name: "全部",
+      value: "",
+    },
+    {
+      name: "已上架",
+      value: "1",
+    },
+    {
+      name: "已下架",
+      value: "2",
+    },
+    {
+      name: "上架中",
+      value: "3",
+    },
+    {
+      name: "下架中",
+      value: "4",
+    },
+    {
+      name: "待上架",
+      value: "0",
+    },
+  ],
+  headers: [
+    {
+      label: "账号",
+      prop: "ability_name",
+      // minWidth: 280,
+    },
+    {
+      label: "手机号",
+      prop: "synopsis",
+      // minWidth: 360,
+    },
+    {
+      label: "用户类型",
+      prop: "created_time",
+      // width: 200,
+    },
+    {
+      label: "所属机构",
+      prop: "ability_state",
+      // width: 120,
+    },
+    {
+      label: "活跃度",
+      prop: "start_use",
+      // width: 120,
+    },
+    {
+      label: "密码强度",
+      prop: "ability_state",
+      width: 240,
+    },
+    {
+      label: "密码使用时常（天）",
+      prop: "ability_state",
+      width: 240,
+    },
+    {
+      label: "创建时间",
+      prop: "ability_state",
+      width: 240,
+    },
+  ],
+  detailHeaders: [
+    {
+      label: "账号",
+      prop: "ability_name",
+      // minWidth: 280,
+    },
+    {
+      label: "类型",
+      prop: "synopsis",
+      // minWidth: 360,
+    },
+    {
+      label: "用户手机号",
+      prop: "created_time",
+      // width: 200,
+    },
+    {
+      label: "所属组织",
+      prop: "ability_state",
+      // width: 120,
+    },
+  ],
+  tableRows: [],
+  tableTotal: 0,
+  actionRow: {},
+  dialogDetail: false,
+  cacheDialog: false,
+});
+
+const { filter, stateOptions, headers, detailHeaders, tableRows, tableTotal, dialogDetail, cacheDialog } =
+  toRefs(state);
+// 认证方案未确定，暂时使用假数据registerValid，后续更改
+const registerValid = computed(() => {
+  return store.state.registerValid;
+});
+//新增
+const addRule = () => {
+  router.push("/develop/menu/add");
+};
+
+//批量删除
+const deleteBatch = () => {};
+//清空
+const cleanSelected = () => {};
+const cancelCache = () => {
+  axios
+    .get(`/apaas/service/v5/ability/clear/cach?abilityType=0`)
+    .then((res) => {
+      if (res.data.code == 200) {
+        state.cacheDialog = false;
+        router.push("/ability-register/add");
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    })
+    .catch((err) => {
+      router.push("/ability-register/add");
+    });
+}; // 取消按钮，清空缓存跳转注册页
+const confirmCache = () => {
+  state.cacheDialog = false;
+  router.push("/ability-register/add");
+}; // 确定按钮，直接跳转注册页
+const changeSearch = (val) => {
+  state.filter.keyword = val;
+  changePage(1);
+};
+const changePage = (page) => {
+  state.filter.page = page;
+  getTableRows();
+};
+const getTableRows = () => {
+  let params = { ...state.filter };
+  params.registerStartTime = params.time ? params.time[0] || "" : "";
+  params.registerEndTime = params.time ? params.time[1] || "" : "";
+  delete params.time;
+  axios
+    .get(`/apaas/service/v5/ability/list`, {
+      params,
+    })
+    .then((res) => {
+      if (res.data.code == 200) {
+        state.tableRows = res.data.data || [];
+        state.tableTotal = res.data.total;
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    });
+};
+const filterAction = () => {
+  changePage(1);
+};
+const changeSize = (size) => {
+  state.filter.size = size;
+  changePage(1);
+};
+const filterClear = () => {
+  state.filter = {
+    state: "",
+    keyword: "",
+    page: 1,
+    size: 10,
+    abilityType: 0,
+    time: [],
+  };
+  changePage(1);
+};
+//编辑
+const edit = (row) => {
+  state.dialogDetail = true;
+  // router.push(`/develop/account/add`);
+};
+//删除
+const deleteCurrent = (row) => {
+  router.push(`/develop/account/detail`);
+};
+
+const goDetail = (row) => {
+  router.push({
+    path: "/ability-manage/real-list/detail",
+    query: {
+      id: row.id,
+    },
+  });
+};
+onBeforeMount(() => {
+  getTableRows();
+});
+</script>
+
+<style lang="scss" scoped>
+.page_container {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: stretch;
+  width: 100%;
+  padding: 0 24px;
+  min-height: 100%;
+  .main_container {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: stretch;
+    flex-grow: 1;
+    width: 100%;
+    background-color: #fff;
+    box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+    border-radius: 6px;
+    padding: 0 0 16px 0;
+    margin-bottom: 16px;
+    position: relative;
+    .sleceted_tip {
+      margin: 0 24px 0 40px;
+      vertical-align: middle;
+      font-size: 14px;
+      color: #404a62;
+      .num {
+        margin: 0 3px 0 3px;
+        font-weight: 600;
+        color: #202531;
+      }
+    }
+    .clean {
+      vertical-align: middle;
+      font-size: 14px;
+      color: #3759be;
+      cursor: pointer;
+    }
+    .filter-group {
+      .left-filter {
+        flex: 1;
+        display: flex;
+        justify-content: start;
+        flex-wrap: wrap;
+        .filter_item {
+          display: flex;
+          align-items: center;
+          .filter_title {
+            width: 84px;
+            white-space: pre-wrap;
+            font-weight: normal;
+          }
+        }
+      }
+      .right-action {
+        width: 144px;
+        padding-bottom: 16px;
+        .el-button {
+          width: 64px;
+        }
+      }
+    }
+    .table_container {
+      padding: 0 16px;
+      .el-table {
+        flex: 1;
+        .circle {
+          display: inline-block;
+          width: 6px;
+          height: 6px;
+          border-radius: 3px;
+          margin-right: 8px;
+          transform: translateY(-2px);
+        }
+        .bgc_1 {
+          background-color: #48ad97;
+        }
+        .bgc_2 {
+          background-color: #d75138;
+        }
+        .bgc_3 {
+          background-color: #3759be;
+        }
+        .bgc_4 {
+          background-color: #ea7d19;
+        }
+        .bgc_0 {
+          background-color: #9e9e9e;
+        }
+        .mock_tip {
+          display: inline-block;
+          margin-left: 4px;
+          width: 43px;
+          height: 20px;
+          font-size: 12px;
+          color: #2b4695;
+          text-align: center;
+          background-color: #eff2fa;
+          border-radius: 3px;
+          border: solid 1px #b0bee8;
+        }
+        ::v-deep td {
+          padding: 9px 0 !important;
+        }
+        ::v-deep .el-switch {
+          height: 20px;
+          width: 44px;
+          .el-switch__core {
+            height: 20px;
+            min-width: 44px;
+          }
+        }
+      }
+    }
+  }
+
+  ::v-deep .dialog_box_detail {
+    .el-dialog__body {
+      padding: 0 0 18px 0;
+      height: 580px;
+    }
+
+    .form_filter {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      height: 69px;
+      border-bottom: 1px solid #e6e9ef;
+      .right {
+        margin-right: 16px;
+        .el-button {
+          width: 64px;
+          &:last-child {
+            margin-left: 16px;
+          }
+        }
+      }
+    }
+    .table_content {
+      padding: 0 16px;
+    }
+  }
+}
+</style>
diff --git a/src/page/main/log/userBehavior/index.vue b/src/page/main/log/userBehavior/index.vue
new file mode 100644
index 0000000000000000000000000000000000000000..f99ed732590967d3fe1c7ab340b111a2441cbae8
--- /dev/null
+++ b/src/page/main/log/userBehavior/index.vue
@@ -0,0 +1,527 @@
+<template>
+  <div class="page_container">
+    <bg-breadcrumb></bg-breadcrumb>
+    <div class="main_container">
+      <bg-filter-group @search="changeSearch" v-model="filter.keyword" placeholder="请输入账号、手机号和所属机构">
+        <template v-slot:left_action>
+          <div class="apaas_button">
+            <el-button type="primary" @click="addRule">
+              <bg-icon style="font-size: 12px; color: #fff; margin-right: 8px" icon="#bg-ic-file-send"></bg-icon>
+              导出
+            </el-button>
+            <el-button @click="deleteBatch"> 强制修改密码 </el-button>
+            <span class="sleceted_tip">已选<span class="num">3</span>项</span>
+            <span class="clean" @click="cleanSelected">清空</span>
+          </div>
+        </template>
+
+        <template v-slot:filter_group>
+          <div class="left-filter filter_list">
+            <div class="filter_item">
+              <span class="filter_title">用户类型</span>
+              <el-select v-model="filter.state" placeholder="请选择" style="width: 300px">
+                <el-option
+                  v-for="(item, index) in stateOptions"
+                  :key="'pushOptions' + index"
+                  :label="item.name"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </div>
+            <div class="filter_item">
+              <span class="filter_title">上次访问时间</span>
+              <el-date-picker
+                v-model="filter.time"
+                type="daterange"
+                range-separator="至"
+                start-placeholder="开始日期"
+                end-placeholder="结束日期"
+                value-format="YYYY-MM-DD"
+                style="width: 300px" />
+            </div>
+            <div class="filter_item">
+              <span class="filter_title">活跃度</span>
+              <el-select v-model="filter.state" placeholder="请选择" style="width: 300px">
+                <el-option
+                  v-for="(item, index) in stateOptions"
+                  :key="'pushOptions' + index"
+                  :label="item.name"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </div>
+            <div class="filter_item">
+              <span class="filter_title">密码强度</span>
+              <el-select v-model="filter.state" placeholder="请选择" style="width: 300px">
+                <el-option
+                  v-for="(item, index) in stateOptions"
+                  :key="'pushOptions' + index"
+                  :label="item.name"
+                  :value="item.value">
+                </el-option>
+              </el-select>
+            </div>
+          </div>
+          <div class="right-action apaas_button">
+            <el-button type="primary" @click="filterAction"> 查询 </el-button>
+            <el-button type="default" @click="filterClear"> 重置 </el-button>
+          </div>
+        </template>
+      </bg-filter-group>
+      <div class="table_container">
+        <bg-table ref="bgTable" :headers="headers" :rows="tableRows" :stripe="true" select>
+          <template v-slot:ability_name="{ row }">
+            <span @click="goDetail(row)" class="can_click_text">
+              {{ row.ability_name }}
+              <span v-if="row.include_mock_service" class="mock_tip"> mock </span>
+            </span>
+          </template>
+          <template v-slot:ability_state="{ row }">
+            <span class="circle" :class="'bgc_' + row.ability_state"></span>
+            {{ ["待上架", "已上架", "已下架", "上架中", "下架中"][row.ability_state] }}
+          </template>
+          <template v-slot:start_use="{ row }">
+            <el-switch></el-switch>
+          </template>
+          <template v-slot:action="{ row }">
+            <bg-table-btns2 :limit="3" :key="row.id">
+              <bg-table-btn @click="edit(row)">编辑</bg-table-btn>
+              <bg-table-btn @click="deleteCurrent(row)">删除</bg-table-btn>
+            </bg-table-btns2>
+          </template>
+        </bg-table>
+        <bg-pagination
+          :page="filter.page"
+          :size="filter.size"
+          :total="tableTotal"
+          @change-page="changePage"
+          @change-size="changeSize">
+        </bg-pagination>
+      </div>
+    </div>
+
+    <el-dialog class="dialog_box_detail" title="用户详情" v-model="dialogDetail" width="1062px">
+      <div class="content_detail">
+        <div class="form_filter">
+          <div class="left">
+            <el-select placeholder="全部类型" style="width: 200px; margin-left: 16px">
+              <el-option label="选共享1" value="1"> </el-option>
+              <el-option label="选共享2" value="2"> </el-option>
+            </el-select>
+            <el-select placeholder="请选择所属组织" style="width: 200px; margin-left: 16px">
+              <el-option label="选共享1" value="1"> </el-option>
+              <el-option label="选共享2" value="2"> </el-option>
+            </el-select>
+            <el-input placeholder="请输入关键词" style="width: 200px; margin-left: 16px" :prefix-icon="Search" />
+          </div>
+          <div class="right">
+            <el-button type="primary" @click="cancelCache">查询</el-button>
+            <el-button type="default" @click="confirmCache">重置</el-button>
+          </div>
+        </div>
+
+        <div class="table_content">
+          <bg-table ref="bgTable" :headers="detailHeaders" :rows="tableRows" height="430" :stripe="true">
+            <template v-slot:ability_name="{ row }">
+              <span @click="goDetail(row)" class="can_click_text">
+                {{ row.ability_name }}
+                <span v-if="row.include_mock_service" class="mock_tip"> mock </span>
+              </span>
+            </template>
+            <template v-slot:ability_state="{ row }">
+              <span class="circle" :class="'bgc_' + row.ability_state"></span>
+              {{ ["待上架", "已上架", "已下架", "上架中", "下架中"][row.ability_state] }}
+            </template>
+            <template v-slot:action="{ row }">
+              <bg-table-btns2 :limit="3" :key="row.id">
+                <bg-table-btn @click="approve(row)">审批</bg-table-btn>
+                <bg-table-btn @click="approveDetail(row)">审批详情</bg-table-btn>
+              </bg-table-btns2>
+            </template>
+          </bg-table>
+          <bg-pagination
+            :page="filter.page"
+            :size="filter.size"
+            :total="tableTotal"
+            @change-page="changePage"
+            @change-size="changeSize">
+          </bg-pagination>
+        </div>
+      </div>
+    </el-dialog>
+
+    <el-dialog class="dialog_box" title="提示" v-model="cacheDialog" width="400px">
+      <div style="font-size: 16px; color: #404a62">你有未提交的服务，是否继续编辑该服务？</div>
+      <template v-slot:footer>
+        <div class="apaas_button">
+          <el-button type="default" @click="cancelCache">取 消</el-button>
+          <el-button type="primary" @click="confirmCache">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup>
+import { reactive, toRefs, computed, onBeforeMount } from "vue";
+import { Search } from "@element-plus/icons-vue";
+
+import { useRouter } from "vue-router";
+import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
+import store from "@/store";
+import axios from "@/request/http.js";
+import { ElMessage } from "element-plus";
+
+const router = useRouter();
+const state = reactive({
+  filter: {
+    state: "",
+    keyword: "",
+    page: 1,
+    size: 10,
+    abilityType: 0,
+    time: [],
+  },
+  stateOptions: [
+    {
+      name: "全部",
+      value: "",
+    },
+    {
+      name: "已上架",
+      value: "1",
+    },
+    {
+      name: "已下架",
+      value: "2",
+    },
+    {
+      name: "上架中",
+      value: "3",
+    },
+    {
+      name: "下架中",
+      value: "4",
+    },
+    {
+      name: "待上架",
+      value: "0",
+    },
+  ],
+  headers: [
+    {
+      label: "账号",
+      prop: "ability_name",
+      // minWidth: 280,
+    },
+    {
+      label: "手机号",
+      prop: "synopsis",
+      // minWidth: 360,
+    },
+    {
+      label: "用户类型",
+      prop: "created_time",
+      // width: 200,
+    },
+    {
+      label: "所属机构",
+      prop: "ability_state",
+      // width: 120,
+    },
+    {
+      label: "活跃度",
+      prop: "start_use",
+      // width: 120,
+    },
+    {
+      label: "密码强度",
+      prop: "ability_state",
+      width: 240,
+    },
+    {
+      label: "密码使用时常（天）",
+      prop: "ability_state",
+      width: 240,
+    },
+    {
+      label: "创建时间",
+      prop: "ability_state",
+      width: 240,
+    },
+  ],
+  detailHeaders: [
+    {
+      label: "账号",
+      prop: "ability_name",
+      // minWidth: 280,
+    },
+    {
+      label: "类型",
+      prop: "synopsis",
+      // minWidth: 360,
+    },
+    {
+      label: "用户手机号",
+      prop: "created_time",
+      // width: 200,
+    },
+    {
+      label: "所属组织",
+      prop: "ability_state",
+      // width: 120,
+    },
+  ],
+  tableRows: [],
+  tableTotal: 0,
+  actionRow: {},
+  dialogDetail: false,
+  cacheDialog: false,
+});
+
+const { filter, stateOptions, headers, detailHeaders, tableRows, tableTotal, dialogDetail, cacheDialog } =
+  toRefs(state);
+// 认证方案未确定，暂时使用假数据registerValid，后续更改
+const registerValid = computed(() => {
+  return store.state.registerValid;
+});
+//新增
+const addRule = () => {
+  router.push("/develop/menu/add");
+};
+
+//批量删除
+const deleteBatch = () => {};
+//清空
+const cleanSelected = () => {};
+const cancelCache = () => {
+  axios
+    .get(`/apaas/service/v5/ability/clear/cach?abilityType=0`)
+    .then((res) => {
+      if (res.data.code == 200) {
+        state.cacheDialog = false;
+        router.push("/ability-register/add");
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    })
+    .catch((err) => {
+      router.push("/ability-register/add");
+    });
+}; // 取消按钮，清空缓存跳转注册页
+const confirmCache = () => {
+  state.cacheDialog = false;
+  router.push("/ability-register/add");
+}; // 确定按钮，直接跳转注册页
+const changeSearch = (val) => {
+  state.filter.keyword = val;
+  changePage(1);
+};
+const changePage = (page) => {
+  state.filter.page = page;
+  getTableRows();
+};
+const getTableRows = () => {
+  let params = { ...state.filter };
+  params.registerStartTime = params.time ? params.time[0] || "" : "";
+  params.registerEndTime = params.time ? params.time[1] || "" : "";
+  delete params.time;
+  axios
+    .get(`/apaas/service/v5/ability/list`, {
+      params,
+    })
+    .then((res) => {
+      if (res.data.code == 200) {
+        state.tableRows = res.data.data || [];
+        state.tableTotal = res.data.total;
+      } else {
+        ElMessage.error(res.data.data);
+      }
+    });
+};
+const filterAction = () => {
+  changePage(1);
+};
+const changeSize = (size) => {
+  state.filter.size = size;
+  changePage(1);
+};
+const filterClear = () => {
+  state.filter = {
+    state: "",
+    keyword: "",
+    page: 1,
+    size: 10,
+    abilityType: 0,
+    time: [],
+  };
+  changePage(1);
+};
+//编辑
+const edit = (row) => {
+  state.dialogDetail = true;
+  // router.push(`/develop/account/add`);
+};
+//删除
+const deleteCurrent = (row) => {
+  router.push(`/develop/account/detail`);
+};
+
+const goDetail = (row) => {
+  router.push({
+    path: "/ability-manage/real-list/detail",
+    query: {
+      id: row.id,
+    },
+  });
+};
+onBeforeMount(() => {
+  getTableRows();
+});
+</script>
+
+<style lang="scss" scoped>
+.page_container {
+  display: flex;
+  flex-direction: column;
+  justify-content: flex-start;
+  align-items: stretch;
+  width: 100%;
+  padding: 0 24px;
+  min-height: 100%;
+  .main_container {
+    display: flex;
+    flex-direction: column;
+    justify-content: flex-start;
+    align-items: stretch;
+    flex-grow: 1;
+    width: 100%;
+    background-color: #fff;
+    box-shadow: 0px 1px 4px 0px rgba(0, 7, 101, 0.15);
+    border-radius: 6px;
+    padding: 0 0 16px 0;
+    margin-bottom: 16px;
+    position: relative;
+    .sleceted_tip {
+      margin: 0 24px 0 40px;
+      vertical-align: middle;
+      font-size: 14px;
+      color: #404a62;
+      .num {
+        margin: 0 3px 0 3px;
+        font-weight: 600;
+        color: #202531;
+      }
+    }
+    .clean {
+      vertical-align: middle;
+      font-size: 14px;
+      color: #3759be;
+      cursor: pointer;
+    }
+    .filter-group {
+      .left-filter {
+        flex: 1;
+        display: flex;
+        justify-content: start;
+        flex-wrap: wrap;
+        .filter_item {
+          display: flex;
+          align-items: center;
+          .filter_title {
+            width: 84px;
+            white-space: pre-wrap;
+            font-weight: normal;
+          }
+        }
+      }
+      .right-action {
+        width: 144px;
+        padding-bottom: 16px;
+        .el-button {
+          width: 64px;
+        }
+      }
+    }
+    .table_container {
+      padding: 0 16px;
+      .el-table {
+        flex: 1;
+        .circle {
+          display: inline-block;
+          width: 6px;
+          height: 6px;
+          border-radius: 3px;
+          margin-right: 8px;
+          transform: translateY(-2px);
+        }
+        .bgc_1 {
+          background-color: #48ad97;
+        }
+        .bgc_2 {
+          background-color: #d75138;
+        }
+        .bgc_3 {
+          background-color: #3759be;
+        }
+        .bgc_4 {
+          background-color: #ea7d19;
+        }
+        .bgc_0 {
+          background-color: #9e9e9e;
+        }
+        .mock_tip {
+          display: inline-block;
+          margin-left: 4px;
+          width: 43px;
+          height: 20px;
+          font-size: 12px;
+          color: #2b4695;
+          text-align: center;
+          background-color: #eff2fa;
+          border-radius: 3px;
+          border: solid 1px #b0bee8;
+        }
+        ::v-deep td {
+          padding: 9px 0 !important;
+        }
+        ::v-deep .el-switch {
+          height: 20px;
+          width: 44px;
+          .el-switch__core {
+            height: 20px;
+            min-width: 44px;
+          }
+        }
+      }
+    }
+  }
+
+  ::v-deep .dialog_box_detail {
+    .el-dialog__body {
+      padding: 0 0 18px 0;
+      height: 580px;
+    }
+
+    .form_filter {
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      height: 69px;
+      border-bottom: 1px solid #e6e9ef;
+      .right {
+        margin-right: 16px;
+        .el-button {
+          width: 64px;
+          &:last-child {
+            margin-left: 16px;
+          }
+        }
+      }
+    }
+    .table_content {
+      padding: 0 16px;
+    }
+  }
+}
+</style>
diff --git a/src/router/function.js b/src/router/function.js
index 4328978e96120857dda52e1c98d0ca95f32f8a19..84308b3a2fb3cd05c6724557d1ad7769945dfb9b 100644
--- a/src/router/function.js
+++ b/src/router/function.js
@@ -100,7 +100,7 @@ var adminMenu = [
                     dict_group_id: "64c156e0-bfff-4bfc-a63a-56effe130a25",
                     menuType: 2,
                   },
-                ]
+                ],
               },
             ],
             dict_group_id: "64c156e0-bfff-4bfc-a63a-56effe130a25",
@@ -169,7 +169,7 @@ var adminMenu = [
             dict_group_id: "09938937-3db9-47de-b967-7777ea4ebb2d",
             menuType: 1, //system:64c156e0-bfff-4bfc-a63a-56effe130a25:apaas后管,能力注册页等  font:2cb4f767-fad7-44f2-afa3-f055e15dd2b6:apaas前台页  manager:09938937-3db9-47de-b967-7777ea4ebb2d:apaas管理中心 知识中心：26d3903a-863e-4efc-b53e-0fb8772ddaa4
             path: "/system/organization",
-            children:[
+            children: [
               {
                 menuName: "新增平台用户",
                 dict_group_id: "09938937-3db9-47de-b967-7777ea4ebb2d",
@@ -198,27 +198,27 @@ var adminMenu = [
                 show: false,
                 path: "/system/organization/org-detail",
               },
-            ]
+            ],
           },
           {
             menuName: "角色管理",
             dict_group_id: "09938937-3db9-47de-b967-7777ea4ebb2d",
             menuType: 1, //system:64c156e0-bfff-4bfc-a63a-56effe130a25:apaas后管,能力注册页等  font:2cb4f767-fad7-44f2-afa3-f055e15dd2b6:apaas前台页  manager:09938937-3db9-47de-b967-7777ea4ebb2d:apaas管理中心 知识中心：26d3903a-863e-4efc-b53e-0fb8772ddaa4
             path: "/system/role",
-            children:[
+            children: [
               {
-                menuName:'新增角色',
-                menuType:2,
+                menuName: "新增角色",
+                menuType: 2,
                 dict_group_id: "09938937-3db9-47de-b967-7777ea4ebb2d",
                 path: "/system/role/add",
               },
               {
-                menuName:'编辑角色',
-                menuType:2,
+                menuName: "编辑角色",
+                menuType: 2,
                 dict_group_id: "09938937-3db9-47de-b967-7777ea4ebb2d",
                 path: "/system/role/edit",
               },
-            ]
+            ],
           },
         ],
       },
@@ -241,13 +241,13 @@ var adminMenu = [
   },
 ];
 
-function getName(str){
-  if(str=='/'){
-    return 'index'
+function getName(str) {
+  if (str == "/") {
+    return "index";
   }
-  let temp = str.slice(1)
-  temp = temp.replaceAll('/','-')
-  return temp
+  let temp = str.slice(1);
+  temp = temp.replaceAll("/", "-");
+  return temp;
 }
 
 function getViews(path) {
@@ -271,14 +271,13 @@ function getViews(path) {
       break;
   }
   // 然后动态路由的时候这样来取
-  console.log(modules["../page/main" + path + "/index.vue"]);
   return modules["../page/main" + path + "/index.vue"];
 }
 
 //处理路由方法
 var menuToRouter = (menu) => {
   menu.forEach((e) => {
-    e.name = getName(e.path)
+    e.name = getName(e.path);
     if (e.children && e.menuType == 0) {
       // 其他层级作为文件夹，只提供父级
       e.component = () => import("../page/parent/parent.vue");
@@ -286,28 +285,25 @@ var menuToRouter = (menu) => {
     } else if (e.children && e.menuType !== 0) {
       //叶子层级需要加载到对应文件
       //对首页做兼容
-      if(e.source){
-        console.log(`@/page/main${e.source}/index.vue`);
+      if (e.source) {
         e.component = getViews(e.source);
-      }else{
-        console.log(`@/page/main${e.path}/index.vue`);
+      } else {
         e.component = getViews(e.path);
       }
       menuToRouter(e.children);
     } else {
-      console.log(`@/page/main${e.path}/index.vue`);
       //叶子层级需要加载到对应文件
       //对首页做兼容
       if (e.path == "/") {
-        if(e.source){
+        if (e.source) {
           e.component = () => import(`../page/main/${e.source}/index.vue`);
-        }else{
+        } else {
           e.component = () => import("../page/main/index/index.vue");
         }
       } else {
-        if(e.source){
+        if (e.source) {
           e.component = getViews(e.source);
-        }else{
+        } else {
           e.component = getViews(e.path);
         }
       }
diff --git a/src/router/index.js b/src/router/index.js
index f55b5f5576866e4f45e2501e693bba1dde447cbd..a73fc52d2840d6ca6bdbbdd97ee4fb77648cc385 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -37,32 +37,31 @@ const routes = [{
     show: true,
     component: () => import('../page/404.vue')
   },
-]
+];
 
 //重新创建router
 function newRouterFunc() {
   return createRouter({
     history: createWebHashHistory(),
-    routes
+    routes,
   });
 }
 
-const router = newRouterFunc()
+const router = newRouterFunc();
 
 function inWhiteList(toPath) {
   //配置白名单
   const whiteList = ['/login', '/registe', '/password']
   const path = whiteList.find((value) => {
     // 使用正则匹配
-    const reg = new RegExp('^' + value)
-    return reg.test(toPath)
-  })
-  return !!path
+    const reg = new RegExp("^" + value);
+    return reg.test(toPath);
+  });
+  return !!path;
 }
 
 router.beforeEach((to, from, next) => {
-
-  const userInfo = store.state.userInfo
+  const userInfo = store.state.userInfo;
   console.log(store.state.route);
 
   //已登录不可跳转登陆页
@@ -75,30 +74,27 @@ router.beforeEach((to, from, next) => {
 
   // 检查to.path是否存在于免登陆白名单
   if (inWhiteList(to.path)) {
-    next()
+    next();
   } else {
     // 判断是否已经登录，未登录则重定向到首页或其他页面（通过query传参记录原来的路径）
     // 根据配置判断是否跳转第三方登录，跳转第三方登录则不跳login
     // axios封装中也需要对是否登录过期进行判断，如果登录过期，则跳转登录页，具体跳转地址根据配置来·
     if (!userInfo) {
       next({
-        path: '/login',
-      })
-    } else {
-
-    }
+        path: "/login",
+      });
+    } else {}
   }
 
   //判读是否匹配，否则跳转404
   if (to.matched.length !== 0) {
-    next()
+    next();
   } else {
     return next({
       path: '/404'
     })
   }
-})
-
+});
 
 // 在路由完成初始导航时调用，如果有异步操作放置到这里
 // 请求相应的角色和菜单
@@ -117,7 +113,7 @@ function addRoute(router, routers) {
 }
 
 export function generateRoutes() {
-  const _asyncRoutes = store.state.route
+  const _asyncRoutes = store.state.route;
 
   if (_asyncRoutes) {
     //动态添加路由
@@ -131,13 +127,12 @@ export function generateRoutes() {
   })
 
   console.log(router.getRoutes());
-
 }
 
 //新创建一个router替代之前的router，并把matcher方法替换成新的router的matcher
 export function resetRouter() {
-  const newRouter = newRouterFunc()
-  router.matcher = newRouter.matcher
+  const newRouter = newRouterFunc();
+  router.matcher = newRouter.matcher;
 }
 
 export default router