修改系统
This commit is contained in:
		
							
								
								
									
										26
									
								
								stdiet-ui/src/views/monitor/druid/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										26
									
								
								stdiet-ui/src/views/monitor/druid/index.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,26 @@ | ||||
| <template> | ||||
|   <div v-loading="loading" :style="'height:'+ height"> | ||||
|     <iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" /> | ||||
|   </div> | ||||
| </template> | ||||
| <script> | ||||
| export default { | ||||
|   name: "Druid", | ||||
|   data() { | ||||
|     return { | ||||
|       src: process.env.VUE_APP_BASE_API + "/druid/index.html", | ||||
|       height: document.documentElement.clientHeight - 94.5 + "px;", | ||||
|       loading: true | ||||
|     }; | ||||
|   }, | ||||
|   mounted: function() { | ||||
|     setTimeout(() => { | ||||
|       this.loading = false; | ||||
|     }, 230); | ||||
|     const that = this; | ||||
|     window.onresize = function temp() { | ||||
|       that.height = document.documentElement.clientHeight - 94.5 + "px;"; | ||||
|     }; | ||||
|   } | ||||
| }; | ||||
| </script> | ||||
							
								
								
									
										487
									
								
								stdiet-ui/src/views/monitor/job/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										487
									
								
								stdiet-ui/src/views/monitor/job/index.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,487 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
