diff --git a/src/assets/css/index.css b/src/assets/css/index.css
index 49874efab63a5ac44af05891a4baa45e9b3e855f..85a74e90e8a6ee09afa2f59a1ffdc8898cae2f8f 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,3 +1559,13 @@ border-radius:8px;
   color: #d75138;
 }
 
+.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;
+}
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/page/main/config/preference/index.vue b/src/page/main/config/preference/index.vue
index 73831a14ec5a31f91407a5f69ad457f47014c39b..a3f52a542faae32c50ca6dd98b560ef76c803b1d 100644
--- a/src/page/main/config/preference/index.vue
+++ b/src/page/main/config/preference/index.vue
@@ -24,28 +24,36 @@
           :rules="authorizeRules"
           label-width="110px"
           class="authorizeForm">
-          <el-form-item label="当前版本号" prop="ability_name">
-            <el-input disabled placeholder="当前版本号" maxlength="20" />
+          <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="synopsis">
-            <el-input placeholder="统一管理用户认证平台" maxlength="20" />
+          <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="synopsis">
-            <el-input placeholder="safjsaf23423sdkafsafja" rows="5" maxlength="200" show-word-limit type="textarea" />
+          <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="synopsis">
-            <el-input placeholder="2022-08-23" maxlength="20" />
+          <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="synopsis">
-            <el-input placeholder="请输入" maxlength="20">
+          <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> 支持中文、英文（区分大小写）、数字、_、/、-、.,最多不超过64个字 </template>
+              <template #content>
+                范围（0~90），单位：天， 当剩余有效期在配置区间内时，系统会在用户登录系统时发出提醒，0表示不提醒
+              </template>
               <div class="tip-image"></div>
             </el-tooltip>
           </el-form-item>
@@ -152,27 +160,63 @@
 </template>
 
 <script setup>
-import { reactive, ref } from "@vue/runtime-core";
+import { reactive, toRefs, onBeforeMount } from "vue";
 import bgBreadcrumb from "@/components/bg-breadcrumb.vue";
-//授权信息表单
-const authorizeFormData = reactive({});
-//授权表单校验规则
-const authorizeRules = reactive({});
-
-//安全相关信息表单
-const secureFormData = reactive({});
+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: {},
 
-//安全相关表单校验规则
-const secureRules = reactive({});
-//登录注册配置表单
-const registerFormData = reactive({});
+  //安全相关信息表单
+  secureFormData: {},
 
