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

BIN
src/assets/images/baoxiu.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
src/assets/images/baoxiushijian.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

BIN
src/assets/images/baoxiuwancheng.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.0 KiB

BIN
src/assets/images/qiangxiu.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
src/assets/images/qiangxiushijian.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

BIN
src/assets/images/qiangxiuwancheng.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
src/assets/images/shanchu.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 498 B

BIN
src/assets/images/weibaoxiu.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.0 KiB

BIN
src/assets/images/weiqiangxiu.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
src/assets/images/xiugai.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 498 B

5
src/views/zhinengxunjian/InspectionManagement.vue
View File

@ -69,13 +69,12 @@
<el-table-column align="center" prop="responsible" label="负责人" style="width: 14.2%"></el-table-column> <el-table-column align="center" prop="responsible" label="负责人" style="width: 14.2%"></el-table-column>
<el-table-column align="center" label="操作" style="width: 14.2%" fixed="right"> <el-table-column align="center" label="操作" style="width: 14.2%" fixed="right">
<template #default="scope"> <template #default="scope">
<el-button type="text" @click="handleEdit(scope.row)" size="small" class="action-btn">编辑</el-button> <el-button type="text" @click="handleEdit(scope.row)" class="action-btn">编辑</el-button>
<el-button type="text" @click="handleDetail(scope.row)" size="small" class="action-btn">详情</el-button> <el-button type="text" @click="handleDetail(scope.row)" class="action-btn">详情</el-button>
<el-button <el-button
type="text" type="text"
:disabled="scope.row.status === 'disabled'" :disabled="scope.row.status === 'disabled'"
@click="handleEnable(scope.row)" @click="handleEnable(scope.row)"
size="small"
class="action-btn" class="action-btn"
:class="{ 'text-success': scope.row.status === 'disabled' }" :class="{ 'text-success': scope.row.status === 'disabled' }"
> >

48
src/views/zhinengxunjian/baoxiujilu.vue
View File

@ -72,7 +72,7 @@
<p class="stat-trend up">较上月 +4.2%</p> <p class="stat-trend up">较上月 +4.2%</p>
</div> </div>
<div class="stat-icon"> <div class="stat-icon">
<i class="el-icon-file-text"></i> <img src="@/assets/images/baoxiu.png" alt="本月报修数" class="stat-image" />
</div> </div>
</div> </div>
@ -83,7 +83,7 @@
<p class="stat-trend down">较上月 -0.6小时</p> <p class="stat-trend down">较上月 -0.6小时</p>
</div> </div>
<div class="stat-icon"> <div class="stat-icon">
<i class="el-icon-clock"></i> <img src="@/assets/images/baoxiushijian.png" alt="平均处理时长" class="stat-image" />
</div> </div>
</div> </div>
@ -94,7 +94,7 @@
<p class="stat-trend warning">需及时处理</p> <p class="stat-trend warning">需及时处理</p>
</div> </div>
<div class="stat-icon warning"> <div class="stat-icon warning">
<i class="el-icon-alarm-clock"></i> <img src="@/assets/images/weibaoxiu.png" alt="待处理报修" class="stat-image" />
</div> </div>
</div> </div>
@ -105,7 +105,7 @@
<p class="stat-trend up">较上月 +2.1%</p> <p class="stat-trend up">较上月 +2.1%</p>
</div> </div>
<div class="stat-icon success"> <div class="stat-icon success">
<i class="el-icon-check-circle"></i> <img src="@/assets/images/baoxiuwancheng.png" alt="完成率" class="stat-image" />
</div> </div>
</div> </div>
</div> </div>
@ -113,22 +113,22 @@
<!-- 报修记录表格 --> <!-- 报修记录表格 -->
<div class="table-container"> <div class="table-container">
<el-table :data="filteredRecords" border style="width: 100%" class="record-table"> <el-table :data="filteredRecords" border style="width: 100%" class="record-table">
<el-table-column prop="reportNo" label="报修单号" width="140"></el-table-column> <el-table-column align="center" prop="reportNo" label="报修单号" min-width="120"></el-table-column>
<el-table-column prop="content" label="报修内容"></el-table-column> <el-table-column align="center" prop="content" label="报修内容" min-width="200"></el-table-column>
<el-table-column prop="reporter" label="报修人" width="100"></el-table-column> <el-table-column align="center" prop="reporter" label="报修人" min-width="90"></el-table-column>
<el-table-column prop="reportTime" label="报修时间" width="160"></el-table-column> <el-table-column align="center" prop="reportTime" label="报修时间" min-width="150"></el-table-column>
<el-table-column prop="handler" label="处理人员" width="100"></el-table-column> <el-table-column align="center" prop="handler" label="处理人员" min-width="90"></el-table-column>
<el-table-column prop="status" label="处理状态" width="100"> <el-table-column align="center" prop="status" label="处理状态" min-width="90">
<template #default="scope"> <template #default="scope">
<span :class="`status-tag ${scope.row.statusClass}`">{{ scope.row.status }}</span> <span :class="`status-tag ${scope.row.statusClass}`">{{ scope.row.status }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="handleTime" label="处理时间" width="160"></el-table-column> <el-table-column align="center" prop="handleTime" label="处理时间" min-width="150"></el-table-column>
<el-table-column prop="result" label="维修结果"></el-table-column> <el-table-column align="center" prop="result" label="维修结果" min-width="180"></el-table-column>
<el-table-column label="操作" width="160"> <el-table-column align="center" label="操作" min-width="140">
<template #default="scope"> <template #default="scope">
<el-button type="text" size="small" class="detail-btn" @click="handleDetail(scope.row)"> 详情 </el-button> <el-button type="text" class="detail-btn" @click="handleDetail(scope.row)"> 详情 </el-button>
<el-button type="text" size="small" :class="scope.row.actionClass" @click="handleAction(scope.row)"> <el-button type="text" :class="scope.row.actionClass" @click="handleAction(scope.row)">
{{ scope.row.actionText }} {{ scope.row.actionText }}
</el-button> </el-button>
</template> </template>
@ -539,25 +539,19 @@ const handleInspection7 = () => {
} }
.stat-icon { .stat-icon {
width: 48px; width: 55px;
height: 48px; height: 55px;
border-radius: 50%; border-radius: 50%;
background-color: #e8f3ff; background-color: #e8f3ff;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
color: #165dff;
font-size: 24px;
} }
.stat-icon.warning { .stat-image {
background-color: #fff7e6; width: 45px;
color: #fa8c16; height: 45px;
} object-fit: contain;
.stat-icon.success {
background-color: #f6ffed;
color: #52c41a;
} }
/* 表格样式 */ /* 表格样式 */

