场站+服务管理功能开发，角色权限完善，总览弹窗接口联调

web/src/components/EditCom.vue

@@ -27,31 +27,28 @@
         </template>
         <template #treetable="item">
           <TreeTable
+            class="treeTable"
             :columns="item.columns"
             :table-data="item.tableData"
             ref="treeTable"
             :transfer-dialog="transferDialog"
-            @handleDetailPagesizeChange="handleDetailPagesizeChange"
             :table-option="{
               checkStrictly: false,
               selectTableData: item.selectTableData,
               scroll: { y: 500 }
             }"
           >
-            <template #isQuery="record">
-              <a-tag :color="record.isQuery ? 'green' : 'red'">{{
-                record.isQuery ? '启用' : '禁用'
-              }}</a-tag>
+            <template #is_add="recordList">
+              <a-checkbox v-model:checked="recordList.is_add"></a-checkbox>
             </template>
-            <template #isEdit="record">
-              <a-tag :color="record.isEdit ? 'green' : 'red'">{{
-                record.isEdit ? '启用' : '禁用'
-              }}</a-tag>
+            <template #is_del="recordList">
+              <a-checkbox v-model:checked="recordList.is_del"></a-checkbox>
             </template>
-            <template #isControl="record">
-              <a-tag :color="record.isControl ? 'green' : 'red'">{{
-                record.isControl ? '启用' : '禁用'
-              }}</a-tag>
+            <template #is_edit="recordList">
+              <a-checkbox v-model:checked="recordList.is_edit"></a-checkbox>
+            </template>
+            <template #isQuery="recordList">
+              <a-checkbox v-model:checked="recordList.isQuery"></a-checkbox>
             </template>
           </TreeTable>
         </template>
@@ -66,10 +63,15 @@
 </template>
 
 <script>
-import { userOptions, userFormRules,
-  roleOptions,roleFormRules,
-  stationOptions,stationFormRules
-
+import {
+  userOptions,
+  userFormRules,
+  roleOptions,
+  roleFormRules,
+  stationOptions,
+  stationFormRules,
+  serviceApiOptions,
+  serviceApiFormRules
 } from '../../public/config/columnList'
 import DetailInfo from './DetailInfo.vue'
 import { postReq, getReq } from '@/request/api'
@@ -111,9 +113,11 @@ export default {
       formRules: {},
       apiMethods: {
         // menu: 'menuConfirm',
-        // permission: 'permissionConfirm',
         user: 'userConfirm',
         role: 'roleConfirm',
+        station: 'stationConfirm',
+        serviceApi: 'serviceApiConfirm',
+        // permission: 'permissionConfirm',
       },
       form: {},
       ObjInfo: {},
@@ -158,6 +162,11 @@ export default {
           this.detailInfos = stationOptions
           this.formRules = stationFormRules
 
+          break
+        case 'serviceApi':
+          this.detailInfos = serviceApiOptions
+          this.formRules = serviceApiFormRules
+
           break
 
         default:
@@ -286,21 +295,24 @@ export default {
           add: '/insertRole',
           edit: '/deleteRole'
         }
+        const { selectedRowKeys } = this.$refs.treeTable[0]
+        console.log(selectedRowKeys, 'selectedRowKeys')
         const paramsDate = {
           ...this.form
         }
-        if (this.action == 'edit') {
-          paramsDate.role_id = this.record.role_id
-        }
 
-        const res = await postReq(menuApi[this.action], paramsDate)
-        if (res.errcode === 0) {
-          setTimeout(() => {
-            this.handleback()
-          }, 1000)
-        } else {
-          throw res
-        }
+        // if (this.action == 'edit') {
+        //   paramsDate.role_id = this.record.role_id
+        // }
+
+        // const res = await postReq(menuApi[this.action], paramsDate)
+        // if (res.errcode === 0) {
+        //   setTimeout(() => {
+        //     this.handleback()
+        //   }, 1000)
+        // } else {
+        //   throw res
+        // }
       } catch (error) {
         console.log(error, 'roleConfirm')
       }
@@ -330,6 +342,31 @@ export default {
         console.log(error, 'stationConfirm')
       }
     },
+    async serviceApiConfirm() {
+      try {
+        const menuApi = {
+          add: '/insertServiceApi',
+          edit: '/updateServiceApi'
+        }
+        const paramsDate = {
+          ...this.form
+        }
+        if (this.action == 'edit') {
+          paramsDate.api_id = this.record.api_id
+        }
+
+        const res = await postReq(menuApi[this.action], paramsDate)
+        if (res.errcode === 0) {
+          setTimeout(() => {
+            this.handleback()
+          }, 1000)
+        } else {
+          throw res
+        }
+      } catch (error) {
+        console.log(error, 'stationConfirm')
+      }
+    },
     handleback() {
       this.$emit('operateForm', 'back')
     },
@@ -370,4 +407,8 @@ export default {
 :deep(.ant-picker) {
   color: var(--theme-text-default) !important;
 }
+
+:deep(.treeTable) {
+  width: 550px !important;
+}
 </style>