feat(view): apiErrorLog

src/api/infra/apiErrorLog/index.ts

@@ -51,7 +51,7 @@ export function getApiErrorLogPage(params: ApiErrorLogPageReqVO) {
 }
 
 // 更新 API 错误日志的处理状态
-export function updateApiErrorLogPage(id: number, processStatus: number) {
+export function updateApiErrorLogProcess(id: number, processStatus: number) {
   return defHttp.put({
     url: '/infra/api-error-log/update-status?id=' + id + '&processStatus=' + processStatus
   })

src/locales/lang/en/common.ts

@@ -12,6 +12,8 @@ export default {
   exportTitle: 'Export',
   exportMessage: 'Do you want to export data?',
   exportSuccessText: 'Export success',
+  successText: 'Success',
+  errorText: 'Error',
   resetText: 'Reset',
   searchText: 'Search',
   queryText: 'Search',

src/locales/lang/zh-CN/common.ts

@@ -12,6 +12,8 @@ export default {
   exportTitle: '导出',
   exportMessage: '是否要导出数据？',
   exportSuccessText: '导出成功',
+  successText: '成功',
+  errorText: '失败',
   resetText: '重置',
   searchText: '搜索',
   queryText: '查询',

src/views/infra/apiErrorLog/apiErrorLog.data.ts

@@ -0,0 +1,110 @@
+import { BasicColumn, FormSchema, useRender } from '@/components/Table'
+import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
+
+export const columns: BasicColumn[] = [
+  {
+    title: '日志编号',
+    dataIndex: 'id',
+    width: 100
+  },
+  {
+    title: '用户编号',
+    dataIndex: 'userId',
+    width: 100
+  },
+  {
+    title: '用户类型',
+    dataIndex: 'userType',
+    width: 120,
+    customRender: ({ text }) => {
+      return useRender.renderDict(text, DICT_TYPE.USER_TYPE)
+    }
+  },
+  {
+    title: '应用名',
+    dataIndex: 'applicationName',
+    width: 120
+  },
+  {
+    title: '请求方法名',
+    dataIndex: 'requestMethod',
+    width: 120
+  },
+  {
+    title: '请求地址',
+    dataIndex: 'requestUrl',
+    width: 250
+  },
+  {
+    title: '异常发生时间',
+    dataIndex: 'exceptionTime',
+    width: 180,
+    customRender: ({ text }) => {
+      return useRender.renderDate(text)
+    }
+  },
+  {
+    title: '异常名',
+    dataIndex: 'exceptionName',
+    width: 250
+  },
+  {
+    title: '处理状态',
+    dataIndex: 'processStatus',
+    width: 180,
+    customRender: ({ text }) => {
+      return useRender.renderDict(text, DICT_TYPE.INFRA_API_ERROR_LOG_PROCESS_STATUS)
+    }
+  }
+]
+
+export const searchFormSchema: FormSchema[] = [
+  {
+    label: '用户编号',
+    field: 'userId',
+    component: 'Input',
+    colProps: { span: 8 }
+  },
+  {
+    label: '用户名称',
+    field: 'username',
+    component: 'Input',
+    colProps: { span: 8 }
+  },
+  {
+    label: '用户类型',
+    field: 'userType',
+    component: 'Select',
+    componentProps: {
+      options: getIntDictOptions(DICT_TYPE.USER_TYPE)
+    },
+    colProps: { span: 8 }
+  },
+  {
+    label: '应用名',
+    field: 'applicationName',
+    component: 'Input',
+    colProps: { span: 8 }
+  },
+  {
+    label: '请求地址',
+    field: 'requestUrl',
+    component: 'Input',
+    colProps: { span: 8 }
+  },
+  {
+    label: '异常时间',
+    field: 'exceptionTime',
+    component: 'RangePicker',
+    colProps: { span: 8 }
+  },
+  {
+    label: '处理状态',
+    field: 'processStatus',
+    component: 'Select',
+    componentProps: {
+      options: getIntDictOptions(DICT_TYPE.INFRA_API_ERROR_LOG_PROCESS_STATUS)
+    },
+    colProps: { span: 8 }
+  }
+]

src/views/infra/apiErrorLog/index.vue

@@ -1,3 +1,83 @@
 <template>
-  <div>开发中</div>
+  <div>
+    <BasicTable @register="registerTable">
+      <template #toolbar>
+        <a-button type="warning" @click="handleExport"> {{ t('action.export') }} </a-button>
+      </template>
+      <template #bodyCell="{ column, record }">
+        <template v-if="column.key === 'action'">
+          <TableAction
+            :actions="[
+              {
+                icon: IconEnum.EDIT,
+                label: '已处理',
+                ifShow: () => record.processStatus === InfraApiErrorLogProcessStatusEnum.INIT,
+                onClick: handleProcessClick.bind(null, record, InfraApiErrorLogProcessStatusEnum.DONE, '已处理')
+              },
+              {
+                icon: IconEnum.EDIT,
+                label: '已忽略',
+                ifShow: () => record.processStatus === InfraApiErrorLogProcessStatusEnum.INIT,
+                onClick: handleProcessClick.bind(null, record, InfraApiErrorLogProcessStatusEnum.IGNORE, '已忽略')
+              }
+            ]"
+          />
+        </template>
+      </template>
+    </BasicTable>
+  </div>
 </template>
+<script lang="ts" setup name="ApiErrorLog">
+import { useI18n } from '@/hooks/web/useI18n'
+import { IconEnum } from '@/enums/appEnum'
+import { InfraApiErrorLogProcessStatusEnum } from '@/enums/systemEnum'
+import { useMessage } from '@/hooks/web/useMessage'
+import { BasicTable, useTable, TableAction } from '@/components/Table'
+import { updateApiErrorLogProcess, getApiErrorLogPage, exportApiErrorLog, ApiErrorLogExportReqVO } from '@/api/infra/apiErrorLog'
+import { columns, searchFormSchema } from './apiErrorLog.data'
+
+const { t } = useI18n()
+const { createConfirm, createMessage } = useMessage()
+const [registerTable, { getForm, reload }] = useTable({
+  title: '异常日志列表',
+  api: getApiErrorLogPage,
+  columns,
+  formConfig: {
+    labelWidth: 120,
+    schemas: searchFormSchema
+  },
+  useSearchForm: true,
+  showTableSetting: true,
+  showIndexColumn: false,
+  actionColumn: {
+    width: 180,
+    title: t('common.action'),
+    dataIndex: 'action',
+    fixed: 'right'
+  }
+})
+
+function handleProcessClick(record, processStatus: number, type: string) {
+  createConfirm({
+    iconType: 'warning',
+    content: '确认标记为' + type + '?',
+    async onOk() {
+      await updateApiErrorLogProcess(record.id, processStatus)
+      createMessage.success(t('common.successText'))
+      reload()
+    }
+  })
+}
+
+async function handleExport() {
+  createConfirm({
+    title: t('common.exportTitle'),
+    iconType: 'warning',
+    content: t('common.exportMessage'),
+    async onOk() {
+      await exportApiErrorLog(getForm().getFieldsValue() as ApiErrorLogExportReqVO)
+      createMessage.success(t('common.exportSuccessText'))
+    }
+  })
+}
+</script>