fix: 存储管理基础调整

src/api/infra/infraStorageConfigApi.ts

@@ -2,11 +2,12 @@ import { defHttp } from '/@/utils/http/axios';
 import { setParams } from '/@/utils/index';
 
 enum Api {
-  infraStorageconfigQueryPage = '/infra/storageconfig/query/page',
-  infraStorageconfigDetail = '/infra/storageconfig/detail',
-  infraStorageconfigAdd = '/infra/storageconfig/add',
-  infraStorageconfigEdit = '/infra/storageconfig/edit',
-  infraStorageconfigRemove = '/infra/storageconfig/removeByIds',
+  infraStorageconfigQueryPage = '/sys/storage/config/query/page',
+  infraStorageconfigDetail = '/sys/storage/config/detail',
+  infraStorageconfigAdd = '/sys/storage/config/add',
+  infraStorageconfigEdit = '/sys/storage/config/edit',
+  infraStorageconfigRemove = '/sys/storage/config/removeByIds',
+  infraStorageconfigMaster = '/sys/storage/config/master/',
 }
 
 /**
@@ -98,3 +99,11 @@ export const infraStorageconfigEdit = (params?: object) => {
 export const infraStorageconfigRemove = (params: Array<string | number>) => {
   return defHttp.post({ url: Api.infraStorageconfigRemove, params: params });
 };
+
+/**
+ * @description: 删除,权限 - infra:storageconfig:edit
+ * @method: POST
+ */
+export const infraStorageconfigMaster = (id: string) => {
+  return defHttp.post({ url: Api.infraStorageconfigMaster + id });
+};

src/api/infra/storageRecordApi.ts

@@ -0,0 +1,107 @@
+import { defHttp } from '/@/utils/http/axios';
+import { setParams } from '/@/utils/index';
+
+enum Api {
+  storageRecordQueryPage = '/sys/storage/record/query/page',
+  storageRecordDetail = '/sys/storage/record/detail',
+  storageRecordAdd = '/sys/storage/record/add',
+  storageRecordEdit = '/sys/storage/record/edit',
+  storageRecordRemove = '/sys/storage/record/removeByIds',
+}
+
+/**
+ *
+ * @author lf
+ * @date  2023/05/11 10:43
+ * @description: 根据条件查询存储记录列表,权限 - storage:record:query
+ * @method: POST
+ * @param:
+ *       {String}  name  like   文件名称
+ * @return:
+ *       {String}  name  文件名称
+ *       {String}  absolutePath  绝对路径
+ *       {String}  storagePath  存储路径
+ *       {String}  bizPath  业务路径
+ *       {String}  configId  存储配置id
+ *       {Integer}  size  文件大小
+ *       {String}  suffix  文件后缀
+ *       {String}  cateId  所属目录id
+ */
+
+export const storageRecordQueryPage = (params?: object) => {
+  return defHttp.post({ url: Api.storageRecordQueryPage, params: setParams(params) });
+};
+/**
+ *
+ * @author lf
+ * @date  2023/05/11 10:43
+ * @description: 根据id查询存储记录详细信息,权限 - storage:record:query
+ * @method: GET
+ * @param:  id 存储记录主键id
+ * @return:
+ *       {String}  name  文件名称
+ *       {String}  absolutePath  绝对路径
+ *       {String}  storagePath  存储路径
+ *       {String}  bizPath  业务路径
+ *       {String}  configId  存储配置id
+ *       {Integer}  size  文件大小
+ *       {String}  suffix  文件后缀
+ *       {String}  cateId  所属目录id
+ */
+export const storageRecordDetail = (id: string) => {
+  return defHttp.get({ url: Api.storageRecordDetail + '/' + id });
+};
+
+/**
+ *
+ * @author lf
+ * @date  2023/05/11 10:43
+ * @description: 添加存储记录,权限 - storage:record:add
+ * @method: POST
+ * @param:
+ *       {String}  name  文件名称
+ *       {String}  absolutePath  绝对路径
+ *       {String}  storagePath  存储路径
+ *       {String}  bizPath  业务路径
+ *       {String}  configId  存储配置id
+ *       {Integer}  size  文件大小
+ *       {String}  suffix  文件后缀
+ *       {String}  cateId  所属目录id
+ * @return:
+ *       0 添加失败
+ *       1 添加成功
+ */
+export const storageRecordAdd = (params?: object) => {
+  return defHttp.post({ url: Api.storageRecordAdd, params: params });
+};
+
+/**
+ *
+ * @author lf
+ * @date  2023/05/11 10:43
+ * @description: 通过主键id编辑存储记录,权限 - storage:record:edit
+ * @method: POST
+ * @param:
+ *       {String}  name  文件名称
+ *       {String}  absolutePath  绝对路径
+ *       {String}  storagePath  存储路径
+ *       {String}  bizPath  业务路径
+ *       {String}  configId  存储配置id
+ *       {Integer}  size  文件大小
+ *       {String}  suffix  文件后缀
+ *       {String}  cateId  所属目录id
+ * @return:
+ *       0 编辑失败
+ *       1 编辑成功
+ */
+export const storageRecordEdit = (params?: object) => {
+  return defHttp.post({ url: Api.storageRecordEdit, params: params });
+};
+
+/**
+ * @description: 删除,权限 - storage:record:remove
+ * @method: POST
+ */
+export const storageRecordRemove = (params: Array<string | number>) => {
+  return defHttp.post({ url: Api.storageRecordRemove, params: params });
+};

src/views/infra/oss/data.ts