14
src/views/zhinengxunjian/gongdanliebiao.vue
View File

@ -92,8 +92,8 @@
</el-table-column> </el-table-column>
<el-table-column align="center" label="操作" min-width="180" fixed="right"> <el-table-column align="center" label="操作" min-width="180" fixed="right">
<template #default="scope"> <template #default="scope">
<el-button type="text" @click="handleViewDetail(scope.row)" size="small" class="action-btn">查看详情</el-button> <el-button type="text" @click="handleViewDetail(scope.row)" class="action-btn">查看详情</el-button>
<el-button type="text" @click="handleEvaluate(scope.row)" size="small" class="action-btn">评价</el-button> <el-button type="text" @click="handleEvaluate(scope.row)" class="action-btn">评价</el-button>
<el-button <el-button
type="text" type="text"
@click="handleCancel(scope.row)" @click="handleCancel(scope.row)"
@ -103,12 +103,8 @@
> >
取消 取消
</el-button> </el-button>
<el-button type="text" @click="handleCommunicate(scope.row)" size="small" class="action-btn" v-if="scope.row.status === '执行中'"> <el-button type="text" @click="handleCommunicate(scope.row)" class="action-btn" v-if="scope.row.status === '执行中'"> 沟通 </el-button>
沟通 <el-button type="text" @click="handleArchive(scope.row)" class="action-btn" v-if="scope.row.status === '已完成'"> 归档 </el-button>
</el-button>
<el-button type="text" @click="handleArchive(scope.row)" size="small" class="action-btn" v-if="scope.row.status === '已完成'">
归档
</el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>
@ -203,7 +199,7 @@
<el-input v-model="createForm.resultDescription" type="textarea" :rows="3" placeholder="请描述该工单完成后预期达成的成果" /> <el-input v-model="createForm.resultDescription" type="textarea" :rows="3" placeholder="请描述该工单完成后预期达成的成果" />
</el-form-item> </el-form-item>
<el-form-item label="需要执行人？*" prop="needAssignee"> <el-form-item label="是否需要执行人" prop="needAssignee">
<el-radio-group v-model="createForm.needAssignee"> <el-radio-group v-model="createForm.needAssignee">
<el-radio label="true">是，指定执行人</el-radio> <el-radio label="true">是，指定执行人</el-radio>
<el-radio label="false">否，由系统分配</el-radio> <el-radio label="false">否，由系统分配</el-radio>

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

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

