taoge_xiaodi/maintenance_system
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

0918

Browse Source
This commit is contained in:
dhr
2025-09-18 19:56:24 +08:00
parent 834b0ab161
commit 93d9d71c25
18 changed files with 154 additions and 123 deletions
Download Patch File Download Diff File Expand all files Collapse all files

112
src/views/zhinengxunjian/index.vue
View File

@ -68,8 +68,12 @@
<div class="todo-description">检查所有生产服务器的CPU、内存、磁盘使用率，确保正常运行</div>
</div>
<div class="todo-actions">
<el-button type="primary" size="small" icon="el-icon-check">编辑</el-button>
<el-button type="danger" size="small" icon="el-icon-delete">删除</el-button>
<button class="action-btn edit-btn" @click="handleEdit">
<img src="@/assets/images/xiugai.png" alt="编辑" class="action-icon" />
</button>
<button class="action-btn delete-btn" @click="handleDelete">
<img src="@/assets/images/shanchu.png" alt="删除" class="action-icon" />
</button>
</div>
</div>
@ -85,8 +89,12 @@
<div class="todo-description">主要数据库全备份，并验证备份文件完整性</div>
</div>
<div class="todo-actions">
<el-button type="primary" size="small" icon="el-icon-check">编辑</el-button>
<el-button type="danger" size="small" icon="el-icon-delete">删除</el-button>
<button class="action-btn edit-btn" @click="handleEdit">
<img src="@/assets/images/xiugai.png" alt="编辑" class="action-icon" />
</button>
<button class="action-btn delete-btn" @click="handleDelete">
<img src="@/assets/images/shanchu.png" alt="删除" class="action-icon" />
</button>
</div>
</div>
@ -102,8 +110,12 @@
<div class="todo-description">更新核心交换机和防火墙固件，需安排在业务低峰期</div>
</div>
<div class="todo-actions">
<el-button type="primary" size="small" icon="el-icon-check">编辑</el-button>
<el-button type="danger" size="small" icon="el-icon-delete">删除</el-button>
<button class="action-btn edit-btn" @click="handleEdit">
<img src="@/assets/images/xiugai.png" alt="编辑" class="action-icon" />
</button>
<button class="action-btn delete-btn" @click="handleDelete">
<img src="@/assets/images/shanchu.png" alt="删除" class="action-icon" />
</button>
</div>
</div>
@ -119,8 +131,12 @@
<div class="todo-description">检查所有生产服务器的CPU、内存、磁盘使用率，确保正常运行</div>
</div>
<div class="todo-actions">
<el-button type="primary" size="small" icon="el-icon-check">编辑</el-button>
<el-button type="danger" size="small" icon="el-icon-delete">删除</el-button>
<button class="action-btn edit-btn" @click="handleEdit">
<img src="@/assets/images/xiugai.png" alt="编辑" class="action-icon" />
</button>
<button class="action-btn delete-btn" @click="handleDelete">
<img src="@/assets/images/shanchu.png" alt="删除" class="action-icon" />
</button>
</div>
</div>
<div class="todo-item">
@ -134,8 +150,12 @@
<div class="todo-description">检查所有生产服务器的CPU、内存、磁盘使用率，确保正常运行</div>
</div>
<div class="todo-actions">
<el-button type="primary" size="small" icon="el-icon-check">编辑</el-button>
<el-button type="danger" size="small" icon="el-icon-delete">删除</el-button>
<button class="action-btn edit-btn" @click="handleEdit">
<img src="@/assets/images/xiugai.png" alt="编辑" class="action-icon" />
</button>
<button class="action-btn delete-btn" @click="handleDelete">
<img src="@/assets/images/shanchu.png" alt="删除" class="action-icon" />
</button>
</div>
</div>
<div class="todo-item">
@ -149,13 +169,16 @@
<div class="todo-description">检查所有生产服务器的CPU、内存、磁盘使用率，确保正常运行</div>
</div>
<div class="todo-actions">
<el-button type="primary" size="small" icon="el-icon-check">编辑</el-button>
<el-button type="danger" size="small" icon="el-icon-delete">删除</el-button>
<button class="action-btn edit-btn" @click="handleEdit">
<img src="@/assets/images/xiugai.png" alt="编辑" class="action-icon" />
</button>
<button class="action-btn delete-btn" @click="handleDelete">
<img src="@/assets/images/shanchu.png" alt="删除" class="action-icon" />
</button>
</div>
</div>
</div>
<!-- 状态图例 - 标签形式 -->
<!-- 状态图例 - 标签形式 -->
<div class="status-legend">
<span class="status-tag normal"><span class="color-block"></span>常规维护</span>
@ -328,6 +351,17 @@ const saveTask = () => {
closeDialog();
};
// 编辑和删除处理函数
const handleEdit = () => {
console.log('执行编辑操作');
// 保留原有编辑逻辑
};
const handleDelete = () => {
console.log('执行删除操作');
// 保留原有删除逻辑
};
const handleInspection1 = () => {
router.push('/rili/rili');
};
@ -578,37 +612,59 @@ const handleInspection7 = () => {
.todo-actions {
position: absolute;
right: -120px;
right: -80px;
top: 0;
bottom: 0;
display: flex;
align-items: center;
gap: 8px;
padding: 0 12px;
background-color: inherit;
opacity: 0;
transition: all 0.3s ease;
}
.todo-actions .el-button {
height: 100%;
border-radius: 0;
border-right: 1px solid #fff;
.action-btn {
width: 36px;
height: 36px;
border: none;
border-radius: 50%;
cursor: pointer;
display: flex;
align-items: center;
justify-content: center;
padding: 0;
background-color: #fff;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
transition: all 0.2s ease;
}
.todo-actions .el-button:last-child {
border-right: none;
}
.todo-item:hover .todo-content {
transform: translateX(-120px);
.action-btn:hover {
background-color: #f5f7fa;
transform: translateY(-1px);
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}
/* 悬停显示操作按钮 */
.todo-item:hover .todo-actions {
opacity: 1;
right: 0;
}
.todo-actions .el-button {
padding: 4px 8px;
min-width: auto;
font-size: 12px;
/* 内容区域平移以给按钮留出空间 */
.todo-item:hover .todo-content {
transform: translateX(-80px);
}
.action-icon {
width: 16px;
height: 16px;
object-fit: contain;
}
/* 调整按钮间距 */
.todo-actions {
gap: 12px;
}
.status-legend {