|
@@ -0,0 +1,288 @@
|
|
|
|
|
+<template>
|
|
|
|
|
+ <cacp-search-layout>
|
|
|
|
|
+ <template #search>
|
|
|
|
|
+ <cacp-search-panel-layout
|
|
|
|
|
+ :model="state.queryData"
|
|
|
|
|
+ ref="queryFormRef"
|
|
|
|
|
+ label-position="left"
|
|
|
|
|
+ label-width="auto"
|
|
|
|
|
+ :gutter="30"
|
|
|
|
|
+ :colSpan="6"
|
|
|
|
|
+ >
|
|
|
|
|
+ <el-form-item label="操作用户" prop="operUserId">
|
|
|
|
|
+ <el-input v-model="state.queryData.operUserId" clearable />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <el-form-item label="操作类型" prop="actType">
|
|
|
|
|
+ <el-select v-model="state.queryData.actType" clearable>
|
|
|
|
|
+ <el-option v-for="item in dict.bus_log" :key="item.dictValue" :label="item.dictLabel"
|
|
|
|
|
+ :value="item.dictValue" />
|
|
|
|
|
+ </el-select>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <el-form-item label="操作时间">
|
|
|
|
|
+ <el-date-picker
|
|
|
|
|
+ type="date"
|
|
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
|
|
+ v-model="state.queryData.beginDate"
|
|
|
|
|
+ placeholder="开始时间"
|
|
|
|
|
+ />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <el-form-item label="到">
|
|
|
|
|
+ <el-date-picker
|
|
|
|
|
+ type="date"
|
|
|
|
|
+ value-format="YYYY-MM-DD"
|
|
|
|
|
+ v-model="state.queryData.endDate"
|
|
|
|
|
+ placeholder="结束时间"
|
|
|
|
|
+ />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ <template #buttonGroup>
|
|
|
|
|
+ <el-button type="primary" @click="onSearch">查询</el-button>
|
|
|
|
|
+ <el-button type="info" @click="onReset">重置</el-button>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </cacp-search-panel-layout>
|
|
|
|
|
+ </template>
|
|
|
|
|
+
|
|
|
|
|
+ <cacp-complex-table
|
|
|
|
|
+ :actions="actions"
|
|
|
|
|
+ :data="tableData"
|
|
|
|
|
+ :pagination="tablePagination"
|
|
|
|
|
+ :actionsWidth="120"
|
|
|
|
|
+ @selection-change="handleSelectionChange"
|
|
|
|
|
+ @on-page-change="onPageChange"
|
|
|
|
|
+ @on-size-change="onSizeChange"
|
|
|
|
|
+ :loading="loading"
|
|
|
|
|
+ >
|
|
|
|
|
+ <el-table-column label="序号" property="index" width="60" align="center" >
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ {{scope.$index + 1}}
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ <el-table-column property="subject" label="操作模块" :show-overflow-tooltip="true" />
|
|
|
|
|
+ <el-table-column property="content" label="日志详情" :show-overflow-tooltip="true" />
|
|
|
|
|
+ <el-table-column property="operUserId" label="操作用户" :show-overflow-tooltip="true" />
|
|
|
|
|
+ <el-table-column property="operDeptId" label="操作用户机构" :show-overflow-tooltip="true" />
|
|
|
|
|
+<!-- <el-table-column property="status" label="操作状态:1-成功,0-失败" width="120" :show-overflow-tooltip="true" />-->
|
|
|
|
|
+ <el-table-column property="clientIp" label="客户端IP" width="180" :show-overflow-tooltip="true" />
|
|
|
|
|
+ <el-table-column property="createTime" label="操作时间" width="180" :show-overflow-tooltip="true" />
|
|
|
|
|
+ <el-table-column property="actType" label="操作类型" width="120" :show-overflow-tooltip="true" >
|
|
|
|
|
+ <template #default="scope">
|
|
|
|
|
+ <dict-tag :options="dict.bus_log" :dict-value="scope.row.actType" />
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </el-table-column>
|
|
|
|
|
+ </cacp-complex-table>
|
|
|
|
|
+ </cacp-search-layout>
|
|
|
|
|
+
|
|
|
|
|
+ <!--查看弹框-->
|
|
|
|
|
+ <cacp-dialog
|
|
|
|
|
+ v-model="state.viewDialogVisible"
|
|
|
|
|
+ :resizable="false"
|
|
|
|
|
+ :title="state.viewTitle"
|
|
|
|
|
+ width="50%"
|
|
|
|
|
+ >
|
|
|
|
|
+ <el-form
|
|
|
|
|
+ :model="state.viewForm"
|
|
|
|
|
+ label-width="auto"
|
|
|
|
|
+ label-position="left"
|
|
|
|
|
+ :disabled="true"
|
|
|
|
|
+ >
|
|
|
|
|
+ <el-row :gutter="20">
|
|
|
|
|
+ <el-col :span="12">
|
|
|
|
|
+ <el-form-item label="操作模块:" prop="subject">
|
|
|
|
|
+ <span>{{ state.viewForm.subject || '-' }}</span>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="12">
|
|
|
|
|
+ <el-form-item label="操作详情:" prop="content">
|
|
|
|
|
+ <span>{{ state.viewForm.content || '-' }}</span>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="12">
|
|
|
|
|
+ <el-form-item label="操作用户:" prop="operUserId">
|
|
|
|
|
+ <span>{{ state.viewForm.operUserId || '-' }}</span>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="12">
|
|
|
|
|
+ <el-form-item label="操作用户机构:" prop="operDeptId">
|
|
|
|
|
+ <span>{{ state.viewForm.operDeptId || '-' }}</span>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="12">
|
|
|
|
|
+ <el-form-item label="操作时间:" prop="createTime">
|
|
|
|
|
+ <span>{{ state.viewForm.createTime || '-' }}</span>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="12">
|
|
|
|
|
+ <el-form-item label="客户端IP:" prop="clientIp">
|
|
|
|
|
+ <span>{{ state.viewForm.clientIp || '-' }}</span>
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ <el-col :span="12">
|
|
|
|
|
+ <el-form-item label="操作类型:" prop="actType">
|
|
|
|
|
+ <dict-tag :options="dict.bus_log" :dict-value="state.viewForm.actType" />
|
|
|
|
|
+ </el-form-item>
|
|
|
|
|
+ </el-col>
|
|
|
|
|
+ </el-row>
|
|
|
|
|
+ </el-form>
|
|
|
|
|
+ </cacp-dialog>
|
|
|
|
|
+</template>
|
|
|
|
|
+
|
|
|
|
|
+<script lang="ts" setup>
|
|
|
|
|
+import { onMounted, reactive, ref } from 'vue'
|
|
|
|
|
+import { ElMessage } from 'element-plus'
|
|
|
|
|
+import config from '@/config'
|
|
|
|
|
+import {
|
|
|
|
|
+ SuccessResultCode,
|
|
|
|
|
+ useComplexTable,
|
|
|
|
|
+ type SearchPanelLayoutInstance,
|
|
|
|
|
+ type TableAction,
|
|
|
|
|
+ useLoading
|
|
|
|
|
+} from '@cacp/ui'
|
|
|
|
|
+import type { BusLog, BusLogQuery } from '@/types/system/BusLog'
|
|
|
|
|
+import { getList} from '@/apis/system/BusLog'
|
|
|
|
|
+import { permissionStatus } from '@/utils/globalPermission'
|
|
|
|
|
+import DictTag from '@/components/DictTag/dictTag.vue'
|
|
|
|
|
+import { useDictType } from '@/components/useDict'
|
|
|
|
|
+const { dict } = useDictType('bus_log')
|
|
|
|
|
+
|
|
|
|
|
+// 表单引用
|
|
|
|
|
+const queryFormRef = ref<SearchPanelLayoutInstance>()
|
|
|
|
|
+
|
|
|
|
|
+// 加载状态
|
|
|
|
|
+const { loading, setLoading } = useLoading()
|
|
|
|
|
+
|
|
|
|
|
+// 表格 Hook
|
|
|
|
|
+const tableHooks = useComplexTable<BusLog>(config)
|
|
|
|
|
+const { tableData, tablePagination, setPagination, setPageIndex, setPageSizes } = tableHooks
|
|
|
|
|
+
|
|
|
|
|
+// 响应式数据
|
|
|
|
|
+interface State {
|
|
|
|
|
+ queryData: BusLogQuery
|
|
|
|
|
+ formData: BusLog
|
|
|
|
|
+ viewForm: BusLog
|
|
|
|
|
+ viewTitle: string
|
|
|
|
|
+ viewDialogVisible: boolean
|
|
|
|
|
+ title: string
|
|
|
|
|
+ isEdit: boolean
|
|
|
|
|
+ dialogVisible: boolean
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+const state = reactive<State>({
|
|
|
|
|
+ queryData: {
|
|
|
|
|
+ type: '2',
|
|
|
|
|
+ subject: '',
|
|
|
|
|
+ content: '',
|
|
|
|
|
+ operUserId: '',
|
|
|
|
|
+ operDeptId: '',
|
|
|
|
|
+ createTime: '',
|
|
|
|
|
+ clientIp: '',
|
|
|
|
|
+ actType: '',
|
|
|
|
|
+ pageIndex: tablePagination.currentPage,
|
|
|
|
|
+ pageSize: tablePagination.pageSize
|
|
|
|
|
+ },
|
|
|
|
|
+ formData: {
|
|
|
|
|
+ id: '',
|
|
|
|
|
+ type: '',
|
|
|
|
|
+ subject: '',
|
|
|
|
|
+ content: '',
|
|
|
|
|
+ operUserId: '',
|
|
|
|
|
+ operDeptId: '',
|
|
|
|
|
+ status: '',
|
|
|
|
|
+ createTime: '',
|
|
|
|
|
+ clientIp: '',
|
|
|
|
|
+ actType: '',
|
|
|
|
|
+ } as BusLog,
|
|
|
|
|
+ viewForm: {} as BusLog,
|
|
|
|
|
+ viewTitle: '',
|
|
|
|
|
+ viewDialogVisible: false,
|
|
|
|
|
+ title: '',
|
|
|
|
|
+ isEdit: false,
|
|
|
|
|
+ dialogVisible: false,
|
|
|
|
|
+})
|
|
|
|
|
+
|
|
|
|
|
+// 表格操作按钮配置
|
|
|
|
|
+const actions = <Array<TableAction>>[
|
|
|
|
|
+ {
|
|
|
|
|
+ key: 'view',
|
|
|
|
|
+ text: '查看',
|
|
|
|
|
+ onclick: onView,
|
|
|
|
|
+ limit: 'one',
|
|
|
|
|
+ // limit: permissionStatus('one', 'BUS_OPERA_LOG_VIEW_BT'),
|
|
|
|
|
+ type: 'primary'
|
|
|
|
|
+ },
|
|
|
|
|
+]
|
|
|
|
|
+
|
|
|
|
|
+// 选中项的 ID 数组
|
|
|
|
|
+const ids = ref<string[]>([])
|
|
|
|
|
+
|
|
|
|
|
+// 多选框选中数据
|
|
|
|
|
+function handleSelectionChange(selection: BusLog[]) {
|
|
|
|
|
+ ids.value = selection
|
|
|
|
|
+ .map(item => item.id)
|
|
|
|
|
+ .filter((id): id is string => id != null && id !== undefined)
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 搜索方法
|
|
|
|
|
+const onSearch = () => {
|
|
|
|
|
+ setPageIndex(1)
|
|
|
|
|
+ onLoadData()
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 重置方法
|
|
|
|
|
+const onReset = () => {
|
|
|
|
|
+ queryFormRef.value?.resetFields()
|
|
|
|
|
+ state.queryData.beginDate = ''
|
|
|
|
|
+ state.queryData.endDate = ''
|
|
|
|
|
+ onPageChange(1)
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 每页显示条数变化
|
|
|
|
|
+const onSizeChange = (size: number) => {
|
|
|
|
|
+ setPageSizes(size)
|
|
|
|
|
+ onLoadData()
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 翻页查询
|
|
|
|
|
+const onPageChange = (currentPage: number) => {
|
|
|
|
|
+ setPageIndex(currentPage)
|
|
|
|
|
+ onLoadData()
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 查看
|
|
|
|
|
+function onView(row: BusLog) {
|
|
|
|
|
+ state.viewForm = { ...row }
|
|
|
|
|
+ state.viewDialogVisible = true
|
|
|
|
|
+ state.viewTitle = '查看操作日志详情'
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+// 数据查询
|
|
|
|
|
+async function onLoadData() {
|
|
|
|
|
+ setLoading(true)
|
|
|
|
|
+ try {
|
|
|
|
|
+ const query = {
|
|
|
|
|
+ ...state.queryData,
|
|
|
|
|
+ pageIndex: tablePagination.currentPage,
|
|
|
|
|
+ pageSize: tablePagination.pageSize
|
|
|
|
|
+ }
|
|
|
|
|
+ const res = await getList(query)
|
|
|
|
|
+ if (res.code === SuccessResultCode) {
|
|
|
|
|
+ setPagination(res.data)
|
|
|
|
|
+ } else {
|
|
|
|
|
+ ElMessage.error(res.message || '查询失败')
|
|
|
|
|
+ }
|
|
|
|
|
+ } catch (error) {
|
|
|
|
|
+ console.error('查询失败:', error)
|
|
|
|
|
+ ElMessage.error('查询失败')
|
|
|
|
|
+ } finally {
|
|
|
|
|
+ setLoading(false)
|
|
|
|
|
+ }
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+
|
|
|
|
|
+// 组件挂载时加载数据
|
|
|
|
|
+onMounted(() => {
|
|
|
|
|
+ onLoadData()
|
|
|
|
|
+})
|
|
|
|
|
+</script>
|
|
|
|
|
+
|
|
|
|
|
+<style scoped>
|
|
|
|
|
+/* 自定义样式 */
|
|
|
|
|
+</style>
|