初始化
This commit is contained in:
张怡蓉
166
ruoyi-ui/src/views/monitor/cache/index.vue
vendored
Normal file
166
ruoyi-ui/src/views/monitor/cache/index.vue
vendored
Normal file
@@ -0,0 +1,166 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="24" class="card-box">
|
||||
<el-card>
|
||||
<div slot="header"><span><i class="el-icon-monitor"></i>基本信息</span></div>
|
||||
<div class="el-table el-table--enable-row-hover el-table--medium">
|
||||
<table cellspacing="0" style="width: 100%">
|
||||
<tbody>
|
||||
<tr>
|
||||
<!-- Redis版本 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">Redis版本</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.redis_version }}</div></td>
|
||||
<!-- 运行模式 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">运行模式</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.redis_mode == "standalone" ? "单机" : "集群" }}</div></td>
|
||||
<!-- 端口 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">端口</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.tcp_port }}</div></td>
|
||||
<!-- 客户端数 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">客户端数</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.connected_clients }}</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- 运行时间 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">运行时间</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.uptime_in_days }}</div></td>
|
||||
<!-- 使用内存 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">使用内存</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.used_memory_human }}</div></td>
|
||||
<!-- 使用CPU -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">使用CPU</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ parseFloat(cache.info.used_cpu_user_children).toFixed(2) }}</div></td>
|
||||
<!-- 内存配置 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">内存配置</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.maxmemory_human }}</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- AOF是否开启 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">AOF是否开启</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.aof_enabled == "0" ? "关闭" : "开启" }}</div></td>
|
||||
<!-- RDB是否成功 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">RDB是否成功</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.rdb_last_bgsave_status }}</div></td>
|
||||
<!-- Key数量 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">Key数量</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="cache.dbSize">{{ cache.dbSize }} </div></td>
|
||||
<!-- 网络入口/出口 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">网络入口/出口</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="cache.info">{{ cache.info.instantaneous_input_kbps }}kps/{{cache.info.instantaneous_output_kbps}}kps</div></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="card-box">
|
||||
<el-card>
|
||||
<!-- 命令统计 -->
|
||||
<div slot="header"><span><i class="el-icon-pie-chart"></i>命令统计</span></div>
|
||||
<div class="el-table el-table--enable-row-hover el-table--medium">
|
||||
<div ref="commandstats" style="height: 420px" />
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="card-box">
|
||||
<el-card>
|
||||
<!-- 内存信息 -->
|
||||
<div slot="header"><span><i class="el-icon-odometer"></i>内存信息</span></div>
|
||||
<div class="el-table el-table--enable-row-hover el-table--medium">
|
||||
<div ref="usedmemory" style="height: 420px" />
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getCache } from "@/api/monitor/cache"
|
||||
import * as echarts from "echarts"
|
||||
|
||||
export default {
|
||||
name: "Cache",
|
||||
data() {
|
||||
return {
|
||||
// 统计命令信息
|
||||
commandstats: null,
|
||||
// 使用内存
|
||||
usedmemory: null,
|
||||
// cache信息
|
||||
cache: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
this.openLoading()
|
||||
},
|
||||
methods: {
|
||||
/** 查缓存询信息 */
|
||||
getList() {
|
||||
getCache().then((response) => {
|
||||
this.cache = response.data
|
||||
this.$modal.closeLoading()
|
||||
|
||||
this.commandstats = echarts.init(this.$refs.commandstats, "macarons")
|
||||
this.commandstats.setOption({
|
||||
tooltip: {
|
||||
trigger: "item",
|
||||
formatter: "{a} <br/>{b} : {c} ({d}%)",
|
||||
},
|
||||
series: [
|
||||
{
|
||||
// 命令
|
||||
name: "命令",
|
||||
type: "pie",
|
||||
roseType: "radius",
|
||||
radius: [15, 95],
|
||||
center: ["50%", "38%"],
|
||||
data: response.data.commandStats,
|
||||
animationEasing: "cubicInOut",
|
||||
animationDuration: 1000,
|
||||
}
|
||||
]
|
||||
})
|
||||
this.usedmemory = echarts.init(this.$refs.usedmemory, "macarons")
|
||||
this.usedmemory.setOption({
|
||||
tooltip: {
|
||||
formatter: "{b} <br/>{a} : " + this.cache.info.used_memory_human,
|
||||
},
|
||||
series: [
|
||||
{
|
||||
// 峰值
|
||||
name: "峰值",
|
||||
type: "gauge",
|
||||
min: 0,
|
||||
max: 1000,
|
||||
detail: {
|
||||
formatter: this.cache.info.used_memory_human,
|
||||
},
|
||||
data: [
|
||||
{
|
||||
value: parseFloat(this.cache.info.used_memory_human),
|
||||
// 内存消耗
|
||||
name: "内存消耗",
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
})
|
||||
window.addEventListener("resize", () => {
|
||||
this.commandstats.resize()
|
||||
this.usedmemory.resize()
|
||||
})
|
||||
})
|
||||
},
|
||||
// 打开加载层
|
||||
openLoading() {
|
||||
// 提示：正在加载缓存监控数据，请稍候
|
||||
this.$modal.loading("正在加载缓存监控数据，请稍候")
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
269
ruoyi-ui/src/views/monitor/cache/list.vue
vendored
Normal file
269
ruoyi-ui/src/views/monitor/cache/list.vue
vendored
Normal file
@@ -0,0 +1,269 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-row :gutter="10">
|
||||
<!-- 缓存名称列表 -->
|
||||
<el-col :span="8">
|
||||
<el-card style="height: calc(100vh - 125px)">
|
||||
<div slot="header">
|
||||
<!-- 标题：缓存列表 -->
|
||||
<span><i class="el-icon-collection"></i>缓存列表</span>
|
||||
<!-- 刷新按钮 -->
|
||||
<el-button
|
||||
style="float: right; padding: 3px 0"
|
||||
type="text"
|
||||
icon="el-icon-refresh-right"
|
||||
@click="refreshCacheNames()"
|
||||
>刷新</el-button>
|
||||
</div>
|
||||
<!-- 表格展示缓存名称 -->
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:data="cacheNames"
|
||||
:height="tableHeight"
|
||||
highlight-current-row
|
||||
@row-click="getCacheKeys"
|
||||
style="width: 100%"
|
||||
>
|
||||
<!-- 序号 -->
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="60"
|
||||
type="index"
|
||||
></el-table-column>
|
||||
|
||||
<!-- 缓存名称 -->
|
||||
<el-table-column
|
||||
label="缓存名称"
|
||||
align="center"
|
||||
prop="cacheName"
|
||||
:show-overflow-tooltip="true"
|
||||
:formatter="nameFormatter"
|
||||
></el-table-column>
|
||||
|
||||
<!-- 备注 -->
|
||||
<el-table-column
|
||||
label="备注"
|
||||
align="center"
|
||||
prop="remark"
|
||||
:show-overflow-tooltip="true"
|
||||
/>
|
||||
<!-- 操作 -->
|
||||
<el-table-column
|
||||
label="操作"
|
||||
width="90"
|
||||
align="center"
|
||||
class-name="small-padding fixed-width"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleClearCacheName(scope.row)"
|
||||
></el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<!-- 键名列表 -->
|
||||
<el-col :span="8">
|
||||
<el-card style="height: calc(100vh - 125px)">
|
||||
<div slot="header">
|
||||
<!-- 标题：键名列表 -->
|
||||
<span><i class="el-icon-key"></i>键名列表</span>
|
||||
<!-- 刷新按钮 -->
|
||||
<el-button
|
||||
style="float: right; padding: 3px 0"
|
||||
type="text"
|
||||
icon="el-icon-refresh-right"
|
||||
@click="refreshCacheKeys()"
|
||||
>刷新</el-button>
|
||||
</div>
|
||||
<!-- 表格展示缓存键名 -->
|
||||
<el-table
|
||||
v-loading="subLoading"
|
||||
:data="cacheKeys"
|
||||
:height="tableHeight"
|
||||
highlight-current-row
|
||||
@row-click="handleCacheValue"
|
||||
style="width: 100%"
|
||||
>
|
||||
<!-- 序号 -->
|
||||
<el-table-column
|
||||
label="序号"
|
||||
width="80"
|
||||
type="index"
|
||||
></el-table-column>
|
||||
<!-- 缓存键名 -->
|
||||
<el-table-column
|
||||
label="缓存键名"
|
||||
align="center"
|
||||
:show-overflow-tooltip="true"
|
||||
:formatter="keyFormatter"
|
||||
>
|
||||
</el-table-column>
|
||||
<!-- 操作 -->
|
||||
<el-table-column
|
||||
label="操作"
|
||||
width="90"
|
||||
align="center"
|
||||
class-name="small-padding fixed-width"
|
||||
>
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleClearCacheKey(scope.row)"
|
||||
></el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<!-- 缓存内容展示 -->
|
||||
<el-col :span="8">
|
||||
<el-card :bordered="false" style="height: calc(100vh - 125px)">
|
||||
<div slot="header">
|
||||
<!-- 标题：缓存内容 -->
|
||||
<span><i class="el-icon-document"></i>缓存内容</span>
|
||||
<!-- 清理全部按钮 -->
|
||||
<el-button
|
||||
style="float: right; padding: 3px 0"
|
||||
type="text"
|
||||
icon="el-icon-refresh-right"
|
||||
@click="handleClearCacheAll()"
|
||||
>清理全部</el-button
|
||||
>
|
||||
</div>
|
||||
<!-- 缓存详细信息表单 -->
|
||||
<el-form :model="cacheForm">
|
||||
<el-row :gutter="32">
|
||||
<el-col :offset="1" :span="22">
|
||||
<!-- 缓存名称 -->
|
||||
<el-form-item label="缓存名称" prop="cacheName">
|
||||
<el-input v-model="cacheForm.cacheName" :readOnly="true" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :offset="1" :span="22">
|
||||
<!-- 缓存键名 -->
|
||||
<el-form-item label="缓存键名" prop="cacheKey">
|
||||
<el-input v-model="cacheForm.cacheKey" :readOnly="true" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :offset="1" :span="22">
|
||||
<!-- 缓存内容 -->
|
||||
<el-form-item label="缓存内容" prop="cacheValue">
|
||||
<el-input
|
||||
v-model="cacheForm.cacheValue"
|
||||
type="textarea"
|
||||
:rows="8"
|
||||
:readOnly="true"
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listCacheName, listCacheKey, getCacheValue, clearCacheName, clearCacheKey, clearCacheAll } from "@/api/monitor/cache"
|
||||
|
||||
export default {
|
||||
name: "CacheList",
|
||||
data() {
|
||||
return {
|
||||
cacheNames: [], // 缓存名称列表
|
||||
cacheKeys: [], // 缓存键名列表
|
||||
cacheForm: {}, // 缓存内容表单数据
|
||||
loading: true, // 加载状态
|
||||
subLoading: false, // 子加载状态
|
||||
nowCacheName: "", // 当前选中的缓存名称
|
||||
tableHeight: window.innerHeight - 200 // 动态表格高度
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getCacheNames() // 初始化获取缓存名称列表
|
||||
},
|
||||
methods: {
|
||||
/** 查询缓存名称列表 */
|
||||
getCacheNames() {
|
||||
this.loading = true
|
||||
listCacheName().then(response => {
|
||||
this.cacheNames = response.data
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
/** 刷新缓存名称列表 */
|
||||
refreshCacheNames() {
|
||||
this.getCacheNames()
|
||||
// 提示信息：刷新缓存列表成功
|
||||
this.$modal.msgSuccess('刷新缓存列表成功')
|
||||
},
|
||||
/** 清理指定名称缓存 */
|
||||
handleClearCacheName(row) {
|
||||
clearCacheName(row.cacheName).then(response => {
|
||||
// 提示：清理缓存名称 成功
|
||||
this.$modal.msgSuccess('清理缓存名称' + row.cacheName + '成功')
|
||||
this.getCacheKeys()
|
||||
})
|
||||
},
|
||||
/** 查询缓存键名列表 */
|
||||
getCacheKeys(row) {
|
||||
const cacheName = row !== undefined ? row.cacheName : this.nowCacheName
|
||||
if (cacheName === "") {
|
||||
return
|
||||
}
|
||||
this.subLoading = true
|
||||
listCacheKey(cacheName).then(response => {
|
||||
this.cacheKeys = response.data
|
||||
this.subLoading = false
|
||||
this.nowCacheName = cacheName
|
||||
})
|
||||
},
|
||||
|
||||
/** 刷新缓存键名列表 */
|
||||
refreshCacheKeys() {
|
||||
this.getCacheKeys()
|
||||
// 提示：刷新键名列表成功
|
||||
this.$modal.msgSuccess('刷新键名列表成功')
|
||||
},
|
||||
/** 清理指定键名缓存 */
|
||||
handleClearCacheKey(cacheKey) {
|
||||
clearCacheKey(cacheKey).then(response => {
|
||||
// 提示：清理缓存键名成功
|
||||
this.$modal.msgSuccess('清理缓存键名' + cacheKey + '成功')
|
||||
this.getCacheKeys()
|
||||
})
|
||||
},
|
||||
/** 列表前缀去除 */
|
||||
nameFormatter(row) {
|
||||
return row.cacheName.replace(":", "")
|
||||
},
|
||||
/** 键名前缀去除 */
|
||||
keyFormatter(cacheKey) {
|
||||
return cacheKey.replace(this.nowCacheName, "")
|
||||
},
|
||||
/** 查询缓存内容详细 */
|
||||
handleCacheValue(cacheKey) {
|
||||
getCacheValue(this.nowCacheName, cacheKey).then(response => {
|
||||
this.cacheForm = response.data
|
||||
})
|
||||
},
|
||||
/** 清理全部缓存 */
|
||||
handleClearCacheAll() {
|
||||
clearCacheAll().then(response => {
|
||||
// 提示信息：清理全部缓存成功
|
||||
this.$modal.msgSuccess('清理全部缓存成功')
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
15
ruoyi-ui/src/views/monitor/druid/index.vue
Normal file
15
ruoyi-ui/src/views/monitor/druid/index.vue
Normal file
@@ -0,0 +1,15 @@
|
||||
<template>
|
||||
<i-frame :src="url" />
|
||||
</template>
|
||||
<script>
|
||||
import iFrame from "@/components/iFrame/index"
|
||||
export default {
|
||||
name: "Druid",
|
||||
components: { iFrame },
|
||||
data() {
|
||||
return {
|
||||
url: process.env.VUE_APP_BASE_API + "/druid/login.html"
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
585
ruoyi-ui/src/views/monitor/job/index.vue
Normal file
585
ruoyi-ui/src/views/monitor/job/index.vue
Normal file
@@ -0,0 +1,585 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- 查询表单 -->
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<!-- 任务名称 -->
|
||||
<el-form-item label="任务名称" prop="jobName">
|
||||
<el-input
|
||||
v-model="queryParams.jobName"
|
||||
placeholder="请输入任务名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- 任务组名 -->
|
||||
<el-form-item label="任务组名" prop="jobGroup">
|
||||
<el-select v-model="queryParams.jobGroup" placeholder="请选择任务组名" clearable>
|
||||
<el-option
|
||||
v-for="dict in dict.type.sys_job_group"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- 任务状态 -->
|
||||
<el-form-item label="任务状态" prop="status">
|
||||
<el-select v-model="queryParams.status" placeholder="请选择任务状态" clearable>
|
||||
<el-option
|
||||
v-for="dict in dict.type.sys_job_status"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<!-- 【查询】按钮 -->
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
|
||||
<!-- 【重置】按钮 -->
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<!-- 【新增】按钮 -->
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-plus"
|
||||
size="mini"
|
||||
@click="handleAdd"
|
||||
v-hasPermi="['monitor:job:add']"
|
||||
>新增</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<!-- 【修改】按钮 -->
|
||||
<el-button
|
||||
type="success"
|
||||
plain
|
||||
icon="el-icon-edit"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUpdate"
|
||||
v-hasPermi="['monitor:job:edit']"
|
||||
>修改</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<!-- 【删除】按钮 -->
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
v-hasPermi="['monitor:job:remove']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<!-- 【导出】按钮 -->
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['monitor:job:export']"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<!-- 【日志】按钮 -->
|
||||
<el-button
|
||||
type="info"
|
||||
plain
|
||||
icon="el-icon-s-operation"
|
||||
size="mini"
|
||||
@click="handleJobLog"
|
||||
v-hasPermi="['monitor:job:query']"
|
||||
>日志</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="jobList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<!-- 任务编号 -->
|
||||
<el-table-column label="任务编号" width="100" align="center" prop="jobId" />
|
||||
<!-- 任务名称 -->
|
||||
<el-table-column label="任务名称" align="center" prop="jobName" :show-overflow-tooltip="true" />
|
||||
<!-- 任务组名 -->
|
||||
<el-table-column label="任务组名" align="center" prop="jobGroup">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.sys_job_group" :value="scope.row.jobGroup"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 调用目标字符串 -->
|
||||
<el-table-column label="调用目标字符串" align="center" prop="invokeTarget" :show-overflow-tooltip="true" />
|
||||
<!-- cron执行表达式 -->
|
||||
<el-table-column label="cron执行表达式" align="center" prop="cronExpression" :show-overflow-tooltip="true" />
|
||||
<!-- 状态 -->
|
||||
<el-table-column label="状态" align="center">
|
||||
<template slot-scope="scope">
|
||||
<el-switch
|
||||
v-model="scope.row.status"
|
||||
active-value="0"
|
||||
inactive-value="1"
|
||||
@change="handleStatusChange(scope.row)"
|
||||
></el-switch>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<!-- 【操作】按钮 -->
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-edit"
|
||||
@click="handleUpdate(scope.row)"
|
||||
v-hasPermi="['monitor:job:edit']"
|
||||
>修改</el-button>
|
||||
<!-- 【删除】按钮 -->
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
v-hasPermi="['monitor:job:remove']"
|
||||
>删除</el-button>
|
||||
<el-dropdown size="mini" @command="(command) => handleCommand(command, scope.row)" v-hasPermi="['monitor:job:changeStatus', 'monitor:job:query']">
|
||||
<!-- 更多 -->
|
||||
<el-button size="mini" type="text" icon="el-icon-d-arrow-right">更多</el-button>
|
||||
<el-dropdown-menu slot="dropdown">
|
||||
<!-- 执行一次 -->
|
||||
<el-dropdown-item command="handleRun" icon="el-icon-caret-right"
|
||||
v-hasPermi="['monitor:job:changeStatus']">执行一次</el-dropdown-item>
|
||||
<!-- 任务详细 -->
|
||||
<el-dropdown-item command="handleView" icon="el-icon-view"
|
||||
v-hasPermi="['monitor:job:query']">任务详细</el-dropdown-item>
|
||||
<!-- 调度日志 -->
|
||||
<el-dropdown-item command="handleJobLog" icon="el-icon-s-operation"
|
||||
v-hasPermi="['monitor:job:query']">调度日志</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</el-dropdown>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 添加或修改定时任务对话框 -->
|
||||
<el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
|
||||
<el-form ref="form" :model="form" :rules="rules" label-width="120px">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<!-- 任务名称 -->
|
||||
<el-form-item label="任务名称" prop="jobName">
|
||||
<el-input v-model="form.jobName" placeholder="请输入任务名称" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- 任务组名 -->
|
||||
<el-form-item label="任务组名" prop="jobGroup">
|
||||
<el-select v-model="form.jobGroup" placeholder="请选择任务组名">
|
||||
<el-option
|
||||
v-for="dict in dict.type.sys_job_group"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item prop="invokeTarget">
|
||||
<span slot="label">
|
||||
<!-- 调用方法 -->
|
||||
调用方法
|
||||
<el-tooltip placement="top">
|
||||
<div slot="content">
|
||||
<!-- Bean调用示例：ryTask.ryParams('ry') -->
|
||||
Bean调用示例：ryTask.ryParams('ry')<br/>
|
||||
<!-- Class类调用示例：com.ruoyi.quartz.task.RyTask.ryParams('ry') -->
|
||||
Class类调用示例：com.ruoyi.quartz.task.RyTask.ryParams('ry')<br/>
|
||||
<!-- 参数说明：支持字符串，布尔类型，长整型，浮点型，整型 -->
|
||||
参数说明：支持字符串，布尔类型，长整型，浮点型，整型
|
||||
</div>
|
||||
<i class="el-icon-question"></i>
|
||||
</el-tooltip>
|
||||
</span>
|
||||
<el-input v-model="form.invokeTarget" placeholder="请输入调用目标字符串" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<!-- cron执行表达式 -->
|
||||
<el-form-item label="cron执行表达式" prop="cronExpression">
|
||||
<el-input v-model="form.cronExpression" placeholder="请输入cron执行表达式">
|
||||
<template slot="append">
|
||||
<el-button type="primary" @click="handleShowCron">
|
||||
<!-- 生成表达式 -->
|
||||
生成表达式
|
||||
<i class="el-icon-time el-icon--right"></i>
|
||||
</el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24" v-if="form.jobId !== undefined">
|
||||
<!-- 状态 -->
|
||||
<el-form-item label="状态">
|
||||
<el-radio-group v-model="form.status">
|
||||
<el-radio
|
||||
v-for="dict in dict.type.sys_job_status"
|
||||
:key="dict.value"
|
||||
:label="dict.value"
|
||||
>{{ dict.label }}</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- 执行策略 -->
|
||||
<el-form-item label="执行策略" prop="misfirePolicy">
|
||||
<el-radio-group v-model="form.misfirePolicy" size="small">
|
||||
<!-- 立即执行 -->
|
||||
<el-radio-button label="1">立即执行</el-radio-button>
|
||||
<!-- 执行一次 -->
|
||||
<el-radio-button label="2">执行一次</el-radio-button>
|
||||
<!-- 放弃执行 -->
|
||||
<el-radio-button label="3">放弃执行</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- 是否并发 -->
|
||||
<el-form-item label="是否并发" prop="concurrent">
|
||||
<el-radio-group v-model="form.concurrent" size="small">
|
||||
<!-- 允许 -->
|
||||
<el-radio-button label="0">允许</el-radio-button>
|
||||
<!-- 禁止 -->
|
||||
<el-radio-button label="1">禁止</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<!-- 【确定】按钮 -->
|
||||
<el-button type="primary" @click="submitForm">{{ $t('Monitor_ScheduledTask.btnSubmit') }}</el-button>
|
||||
<!-- 【取消】按钮 -->
|
||||
<el-button @click="cancel">{{ $t('Monitor_ScheduledTask.btnCancel') }}</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
|
||||
<!-- Cron表达式生成器 -->
|
||||
<el-dialog
|
||||
title="Cron表达式生成器"
|
||||
:visible.sync="openCron"
|
||||
append-to-body
|
||||
destroy-on-close
|
||||
class="scrollbar">
|
||||
<crontab @hide="openCron=false" @fill="crontabFill" :expression="expression"></crontab>
|
||||
</el-dialog>
|
||||
|
||||
<!-- 任务日志详细 -->
|
||||
<el-dialog
|
||||
title="任务详细信息"
|
||||
:visible.sync="openView"
|
||||
width="700px"
|
||||
append-to-body>
|
||||
<el-form ref="form" :model="form" label-width="120px" size="mini">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<!-- 任务编号： -->
|
||||
<el-form-item label="任务编号">{{ form.jobId }}</el-form-item>
|
||||
<!-- 任务名称： -->
|
||||
<el-form-item label="任务名称">{{ form.jobName }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- 任务分组： -->
|
||||
<el-form-item label="任务分组">{{ jobGroupFormat(form) }}</el-form-item>
|
||||
<!-- 创建时间： -->
|
||||
<el-form-item label="创建时间">{{ form.createTime }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- cron表达式： -->
|
||||
<el-form-item label="cron表达式">{{ form.cronExpression }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- 下次执行时间： -->
|
||||
<el-form-item label="下次执行时间">{{ parseTime(form.nextValidTime) }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<!-- 调用目标方法： -->
|
||||
<el-form-item label="调用目标方法">{{ form.invokeTarget }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- 任务状态： -->
|
||||
<el-form-item label="任务状态">
|
||||
<div v-if="form.status == 0">正常</div>
|
||||
<div v-else-if="form.status == 1">暂停</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- 是否并发： -->
|
||||
<el-form-item label="是否并发">
|
||||
<div v-if="form.concurrent == 0">允许</div>
|
||||
<div v-else-if="form.concurrent == 1">禁止</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- 执行策略： -->
|
||||
<el-form-item label="执行策略">
|
||||
<div v-if="form.misfirePolicy == 0">默认策略</div>
|
||||
<div v-else-if="form.misfirePolicy == 1">立即执行</div>
|
||||
<div v-else-if="form.misfirePolicy == 2">执行一次</div>
|
||||
<div v-else-if="form.misfirePolicy == 3">放弃执行</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<!-- 【关闭】按钮 -->
|
||||
<el-button @click="openView = false">关闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { listJob, getJob, delJob, addJob, updateJob, runJob, changeJobStatus } from "@/api/monitor/job"
|
||||
import Crontab from '@/components/Crontab'
|
||||
|
||||
export default {
|
||||
components: { Crontab },
|
||||
name: "Job",
|
||||
dicts: ['sys_job_group', 'sys_job_status'],
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 定时任务表格数据
|
||||
jobList: [],
|
||||
// 弹出层标题
|
||||
title: "",
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 是否显示详细弹出层
|
||||
openView: false,
|
||||
// 是否显示Cron表达式弹出层
|
||||
openCron: false,
|
||||
// 传入的表达式
|
||||
expression: "",
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
jobName: undefined,
|
||||
jobGroup: undefined,
|
||||
status: undefined
|
||||
},
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 表单校验
|
||||
rules: {
|
||||
jobName: [
|
||||
// 任务名称不能为空
|
||||
{ required: true, message: "任务名称不能为空", trigger: "blur" }
|
||||
],
|
||||
invokeTarget: [
|
||||
// 调用目标字符串不能为空
|
||||
{ required: true, message: "调用目标字符串不能为空", trigger: "blur" }
|
||||
],
|
||||
cronExpression: [
|
||||
// cron执行表达式不能为空
|
||||
{ required: true, message: "cron执行表达式不能为空", trigger: "blur" }
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
/** 查询定时任务列表 */
|
||||
getList() {
|
||||
this.loading = true
|
||||
listJob(this.queryParams).then(response => {
|
||||
this.jobList = response.rows
|
||||
this.total = response.total
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
// 任务组名字典翻译
|
||||
jobGroupFormat(row, column) {
|
||||
return this.selectDictLabel(this.dict.type.sys_job_group, row.jobGroup)
|
||||
},
|
||||
// 取消按钮
|
||||
cancel() {
|
||||
this.open = false
|
||||
this.reset()
|
||||
},
|
||||
// 表单重置
|
||||
reset() {
|
||||
this.form = {
|
||||
jobId: undefined,
|
||||
jobName: undefined,
|
||||
jobGroup: undefined,
|
||||
invokeTarget: undefined,
|
||||
cronExpression: undefined,
|
||||
misfirePolicy: 1,
|
||||
concurrent: 1,
|
||||
status: "0"
|
||||
}
|
||||
this.resetForm("form")
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm")
|
||||
this.handleQuery()
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.jobId)
|
||||
this.single = selection.length != 1
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
// 更多操作触发
|
||||
handleCommand(command, row) {
|
||||
switch (command) {
|
||||
case "handleRun":
|
||||
this.handleRun(row)
|
||||
break
|
||||
case "handleView":
|
||||
this.handleView(row)
|
||||
break
|
||||
case "handleJobLog":
|
||||
this.handleJobLog(row)
|
||||
break
|
||||
default:
|
||||
break
|
||||
}
|
||||
},
|
||||
// 任务状态修改
|
||||
handleStatusChange(row) {
|
||||
// 启用/停用
|
||||
let text = row.status === "0" ? this.$t('Monitor_ScheduledTask.textEnable') : this.$t('Monitor_ScheduledTask.textDisable')
|
||||
// 提示信息：确认要"启用/停用" + "任务名称" + 任务吗？
|
||||
this.$modal.confirm(this.$t('Monitor_ScheduledTask.textChangeConfirm1') + text + '""' + row.jobName + this.$t('Monitor_ScheduledTask.textChangeConfirm2')).then(function() {
|
||||
return changeJobStatus(row.jobId, row.status)
|
||||
}).then(() => {
|
||||
// 提示信息："启用/停用" + 成功
|
||||
this.$modal.msgSuccess(text + this.$t('Monitor_ScheduledTask.textSuccess'))
|
||||
}).catch(function() {
|
||||
row.status = row.status === "0" ? "1" : "0"
|
||||
})
|
||||
},
|
||||
/* 立即执行一次 */
|
||||
handleRun(row) {
|
||||
this.$modal.confirm('确认要立即执行一次"' + row.jobName + '"任务吗？').then(function() {
|
||||
return runJob(row.jobId, row.jobGroup)
|
||||
}).then(() => {
|
||||
this.$modal.msgSuccess('执行成功')
|
||||
}).catch(() => {})
|
||||
},
|
||||
/** 任务详细信息 */
|
||||
handleView(row) {
|
||||
getJob(row.jobId).then(response => {
|
||||
this.form = response.data
|
||||
this.openView = true
|
||||
})
|
||||
},
|
||||
/** cron表达式按钮操作 */
|
||||
handleShowCron() {
|
||||
this.expression = this.form.cronExpression
|
||||
this.openCron = true
|
||||
},
|
||||
/** 确定后回传值 */
|
||||
crontabFill(value) {
|
||||
this.form.cronExpression = value
|
||||
},
|
||||
/** 任务日志列表查询 */
|
||||
handleJobLog(row) {
|
||||
const jobId = row.jobId || 0
|
||||
this.$router.push('/monitor/job-log/index/' + jobId)
|
||||
},
|
||||
/** 新增按钮操作 */
|
||||
handleAdd() {
|
||||
this.reset()
|
||||
this.open = true
|
||||
// 标题：添加任务
|
||||
this.title = this.$t('Monitor_ScheduledTask.titleAddJob')
|
||||
},
|
||||
/** 修改按钮操作 */
|
||||
handleUpdate(row) {
|
||||
this.reset()
|
||||
const jobId = row.jobId || this.ids
|
||||
getJob(jobId).then(response => {
|
||||
this.form = response.data
|
||||
this.open = true
|
||||
// 标题：修改任务
|
||||
this.title = this.$t('Monitor_ScheduledTask.titleEditJob')
|
||||
})
|
||||
},
|
||||
/** 提交按钮 */
|
||||
submitForm: function() {
|
||||
this.$refs["form"].validate(valid => {
|
||||
if (valid) {
|
||||
if (this.form.jobId != undefined) {
|
||||
updateJob(this.form).then(response => {
|
||||
// 提示信息：修改成功
|
||||
this.$modal.msgSuccess(this.$t('Monitor_ScheduledTask.editSuccessInfo'))
|
||||
this.open = false
|
||||
this.getList()
|
||||
})
|
||||
} else {
|
||||
addJob(this.form).then(response => {
|
||||
// 提示信息：新增成功
|
||||
this.$modal.msgSuccess(this.$t('Monitor_ScheduledTask.addSuccessInfo'))
|
||||
this.open = false
|
||||
this.getList()
|
||||
})
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const jobIds = row.jobId || this.ids
|
||||
this.$modal.confirm('是否确认删除入库作业流水编号为"' + jobIds + '"的数据项？').then(function() {
|
||||
return delJob(jobIds)
|
||||
}).then(() => {
|
||||
this.getList()
|
||||
this.$modal.msgSuccess('删除成功')
|
||||
}).catch(() => {})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('monitor/job/export', {
|
||||
...this.queryParams
|
||||
}, `job_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
325
ruoyi-ui/src/views/monitor/job/log.vue
Normal file
325
ruoyi-ui/src/views/monitor/job/log.vue
Normal file
@@ -0,0 +1,325 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<!-- 任务名称 -->
|
||||
<el-form-item label="任务名称" prop="jobName">
|
||||
<el-input
|
||||
v-model="queryParams.jobName"
|
||||
placeholder="请输入任务名称"
|
||||
clearable
|
||||
style="width: 240px"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- 任务组名 -->
|
||||
<el-form-item label="任务组名" prop="jobGroup">
|
||||
<el-select
|
||||
v-model="queryParams.jobGroup"
|
||||
placeholder="请选择任务组名"
|
||||
clearable
|
||||
style="width: 240px"
|
||||
>
|
||||
<el-option
|
||||
v-for="dict in dict.type.sys_job_group"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- 状态 -->
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select
|
||||
v-model="queryParams.status"
|
||||
placeholder="请选择状态"
|
||||
clearable
|
||||
style="width: 240px"
|
||||
>
|
||||
<el-option
|
||||
v-for="dict in dict.type.sys_common_status"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- 创建时间 -->
|
||||
<el-form-item label="执行时间">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
style="width: 240px"
|
||||
value-format="yyyy-MM-dd"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<!-- 【查询】按钮 -->
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<!-- 【重置】按钮 -->
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<!-- 【删除】按钮 -->
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
v-hasPermi="['monitor:job:remove']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<!-- 【清空】按钮 -->
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="handleClean"
|
||||
v-hasPermi="['monitor:job:remove']"
|
||||
>清空</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<!-- 【导出】按钮 -->
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['monitor:job:export']"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<!-- 【关闭】按钮 -->
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-close"
|
||||
size="mini"
|
||||
@click="handleClose"
|
||||
>关闭</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table v-loading="loading" :data="jobLogList" @selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<!-- 日志编号 -->
|
||||
<el-table-column label="日志编号" width="80" align="center" prop="jobLogId" />
|
||||
<!-- 任务名称 -->
|
||||
<el-table-column label="任务名称" align="center" prop="jobName" :show-overflow-tooltip="true" />
|
||||
<!-- 任务组名 -->
|
||||
<el-table-column label="任务组名" align="center" prop="jobGroup" :show-overflow-tooltip="true">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.sys_job_group" :value="scope.row.jobGroup"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 调用目标字符串 -->
|
||||
<el-table-column label="调用目标字符串" align="center" prop="invokeTarget" :show-overflow-tooltip="true" />
|
||||
<!-- 日志信息 -->
|
||||
<el-table-column label="日志信息" align="center" prop="jobMessage" :show-overflow-tooltip="true" />
|
||||
<!-- 执行状态 -->
|
||||
<el-table-column label="执行状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.sys_common_status" :value="scope.row.status"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 执行时间 -->
|
||||
<el-table-column label="执行时间" align="center" prop="createTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.createTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 操作 -->
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<!-- 【详细】按钮 -->
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleView(scope.row)"
|
||||
v-hasPermi="['monitor:job:query']"
|
||||
>详细</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 调度日志详细 -->
|
||||
<el-dialog title="调度日志详细" :visible.sync="open" width="700px" append-to-body>
|
||||
<el-form ref="form" :model="form" label-width="100px" size="mini">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<!-- 日志序号 -->
|
||||
<el-form-item label="日志序号">{{ form.jobLogId }}</el-form-item>
|
||||
<!-- 任务名称 -->
|
||||
<el-form-item label="任务名称">{{ form.jobName }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- 任务分组 -->
|
||||
<el-form-item label="任务分组">{{ form.jobGroup }}</el-form-item>
|
||||
<!-- 执行时间 -->
|
||||
<el-form-item label="执行时间">{{ form.createTime }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<!-- 调用方法 -->
|
||||
<el-form-item label="调用方法">{{ form.invokeTarget }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<!-- 日志信息 -->
|
||||
<el-form-item label="日志信息">{{ form.jobMessage }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<!-- 执行状态 -->
|
||||
<el-form-item label="执行状态">
|
||||
<!-- 0-正常 -->
|
||||
<div v-if="form.status == 0">正常</div>
|
||||
<!-- 1-失败 -->
|
||||
<div v-else-if="form.status == 1">失败</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<!-- 异常信息 -->
|
||||
<el-form-item label="异常信息" v-if="form.status == 1">{{ form.exceptionInfo }}</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<!-- 【关闭】按钮 -->
|
||||
<el-button @click="open = false">关闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getJob} from "@/api/monitor/job"
|
||||
import { listJobLog, delJobLog, cleanJobLog } from "@/api/monitor/jobLog"
|
||||
|
||||
export default {
|
||||
name: "JobLog",
|
||||
dicts: ['sys_common_status', 'sys_job_group'],
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 调度日志表格数据
|
||||
jobLogList: [],
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 日期范围
|
||||
dateRange: [],
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
jobName: undefined,
|
||||
jobGroup: undefined,
|
||||
status: undefined
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
const jobId = this.$route.params && this.$route.params.jobId
|
||||
if (jobId !== undefined && jobId != 0) {
|
||||
getJob(jobId).then(response => {
|
||||
this.queryParams.jobName = response.data.jobName
|
||||
this.queryParams.jobGroup = response.data.jobGroup
|
||||
this.getList()
|
||||
})
|
||||
} else {
|
||||
this.getList()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
/** 查询调度日志列表 */
|
||||
getList() {
|
||||
this.loading = true
|
||||
listJobLog(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
||||
this.jobLogList = response.rows
|
||||
this.total = response.total
|
||||
this.loading = false
|
||||
}
|
||||
)
|
||||
},
|
||||
// 返回按钮
|
||||
handleClose() {
|
||||
const obj = { path: "/monitor/job" }
|
||||
this.$tab.closeOpenPage(obj)
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRange = []
|
||||
this.resetForm("queryForm")
|
||||
this.handleQuery()
|
||||
},
|
||||
// 多选框选中数据
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.jobLogId)
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 详细按钮操作 */
|
||||
handleView(row) {
|
||||
this.open = true
|
||||
this.form = row
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const jobLogIds = this.ids
|
||||
this.$modal.confirm("是否确认删除调度日志编号为" + jobLogIds + "的数据项？").then(function() {
|
||||
return delJobLog(jobLogIds)
|
||||
}).then(() => {
|
||||
this.getList()
|
||||
this.$modal.msgSuccess("删除成功")
|
||||
}).catch(() => {})
|
||||
},
|
||||
/** 清空按钮操作 */
|
||||
handleClean() {
|
||||
this.$modal.confirm("是否确认清空所有调度日志数据项？").then(function() {
|
||||
return cleanJobLog()
|
||||
}).then(() => {
|
||||
this.getList()
|
||||
this.$modal.msgSuccess("清空成功")
|
||||
}).catch(() => {})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('/monitor/jobLog/export', {
|
||||
...this.queryParams
|
||||
}, `log_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
273
ruoyi-ui/src/views/monitor/logininfor/index.vue
Normal file
273
ruoyi-ui/src/views/monitor/logininfor/index.vue
Normal file
@@ -0,0 +1,273 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<!-- 登陆地址 -->
|
||||
<el-form-item label="登录地址" prop="ipaddr">
|
||||
<el-input
|
||||
v-model="queryParams.ipaddr"
|
||||
placeholder="请输入登录地址"
|
||||
clearable
|
||||
style="width: 240px;"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- 用户名称 -->
|
||||
<el-form-item label="用户名称" prop="userName">
|
||||
<el-input
|
||||
v-model="queryParams.userName"
|
||||
placeholder="请输入用户名称"
|
||||
clearable
|
||||
style="width: 240px;"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- 状态 -->
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select
|
||||
v-model="queryParams.status"
|
||||
placeholder="请选择状态"
|
||||
clearable
|
||||
style="width: 240px"
|
||||
>
|
||||
<el-option
|
||||
v-for="dict in dict.type.sys_common_status"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- 登陆时间 -->
|
||||
<el-form-item label="登录时间">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
style="width: 240px"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
:default-time="['00:00:00', '23:59:59']"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<!-- 【查询】按钮 -->
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<!-- 【重置】按钮 -->
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<!-- 【删除】按钮 -->
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
v-hasPermi="['monitor:logininfor:remove']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<!-- 【清空】按钮 -->
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="handleClean"
|
||||
v-hasPermi="['monitor:logininfor:remove']"
|
||||
>清空</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<!-- 【解锁】按钮 -->
|
||||
<el-button
|
||||
type="primary"
|
||||
plain
|
||||
icon="el-icon-unlock"
|
||||
size="mini"
|
||||
:disabled="single"
|
||||
@click="handleUnlock"
|
||||
v-hasPermi="['monitor:logininfor:unlock']"
|
||||
>解锁</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<!-- 【导出】按钮 -->
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['monitor:logininfor:export']"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table ref="tables" v-loading="loading" :data="list" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange">
|
||||
<el-table-column type="selection" width="55" align="center" />
|
||||
<!-- 访问编号 -->
|
||||
<el-table-column label="访问编号" align="center" prop="infoId" />
|
||||
<!-- 用户名称 -->
|
||||
<el-table-column label="用户名称" align="center" prop="userName" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']" />
|
||||
<!-- 登陆地址 -->
|
||||
<el-table-column label="登录地址" align="center" prop="ipaddr" width="130" :show-overflow-tooltip="true" />
|
||||
<!-- 登陆地点 -->
|
||||
<el-table-column label="登录地点" align="center" prop="loginLocation" :show-overflow-tooltip="true" />
|
||||
<!-- 浏览器 -->
|
||||
<el-table-column label="浏览器" align="center" prop="browser" :show-overflow-tooltip="true" />
|
||||
<!-- 操作系统 -->
|
||||
<el-table-column label="操作系统" align="center" prop="os" />
|
||||
<!-- 登录状态 -->
|
||||
<el-table-column label="状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.sys_common_status" :value="scope.row.status"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 操作信息 -->
|
||||
<el-table-column label="操作信息" align="center" prop="msg" :show-overflow-tooltip="true" />
|
||||
<!-- 登录时间 -->
|
||||
<el-table-column label="登录时间" align="center" prop="loginTime" sortable="custom" :sort-orders="['descending', 'ascending']" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.loginTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { list, delLogininfor, cleanLogininfor, unlockLogininfor } from "@/api/monitor/logininfor"
|
||||
|
||||
export default {
|
||||
name: "Logininfor",
|
||||
dicts: ['sys_common_status'],
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非单个禁用
|
||||
single: true,
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 选择用户名
|
||||
selectName: "",
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 表格数据
|
||||
list: [],
|
||||
// 日期范围
|
||||
dateRange: [],
|
||||
// 默认排序
|
||||
defaultSort: { prop: "loginTime", order: "descending" },
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
ipaddr: undefined,
|
||||
userName: undefined,
|
||||
status: undefined
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
/** 查询登录日志列表 */
|
||||
getList() {
|
||||
this.loading = true
|
||||
list(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
||||
this.list = response.rows
|
||||
this.total = response.total
|
||||
this.loading = false
|
||||
}
|
||||
)
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRange = []
|
||||
this.resetForm("queryForm")
|
||||
this.queryParams.pageNum = 1
|
||||
this.$refs.tables.sort(this.defaultSort.prop, this.defaultSort.order)
|
||||
},
|
||||
/** 多选框选中数据 */
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.infoId)
|
||||
this.single = selection.length !== 1
|
||||
this.multiple = !selection.length
|
||||
this.selectName = selection.map(item => item.userName).join(',') // 多个用户逗号拼接
|
||||
},
|
||||
/** 排序触发事件 */
|
||||
handleSortChange(column, prop, order) {
|
||||
this.queryParams.orderByColumn = column.prop
|
||||
this.queryParams.isAsc = column.order
|
||||
this.getList()
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const infoIds = row.infoId || this.ids
|
||||
// 提示信息：是否确认删除登录编号为" + infoIds + "的数据项？
|
||||
const confirmText = '是否确认删除访问编号为"' + infoIds + '"的数据项？'
|
||||
this.$modal.confirm(confirmText).then(() => {
|
||||
return delLogininfor(infoIds)
|
||||
}).then(() => {
|
||||
this.getList()
|
||||
// 提示信息：删除成功
|
||||
this.$modal.msgSuccess('删除成功')
|
||||
}).catch(() => {})
|
||||
},
|
||||
/** 清空按钮操作 */
|
||||
handleClean() {
|
||||
// 提示信息：确认清空所有登录日志数据项吗？
|
||||
this.$modal.confirm('是否确认清空所有登录日志数据项？').then(() => {
|
||||
return cleanLogininfor()
|
||||
}).then(() => {
|
||||
this.getList()
|
||||
// 提示信息：清空成功
|
||||
this.$modal.msgSuccess('清空成功')
|
||||
}).catch(() => {})
|
||||
},
|
||||
/** 解锁按钮操作 */
|
||||
handleUnlock() {
|
||||
const username = this.selectName
|
||||
// 提示信息：是否确认解锁用户" + username + "的数据项？
|
||||
const confirmText = (this.$t('systemManagement_LogManagement_Login.textUnlockConfirm1') + username + this.$t('systemManagement_LogManagement_Login.textUnlockConfirm1')).replace('{username}', username)
|
||||
this.$modal.confirm(confirmText).then(() => {
|
||||
return unlockLogininfor(username)
|
||||
}).then(() => {
|
||||
// 提示：解锁成功
|
||||
this.$modal.msgSuccess(this.$t('systemManagement_LogManagement_Login.unlockSuccessInfo').replace('{username}', username))
|
||||
}).catch(() => {})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('monitor/logininfor/export', {
|
||||
...this.queryParams
|
||||
}, `logininfor_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
143
ruoyi-ui/src/views/monitor/online/index.vue
Normal file
143
ruoyi-ui/src/views/monitor/online/index.vue
Normal file
@@ -0,0 +1,143 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!-- 查询表单 -->
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" label-width="68px">
|
||||
<!-- 登陆地址 -->
|
||||
<el-form-item label="登录地址" prop="ipaddr">
|
||||
<el-input
|
||||
v-model="queryParams.ipaddr"
|
||||
placeholder="请输入登录地址"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- 用户名称 -->
|
||||
<el-form-item label="用户名称" prop="userName">
|
||||
<el-input
|
||||
v-model="queryParams.userName"
|
||||
placeholder="请输入用户名称"
|
||||
clearable
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<!-- 【查询】按钮 -->
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<!-- 【重置】按钮 -->
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
|
||||
</el-form>
|
||||
|
||||
<!-- 数据表格 -->
|
||||
<el-table
|
||||
v-loading="loading"
|
||||
:data="list.slice((pageNum-1)*pageSize, pageNum*pageSize)"
|
||||
style="width: 100%;"
|
||||
>
|
||||
<!-- 序号 -->
|
||||
<el-table-column label="序号" type="index" align="center">
|
||||
<template slot-scope="scope">
|
||||
<span>{{(pageNum - 1) * pageSize + scope.$index + 1}}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 会话编号 -->
|
||||
<el-table-column label="会话编号" align="center" prop="tokenId" :show-overflow-tooltip="true" />
|
||||
<!-- 登录名称 -->
|
||||
<el-table-column label="登录名称" align="center" prop="userName" :show-overflow-tooltip="true" />
|
||||
<!-- 部门名称 -->
|
||||
<el-table-column label="部门名称" align="center" prop="deptName" />
|
||||
<!-- 主机地址 -->
|
||||
<el-table-column label="主机地址" align="center" prop="ipaddr" :show-overflow-tooltip="true" />
|
||||
<!-- 登录地点 -->
|
||||
<el-table-column label="登录地点" align="center" prop="loginLocation" :show-overflow-tooltip="true" />
|
||||
<!-- 浏览器 -->
|
||||
<el-table-column label="浏览器" align="center" prop="browser" />
|
||||
<!-- 操作系统 -->
|
||||
<el-table-column label="操作系统" align="center" prop="os" />
|
||||
<!-- 登录时间 -->
|
||||
<el-table-column label="登录时间" align="center" prop="loginTime" width="180">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.loginTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 操作 -->
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<!-- 【强制退出】按钮 -->
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-delete"
|
||||
@click="handleForceLogout(scope.row)"
|
||||
v-hasPermi="['monitor:online:forceLogout']"
|
||||
>强制退出</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 分页组件 -->
|
||||
<pagination v-show="total>0" :total="total" :page.sync="pageNum" :limit.sync="pageSize" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { list, forceLogout } from "@/api/monitor/online"
|
||||
|
||||
export default {
|
||||
name: "Online",
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 表格数据
|
||||
list: [],
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
ipaddr: undefined,
|
||||
userName: undefined
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
/** 查询在线用户列表 */
|
||||
getList() {
|
||||
this.loading = true
|
||||
console.log('---------------------------------------')
|
||||
list(this.queryParams).then(response => {
|
||||
console.log(response)
|
||||
this.list = response.rows
|
||||
this.total = response.total
|
||||
this.loading = false
|
||||
})
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.resetForm("queryForm")
|
||||
this.handleQuery()
|
||||
},
|
||||
/** 强退按钮操作 */
|
||||
handleForceLogout(row) {
|
||||
const confirmText = '是否确认强制退出用户 "' + row.userName + '" ？'
|
||||
this.$modal.confirm(confirmText).then(() => {
|
||||
return forceLogout(row.tokenId)
|
||||
}).then(() => {
|
||||
this.getList()
|
||||
this.$modal.msgSuccess('强制退出成功')
|
||||
}).catch(() => {})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
359
ruoyi-ui/src/views/monitor/operlog/index.vue
Normal file
359
ruoyi-ui/src/views/monitor/operlog/index.vue
Normal file
@@ -0,0 +1,359 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="68px">
|
||||
<!-- 操作地址 -->
|
||||
<el-form-item label="操作地址" prop="operIp">
|
||||
<el-input
|
||||
v-model="queryParams.operIp"
|
||||
placeholder="请输入操作地址"
|
||||
clearable
|
||||
style="width: 240px;"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- 系统模块 -->
|
||||
<el-form-item label="系统模块" prop="title">
|
||||
<el-input
|
||||
v-model="queryParams.title"
|
||||
placeholder="请输入系统模块"
|
||||
clearable
|
||||
style="width: 240px;"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- 操作人员 -->
|
||||
<el-form-item label="操作人员" prop="operName" >
|
||||
<el-input
|
||||
v-model="queryParams.operName"
|
||||
placeholder="请输入操作人员"
|
||||
clearable
|
||||
style="width: 240px;"
|
||||
@keyup.enter.native="handleQuery"
|
||||
/>
|
||||
</el-form-item>
|
||||
<!-- 操作类型 -->
|
||||
<el-form-item label="操作类型" prop="businessType" >
|
||||
<el-select
|
||||
v-model="queryParams.businessType"
|
||||
placeholder="请选择操作类型"
|
||||
clearable
|
||||
style="width: 240px"
|
||||
>
|
||||
<el-option
|
||||
v-for="dict in dict.type.sys_oper_type"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- 状态 -->
|
||||
<el-form-item label="状态" prop="status">
|
||||
<el-select
|
||||
v-model="queryParams.status"
|
||||
placeholder="请选择状态"
|
||||
clearable
|
||||
style="width: 240px"
|
||||
>
|
||||
<el-option
|
||||
v-for="dict in dict.type.sys_common_status"
|
||||
:key="dict.value"
|
||||
:label="dict.label"
|
||||
:value="dict.value"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<!-- 操作时间 -->
|
||||
<el-form-item label="操作时间">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
style="width: 240px"
|
||||
value-format="yyyy-MM-dd HH:mm:ss"
|
||||
type="daterange"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
:default-time="['00:00:00', '23:59:59']"
|
||||
></el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<!-- 【查询】按钮 -->
|
||||
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
|
||||
<!-- 【重置】按钮 -->
|
||||
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb8">
|
||||
<el-col :span="1.5">
|
||||
<!-- 【删除】按钮 -->
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
:disabled="multiple"
|
||||
@click="handleDelete"
|
||||
v-hasPermi="['monitor:operlog:remove']"
|
||||
>删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<!-- 【清空】按钮 -->
|
||||
<el-button
|
||||
type="danger"
|
||||
plain
|
||||
icon="el-icon-delete"
|
||||
size="mini"
|
||||
@click="handleClean"
|
||||
v-hasPermi="['monitor:operlog:remove']"
|
||||
>清空</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<!-- 【导出】按钮 -->
|
||||
<el-button
|
||||
type="warning"
|
||||
plain
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
@click="handleExport"
|
||||
v-hasPermi="['monitor:operlog:export']"
|
||||
>导出</el-button>
|
||||
</el-col>
|
||||
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
|
||||
</el-row>
|
||||
|
||||
<el-table ref="tables" v-loading="loading" :data="list" @selection-change="handleSelectionChange" :default-sort="defaultSort" @sort-change="handleSortChange">
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
<!-- 日志编号 -->
|
||||
<el-table-column label="日志编号" align="center" prop="operId" />
|
||||
<!-- 操作模块 -->
|
||||
<el-table-column label="系统模块" align="center" prop="title" :show-overflow-tooltip="true" />
|
||||
<!-- 操作类型 -->
|
||||
<el-table-column label="操作类型" align="center" prop="businessType">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.sys_oper_type" :value="scope.row.businessType"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 操作人员 -->
|
||||
<el-table-column label="操作人员" align="center" prop="operName" width="110" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']" />
|
||||
<!-- 操作地址 -->
|
||||
<el-table-column label="操作地址" align="center" prop="operIp" width="130" :show-overflow-tooltip="true" />
|
||||
<!-- 操作地点 -->
|
||||
<el-table-column label="操作地点" align="center" prop="operLocation" :show-overflow-tooltip="true" />
|
||||
<!-- 操作状态 -->
|
||||
<el-table-column label="状态" align="center" prop="status">
|
||||
<template slot-scope="scope">
|
||||
<dict-tag :options="dict.type.sys_common_status" :value="scope.row.status"/>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 操作日期 -->
|
||||
<el-table-column label="操作时间" align="center" prop="operTime" width="160" sortable="custom" :sort-orders="['descending', 'ascending']">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ parseTime(scope.row.operTime) }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 消耗时间 -->
|
||||
<el-table-column label="消耗时间" align="center" prop="costTime" width="110" :show-overflow-tooltip="true" sortable="custom" :sort-orders="['descending', 'ascending']">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ scope.row.costTime }}毫秒</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- 操作 -->
|
||||
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
||||
<template slot-scope="scope">
|
||||
<!-- 【详细】按钮 -->
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
icon="el-icon-view"
|
||||
@click="handleView(scope.row,scope.index)"
|
||||
v-hasPermi="['monitor:operlog:query']"
|
||||
>详细</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total>0"
|
||||
:total="total"
|
||||
:page.sync="queryParams.pageNum"
|
||||
:limit.sync="queryParams.pageSize"
|
||||
@pagination="getList"
|
||||
/>
|
||||
|
||||
<!-- 操作日志详细 -->
|
||||
<el-dialog title="操作日志详细" :visible.sync="open" width="800px" append-to-body>
|
||||
<el-form ref="form" :model="form" label-width="140px" size="mini">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<!-- 操作模块 -->
|
||||
<el-form-item label="系统模块：">{{ form.title }} / {{ typeFormat(form) }}</el-form-item>
|
||||
<!-- 登录信息 -->
|
||||
<el-form-item
|
||||
label="登录信息："
|
||||
>{{ form.operName }} / {{ form.operIp }} / {{ form.operLocation }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<!-- 请求地址 -->
|
||||
<el-form-item label="请求地址：">{{ form.operUrl }}</el-form-item>
|
||||
<!-- 请求方式 -->
|
||||
<el-form-item label="请求方式：">{{ form.requestMethod }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<!-- 操作方法 -->
|
||||
<el-form-item label="操作方法：">{{ form.method }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<!-- 请求参数 -->
|
||||
<el-form-item label="请求参数：">{{ form.operParam }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<!-- 返回参数 -->
|
||||
<el-form-item label="返回参数：">{{ form.jsonResult }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<!-- 操作状态 -->
|
||||
<el-form-item label="状态：">
|
||||
<!-- 0=正常 -->
|
||||
<div v-if="form.status === 0">正常</div>
|
||||
<!-- 1=失败 -->
|
||||
<div v-else-if="form.status === 1">失败</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<!-- 消耗时间 -->
|
||||
<el-form-item label="消耗时间：">{{ form.costTime }}毫秒</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<!-- 操作时间 -->
|
||||
<el-form-item label="操作时间：">{{ parseTime(form.operTime) }}</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<!-- 异常信息 -->
|
||||
<el-form-item label="异常信息：" v-if="form.status === 1">{{ form.errorMsg }}</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<div slot="footer" class="dialog-footer">
|
||||
<!-- 【关闭】按钮 -->
|
||||
<el-button @click="open = false">关闭</el-button>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { list, delOperlog, cleanOperlog } from "@/api/monitor/operlog"
|
||||
|
||||
export default {
|
||||
name: "Operlog",
|
||||
dicts: ['sys_oper_type', 'sys_common_status'],
|
||||
data() {
|
||||
return {
|
||||
// 遮罩层
|
||||
loading: true,
|
||||
// 选中数组
|
||||
ids: [],
|
||||
// 非多个禁用
|
||||
multiple: true,
|
||||
// 显示搜索条件
|
||||
showSearch: true,
|
||||
// 总条数
|
||||
total: 0,
|
||||
// 表格数据
|
||||
list: [],
|
||||
// 是否显示弹出层
|
||||
open: false,
|
||||
// 日期范围
|
||||
dateRange: [],
|
||||
// 默认排序
|
||||
defaultSort: { prop: "operTime", order: "descending" },
|
||||
// 表单参数
|
||||
form: {},
|
||||
// 查询参数
|
||||
queryParams: {
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
operIp: undefined,
|
||||
title: undefined,
|
||||
operName: undefined,
|
||||
businessType: undefined,
|
||||
status: undefined
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
},
|
||||
methods: {
|
||||
/** 查询登录日志 */
|
||||
getList() {
|
||||
this.loading = true
|
||||
list(this.addDateRange(this.queryParams, this.dateRange)).then(response => {
|
||||
this.list = response.rows
|
||||
this.total = response.total
|
||||
this.loading = false
|
||||
}
|
||||
)
|
||||
},
|
||||
// 操作日志类型字典翻译
|
||||
typeFormat(row, column) {
|
||||
return this.selectDictLabel(this.dict.type.sys_oper_type, row.businessType)
|
||||
},
|
||||
/** 搜索按钮操作 */
|
||||
handleQuery() {
|
||||
this.queryParams.pageNum = 1
|
||||
this.getList()
|
||||
},
|
||||
/** 重置按钮操作 */
|
||||
resetQuery() {
|
||||
this.dateRange = []
|
||||
this.resetForm("queryForm")
|
||||
this.queryParams.pageNum = 1
|
||||
this.$refs.tables.sort(this.defaultSort.prop, this.defaultSort.order)
|
||||
},
|
||||
/** 多选框选中数据 */
|
||||
handleSelectionChange(selection) {
|
||||
this.ids = selection.map(item => item.operId)
|
||||
this.multiple = !selection.length
|
||||
},
|
||||
/** 排序触发事件 */
|
||||
handleSortChange(column, prop, order) {
|
||||
this.queryParams.orderByColumn = column.prop
|
||||
this.queryParams.isAsc = column.order
|
||||
this.getList()
|
||||
},
|
||||
/** 详细按钮操作 */
|
||||
handleView(row) {
|
||||
this.open = true
|
||||
this.form = row
|
||||
},
|
||||
/** 删除按钮操作 */
|
||||
handleDelete(row) {
|
||||
const operIds = row.operId || this.ids
|
||||
this.$modal.confirm('是否确认删除日志编号为"' + operIds + '"的数据项？').then(() => {
|
||||
return delOperlog(operIds)
|
||||
}).then(() => {
|
||||
this.getList()
|
||||
this.$modal.msgSuccess('删除成功')
|
||||
}).catch(() => {})
|
||||
},
|
||||
/** 清空按钮操作 */
|
||||
handleClean() {
|
||||
this.$modal.confirm('是否确认清空所有操作日志数据项？').then(() => {
|
||||
return cleanOperlog()
|
||||
}).then(() => {
|
||||
this.getList()
|
||||
this.$modal.msgSuccess('清空成功')
|
||||
}).catch(() => {})
|
||||
},
|
||||
/** 导出按钮操作 */
|
||||
handleExport() {
|
||||
this.download('monitor/operlog/export', {
|
||||
...this.queryParams
|
||||
}, `operlog_${new Date().getTime()}.xlsx`)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
248
ruoyi-ui/src/views/monitor/server/index.vue
Normal file
248
ruoyi-ui/src/views/monitor/server/index.vue
Normal file
@@ -0,0 +1,248 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-row :gutter="10">
|
||||
<el-col :span="12" class="card-box">
|
||||
<el-card>
|
||||
<!-- cpu信息 -->
|
||||
<div slot="header"><span><i class="el-icon-cpu"></i>CPU信息</span></div>
|
||||
<div class="el-table el-table--enable-row-hover el-table--medium">
|
||||
<table cellspacing="0" style="width: 100%;">
|
||||
<thead>
|
||||
<tr>
|
||||
<!-- 属性 -->
|
||||
<th class="el-table__cell is-leaf"><div class="cell">属性</div></th>
|
||||
<!-- 值 -->
|
||||
<th class="el-table__cell is-leaf"><div class="cell">值</div></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<!-- 核心数 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">核心数</div></td>
|
||||
<!-- 值 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.cpuNum }}</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- CPU用户使用率 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">用户使用率</div></td>
|
||||
<!-- 值 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.used }}%</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- CPU系统使用率 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">系统使用率</div></td>
|
||||
<!-- 值 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.sys }}%</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- CPU空闲率 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">空闲率</div></td>
|
||||
<!-- 值 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.cpu">{{ server.cpu.free }}%</div></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12" class="card-box">
|
||||
<el-card>
|
||||
<!-- 内存 -->
|
||||
<div slot="header"><span><i class="el-icon-tickets"></i>内存信息</span></div>
|
||||
<div class="el-table el-table--enable-row-hover el-table--medium">
|
||||
<table cellspacing="0" style="width: 100%;">
|
||||
<thead>
|
||||
<tr>
|
||||
<!-- 属性 -->
|
||||
<th class="el-table__cell is-leaf"><div class="cell">属性</div></th>
|
||||
<!-- 内存 -->
|
||||
<th class="el-table__cell is-leaf"><div class="cell">内存</div></th>
|
||||
<!-- JVM -->
|
||||
<th class="el-table__cell is-leaf"><div class="cell">JVM</div></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<!-- 总内存 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">总内存</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem">{{ server.mem.total }}G</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.total }}M</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- 已用内存 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">已用内存</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem">{{ server.mem.used}}G</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.used}}M</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- 剩余内存 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">剩余内存</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem">{{ server.mem.free }}G</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.free }}M</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- 使用率 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">使用率</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.mem" :class="{'text-danger': server.mem.usage > 80}">{{ server.mem.usage }}%</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm" :class="{'text-danger': server.jvm.usage > 80}">{{ server.jvm.usage }}%</div></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24" class="card-box">
|
||||
<el-card>
|
||||
<div slot="header">
|
||||
<!-- 服务器信息 -->
|
||||
<span><i class="el-icon-monitor"></i>服务器信息</span>
|
||||
</div>
|
||||
<div class="el-table el-table--enable-row-hover el-table--medium">
|
||||
<table cellspacing="0" style="width: 100%;">
|
||||
<tbody>
|
||||
<tr>
|
||||
<!-- 服务器名称 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">服务器名称</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.computerName }}</div></td>
|
||||
<!-- 操作系统 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">操作系统</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.osName }}</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- 服务器IP -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">服务器IP</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.computerIp }}</div></td>
|
||||
<!-- 系统架构 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">系统架构</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.osArch }}</div></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24" class="card-box">
|
||||
<el-card>
|
||||
<div slot="header">
|
||||
<!-- java虚拟机信息 -->
|
||||
<span><i class="el-icon-coffee-cup"></i>Java虚拟机信息</span>
|
||||
</div>
|
||||
<div class="el-table el-table--enable-row-hover el-table--medium">
|
||||
<table cellspacing="0" style="width: 100%;table-layout:fixed;">
|
||||
<tbody>
|
||||
<tr>
|
||||
<!-- java名称 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">Java名称</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.name }}</div></td>
|
||||
<!-- java版本 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">Java版本</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.version }}</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- 启动时间 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">启动时间</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.startTime }}</div></td>
|
||||
<!-- 运行时长 -->
|
||||
<td class="el-table__cell is-leaf"><div class="cell">运行时长</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.runTime }}</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- 安装路径 -->
|
||||
<td colspan="1" class="el-table__cell is-leaf"><div class="cell">安装路径</div></td>
|
||||
<td colspan="3" class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.home }}</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- 项目路径 -->
|
||||
<td colspan="1" class="el-table__cell is-leaf"><div class="cell">项目路径</div></td>
|
||||
<td colspan="3" class="el-table__cell is-leaf"><div class="cell" v-if="server.sys">{{ server.sys.userDir }}</div></td>
|
||||
</tr>
|
||||
<tr>
|
||||
<!-- 运行参数 -->
|
||||
<td colspan="1" class="el-table__cell is-leaf"><div class="cell">运行参数</div></td>
|
||||
<td colspan="3" class="el-table__cell is-leaf"><div class="cell" v-if="server.jvm">{{ server.jvm.inputArgs }}</div></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24" class="card-box">
|
||||
<el-card>
|
||||
<div slot="header">
|
||||
<!-- 磁盘状态 -->
|
||||
<span><i class="el-icon-receiving"></i>磁盘状态</span>
|
||||
</div>
|
||||
<div class="el-table el-table--enable-row-hover el-table--medium">
|
||||
<table cellspacing="0" style="width: 100%;">
|
||||
<thead>
|
||||
<tr>
|
||||
<!-- 盘符路径 -->
|
||||
<th class="el-table__cell el-table__cell is-leaf"><div class="cell">盘符路径</div></th>
|
||||
<!-- 文件系统 -->
|
||||
<th class="el-table__cell is-leaf"><div class="cell">文件系统</div></th>
|
||||
<!-- 盘符类型 -->
|
||||
<th class="el-table__cell is-leaf"><div class="cell">盘符类型</div></th>
|
||||
<!-- 总大小 -->
|
||||
<th class="el-table__cell is-leaf"><div class="cell">总大小</div></th>
|
||||
<!-- 可用大小 -->
|
||||
<th class="el-table__cell is-leaf"><div class="cell">可用大小</div></th>
|
||||
<!-- 已用大小 -->
|
||||
<th class="el-table__cell is-leaf"><div class="cell">已用大小</div></th>
|
||||
<!-- 已用百分比 -->
|
||||
<th class="el-table__cell is-leaf"><div class="cell">已用百分比</div></th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody v-if="server.sysFiles">
|
||||
<tr v-for="(sysFile, index) in server.sysFiles" :key="index">
|
||||
<td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.dirName }}</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.sysTypeName }}</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.typeName }}</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.total }}</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.free }}</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell">{{ sysFile.used }}</div></td>
|
||||
<td class="el-table__cell is-leaf"><div class="cell" :class="{'text-danger': sysFile.usage > 80}">{{ sysFile.usage }}%</div></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</el-card>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getServer } from "@/api/monitor/server"
|
||||
|
||||
export default {
|
||||
name: "Server",
|
||||
data() {
|
||||
return {
|
||||
// 服务器信息
|
||||
server: []
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getList()
|
||||
this.openLoading()
|
||||
},
|
||||
methods: {
|
||||
/** 查询服务器信息 */
|
||||
getList() {
|
||||
getServer().then(response => {
|
||||
this.server = response.data
|
||||
this.$modal.closeLoading()
|
||||
})
|
||||
},
|
||||
// 打开加载层
|
||||
openLoading() {
|
||||
// 提示：正在加载服务监控数据，请稍候
|
||||
this.$modal.loading("正在加载服务监控数据，请稍候")
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
Reference in New Issue
Block a user