@@ -1,145 +0,0 @@
-import { DescItem } from '/@/components/Description';
-import { BasicColumn, FormSchema } from '/@/components/Table';
-
-export const columns: BasicColumn[] = [
-  {
-    title: '文件配置编码',
-    dataIndex: 'code',
-  },
-  {
-    title: '文件配置名称',
-    dataIndex: 'name',
-  },
-  {
-    title: '主配置',
-    dataIndex: 'master',
-  },
-  {
-    title: '存储类型',
-    dataIndex: 'type',
-  },
-  {
-    title: '文件配置',
-    dataIndex: 'config',
-  },
-  {
-    title: '备注',
-    dataIndex: 'remark',
-  },
-];
-
-// 表单列定义
-export const searchFormSchema: FormSchema[] = [
-  {
-    label: '文件配置名称',
-    field: 'name',
-    component: 'Input',
-    componentProps: {
-      placeholder: '请输入文件配置名称',
-    },
-  },
-  {
-    label: '存储类型',
-    field: 'type',
-    component: 'Input',
-    componentProps: {
-      placeholder: '请输入存储类型',
-    },
-  },
-];
-// 表单新增编辑
-export const dataFormSchema: FormSchema[] = [
-  {
-    label: '文件配置编码',
-    field: 'code',
-    required: true,
-    component: 'Input',
-    componentProps: {
-      placeholder: '请输入文件配置编码',
-    },
-  },
-  {
-    label: '文件配置名称',
-    field: 'name',
-    required: true,
-    component: 'Input',
-    componentProps: {
-      placeholder: '请输入文件配置名称',
-    },
-  },
-  {
-    label: '主配置',
-    field: 'master',
-    required: true,
-    component: 'Input',
-    componentProps: {
-      placeholder: '请输入主配置',
-    },
-  },
-  {
-    label: '存储类型',
-    field: 'type',
-    required: true,
-    component: 'Input',
-    componentProps: {
-      placeholder: '请输入存储类型',
-    },
-  },
-  {
-    label: '文件配置',
-    field: 'config',
-    required: true,
-    component: 'Input',
-    componentProps: {
-      placeholder: '请输入文件配置',
-    },
-  },
-  {
-    label: '备注',
-    field: 'remark',
-    required: true,
-    component: 'Input',
-    componentProps: {
-      placeholder: '请输入备注',
-    },
-  },
-];
-// 表单详情查看
-export const viewSchema: DescItem[] = [
-  {
-    label: '文件配置主键',
-    field: 'id',
-  },
-  {
-    label: '文件配置编码',
-    field: 'code',
-  },
-  {
-    label: '文件配置名称',
-    field: 'name',
-  },
-  {
-    label: '主配置',
-    field: 'master',
-  },
-  {
-    label: '存储类型',
-    field: 'type',
-  },
-  {
-    label: '文件配置',
-    field: 'config',
-  },
-  {
-    label: '备注',
-    field: 'remark',
-  },
-  {
-    label: '创建时间',
-    field: 'createTime',
-  },
-  {
-    label: '更新时间',
-    field: 'updateTime',
-  },
-];

src/views/infra/storage/list/data.ts

@@ -0,0 +1,163 @@
+import { DescItem } from '/@/components/Description';
+import { BasicColumn, FormSchema } from '/@/components/Table';
+
+export const columns: BasicColumn[] = [
+  {
+    title: '文件名称',
+    dataIndex: 'name',
+  },
+  {
+    title: '绝对路径',
+    dataIndex: 'absolutePath',
+  },
+  {
+    title: '存储路径',
+    dataIndex: 'storagePath',
+  },
+  {
+    title: '业务路径',
+    dataIndex: 'bizPath',
+  },
+  {
+    title: '存储配置id',
+    dataIndex: 'configId',
+  },
+  {
+    title: '文件大小',
+    dataIndex: 'size',
+  },
+  {
+    title: '文件后缀',
+    dataIndex: 'suffix',
+  },
+  {
+    title: '所属目录id',
+    dataIndex: 'cateId',
+  },
+];
+
+// 表单列定义
+export const searchFormSchema: FormSchema[] = [
+  {
+    label: '文件名称',
+    field: 'name',
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入文件名称',
+    },
+  },
+];
+// 表单新增编辑
+export const dataFormSchema: FormSchema[] = [
+  {
+    label: '文件名称',
+    field: 'name',
+    required: true,
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入文件名称',
+    },
+  },
+  {
+    label: '绝对路径',
+    field: 'absolutePath',
+    required: true,
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入绝对路径',
+    },
+  },
+  {
+    label: '存储路径',
+    field: 'storagePath',
+    required: true,
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入存储路径',
+    },
+  },
+  {
+    label: '业务路径',
+    field: 'bizPath',
+    required: true,
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入业务路径',
+    },
+  },
+  {
+    label: '存储配置id',
+    field: 'configId',
+    required: true,
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入存储配置id',
+    },
+  },
+  {
+    label: '文件大小',
+    field: 'size',
+    required: true,
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入文件大小',
+    },
+  },
+  {
+    label: '文件后缀',
+    field: 'suffix',
+    required: true,
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入文件后缀',
+    },
+  },
+  {
+    label: '所属目录id',
+    field: 'cateId',
+    required: true,
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入所属目录id',
+    },
+  },
+];
+// 表单详情查看
+export const viewSchema: DescItem[] = [
+  {
+    label: '存储记录id',
+    field: 'id',
+  },
+  {
+    label: '文件名称',
+    field: 'name',
+  },
+  {
+    label: '绝对路径',
+    field: 'absolutePath',
+  },
+  {
+    label: '存储路径',
+    field: 'storagePath',
+  },
+  {
+    label: '业务路径',
+    field: 'bizPath',
+  },
+  {
+    label: '存储配置id',
+    field: 'configId',
+  },
+  {
+    label: '文件大小',
+    field: 'size',
+  },
+  {
+    label: '文件后缀',
+    field: 'suffix',
+  },
+  {
+    label: '所属目录id',
+    field: 'cateId',
+  },
+];

src/views/infra/oss/formDrawer.vue → src/views/infra/storage/list/formDrawer.vue