6
src/views/zhinengxunjian/paidanjilu.vue
View File

@ -115,11 +115,10 @@
</el-table-column> </el-table-column>
<el-table-column align="center" label="操作" min-width="180" fixed="right"> <el-table-column align="center" label="操作" min-width="180" fixed="right">
<template #default="scope"> <template #default="scope">
<el-button type="text" @click="handleViewDetails(scope.row)" size="small" class="action-btn">详情</el-button> <el-button type="text" @click="handleViewDetails(scope.row)" class="action-btn">详情</el-button>
<el-button <el-button
type="text" type="text"
@click="handleViewReport(scope.row)" @click="handleViewReport(scope.row)"
size="small"
class="action-btn report-btn" class="action-btn report-btn"
v-if="scope.row.completionStatus === '已完成'" v-if="scope.row.completionStatus === '已完成'"
> >
@ -128,13 +127,12 @@
<el-button <el-button
type="text" type="text"
@click="handleViewProgress(scope.row)" @click="handleViewProgress(scope.row)"
size="small"
class="action-btn progress-btn" class="action-btn progress-btn"
v-else-if="scope.row.completionStatus === '进行中'" v-else-if="scope.row.completionStatus === '进行中'"
> >
查看进度 查看进度
</el-button> </el-button>
<el-button type="text" @click="handleTrack(scope.row)" size="small" class="action-btn track-btn" v-else> 跟踪 </el-button> <el-button type="text" @click="handleTrack(scope.row)" class="action-btn track-btn" v-else> 跟踪 </el-button>
</template> </template>
</el-table-column> </el-table-column>
</el-table> </el-table>

50
src/views/zhinengxunjian/qiangxiujilu.vue
View File

