Skip to content

N
nse-ui
Commit 0fa75ffc by 周海峰
Options

系统日志页面

parent 8f9909b1
正在显示 包含 879 行增加 和 0 行删除
src/views/logSet/desensitizationLog/index.vue 0 → 100644
<template>
<div class="app-container">
<div class="page-title">
<el-icon class="title-icon"><Coin /></el-icon>
<span>脱敏日志</span>
</div>
<div class="search-box">
<el-form :model="queryParams" ref="queryForm" :inline="true">
<el-form-item label="用户" prop="user">
<el-select
v-model="queryParams.user"
placeholder="请选择"
clearable
style="width: 200px"
>
<el-option
v-for="item in userOptions"
:key="item.id"
:label="item.realname"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="时间" prop="range">
<el-select
v-model="queryParams.range"
placeholder="请选择时间"
style="width: 200px"
@change="handleTimeRangeChange"
>
<el-option
v-for="item in timeRangeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="项目级" prop="projectId">
<el-select
v-model="queryParams.projectId"
placeholder="请选择项目级"
clearable
style="width: 200px"
>
<el-option
v-for="item in projectLevelOptions"
:key="item.id"
:label="item.project"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button type="primary" icon="Download" @click="handleExport">导出</el-button>
<el-button type="primary" @click="handleCheck">数据完整性校验</el-button>
</el-form-item>
</el-form>
</div>
<el-table
v-loading="loading"
:data="logList"
border
style="width: 100%"
>
<el-table-column prop="user" label="用户" align="left" />
<el-table-column prop="time" label="时间" align="left" width="180" />
<el-table-column prop="moduleId" label="模块编号" align="left" width="120" />
<el-table-column prop="moduleName" label="操作模块" align="left" width="150" />
<el-table-column prop="operation" label="操作信息" align="left" show-overflow-tooltip />
</el-table>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</div>
</template>
<script>
import { Coin } from '@element-plus/icons-vue'
export default {
name: 'DesensitizationLog',
components: {
Coin
},
data() {
return {
// 遮罩层
loading: true,
// 总条数
total: 0,
// 日志列表
logList: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
user: undefined,
range: '0', // 默认选择近三天
startTime: '',
endTime: '',
module: undefined,
projectId: undefined
},
// 用户选项
userOptions: [
{ id: 'admin', realname: 'admin' },
{ id: 'system', realname: 'system' },
{ id: 'test', realname: 'test' }
],
// 时间范围选项
timeRangeOptions: [
{ value: '0', label: '今天' },
{ value: '3', label: '近三天' },
{ value: '7', label: '近一周' },
{ value: '30', label: '近一个月' },
{ value: '90', label: '近三个月' },
{ value: '180', label: '近半年' },
{ value: '全部', label: '全部' }
],
// 项目级选项
projectLevelOptions: [
{ id: '1', project: '一级' },
{ id: '2', project: '二级' },
{ id: '3', project: '三级' }
]
}
},
created() {
this.getList()
},
methods: {
/** 查询日志列表 */
getList() {
this.loading = true
// 这里替换为实际的API调用
// listOperlog(this.queryParams).then(response => {
// this.logList = response.rows
// this.total = response.total
// this.loading = false
// })
// 模拟数据
setTimeout(() => {
this.logList = [
{
user: 'admin',
time: '2025-08-19 19:36:25',
moduleId: 'DDM_00000',
moduleName: '系统模块',
operation: '用户登录'
},
{
user: 'admin',
time: '2025-08-19 19:01:36',
moduleId: 'DDM_00001',
moduleName: '用户管理-用户',
operation: '用户[admin]登录到系统平台。'
}
]
this.total = 53
this.loading = false
}, 200)
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 导出按钮操作 */
handleExport() {
this.$modal.confirm('是否确认导出所有操作日志数据？').then(() => {
this.downloading = true
// 实际导出逻辑
// return exportOperlog(this.queryParams)
}).then(() => {
this.$modal.msgSuccess('导出成功')
this.downloading = false
}).catch(() => {})
},
/** 数据完整性校验操作 */
handleCheck() {
// 实际数据完整性校验逻辑
this.$modal.msgSuccess('数据完整性校验完成')
},
// 处理时间范围变化
handleTimeRangeChange(value) {
const now = new Date()
let startTime = new Date()
switch (value) {
case 'last3days':
startTime.setDate(now.getDate() - 3)
break
case 'lastWeek':
startTime.setDate(now.getDate() - 7)
break
case 'lastMonth':
startTime.setMonth(now.getMonth() - 1)
break
case 'last3Months':
startTime.setMonth(now.getMonth() - 3)
break
case 'lastHalfYear':
startTime.setMonth(now.getMonth() - 6)
break
case 'all':
startTime = null
break
}
if (startTime) {
this.queryParams.startTime = startTime.toISOString().split('T')[0] + ' 00:00:00'
this.queryParams.endTime = now.toISOString().split('T')[0] + ' 23:59:59'
} else {
this.queryParams.startTime = ''
this.queryParams.endTime = ''
}
this.handleQuery()
}
}
}
</script>
<style lang="scss" scoped>
.app-container {
padding: 20px;
.page-title {
display: flex;
align-items: center;
margin-bottom: 20px;
font-size: 16px;
font-weight: bold;
.title-icon {
margin-right: 8px;
font-size: 20px;
color: #409EFF;
}
}
.search-box {
margin-bottom: 20px;
background-color: #fff;
padding: 20px;
border-radius: 4px;
text-align: left;
:deep(.el-form) {
justify-content: flex-start;
}
:deep(.el-form--inline .el-form-item) {
margin-right: 20px;
}
}
.el-table {
margin-top: 20px;
}
:deep(.el-table) {
text-align: left;
}
:deep(.el-cascader) {
width: 100%;
}
}
</style>
src/views/logSet/desensitizationLog/脱敏日志.md 0 → 100644
++ "b/src/views/logSet/desensitizationLog/\350\204\261\346\225\217\346\227\245\345\277\227.md"
src/views/logSet/encryptedLog/index.vue 0 → 100644
<template>
<div class="app-container">
<div class="page-title">
<el-icon class="title-icon"><Lock /></el-icon>
<span>加密日志</span>
</div>
<div class="search-box">
<el-form :model="queryParams" ref="queryForm" :inline="true">
<el-form-item label="用户" prop="user">
<el-select
v-model="queryParams.user"
placeholder="请选择"
clearable
style="width: 200px"
>
<el-option
v-for="item in userOptions"
:key="item.id"
:label="item.realname"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="时间" prop="range">
<el-select
v-model="queryParams.range"
placeholder="请选择时间"
style="width: 200px"
@change="handleTimeRangeChange"
>
<el-option
v-for="item in timeRangeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="项目级" prop="projectId">
<el-select
v-model="queryParams.projectId"
placeholder="请选择项目级"
clearable
style="width: 200px"
>
<el-option
v-for="item in projectLevelOptions"
:key="item.id"
:label="item.project"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button type="primary" icon="Download" @click="handleExport">导出</el-button>
<el-button type="primary" @click="handleCheck">数据完整性校验</el-button>
</el-form-item>
</el-form>
</div>
<el-table
v-loading="loading"
:data="logList"
border
style="width: 100%"
>
<el-table-column prop="user" label="用户" align="left" />
<el-table-column prop="time" label="时间" align="left" width="180" />
<el-table-column prop="moduleId" label="模块编号" align="left" width="120" />
<el-table-column prop="moduleName" label="操作模块" align="left" width="150" />
<el-table-column prop="operation" label="操作信息" align="left" show-overflow-tooltip />
</el-table>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</div>
</template>
<script>
import { Lock } from '@element-plus/icons-vue'
export default {
name: 'EncryptedLog',
components: {
Lock
},
data() {
return {
// 遮罩层
loading: true,
// 总条数
total: 0,
// 日志列表
logList: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
user: undefined,
range: '0', // 默认选择近三天
startTime: '',
endTime: '',
module: undefined,
projectId: undefined
},
// 用户选项
userOptions: [
{ id: 'admin', realname: 'admin' },
{ id: 'system', realname: 'system' },
{ id: 'test', realname: 'test' }
],
// 时间范围选项
timeRangeOptions: [
{ value: '0', label: '今天' },
{ value: '3', label: '近三天' },
{ value: '7', label: '近一周' },
{ value: '30', label: '近一个月' },
{ value: '90', label: '近三个月' },
{ value: '180', label: '近半年' },
{ value: '全部', label: '全部' }
],
// 项目级选项
projectLevelOptions: [
{ id: '1', project: '一级' },
{ id: '2', project: '二级' },
{ id: '3', project: '三级' }
]
}
},
created() {
this.getList()
},
methods: {
/** 查询日志列表 */
getList() {
this.loading = true
// 这里替换为实际的API调用
// listOperlog(this.queryParams).then(response => {
// this.logList = response.rows
// this.total = response.total
// this.loading = false
// })
// 模拟数据
setTimeout(() => {
this.logList = [
{
user: 'admin',
time: '2025-08-19 19:36:25',
moduleId: 'DDM_00000',
moduleName: '系统模块',
operation: '用户登录'
},
{
user: 'admin',
time: '2025-08-19 19:01:36',
moduleId: 'DDM_00001',
moduleName: '用户管理-用户',
operation: '用户[admin]登录到系统平台。'
}
]
this.total = 53
this.loading = false
}, 200)
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 导出按钮操作 */
handleExport() {
this.$modal.confirm('是否确认导出所有操作日志数据？').then(() => {
this.downloading = true
// 实际导出逻辑
// return exportOperlog(this.queryParams)
}).then(() => {
this.$modal.msgSuccess('导出成功')
this.downloading = false
}).catch(() => {})
},
/** 数据完整性校验操作 */
handleCheck() {
// 实际数据完整性校验逻辑
this.$modal.msgSuccess('数据完整性校验完成')
},
// 处理时间范围变化
handleTimeRangeChange(value) {
const now = new Date()
let startTime = new Date()
switch (value) {
case 'last3days':
startTime.setDate(now.getDate() - 3)
break
case 'lastWeek':
startTime.setDate(now.getDate() - 7)
break
case 'lastMonth':
startTime.setMonth(now.getMonth() - 1)
break
case 'last3Months':
startTime.setMonth(now.getMonth() - 3)
break
case 'lastHalfYear':
startTime.setMonth(now.getMonth() - 6)
break
case 'all':
startTime = null
break
}
if (startTime) {
this.queryParams.startTime = startTime.toISOString().split('T')[0] + ' 00:00:00'
this.queryParams.endTime = now.toISOString().split('T')[0] + ' 23:59:59'
} else {
this.queryParams.startTime = ''
this.queryParams.endTime = ''
}
this.handleQuery()
}
}
}
</script>
<style lang="scss" scoped>
.app-container {
padding: 20px;
.page-title {
display: flex;
align-items: center;
margin-bottom: 20px;
font-size: 16px;
font-weight: bold;
.title-icon {
margin-right: 8px;
font-size: 20px;
color: #409EFF;
}
}
.search-box {
margin-bottom: 20px;
background-color: #fff;
padding: 20px;
border-radius: 4px;
text-align: left;
:deep(.el-form) {
justify-content: flex-start;
}
:deep(.el-form--inline .el-form-item) {
margin-right: 20px;
}
}
.el-table {
margin-top: 20px;
}
:deep(.el-table) {
text-align: left;
}
:deep(.el-cascader) {
width: 100%;
}
}
</style>
src/views/logSet/encryptedLog/加密日志.md 0 → 100644
++ "b/src/views/logSet/encryptedLog/\345\212\240\345\257\206\346\227\245\345\277\227.md"
src/views/logSet/operationLog/index.vue 0 → 100644
<template>
<div class="app-container">
<div class="page-title">
<el-icon class="title-icon"><Document /></el-icon>
<span>操作日志</span>
</div>
<div class="search-box">
<el-form :model="queryParams" ref="queryForm" :inline="true">
<el-form-item label="用户" prop="user">
<el-select
v-model="queryParams.user"
placeholder="请选择"
clearable
style="width: 200px"
>
<el-option
v-for="item in userOptions"
:key="item.id"
:label="item.realname"
:value="item.id"
/>
</el-select>
</el-form-item>
<el-form-item label="时间" prop="range">
<el-select
v-model="queryParams.range"
placeholder="请选择时间"
style="width: 200px"
@change="handleTimeRangeChange"
>
<el-option
v-for="item in timeRangeOptions"
:key="item.value"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
<el-form-item label="操作模块" prop="module">
<el-cascader
v-model="queryParams.module"
:options="moduleTreeOptions"
:props="{
checkStrictly: false,
value: 'value',
label: 'label',
emitPath: false,
leaf: true
}"
clearable
style="width: 200px"
placeholder="请选择"
/>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
<el-button type="primary" icon="Download" @click="handleExport">导出</el-button>
<el-button type="primary" @click="handleCheck">数据完整性校验</el-button>
</el-form-item>
</el-form>
</div>
<el-table
v-loading="loading"
:data="logList"
border
style="width: 100%"
>
<el-table-column prop="user" label="用户" align="left" />
<el-table-column prop="time" label="时间" align="left" width="180" />
<el-table-column prop="moduleId" label="模块编号" align="left" width="120" />
<el-table-column prop="moduleName" label="操作模块" align="left" width="150" />
<el-table-column prop="operation" label="操作信息" align="left" show-overflow-tooltip />
</el-table>
<pagination
v-show="total > 0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
</div>
</template>
<script>
import { Document } from '@element-plus/icons-vue'
export default {
name: 'OperationLog',
components: {
Document
},
data() {
return {
// 遮罩层
loading: true,
// 总条数
total: 0,
// 日志列表
logList: [],
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
user: undefined,
range: '0', // 默认选择近三天
startTime: '',
endTime: '',
module: undefined
},
// 用户选项
userOptions: [
{ id: 'admin', realname: 'admin' },
{ id: 'system', realname: 'system' },
{ id: 'test', realname: 'test' }
],
// 时间范围选项
timeRangeOptions: [
{ value: '0', label: '今天' },
{ value: '3', label: '近三天' },
{ value: '7', label: '近一周' },
{ value: '30', label: '近一个月' },
{ value: '90', label: '近三个月' },
{ value: '180', label: '近半年' },
{ value: '全部', label: '全部' }
],
// 模块树选项
moduleTreeOptions: [
{
value: 'project',
label: '项目管理'
},
{
value: 'asset',
label: '资产库'
},
{
value: 'system',
label: '系统设置',
children: [
{ value: 'system_param', label: '系统参数' },
{ value: 'system_backup', label: '系统备份' },
{ value: 'license', label: 'License管理' },
{ value: 'ip_setting', label: 'IP设置' },
{ value: 'control', label: '系统控制台' }
]
},
{
value: 'user',
label: '用户管理'
},
{
value: 'rule',
label: '规则管理'
}
]
}
},
created() {
this.getList()
},
methods: {
/** 查询日志列表 */
getList() {
this.loading = true
// 这里替换为实际的API调用
// listOperlog(this.queryParams).then(response => {
// this.logList = response.rows
// this.total = response.total
// this.loading = false
// })
// 模拟数据
setTimeout(() => {
this.logList = [
{
user: 'admin',
time: '2025-08-19 19:36:25',
moduleId: 'DDM_00000',
moduleName: '系统模块',
operation: '用户登录'
},
{
user: 'admin',
time: '2025-08-19 19:01:36',
moduleId: 'DDM_00001',
moduleName: '用户管理-用户',
operation: '用户[admin]登录到系统平台。'
}
]
this.total = 53
this.loading = false
}, 200)
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1
this.getList()
},
/** 导出按钮操作 */
handleExport() {
this.$modal.confirm('是否确认导出所有操作日志数据？').then(() => {
this.downloading = true
// 实际导出逻辑
// return exportOperlog(this.queryParams)
}).then(() => {
this.$modal.msgSuccess('导出成功')
this.downloading = false
}).catch(() => {})
},
/** 数据完整性校验操作 */
handleCheck() {
// 实际数据完整性校验逻辑
this.$modal.msgSuccess('数据完整性校验完成')
},
// 处理时间范围变化
handleTimeRangeChange(value) {
const now = new Date()
let startTime = new Date()
switch (value) {
case 'last3days':
startTime.setDate(now.getDate() - 3)
break
case 'lastWeek':
startTime.setDate(now.getDate() - 7)
break
case 'lastMonth':
startTime.setMonth(now.getMonth() - 1)
break
case 'last3Months':
startTime.setMonth(now.getMonth() - 3)
break
case 'lastHalfYear':
startTime.setMonth(now.getMonth() - 6)
break
case 'all':
startTime = null
break
}
if (startTime) {
this.queryParams.startTime = startTime.toISOString().split('T')[0] + ' 00:00:00'
this.queryParams.endTime = now.toISOString().split('T')[0] + ' 23:59:59'
} else {
this.queryParams.startTime = ''
this.queryParams.endTime = ''
}
this.handleQuery()
}
}
}
</script>
<style lang="scss" scoped>
.app-container {
padding: 20px;
.page-title {
display: flex;
align-items: center;
margin-bottom: 20px;
font-size: 16px;
font-weight: bold;
.title-icon {
margin-right: 8px;
font-size: 20px;
color: #409EFF;
}
}
.search-box {
margin-bottom: 20px;
background-color: #fff;
padding: 20px;
border-radius: 4px;
text-align: left;
:deep(.el-form) {
justify-content: flex-start;
}
:deep(.el-form--inline .el-form-item) {
margin-right: 20px;
}
}
.el-table {
margin-top: 20px;
}
:deep(.el-table) {
text-align: left;
}
:deep(.el-cascader) {
width: 100%;
}
}
</style>
src/views/logSet/operationLog/操作日志.md 0 → 100644
# 操作日志
# 操作日志
\ No newline at end of file
src/views/logSet/日志.md 0 → 100644
# 系统 日志 模块
# 系统 日志 模块
# 操作日志
# 加密日志
# 脱敏日志
#
\ No newline at end of file
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论