@@ -1,75 +1,75 @@
-<template>
-  <BasicDrawer
-    v-bind="$attrs"
-    destroyOnClose
-    @register="registerDrawer"
-    :title="getTitle"
-    :width="width"
-    @ok="handleSubmit"
-    :showFooter="true"
-  >
-    <BasicForm @register="registerForm" layout="vertical" />
-  </BasicDrawer>
-</template>
-<script lang="ts" setup>
-  import { ref, computed, unref } from 'vue';
-  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
-  import { BasicForm, useForm } from '/@/components/Form';
-  import { useMessage } from '/@/hooks/web/useMessage';
-  import { dataFormSchema } from './data';
-
-  import {
-    infraStorageconfigAdd,
-    infraStorageconfigEdit,
-    infraStorageconfigDetail,
-  } from '/@/api/infra/infraStorageconfigApi';
-
-  const emit = defineEmits(['success', 'register']);
-
-  const getTitle = computed(() => (!unref(isUpdate) ? '新增文件存储配置' : '编辑文件存储配置'));
-  const width = '45%';
-  const isUpdate = ref(false);
-  const rowId = ref();
-
-  const { createMessage } = useMessage();
-  const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
-    labelWidth: 100,
-    schemas: dataFormSchema,
-    showActionButtonGroup: false,
-    actionColOptions: {
-      span: 23,
-    },
-  });
-  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async data => {
-    await resetFields();
-    setDrawerProps({ confirmLoading: false });
-    isUpdate.value = !!data?.isUpdate;
-
-    if (unref(isUpdate)) {
-      const resData = await infraStorageconfigDetail(data.record.id);
-      rowId.value = resData.id;
-      await setFieldsValue({
-        ...resData,
-      });
-    }
-  });
-
-  // 提交按钮事件
-  async function handleSubmit() {
-    try {
-      const values = await validate();
-      setDrawerProps({ confirmLoading: true });
-      !unref(isUpdate)
-        ? await infraStorageconfigAdd({ ...values })
-        : await infraStorageconfigEdit({ ...values, id: rowId.value });
-      !unref(isUpdate) ? createMessage.success('新增成功！') : createMessage.success('编辑成功！');
-      closeDrawer();
-      emit('success', {
-        isUpdate: unref(isUpdate),
-        values: { ...values, id: rowId.value },
-      });
-    } finally {
-      setDrawerProps({ confirmLoading: false });
-    }
-  }
-</script>
+<template>
+  <BasicDrawer
+    v-bind="$attrs"
+    destroyOnClose
+    @register="registerDrawer"
+    :title="getTitle"
+    :width="width"
+    @ok="handleSubmit"
+    :showFooter="true"
+  >
+    <BasicForm @register="registerForm" layout="vertical" />
+  </BasicDrawer>
+</template>
+<script lang="ts" setup>
+  import { ref, computed, unref } from 'vue';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+  import { BasicForm, useForm } from '/@/components/Form';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { dataFormSchema } from './data';
+
+  import {
+    storageRecordAdd,
+    storageRecordEdit,
+    storageRecordDetail,
+  } from '/@/api/infra/storageRecordApi';
+
+  const emit = defineEmits(['success', 'register']);
+
+  const getTitle = computed(() => (!unref(isUpdate) ? '新增存储记录' : '编辑存储记录'));
+  const width = '45%';
+  const isUpdate = ref(false);
+  const rowId = ref();
+
+  const { createMessage } = useMessage();
+  const [registerForm, { setFieldsValue, resetFields, validate }] = useForm({
+    labelWidth: 100,
+    schemas: dataFormSchema,
+    showActionButtonGroup: false,
+    actionColOptions: {
+      span: 23,
+    },
+  });
+  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async data => {
+    await resetFields();
+    setDrawerProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+
+    if (unref(isUpdate)) {
+      const resData = await storageRecordDetail(data.record.id);
+      rowId.value = resData.id;
+      await setFieldsValue({
+        ...resData,
+      });
+    }
+  });
+
+  // 提交按钮事件
+  async function handleSubmit() {
+    try {
+      const values = await validate();
+      setDrawerProps({ confirmLoading: true });
+      !unref(isUpdate)
+        ? await storageRecordAdd({ ...values })
+        : await storageRecordEdit({ ...values, id: rowId.value });
+      !unref(isUpdate) ? createMessage.success('新增成功！') : createMessage.success('编辑成功！');
+      closeDrawer();
+      emit('success', {
+        isUpdate: unref(isUpdate),
+        values: { ...values, id: rowId.value },
+      });
+    } finally {
+      setDrawerProps({ confirmLoading: false });
+    }
+  }
+</script>

src/views/infra/oss/index.vue → src/views/infra/storage/list/index.vue