|     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"> | ||||
|       <el-form-item label="任务名称" prop="jobName"> | ||||
|         <el-input | ||||
|           v-model="queryParams.jobName" | ||||
|           placeholder="请输入任务名称" | ||||
|           clearable | ||||
|           size="small" | ||||
|           @keyup.enter.native="handleQuery" | ||||
|         /> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="任务组名" prop="jobGroup"> | ||||
|         <el-select v-model="queryParams.jobGroup" placeholder="请选择任务组名" clearable size="small"> | ||||
|           <el-option | ||||
|             v-for="dict in jobGroupOptions" | ||||
|             :key="dict.dictValue" | ||||
|             :label="dict.dictLabel" | ||||
|             :value="dict.dictValue" | ||||
|           /> | ||||
|         </el-select> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="任务状态" prop="status"> | ||||
|         <el-select v-model="queryParams.status" placeholder="请选择任务状态" clearable size="small"> | ||||
|           <el-option | ||||
|             v-for="dict in statusOptions" | ||||
|             :key="dict.dictValue" | ||||
|             :label="dict.dictLabel" | ||||
|             :value="dict.dictValue" | ||||
|           /> | ||||
|         </el-select> | ||||
|       </el-form-item> | ||||
|       <el-form-item> | ||||
|         <el-button type="cyan" 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" | ||||
|           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" | ||||
|           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" | ||||
|           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" | ||||
|           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" | ||||
|           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="任务编号" align="center" prop="jobId" /> | ||||
|       <el-table-column label="任务名称" align="center" prop="jobName" :show-overflow-tooltip="true" /> | ||||
|       <el-table-column label="任务组名" align="center" prop="jobGroup" :formatter="jobGroupFormat" /> | ||||
|       <el-table-column label="调用目标字符串" align="center" prop="invokeTarget" :show-overflow-tooltip="true" /> | ||||
|       <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-caret-right" | ||||
|             @click="handleRun(scope.row)" | ||||
|             v-hasPermi="['monitor:job:edit']" | ||||
|           >执行一次</el-button> | ||||
|           <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="title" :visible.sync="open" width="700px" 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 jobGroupOptions" | ||||
|                   :key="dict.dictValue" | ||||
|                   :label="dict.dictLabel" | ||||
|                   :value="dict.dictValue" | ||||
|                 ></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') | ||||
|                     <br />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="12"> | ||||
|             <el-form-item label="cron表达式" prop="cronExpression"> | ||||
|               <el-input v-model="form.cronExpression" placeholder="请输入cron执行表达式" /> | ||||
|             </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-col :span="24"> | ||||
|             <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="24"> | ||||
|             <el-form-item label="状态"> | ||||
|               <el-radio-group v-model="form.status"> | ||||
|                 <el-radio | ||||
|                   v-for="dict in statusOptions" | ||||
|                   :key="dict.dictValue" | ||||
|                   :label="dict.dictValue" | ||||
|                 >{{dict.dictLabel}}</el-radio> | ||||
|               </el-radio-group> | ||||
|             </el-form-item> | ||||
|           </el-col> | ||||
|         </el-row> | ||||
|       </el-form> | ||||
|       <div slot="footer" class="dialog-footer"> | ||||
|         <el-button type="primary" @click="submitForm">确 定</el-button> | ||||
|         <el-button @click="cancel">取 消</el-button> | ||||
|       </div> | ||||
|     </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"> | ||||
|             <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, exportJob, runJob, changeJobStatus } from "@/api/monitor/job"; | ||||
|  | ||||
| export default { | ||||
|   name: "Job", | ||||
|   data() { | ||||
|     return { | ||||
|       // 遮罩层 | ||||
|       loading: true, | ||||
|       // 选中数组 | ||||
|       ids: [], | ||||
|       // 非单个禁用 | ||||
|       single: true, | ||||
|       // 非多个禁用 | ||||
|       multiple: true, | ||||
|       // 显示搜索条件 | ||||
|       showSearch: true, | ||||
|       // 总条数 | ||||
|       total: 0, | ||||
|       // 定时任务表格数据 | ||||
|       jobList: [], | ||||
|       // 弹出层标题 | ||||
|       title: "", | ||||
|       // 是否显示弹出层 | ||||
|       open: false, | ||||
|       // 是否显示详细弹出层 | ||||
|       openView: false, | ||||
|       // 任务组名字典 | ||||
|       jobGroupOptions: [], | ||||
|       // 状态字典 | ||||
|       statusOptions: [], | ||||
|       // 查询参数 | ||||
|       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: [ | ||||
|           { required: true, message: "cron执行表达式不能为空", trigger: "blur" } | ||||
|         ] | ||||
|       } | ||||
|     }; | ||||
|   }, | ||||
|   created() { | ||||
|     this.getList(); | ||||
|     this.getDicts("sys_job_group").then(response => { | ||||
|       this.jobGroupOptions = response.data; | ||||
|     }); | ||||
|     this.getDicts("sys_job_status").then(response => { | ||||
|       this.statusOptions = response.data; | ||||
|     }); | ||||
|   }, | ||||
|   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.jobGroupOptions, row.jobGroup); | ||||
|     }, | ||||
|     // 状态字典翻译 | ||||
|     statusFormat(row, column) { | ||||
|       return this.selectDictLabel(this.statusOptions, row.status); | ||||
|     }, | ||||
|     // 取消按钮 | ||||
|     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; | ||||
|     }, | ||||
|     // 任务状态修改 | ||||
|     handleStatusChange(row) { | ||||
|       let text = row.status === "0" ? "启用" : "停用"; | ||||
|       this.$confirm('确认要"' + text + '""' + row.jobName + '"任务吗?', "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return changeJobStatus(row.jobId, row.status); | ||||
|         }).then(() => { | ||||
|           this.msgSuccess(text + "成功"); | ||||
|         }).catch(function() { | ||||
|           row.status = row.status === "0" ? "1" : "0"; | ||||
|         }); | ||||
|     }, | ||||
|     /* 立即执行一次 */ | ||||
|     handleRun(row) { | ||||
|       this.$confirm('确认要立即执行一次"' + row.jobName + '"任务吗?', "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return runJob(row.jobId, row.jobGroup); | ||||
|         }).then(() => { | ||||
|           this.msgSuccess("执行成功"); | ||||
|         }).catch(function() {}); | ||||
|     }, | ||||
|     /** 任务详细信息 */ | ||||
|     handleView(row) { | ||||
|       getJob(row.jobId).then(response => { | ||||
|         this.form = response.data; | ||||
|         this.openView = true; | ||||
|       }); | ||||
|     }, | ||||
|     /** 任务日志列表查询 */ | ||||
|     handleJobLog() { | ||||
|       this.$router.push("/job/log"); | ||||
|     }, | ||||
|     /** 新增按钮操作 */ | ||||
|     handleAdd() { | ||||
|       this.reset(); | ||||
|       this.open = true; | ||||
|       this.title = "添加任务"; | ||||
|     }, | ||||
|     /** 修改按钮操作 */ | ||||
|     handleUpdate(row) { | ||||
|       this.reset(); | ||||
|       const jobId = row.jobId || this.ids; | ||||
|       getJob(jobId).then(response => { | ||||
|         this.form = response.data; | ||||
|         this.open = true; | ||||
|         this.title = "修改任务"; | ||||
|       }); | ||||
|     }, | ||||
|     /** 提交按钮 */ | ||||
|     submitForm: function() { | ||||
|       this.$refs["form"].validate(valid => { | ||||
|         if (valid) { | ||||
|           if (this.form.jobId != undefined) { | ||||
|             updateJob(this.form).then(response => { | ||||
|               if (response.code === 200) { | ||||
|                 this.msgSuccess("修改成功"); | ||||
|                 this.open = false; | ||||
|                 this.getList(); | ||||
|               } | ||||
|             }); | ||||
|           } else { | ||||
|             addJob(this.form).then(response => { | ||||
|               if (response.code === 200) { | ||||
|                 this.msgSuccess("新增成功"); | ||||
|                 this.open = false; | ||||
|                 this.getList(); | ||||
|               } | ||||
|             }); | ||||
|           } | ||||
|         } | ||||
|       }); | ||||
|     }, | ||||
|     /** 删除按钮操作 */ | ||||
|     handleDelete(row) { | ||||
|       const jobIds = row.jobId || this.ids; | ||||
|       this.$confirm('是否确认删除定时任务编号为"' + jobIds + '"的数据项?', "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return delJob(jobIds); | ||||
|         }).then(() => { | ||||
|           this.getList(); | ||||
|           this.msgSuccess("删除成功"); | ||||
|         }).catch(function() {}); | ||||
|     }, | ||||
|     /** 导出按钮操作 */ | ||||
|     handleExport() { | ||||
|       const queryParams = this.queryParams; | ||||
|       this.$confirm("是否确认导出所有定时任务数据项?", "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return exportJob(queryParams); | ||||
|         }).then(response => { | ||||
|           this.download(response.msg); | ||||
|         }).catch(function() {}); | ||||
|     } | ||||
|   } | ||||
| }; | ||||
| </script> | ||||
							
								
								
									
										296
									
								
								stdiet-ui/src/views/monitor/job/log.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										296
									
								
								stdiet-ui/src/views/monitor/job/log.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,296 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
