fix: 一些基本功能

2025-03-07 08:18:45 +08:00
parent 638462295d
commit 4cdb8351d4
453 changed files with 13336 additions and 24197 deletions
--- a/apps/web-antd/src/views/log/api-log/api/index.ts
+++ b/apps/web-antd/src/views/log/api-log/api/index.ts
@@ -0,0 +1,11 @@
+import { requestClient } from '#/api/request';
+
+const prefix = 'log/';
+/**
+ * 分页查询用户列表
+ * @param data
+ */
+export async function getOldApiLogList(data: any) {
+  return requestClient.get<any>(`${prefix}api-list`, { params: data });
+}
+// Api访问日志
--- a/apps/web-antd/src/views/log/api-log/components/modal.vue
+++ b/apps/web-antd/src/views/log/api-log/components/modal.vue
@@ -0,0 +1,107 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Descriptions } from 'ant-design-vue';
+
+import { Icon } from '#/components/icon';
+import { getIcon } from '#/util/tool';
+
+defineOptions({
+  name: 'FormModelDemo',
+});
+
+const gridApi = ref();
+const data = ref({});
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    modalApi.close();
+  },
+  onOpenChange(isOpen: boolean) {
+    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+    if (isOpen) {
+      const { values } = modalApi.getData<Record<string, any>>();
+      if (values) {
+        data.value = values;
+      }
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal class="w-[80%]" title="Api访问日志详情">
+    <div class="flex flex-col gap-4">
+      <Descriptions
+        :column="{ xxl: 2, xl: 2, lg: 2, md: 2, sm: 2, xs: 2 }"
+        bordered
+      >
+        <Descriptions.Item label="ID">{{ data.id }}</Descriptions.Item>
+        <Descriptions.Item label="操作人员">
+          {{ data?.admin?.nick_name || '获取失败' }}
+        </Descriptions.Item>
+        <Descriptions.Item label="URL">{{ data.url }}</Descriptions.Item>
+        <Descriptions.Item label="控制器">
+          {{ data.controller }}
+        </Descriptions.Item>
+        <Descriptions.Item label="IP">
+          {{ data.ip === '127.0.0.1' ? '本地' : data.ip }}
+        </Descriptions.Item>
+        <Descriptions.Item label="类型">
+          {{ data.type === 0 ? '访问成功' : '访问失败' }}
+        </Descriptions.Item>
+        <Descriptions.Item label="返回结果代码">
+          {{ data.result_code }}
+        </Descriptions.Item>
+        <Descriptions.Item label="平台类型">
+          {{ data.platform_type === 0 ? '平台' : '诊所' }}
+        </Descriptions.Item>
+        <Descriptions.Item label="设备">
+          <Icon :icon="getIcon(data.equipment)" :size="20" />
+          {{ data.equipment }}
+        </Descriptions.Item>
+        <Descriptions.Item label="浏览器">
+          <Icon :icon="getIcon(data.browser)" :size="20" />
+          {{ data.browser }}
+        </Descriptions.Item>
+        <Descriptions.Item label="平台">
+          {{ data.platform?.name || '获取失败' }}
+        </Descriptions.Item>
+        <Descriptions.Item label="访问时间">
+          {{ data.created_at }}
+        </Descriptions.Item>
+      </Descriptions>
+      <Descriptions
+        :column="{ xxl: 1, xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }"
+        bordered
+      >
+        <Descriptions.Item label="参数">
+          <pre>{{ JSON.parse(data.param) }}</pre>
+        </Descriptions.Item>
+        <Descriptions.Item label="结果">
+          <pre>{{ JSON.parse(data.result) }}</pre>
+        </Descriptions.Item>
+      </Descriptions>
+    </div>
+  </Modal>
+</template>
+
+<style scoped>
+.ant-descriptions-item-label {
+  font-weight: bold;
+}
+
+pre {
+  padding: 8px;
+  border-radius: 4px;
+  overflow-x: auto;
+  white-space: pre-wrap;
+}
+</style>
--- a/apps/web-antd/src/views/log/api-log/config/search.ts
+++ b/apps/web-antd/src/views/log/api-log/config/search.ts
@@ -0,0 +1,28 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+// import dayjs from 'dayjs';
+
+export const formOptions: VbenFormProps = {
+  // 默认展开
+  collapsed: false,
+  schema: [
+    {
+      component: 'RangePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD', // 确保格式与你需要的一致
+      },
+      // defaultValue: [dayjs().startOf('month'), dayjs()],
+      fieldName: 'search_time',
+      label: '时间范围',
+    },
+  ],
+  // 控制表单是否显示折叠按钮
+  showCollapseButton: true,
+  submitButtonOptions: {
+    content: '查询',
+  },
+  // 是否在字段值改变时提交表单
+  submitOnChange: true,
+  // 按下回车时是否提交表单
+  submitOnEnter: false,
+};
--- a/apps/web-antd/src/views/log/api-log/config/table.ts
+++ b/apps/web-antd/src/views/log/api-log/config/table.ts
@@ -0,0 +1,85 @@
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import { getOldApiLogList } from '../api';
+
+interface RowType {
+  id: string;
+  admin: string;
+  url: string;
+  ip: string;
+  param: string;
+  type: string;
+  created_at: string;
+}
+
+export const gridOptions: VxeGridProps<RowType> = {
+  checkboxConfig: {
+    highlight: true,
+    labelField: '',
+  },
+  columnConfig: {
+    useKey: true,
+  },
+  rowConfig: {
+    useKey: true,
+  },
+  columns: [
+    { field: 'id', align: 'left', title: 'ID', width: 100 },
+    {
+      field: 'admin',
+      align: 'left',
+      title: '操作管理员',
+      slots: { default: 'admin' },
+    },
+    { field: 'url', title: '访问路由' },
+    { field: 'ip', title: '用户IP地址' },
+    { field: 'controller', title: '访问控制器' },
+    // { field: 'param', title: '携带参数' },
+    { field: 'equipment', title: '操作系统', slots: { default: 'equipment' }, width: 80 },
+    { field: 'browser', title: '浏览器', slots: { default: 'browser' }, width: 80 },
+    { field: 'type', title: '操作简述', slots: { default: 'type' } },
+    { field: 'created_at', title: '访问时间' },
+    { type: 'html', title: '操作', slots: { default: 'action' } },
+  ],
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      // 请求后端接口方法
+      query: async ({ page }, formValues) => {
+        return await getOldApiLogList({
+          page: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  height: 'auto',
+  border: false,
+  exportConfig: {
+    // 导出配置
+    filename: 'api-log',
+    remote: true,
+    type: 'csv',
+  },
+  toolbarConfig: {
+    // 是否显示搜索表单控制按钮
+    // @ts-ignore 正式环境时有完整的类型声明
+    search: true,
+    refresh: true, // 刷新
+    // import: true, // 导入
+    print: false, // 打印
+    export: false, // 导出
+    // custom: true, // 自定义列
+    zoom: true, // 最大化最小化
+    slots: {
+      buttons: 'toolbar-buttons',
+    },
+    custom: {
+      // 自定义列-图标
+      icon: 'vxe-icon-menu',
+    },
+  },
+  showOverflow: false,
+};
--- a/apps/web-antd/src/views/log/api-log/index.vue
+++ b/apps/web-antd/src/views/log/api-log/index.vue
@@ -0,0 +1,75 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+
+import { Button, Tag } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { TableAction } from '#/components/table-action';
+
+import FormModalDemo from './components/modal.vue';
+import { formOptions } from './config/search';
+import { gridOptions } from './config/table';
+import { getIcon } from '#/util/tool';
+import {Icon} from "#/components/icon";
+
+ref(false);
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: FormModalDemo,
+});
+
+const showModal = (data = {}, isUpdate = false) => {
+  formModalApi.setData({
+    // 表单值
+    values: data,
+    update: isUpdate,
+    gridApi,
+  });
+  formModalApi.open();
+};
+</script>
+
+<template>
+  <Page auto-content-height title="Api访问日志管理">
+    <FormModal />
+    <Grid>
+      <template #toolbar-buttons>
+      </template>
+      <template #type="{ row }">
+        <Tag v-if="row.type === 0" color="green"> 访问成功 </Tag>
+        <Tag v-else color="red"> 访问失败 </Tag>
+      </template>
+      <template #admin="{ row }">
+        {{ row?.admin?.nick_name || '获取失败' }}
+      </template>
+      <template #toolbar-tools></template>
+      <template #equipment="{ row }">
+        <Icon :icon="getIcon(row.equipment)" :size="20" />
+      </template>
+      <template #browser="{ row }">
+        <Icon :icon="getIcon(row.browser)" :size="20" />
+      </template>
+      <template #action="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '查看',
+              type: 'link',
+              icon: 'uil:edit',
+              size: 'small',
+              // auth: ['op-log', 'sys:role:detail'],
+              onClick: showModal.bind(null, row, true),
+            },
+          ]"
+          :drop-down-actions="[]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
--- a/apps/web-antd/src/views/log/ledger-log/api/index.ts
+++ b/apps/web-antd/src/views/log/ledger-log/api/index.ts
@@ -0,0 +1,10 @@
+import { requestClient } from '#/api/request';
+
+const prefix = 'log/';
+/**
+ * 分页查询用户列表
+ * @param data
+ */
+export async function getLedgerLogList(data: any) {
+  return requestClient.get<any>(`${prefix}ledger-list`, { params: data });
+}
--- a/apps/web-antd/src/views/log/ledger-log/components/modal.vue
+++ b/apps/web-antd/src/views/log/ledger-log/components/modal.vue
@@ -0,0 +1,70 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { Descriptions } from 'ant-design-vue';
+
+defineOptions({
+  name: 'FormModelDemo',
+});
+
+const gridApi = ref();
+const data = ref({});
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    modalApi.close();
+  },
+  onOpenChange(isOpen: boolean) {
+    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+    if (isOpen) {
+      const { values } = modalApi.getData<Record<string, any>>();
+      if (values) {
+        data.value = values;
+      }
+    }
+  },
+});
+</script>
+<template>
+  <Modal class="w-[80%]" title="分账日志详情">
+    <div class="flex flex-col gap-4">
+      <Descriptions
+        :column="{ xxl: 1, xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }"
+        bordered
+      >
+        <Descriptions.Item label="ID">{{ data.id }}</Descriptions.Item>
+        <Descriptions.Item label="管理员ID">{{ data.admin_id }}</Descriptions.Item>
+        <Descriptions.Item label="理员名称">{{ data.old_admin.username }}</Descriptions.Item>
+        <Descriptions.Item label="类型">{{ data.type }}</Descriptions.Item>
+        <Descriptions.Item label="内容">
+          <pre>{{ JSON.parse(data.content) }}</pre>
+        </Descriptions.Item>
+        <Descriptions.Item label="模式">
+          {{ data.mold_txt }}
+        </Descriptions.Item>
+        <Descriptions.Item label="操作时间">
+          {{ data.operate_time }}
+        </Descriptions.Item>
+        <Descriptions.Item label="创建时间">{{ data.created_at }}</Descriptions.Item>
+      </Descriptions>
+    </div>
+  </Modal>
+</template>
+
+<style scoped>
+.ant-descriptions-item-label {
+  font-weight: bold;
+}
+
+pre {
+  padding: 8px;
+  border-radius: 4px;
+  overflow-x: auto;
+}
+</style>
--- a/apps/web-antd/src/views/log/ledger-log/config/search.ts
+++ b/apps/web-antd/src/views/log/ledger-log/config/search.ts
@@ -0,0 +1,28 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+// import dayjs from 'dayjs';
+
+export const formOptions: VbenFormProps = {
+  // 默认展开
+  collapsed: false,
+  schema: [
+    {
+      component: 'RangePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD', // 确保格式与你需要的一致
+      },
+      // defaultValue: [dayjs().startOf('month'), dayjs()],
+      fieldName: 'search_time',
+      label: '时间范围',
+    },
+  ],
+  // 控制表单是否显示折叠按钮
+  showCollapseButton: true,
+  submitButtonOptions: {
+    content: '查询',
+  },
+  // 是否在字段值改变时提交表单
+  submitOnChange: true,
+  // 按下回车时是否提交表单
+  submitOnEnter: false,
+};
--- a/apps/web-antd/src/views/log/ledger-log/config/table.ts
+++ b/apps/web-antd/src/views/log/ledger-log/config/table.ts
@@ -0,0 +1,64 @@
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import { getLedgerLogList } from '../api';
+
+interface RowType {
+  id: string;
+  name: string;
+  logo: string;
+  introduce: string;
+  created_at: string;
+}
+
+export const gridOptions: VxeGridProps<RowType> = {
+  checkboxConfig: {
+    highlight: true,
+    labelField: '',
+  },
+  columns: [
+    { field: 'id', align: 'left', title: 'ID', width: 100 },
+    { field: 'order.order_no', align: 'left', title: '订单编号' },
+    { field: 'store', title: '关联账户', slots: { default: 'store' } },
+    { field: 'user_type_txt', title: '账户类型' },
+    { field: 'fee_type_txt', title: '费用类型' },
+    { field: 'type_txt', title: '类型' },
+    { field: 'content', title: '操作内容' },
+    { field: 'amount', title: '金额' },
+    { field: 'created_at', title: '操作时间' },
+    // { type: 'html', title: '操作', slots: { default: 'action' } },
+  ],
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      // 请求后端接口方法
+      query: async ({ page }, formValues) => {
+        return await getLedgerLogList({
+          page: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  height: 'auto',
+  border: false,
+  toolbarConfig: {
+    // 是否显示搜索表单控制按钮
+    // @ts-ignore 正式环境时有完整的类型声明
+    search: true,
+    refresh: true, // 刷新
+    print: false, // 打印
+    export: false, // 导出
+    // custom: true, // 自定义列
+    zoom: true, // 最大化最小化
+    slots: {
+      buttons: 'toolbar-buttons',
+    },
+    custom: {
+      // 自定义列-图标
+      icon: 'vxe-icon-menu',
+    },
+  },
+  showOverflow: false,
+};
--- a/apps/web-antd/src/views/log/ledger-log/index.vue
+++ b/apps/web-antd/src/views/log/ledger-log/index.vue
@@ -0,0 +1,66 @@
+<script lang="ts" setup>
+
+import { ref } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+
+import { Button, Image } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { TableAction } from '#/components/table-action';
+
+import FormModalDemo from './components/modal.vue';
+import { formOptions } from './config/search';
+import { gridOptions } from './config/table';
+
+ref(false);
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: FormModalDemo,
+});
+
+const showModal = (data = {}, isUpdate = false) => {
+  formModalApi.setData({
+    // 表单值
+    values: data,
+    update: isUpdate,
+    gridApi,
+  });
+  formModalApi.open();
+};
+</script>
+
+<template>
+  <Page auto-content-height title="分账日志管理">
+    <FormModal />
+    <Grid>
+      <template #toolbar-buttons>
+      </template>
+      <template #store="{ row }">
+        <span v-if="row.user_type === 1">{{ row.store.name }}</span>
+        <span v-else-if="row.user_type === 3">{{ row.supplier.name }}</span>
+        <span v-else>萧康-平台</span>
+      </template>
+      <template #toolbar-tools></template>
+      <template #action="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '查看',
+              type: 'link',
+              icon: 'uil:edit',
+              size: 'small',
+              // auth: ['op-log', 'sys:role:detail'],
+              onClick: showModal.bind(null, row, true),
+            },
+          ]"
+          :drop-down-actions="[]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
--- a/apps/web-antd/src/views/log/old-api-log/api/index.ts
+++ b/apps/web-antd/src/views/log/old-api-log/api/index.ts
@@ -0,0 +1,11 @@
+import { requestClient } from '#/api/request';
+
+const prefix = 'log/';
+/**
+ * 分页查询用户列表
+ * @param data
+ */
+export async function getOldApiLogList(data: any) {
+  return requestClient.get<any>(`${prefix}old-api-list`, { params: data });
+}
+// Api访问日志
--- a/apps/web-antd/src/views/log/old-api-log/components/modal.vue
+++ b/apps/web-antd/src/views/log/old-api-log/components/modal.vue
@@ -0,0 +1,86 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+
+import { Descriptions } from 'ant-design-vue';
+
+defineOptions({
+  name: 'FormModelDemo',
+});
+
+const gridApi = ref();
+const data = ref({});
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    modalApi.close();
+  },
+  onOpenChange(isOpen: boolean) {
+    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+    if (isOpen) {
+      const { values } = modalApi.getData<Record<string, any>>();
+      if (values) {
+        data.value = values;
+      }
+    }
+  },
+});
+</script>
+
+<template>
+  <Modal class="w-[80%]" title="Api访问日志详情">
+    <div class="flex flex-col gap-4">
+      <Descriptions
+        :column="{ xxl: 1, xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }"
+        bordered
+      >
+        <Descriptions.Item label="ID">{{ data.id }}</Descriptions.Item>
+        <Descriptions.Item label="用户ID">{{ data.user_id }}</Descriptions.Item>
+        <Descriptions.Item label="URL">{{ data.url }}</Descriptions.Item>
+        <Descriptions.Item label="IP">{{ data.ip === '127.0.0.1' ? '本地' : data.ip }}</Descriptions.Item>
+        <Descriptions.Item label="参数">
+          <pre>{{ JSON.parse(JSON.parse(data.param)) }}</pre>
+        </Descriptions.Item>
+        <Descriptions.Item label="结果">
+          <pre>{{ JSON.parse(JSON.parse(data.result)) }}</pre>
+        </Descriptions.Item>
+        <Descriptions.Item label="类型">{{ data.type === 0 ? '访问成功' : '访问失败' }}</Descriptions.Item>
+        <Descriptions.Item label="返回结果代码">
+          {{ data.result_code }}
+        </Descriptions.Item>
+        <Descriptions.Item label="平台类型">
+          {{ data.platform_type === 0 ? '平台' : '诊所' }}
+        </Descriptions.Item>
+        <Descriptions.Item label="平台">
+          {{ data.platform_id === 0 ? '萧康医药' : data?.old_admin?.username || '获取失败' }}
+        </Descriptions.Item>
+        <Descriptions.Item label="设备">{{ data.equipment }}</Descriptions.Item>
+        <Descriptions.Item label="浏览器">{{ data.browser }}</Descriptions.Item>
+        <Descriptions.Item label="创建时间">
+          {{ data.created_at }}
+        </Descriptions.Item>
+        <Descriptions.Item label="管理员名称">
+          {{ data?.old_admin?.username || '获取失败' }}
+        </Descriptions.Item>
+      </Descriptions>
+    </div>
+  </Modal>
+</template>
+
+<style scoped>
+.ant-descriptions-item-label {
+  font-weight: bold;
+}
+
+pre {
+  padding: 8px;
+  border-radius: 4px;
+  overflow-x: auto;
+}
+</style>
--- a/apps/web-antd/src/views/log/old-api-log/config/search.ts
+++ b/apps/web-antd/src/views/log/old-api-log/config/search.ts
@@ -0,0 +1,28 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+// import dayjs from 'dayjs';
+
+export const formOptions: VbenFormProps = {
+  // 默认展开
+  collapsed: false,
+  schema: [
+    {
+      component: 'RangePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD', // 确保格式与你需要的一致
+      },
+      // defaultValue: [dayjs().startOf('month'), dayjs()],
+      fieldName: 'search_time',
+      label: '时间范围',
+    },
+  ],
+  // 控制表单是否显示折叠按钮
+  showCollapseButton: true,
+  submitButtonOptions: {
+    content: '查询',
+  },
+  // 是否在字段值改变时提交表单
+  submitOnChange: true,
+  // 按下回车时是否提交表单
+  submitOnEnter: false,
+};
--- a/apps/web-antd/src/views/log/old-api-log/config/table.ts
+++ b/apps/web-antd/src/views/log/old-api-log/config/table.ts
@@ -0,0 +1,73 @@
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import { getOldApiLogList } from '../api';
+
+interface RowType {
+  id: string;
+  name: string;
+  logo: string;
+  introduce: string;
+  created_at: string;
+}
+
+export const gridOptions: VxeGridProps<RowType> = {
+  checkboxConfig: {
+    highlight: true,
+    labelField: '',
+  },
+  columnConfig: {
+    useKey: true,
+  },
+  rowConfig: {
+    useKey: true,
+  },
+  columns: [
+    { field: 'id', align: 'left', title: 'ID', width: 100 },
+    {
+      field: 'old_admin',
+      align: 'left',
+      title: '操作管理员',
+      slots: { default: 'old_admin' },
+    },
+    { field: 'url', title: '访问路由' },
+    { field: 'ip', title: '用户IP地址' },
+    { field: 'param', title: '携带参数' },
+    { field: 'type', title: '操作简述', slots: { default: 'type' } },
+    { field: 'created_at', title: '上传时间' },
+    { type: 'html', title: '操作', slots: { default: 'action' } },
+  ],
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      // 请求后端接口方法
+      query: async ({ page }, formValues) => {
+        return await getOldApiLogList({
+          page: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  height: 'auto',
+  border: false,
+  toolbarConfig: {
+    // 是否显示搜索表单控制按钮
+    // @ts-ignore 正式环境时有完整的类型声明
+    search: true,
+    refresh: true, // 刷新
+    print: false, // 打印
+    export: false, // 导出
+    // custom: true, // 自定义列
+    zoom: true, // 最大化最小化
+    slots: {
+      buttons: 'toolbar-buttons',
+    },
+    custom: {
+      // 自定义列-图标
+      icon: 'vxe-icon-menu',
+    },
+  },
+  showOverflow: false,
+};
--- a/apps/web-antd/src/views/log/old-api-log/index.vue
+++ b/apps/web-antd/src/views/log/old-api-log/index.vue
@@ -0,0 +1,68 @@
+<script lang="ts" setup>
+
+import { ref } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+
+import { Button, Tag } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { TableAction } from '#/components/table-action';
+
+import FormModalDemo from './components/modal.vue';
+import { formOptions } from './config/search';
+import { gridOptions } from './config/table';
+
+ref(false);
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: FormModalDemo,
+});
+
+const showModal = (data = {}, isUpdate = false) => {
+  formModalApi.setData({
+    // 表单值
+    values: data,
+    update: isUpdate,
+    gridApi,
+  });
+  formModalApi.open();
+};
+</script>
+
+<template>
+  <Page auto-content-height title="Api访问日志管理">
+    <FormModal />
+    <Grid>
+      <template #toolbar-buttons>
+      </template>
+      <template #type="{ row }">
+        <Tag v-if="row.type === 0" color="green"> 访问成功 </Tag>
+        <Tag v-else color="red"> 访问失败 </Tag>
+      </template>
+      <template #old_admin="{ row }">
+        {{ row?.old_admin?.username || '获取失败' }}
+      </template>
+      <template #toolbar-tools></template>
+      <template #action="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '查看',
+              type: 'link',
+              icon: 'uil:edit',
+              size: 'small',
+              // auth: ['op-log', 'sys:role:detail'],
+              onClick: showModal.bind(null, row, true),
+            },
+          ]"
+          :drop-down-actions="[]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
--- a/apps/web-antd/src/views/log/op-log/api/index.ts
+++ b/apps/web-antd/src/views/log/op-log/api/index.ts
@@ -0,0 +1,10 @@
+import { requestClient } from '#/api/request';
+
+const prefix = 'log/';
+/**
+ * 分页查询用户列表
+ * @param data
+ */
+export async function getOpLogList(data: any) {
+  return requestClient.get<any>(`${prefix}op-list`, { params: data });
+}
--- a/apps/web-antd/src/views/log/op-log/components/modal.vue
+++ b/apps/web-antd/src/views/log/op-log/components/modal.vue
@@ -0,0 +1,71 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { Descriptions } from 'ant-design-vue';
+
+defineOptions({
+  name: 'FormModelDemo',
+});
+
+const gridApi = ref();
+const data = ref({});
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    modalApi.close();
+  },
+  onOpenChange(isOpen: boolean) {
+    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+    if (isOpen) {
+      const { values } = modalApi.getData<Record<string, any>>();
+      if (values) {
+        data.value = values;
+      }
+    }
+  },
+});
+</script>
+<template>
+  <Modal class="w-[80%]" title="操作日志详情">
+    <div class="flex flex-col gap-4">
+      <Descriptions
+        :column="{ xxl: 1, xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }"
+        bordered
+      >
+        <Descriptions.Item label="ID">{{ data.id }}</Descriptions.Item>
+        <Descriptions.Item label="管理员ID">{{ data.admin_id }}</Descriptions.Item>
+        <Descriptions.Item label="理员名称">{{ data.old_admin?.username || data.admin?.nick_name }}</Descriptions.Item>
+        <Descriptions.Item label="类型">{{ data.type }}</Descriptions.Item>
+        <Descriptions.Item label="内容">
+          <pre>{{ JSON.parse(data.content) }}</pre>
+        </Descriptions.Item>
+        <Descriptions.Item label="模式">
+          {{ data.mold_txt }}
+        </Descriptions.Item>
+        <Descriptions.Item label="操作时间">
+          {{ data.operate_time }}
+        </Descriptions.Item>
+        <Descriptions.Item label="创建时间">{{ data.created_at }}</Descriptions.Item>
+      </Descriptions>
+    </div>
+  </Modal>
+</template>
+
+<style scoped>
+.ant-descriptions-item-label {
+  font-weight: bold;
+}
+
+pre {
+  padding: 8px;
+  border-radius: 4px;
+  overflow-x: auto;
+  white-space: pre-wrap;
+}
+</style>
--- a/apps/web-antd/src/views/log/op-log/config/search.ts
+++ b/apps/web-antd/src/views/log/op-log/config/search.ts
@@ -0,0 +1,28 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+// import dayjs from 'dayjs';
+
+export const formOptions: VbenFormProps = {
+  // 默认展开
+  collapsed: false,
+  schema: [
+    {
+      component: 'RangePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD', // 确保格式与你需要的一致
+      },
+      // defaultValue: [dayjs().startOf('month'), dayjs()],
+      fieldName: 'search_time',
+      label: '时间范围',
+    },
+  ],
+  // 控制表单是否显示折叠按钮
+  showCollapseButton: true,
+  submitButtonOptions: {
+    content: '查询',
+  },
+  // 是否在字段值改变时提交表单
+  submitOnChange: true,
+  // 按下回车时是否提交表单
+  submitOnEnter: false,
+};
--- a/apps/web-antd/src/views/log/op-log/config/table.ts
+++ b/apps/web-antd/src/views/log/op-log/config/table.ts
@@ -0,0 +1,73 @@
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import { getOpLogList } from '../api';
+
+interface RowType {
+  id: string;
+  name: string;
+  logo: string;
+  introduce: string;
+  created_at: string;
+}
+
+export const gridOptions: VxeGridProps<RowType> = {
+  checkboxConfig: {
+    highlight: true,
+    labelField: '',
+  },
+  columnConfig: {
+    useKey: true,
+  },
+  rowConfig: {
+    useKey: true,
+  },
+  columns: [
+    { field: 'id', align: 'left', title: 'ID', width: 100 },
+    {
+      field: 'old_admin',
+      align: 'left',
+      title: '操作管理员',
+      slots: { default: 'old_admin' },
+    },
+    { field: 'type', title: '操作简述' },
+    { field: 'mold_txt', title: '操作类型' },
+    { field: 'content', title: '操作内容', slots: { default: 'content'} },
+    { field: 'operate_time', title: '操作时间' },
+    { field: 'created_at', title: '上传时间' },
+    { type: 'html', title: '操作', slots: { default: 'action' } },
+  ],
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      // 请求后端接口方法
+      query: async ({ page }, formValues) => {
+        return await getOpLogList({
+          page: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  height: 'auto',
+  border: false,
+  toolbarConfig: {
+    // 是否显示搜索表单控制按钮
+    // @ts-ignore 正式环境时有完整的类型声明
+    search: true,
+    refresh: true, // 刷新
+    print: false, // 打印
+    export: false, // 导出
+    // custom: true, // 自定义列
+    zoom: true, // 最大化最小化
+    slots: {
+      buttons: 'toolbar-buttons',
+    },
+    custom: {
+      // 自定义列-图标
+      icon: 'vxe-icon-menu',
+    },
+  },
+  showOverflow: false,
+};
--- a/apps/web-antd/src/views/log/op-log/index.vue
+++ b/apps/web-antd/src/views/log/op-log/index.vue
@@ -0,0 +1,84 @@
+<script lang="ts" setup>
+
+import { ref } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+
+import { Button, Image } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { TableAction } from '#/components/table-action';
+
+import FormModalDemo from './components/modal.vue';
+import { formOptions } from './config/search';
+import { gridOptions } from './config/table';
+
+ref(false);
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: FormModalDemo,
+});
+
+const showModal = (data = {}, isUpdate = false) => {
+  formModalApi.setData({
+    // 表单值
+    values: data,
+    update: isUpdate,
+    gridApi,
+  });
+  formModalApi.open();
+};
+</script>
+
+<template>
+  <Page auto-content-height title="操作日志管理">
+    <FormModal />
+    <Grid>
+      <template #toolbar-buttons>
+        <TableAction
+          :actions="[
+          ]"
+          :drop-down-actions="[
+          ]"
+        >
+          <template #more>
+            <Button style="margin-left: 16px">
+              批量操作
+              <Icon icon="ant-design:down-outlined" />
+            </Button>
+          </template>
+        </TableAction>
+      </template>
+      <template #old_admin="{ row }">
+        {{ row.old_admin?.username || row.admin?.nick_name }}
+      </template>
+      <template #content="{ row }">
+        {{
+          row.content.length > 100
+            ? `${row.content.slice(0, 100)}...`
+            : row.content
+        }}
+      </template>
+      <template #toolbar-tools></template>
+      <template #action="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '查看',
+              type: 'link',
+              icon: 'uil:edit',
+              size: 'small',
+              // auth: ['op-log', 'sys:role:detail'],
+              onClick: showModal.bind(null, row, true),
+            },
+          ]"
+          :drop-down-actions="[]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
--- a/apps/web-antd/src/views/log/order-log/api/index.ts
+++ b/apps/web-antd/src/views/log/order-log/api/index.ts
@@ -0,0 +1,10 @@
+import { requestClient } from '#/api/request';
+
+const prefix = 'log/';
+/**
+ * 分页查询用户列表
+ * @param data
+ */
+export async function getOrderLogList(data: any) {
+  return requestClient.get<any>(`${prefix}order-list`, { params: data });
+}
--- a/apps/web-antd/src/views/log/order-log/components/modal.vue
+++ b/apps/web-antd/src/views/log/order-log/components/modal.vue
@@ -0,0 +1,70 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { Descriptions } from 'ant-design-vue';
+
+defineOptions({
+  name: 'FormModelDemo',
+});
+
+const gridApi = ref();
+const data = ref({});
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    modalApi.close();
+  },
+  onOpenChange(isOpen: boolean) {
+    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+    if (isOpen) {
+      const { values } = modalApi.getData<Record<string, any>>();
+      if (values) {
+        data.value = values;
+      }
+    }
+  },
+});
+</script>
+<template>
+  <Modal class="w-[80%]" title="订单日志详情">
+    <div class="flex flex-col gap-4">
+      <Descriptions
+        :column="{ xxl: 1, xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }"
+        bordered
+      >
+        <Descriptions.Item label="ID">{{ data.id }}</Descriptions.Item>
+        <Descriptions.Item label="管理员ID">{{ data.admin_id }}</Descriptions.Item>
+        <Descriptions.Item label="理员名称">{{ data.old_admin.username }}</Descriptions.Item>
+        <Descriptions.Item label="类型">{{ data.type }}</Descriptions.Item>
+        <Descriptions.Item label="内容">
+          <pre>{{ JSON.parse(data.content) }}</pre>
+        </Descriptions.Item>
+        <Descriptions.Item label="模式">
+          {{ data.mold_txt }}
+        </Descriptions.Item>
+        <Descriptions.Item label="操作时间">
+          {{ data.operate_time }}
+        </Descriptions.Item>
+        <Descriptions.Item label="创建时间">{{ data.created_at }}</Descriptions.Item>
+      </Descriptions>
+    </div>
+  </Modal>
+</template>
+
+<style scoped>
+.ant-descriptions-item-label {
+  font-weight: bold;
+}
+
+pre {
+  padding: 8px;
+  border-radius: 4px;
+  overflow-x: auto;
+}
+</style>
--- a/apps/web-antd/src/views/log/order-log/config/search.ts
+++ b/apps/web-antd/src/views/log/order-log/config/search.ts
@@ -0,0 +1,28 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+// import dayjs from 'dayjs';
+
+export const formOptions: VbenFormProps = {
+  // 默认展开
+  collapsed: false,
+  schema: [
+    {
+      component: 'RangePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD', // 确保格式与你需要的一致
+      },
+      // defaultValue: [dayjs().startOf('month'), dayjs()],
+      fieldName: 'search_time',
+      label: '时间范围',
+    },
+  ],
+  // 控制表单是否显示折叠按钮
+  showCollapseButton: true,
+  submitButtonOptions: {
+    content: '查询',
+  },
+  // 是否在字段值改变时提交表单
+  submitOnChange: true,
+  // 按下回车时是否提交表单
+  submitOnEnter: false,
+};
--- a/apps/web-antd/src/views/log/order-log/config/table.ts
+++ b/apps/web-antd/src/views/log/order-log/config/table.ts
@@ -0,0 +1,65 @@
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import { getOrderLogList } from '../api';
+
+interface RowType {
+  id: string;
+  name: string;
+}
+
+export const gridOptions: VxeGridProps<RowType> = {
+  checkboxConfig: {
+    highlight: true,
+    labelField: '',
+  },
+  columnConfig: {
+    useKey: true,
+  },
+  rowConfig: {
+    useKey: true,
+  },
+  columns: [
+    { field: 'id', align: 'left', title: 'ID', width: 100 },
+    { field: 'order.order_no', align: 'left', title: '操作订单号' },
+    { field: 'content', title: '操作内容' },
+    { field: 'created_at', title: '操作时间' },
+  ],
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      // 请求后端接口方法
+      query: async ({ page }, formValues) => {
+        return await getOrderLogList({
+          page: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  scrollY: {
+    enabled: true,
+    gt: 100,
+  },
+  height: 'auto',
+  border: false,
+  toolbarConfig: {
+    // 是否显示搜索表单控制按钮
+    // @ts-ignore 正式环境时有完整的类型声明
+    search: true,
+    refresh: true, // 刷新
+    print: false, // 打印
+    export: false, // 导出
+    // custom: true, // 自定义列
+    zoom: true, // 最大化最小化
+    slots: {
+      buttons: 'toolbar-buttons',
+    },
+    custom: {
+      // 自定义列-图标
+      icon: 'vxe-icon-menu',
+    },
+  },
+  showOverflow: false,
+};
--- a/apps/web-antd/src/views/log/order-log/index.vue
+++ b/apps/web-antd/src/views/log/order-log/index.vue
@@ -0,0 +1,64 @@
+<script lang="ts" setup>
+
+import { ref } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+
+import { Button, Image } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { TableAction } from '#/components/table-action';
+
+import FormModalDemo from './components/modal.vue';
+import { formOptions } from './config/search';
+import { gridOptions } from './config/table';
+
+ref(false);
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: FormModalDemo,
+});
+
+const showModal = (data = {}, isUpdate = false) => {
+  formModalApi.setData({
+    // 表单值
+    values: data,
+    update: isUpdate,
+    gridApi,
+  });
+  formModalApi.open();
+};
+</script>
+
+<template>
+  <Page auto-content-height title="订单日志管理">
+    <FormModal />
+    <Grid>
+      <template #toolbar-buttons>
+      </template>
+      <template #logo="{ row }">
+        <Image :src="row.logo" height="30" width="30" />
+      </template>
+      <template #toolbar-tools></template>
+      <template #action="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '查看',
+              type: 'link',
+              icon: 'uil:edit',
+              size: 'small',
+              // auth: ['order-log', 'sys:role:detail'],
+              onClick: showModal.bind(null, row, true),
+            },
+          ]"
+          :drop-down-actions="[]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>
--- a/apps/web-antd/src/views/log/prescription-log/api/index.ts
+++ b/apps/web-antd/src/views/log/prescription-log/api/index.ts
@@ -0,0 +1,10 @@
+import { requestClient } from '#/api/request';
+
+const prefix = 'log/';
+/**
+ * 分页查询用户列表
+ * @param data
+ */
+export async function getPrescriptionList(data: any) {
+  return requestClient.get<any>(`${prefix}prescription-list`, { params: data });
+}
--- a/apps/web-antd/src/views/log/prescription-log/components/modal.vue
+++ b/apps/web-antd/src/views/log/prescription-log/components/modal.vue
@@ -0,0 +1,62 @@
+<script lang="ts" setup>
+import { ref } from 'vue';
+
+import { useVbenModal } from '@vben/common-ui';
+import { Descriptions } from 'ant-design-vue';
+
+defineOptions({
+  name: 'FormModelDemo',
+});
+
+const gridApi = ref();
+const data = ref({});
+
+const [Modal, modalApi] = useVbenModal({
+  fullscreenButton: false,
+  draggable: true,
+  onCancel() {
+    modalApi.close();
+  },
+  onConfirm: async () => {
+    modalApi.close();
+  },
+  onOpenChange(isOpen: boolean) {
+    gridApi.value = isOpen ? modalApi.getData()?.gridApi : null;
+    if (isOpen) {
+      const { values } = modalApi.getData<Record<string, any>>();
+      if (values) {
+        data.value = values;
+      }
+    }
+  },
+});
+</script>
+<template>
+  <Modal class="w-[80%]" title="处方日志详情">
+    <div class="flex flex-col gap-4">
+      <Descriptions
+        :column="{ xxl: 1, xl: 1, lg: 1, md: 1, sm: 1, xs: 1 }"
+        bordered
+      >
+        <Descriptions.Item label="ID">{{ data.id }}</Descriptions.Item>
+        <Descriptions.Item label="处方">{{ data.p_id }}</Descriptions.Item>
+        <Descriptions.Item label="内容">
+          <pre>{{ JSON.parse(data.prescription.content) }}</pre>
+        </Descriptions.Item>
+        <Descriptions.Item label="操作时间">{{ data.created_at }}</Descriptions.Item>
+      </Descriptions>
+    </div>
+  </Modal>
+</template>
+
+<style scoped>
+.ant-descriptions-item-label {
+  font-weight: bold;
+}
+
+pre {
+  padding: 8px;
+  border-radius: 4px;
+  overflow-x: auto;
+}
+</style>
--- a/apps/web-antd/src/views/log/prescription-log/config/search.ts
+++ b/apps/web-antd/src/views/log/prescription-log/config/search.ts
@@ -0,0 +1,28 @@
+import type { VbenFormProps } from '#/adapter/form';
+
+// import dayjs from 'dayjs';
+
+export const formOptions: VbenFormProps = {
+  // 默认展开
+  collapsed: false,
+  schema: [
+    {
+      component: 'RangePicker',
+      componentProps: {
+        format: 'YYYY-MM-DD', // 确保格式与你需要的一致
+      },
+      // defaultValue: [dayjs().startOf('month'), dayjs()],
+      fieldName: 'search_time',
+      label: '时间范围',
+    },
+  ],
+  // 控制表单是否显示折叠按钮
+  showCollapseButton: true,
+  submitButtonOptions: {
+    content: '查询',
+  },
+  // 是否在字段值改变时提交表单
+  submitOnChange: true,
+  // 按下回车时是否提交表单
+  submitOnEnter: false,
+};
--- a/apps/web-antd/src/views/log/prescription-log/config/table.ts
+++ b/apps/web-antd/src/views/log/prescription-log/config/table.ts
@@ -0,0 +1,66 @@
+import type { VxeGridProps } from '#/adapter/vxe-table';
+
+import { getPrescriptionList } from '../api';
+
+interface RowType {
+  id: string;
+  name: string;
+}
+
+export const gridOptions: VxeGridProps<RowType> = {
+  checkboxConfig: {
+    highlight: true,
+    labelField: '',
+  },
+  columnConfig: {
+    useKey: true,
+  },
+  rowConfig: {
+    useKey: true,
+  },
+  columns: [
+    { field: 'id', align: 'left', title: 'ID', width: 100 },
+    { field: 'p_id', align: 'left', title: '处方ID' },
+    { field: 'content', title: '操作内容' },
+    { field: 'created_at', title: '操作时间' },
+    { type: 'html', title: '操作', slots: { default: 'action' } },
+  ],
+  keepSource: true,
+  pagerConfig: {},
+  proxyConfig: {
+    ajax: {
+      // 请求后端接口方法
+      query: async ({ page }, formValues) => {
+        return await getPrescriptionList({
+          page: page.currentPage,
+          pageSize: page.pageSize,
+          ...formValues,
+        });
+      },
+    },
+  },
+  scrollY: {
+    enabled: true,
+    gt: 100,
+  },
+  height: 'auto',
+  border: false,
+  toolbarConfig: {
+    // 是否显示搜索表单控制按钮
+    // @ts-ignore 正式环境时有完整的类型声明
+    search: true,
+    refresh: true, // 刷新
+    print: false, // 打印
+    export: false, // 导出
+    // custom: true, // 自定义列
+    zoom: true, // 最大化最小化
+    slots: {
+      buttons: 'toolbar-buttons',
+    },
+    custom: {
+      // 自定义列-图标
+      icon: 'vxe-icon-menu',
+    },
+  },
+  showOverflow: false,
+};
--- a/apps/web-antd/src/views/log/prescription-log/index.vue
+++ b/apps/web-antd/src/views/log/prescription-log/index.vue
@@ -0,0 +1,61 @@
+<script lang="ts" setup>
+
+import { ref } from 'vue';
+
+import { Page, useVbenModal } from '@vben/common-ui';
+
+import { Button, Image } from 'ant-design-vue';
+
+import { useVbenVxeGrid } from '#/adapter/vxe-table';
+import { TableAction } from '#/components/table-action';
+
+import FormModalDemo from './components/modal.vue';
+import { formOptions } from './config/search';
+import { gridOptions } from './config/table';
+
+ref(false);
+const [Grid, gridApi] = useVbenVxeGrid({
+  formOptions,
+  gridOptions,
+});
+
+const [FormModal, formModalApi] = useVbenModal({
+  connectedComponent: FormModalDemo,
+});
+
+const showModal = (data = {}, isUpdate = false) => {
+  formModalApi.setData({
+    // 表单值
+    values: data,
+    update: isUpdate,
+    gridApi,
+  });
+  formModalApi.open();
+};
+</script>
+
+<template>
+  <Page auto-content-height title="处方日志管理">
+    <FormModal />
+    <Grid>
+      <template #toolbar-buttons>
+      </template>
+      <template #toolbar-tools></template>
+      <template #action="{ row }">
+        <TableAction
+          :actions="[
+            {
+              label: '查看',
+              type: 'link',
+              icon: 'uil:edit',
+              size: 'small',
+              // auth: ['order-log', 'sys:role:detail'],
+              onClick: showModal.bind(null, row, true),
+            },
+          ]"
+          :drop-down-actions="[]"
+        />
+      </template>
+    </Grid>
+  </Page>
+</template>