From eff623823502ab79efef903f3b183d2a02db907d Mon Sep 17 00:00:00 2001
From: zhangxy102 <zhangxy102@lenovo.com>
Date: Sat, 6 Aug 2022 23:36:35 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E6=97=A5=E5=BF=97=E6=A8=A1=E5=9D=97?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/log.ts                     |  38 +++++
 src/components/QuickForm/index.vue |  12 +-
 src/router/dynamicRouter.ts        |   1 +
 src/types/form.ts                  |   1 +
 src/types/log.ts                   |  16 ++
 src/views/menu/index.vue           |   2 +-
 src/views/system/log/operate.vue   | 240 ++++++++++++++++++++---------
 src/views/system/menu/index.vue    |   2 +-
 8 files changed, 240 insertions(+), 72 deletions(-)
 create mode 100644 src/api/log.ts
 create mode 100644 src/types/log.ts

diff --git a/src/api/log.ts b/src/api/log.ts
new file mode 100644
index 0000000..d2613e0
--- /dev/null
+++ b/src/api/log.ts
@@ -0,0 +1,38 @@
+import { Log } from '../types/log'
+import request, { QuickResponseData } from '../utils/request'
+
+const Api = {
+  pageList: '/api/log/getPageList',
+  remove: '/api/log/remove',
+  batchRemove: '/api/log/batchRemove',
+}
+
+export const getLogPageList = (
+  params: any
+): Promise<QuickResponseData<Array<Log>>> => {
+  return request<QuickResponseData<Array<Log>>>({
+    url: Api.pageList,
+    method: 'GET',
+    params,
+  })
+}
+
+export const removeLog = (id: string) => {
+  return request({
+    url: Api.remove,
+    method: 'POST',
+    data: {
+      id,
+    },
+  })
+}
+
+export const batchRemove = (ids: string) => {
+  return request({
+    url: Api.batchRemove,
+    method: 'POST',
+    data: {
+      ids,
+    },
+  })
+}
diff --git a/src/components/QuickForm/index.vue b/src/components/QuickForm/index.vue
index 59c520f..cda9f5c 100644
--- a/src/components/QuickForm/index.vue
+++ b/src/components/QuickForm/index.vue
@@ -195,6 +195,17 @@ defineExpose({ handleSubmit })
             :inactive-value="0"
           />
         </template>
+        <template v-else-if="item.type === 'datetimerange'">
+          <el-date-picker
+            v-model="model[item.vModel]"
+            type="datetimerange"
+            range-separator="To"
+            value-format="X"
+            format="YYYY-MM-DD HH:mm:ss"
+            :start-placeholder="item.placeholders[0]"
+            :end-placeholder="item.placeholders[1]"
+          />
+        </template>
         <template v-else-if="item.type === 'tree'">
           <el-tree-select
             v-model="model[item.vModel]"
@@ -210,7 +221,6 @@ defineExpose({ handleSubmit })
           />
         </template>
         <template v-else-if="item.type == 'icon'">
-          <!-- v-model:visible="iconVisible" -->
           <el-popover placement="bottom" width="1000px" trigger="click">
             <template #reference>
               <el-input