-const registerRules = reactive({});
-//登录注册配置表单校验规则
-let activeIndex = ref("1");
+  //安全相关表单校验规则
+  secureRules: {},
+  //登录注册配置表单
+  registerFormData: {},
+  //登录注册配置表单校验规则
+  registerRules: {},
+  //选中项索引
+  activeIndex: 1,
+  //首选项配置
+  preferenceConfig: {},
+});
+const {
+  authorizeFormData,
+  authorizeRules,
+  secureFormData,
+  secureRules,
+  registerFormData,
+  registerRules,
+  activeIndex,
+  preferenceConfig,
+} = toRefs(state);
+onBeforeMount(() => {
+  getPreferenceConfig();
+});
 //切换菜单选项
 const switchMenu = (index) => {
-  activeIndex.value = 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 = () => {};
diff --git a/src/page/main/develop/systemApproval/approval/index.vue b/src/page/main/develop/systemApproval/approval/index.vue
index b97c990c6af7bad3a961f30694111dc3bc358060..1db8a42284c1bad08f70a3c4d14d0edd67a6dbb0 100644
--- a/src/page/main/develop/systemApproval/approval/index.vue
+++ b/src/page/main/develop/systemApproval/approval/index.vue
@@ -3,7 +3,7 @@
     <bg-breadcrumb></bg-breadcrumb>
     <div class="page_content">
       <bg-form-gap title="注册信息"></bg-form-gap>
-      <bg-detail-table2 class="register_info" :list="instanceData.applyBasicInfo">
+      <bg-detail-table2 class="register_info" :list="instanceData.approveBasicInfo">
         <!-- <template v-slot:approvalStatus="{ data }">
           <p class="detail-module">
             <span>{{ data.label }}</span>
@@ -20,30 +20,35 @@
           </div>
           <div class="right">
             <span class="label">申请时间：</span>
-            <span class="value">2022-10-22 09:58:30</span>
+            <span class="value">{{ instanceData.approveBasicInfo[5].value }}</span>
           </div>
         </div>
         <el-form
           ref="approveFormRef"
-          :model="formData"
-          :rules="rules"
-          label-width="70px"
-          class="approveForm"
-          :size="formSize">
-          <el-form-item label="审批单位" prop="ability_name">
-            <el-input disabled placeholder="平台用户组织" maxlength="20" />
+          :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="审批人" prop="synopsis">
-            <el-input disabled placeholder="超级管理员" maxlength="20" />
+          <el-form-item label="审批人">
+            <el-input disabled v-model="userInfo.contact_name" maxlength="20" />
           </el-form-item>
-          <el-form-item label="审批结果" prop="openness_id">
-            <el-radio-group>
-              <el-radio label="1"> 通过 </el-radio>
-              <el-radio label="0"> 驳回 </el-radio>
+          <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="synopsis">
-            <el-input placeholder="请输入审批意见" rows="5" maxlength="200" show-word-limit type="textarea" />
+          <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>
@@ -56,44 +61,52 @@
 </template>
 
 <script setup>
-import { reactive, toRefs, computed, onBeforeMount } from "vue";
+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({
-  applyBasicInfo: [
+  approveBasicInfo: [
     {
-      key: "approval_status",
+      key: "organization_name",
       label: "所属机构",
       value: "",
       // slot: "approvalStatus",
     },
     {
-      key: "apply_time",
+      key: "business_name",
       label: "业务系统名称",
       value: "",
     },
     {
-      key: "apply_organization",
+      key: "system_account",
       label: "账号",
       value: "",
     },
     {
-      key: "business_name",
+      key: "phone",
       label: "手机号",
       value: "",
     },
     {
-      key: "contact_person",
+      key: "develop_name",
       label: "开发厂商名称",
       value: "",
     },
     {
-      key: "contact_phone",
+      key: "created_time",
       label: "提交时间",
       value: "",
     },
     {
-      key: "contact_person",
+      key: "contact_name",
       label: "联系人",
       value: "",
     },
@@ -103,18 +116,72 @@ const instanceData = reactive({
       value: "",
     },
     {
-      key: "apply_application",
+      key: "business_desc",
       label: "业务系统描述",
       value: "",
     },
   ],
-  formData: {},
-  rules: {},
+  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 = () => {};
+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>
diff --git a/src/page/main/develop/systemApproval/detail/index.vue b/src/page/main/develop/systemApproval/detail/index.vue
index f8476cd11d5acaa7bf9b9762307d915ff6ed14f2..f126878e8b2ee99035ae2ec2c5f554b637413e84 100644
--- a/src/page/main/develop/systemApproval/detail/index.vue
+++ b/src/page/main/develop/systemApproval/detail/index.vue
@@ -3,66 +3,57 @@
     <bg-breadcrumb></bg-breadcrumb>
     <div class="page_content">
       <bg-form-gap title="注册信息"></bg-form-gap>
-      <bg-detail-table2 class="register_info" :list="instanceData.applyBasicInfo">
-        <template v-slot:approvalStatus="{ data }">
-          <p class="detail-module">
-            <span>{{ data.label }}</span>
-            <span>{{ data.value }}</span>
-          </p>
-        </template>
-      </bg-detail-table2>
+      <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">
-        <template v-slot:applyOrganization="{ data }">
-          <p class="detail-module">
-            <span>{{ data.label }}</span>
-            <span>{{ data.value }}</span>
-          </p>
-        </template>
-      </bg-detail-table2>
+      <bg-detail-table2 class="approve_info" :list="instanceData.approveInfo"> </bg-detail-table2>
     </div>
   </div>
 </template>
 
 <script setup>
-import { reactive, toRefs, computed, onBeforeMount } from "vue";
+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({
-  applyBasicInfo: [
+  approveBasicInfo: [
     {
-      key: "approval_status",
+      key: "organization_name",
       label: "所属机构",
-      value: "1",
-      slot: "approvalStatus",
+      value: "",
+      // slot: "approvalStatus",
     },
     {
-      key: "apply_time",
+      key: "business_name",
       label: "业务系统名称",
       value: "",
     },
     {
-      key: "apply_organization",
+      key: "system_account",
       label: "账号",
       value: "",
     },
     {
-      key: "business_name",
+      key: "phone",
       label: "手机号",
       value: "",
     },
     {
-      key: "contact_person",
+      key: "develop_name",
       label: "开发厂商名称",
       value: "",
     },
     {
-      key: "contact_phone",
+      key: "created_time",
       label: "提交时间",
       value: "",
     },
     {
-      key: "contact_person",
+      key: "contact_name",
       label: "联系人",
       value: "",
     },
@@ -72,35 +63,64 @@ const instanceData = reactive({
       value: "",
     },
     {
-      key: "apply_application",
+      key: "business_desc",
       label: "业务系统描述",
       value: "",
     },
   ],
   approveInfo: [
     {
-      key: "apply_organization",
+      key: "status",
       label: "审核状态",
       value: "",
-      slot: "applyOrganization",
     },
     {
-      key: "business_name",
+      key: "approval_by",
       label: "审核人",
       value: "",
     },
     {
-      key: "apply_organization",
+      key: "approval_time",
       label: "审批时间",
       value: "",
     },
     {
-      key: "business_name",
+      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>
diff --git a/src/page/main/develop/systemApproval/index.vue b/src/page/main/develop/systemApproval/index.vue
index 73b258c10e6a8ce4c1fd9282c3d9dd329cdb70e3..e0e445cf9fa54ef8e8a4788996b18cdd16540050 100644
--- a/src/page/main/develop/systemApproval/index.vue
+++ b/src/page/main/develop/systemApproval/index.vue
@@ -2,12 +2,12 @@
   <div class="page_container">
     <bg-breadcrumb></bg-breadcrumb>
     <div class="main_container">
-      <bg-filter-group @search="changeSearch" v-model="filter.keyword" placeholder="请输入业务系统名称、账号或所属机构">
+      <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.state" placeholder="请选择" style="width: 300px">
+              <el-select v-model="filter.status" placeholder="请选择" style="width: 300px">
                 <el-option
                   v-for="(item, index) in stateOptions"
                   :key="'pushOptions' + index"
@@ -47,15 +47,15 @@
             {{ ["待上架", "已上架", "已下架", "上架中", "下架中"][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>
+              <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.size"
+          :size="filter.limit"
           :total="tableTotal"
           @change-page="changePage"
           @change-size="changeSize">
@@ -91,19 +91,17 @@
 import { reactive, toRefs, computed, onBeforeMount } from "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,
+    search: "",
+    status: "",
     time: [],
+    page: 1,
+    limit: 10,
   },
   stateOptions: [
     {
@@ -111,56 +109,48 @@ const state = reactive({
       value: "",
     },
     {
-      name: "已上架",
-      value: "1",
-    },
-    {
-      name: "已下架",
-      value: "2",
+      name: "待审批",
+      value: 0,
     },
     {
-      name: "上架中",
-      value: "3",
+      name: "通过",
+      value: 1,
     },
     {
-      name: "下架中",
-      value: "4",
-    },
-    {
-      name: "待上架",
-      value: "0",
+      name: "驳回",
+      value: 2,
     },
   ],
   headers: [
     {
       label: "业务系统名称",
-      prop: "ability_name",
-      minWidth: 280,
+      prop: "business_name",
+      minWidth: 120,
     },
     {
       label: "账号",
-      prop: "synopsis",
-      minWidth: 360,
+      prop: "system_account",
+      minWidth: 120,
     },
     {
       label: "所属机构",
-      prop: "created_time",
+      prop: "organization_name",
       width: 200,
     },
     {
       label: "审批状态",
-      prop: "ability_state",
+      prop: "status",
       width: 120,
     },
     {
       label: "提交时间",
-      prop: "ability_state",
-      width: 120,
+      prop: "created_time",
+      minWidth: 180,
     },
     {
       label: "操作",
       prop: "action",
-      width: 270,
+      width: 180,
       fixed: "right",
     },
   ],
@@ -172,38 +162,6 @@ const state = reactive({
 });
 
 const { filter, stateOptions, headers, tableRows, tableTotal, dialogDelete, cacheDialog } = toRefs(state);
-// 认证方案未确定，暂时使用假数据registerValid，后续更改
-const registerValid = computed(() => {
-  return store.state.registerValid;
-});
-const register = () => {
-  // 请求认证校验接口
-  // 未认证跳转认证页"/ability-register/add/valid"
-  // 认证状态取用store中的registerValid，接口未出 暂时做假数据
-  console.log("跳转能力注册页");
-  // if (!registerValid.value) {
-  //   router.push({
-  //     path: "/ability-register/add/valid",
-  //     query: {
-  //       abilityType: 0,
-  //     },
-  //   });
-  // } else {
-  // 已认证情况
-  // 1.请求缓存接口看是否有缓存，有则显示弹窗，没有则直接跳转注册页"/ability-register/add"
-  axios.get(`/apaas/service/v5/ability/get/cach`).then((res) => {
-    if (res.data.code == 200) {
-      if (res.data.data) {
-        // 有缓存打开弹窗
-        state.cacheDialog = true;
-      } else {
-        // 无缓存
-        router.push("/ability-register/add");
-      }
-    }
-  });
-  // }
-};
 const cancelCache = () => {
   axios
     .get(`/apaas/service/v5/ability/clear/cach?abilityType=0`)
@@ -224,7 +182,7 @@ const confirmCache = () => {
   router.push("/ability-register/add");
 }; // 确定按钮，直接跳转注册页
 const changeSearch = (val) => {
-  state.filter.keyword = val;
+  state.filter.search = val;
   changePage(1);
 };
 const changePage = (page) => {
@@ -233,11 +191,12 @@ const changePage = (page) => {
 };
 const getTableRows = () => {
   let params = { ...state.filter };
-  params.registerStartTime = params.time ? params.time[0] || "" : "";
-  params.registerEndTime = params.time ? params.time[1] || "" : "";
+  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/service/v5/ability/list`, {
+    .get(`/apaas/system/v5/user/approval/list`, {
       params,
     })
     .then((res) => {
@@ -252,29 +211,37 @@ const getTableRows = () => {
 const filterAction = () => {
   changePage(1);
 };
-const changeSize = (size) => {
-  state.filter.size = size;
+const changeSize = (limit) => {
+  state.filter.limit = limit;
   changePage(1);
 };
 const filterClear = () => {
   state.filter = {
-    state: "",
-    keyword: "",
-    page: 1,
-    size: 10,
-    abilityType: 0,
+    search: "",
+    status: 0,
     time: [],
+    page: 1,
+    limit: 10,
   };
   changePage(1);
 };
 const approve = (row) => {
-  router.push(`/develop/systemApproval/approval`);
+  router.push({
+    path: "/develop/systemApproval/approval",
+    query: {
+      id: row.id,
+    },
+  });
 };
 const approveDetail = (row) => {
-  router.push(`/develop/systemApproval/detail`);
+  router.push({
+    path: "/develop/systemApproval/detail",
+    query: {
+      id: row.id,
+    },
+  });
 };
 const deleteData = () => {
-  console.log(state.actionRow.id);
   axios.delete(`/apaas/service/v5/ability/${state.actionRow.id}`).then((res) => {
     if (res.data.code == 200) {
       ElMessage.success(res.data.msg);