|     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"> | ||||
|       <el-form-item label="任务名称" prop="jobName"> | ||||
|         <el-input | ||||
|           v-model="queryParams.jobName" | ||||
|           placeholder="请输入任务名称" | ||||
|           clearable | ||||
|           size="small" | ||||
|           style="width: 240px" | ||||
|           @keyup.enter.native="handleQuery" | ||||
|         /> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="任务组名" prop="jobGroup"> | ||||
|         <el-select | ||||
|           v-model="queryParams.jobGroup" | ||||
|           placeholder="请任务组名" | ||||
|           clearable | ||||
|           size="small" | ||||
|           style="width: 240px" | ||||
|         > | ||||
|           <el-option | ||||
|             v-for="dict in jobGroupOptions" | ||||
|             :key="dict.dictValue" | ||||
|             :label="dict.dictLabel" | ||||
|             :value="dict.dictValue" | ||||
|           /> | ||||
|         </el-select> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="执行状态" prop="status"> | ||||
|         <el-select | ||||
|           v-model="queryParams.status" | ||||
|           placeholder="请选择执行状态" | ||||
|           clearable | ||||
|           size="small" | ||||
|           style="width: 240px" | ||||
|         > | ||||
|           <el-option | ||||
|             v-for="dict in statusOptions" | ||||
|             :key="dict.dictValue" | ||||
|             :label="dict.dictLabel" | ||||
|             :value="dict.dictValue" | ||||
|           /> | ||||
|         </el-select> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="执行时间"> | ||||
|         <el-date-picker | ||||
|           v-model="dateRange" | ||||
|           size="small" | ||||
|           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="cyan" 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" | ||||
|           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" | ||||
|           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" | ||||
|           icon="el-icon-download" | ||||
|           size="mini" | ||||
|           @click="handleExport" | ||||
|           v-hasPermi="['monitor:job:export']" | ||||
|         >导出</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" :formatter="jobGroupFormat" :show-overflow-tooltip="true" /> | ||||
|       <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" :formatter="statusFormat" /> | ||||
|       <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="执行状态:"> | ||||
|               <div v-if="form.status == 0">正常</div> | ||||
|               <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 { listJobLog, delJobLog, exportJobLog, cleanJobLog } from "@/api/monitor/jobLog"; | ||||
|  | ||||
| export default { | ||||
|   name: "JobLog", | ||||
|   data() { | ||||
|     return { | ||||
|       // 遮罩层 | ||||
|       loading: true, | ||||
|       // 选中数组 | ||||
|       ids: [], | ||||
|       // 非多个禁用 | ||||
|       multiple: true, | ||||
|       // 显示搜索条件 | ||||
|       showSearch: true, | ||||
|       // 总条数 | ||||
|       total: 0, | ||||
|       // 调度日志表格数据 | ||||
|       jobLogList: [], | ||||
|       // 是否显示弹出层 | ||||
|       open: false, | ||||
|       // 日期范围 | ||||
|       dateRange: [], | ||||
|       // 表单参数 | ||||
|       form: {}, | ||||
|       // 执行状态字典 | ||||
|       statusOptions: [], | ||||
|       // 任务组名字典 | ||||
|       jobGroupOptions: [], | ||||
|       // 查询参数 | ||||
|       queryParams: { | ||||
|         pageNum: 1, | ||||
|         pageSize: 10, | ||||
|         jobName: undefined, | ||||
|         jobGroup: undefined, | ||||
|         status: undefined | ||||
|       } | ||||
|     }; | ||||
|   }, | ||||
|   created() { | ||||
|     this.getList(); | ||||
|     this.getDicts("sys_job_status").then(response => { | ||||
|       this.statusOptions = response.data; | ||||
|     }); | ||||
|     this.getDicts("sys_job_group").then(response => { | ||||
|       this.jobGroupOptions = response.data; | ||||
|     }); | ||||
|   }, | ||||
|   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; | ||||
|         } | ||||
|       ); | ||||
|     }, | ||||
|     // 执行状态字典翻译 | ||||
|     statusFormat(row, column) { | ||||
|       return this.selectDictLabel(this.statusOptions, row.status); | ||||
|     }, | ||||
|     // 任务组名字典翻译 | ||||
|     jobGroupFormat(row, column) { | ||||
|       return this.selectDictLabel(this.jobGroupOptions, row.jobGroup); | ||||
|     }, | ||||
|     /** 搜索按钮操作 */ | ||||
|     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.$confirm('是否确认删除调度日志编号为"' + jobLogIds + '"的数据项?', "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return delJobLog(jobLogIds); | ||||
|         }).then(() => { | ||||
|           this.getList(); | ||||
|           this.msgSuccess("删除成功"); | ||||
|         }).catch(function() {}); | ||||
|     }, | ||||
|     /** 清空按钮操作 */ | ||||
|     handleClean() { | ||||
|       this.$confirm("是否确认清空所有调度日志数据项?", "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return cleanJobLog(); | ||||
|         }).then(() => { | ||||
|           this.getList(); | ||||
|           this.msgSuccess("清空成功"); | ||||
|         }).catch(function() {}); | ||||
|     }, | ||||
|     /** 导出按钮操作 */ | ||||
|     handleExport() { | ||||
|       const queryParams = this.queryParams; | ||||
|       this.$confirm("是否确认导出所有调度日志数据项?", "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return exportJobLog(queryParams); | ||||
|         }).then(response => { | ||||
|           this.download(response.msg); | ||||
|         }).catch(function() {}); | ||||
|     } | ||||
|   } | ||||
| }; | ||||
| </script> | ||||
							
								
								
									
										230
									
								
								stdiet-ui/src/views/monitor/logininfor/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										230
									
								
								stdiet-ui/src/views/monitor/logininfor/index.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,230 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
