api-我申请的

src/views/mallResourceDevelopment/API/apiByApply/apiDetail/detail.data.ts

-import {BasicColumn, FormSchema} from '@/components/Table';
+import { BasicColumn, FormSchema } from '@/components/Table';
 
 export const configTableColumn: BasicColumn[] = [
   {
@@ -76,3 +76,47 @@ export const powerTableColumn: BasicColumn[] = [
     dataIndex: 'remark',
   },
 ];
+export const applyHistoryColumn: BasicColumn[] = [
+  {
+    title: 'API名称',
+    dataIndex: 'name',
+  },
+  {
+    title: '编目',
+    dataIndex: 'path',
+  },
+  {
+    title: '权属机构',
+    dataIndex: 'dept',
+  },
+  {
+    title: '发布者',
+    dataIndex: 'uploader',
+  },
+  {
+    title: '发布时间',
+    dataIndex: 'uploadTime',
+  },
+  {
+    title: '我的权限',
+    dataIndex: 'downLoad',
+  },
+];
+export const monitorTableColumn: BasicColumn[] = [
+  {
+    title: 'API名称',
+    dataIndex: 'name',
+  },
+  {
+    title: '调用时间',
+    dataIndex: 'time',
+  },
+  {
+    title: '调用时长',
+    dataIndex: 'timeLength',
+  },
+  {
+    title: '当前状态',
+    dataIndex: 'status',
+  },
+];

src/views/mallResourceDevelopment/API/apiByApply/apiDetail/detailData.ts

@@ -59,3 +59,35 @@ export const powerData = [
     remark: null,
   },
 ];
+export const applyHistoryData = [
+  {
+    name: '年度财务报告',
+    path: '财务部/2024/12',
+    dept: '财务管理部',
+    uploader: '张伟',
+    uploadTime: '2024-12-01',
+    downLoad: '下载',
+  },
+  {
+    name: '市场分析报告',
+    path: '市场部/2024/11',
+    dept: '市场营销部',
+    uploader: '李娜',
+    uploadTime: '2024-11-30',
+    downLoad: '下载',
+  },
+];
+export const monitorTableData = [
+  {
+    name: '年度财务报告',
+    time: '2024-11-30 08:00',
+    timeLength: '0.25s',
+    status: '已结束',
+  },
+  {
+    name: '市场分析报告',
+    time: '2024-11-30 09:15',
+    timeLength: '1.50s',
+    status: '已结束',
+  },
+];

src/views/mallResourceDevelopment/API/apiByApply/apiDetail/index.vue

@@ -111,8 +111,12 @@
             </template>
           </BasicTable>
         </TabPane>
-        <TabPane key="2" tab="我的申请记录" />
-        <TabPane key="3" tab="API监控" />
+        <TabPane key="2" tab="我的申请记录">
+          <BasicTable @register="applyHistoryTable" />
+        </TabPane>
+        <TabPane key="3" tab="API监控">
+          <BasicTable @register="monitorTable" />
+        </TabPane>
       </Tabs>
     </template>
   </PageWrapper>
@@ -129,22 +133,27 @@
     FileSearchOutlined,
   } from '@ant-design/icons-vue';
   import { useRoute, useRouter } from 'vue-router';
-  import { onMounted, ref } from 'vue';
-  import { infoList, uploadConfigList, model, powerData } from './detailData';
+  import { ref } from 'vue';
+  import {
+    infoList,
+    uploadConfigList,
+    model,
+    powerData,
+    applyHistoryData,
+    monitorTableData
+  } from './detailData';
   import BasicTable from '@/components/Table/src/BasicTable.vue';
   import { useTable } from '@/components/Table';
-  import { driveListData } from '@/views/dataSourceManage/driveManage/driveData';
-  import { columns, searchSchema } from '@/views/dataSourceManage/driveManage/drive.data';
-  import { apiDocColumnsData } from '@/views/dataService/serviceDevelopment/apiData';
-  import { apiDocColumns } from '@/views/dataService/serviceDevelopment/api.data';
   import {
     backTableColumn,
     powerTableColumn,
   } from '@/views/mallResourceDevelopment/API/publicAPI/apiDetail/detail.data';
   import TableAction from '@/components/Table/src/components/TableAction.vue';
   import { useMessage } from '@/hooks/web/useMessage';