@@ -1,189 +1,185 @@
-<template>
-  <div>
-    <BasicTable @register="registerTable">
-      <template #bodyCell="{ column, record }">
-        <template v-if="column.key === 'action'">
-          <TableAction
-            :actions="[
-              {
-                auth: 'infra:storageconfig:query',
-                icon: 'icon-eye|iconfont',
-                tooltip: '查看',
-                label: '查看',
-                onClick: handleView.bind(null, record),
-              },
-              {
-                auth: 'infra:storageconfig:edit',
-                icon: 'icon-edit|iconfont',
-                tooltip: '编辑',
-                label: '编辑',
-                onClick: handleEdit.bind(null, record),
-              },
-              {
-                auth: 'infra:storageconfig:remove',
-                icon: 'icon-delete|iconfont',
-                tooltip: '删除',
-                label: '删除',
-                color: 'error',
-                popConfirm: {
-                  title: '是否确认删除',
-                  placement: 'left',
-                  confirm: handleDelete.bind(null, record),
-                },
-              },
-            ]"
-          />
-        </template>
-      </template>
-      <template #toolbar>
-        <Button
-          v-auth="['infra:storageconfig:add']"
-          type="primary"
-          @click="handleCreate"
-          preIcon="icon-plus|iconfont"
-        >
-          新增
-        </Button>
-        <Button
-          v-auth="['infra:storageconfig:remove']"
-          type="primary"
-          danger
-          @click="handleDelete(null)"
-          preIcon="icon-delete|iconfont"
-        >
-          批量删除
-        </Button>
-      </template>
-    </BasicTable>
-    <FormDrawer @register="registerDrawer" @success="handleSuccess" />
-    <ViewDrawer @register="registerDrawerView" @success="handleSuccess" />
-  </div>
-</template>
-<script lang="ts" setup>
-  import { onBeforeMount, ref } from 'vue';
-  import { Button } from '/@/components/Button';
-
-  import { BasicTable, useTable, TableAction } from '/@/components/Table';
-
-  // import { useModal } from '/@/components/Modal';
-  import { useMessage } from '/@/hooks/web/useMessage';
-  import FormDrawer from './formDrawer.vue';
-  import ViewDrawer from './viewDrawer.vue';
-  import { columns, searchFormSchema } from './data';
-
-  import {
-    infraStorageconfigQueryPage,
-    infraStorageconfigRemove,
-  } from '/@/api/infra/infraStorageconfigApi';
-  import { useDrawer } from '/@/components/Drawer';
-
-  onBeforeMount(async () => {});
-
-  const { createConfirm, createMessage } = useMessage();
-  // const [registerModal, { openModal }] = useModal();
-  const [registerDrawer, { openDrawer }] = useDrawer();
-  const [registerDrawerView, { openDrawer: openDrawerView }] = useDrawer();
-
-  const tableSort = ref([
-    {
-      field: 'create_time',
-      direction: 'DESC',
-    },
-  ]) as any;
-
-  const [registerTable, { reload, getSelectRowKeys }] = useTable({
-    title: '文件存储配置 ',
-    api: infraStorageconfigQueryPage,
-    rowKey: 'id',
-    columns,
-    showIndexColumn: true,
-    rowSelection: { type: 'checkbox' },
-    formConfig: {
-      labelWidth: 120,
-      schemas: searchFormSchema,
-      autoSubmitOnEnter: true,
-      baseColProps: { xs: 24, sm: 12, md: 12, lg: 8 },
-      resetButtonOptions: {
-        preIcon: 'icon-delete|iconfont',
-      },
-      submitButtonOptions: {
-        preIcon: 'icon-search|iconfont',
-      },
-    },
-    useSearchForm: true,
-    bordered: true,
-    actionColumn: {
-      width: 200,
-      title: '操作',
-      dataIndex: 'action',
-    },
-    beforeFetch: handleBeforeFetch,
-    sortFn: handleSortFn,
-  });
-  // 详情按钮事件
-  function handleView(record: Recordable) {
-    console.log(record);
-    openDrawerView(true, {
-      record,
-    });
-  }
-
-  // 新增按钮事件
-  function handleCreate() {
-    openDrawer(true, {
-      isUpdate: false,
-    });
-  }
-
-  // 编辑按钮事件
-  function handleEdit(record: Recordable) {
-    openDrawer(true, {
-      record,
-      isUpdate: true,
-    });
-  }
-
-  // 删除按钮事件
-  async function handleDelete(record: Recordable) {
-    if (record) {
-      await infraStorageconfigRemove([record.id]);
-      createMessage.success('删除成功！');
-      await reload();
-    } else {
-      createConfirm({
-        content: '你确定要删除?',
-        iconType: 'warning',
-        onOk: async () => {
-          const keys = getSelectRowKeys();
-          await infraStorageconfigRemove(keys);
-          createMessage.success('删除成功！');
-          await reload();
-        },
-      });
-    }
-  }
-  // 表格点击字段排序
-  function handleSortFn(sortInfo) {
-    if (sortInfo?.order && sortInfo?.columnKey) {
-      // 默认单列排序
-      tableSort.value = [
-        {
-          field: sortInfo.columnKey,
-          direction: sortInfo.order.replace(/(\w+)(end)/g, '$1').toUpperCase(),
-        },
-      ];
-    }
-  }
-
-  // 表格请求之前，对参数进行处理, 添加默认 排序
-  function handleBeforeFetch(params) {
-    return { ...params, orders: tableSort.value };
-  }
-
-  // 弹窗回调事件
-  async function handleSuccess({ isUpdate, values }) {
-    console.log(isUpdate);
-    console.log(values);
-    await reload();
-  }
-</script>
+<template>
+  <div>
+    <BasicTable @register="registerTable">
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'size'"> {{ record.size }} kb </template>
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              {
+                auth: 'storage:record:query',
+                icon: 'icon-eye|iconfont',
+                tooltip: '查看',
+                label: '查看',
+                onClick: handleView.bind(null, record),
+              },
+              {
+                auth: 'storage:record:edit',
+                icon: 'icon-edit|iconfont',
+                tooltip: '编辑',
+                label: '编辑',
+                onClick: handleEdit.bind(null, record),
+              },
+              {
+                auth: 'storage:record:remove',
+                icon: 'icon-delete|iconfont',
+                tooltip: '删除',
+                label: '删除',
+                color: 'error',
+                popConfirm: {
+                  title: '是否确认删除',
+                  placement: 'left',
+                  confirm: handleDelete.bind(null, record),
+                },
+              },
+            ]"
+          />
+        </template>
+      </template>
+      <template #toolbar>
+        <Button
+          v-auth="['storage:record:add']"
+          type="primary"
+          @click="handleCreate"
+          preIcon="icon-plus|iconfont"
+        >
+          新增
+        </Button>
+        <Button
+          v-auth="['storage:record:remove']"
+          type="primary"
+          danger
+          @click="handleDelete(null)"
+          preIcon="icon-delete|iconfont"
+        >
+          批量删除
+        </Button>
+      </template>
+    </BasicTable>
+    <FormDrawer @register="registerDrawer" @success="handleSuccess" />
+    <ViewDrawer @register="registerDrawerView" @success="handleSuccess" />
+  </div>
+</template>
+<script lang="ts" setup>
+  import { onBeforeMount, ref } from 'vue';
+  import { Button } from '/@/components/Button';
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
+
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import FormDrawer from './formDrawer.vue';
+  import ViewDrawer from './viewDrawer.vue';
+  import { columns, searchFormSchema } from './data';
+
+  import { storageRecordQueryPage, storageRecordRemove } from '/@/api/infra/storageRecordApi';
+  import { useDrawer } from '/@/components/Drawer';
+
+  onBeforeMount(async () => {});
+
+  const { createConfirm, createMessage } = useMessage();
+  // const [registerModal, { openModal }] = useModal();
+  const [registerDrawer, { openDrawer }] = useDrawer();
+  const [registerDrawerView, { openDrawer: openDrawerView }] = useDrawer();
+
+  const tableSort = ref([
+    {
+      field: 'create_time',
+      direction: 'DESC',
+    },
+  ]) as any;
+
+  const [registerTable, { reload, getSelectRowKeys }] = useTable({
+    title: ' ',
+    api: storageRecordQueryPage,
+    rowKey: 'id',
+    columns,
+    showIndexColumn: true,
+    rowSelection: { type: 'checkbox' },
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+      autoSubmitOnEnter: true,
+      baseColProps: { xs: 24, sm: 12, md: 12, lg: 8 },
+      resetButtonOptions: {
+        preIcon: 'icon-delete|iconfont',
+      },
+      submitButtonOptions: {
+        preIcon: 'icon-search|iconfont',
+      },
+    },
+    useSearchForm: true,
+    bordered: true,
+    actionColumn: {
+      width: 200,
+      title: '操作',
+      dataIndex: 'action',
+    },
+    beforeFetch: handleBeforeFetch,
+    sortFn: handleSortFn,
+  });
+  // 详情按钮事件
+  function handleView(record: Recordable) {
+    console.log(record);
+    openDrawerView(true, {
+      record,
+    });
+  }
+
+  // 新增按钮事件
+  function handleCreate() {
+    openDrawer(true, {
+      isUpdate: false,
+    });
+  }
+
+  // 编辑按钮事件
+  function handleEdit(record: Recordable) {
+    openDrawer(true, {
+      record,
+      isUpdate: true,
+    });
+  }
+
+  // 删除按钮事件
+  async function handleDelete(record: Recordable) {
+    if (record) {
+      await storageRecordRemove([record.id]);
+      createMessage.success('删除成功！');
+      await reload();
+    } else {
+      createConfirm({
+        content: '你确定要删除?',
+        iconType: 'warning',
+        onOk: async () => {
+          const keys = getSelectRowKeys();
+          await storageRecordRemove(keys);
+          createMessage.success('删除成功！');
+          await reload();
+        },
+      });
+    }
+  }
+  // 表格点击字段排序
+  function handleSortFn(sortInfo) {
+    if (sortInfo?.order && sortInfo?.columnKey) {
+      // 默认单列排序
+      tableSort.value = [
+        {
+          field: sortInfo.columnKey,
+          direction: sortInfo.order.replace(/(\w+)(end)/g, '$1').toUpperCase(),
+        },
+      ];
+    }
+  }
+
+  // 表格请求之前，对参数进行处理, 添加默认 排序
+  function handleBeforeFetch(params) {
+    return { ...params, orders: tableSort.value };
+  }
+
+  // 弹窗回调事件
+  async function handleSuccess({ isUpdate, values }) {
+    console.log(isUpdate);
+    console.log(values);
+    await reload();
+  }
+</script>