|     <el-form :model="queryParams" ref="queryForm" :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;" | ||||
|           size="small" | ||||
|           @keyup.enter.native="handleQuery" | ||||
|         /> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="用户名称" prop="userName"> | ||||
|         <el-input | ||||
|           v-model="queryParams.userName" | ||||
|           placeholder="请输入用户名称" | ||||
|           clearable | ||||
|           style="width: 240px;" | ||||
|           size="small" | ||||
|           @keyup.enter.native="handleQuery" | ||||
|         /> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="状态" prop="status"> | ||||
|         <el-select | ||||
|           v-model="queryParams.status" | ||||
|           placeholder="登录状态" | ||||
|           clearable | ||||
|           size="small" | ||||
|           style="width: 240px" | ||||
|         > | ||||
|           <el-option | ||||
|             v-for="dict in statusOptions" | ||||
|             :key="dict.dictValue" | ||||
|             :label="dict.dictLabel" | ||||
|             :value="dict.dictValue" | ||||
|           /> | ||||
|         </el-select> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="登录时间"> | ||||
|         <el-date-picker | ||||
|           v-model="dateRange" | ||||
|           size="small" | ||||
|           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="cyan" 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" | ||||
|           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" | ||||
|           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="warning" | ||||
|           icon="el-icon-download" | ||||
|           size="mini" | ||||
|           @click="handleExport" | ||||
|           v-hasPermi="['system:logininfor:export']" | ||||
|         >导出</el-button> | ||||
|       </el-col> | ||||
|       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> | ||||
|     </el-row> | ||||
|  | ||||
|     <el-table v-loading="loading" :data="list" @selection-change="handleSelectionChange"> | ||||
|       <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" /> | ||||
|       <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" /> | ||||
|       <el-table-column label="操作系统" align="center" prop="os" /> | ||||
|       <el-table-column label="登录状态" align="center" prop="status" :formatter="statusFormat" /> | ||||
|       <el-table-column label="操作信息" align="center" prop="msg" /> | ||||
|       <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> | ||||
|  | ||||
|     <pagination | ||||
|       v-show="total>0" | ||||
|       :total="total" | ||||
|       :page.sync="queryParams.pageNum" | ||||
|       :limit.sync="queryParams.pageSize" | ||||
|       @pagination="getList" | ||||
|     /> | ||||
|   </div> | ||||
| </template> | ||||
|  | ||||
| <script> | ||||
| import { list, delLogininfor, cleanLogininfor, exportLogininfor } from "@/api/monitor/logininfor"; | ||||
|  | ||||
| export default { | ||||
|   name: "Logininfor", | ||||
|   data() { | ||||
|     return { | ||||
|       // 遮罩层 | ||||
|       loading: true, | ||||
|       // 选中数组 | ||||
|       ids: [], | ||||
|       // 非多个禁用 | ||||
|       multiple: true, | ||||
|       // 显示搜索条件 | ||||
|       showSearch: true, | ||||
|       // 总条数 | ||||
|       total: 0, | ||||
|       // 表格数据 | ||||
|       list: [], | ||||
|       // 状态数据字典 | ||||
|       statusOptions: [], | ||||
|       // 日期范围 | ||||
|       dateRange: [], | ||||
|       // 查询参数 | ||||
|       queryParams: { | ||||
|         pageNum: 1, | ||||
|         pageSize: 10, | ||||
|         ipaddr: undefined, | ||||
|         userName: undefined, | ||||
|         status: undefined | ||||
|       } | ||||
|     }; | ||||
|   }, | ||||
|   created() { | ||||
|     this.getList(); | ||||
|     this.getDicts("sys_common_status").then(response => { | ||||
|       this.statusOptions = response.data; | ||||
|     }); | ||||
|   }, | ||||
|   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; | ||||
|         } | ||||
|       ); | ||||
|     }, | ||||
|     // 登录状态字典翻译 | ||||
|     statusFormat(row, column) { | ||||
|       return this.selectDictLabel(this.statusOptions, row.status); | ||||
|     }, | ||||
|     /** 搜索按钮操作 */ | ||||
|     handleQuery() { | ||||
|       this.queryParams.pageNum = 1; | ||||
|       this.getList(); | ||||
|     }, | ||||
|     /** 重置按钮操作 */ | ||||
|     resetQuery() { | ||||
|       this.dateRange = []; | ||||
|       this.resetForm("queryForm"); | ||||
|       this.handleQuery(); | ||||
|     }, | ||||
|     // 多选框选中数据 | ||||
|     handleSelectionChange(selection) { | ||||
|       this.ids = selection.map(item => item.infoId) | ||||
|       this.multiple = !selection.length | ||||
|     }, | ||||
|     /** 删除按钮操作 */ | ||||
|     handleDelete(row) { | ||||
|       const infoIds = row.infoId || this.ids; | ||||
|       this.$confirm('是否确认删除访问编号为"' + infoIds + '"的数据项?', "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return delLogininfor(infoIds); | ||||
|         }).then(() => { | ||||
|           this.getList(); | ||||
|           this.msgSuccess("删除成功"); | ||||
|         }).catch(function() {}); | ||||
|     }, | ||||
|     /** 清空按钮操作 */ | ||||
|     handleClean() { | ||||
|         this.$confirm('是否确认清空所有登录日志数据项?', "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return cleanLogininfor(); | ||||
|         }).then(() => { | ||||
|           this.getList(); | ||||
|           this.msgSuccess("清空成功"); | ||||
|         }).catch(function() {}); | ||||
|     }, | ||||
|     /** 导出按钮操作 */ | ||||
|     handleExport() { | ||||
|       const queryParams = this.queryParams; | ||||
|       this.$confirm('是否确认导出所有操作日志数据项?', "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return exportLogininfor(queryParams); | ||||
|         }).then(response => { | ||||
|           this.download(response.msg); | ||||
|         }).catch(function() {}); | ||||
|     } | ||||
|   } | ||||
| }; | ||||
| </script> | ||||
|  | ||||
							
								
								
									
										128
									
								
								stdiet-ui/src/views/monitor/online/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										128
									
								
								stdiet-ui/src/views/monitor/online/index.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,128 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