@ -79,7 +79,7 @@
<p class="stat-trend up">较上月 +8.7%</p> <p class="stat-trend up">较上月 +8.7%</p>
</div> </div>
<div class="stat-icon"> <div class="stat-icon">
<i class="el-icon-warning-outline"></i> <img src="@/assets/images/qiangxiu.png" alt="本月抢修总数" class="stat-image" />
</div> </div>
</div> </div>
@ -90,7 +90,7 @@
<p class="stat-trend down">较上月 -2.5分钟</p> <p class="stat-trend down">较上月 -2.5分钟</p>
</div> </div>
<div class="stat-icon"> <div class="stat-icon">
<i class="el-icon-clock"></i> <img src="@/assets/images/qiangxiushijian.png" alt="平均抢修时长" class="stat-image" />
</div> </div>
</div> </div>
@ -101,7 +101,7 @@
<p class="stat-trend warning">需要尽快处理</p> <p class="stat-trend warning">需要尽快处理</p>
</div> </div>
<div class="stat-icon warning"> <div class="stat-icon warning">
<i class="el-icon-alarm"></i> <img src="@/assets/images/weiqiangxiu.png" alt="待处理抢修" class="stat-image" />
</div> </div>
</div> </div>
@ -112,7 +112,7 @@
<p class="stat-trend up">较上月 +2.4%</p> <p class="stat-trend up">较上月 +2.4%</p>
</div> </div>
<div class="stat-icon success"> <div class="stat-icon success">
<i class="el-icon-check-circle"></i> <img src="@/assets/images/qiangxiuwancheng.png" alt="按时完成率" class="stat-image" />
</div> </div>
</div> </div>
</div> </div>
@ -120,26 +120,26 @@
<!-- 抢修记录表格 --> <!-- 抢修记录表格 -->
<div class="table-container"> <div class="table-container">
<el-table :data="repairRecords" border style="width: 100%" class="record-table"> <el-table :data="repairRecords" border style="width: 100%" class="record-table">
<el-table-column prop="reportNo" label="抢修单号" width="140"></el-table-column> <el-table-column align="center" prop="reportNo" label="抢修单号" min-width="120"></el-table-column>
<el-table-column prop="content" label="抢修内容"></el-table-column> <el-table-column align="center" prop="content" label="抢修内容" min-width="200"></el-table-column>
<el-table-column prop="reporter" label="报修人" width="100"></el-table-column> <el-table-column align="center" prop="reporter" label="报修人" min-width="80"></el-table-column>
<el-table-column prop="reportTime" label="报修时间" width="160"></el-table-column> <el-table-column align="center" prop="reportTime" label="报修时间" min-width="140"></el-table-column>
<el-table-column prop="handler" label="抢修人员" width="100"></el-table-column> <el-table-column align="center" prop="handler" label="抢修人员" min-width="80"></el-table-column>
<el-table-column prop="priority" label="紧急程度" width="100"> <el-table-column align="center" prop="priority" label="紧急程度" min-width="80">
<template #default="scope"> <template #default="scope">
<span :class="`priority-tag ${scope.row.priorityClass}`">{{ scope.row.priority }}</span> <span :class="`priority-tag ${scope.row.priorityClass}`">{{ scope.row.priority }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="status" label="处理状态" width="100"> <el-table-column align="center" prop="status" label="处理状态" min-width="80">
<template #default="scope"> <template #default="scope">
<span :class="`status-tag ${scope.row.statusClass}`">{{ scope.row.status }}</span> <span :class="`status-tag ${scope.row.statusClass}`">{{ scope.row.status }}</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="duration" label="处理时长" width="100"></el-table-column> <el-table-column align="center" prop="duration" label="处理时长" min-width="80"></el-table-column>
<el-table-column label="操作" width="140"> <el-table-column align="center" label="操作" min-width="120">
<template #default="scope"> <template #default="scope">
<el-button type="text" size="small" class="detail-btn" @click="handleDetail(scope.row)"> 详情 </el-button> <el-button type="text" class="detail-btn" @click="handleDetail(scope.row)"> 详情 </el-button>
<el-button type="text" size="small" :class="scope.row.actionClass" @click="handleAction(scope.row)"> <el-button type="text" :class="scope.row.actionClass" @click="handleAction(scope.row)">
{{ scope.row.actionText }} {{ scope.row.actionText }}
</el-button> </el-button>
</template> </template>
@ -535,28 +535,20 @@ const handleInspectionManagement2 = () => {
} }
.stat-icon { .stat-icon {
width: 48px; width: 55px;
height: 48px; height: 55px;
border-radius: 50%; border-radius: 50%;
background-color: #ffebe6; background-color: #ffebe6;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
color: #ff4d4f;
font-size: 24px;
} }
.stat-icon.warning { .stat-image {
background-color: #fff7e6; width: 45px;
color: #fa8c16; height: 45px;
object-fit: contain;
} }
.stat-icon.success {
background-color: #f6ffed;
color: #52c41a;
}
/* 表格样式 */
.table-container { .table-container {
background-color: #fff; background-color: #fff;
border-radius: 8px; border-radius: 8px;

33
src/views/zhinengxunjian/shiyanguanli.vue
View File

@ -62,37 +62,37 @@
<!-- 5.1 巡检计划表格（与试验系统表格结构一致） --> <!-- 5.1 巡检计划表格（与试验系统表格结构一致） -->
<div v-if="activeTab === 'plan'" class="table-container"> <div v-if="activeTab === 'plan'" class="table-container">
<el-table :data="planTableData" border> <el-table :data="planTableData" border>
<el-table-column prop="name" label="计划名称" width="220"> <el-table-column align="center" prop="name" label="计划名称" width="220">
<template #default="scope"> <template #default="scope">
<div class="plan-name">{{ scope.row.name }}</div> <div class="plan-name">{{ scope.row.name }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="type" label="巡检类型" width="120"></el-table-column> <el-table-column align="center" prop="type" label="巡检类型" width="120"></el-table-column>
<el-table-column prop="cycle" label="巡检周期" width="120"></el-table-column> <el-table-column align="center" prop="cycle" label="巡检周期" width="120"></el-table-column>
<el-table-column prop="dateRange" label="执行时间范围"></el-table-column> <el-table-column align="center" prop="dateRange" label="执行时间范围"></el-table-column>
<el-table-column prop="progress" label="完成进度" width="120"> <el-table-column align="center" prop="progress" label="完成进度" width="120">
<template #default="scope"> <template #default="scope">
<div class="progress-bar"> <div class="progress-bar">
<div class="progress-fill" :style="{ width: scope.row.progress + '%', backgroundColor: getProgressColor(scope.row.status) }"></div> <div class="progress-fill" :style="{ width: scope.row.progress + '%', backgroundColor: getProgressColor(scope.row.status) }"></div>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="status" label="状态" width="100"> <el-table-column align="center" prop="status" label="状态" width="100">
<template #default="scope"> <template #default="scope">
<span :class="['status-tag', `status-${scope.row.status}`]"> <span :class="['status-tag', `status-${scope.row.status}`]">
{{ getStatusText(scope.row.status) }} {{ getStatusText(scope.row.status) }}
</span> </span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="responsible" label="负责人" width="120"></el-table-column> <el-table-column align="center" prop="responsible" label="负责人" width="120"></el-table-column>
<el-table-column label="操作" width="220"> <el-table-column align="center" label="操作" width="220">
<template #default="scope"> <template #default="scope">
<div class="operation-buttons"> <div class="operation-buttons">
<button class="operate-btn edit-btn" v-if="['drafted', 'paused'].includes(scope.row.status)">编辑</button> <el-button type="text" class="operate-btn edit-btn" v-if="['drafted', 'paused'].includes(scope.row.status)">编辑</el-button>
<button class="operate-btn execute-btn" v-if="scope.row.status === 'drafted'">执行</button> <el-button type="text" class="operate-btn execute-btn" v-if="scope.row.status === 'drafted'">执行</el-button>
<button class="operate-btn pause-btn" v-if="scope.row.status === 'in-progress'">暂停</button> <el-button type="text" class="operate-btn pause-btn" v-if="scope.row.status === 'in-progress'">暂停</el-button>
<button class="operate-btn resume-btn" v-if="scope.row.status === 'paused'">恢复</button> <el-button type="text" class="operate-btn resume-btn" v-if="scope.row.status === 'paused'">恢复</el-button>
<button class="operate-btn view-btn">查看详情</button> <el-button type="text" class="operate-btn view-btn">查看详情</el-button>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
@ -118,9 +118,9 @@
<el-table-column label="操作" width="180"> <el-table-column label="操作" width="180">
<template #default="scope"> <template #default="scope">
<div class="operation-buttons"> <div class="operation-buttons">
<button class="operate-btn accept-btn" v-if="scope.row.status === 'pending'">接受</button> <el-button type="text" class="operate-btn accept-btn" v-if="scope.row.status === 'pending'">接受</el-button>
<button class="operate-btn complete-btn" v-if="scope.row.status === 'accepted'">完成</button> <el-button type="text" class="operate-btn complete-btn" v-if="scope.row.status === 'accepted'">完成</el-button>
<button class="operate-btn view-btn">查看详情</button> <el-button type="text" class="operate-btn view-btn">查看详情</el-button>
</div> </div>
</template> </template>
</el-table-column> </el-table-column>
@ -990,6 +990,7 @@ const addEquipment = () => {
/* 9. 操作按钮样式（扩展试验系统） */ /* 9. 操作按钮样式（扩展试验系统） */
.operation-buttons { .operation-buttons {
display: flex; display: flex;
justify-content: center;
gap: 6px; gap: 6px;
flex-wrap: wrap; flex-wrap: wrap;
} }

9
src/views/zhinengxunjian/zhixingjilu.vue
View File

@ -180,7 +180,6 @@
<el-button <el-button
type="text" type="text"
@click="handleViewReport(scope.row)" @click="handleViewReport(scope.row)"
size="small"
class="action-btn" class="action-btn"
:class="{ :class="{
'report-btn': scope.row.inspectionResult !== '需整改', 'report-btn': scope.row.inspectionResult !== '需整改',
@ -682,12 +681,8 @@ const handleInspectionManagement3 = () => {
.el-step__icon.is-process { .el-step__icon.is-process {
background: linear-gradient(135deg, #165dff, #409eff); background: linear-gradient(135deg, #165dff, #409eff);
border: 3px solid rgba(255, 255, 255, 0.9); border: 3px solid rgba(255, 255, 255, 0.9);
box-shadow: box-shadow: 0 0 16px rgba(22, 93, 255, 0.4), 0 4px 12px rgba(22, 93, 255, 0.2);
0 0 16px rgba(22, 93, 255, 0.4), animation: pulse 2s infinite, float 6s ease-in-out infinite;
0 4px 12px rgba(22, 93, 255, 0.2);
animation:
pulse 2s infinite,
float 6s ease-in-out infinite;
transform: scale(1.05); transform: scale(1.05);
} }