src/views/infra/oss/viewDrawer.vue → src/views/infra/storage/list/viewDrawer.vue

@@ -1,40 +1,38 @@
-<template>
-  <BasicDrawer
-    v-bind="$attrs"
-    destroyOnClose
-    @register="registerDrawer"
-    :title="getTitle"
-    :width="width"
-  >
-    <Description @register="registerDesc" :data="descData" />
-  </BasicDrawer>
-</template>
-<script lang="ts" setup>
-  import { onBeforeMount, ref } from 'vue'; // onBeforeMount,
-  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
-  import { Description, useDescription } from '/@/components/Description';
-  import { viewSchema } from './data';
-
-  import { infraStorageconfigDetail } from '/@/api/infra/infraStorageconfigApi';
-
-  const descData = ref({});
-  const getTitle = '查看文件存储配置';
-  const width = '45%';
-
-  onBeforeMount(async () => {});
-  const [registerDrawer] = useDrawerInner(async data => {
-    console.log('::::::::::', data.record);
-    const resData = await infraStorageconfigDetail(data.record.id);
-    descData.value = {
-      ...resData,
-    };
-  });
-  const [registerDesc] = useDescription({
-    schema: viewSchema,
-    column: 2,
-    size: 'middle',
-    labelStyle: {
-      width: '120px',
-    },
-  });
-</script>
+<template>
+  <BasicDrawer
+    v-bind="$attrs"
+    destroyOnClose
+    @register="registerDrawer"
+    :title="getTitle"
+    :width="width"
+  >
+    <Description @register="registerDesc" :data="descData" />
+  </BasicDrawer>
+</template>
+<script lang="ts" setup>
+  import { onBeforeMount, ref } from 'vue'; // onBeforeMount,
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+  import { Description, useDescription } from '/@/components/Description';
+  import { viewSchema } from './data';
+  import { storageRecordDetail } from '/@/api/infra/storageRecordApi';
+
+  const descData = ref({});
+  const getTitle = '查看存储记录';
+  const width = '45%';
+
+  onBeforeMount(async () => {});
+  const [registerDrawer] = useDrawerInner(async data => {
+    const resData = await storageRecordDetail(data.record.id);
+    descData.value = {
+      ...resData,
+    };
+  });
+  const [registerDesc] = useDescription({
+    schema: viewSchema,
+    column: 2,
+    size: 'middle',
+    labelStyle: {
+      width: '120px',
+    },
+  });
+</script>

src/views/infra/storage/oss/data.ts