|     <el-form :model="queryParams" ref="queryForm" :inline="true" label-width="68px"> | ||||
|       <el-form-item label="登录地址" prop="ipaddr"> | ||||
|         <el-input | ||||
|           v-model="queryParams.ipaddr" | ||||
|           placeholder="请输入登录地址" | ||||
|           clearable | ||||
|           size="small" | ||||
|           @keyup.enter.native="handleQuery" | ||||
|         /> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="用户名称" prop="userName"> | ||||
|         <el-input | ||||
|           v-model="queryParams.userName" | ||||
|           placeholder="请输入用户名称" | ||||
|           clearable | ||||
|           size="small" | ||||
|           @keyup.enter.native="handleQuery" | ||||
|         /> | ||||
|       </el-form-item> | ||||
|       <el-form-item> | ||||
|         <el-button type="cyan" 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; | ||||
|       list(this.queryParams).then(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) { | ||||
|       this.$confirm('是否确认强退名称为"' + row.userName + '"的数据项?', "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return forceLogout(row.tokenId); | ||||
|         }).then(() => { | ||||
|           this.getList(); | ||||
|           this.msgSuccess("强退成功"); | ||||
|         }).catch(function() {}); | ||||
|     } | ||||
|   } | ||||
| }; | ||||
| </script> | ||||
|  | ||||
							
								
								
									
										318
									
								
								stdiet-ui/src/views/monitor/operlog/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										318
									
								
								stdiet-ui/src/views/monitor/operlog/index.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,318 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