diff --git a/src/router/dynamicRouter.ts b/src/router/dynamicRouter.ts
index 8d46e66..e205a7d 100644
--- a/src/router/dynamicRouter.ts
+++ b/src/router/dynamicRouter.ts
@@ -58,6 +58,7 @@ const formatRouter = (data: Menu[]) => {
     if (childMenu.length > 0) {
       routerObj.redirect = childMenu[0].path
       childMenu.forEach((childElement: Menu) => {
+        if (childElement.link) return
         const component = getComponent(childElement)
         const childRouterObj: RouteRecordRaw = {
           name: childElement.menuId,
diff --git a/src/types/form.ts b/src/types/form.ts
index c53dc30..853cfa4 100644
--- a/src/types/form.ts
+++ b/src/types/form.ts
@@ -31,6 +31,7 @@ export interface FormItem {
   rules?: any
   width?: string
   maxLength?: string
+  placeholders?: Array<string>
   format?: () => any
   change?: (value: string) => void
   select?: (value: string) => void
diff --git a/src/types/log.ts b/src/types/log.ts
new file mode 100644
index 0000000..ad471ce
--- /dev/null
+++ b/src/types/log.ts
@@ -0,0 +1,16 @@
+export interface Log {
+  id: string | number
+  logTime: string
+  operateApi: string
+  requestParams?: string
+  errorMessage?: string
+  exceptionMessage?: string
+  ip: string
+  logType: number
+}
+export interface SearchLog {
+  startTime?: string
+  endTime?: string
+  operateUserId?: string
+  logTime: string
+}
diff --git a/src/views/menu/index.vue b/src/views/menu/index.vue
index 48457a6..02266c1 100644
--- a/src/views/menu/index.vue
+++ b/src/views/menu/index.vue
@@ -5,7 +5,7 @@ import { selectTreeFormat, listToTree } from '@/utils/index'
 import { Column, Actionbar, Toolbar } from '@/types/table'
 import { Menu } from '@/types/menu'
 import { FormItem } from '@/types/form'
-import { Options } from '@/types/options.js'
+import { Options } from '@/types/options'
 import { getMenuList, addMenu, updateMenu, deleteMenu } from '@/api/menu'
 import QuickCrud from '@/components/QuickCrud/index.vue'
 
diff --git a/src/views/system/log/operate.vue b/src/views/system/log/operate.vue
index a269961..c330f02 100644
--- a/src/views/system/log/operate.vue
+++ b/src/views/system/log/operate.vue
@@ -3,112 +3,183 @@ import { reactive } from 'vue'
 import { ElMessage, ElMessageBox } from 'element-plus'
 import QuickCrud from '@/components/QuickCrud/index.vue'
 import { Column, Actionbar, Toolbar } from '@/types/table'
-import { Role } from '@/types/role'
+import { Log, SearchLog } from '@/types/log'
 import { FormItem } from '@/types/form'
-import { getRoleList, addRole, updateRole, deleteRole } from '@/api/role'
+import { Page } from '@/types/page'
+import { getLogPageList, removeLog, batchRemove } from '@/api/log'
 
-const dataList = reactive<Array<Role>>([])
+const dataList = reactive<Array<Log>>([])
 /**
  * 表单
  */
 const dialogTitle = reactive({
-  add: '新增角色',
-  edit: '编辑角色',
-  detail: '角色详情',
+  // add: '添加日志',
+  // edit: '编辑日志',
+  detail: '日志详情',
 })
-const formModel = reactive<Role>({
+const formModel = reactive<Log>({
   id: '',
-  roleId: '',
-  roleName: '',
+  logTime: '',
+  operateApi: '',
+  requestParams: '',
+  errorMessage: '',
+  exceptionMessage: '',
+  ip: '',
+  logType: 0,
 })
 const formItems = reactive<Array<FormItem>>([
   {
-    label: '角色编号',
+    label: '编号',
     labelWidth: '80px',
-    vModel: 'roleId',
-    placeholder: '角色编号',
-    editReadonly: true,
-    prop: 'roleId',
-    rules: [
-      {
-        required: true,
-        message: '角色编号不能为空',
-        trigger: 'blur',
-      },
-    ],
-  },
-  {
-    label: '角色名称',
+    vModel: 'id',
+  },
+  {
+    label: '日志时间',
+    labelWidth: '80px',
+    vModel: 'logTime',
+  },
+  {
+    label: '操作接口',
+    labelWidth: '80px',
+    vModel: 'operateApi',
+  },
+  {
+    label: 'IP',
+    labelWidth: '80px',
+    vModel: 'ip',
+  },
+  {
+    label: '请求参数',
+    labelWidth: '80px',
+    vModel: 'requestParams',
+  },
+  {
+    label: '操作人',
+    labelWidth: '80px',
+    vModel: 'operateUserId',
+  },
+  {
+    label: '错误信息',
+    labelWidth: '80px',
+    vModel: 'errorMessage',
+  },
+  {
+    label: '异常信息',
     labelWidth: '80px',
-    vModel: 'roleName',
-    placeholder: '角色名称',
-    prop: 'roleName',
-    rules: [
-      {
-        required: true,
-        message: '角色名称不能为空',
-        trigger: 'blur',
-      },
-    ],
+    vModel: 'exceptionMessage',
+    type: 'textarea',
+  },
+])
+
+/**
+ * 搜索
+ */
+const searchForm = reactive<SearchLog>({
+  startTime: '',
+  endTime: '',
+  operateUserId: '',
+  logTime: '',
+})
+const searchFormItems = reactive<Array<FormItem>>([
+  {
+    label: '日志时间',
+    vModel: 'logTime',
+    placeholders: ['开始时间', '结束时间'],
+    type: 'datetimerange',
+  },
+  {
+    label: '操作人',
+    vModel: 'operateUserId',
+    placeholder: '操作人',
   },
 ])
-const handleFormSubmit = (form: Role, done: any) => {
-  console.log('handleFormSubmit', form)
-  if (form.id) {
-    updateRole(form).then(() => {
-      ElMessage({
-        type: 'success',
-        message: '角色修改成功',
-      })
-      done()
-    })
-  } else {
-    addRole(form).then(() => {
-      ElMessage({
-        type: 'success',
-        message: '角色创建成功',
-      })
-      done()
-    })
-  }
-}
 /**
  * 工具栏
  */
 const tableToolbar = reactive<Toolbar>({
-  hiddenBatchDeleteButton: true,
   hiddenImportButton: true,
   hiddenExportButton: true,
+  hiddenAddButton: true,
   hiddenPrintButton: true,
 })
+const handleBatchDelete = (data: any, done: any) => {
+  const { checkDataList, ids } = data
+  ElMessageBox.confirm(`你真的删除选择的日志吗？`, '警告', {
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+    type: 'warning',
+  }).then(() => {
+    batchRemove(ids).then(() => {
+      ElMessage({
+        type: 'success',
+        message: '日志删除成功',
+      })
+      done()
+    })
+  })
+}
+const handleImport = (done: any) => {
+  done()
+}
+const handleExport = () => {
+  // window.open(`${window.location.origin}/日志报表.xlsx`)//TODO:导出bug
+}
+const handlePrint = () => {
+  window.print()
+}
 /**
  * 表格
  */
 const tableColumns = reactive<Array<Column>>([
   {
-    width: '50',
+    width: '100',
     type: 'selection',
+    align: 'center',
   },
   {
-    label: '角色编号',
-    prop: 'roleId',
+    label: '日志时间',
+    prop: 'logTime',
     width: '200',
   },
   {
-    label: '角色名称',
-    prop: 'roleName',
+    label: '操作接口',
+    prop: 'operateApi',
+    width: '300',
+  },
+  {
+    label: 'IP',
+    prop: 'ip',
+    width: '120',
+  },
+  {
+    label: '请求参数',
+    prop: 'requestParams',
+    width: '180',
+  },
+  {
+    label: '操作人',
+    prop: 'operateUserId',
+    width: '100',
+    //   format: (row: Log) => {
+    //   return row.enabled === 1 ? '禁用' : '启用'
+    // },
+  },
+  {
+    label: '错误信息',
+    prop: 'errorMessage',
+    width: '200',
   },
 ])
-const handleDelete = (item: Role, done: any) => {
-  ElMessageBox.confirm(`你真的删除【${item.roleName}】的角色吗？`, '警告', {
+const handleDelete = (item: Log, done: any) => {
+  ElMessageBox.confirm(`你真的删除【${item.id}】的日志吗？`, '警告', {
     confirmButtonText: '确定',
     cancelButtonText: '取消',
     type: 'warning',
   }).then(() => {
-    deleteRole(item.id).then(() => {
+    removeLog(item.id.toString()).then(() => {
       ElMessage({
         type: 'success',
-        message: '角色删除成功',
+        message: '日志删除成功',
       })
       done()
     })
@@ -116,15 +187,38 @@ const handleDelete = (item: Role, done: any) => {
 }
 const tableActionbar = reactive<Actionbar>({
   width: 150,
+  hiddenEditButton: true,
+})
+/**
+ * 分页
+ */
+const page = reactive<Page>({
+  current: 1,
+  size: 10,
+  sizes: [10, 20, 30, 40, 50],
+  total: 100,
 })
 /**
  * 加载数据
  */
-const load = () => {
-  getRoleList().then((res) => {
-    const { data: roleList } = res
-    dataList.length = 0
-    dataList.push(...roleList)
+const load = (params: any) => {
+  let obj = {}
+  const { logTime } = params
+  if (logTime) {
+    obj = { ...params, startTime: logTime[0], endTime: logTime[1] }
+  } else {
+    obj = { ...params }
+  }
+
+  getLogPageList(obj).then((res: any) => {
+    const { data: logList, page: pagination } = res
+    if (logList) {
+      dataList.length = 0
+      dataList.push(...logList)
+    }
+    if (pagination) {
+      page.total = pagination.total
+    }
   })
 }
 </script>
@@ -137,9 +231,17 @@ const load = () => {
     :table-columns="tableColumns"
     :table-actionbar="tableActionbar"
     :table-toolbar="tableToolbar"
+    :search-form-items="searchFormItems"
+    :search-form-model="searchForm"
     dialog-titles="dialogTitles"
+    :page="page"
+    :form-inline="true"
     @on-load="load"
     @on-form-submit="handleFormSubmit"
     @on-delete="handleDelete"
+    @on-batch-delete="handleBatchDelete"
+    @on-import="handleImport"
+    @on-export="handleExport"
+    @on-print="handlePrint"
   ></quick-crud>
 </template>
diff --git a/src/views/system/menu/index.vue b/src/views/system/menu/index.vue
index a062c19..5a3f887 100644
--- a/src/views/system/menu/index.vue
+++ b/src/views/system/menu/index.vue
@@ -5,7 +5,7 @@ import { selectTreeFormat, listToTree } from '@/utils/index'
 import { Column, Actionbar, Toolbar } from '@/types/table'
 import { Menu } from '@/types/menu'
 import { FormItem } from '@/types/form'
-import { Options } from '@/types/options.js'
+import { Options } from '@/types/options'
 import { getMenuList, addMenu, updateMenu, deleteMenu } from '@/api/menu'
 import QuickCrud from '@/components/QuickCrud/index.vue'
 import elementPlusIcons from '@/config/custormIcons.json'
-- 
Gitee