refactor: 优化系统日志、在线用户、存储管理、部门管理相关代码

src/views/monitor/log/login/index.vue

@@ -22,7 +22,7 @@
     </template>
     <template #custom-right>
       <a-tooltip content="导出">
-        <a-button @click="onExport">
+        <a-button v-permission="['monitor:log:export']" @click="onExport">
           <template #icon>
             <icon-download />
           </template>
@@ -109,6 +109,17 @@ const {
   search
 } = useTable((p) => listLog({ ...queryForm, page: p.page, size: p.size }), { immediate: true })
 
+// 过滤查询
+const filterChange = (dataIndex, filteredValues) => {
+  try {
+    const slotName = columns[dataIndex.split('_').pop()].slotName as string
+    queryForm[slotName] = filteredValues.join(',')
+    search()
+  } catch (error) {
+    search()
+  }
+}
+
 // 重置
 const reset = () => {
   queryForm.ip = undefined
@@ -125,17 +136,6 @@ const reset = () => {
 const onExport = () => {
   useDownload(() => exportLoginLog(queryForm))
 }
-
-// 过滤查询
-const filterChange = (dataIndex, filteredValues) => {
-  try {
-    const slotName = columns[dataIndex.split('_').pop()].slotName as string
-    queryForm[slotName] = filteredValues.join(',')
-    search()
-  } catch (error) {
-    search()
-  }
-}
 </script>
 
 <style lang="scss" scoped></style>

src/views/monitor/log/operation/OperationLogDetailDrawer.vue

@@ -82,14 +82,14 @@ const getDataDetail = async () => {
 }
 
 const visible = ref(false)
-// 打开详情
-const open = async (id: string) => {
+// 详情
+const onDetail = async (id: string) => {
   dataId.value = id
   await getDataDetail()
   visible.value = true
 }
 
-defineExpose({ open })
+defineExpose({ onDetail })
 </script>
 
 <style lang="scss" scoped>

src/views/monitor/log/operation/index.vue

@@ -23,7 +23,7 @@
     </template>
     <template #custom-right>
       <a-tooltip content="导出">
-        <a-button @click="onExport">
+        <a-button v-permission="['monitor:log:export']" @click="onExport">
           <template #icon>
             <icon-download />
           </template>
@@ -31,7 +31,7 @@
       </a-tooltip>
     </template>
     <template #createTime="{ record }">
-      <a-link @click="openDetail(record)">{{ record.createTime }}</a-link>
+      <a-link @click="onDetail(record)">{{ record.createTime }}</a-link>
     </template>
     <template #status="{ record }">
       <a-tag v-if="record.status === 1" color="green">
@@ -57,9 +57,9 @@
 
 <script setup lang="ts">
 import { listLog, exportOperationLog, type LogResp } from '@/apis'
+import OperationLogDetailDrawer from './OperationLogDetailDrawer.vue'
 import type { TableInstanceColumns } from '@/components/GiTable/type'
 import DateRangePicker from '@/components/DateRangePicker/index.vue'
-import OperationLogDetailDrawer from './OperationLogDetailDrawer.vue'
 import { useTable, useDownload } from '@/hooks'
 import dayjs from 'dayjs'
 
@@ -121,7 +121,18 @@ const {
   search
 } = useTable((p) => listLog({ ...queryForm, page: p.page, size: p.size }), { immediate: true })
 
-// 重置查询
+// 过滤查询
+const filterChange = (dataIndex, filteredValues) => {
+  try {
+    const slotName = columns[dataIndex.split('_').pop()].slotName as string
+    queryForm[slotName] = filteredValues.join(',')
+    search()
+  } catch (error) {
+    search()
+  }
+}
+
+// 重置
 const reset = () => {
   queryForm.description = undefined
   queryForm.ip = undefined
@@ -139,21 +150,10 @@ const onExport = () => {
   useDownload(() => exportOperationLog(queryForm))
 }
 
-// 过滤查询
-const filterChange = (dataIndex, filteredValues) => {
-  try {
-    const slotName = columns[dataIndex.split('_').pop()].slotName as string
-    queryForm[slotName] = filteredValues.join(',')
-    search()
-  } catch (error) {
-    search()
-  }
-}
-
 const OperationLogDetailDrawerRef = ref<InstanceType<typeof OperationLogDetailDrawer>>()
-// 查询详情
-const openDetail = (item: LogResp) => {
-  OperationLogDetailDrawerRef.value?.open(item.id)
+// 详情
+const onDetail = (item: LogResp) => {
+  OperationLogDetailDrawerRef.value?.onDetail(item.id)
 }
 </script>
 

src/views/monitor/online/index.vue

@@ -28,6 +28,7 @@
               @ok="handleKickout(record.token)"
             >
               <a-link
+                v-permission="['monitor:online:kickout']"
                 status="danger"
                 :title="currentToken === record.token ? '不能强退自己' : '强退'"
                 :disabled="currentToken === record.token"
@@ -50,9 +51,12 @@ import DateRangePicker from '@/components/DateRangePicker/index.vue'
 import { useUserStore } from '@/stores'
 import { useTable } from '@/hooks'
 import { isMobile } from '@/utils'
+import has from '@/utils/has'
 
 defineOptions({ name: 'MonitorOnline' })
 
+const userStore = useUserStore()
+const currentToken = userStore.token
 const columns: TableInstanceColumns[] = [
   {
     title: '序号',
@@ -66,7 +70,13 @@ const columns: TableInstanceColumns[] = [
   { title: '浏览器', dataIndex: 'browser', ellipsis: true, tooltip: true },
   { title: '终端系统', dataIndex: 'os', ellipsis: true, tooltip: true },
   { title: '登录时间', dataIndex: 'loginTime', width: 180 },
-  { title: '操作', slotName: 'action', align: 'center', fixed: !isMobile() ? 'right' : undefined }
+  {
+    title: '操作',
+    slotName: 'action',
+    align: 'center',
+    fixed: !isMobile() ? 'right' : undefined,
+    show: has.hasPermOr(['monitor:online:kickout'])
+  }
 ]
 
 const queryForm = reactive({
@@ -89,8 +99,6 @@ const reset = () => {
   search()
 }
 
-const userStore = useUserStore()
-const currentToken = userStore.token
 // 强退
 const handleKickout = (token: string) => {
   kickout(token).then(() => {