@@ -0,0 +1,461 @@
+import { DescItem } from '/@/components/Description';
+import { BasicColumn, FormSchema } from '/@/components/Table';
+import { radioBoolean } from '/@/utils/filters';
+
+export const columns: BasicColumn[] = [
+  {
+    title: '配置名称',
+    dataIndex: 'name',
+  },
+  {
+    title: '主配置',
+    dataIndex: 'master',
+  },
+  {
+    title: '存储类型',
+    dataIndex: 'type',
+  },
+];
+
+// 表单列定义
+export const searchFormSchema: FormSchema[] = [
+  {
+    label: '配置名称',
+    field: 'name',
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入配置名称',
+    },
+  },
+  {
+    label: '存储类型',
+    field: 'type',
+    component: 'Select',
+    componentProps: {
+      placeholder: '请选择存储类型',
+      options: [
+        {
+          label: '阿里云',
+          value: 'ali',
+        },
+        {
+          label: '数据库',
+          value: 'db',
+        },
+        {
+          label: '本地存储',
+          value: '1ocal',
+        },
+        {
+          label: 'minio存储',
+          value: 'minio',
+        },
+        {
+          label: '七牛云存储',
+          value: 'qiniu',
+        },
+      ],
+    },
+  },
+];
+// 表单新增编辑
+export const dataFormSchema: FormSchema[] = [
+  {
+    label: '配置名称',
+    field: 'name',
+    required: true,
+    component: 'Input',
+    componentProps: {
+      placeholder: '请输入配置名称',
+    },
+  },
+  {
+    label: '主配置',
+    field: 'master',
+    required: true,
+    component: 'RadioGroup',
+    componentProps: {
+      placeholder: '请输入主配置',
+      options: radioBoolean,
+      disabled: false,
+    },
+    defaultValue: 0,
+  },
+  {
+    label: '存储类型',
+    field: 'type',
+    component: 'Select',
+    required: true,
+    componentProps: {
+      placeholder: '请选择存储类型',
+      options: [
+        {
+          label: '阿里云',
+          value: 'ali',
+        },
+        {
+          label: '数据库',
+          value: 'db',
+        },
+        {
+          label: '本地存储',
+          value: 'local',
+        },
+        {
+          label: 'minio存储',
+          value: 'minio',
+        },
+        {
+          label: '七牛云存储',
+          value: 'qiniu',
+        },
+      ],
+    },
+  },
+  {
+    label: '配置参数',
+    helpMessage: '配置参数',
+    field: 'configDividers',
+    component: 'Divider',
+    ifShow: ({ values }) => {
+      return values.type;
+    },
+    helpComponentProps: {
+      fontSize: '16px',
+    },
+  },
+  /**
+   * 阿里云配置
+   */
+  {
+    label: '密令',
+    field: 'config.accessKey',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'ali';
+    },
+    componentProps: {
+      placeholder: '请输入密令',
+    },
+  },
+  {
+    label: '密钥',
+    field: 'config.accessSecret',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'ali';
+    },
+    componentProps: {
+      placeholder: '请输入密钥',
+    },
+  },
+  {
+    label: '地域节点',
+    field: 'config.endpoint',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'ali';
+    },
+    componentProps: {
+      placeholder: '请输入地域节点',
+    },
+  },
+  {
+    label: '桶名称',
+    field: 'config.bucketName',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'ali';
+    },
+    componentProps: {
+      placeholder: '请输入桶名称',
+    },
+  },
+  /**
+   * 数据库配置
+   */
+  {
+    label: '自定义域名',
+    field: 'config.domain',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'db';
+    },
+    componentProps: {
+      placeholder: '请输入自定义域名',
+    },
+  },
+  /**
+   * 本地配置
+   */
+  {
+    label: '基础路径',
+    field: 'config.basePath',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'local';
+    },
+    componentProps: {
+      placeholder: '请输入基础路径',
+    },
+  },
+  {
+    label: '自定义域名',
+    field: 'config.domain',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'local';
+    },
+    componentProps: {
+      placeholder: '请输入自定义域名',
+    },
+  },
+  /**
+   * minio配置
+   */
+  {
+    label: '上传地址',
+    field: 'config.httpUrl',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'minio';
+    },
+    componentProps: {
+      placeholder: '请输入上传地址',
+    },
+  },
+  {
+    label: '密令',
+    field: 'config.accessKey',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'minio';
+    },
+    componentProps: {
+      placeholder: '请输入密令',
+    },
+  },
+  {
+    label: ' 密钥',
+    field: 'config.accessSecret',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'minio';
+    },
+    componentProps: {
+      placeholder: '请输入密钥',
+    },
+  },
+  {
+    label: '桶名称',
+    field: 'config.bucketName',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'minio';
+    },
+    componentProps: {
+      placeholder: '请输入桶名称',
+    },
+  },
+  /**
+   * 七牛配置
+   */
+
+  {
+    label: '密令',
+    field: 'config.accessKey',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'qiniu';
+    },
+    componentProps: {
+      placeholder: '请输入密令',
+    },
+  },
+  {
+    label: ' 密钥',
+    field: 'config.accessSecret',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'qiniu';
+    },
+    componentProps: {
+      placeholder: '请输入密钥',
+    },
+  },
+  {
+    label: '桶名称',
+    field: 'config.bucketName',
+    required: true,
+    component: 'Input',
+    ifShow: ({ values }) => {
+      return values.type == 'qiniu';
+    },
+    componentProps: {
+      placeholder: '请输入桶名称',
+    },
+  },
+  {
+    label: '备注',
+    helpMessage: '备注',
+    field: 'remarkDividers',
+    component: 'Divider',
+    helpComponentProps: {
+      fontSize: '16px',
+    },
+  },
+  {
+    label: '备注',
+    field: 'remark',
+    component: 'InputTextArea',
+    componentProps: {
+      placeholder: '请输入备注',
+    },
+  },
+];
+// 表单详情查看
+export const viewSchema: DescItem[] = [
+  {
+    label: '配置名称',
+    field: 'name',
+  },
+  {
+    label: '主配置',
+    field: 'master',
+  },
+  {
+    label: '存储类型',
+    field: 'types',
+  },
+  /**
+   * 阿里云配置
+   */
+  {
+    label: '密令',
+    field: 'config.accessKey',
+    show: ({ ...values }) => {
+      return values.type == 'ali';
+    },
+  },
+  {
+    label: '密钥',
+    field: 'config.accessSecret',
+    show: ({ ...values }) => {
+      return values.type == 'ali';
+    },
+  },
+  {
+    label: '地域节点',
+    field: 'config.endpoint',
+    show: ({ ...values }) => {
+      return values.type == 'ali';
+    },
+  },
+  {
+    label: '桶名称',
+    field: 'config.bucketName',
+    show: ({ ...values }) => {
+      return values.type == 'ali';
+    },
+  },
+  /**
+   * 数据库配置
+   */
+  {
+    label: '自定义域名',
+    field: 'config.domain',
+    show: ({ ...values }) => {
+      return values.type == 'db';
+    },
+  },
+  /**
+   * 本地配置
+   */
+  {
+    label: '基础路径',
+    field: 'config.basePath',
+    show: ({ ...values }) => {
+      return values.type == 'local';
+    },
+  },
+  {
+    label: '自定义域名',
+    field: 'config.domain',
+    show: ({ ...values }) => {
+      return values.type == 'local';
+    },
+  },
+  /**
+   * minio配置
+   */
+  {
+    label: '上传地址',
+    field: 'config.httpUrl',
+    show: ({ ...values }) => {
+      return values.type == 'minio';
+    },
+  },
+  {
+    label: '密令',
+    field: 'config.accessKey',
+    show: ({ ...values }) => {
+      return values.type == 'minio';
+    },
+  },
+  {
+    label: ' 密钥',
+    field: 'config.accessSecret',
+    show: ({ ...values }) => {
+      return values.type == 'minio';
+    },
+  },
+  {
+    label: '桶名称',
+    field: 'config.bucketName',
+    show: ({ ...values }) => {
+      return values.type == 'minio';
+    },
+  },
+  /**
+   * 七牛配置
+   */
+
+  {
+    label: '密令',
+    field: 'config.accessKey',
+    show: ({ ...values }) => {
+      return values.type == 'qiniu';
+    },
+  },
+  {
+    label: ' 密钥',
+    field: 'config.accessSecret',
+    show: ({ ...values }) => {
+      return values.type == 'qiniu';
+    },
+  },
+  {
+    label: '桶名称',
+    field: 'config.bucketName',
+    show: ({ ...values }) => {
+      return values.type == 'qiniu';
+    },
+  },
+  {
+    label: '备注',
+    field: 'remark',
+  },
+];