|     <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px"> | ||||
|       <el-form-item label="系统模块" prop="title"> | ||||
|         <el-input | ||||
|           v-model="queryParams.title" | ||||
|           placeholder="请输入系统模块" | ||||
|           clearable | ||||
|           style="width: 240px;" | ||||
|           size="small" | ||||
|           @keyup.enter.native="handleQuery" | ||||
|         /> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="操作人员" prop="operName"> | ||||
|         <el-input | ||||
|           v-model="queryParams.operName" | ||||
|           placeholder="请输入操作人员" | ||||
|           clearable | ||||
|           style="width: 240px;" | ||||
|           size="small" | ||||
|           @keyup.enter.native="handleQuery" | ||||
|         /> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="类型" prop="businessType"> | ||||
|         <el-select | ||||
|           v-model="queryParams.businessType" | ||||
|           placeholder="操作类型" | ||||
|           clearable | ||||
|           size="small" | ||||
|           style="width: 240px" | ||||
|         > | ||||
|           <el-option | ||||
|             v-for="dict in typeOptions" | ||||
|             :key="dict.dictValue" | ||||
|             :label="dict.dictLabel" | ||||
|             :value="dict.dictValue" | ||||
|           /> | ||||
|         </el-select> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="状态" prop="status"> | ||||
|         <el-select | ||||
|           v-model="queryParams.status" | ||||
|           placeholder="操作状态" | ||||
|           clearable | ||||
|           size="small" | ||||
|           style="width: 240px" | ||||
|         > | ||||
|           <el-option | ||||
|             v-for="dict in statusOptions" | ||||
|             :key="dict.dictValue" | ||||
|             :label="dict.dictLabel" | ||||
|             :value="dict.dictValue" | ||||
|           /> | ||||
|         </el-select> | ||||
|       </el-form-item> | ||||
|       <el-form-item label="操作时间"> | ||||
|         <el-date-picker | ||||
|           v-model="dateRange" | ||||
|           size="small" | ||||
|           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="cyan" 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" | ||||
|           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" | ||||
|           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" | ||||
|           icon="el-icon-download" | ||||
|           size="mini" | ||||
|           @click="handleExport" | ||||
|           v-hasPermi="['system:config:export']" | ||||
|         >导出</el-button> | ||||
|       </el-col> | ||||
|       <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar> | ||||
|     </el-row> | ||||
|  | ||||
|     <el-table v-loading="loading" :data="list" @selection-change="handleSelectionChange"> | ||||
|       <el-table-column type="selection" width="55" align="center" /> | ||||
|       <el-table-column label="日志编号" align="center" prop="operId" /> | ||||
|       <el-table-column label="系统模块" align="center" prop="title" /> | ||||
|       <el-table-column label="操作类型" align="center" prop="businessType" :formatter="typeFormat" /> | ||||
|       <el-table-column label="请求方式" align="center" prop="requestMethod" /> | ||||
|       <el-table-column label="操作人员" align="center" prop="operName" /> | ||||
|       <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" :formatter="statusFormat" /> | ||||
|       <el-table-column label="操作日期" align="center" prop="operTime" width="180"> | ||||
|         <template slot-scope="scope"> | ||||
|           <span>{{ parseTime(scope.row.operTime) }}</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="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.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="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="操作时间:">{{ 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, exportOperlog } from "@/api/monitor/operlog"; | ||||
|  | ||||
| export default { | ||||
|   name: "Operlog", | ||||
|   data() { | ||||
|     return { | ||||
|       // 遮罩层 | ||||
|       loading: true, | ||||
|       // 选中数组 | ||||
|       ids: [], | ||||
|       // 非多个禁用 | ||||
|       multiple: true, | ||||
|       // 显示搜索条件 | ||||
|       showSearch: true, | ||||
|       // 总条数 | ||||
|       total: 0, | ||||
|       // 表格数据 | ||||
|       list: [], | ||||
|       // 是否显示弹出层 | ||||
|       open: false, | ||||
|       // 类型数据字典 | ||||
|       typeOptions: [], | ||||
|       // 类型数据字典 | ||||
|       statusOptions: [], | ||||
|       // 日期范围 | ||||
|       dateRange: [], | ||||
|       // 表单参数 | ||||
|       form: {}, | ||||
|       // 查询参数 | ||||
|       queryParams: { | ||||
|         pageNum: 1, | ||||
|         pageSize: 10, | ||||
|         title: undefined, | ||||
|         operName: undefined, | ||||
|         businessType: undefined, | ||||
|         status: undefined | ||||
|       } | ||||
|     }; | ||||
|   }, | ||||
|   created() { | ||||
|     this.getList(); | ||||
|     this.getDicts("sys_oper_type").then(response => { | ||||
|       this.typeOptions = response.data; | ||||
|     }); | ||||
|     this.getDicts("sys_common_status").then(response => { | ||||
|       this.statusOptions = response.data; | ||||
|     }); | ||||
|   }, | ||||
|   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; | ||||
|         } | ||||
|       ); | ||||
|     }, | ||||
|     // 操作日志状态字典翻译 | ||||
|     statusFormat(row, column) { | ||||
|       return this.selectDictLabel(this.statusOptions, row.status); | ||||
|     }, | ||||
|     // 操作日志类型字典翻译 | ||||
|     typeFormat(row, column) { | ||||
|       return this.selectDictLabel(this.typeOptions, row.businessType); | ||||
|     }, | ||||
|     /** 搜索按钮操作 */ | ||||
|     handleQuery() { | ||||
|       this.queryParams.pageNum = 1; | ||||
|       this.getList(); | ||||
|     }, | ||||
|     /** 重置按钮操作 */ | ||||
|     resetQuery() { | ||||
|       this.dateRange = []; | ||||
|       this.resetForm("queryForm"); | ||||
|       this.handleQuery(); | ||||
|     }, | ||||
|     // 多选框选中数据 | ||||
|     handleSelectionChange(selection) { | ||||
|       this.ids = selection.map(item => item.operId) | ||||
|       this.multiple = !selection.length | ||||
|     }, | ||||
|     /** 详细按钮操作 */ | ||||
|     handleView(row) { | ||||
|       this.open = true; | ||||
|       this.form = row; | ||||
|     }, | ||||
|     /** 删除按钮操作 */ | ||||
|     handleDelete(row) { | ||||
|       const operIds = row.operId || this.ids; | ||||
|       this.$confirm('是否确认删除日志编号为"' + operIds + '"的数据项?', "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return delOperlog(operIds); | ||||
|         }).then(() => { | ||||
|           this.getList(); | ||||
|           this.msgSuccess("删除成功"); | ||||
|         }).catch(function() {}); | ||||
|     }, | ||||
|     /** 清空按钮操作 */ | ||||
|     handleClean() { | ||||
|         this.$confirm('是否确认清空所有操作日志数据项?', "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return cleanOperlog(); | ||||
|         }).then(() => { | ||||
|           this.getList(); | ||||
|           this.msgSuccess("清空成功"); | ||||
|         }).catch(function() {}); | ||||
|     }, | ||||
|     /** 导出按钮操作 */ | ||||
|     handleExport() { | ||||
|       const queryParams = this.queryParams; | ||||
|       this.$confirm('是否确认导出所有操作日志数据项?', "警告", { | ||||
|           confirmButtonText: "确定", | ||||
|           cancelButtonText: "取消", | ||||
|           type: "warning" | ||||
|         }).then(function() { | ||||
|           return exportOperlog(queryParams); | ||||
|         }).then(response => { | ||||
|           this.download(response.msg); | ||||
|         }).catch(function() {}); | ||||
|     } | ||||
|   } | ||||
| }; | ||||
| </script> | ||||
|  | ||||
							
								
								
									
										210
									
								
								stdiet-ui/src/views/monitor/server/index.vue
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										210
									
								
								stdiet-ui/src/views/monitor/server/index.vue
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,210 @@ | ||||
| <template> | ||||
|   <div class="app-container"> | ||||
|     <el-row> | ||||
|       <el-col :span="12" class="card-box"> | ||||
|         <el-card> | ||||
|           <div slot="header"><span>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="is-leaf"><div class="cell">属性</div></th> | ||||
|                   <th class="is-leaf"><div class="cell">值</div></th> | ||||
|                 </tr> | ||||
|               </thead> | ||||
|               <tbody> | ||||
|                 <tr> | ||||
|                   <td><div class="cell">核心数</div></td> | ||||
|                   <td><div class="cell" v-if="server.cpu">{{ server.cpu.cpuNum }}</div></td> | ||||
|                 </tr> | ||||
|                 <tr> | ||||
|                   <td><div class="cell">用户使用率</div></td> | ||||
|                   <td><div class="cell" v-if="server.cpu">{{ server.cpu.used }}%</div></td> | ||||
|                 </tr> | ||||
|                 <tr> | ||||
|                   <td><div class="cell">系统使用率</div></td> | ||||
|                   <td><div class="cell" v-if="server.cpu">{{ server.cpu.sys }}%</div></td> | ||||
|                 </tr> | ||||
|                 <tr> | ||||
|                   <td><div class="cell">当前空闲率</div></td> | ||||
|                   <td><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>内存</span></div> | ||||
|           <div class="el-table el-table--enable-row-hover el-table--medium"> | ||||
|             <table cellspacing="0" style="width: 100%;"> | ||||
|               <thead> | ||||
|                 <tr> | ||||
|                   <th class="is-leaf"><div class="cell">属性</div></th> | ||||
|                   <th class="is-leaf"><div class="cell">内存</div></th> | ||||
|                   <th class="is-leaf"><div class="cell">JVM</div></th> | ||||
|                 </tr> | ||||
|               </thead> | ||||
|               <tbody> | ||||
|                 <tr> | ||||
|                   <td><div class="cell">总内存</div></td> | ||||
|                   <td><div class="cell" v-if="server.mem">{{ server.mem.total }}G</div></td> | ||||
|                   <td><div class="cell" v-if="server.jvm">{{ server.jvm.total }}M</div></td> | ||||
|                 </tr> | ||||
|                 <tr> | ||||
|                   <td><div class="cell">已用内存</div></td> | ||||
|                   <td><div class="cell" v-if="server.mem">{{ server.mem.used}}G</div></td> | ||||
|                   <td><div class="cell" v-if="server.jvm">{{ server.jvm.used}}M</div></td> | ||||
|                 </tr> | ||||
|                 <tr> | ||||
|                   <td><div class="cell">剩余内存</div></td> | ||||
|                   <td><div class="cell" v-if="server.mem">{{ server.mem.free }}G</div></td> | ||||
|                   <td><div class="cell" v-if="server.jvm">{{ server.jvm.free }}M</div></td> | ||||
|                 </tr> | ||||
|                 <tr> | ||||
|                   <td><div class="cell">使用率</div></td> | ||||
|                   <td><div class="cell" v-if="server.mem" :class="{'text-danger': server.mem.usage > 80}">{{ server.mem.usage }}%</div></td> | ||||
|                   <td><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>服务器信息</span> | ||||
|           </div> | ||||
|           <div class="el-table el-table--enable-row-hover el-table--medium"> | ||||
|             <table cellspacing="0" style="width: 100%;"> | ||||
|               <tbody> | ||||
|                 <tr> | ||||
|                   <td><div class="cell">服务器名称</div></td> | ||||
|                   <td><div class="cell" v-if="server.sys">{{ server.sys.computerName }}</div></td> | ||||
|                   <td><div class="cell">操作系统</div></td> | ||||
|                   <td><div class="cell" v-if="server.sys">{{ server.sys.osName }}</div></td> | ||||
|                 </tr> | ||||
|                 <tr> | ||||
|                   <td><div class="cell">服务器IP</div></td> | ||||
|                   <td><div class="cell" v-if="server.sys">{{ server.sys.computerIp }}</div></td> | ||||
|                   <td><div class="cell">系统架构</div></td> | ||||
|                   <td><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"> | ||||
|             <span>Java虚拟机信息</span> | ||||
|           </div> | ||||
|           <div class="el-table el-table--enable-row-hover el-table--medium"> | ||||
|             <table cellspacing="0" style="width: 100%;"> | ||||
|               <tbody> | ||||
|                 <tr> | ||||
|                   <td><div class="cell">Java名称</div></td> | ||||
|                   <td><div class="cell" v-if="server.jvm">{{ server.jvm.name }}</div></td> | ||||
|                   <td><div class="cell">Java版本</div></td> | ||||
|                   <td><div class="cell" v-if="server.jvm">{{ server.jvm.version }}</div></td> | ||||
|                 </tr> | ||||
|                 <tr> | ||||
|                   <td><div class="cell">启动时间</div></td> | ||||
|                   <td><div class="cell" v-if="server.jvm">{{ server.jvm.startTime }}</div></td> | ||||
|                   <td><div class="cell">运行时长</div></td> | ||||
|                   <td><div class="cell" v-if="server.jvm">{{ server.jvm.runTime }}</div></td> | ||||
|                 </tr> | ||||
|                 <tr> | ||||
|                   <td colspan="1"><div class="cell">安装路径</div></td> | ||||
|                   <td colspan="3"><div class="cell" v-if="server.jvm">{{ server.jvm.home }}</div></td> | ||||
|                 </tr> | ||||
|                 <tr> | ||||
|                   <td colspan="1"><div class="cell">项目路径</div></td> | ||||
|                   <td colspan="3"><div class="cell" v-if="server.sys">{{ server.sys.userDir }}</div></td> | ||||
|                 </tr> | ||||
|               </tbody> | ||||
|             </table> | ||||
|           </div> | ||||
|         </el-card> | ||||
|       </el-col> | ||||
|  | ||||
|       <el-col :span="24" class="card-box"> | ||||
|         <el-card> | ||||
|           <div slot="header"> | ||||
|             <span>磁盘状态</span> | ||||
|           </div> | ||||
|           <div class="el-table el-table--enable-row-hover el-table--medium"> | ||||
|             <table cellspacing="0" style="width: 100%;"> | ||||
|               <thead> | ||||
|                 <tr> | ||||
|                   <th class="is-leaf"><div class="cell">盘符路径</div></th> | ||||
|                   <th class="is-leaf"><div class="cell">文件系统</div></th> | ||||
|                   <th class="is-leaf"><div class="cell">盘符类型</div></th> | ||||
|                   <th class="is-leaf"><div class="cell">总大小</div></th> | ||||
|                   <th class="is-leaf"><div class="cell">可用大小</div></th> | ||||
|                   <th class="is-leaf"><div class="cell">已用大小</div></th> | ||||
|                   <th class="is-leaf"><div class="cell">已用百分比</div></th> | ||||
|                 </tr> | ||||
|               </thead> | ||||
|               <tbody v-if="server.sysFiles"> | ||||
|                 <tr v-for="sysFile in server.sysFiles"> | ||||
|                   <td><div class="cell">{{ sysFile.dirName }}</div></td> | ||||
|                   <td><div class="cell">{{ sysFile.sysTypeName }}</div></td> | ||||
|                   <td><div class="cell">{{ sysFile.typeName }}</div></td> | ||||
|                   <td><div class="cell">{{ sysFile.total }}</div></td> | ||||
|                   <td><div class="cell">{{ sysFile.free }}</div></td> | ||||
|                   <td><div class="cell">{{ sysFile.used }}</div></td> | ||||
|                   <td><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 { | ||||
|       // 加载层信息 | ||||
|       loading: [], | ||||
|       // 服务器信息 | ||||
|       server: [] | ||||
|     }; | ||||
|   }, | ||||
|   created() { | ||||
|     this.getList(); | ||||
|     this.openLoading(); | ||||
|   }, | ||||
|   methods: { | ||||
|     /** 查询服务器信息 */ | ||||
|     getList() { | ||||
|       getServer().then(response => { | ||||
|         this.server = response.data; | ||||
|         this.loading.close(); | ||||
|       }); | ||||
|     }, | ||||
|     // 打开加载层 | ||||
|     openLoading() { | ||||
|       this.loading = this.$loading({ | ||||
|         lock: true, | ||||
|         text: "拼命读取中", | ||||
|         spinner: "el-icon-loading", | ||||
|         background: "rgba(0, 0, 0, 0.7)" | ||||
|       }); | ||||
|     } | ||||
|   } | ||||
| }; | ||||
| </script> | ||||
		Reference in New Issue
	
	Block a user