-  import { searchFormSchema } from '@/views/auditLog/audi.data';
-  import { configTableColumn } from '@/views/mallResourceDevelopment/API/apiByApply/apiDetail/detail.data';
+  import {
+    applyHistoryColumn,
+    configTableColumn, monitorTableColumn,
+  } from '@/views/mallResourceDevelopment/API/apiByApply/apiDetail/detail.data';
 
   // 初始化
   const router = useRouter();
@@ -240,6 +249,46 @@
       fixed: undefined,
     },
   } as TableProps);
+  const [applyHistoryTable] = useTable({
+    api: async (params) => {
+      const response = {
+        pageNu: '1',
+        pageSize: '10',
+        pages: '1',
+        total: applyHistoryData.length,
+        code: '',
+        message: '',
+        data: applyHistoryData,
+      };
+      return { ...response };
+    },
+    rowSelection: true,
+    columns: applyHistoryColumn,
+    showTableSetting: false,
+    showIndexColumn: false,
+    bordered: true,
+    scroll: { y: 300 },
+  } as TableProps);
+  const [monitorTable] = useTable({
+    api: async (params) => {
+      const response = {
+        pageNu: '1',
+        pageSize: '10',
+        pages: '1',
+        total: monitorTableData.length,
+        code: '',
+        message: '',
+        data: monitorTableData,
+      };
+      return { ...response };
+    },
+    rowSelection: true,
+    columns: monitorTableColumn,
+    showTableSetting: false,
+    showIndexColumn: false,
+    bordered: true,
+    scroll: { y: 300 },
+  } as TableProps);
 </script>
 
 <style scoped>

src/views/mallResourceDevelopment/API/apiByCreate/detail/index.vue