src/views/infra/storage/oss/formDrawer.vue

@@ -0,0 +1,97 @@
+<template>
+  <BasicDrawer
+    v-bind="$attrs"
+    destroyOnClose
+    @register="registerDrawer"
+    :title="getTitle"
+    :width="width"
+    @ok="handleSubmit"
+    :showFooter="true"
+  >
+    <BasicForm @register="registerForm" layout="vertical" />
+  </BasicDrawer>
+</template>
+<script lang="ts" setup>
+  import { ref, computed, unref } from 'vue';
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+  import { BasicForm, useForm } from '/@/components/Form';
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import { dataFormSchema } from './data';
+
+  import {
+    infraStorageconfigAdd,
+    infraStorageconfigEdit,
+    infraStorageconfigDetail,
+  } from '/@/api/infra/infraStorageConfigApi';
+
+  const emit = defineEmits(['success', 'register']);
+
+  const getTitle = computed(() => (!unref(isUpdate) ? '新增存储配置' : '编辑存储配置'));
+  const width = '45%';
+  const isUpdate = ref(false);
+  const rowId = ref();
+
+  const { createMessage } = useMessage();
+  const [registerForm, { setFieldsValue, resetFields, validate, updateSchema }] = useForm({
+    labelWidth: 100,
+    schemas: dataFormSchema,
+    showActionButtonGroup: false,
+    actionColOptions: {
+      span: 23,
+    },
+  });
+  const [registerDrawer, { setDrawerProps, closeDrawer }] = useDrawerInner(async data => {
+    await resetFields();
+    setDrawerProps({ confirmLoading: false });
+    isUpdate.value = !!data?.isUpdate;
+
+    if (unref(isUpdate)) {
+      updateSchema([
+        {
+          field: 'master',
+          componentProps: {
+            disabled: true,
+          },
+        },
+      ]);
+      const resData = await infraStorageconfigDetail(data.record.id);
+      rowId.value = resData.id;
+      await setFieldsValue({
+        ...resData,
+      });
+    }
+  });
+
+  // 提交按钮事件
+  async function handleSubmit() {
+    try {
+      const values = await validate();
+      const keys = Object.keys(values);
+      const configs = {};
+      keys.forEach(item => {
+        if (item.indexOf('config.') != -1) {
+          const realKey = item.substring(item.indexOf('.') + 1, item.length);
+          configs[realKey] = values[String(item)];
+        }
+      });
+      values.config = configs;
+      setDrawerProps({ confirmLoading: true });
+      !unref(isUpdate)
+        ? await infraStorageconfigAdd({ ...values })
+        : await infraStorageconfigEdit({ ...values, id: rowId.value });
+      !unref(isUpdate) ? createMessage.success('新增成功！') : createMessage.success('编辑成功！');
+      closeDrawer();
+      emit('success', {
+        isUpdate: unref(isUpdate),
+        values: { ...values, id: rowId.value },
+      });
+    } finally {
+      setDrawerProps({ confirmLoading: false });
+    }
+  }
+</script>
+<style lang="less" scoped>
+  ::v-deep(.ant-divider-plain.ant-divider-with-text) {
+    font-size: 17px !important;
+  }
+</style>

src/views/infra/storage/oss/index.vue

@@ -0,0 +1,229 @@
+<template>
+  <div>
+    <BasicTable @register="registerTable">
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'master'">
+          <Tag :color="record.master ? 'error' : 'success'">
+            {{ commonDict(record.master, 0) }}
+          </Tag>
+        </template>
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              {
+                tooltip: '文件上传',
+                label: '文件上传',
+                onClick: handleUpdateModel.bind(null, record),
+              },
+              {
+                auth: 'storage:config:edit',
+                tooltip: '主配置',
+                label: '主配置',
+                ifShow: !record.master,
+                popConfirm: {
+                  title: '是否确认设置为主配置',
+                  placement: 'left',
+                  confirm: handleMaster.bind(null, record),
+                },
+              },
+              {
+                auth: 'storage:config:query',
+                icon: 'icon-eye|iconfont',
+                tooltip: '查看',
+                label: '查看',
+                onClick: handleView.bind(null, record),
+              },
+              {
+                auth: 'storage:config:edit',
+                icon: 'icon-edit|iconfont',
+                tooltip: '编辑',
+                label: '编辑',
+                onClick: handleEdit.bind(null, record),
+              },
+              {
+                auth: 'storage:config:remove',
+                icon: 'icon-delete|iconfont',
+                tooltip: '删除',
+                label: '删除',
+                color: 'error',
+                popConfirm: {
+                  title: '是否确认删除',
+                  placement: 'left',
+                  confirm: handleDelete.bind(null, record),
+                },
+              },
+            ]"
+          />
+        </template>
+      </template>
+      <template #toolbar>
+        <Button
+          v-auth="['storage:config:add']"
+          type="primary"
+          @click="handleCreate"
+          preIcon="icon-plus|iconfont"
+        >
+          新增
+        </Button>
+        <Button
+          v-auth="['storage:config:remove']"
+          type="primary"
+          danger
+          @click="handleDelete(null)"
+          preIcon="icon-delete|iconfont"
+        >
+          批量删除
+        </Button>
+      </template>
+    </BasicTable>
+    <FormDrawer @register="registerDrawer" @success="handleSuccess" />
+    <ViewDrawer @register="registerDrawerView" @success="handleSuccess" />
+  </div>
+</template>
+<script lang="ts" setup>
+  import { Tag } from 'ant-design-vue';
+  import { onBeforeMount, ref } from 'vue';
+  import { Button } from '/@/components/Button';
+
+  import { BasicTable, useTable, TableAction } from '/@/components/Table';
+
+  import { useMessage } from '/@/hooks/web/useMessage';
+  import FormDrawer from './formDrawer.vue';
+  import ViewDrawer from './viewDrawer.vue';
+  import { columns, searchFormSchema } from './data';
+
+  import {
+    infraStorageconfigQueryPage,
+    infraStorageconfigRemove,
+    infraStorageconfigMaster,
+  } from '/@/api/infra/infraStorageConfigApi';
+  import { useDrawer } from '/@/components/Drawer';
+  import { commonDict } from '/@/utils';
+
+  onBeforeMount(async () => {});
+
+  const { createConfirm, createMessage } = useMessage();
+  // const [registerModal, { openModal }] = useModal();
+  const [registerDrawer, { openDrawer }] = useDrawer();
+  const [registerDrawerView, { openDrawer: openDrawerView }] = useDrawer();
+
+  const tableSort = ref([
+    {
+      field: 'master',
+      direction: 'DESC',
+    },
+    {
+      field: 'create_time',
+      direction: 'DESC',
+    },
+  ]) as any;
+
+  const [registerTable, { reload, getSelectRowKeys }] = useTable({
+    title: '文件存储配置 ',
+    api: infraStorageconfigQueryPage,
+    rowKey: 'id',
+    columns,
+    showIndexColumn: true,
+    rowSelection: { type: 'checkbox' },
+    formConfig: {
+      labelWidth: 120,
+      schemas: searchFormSchema,
+      autoSubmitOnEnter: true,
+      baseColProps: { xs: 24, sm: 12, md: 12, lg: 8 },
+      resetButtonOptions: {
+        preIcon: 'icon-delete|iconfont',
+      },
+      submitButtonOptions: {
+        preIcon: 'icon-search|iconfont',
+      },
+    },
+    useSearchForm: true,
+    bordered: true,
+    actionColumn: {
+      width: 360,
+      title: '操作',
+      dataIndex: 'action',
+    },
+    beforeFetch: handleBeforeFetch,
+    sortFn: handleSortFn,
+  });
+  // 详情按钮事件
+  function handleView(record: Recordable) {
+    console.log(record);
+    openDrawerView(true, {
+      record,
+    });
+  }
+
+  // 新增按钮事件
+  function handleCreate() {
+    openDrawer(true, {
+      isUpdate: false,
+    });
+  }
+
+  // 编辑按钮事件
+  function handleEdit(record: Recordable) {
+    openDrawer(true, {
+      record,
+      isUpdate: true,
+    });
+  }
+
+  // 删除按钮事件
+  async function handleDelete(record: Recordable) {
+    if (record) {
+      await infraStorageconfigRemove([record.id]);
+      createMessage.success('删除成功！');
+      await reload();
+    } else {
+      createConfirm({
+        content: '你确定要删除?',
+        iconType: 'warning',
+        onOk: async () => {
+          const keys = getSelectRowKeys();
+          await infraStorageconfigRemove(keys);
+          createMessage.success('删除成功！');
+          await reload();
+        },
+      });
+    }
+  }
+  // 设置主配置
+  async function handleMaster(record: Recordable) {
+    if (record) {
+      await infraStorageconfigMaster(record.id);
+      createMessage.success('设置为主配置成功！');
+      await reload();
+    }
+  }
+
+  // 打开上传测试弹窗
+  function handleUpdateModel(record: Recordable) {
+    console.log(record);
+  }
+  // 表格点击字段排序
+  function handleSortFn(sortInfo) {
+    if (sortInfo?.order && sortInfo?.columnKey) {
+      // 默认单列排序
+      tableSort.value = [
+        {
+          field: sortInfo.columnKey,
+          direction: sortInfo.order.replace(/(\w+)(end)/g, '$1').toUpperCase(),
+        },
+      ];
+    }
+  }
+
+  // 表格请求之前，对参数进行处理, 添加默认 排序
+  function handleBeforeFetch(params) {
+    return { ...params, orders: tableSort.value };
+  }
+
+  // 弹窗回调事件
+  async function handleSuccess({ isUpdate, values }) {
+    console.log(isUpdate);
+    console.log(values);
+    await reload();
+  }
+</script>

src/views/infra/storage/oss/viewDrawer.vue

@@ -0,0 +1,63 @@
+<template>
+  <BasicDrawer
+    v-bind="$attrs"
+    destroyOnClose
+    @register="registerDrawer"
+    :title="getTitle"
+    :width="width"
+  >
+    <Description @register="registerDesc" :data="descData" />
+  </BasicDrawer>
+</template>
+<script lang="ts" setup>
+  import { onBeforeMount, ref } from 'vue'; // onBeforeMount,
+  import { BasicDrawer, useDrawerInner } from '/@/components/Drawer';
+  import { Description, useDescription } from '/@/components/Description';
+  import { viewSchema } from './data';
+
+  import { infraStorageconfigDetail } from '/@/api/infra/infraStorageConfigApi';
+
+  const descData = ref({});
+  const getTitle = '查看存储配置';
+  const width = '45%';
+
+  onBeforeMount(async () => {});
+  const [registerDrawer] = useDrawerInner(async data => {
+    const resData = await infraStorageconfigDetail(data.record.id);
+    resData.master = resData.master ? '是' : '否';
+    if (resData.type) {
+      const configs = Object.keys(resData.config);
+      configs.forEach(item => {
+        resData['config' + item] = resData.config[item];
+      });
+    }
+    descData.value = {
+      ...resData,
+      types: getTypeText(resData.type),
+    };
+  });
+  const [registerDesc] = useDescription({
+    schema: viewSchema,
+    column: 1,
+    size: 'middle',
+    labelStyle: {
+      width: '120px',
+    },
+  });
+  function getTypeText(type) {
+    switch (type) {
+      case 'ali':
+        return '阿里云';
+      case 'db':
+        return '数据库';
+      case 'local':
+        return '本地存储';
+      case 'minio':
+        return 'minio存储';
+      case 'qiniu':
+        return '七牛云存储';
+      default:
+        return '';
+    }
+  }
+</script>