-<template>
-  <PageWrapper dense contentFullHeight fixedHeight contentClass="flex">
-    <template #headerContent>
-      <div class="flex">
-        <div class="flex-1 header">
-          <LeftOutlined class="h-back" @click="handleBack" />
-          <Icon icon="ion:bag-check-outline" class="h-icon" />
-          <div class="h-txt">
-            <div class="h-des">{{ data.title }}</div>
-            <div class="h-path">{{ data.path }}</div>
-          </div>
-        </div>
-        <div class="h-bt-group">
-          <a-button type="link">
-            <div>
-              <RollbackOutlined class="h-bt-icon" />
-            </div>
-            取消
-          </a-button>
-          <a-button type="link">
-            <div>
-              <SaveOutlined class="h-bt-icon" />
-            </div>
-            保存
-          </a-button>
-          <Divider type="vertical" style="height: 32px" />
-          <a-button type="link">
-            <div>
-              <CloudUploadOutlined class="h-bt-icon" />
-            </div>
-            版本发布
-          </a-button>
-          <a-button type="link">
-            <div>
-              <DownCircleOutlined class="h-bt-icon" />
-            </div>
-            版本管理
-          </a-button>
-          <a-button type="link">
-            <div>
-              <EyeOutlined class="h-bt-icon" />
-            </div>
-            文件预览
-          </a-button>
-          <a-button type="link">
-            <div>
-              <DeleteOutlined class="h-bt-icon" />
-            </div>
-            删除
-          </a-button>
-          <a-button type="link">
-            <div>
-              <UpSquareOutlined class="h-bt-icon" />
-            </div>
-            上架
-          </a-button>
-          <a-button type="link">
-            <div>
-              <EditOutlined class="h-bt-icon" />
-            </div>
-            编辑
-          </a-button>
-        </div>
-      </div>
-    </template>
-    <template #footer>
-    </template>
-  </PageWrapper>
-</template>
-
-<script lang="ts" setup>
-  import { PageWrapper } from '@/components/Page';
-  import Icon from '@/components/Icon/Icon.vue';
-  import { Row, Col, Tabs, TabPane, Input, Select, TableProps, Divider } from 'ant-design-vue';
-  import {
-    ApiOutlined,
-    LeftOutlined,
-    CheckCircleFilled,
-    SearchOutlined,
-    FileSearchOutlined,
-    RollbackOutlined,
-    SaveOutlined,
-    CloudUploadOutlined,
-    DownCircleOutlined,
-    EyeOutlined,
-    DeleteOutlined,
-    UpSquareOutlined,
-    EditOutlined,
-    CheckOutlined,
-  } from '@ant-design/icons-vue';
-  import { useRoute, useRouter } from 'vue-router';
-  import { onMounted, ref } from 'vue';
-  import BasicTable from '@/components/Table/src/BasicTable.vue';
-  import { useTable } from '@/components/Table';
-  import { driveListData } from '@/views/dataSourceManage/driveManage/driveData';
-  import { columns, searchSchema } from '@/views/dataSourceManage/driveManage/drive.data';
-  import { apiDocColumnsData } from '@/views/dataService/serviceDevelopment/apiData';
-  import { apiDocColumns } from '@/views/dataService/serviceDevelopment/api.data';
-  import {
-    backTableColumn,
-    powerTableColumn,
-  } from '@/views/mallResourceDevelopment/API/publicAPI/apiDetail/detail.data';
-  import TableAction from '@/components/Table/src/components/TableAction.vue';
-  import { useMessage } from '@/hooks/web/useMessage';
-  import { searchFormSchema } from '@/views/auditLog/audi.data';
-  import { configTableColumn } from '@/views/mallResourceDevelopment/API/apiByApply/apiDetail/detail.data';
-
-  // 初始化
-  const router = useRouter();
-  const route = useRoute();
-  const { createMessage } = useMessage();
-  // 参数
-  const queryParams = ref({});
-  const activeKey = ref();
-  const bottomKey = ref();
-  const data = route.query;
-  /**
-   * 方法
-   */
-  function handleBack() {
-    router.go(-1);
-  }
-  function handleDoc() {
-    router.push({
-      path: '/mallResourceDevelopment/API/apiByApply/apiDoc',
-    });
-  }
-  function handleRemove() {
-    createMessage.success('取消成功！');
-  }
-  /**
-   * table
-   */
-  const [configTable] = useTable({
-    title: '请求参数',
-    api: async (params) => {
-      const response = {
-        pageNu: '1',
-        pageSize: '10',
-        pages: '1',
-        total: [].length,
-        code: '',
-        message: '',
-        data: [],
-      };
-      return { ...response };
-    },
-    columns: configTableColumn,
-    useSearchForm: false,
-    showTableSetting: false,
-    showIndexColumn: false,
-    bordered: true,
-    scroll: { y: 300 },
-  });
-  const [backTable] = useTable({
-    title: '返回参数',
-    api: async (params) => {
-      const response = {
-        pageNu: '1',
-        pageSize: '10',
-        pages: '1',
-        total: [].length,
-        code: '',
-        message: '',
-        data: [],
-      };
-      return { ...response };
-    },
-    columns: backTableColumn,
-    useSearchForm: false,
-    showTableSetting: false,
-    showIndexColumn: false,
-    bordered: true,
-    scroll: { y: 300 },
-  });
-  const [powerTable, { getSelectRows: getPowerSelectRows }] = useTable({
-    api: async (params) => {
-      const response = {
-        pageNu: '1',
-        pageSize: '10',
-        pages: '1',
-        total: powerData.length,
-        code: '',
-        message: '',
-        data: powerData,
-      };
-      return { ...response };
-    },
-    rowSelection: true,
-    columns: powerTableColumn,
-    showTableSetting: false,
-    showIndexColumn: false,
-    bordered: true,
-    scroll: { y: 300 },
-    actionColumn: {
-      width: 120,
-      title: '取消权限',
-      dataIndex: 'action',
-      fixed: undefined,
-    },
-  } as TableProps);
-</script>
-
-<style scoped>
-  .header {
-    display: flex;
-    flex-direction: row;
-    gap: 10px;
-    .h-back {
-      font-size: 20px;
-    }
-    .h-icon {
-      font-size: 30px !important;
-      color: #0a208a;
-    }
-    .h-txt {
-      display: flex;
-      flex-direction: column;
-      .h-des {
-        font-size: 20px;
-        font-weight: bolder;
-      }
-      .h-path {
-        color: #a4a8b6;
-      }
-    }
-  }
-  .h-bt-group {
-    display: flex;
-    gap: 10px;
-    .h-bt-icon {
-      font-size: 20px;
-    }
-  }
-  .title {
-    font-weight: bolder;
-    margin: 15px 0;
-  }
-  .col-item {
-    display: flex;
-    gap: 10px;
-    .item-label {
-      width: 100px;
-    }
-  }
-  .column-des {
-    display: flex;
-    gap: 10px;
-    .c-icon {
-      font-size: 16px;
-    }
-    .c-text {
-    }
-  }
-  .power-table-form {
-    display: flex;
-    gap: 10px;
-    .power-table-form-item {
-      width: 200px;
-    }
-  }
-</style>