diff --git a/src/App.vue b/src/App.vue
index 6840556..9d7526b 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -25,8 +25,8 @@ export default {
     return {
       // WebSocket相关
       websocket: null,
-      // websocketUrl: 'ws://10.42.0.1:7181/ws',
-      websocketUrl: 'ws://119.45.202.115:7181/ws',
+      websocketUrl: 'ws://10.42.0.1:7181/ws',
+      // websocketUrl: 'ws://119.45.202.115:7181/ws',
       isWebSocketConnected: false,
       reconnectTimer: null,
       reconnectAttempts: 0,
diff --git a/src/views/ems/info/dailyFaultRecord/index.vue b/src/views/ems/info/dailyFaultRecord/index.vue
index 460d7bb..297923c 100644
--- a/src/views/ems/info/dailyFaultRecord/index.vue
+++ b/src/views/ems/info/dailyFaultRecord/index.vue
@@ -17,7 +17,7 @@
                                     @keyup.enter.native="handleQuery"
                             />
                         </el-form-item>
-                        <el-form-item label="当日值班长" prop="dailyDutySupervisor">
+                        <el-form-item label="科室值班" prop="dailyDutySupervisor">
                             <el-input
                                     v-model="queryParams.dailyDutySupervisor"
                                     placeholder="请输入当日值班长"
@@ -25,7 +25,7 @@
                                     @keyup.enter.native="handleQuery"
                             />
                         </el-form-item>
-                        <el-form-item label="天达当日值班长" prop="tendaDailyDutySupervisor">
+                        <el-form-item label="外包值班" prop="tendaDailyDutySupervisor">
                             <el-input
                                     v-model="queryParams.tendaDailyDutySupervisor"
                                     placeholder="请输入天达当日值班长"
@@ -89,6 +89,15 @@
             </el-form-item>
         </el-form> -->
 
+        <!-- 操作提示 -->
+        <!-- <el-alert
+            title="提示：可以在表格行上右击查看详细信息，或点击操作列的详情按钮"
+            type="info"
+            :closable="false"
+            show-icon
+            style="margin-bottom: 10px;"
+        /> -->
+
         <el-row :gutter="10" class="mb8">
             <el-col :span="1.5">
                 <el-button
@@ -145,21 +154,40 @@
             <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
         </el-row>
 
-        <el-table v-loading="loading" :data="dailyFaultRecordList" @selection-change="handleSelectionChange">
+        <el-table
+            v-loading="loading"
+            :data="dailyFaultRecordList"
+            @selection-change="handleSelectionChange"
+            @row-contextmenu="handleRowContextMenu"
+            class="fault-record-table"
+            tooltip-effect="dark"
+            :header-cell-style="{ backgroundColor: '#f5f7fa', color: '#606266' }"
+        >
             <el-table-column type="selection" width="55" align="center" />
-                    <el-table-column label="主键，自增ID" align="center" prop="id" v-if="columns[0].visible"/>
-                    <el-table-column label="日期" align="center" prop="date" v-if="columns[1].visible"/>
-                    <el-table-column label="位置" align="center" prop="location" v-if="columns[2].visible"/>
-                    <el-table-column label="当日值班长" align="center" prop="dailyDutySupervisor" v-if="columns[3].visible"/>
-                    <el-table-column label="天达当日值班长" align="center" prop="tendaDailyDutySupervisor" v-if="columns[4].visible"/>
-                    <el-table-column label="故障情况" align="center" prop="faultSituation" v-if="columns[5].visible"/>
-                    <el-table-column label="处置措施" align="center" prop="handlingMeasures" v-if="columns[6].visible"/>
-                    <el-table-column label="故障类型" align="center" prop="faultType" v-if="columns[7].visible"/>
-                    <el-table-column label="故障发生时间" align="center" prop="faultOccurrenceTime" v-if="columns[8].visible"/>
-                    <el-table-column label="处置完毕时间" align="center" prop="handlingCompletionTime" v-if="columns[9].visible"/>
-                    <el-table-column label="处置时长" align="center" prop="handlingDuration" v-if="columns[10].visible"/>
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100">
+            <el-table-column label="序号" align="center" width="60" v-if="columns[0].visible">
                 <template slot-scope="scope">
+                    {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
+                </template>
+            </el-table-column>
+            <el-table-column label="日期" align="center" prop="date" v-if="columns[1].visible"/>
+            <el-table-column label="位置" align="center" prop="location" v-if="columns[2].visible"/>
+            <el-table-column label="科室值班" align="center" prop="dailyDutySupervisor" v-if="columns[3].visible"/>
+            <el-table-column label="外包值班" align="center" prop="tendaDailyDutySupervisor" v-if="columns[4].visible"/>
+            <el-table-column label="故障情况" align="center" prop="faultSituation" v-if="columns[5].visible" show-overflow-tooltip/>
+            <el-table-column label="处置措施" align="center" prop="handlingMeasures" v-if="columns[6].visible" show-overflow-tooltip/>
+            <el-table-column label="故障类型" align="center" prop="faultType" v-if="columns[7].visible"/>
+            <el-table-column label="故障发生时间" align="center" prop="faultOccurrenceTime" v-if="columns[8].visible"/>
+            <el-table-column label="处置完毕时间" align="center" prop="handlingCompletionTime" v-if="columns[9].visible"/>
+            <el-table-column label="处置时长" align="center" prop="handlingDuration" v-if="columns[10].visible"/>
+            <el-table-column label="备注" align="center" prop="remarks" v-if="columns[11].visible" show-overflow-tooltip/>
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="150">
+                <template slot-scope="scope">
+                    <el-button
+                            size="mini"
+                            type="text"
+                            icon="el-icon-view"
+                            @click="handleViewDetail(scope.row)"
+                    >详情</el-button>
                     <el-button
                             size="mini"
                             type="text"
@@ -186,7 +214,7 @@
                 @pagination="getList"
         />
 
-        <!-- 添加或修改日常故障记录对话框 -->
+        <!-- 添加  或修改  日常故障记录对话框 -->
         <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
             <el-form ref="form" :model="form" :rules="rules" label-width="100px">
                                 <el-form-item label="日期" prop="date">
@@ -201,10 +229,10 @@
                                 <el-form-item label="位置" prop="location">
                                     <el-input v-model="form.location" placeholder="请输入位置" />
                                 </el-form-item>
-                                <el-form-item label="当日值班长" prop="dailyDutySupervisor">
+                                <el-form-item label="科室值班" prop="dailyDutySupervisor">
                                     <el-input v-model="form.dailyDutySupervisor" placeholder="请输入当日值班长" />
                                 </el-form-item>
-                                <el-form-item label="天达当日值班长" prop="tendaDailyDutySupervisor">
+                                <el-form-item label="外包值班" prop="tendaDailyDutySupervisor">
                                     <el-input v-model="form.tendaDailyDutySupervisor" placeholder="请输入天达当日值班长" />
                                 </el-form-item>
                                 <el-form-item label="故障情况" prop="faultSituation">
@@ -233,7 +261,10 @@
                                     />
                                 </el-form-item>
                                 <el-form-item label="处置时长" prop="handlingDuration">
-                                    <el-input v-model="form.handlingDuration" placeholder="自动计算" disabled />
+                                    <el-input v-model="form.handlingDuration" placeholder="由系统自动计算" disabled />
+                                </el-form-item>
+                                <el-form-item label="备注" prop="remarks">
+                                    <el-input v-model="form.remarks" type="textarea" :rows="3" placeholder="请输入备注" />
                                 </el-form-item>
             </el-form>
             <div slot="footer" class="dialog-footer">
@@ -271,11 +302,89 @@
                 <el-button @click="upload.open = false">取 消</el-button>
             </div>
         </el-dialog>
+
+        <!-- 详情抽屉 -->
+        <el-drawer
+            title="故障记录详情"
+            :visible.sync="detailDrawer"
+            direction="rtl"
+            size="500px"
+            :before-close="handleDetailClose"
+        >
+            <div class="detail-content" v-if="currentRecord">
+                <el-descriptions :column="1" border>
+                    <el-descriptions-item label="记录ID">
+                        <span>{{ currentRecord.id }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="日期">
+                        <span>{{ currentRecord.date }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="位置">
+                        <span>{{ currentRecord.location || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="科室值班">
+                        <span>{{ currentRecord.dailyDutySupervisor || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="外包值班">
+                        <span>{{ currentRecord.tendaDailyDutySupervisor || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="故障类型">
+                        <span>{{ currentRecord.faultType || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="故障发生时间">
+                        <span>{{ currentRecord.faultOccurrenceTime || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="处置完毕时间">
+                        <span>{{ currentRecord.handlingCompletionTime || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="处置时长">
+                        <span>{{ currentRecord.handlingDuration || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="故障情况">
+                        <div class="detail-text-content">
+                            {{ currentRecord.faultSituation || '暂无' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="处置措施">
+                        <div class="detail-text-content">
+                            {{ currentRecord.handlingMeasures || '暂无' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="备注">
+                        <div class="detail-text-content">
+                            {{ currentRecord.remarks || '暂无' }}
+                        </div>
+                    </el-descriptions-item>
+                </el-descriptions>
+            </div>
+        </el-drawer>
+
+        <!-- 右击菜单 -->
+        <ul
+            v-show="contextMenuVisible"
+            :style="contextMenuStyle"
+            class="context-menu"
+            @click.stop
+        >
+            <li @click="handleViewDetail(contextMenuRow)">
+                <i class="el-icon-view"></i>
+                查看详情
+            </li>
+<!--            <li @click="handleUpdate(contextMenuRow)" v-if="checkPermission(['ems/info:dailyFaultRecord:edit'])">-->
+<!--                <i class="el-icon-edit"></i>-->
+<!--                修改记录-->
+<!--            </li>-->
+<!--            <li @click="handleDelete(contextMenuRow)" v-if="checkPermission(['ems/info:dailyFaultRecord:remove'])">-->
+<!--                <i class="el-icon-delete"></i>-->
+<!--                删除记录-->
+<!--            </li>-->
+        </ul>
     </div>
 </template>
 
 <script>
     import { listDailyFaultRecord, getDailyFaultRecord, delDailyFaultRecord, addDailyFaultRecord, updateDailyFaultRecord } from "@/api/ems/info/dailyFaultRecord";
+    import { checkPermi } from "@/utils/permission";
 
     export default {
         name: "DailyFaultRecord",
@@ -312,7 +421,8 @@
                                 faultType: null,
                                 faultOccurrenceTime: null,
                                 handlingCompletionTime: null,
-                                handlingDuration: null
+                                handlingDuration: null,
+                                remarks: null
                 },
                 // 表单参数
                 form: {},
@@ -323,17 +433,18 @@
                     ],
                 },
                 columns: [
-                        { key: 0, label: `主键，自增ID`, visible: false },
+                        { key: 0, label: `序号`, visible: true },
                         { key: 1, label: `日期`, visible: true },
                         { key: 2, label: `位置`, visible: true },
-                        { key: 3, label: `当日值班长`, visible: true },
-                        { key: 4, label: `天达当日值班长`, visible: true },
+                        { key: 3, label: `科室值班`, visible: true },
+                        { key: 4, label: `外包值班`, visible: true },
                         { key: 5, label: `故障情况`, visible: true },
                         { key: 6, label: `处置措施`, visible: true },
                         { key: 7, label: `故障类型`, visible: true },
                         { key: 8, label: `故障发生时间`, visible: true },
                         { key: 9, label: `处置完毕时间`, visible: true },
                         { key: 10, label: `处置时长`, visible: true },
+                        { key: 11, label: `备注`, visible: true },
                 ],
                 upload: {
                     title: "导入日常故障记录",
@@ -342,7 +453,19 @@
                     updateSupport: false,
                     isUploading: false,
                     headers: {}
-                }
+                },
+                // 详情抽屉相关
+                detailDrawer: false,
+                currentRecord: null,
+                // 右击菜单相关
+                contextMenuVisible: false,
+                contextMenuStyle: {
+                    position: 'fixed',
+                    zIndex: 1000,
+                    left: '0px',
+                    top: '0px'
+                },
+                contextMenuRow: null
             };
         },
         created() {
@@ -350,13 +473,13 @@
             this.upload.url = process.env.VUE_APP_BASE_API + "/ems/info/dailyFaultRecord/importData";
             this.upload.headers = { Authorization: "Bearer " + this.$store.getters.token };
         },
-        watch: {
-            'form.faultOccurrenceTime'(newVal) {
-                this.calculateHandlingDuration();
-            },
-            'form.handlingCompletionTime'(newVal) {
-                this.calculateHandlingDuration();
-            },
+        mounted() {
+            // 添加  全局点击事件监听，用于隐藏右击菜单
+            document.addEventListener('click', this.hideContextMenu);
+        },
+        beforeDestroy() {
+            // 移除全局点击事件监听
+            document.removeEventListener('click', this.hideContextMenu);
         },
         methods: {
             /** 查询日常故障记录列表 */
@@ -386,7 +509,8 @@
                                 faultType: null,
                                 faultOccurrenceTime: null,
                                 handlingCompletionTime: null,
-                                handlingDuration: null
+                                handlingDuration: null,
+                                remarks: null
                 };
                 this.resetForm("form");
             },
@@ -410,16 +534,16 @@
             handleAdd() {
                 this.reset();
                 this.open = true;
-                this.title = "添加日常故障记录";
+                this.title = "添加  日常故障记录";
             },
-            /** 修改按钮操作 */
+            /** 修改  按钮操作 */
             handleUpdate(row) {
                 this.reset();
                 const id = row.id || this.ids
                 getDailyFaultRecord(id).then(response => {
                     this.form = response.data;
                     this.open = true;
-                    this.title = "修改日常故障记录";
+                    this.title = "修改  日常故障记录";
                 });
             },
             /** 提交按钮 */
@@ -484,21 +608,172 @@
     submitFileForm() {
         this.$refs.upload.submit();
     },
-    calculateHandlingDuration() {
-        if (this.form.faultOccurrenceTime && this.form.handlingCompletionTime) {
-            const startTime = new Date(`2023-01-01T${this.form.faultOccurrenceTime}`);
-            const endTime = new Date(`2023-01-01T${this.form.handlingCompletionTime}`);
-            if (!isNaN(startTime.getTime()) && !isNaN(endTime.getTime()) && endTime > startTime) {
-                const durationMs = endTime - startTime;
-                const durationSeconds = Math.floor(durationMs / 1000);
-                this.form.handlingDuration = `${durationSeconds} 秒`;
-            } else {
-                this.form.handlingDuration = '无效时间';
-            }
-        } else {
-            this.form.handlingDuration = '';
-        }
-    },
+            /** 查看详情 */
+            handleViewDetail(row) {
+                this.currentRecord = row;
+                this.detailDrawer = true;
+                this.hideContextMenu();
+            },
+            /** 关闭详情抽屉 */
+            handleDetailClose() {
+                this.currentRecord = null;
+                this.detailDrawer = false;
+            },
+            /** 处理行右击事件 */
+            handleRowContextMenu(row, column, event) {
+                event.preventDefault();
+                this.contextMenuRow = row;
+
+                // 设置右击菜单位置，考虑边界情况
+                this.$nextTick(() => {
+                    const menuWidth = 120; // 菜单宽度
+                    const menuHeight = 120; // 菜单高度
+                    const windowWidth = window.innerWidth;
+                    const windowHeight = window.innerHeight;
+
+                    let left = event.clientX;
+                    let top = event.clientY;
+
+                    // 防止菜单超出右边界
+                    if (left + menuWidth > windowWidth) {
+                        left = windowWidth - menuWidth - 10;
+                    }
+
+                    // 防止菜单超出下边界
+                    if (top + menuHeight > windowHeight) {
+                        top = windowHeight - menuHeight - 10;
+                    }
+
+                    this.contextMenuStyle.left = left + 'px';
+                    this.contextMenuStyle.top = top + 'px';
+                    this.contextMenuVisible = true;
+                });
+            },
+            /** 隐藏右击菜单 */
+            hideContextMenu() {
+                this.contextMenuVisible = false;
+                this.contextMenuRow = null;
+            },
+            /** 检查权限 */
+            checkPermission(permissions) {
+                return checkPermi(permissions);
+            },
     }
     };
 </script>
+
+<style scoped>
+/* 右击菜单样式 */
+.context-menu {
+    position: fixed;
+    z-index: 1000;
+    background-color: #fff;
+    border: 1px solid #e4e7ed;
+    border-radius: 4px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    padding: 5px 0;
+    margin: 0;
+    list-style: none;
+    min-width: 120px;
+}
+
+.context-menu li {
+    padding: 8px 16px;
+    cursor: pointer;
+    font-size: 14px;
+    color: #606266;
+    display: flex;
+    align-items: center;
+    transition: background-color 0.3s;
+}
+
+.context-menu li:hover {
+    background-color: #f5f7fa;
+    color: #409eff;
+}
+
+.context-menu li i {
+    margin-right: 8px;
+    font-size: 14px;
+}
+
+/* 详情内容样式 */
+.detail-content {
+    padding: 20px;
+}
+
+.detail-text-content {
+    max-height: 200px;
+    overflow-y: auto;
+    word-wrap: break-word;
+    word-break: break-all;
+    line-height: 1.6;
+    padding: 8px;
+    background-color: #f8f9fa;
+    border-radius: 4px;
+    border: 1px solid #e9ecef;
+}
+
+/* 表格行悬停效果 */
+.fault-record-table .el-table__row {
+    transition: background-color 0.3s;
+}
+
+.fault-record-table .el-table__row:hover {
+    cursor: context-menu;
+    background-color: #f0f9ff !important;
+}
+
+/* 表格样式优化 */
+.fault-record-table {
+    border-radius: 4px;
+    overflow: hidden;
+}
+
+.fault-record-table .el-table__header-wrapper {
+    border-radius: 4px 4px 0 0;
+}
+
+/* 描述列表样式优化 */
+.detail-content .el-descriptions {
+    margin-top: 0;
+}
+
+.detail-content .el-descriptions-item__label {
+    font-weight: 600;
+    color: #303133;
+    width: 90px;
+}
+
+.detail-content .el-descriptions-item__content {
+    color: #606266;
+}
+
+/* 响应式设计 */
+@media (max-width: 768px) {
+    .context-menu {
+        min-width: 100px;
+        font-size: 12px;
+    }
+
+    .context-menu li {
+        padding: 6px 12px;
+    }
+
+    .detail-content {
+        padding: 15px;
+    }
+
+    .detail-content .el-descriptions-item__label {
+        width: 80px;
+        font-size: 13px;
+    }
+}
+
+/* 打印样式 */
+@media print {
+    .context-menu {
+        display: none !important;
+    }
+}
+</style>
diff --git a/src/views/ems/info/faultHandlingRecord/index.vue b/src/views/ems/info/faultHandlingRecord/index.vue
index 3eea078..56e513c 100644
--- a/src/views/ems/info/faultHandlingRecord/index.vue
+++ b/src/views/ems/info/faultHandlingRecord/index.vue
@@ -111,21 +111,39 @@
             <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
         </el-row>
 
-        <el-table v-loading="loading" :data="faultHandlingRecordList" @selection-change="handleSelectionChange">
+        <el-table
+            v-loading="loading"
+            :data="faultHandlingRecordList"
+            @selection-change="handleSelectionChange"
+            @row-contextmenu="handleRowContextMenu"
+            class="fault-record-table"
+            tooltip-effect="dark"
+            :header-cell-style="{ backgroundColor: '#f5f7fa', color: '#606266' }"
+        >
             <el-table-column type="selection" width="55" align="center" />
-                    <el-table-column label="主键，自增ID" align="center" prop="id" v-if="columns[0].visible"/>
-                    <el-table-column label="故障日期" align="center" prop="faultDate" v-if="columns[1].visible"/>
-                    <el-table-column label="故障位置" align="center" prop="faultLocation" v-if="columns[2].visible"/>
-                    <el-table-column label="处理人员" align="center" prop="handlingPersonnel" v-if="columns[3].visible"/>
-                    <el-table-column label="故障现象及原因" align="center" prop="faultPhenomenonAndCause" v-if="columns[4].visible"/>
-                    <el-table-column label="故障情况处置" align="center" prop="faultSituationHandling" v-if="columns[5].visible"/>
-                    <el-table-column label="影响" align="center" prop="impact" v-if="columns[6].visible"/>
-                    <el-table-column label="故障发生时间" align="center" prop="faultOccurrenceTime" v-if="columns[7].visible"/>
-                    <el-table-column label="处置时长" align="center" prop="handlingDuration" v-if="columns[8].visible"/>
-                    <el-table-column label="维修更换的主要元器件" align="center" prop="mainComponentsRepaired" v-if="columns[9].visible"/>
-                    <el-table-column label="备注" align="center" prop="remarks" v-if="columns[10].visible"/>
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100">
+          <el-table-column label="序号" align="center" width="60" v-if="columns[0].visible">
+            <template slot-scope="scope">
+              {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
+            </template>
+          </el-table-column>
+            <el-table-column label="故障日期" align="center" prop="faultDate" v-if="columns[1].visible"/>
+            <el-table-column label="故障位置" align="center" prop="faultLocation" v-if="columns[2].visible"/>
+            <el-table-column label="处理人员" align="center" prop="handlingPersonnel" v-if="columns[3].visible"/>
+            <el-table-column label="故障现象及原因" align="center" prop="faultPhenomenonAndCause" v-if="columns[4].visible" show-overflow-tooltip/>
+            <el-table-column label="故障情况处置" align="center" prop="faultSituationHandling" v-if="columns[5].visible" show-overflow-tooltip/>
+            <el-table-column label="影响" align="center" prop="impact" v-if="columns[6].visible"/>
+            <el-table-column label="故障发生时间" align="center" prop="faultOccurrenceTime" v-if="columns[7].visible"/>
+            <el-table-column label="处置时长" align="center" prop="handlingDuration" v-if="columns[8].visible"/>
+            <el-table-column label="维修更换的主要元器件" align="center" prop="mainComponentsRepaired" v-if="columns[9].visible" show-overflow-tooltip/>
+            <el-table-column label="备注" align="center" prop="remarks" v-if="columns[10].visible" show-overflow-tooltip/>
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="150">
                 <template slot-scope="scope">
+                    <el-button
+                            size="mini"
+                            type="text"
+                            icon="el-icon-view"
+                            @click="handleViewDetail(scope.row)"
+                    >详情</el-button>
                     <el-button
                             size="mini"
                             type="text"
@@ -152,7 +170,7 @@
                 @pagination="getList"
         />
 
-        <!-- 添加或修改故障处置记录对话框 -->
+        <!-- 添加  或修改  故障处置记录对话框 -->
         <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
             <el-form ref="form" :model="form" :rules="rules" label-width="100px">
                                 <el-form-item label="故障日期" prop="faultDate">
@@ -232,11 +250,88 @@
                 <el-button @click="upload.open = false">取 消</el-button>
             </div>
         </el-dialog>
+
+        <!-- 详情抽屉 -->
+        <el-drawer
+            title="故障处置记录详情"
+            :visible.sync="detailDrawer"
+            direction="rtl"
+            size="500px"
+            :before-close="handleDetailClose"
+        >
+            <div class="detail-content" v-if="currentRecord">
+                <el-descriptions :column="1" border>
+                    <el-descriptions-item label="记录ID">
+                        <span>{{ currentRecord.id }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="故障日期">
+                        <span>{{ currentRecord.faultDate }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="故障位置">
+                        <span>{{ currentRecord.faultLocation || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="处理人员">
+                        <span>{{ currentRecord.handlingPersonnel || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="影响">
+                        <span>{{ currentRecord.impact || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="故障发生时间">
+                        <span>{{ currentRecord.faultOccurrenceTime || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="处置时长">
+                        <span>{{ currentRecord.handlingDuration || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="故障现象及原因">
+                        <div class="detail-text-content">
+                            {{ currentRecord.faultPhenomenonAndCause || '暂无' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="故障情况处置">
+                        <div class="detail-text-content">
+                            {{ currentRecord.faultSituationHandling || '暂无' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="维修更换的主要元器件">
+                        <div class="detail-text-content">
+                            {{ currentRecord.mainComponentsRepaired || '暂无' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="备注">
+                        <div class="detail-text-content">
+                            {{ currentRecord.remarks || '暂无' }}
+                        </div>
+                    </el-descriptions-item>
+                </el-descriptions>
+            </div>
+        </el-drawer>
+
+        <!-- 右击菜单 -->
+        <ul
+            v-show="contextMenuVisible"
+            :style="contextMenuStyle"
+            class="context-menu"
+            @click.stop
+        >
+            <li @click="handleViewDetail(contextMenuRow)">
+                <i class="el-icon-view"></i>
+                查看详情
+            </li>
+<!--            <li @click="handleUpdate(contextMenuRow)" v-if="checkPermission(['ems/info:faultHandlingRecord:edit'])">-->
+<!--                <i class="el-icon-edit"></i>-->
+<!--                修改记录-->
+<!--            </li>-->
+<!--            <li @click="handleDelete(contextMenuRow)" v-if="checkPermission(['ems/info:faultHandlingRecord:remove'])">-->
+<!--                <i class="el-icon-delete"></i>-->
+<!--                删除记录-->
+<!--            </li>-->
+        </ul>
     </div>
 </template>
 
 <script>
     import { listFaultHandlingRecord, getFaultHandlingRecord, delFaultHandlingRecord, addFaultHandlingRecord, updateFaultHandlingRecord } from "@/api/ems/info/faultHandlingRecord";
+    import { checkPermi } from "@/utils/permission";
 
     export default {
         name: "FaultHandlingRecord",
@@ -285,10 +380,10 @@
                     faultLocation: [
                         { required: true, message: "故障位置不能为空", trigger: "blur" }
                     ],
-            
+
                 },
                 columns: [
-                        { key: 0, label: `主键，自增ID`, visible: false },
+                        { key: 0, label: `序号`, visible: true },
                         { key: 1, label: `故障日期`, visible: true },
                         { key: 2, label: `故障位置`, visible: true },
                         { key: 3, label: `处理人员`, visible: true },
@@ -307,7 +402,19 @@
                     updateSupport: false,
                     isUploading: false,
                     headers: {}
-                }
+                },
+                // 详情抽屉相关
+                detailDrawer: false,
+                currentRecord: null,
+                // 右击菜单相关
+                contextMenuVisible: false,
+                contextMenuStyle: {
+                    position: 'fixed',
+                    zIndex: 1000,
+                    left: '0px',
+                    top: '0px'
+                },
+                contextMenuRow: null
             };
         },
         created() {
@@ -315,6 +422,12 @@
             this.upload.url = process.env.VUE_APP_BASE_API + "/ems/info/faultHandlingRecord/importData";
             this.upload.headers = { Authorization: "Bearer " + this.$store.getters.token };
         },
+        mounted() {
+            document.addEventListener('click', this.hideContextMenu);
+        },
+        beforeDestroy() {
+            document.removeEventListener('click', this.hideContextMenu);
+        },
         methods: {
             /** 查询故障处置记录列表 */
             getList() {
@@ -367,16 +480,16 @@
             handleAdd() {
                 this.reset();
                 this.open = true;
-                this.title = "添加故障处置记录";
+                this.title = "添加  故障处置记录";
             },
-            /** 修改按钮操作 */
+            /** 修改  按钮操作 */
             handleUpdate(row) {
                 this.reset();
                 const id = row.id || this.ids
                 getFaultHandlingRecord(id).then(response => {
                     this.form = response.data;
                     this.open = true;
-                    this.title = "修改故障处置记录";
+                    this.title = "修改  故障处置记录";
                 });
             },
             /** 提交按钮 */
@@ -440,7 +553,170 @@
     // 提交上传文件
     submitFileForm() {
         this.$refs.upload.submit();
-    }
+    },
+            /** 查看详情 */
+            handleViewDetail(row) {
+                this.currentRecord = row;
+                this.detailDrawer = true;
+                this.hideContextMenu();
+            },
+            /** 关闭详情抽屉 */
+            handleDetailClose() {
+                this.currentRecord = null;
+                this.detailDrawer = false;
+            },
+            /** 处理行右击事件 */
+            handleRowContextMenu(row, column, event) {
+                event.preventDefault();
+                this.contextMenuRow = row;
+
+                this.$nextTick(() => {
+                    const menuWidth = 120;
+                    const menuHeight = 120;
+                    const windowWidth = window.innerWidth;
+                    const windowHeight = window.innerHeight;
+
+                    let left = event.clientX;
+                    let top = event.clientY;
+
+                    if (left + menuWidth > windowWidth) {
+                        left = windowWidth - menuWidth - 10;
+                    }
+
+                    if (top + menuHeight > windowHeight) {
+                        top = windowHeight - menuHeight - 10;
+                    }
+
+                    this.contextMenuStyle.left = left + 'px';
+                    this.contextMenuStyle.top = top + 'px';
+                    this.contextMenuVisible = true;
+                });
+            },
+            /** 隐藏右击菜单 */
+            hideContextMenu() {
+                this.contextMenuVisible = false;
+                this.contextMenuRow = null;
+            },
+            /** 检查权限 */
+            checkPermission(permissions) {
+                return checkPermi(permissions);
+            },
     }
     };
 </script>
+
+<style scoped>
+/* 右击菜单样式 */
+.context-menu {
+    position: fixed;
+    z-index: 1000;
+    background-color: #fff;
+    border: 1px solid #e4e7ed;
+    border-radius: 4px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    padding: 5px 0;
+    margin: 0;
+    list-style: none;
+    min-width: 120px;
+}
+
+.context-menu li {
+    padding: 8px 16px;
+    cursor: pointer;
+    font-size: 14px;
+    color: #606266;
+    display: flex;
+    align-items: center;
+    transition: background-color 0.3s;
+}
+
+.context-menu li:hover {
+    background-color: #f5f7fa;
+    color: #409eff;
+}
+
+.context-menu li i {
+    margin-right: 8px;
+    font-size: 14px;
+}
+
+/* 详情内容样式 */
+.detail-content {
+    padding: 20px;
+}
+
+.detail-text-content {
+    max-height: 200px;
+    overflow-y: auto;
+    word-wrap: break-word;
+    word-break: break-all;
+    line-height: 1.6;
+    padding: 8px;
+    background-color: #f8f9fa;
+    border-radius: 4px;
+    border: 1px solid #e9ecef;
+}
+
+/* 表格行悬停效果 */
+.fault-record-table .el-table__row {
+    transition: background-color 0.3s;
+}
+
+.fault-record-table .el-table__row:hover {
+    cursor: context-menu;
+    background-color: #f0f9ff !important;
+}
+
+/* 表格样式优化 */
+.fault-record-table {
+    border-radius: 4px;
+    overflow: hidden;
+}
+
+.fault-record-table .el-table__header-wrapper {
+    border-radius: 4px 4px 0 0;
+}
+
+/* 描述列表样式优化 */
+.detail-content .el-descriptions {
+    margin-top: 0;
+}
+
+.detail-content .el-descriptions-item__label {
+    font-weight: 600;
+    color: #303133;
+    width: 90px;
+}
+
+.detail-content .el-descriptions-item__content {
+    color: #606266;
+}
+
+/* 响应式设计 */
+@media (max-width: 768px) {
+    .context-menu {
+        min-width: 100px;
+        font-size: 12px;
+    }
+
+    .context-menu li {
+        padding: 6px 12px;
+    }
+
+    .detail-content {
+        padding: 15px;
+    }
+
+    .detail-content .el-descriptions-item__label {
+        width: 80px;
+        font-size: 13px;
+    }
+}
+
+/* 打印样式 */
+@media print {
+    .context-menu {
+        display: none !important;
+    }
+}
+</style>
diff --git a/src/views/ems/info/plcBufferBatteryLifecycle/index.vue b/src/views/ems/info/plcBufferBatteryLifecycle/index.vue
index 37ef34c..ab34709 100644
--- a/src/views/ems/info/plcBufferBatteryLifecycle/index.vue
+++ b/src/views/ems/info/plcBufferBatteryLifecycle/index.vue
@@ -207,34 +207,52 @@
             <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
         </el-row>
 
-        <el-table v-loading="loading" :data="plcBufferBatteryLifecycleList" @selection-change="handleSelectionChange">
+        <el-table
+            v-loading="loading"
+            :data="plcBufferBatteryLifecycleList"
+            @selection-change="handleSelectionChange"
+            @row-contextmenu="handleRowContextMenu"
+            class="battery-lifecycle-table"
+            tooltip-effect="dark"
+            :header-cell-style="{ backgroundColor: '#f5f7fa', color: '#606266' }"
+        >
             <el-table-column type="selection" width="55" align="center" />
-                    <el-table-column label="主键，自增ID" align="center" prop="objid" v-if="columns[0].visible"/>
-                    <el-table-column label="类型" align="center" prop="type" v-if="columns[1].visible"/>
-                    <el-table-column label="安装柜体名称" align="center" prop="installationCabinetName" v-if="columns[2].visible"/>
-                    <el-table-column label="位置描述" align="center" prop="locationDescription" v-if="columns[3].visible"/>
-                    <el-table-column label="来源" align="center" prop="source" v-if="columns[4].visible"/>
-                    <el-table-column label="取电" align="center" prop="powerSource" v-if="columns[5].visible"/>
-          <el-table-column label="图片" align="center" prop="imageAddress" width="100" v-if="columns[6].visible">
-                        <template slot-scope="scope">
-              <image-preview :src="scope.row.imageAddress" :width="50" :height="50"/>
-                        </template>
-                    </el-table-column>
-                    <el-table-column label="备注" align="center" prop="remarks" v-if="columns[7].visible"/>
-                    <el-table-column label="第1次" align="center" prop="firstInstance" v-if="columns[8].visible"/>
-                    <el-table-column label="第2次" align="center" prop="secondInstance" v-if="columns[9].visible"/>
-                    <el-table-column label="第3次" align="center" prop="thirdInstance" v-if="columns[10].visible"/>
-                    <el-table-column label="第4次" align="center" prop="fourthInstance" v-if="columns[11].visible"/>
-                    <el-table-column label="第5次" align="center" prop="fifthInstance" v-if="columns[12].visible"/>
-                    <el-table-column label="第6次" align="center" prop="sixthInstance" v-if="columns[13].visible"/>
-                    <el-table-column label="第7次" align="center" prop="seventhInstance" v-if="columns[14].visible"/>
-                    <el-table-column label="第8次" align="center" prop="eighthInstance" v-if="columns[15].visible"/>
-                    <el-table-column label="第9次" align="center" prop="ninthInstance" v-if="columns[16].visible"/>
-                    <el-table-column label="第10次" align="center" prop="tenthInstance" v-if="columns[17].visible"/>
-                    <el-table-column label="第11次" align="center" prop="eleventhInstance" v-if="columns[18].visible"/>
-                    <el-table-column label="第12次" align="center" prop="twelfthInstance" v-if="columns[19].visible"/>
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100">
+            <el-table-column label="序号" align="center" width="60" v-if="columns[0].visible">
+              <template slot-scope="scope">
+                {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
+              </template>
+            </el-table-column>
+            <el-table-column label="类型" align="center" prop="type" v-if="columns[1].visible"/>
+            <el-table-column label="安装柜体名称" align="center" prop="installationCabinetName" v-if="columns[2].visible"/>
+            <el-table-column label="位置描述" align="center" prop="locationDescription" v-if="columns[3].visible" show-overflow-tooltip/>
+            <el-table-column label="来源" align="center" prop="source" v-if="columns[4].visible"/>
+            <el-table-column label="取电" align="center" prop="powerSource" v-if="columns[5].visible"/>
+            <el-table-column label="图片" align="center" prop="imageAddress" width="100" v-if="columns[6].visible">
                 <template slot-scope="scope">
+                    <image-preview :src="scope.row.imageAddress" :width="50" :height="50"/>
+                </template>
+            </el-table-column>
+            <el-table-column label="备注" align="center" prop="remarks" v-if="columns[7].visible" show-overflow-tooltip/>
+            <el-table-column label="第1次" align="center" prop="firstInstance" v-if="columns[8].visible"/>
+            <el-table-column label="第2次" align="center" prop="secondInstance" v-if="columns[9].visible"/>
+            <el-table-column label="第3次" align="center" prop="thirdInstance" v-if="columns[10].visible"/>
+            <el-table-column label="第4次" align="center" prop="fourthInstance" v-if="columns[11].visible"/>
+            <el-table-column label="第5次" align="center" prop="fifthInstance" v-if="columns[12].visible"/>
+            <el-table-column label="第6次" align="center" prop="sixthInstance" v-if="columns[13].visible"/>
+            <el-table-column label="第7次" align="center" prop="seventhInstance" v-if="columns[14].visible"/>
+            <el-table-column label="第8次" align="center" prop="eighthInstance" v-if="columns[15].visible"/>
+            <el-table-column label="第9次" align="center" prop="ninthInstance" v-if="columns[16].visible"/>
+            <el-table-column label="第10次" align="center" prop="tenthInstance" v-if="columns[17].visible"/>
+            <el-table-column label="第11次" align="center" prop="eleventhInstance" v-if="columns[18].visible"/>
+            <el-table-column label="第12次" align="center" prop="twelfthInstance" v-if="columns[19].visible"/>
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="150">
+                <template slot-scope="scope">
+                    <el-button
+                            size="mini"
+                            type="text"
+                            icon="el-icon-view"
+                            @click="handleViewDetail(scope.row)"
+                    >详情</el-button>
                     <el-button
                             size="mini"
                             type="text"
@@ -261,7 +279,7 @@
                 @pagination="getList"
         />
 
-        <!-- 添加或修改行李系统PLC缓冲电池生命周期对话框 -->
+        <!-- 添加  或修改  行李系统PLC缓冲电池生命周期对话框 -->
         <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
             <el-form ref="form" :model="form" :rules="rules" label-width="100px">
                                 <el-form-item label="类型" prop="type">
@@ -429,11 +447,112 @@
                 <el-button @click="upload.open = false">取 消</el-button>
             </div>
         </el-dialog>
+
+        <!-- 详情抽屉 -->
+        <el-drawer
+            title="PLC缓冲电池生命周期详情"
+            :visible.sync="detailDrawer"
+            direction="rtl"
+            size="500px"
+            :before-close="handleDetailClose"
+        >
+            <div class="detail-content" v-if="currentRecord">
+                <el-descriptions :column="1" border>
+                    <el-descriptions-item label="记录ID">
+                        <span>{{ currentRecord.objid }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="类型">
+                        <span>{{ currentRecord.type || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="安装柜体名称">
+                        <span>{{ currentRecord.installationCabinetName || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="位置描述">
+                        <div class="detail-text-content">
+                            {{ currentRecord.locationDescription || '暂无' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="来源">
+                        <span>{{ currentRecord.source || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="取电">
+                        <span>{{ currentRecord.powerSource || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="图片">
+                        <image-preview v-if="currentRecord.imageAddress" :src="currentRecord.imageAddress" :width="100" :height="100"/>
+                        <span v-else>暂无</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="备注">
+                        <div class="detail-text-content">
+                            {{ currentRecord.remarks || '暂无' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="第1次">
+                        <span>{{ currentRecord.firstInstance || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="第2次">
+                        <span>{{ currentRecord.secondInstance || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="第3次">
+                        <span>{{ currentRecord.thirdInstance || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="第4次">
+                        <span>{{ currentRecord.fourthInstance || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="第5次">
+                        <span>{{ currentRecord.fifthInstance || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="第6次">
+                        <span>{{ currentRecord.sixthInstance || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="第7次">
+                        <span>{{ currentRecord.seventhInstance || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="第8次">
+                        <span>{{ currentRecord.eighthInstance || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="第9次">
+                        <span>{{ currentRecord.ninthInstance || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="第10次">
+                        <span>{{ currentRecord.tenthInstance || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="第11次">
+                        <span>{{ currentRecord.eleventhInstance || '暂无' }}</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item label="第12次">
+                        <span>{{ currentRecord.twelfthInstance || '暂无' }}</span>
+                    </el-descriptions-item>
+                </el-descriptions>
+            </div>
+        </el-drawer>
+
+        <!-- 右击菜单 -->
+        <ul
+            v-show="contextMenuVisible"
+            :style="contextMenuStyle"
+            class="context-menu"
+            @click.stop
+        >
+            <li @click="handleViewDetail(contextMenuRow)">
+                <i class="el-icon-view"></i>
+                查看详情
+            </li>
+<!--            <li @click="handleUpdate(contextMenuRow)" v-if="checkPermission(['ems/info:plcBufferBatteryLifecycle:edit'])">-->
+<!--                <i class="el-icon-edit"></i>-->
+<!--                修改记录-->
+<!--            </li>-->
+<!--            <li @click="handleDelete(contextMenuRow)" v-if="checkPermission(['ems/info:plcBufferBatteryLifecycle:remove'])">-->
+<!--                <i class="el-icon-delete"></i>-->
+<!--                删除记录-->
+<!--            </li>-->
+        </ul>
     </div>
 </template>
 
 <script>
     import { listPlcBufferBatteryLifecycle, getPlcBufferBatteryLifecycle, delPlcBufferBatteryLifecycle, addPlcBufferBatteryLifecycle, updatePlcBufferBatteryLifecycle } from "@/api/ems/info/plcBufferBatteryLifecycle";
+    import { checkPermi } from "@/utils/permission";
 
     export default {
         name: "PlcBufferBatteryLifecycle",
@@ -493,7 +612,7 @@
                     ],
                 },
                 columns: [
-                        { key: 0, label: `主键，自增ID`, visible: false },
+                        { key: 0, label: `序号`, visible: true },
                         { key: 1, label: `类型`, visible: true },
                         { key: 2, label: `安装柜体名称`, visible: true },
                         { key: 3, label: `位置描述`, visible: true },
@@ -521,7 +640,19 @@
                     updateSupport: false,
                     isUploading: false,
                     headers: {}
-                }
+                },
+                // 详情抽屉相关
+                detailDrawer: false,
+                currentRecord: null,
+                // 右击菜单相关
+                contextMenuVisible: false,
+                contextMenuStyle: {
+                    position: 'fixed',
+                    zIndex: 1000,
+                    left: '0px',
+                    top: '0px'
+                },
+                contextMenuRow: null
             };
         },
         created() {
@@ -529,6 +660,12 @@
             this.upload.url = process.env.VUE_APP_BASE_API + "/ems/info/plcBufferBatteryLifecycle/importData";
             this.upload.headers = { Authorization: "Bearer " + this.$store.getters.token };
         },
+        mounted() {
+            document.addEventListener('click', this.hideContextMenu);
+        },
+        beforeDestroy() {
+            document.removeEventListener('click', this.hideContextMenu);
+        },
         methods: {
             /** 查询行李系统PLC缓冲电池生命周期列表 */
             getList() {
@@ -590,16 +727,16 @@
             handleAdd() {
                 this.reset();
                 this.open = true;
-                this.title = "添加行李系统PLC缓冲电池生命周期";
+                this.title = "添加  行李系统PLC缓冲电池生命周期";
             },
-            /** 修改按钮操作 */
+            /** 修改  按钮操作 */
             handleUpdate(row) {
                 this.reset();
                 const objid = row.objid || this.ids
                 getPlcBufferBatteryLifecycle(objid).then(response => {
                     this.form = response.data;
                     this.open = true;
-                    this.title = "修改行李系统PLC缓冲电池生命周期";
+                    this.title = "修改  行李系统PLC缓冲电池生命周期";
                 });
             },
             /** 提交按钮 */
@@ -663,7 +800,170 @@
     // 提交上传文件
     submitFileForm() {
         this.$refs.upload.submit();
-    }
+    },
+            /** 查看详情 */
+            handleViewDetail(row) {
+                this.currentRecord = row;
+                this.detailDrawer = true;
+                this.hideContextMenu();
+            },
+            /** 关闭详情抽屉 */
+            handleDetailClose() {
+                this.currentRecord = null;
+                this.detailDrawer = false;
+            },
+            /** 处理行右击事件 */
+            handleRowContextMenu(row, column, event) {
+                event.preventDefault();
+                this.contextMenuRow = row;
+
+                this.$nextTick(() => {
+                    const menuWidth = 120;
+                    const menuHeight = 120;
+                    const windowWidth = window.innerWidth;
+                    const windowHeight = window.innerHeight;
+
+                    let left = event.clientX;
+                    let top = event.clientY;
+
+                    if (left + menuWidth > windowWidth) {
+                        left = windowWidth - menuWidth - 10;
+                    }
+
+                    if (top + menuHeight > windowHeight) {
+                        top = windowHeight - menuHeight - 10;
+                    }
+
+                    this.contextMenuStyle.left = left + 'px';
+                    this.contextMenuStyle.top = top + 'px';
+                    this.contextMenuVisible = true;
+                });
+            },
+            /** 隐藏右击菜单 */
+            hideContextMenu() {
+                this.contextMenuVisible = false;
+                this.contextMenuRow = null;
+            },
+            /** 检查权限 */
+            checkPermission(permissions) {
+                return checkPermi(permissions);
+            },
     }
     };
 </script>
+
+<style scoped>
+/* 右击菜单样式 */
+.context-menu {
+    position: fixed;
+    z-index: 1000;
+    background-color: #fff;
+    border: 1px solid #e4e7ed;
+    border-radius: 4px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    padding: 5px 0;
+    margin: 0;
+    list-style: none;
+    min-width: 120px;
+}
+
+.context-menu li {
+    padding: 8px 16px;
+    cursor: pointer;
+    font-size: 14px;
+    color: #606266;
+    display: flex;
+    align-items: center;
+    transition: background-color 0.3s;
+}
+
+.context-menu li:hover {
+    background-color: #f5f7fa;
+    color: #409eff;
+}
+
+.context-menu li i {
+    margin-right: 8px;
+    font-size: 14px;
+}
+
+/* 详情内容样式 */
+.detail-content {
+    padding: 20px;
+}
+
+.detail-text-content {
+    max-height: 200px;
+    overflow-y: auto;
+    word-wrap: break-word;
+    word-break: break-all;
+    line-height: 1.6;
+    padding: 8px;
+    background-color: #f8f9fa;
+    border-radius: 4px;
+    border: 1px solid #e9ecef;
+}
+
+/* 表格行悬停效果 */
+.battery-lifecycle-table .el-table__row {
+    transition: background-color 0.3s;
+}
+
+.battery-lifecycle-table .el-table__row:hover {
+    cursor: context-menu;
+    background-color: #f0f9ff !important;
+}
+
+/* 表格样式优化 */
+.battery-lifecycle-table {
+    border-radius: 4px;
+    overflow: hidden;
+}
+
+.battery-lifecycle-table .el-table__header-wrapper {
+    border-radius: 4px 4px 0 0;
+}
+
+/* 描述列表样式优化 */
+.detail-content .el-descriptions {
+    margin-top: 0;
+}
+
+.detail-content .el-descriptions-item__label {
+    font-weight: 600;
+    color: #303133;
+    width: 90px;
+}
+
+.detail-content .el-descriptions-item__content {
+    color: #606266;
+}
+
+/* 响应式设计 */
+@media (max-width: 768px) {
+    .context-menu {
+        min-width: 100px;
+        font-size: 12px;
+    }
+
+    .context-menu li {
+        padding: 6px 12px;
+    }
+
+    .detail-content {
+        padding: 15px;
+    }
+
+    .detail-content .el-descriptions-item__label {
+        width: 80px;
+        font-size: 13px;
+    }
+}
+
+/* 打印样式 */
+@media print {
+    .context-menu {
+        display: none !important;
+    }
+}
+</style>
diff --git a/src/views/ems/info/securityDoorBatteryLifecycle/index.vue b/src/views/ems/info/securityDoorBatteryLifecycle/index.vue
index 339a915..6274cd2 100644
--- a/src/views/ems/info/securityDoorBatteryLifecycle/index.vue
+++ b/src/views/ems/info/securityDoorBatteryLifecycle/index.vue
@@ -1,154 +1,154 @@
 <template>
     <div class="app-container">
-        <!-- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
-                        <el-form-item label="类型" prop="type">
-                            <el-select v-model="queryParams.type" placeholder="请选择类型" clearable>
-                                <el-option
-                                        v-for="dict in dict.type.${dictType}"
-                                        :key="dict.value"
-                                        :label="dict.label"
-                                        :value="dict.value"
-                                />
-                            </el-select>
-                        </el-form-item>
-                        <el-form-item label="参照位置" prop="referenceLocation">
-                            <el-input
-                                    v-model="queryParams.referenceLocation"
-                                    placeholder="请输入参照位置"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="位置描述" prop="locationDescription">
-                            <el-input
-                                    v-model="queryParams.locationDescription"
-                                    placeholder="请输入位置描述"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="取电" prop="powerSource">
-                            <el-input
-                                    v-model="queryParams.powerSource"
-                                    placeholder="请输入取电"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="电池类型" prop="batteryType">
-                            <el-select v-model="queryParams.batteryType" placeholder="请选择电池类型" clearable>
-                                <el-option
-                                        v-for="dict in dict.type.${dictType}"
-                                        :key="dict.value"
-                                        :label="dict.label"
-                                        :value="dict.value"
-                                />
-                            </el-select>
-                        </el-form-item>
-                        <el-form-item label="图片" prop="imageAddress">
-                            <el-input
-                                    v-model="queryParams.imageAddress"
-                                    placeholder="请输入图片"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="第1次" prop="firstInstance">
-                            <el-input
-                                    v-model="queryParams.firstInstance"
-                                    placeholder="请输入第1次"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="第2次" prop="secondInstance">
-                            <el-input
-                                    v-model="queryParams.secondInstance"
-                                    placeholder="请输入第2次"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="第3次" prop="thirdInstance">
-                            <el-input
-                                    v-model="queryParams.thirdInstance"
-                                    placeholder="请输入第3次"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="第4次" prop="fourthInstance">
-                            <el-input
-                                    v-model="queryParams.fourthInstance"
-                                    placeholder="请输入第4次"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="第5次" prop="fifthInstance">
-                            <el-input
-                                    v-model="queryParams.fifthInstance"
-                                    placeholder="请输入第5次"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="第6次" prop="sixthInstance">
-                            <el-input
-                                    v-model="queryParams.sixthInstance"
-                                    placeholder="请输入第6次"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="第7次" prop="seventhInstance">
-                            <el-input
-                                    v-model="queryParams.seventhInstance"
-                                    placeholder="请输入第7次"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="第8次" prop="eighthInstance">
-                            <el-input
-                                    v-model="queryParams.eighthInstance"
-                                    placeholder="请输入第8次"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="第9次" prop="ninthInstance">
-                            <el-input
-                                    v-model="queryParams.ninthInstance"
-                                    placeholder="请输入第9次"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="第10次" prop="tenthInstance">
-                            <el-input
-                                    v-model="queryParams.tenthInstance"
-                                    placeholder="请输入第10次"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="第11次" prop="eleventhInstance">
-                            <el-input
-                                    v-model="queryParams.eleventhInstance"
-                                    placeholder="请输入第11次"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="第12次" prop="twelfthInstance">
-                            <el-input
-                                    v-model="queryParams.twelfthInstance"
-                                    placeholder="请输入第12次"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item> -->
+       <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
+         <!-- <el-form-item label="类型" prop="type">
+            <el-select v-model="queryParams.type" placeholder="请选择类型" clearable>
+                <el-option
+                        v-for="dict in dict.type.${dictType}"
+                        :key="dict.value"
+                        :label="dict.label"
+                        :value="dict.value"
+                />
+            </el-select>
+        </el-form-item>
+        <el-form-item label="参照位置" prop="referenceLocation">
+            <el-input
+                    v-model="queryParams.referenceLocation"
+                    placeholder="请输入参照位置"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="位置描述" prop="locationDescription">
+            <el-input
+                    v-model="queryParams.locationDescription"
+                    placeholder="请输入位置描述"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="取电" prop="powerSource">
+            <el-input
+                    v-model="queryParams.powerSource"
+                    placeholder="请输入取电"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="电池类型" prop="batteryType">
+            <el-select v-model="queryParams.batteryType" placeholder="请选择电池类型" clearable>
+                <el-option
+                        v-for="dict in dict.type.${dictType}"
+                        :key="dict.value"
+                        :label="dict.label"
+                        :value="dict.value"
+                />
+            </el-select>
+        </el-form-item>
+        <el-form-item label="图片" prop="imageAddress">
+            <el-input
+                    v-model="queryParams.imageAddress"
+                    placeholder="请输入图片"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="第1次" prop="firstInstance">
+            <el-input
+                    v-model="queryParams.firstInstance"
+                    placeholder="请输入第1次"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="第2次" prop="secondInstance">
+            <el-input
+                    v-model="queryParams.secondInstance"
+                    placeholder="请输入第2次"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="第3次" prop="thirdInstance">
+            <el-input
+                    v-model="queryParams.thirdInstance"
+                    placeholder="请输入第3次"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="第4次" prop="fourthInstance">
+            <el-input
+                    v-model="queryParams.fourthInstance"
+                    placeholder="请输入第4次"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="第5次" prop="fifthInstance">
+            <el-input
+                    v-model="queryParams.fifthInstance"
+                    placeholder="请输入第5次"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="第6次" prop="sixthInstance">
+            <el-input
+                    v-model="queryParams.sixthInstance"
+                    placeholder="请输入第6次"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="第7次" prop="seventhInstance">
+            <el-input
+                    v-model="queryParams.seventhInstance"
+                    placeholder="请输入第7次"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="第8次" prop="eighthInstance">
+            <el-input
+                    v-model="queryParams.eighthInstance"
+                    placeholder="请输入第8次"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="第9次" prop="ninthInstance">
+            <el-input
+                    v-model="queryParams.ninthInstance"
+                    placeholder="请输入第9次"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="第10次" prop="tenthInstance">
+            <el-input
+                    v-model="queryParams.tenthInstance"
+                    placeholder="请输入第10次"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="第11次" prop="eleventhInstance">
+            <el-input
+                    v-model="queryParams.eleventhInstance"
+                    placeholder="请输入第11次"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item>
+        <el-form-item label="第12次" prop="twelfthInstance">
+            <el-input
+                    v-model="queryParams.twelfthInstance"
+                    placeholder="请输入第12次"
+                    clearable
+                    @keyup.enter.native="handleQuery"
+            />
+        </el-form-item> -->
             <el-form-item>
                 <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
                 <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -211,9 +211,13 @@
             <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
         </el-row>
 
-        <el-table v-loading="loading" :data="securityDoorBatteryLifecycleList" @selection-change="handleSelectionChange">
+        <el-table v-loading="loading" :data="securityDoorBatteryLifecycleList" @selection-change="handleSelectionChange" @row-contextmenu="handleRowContextMenu" class="context-menu-table">
             <el-table-column type="selection" width="55" align="center" />
-                    <el-table-column label="主键，自增ID" align="center" prop="objid" v-if="columns[0].visible"/>
+          <el-table-column label="序号" align="center" width="60" v-if="columns[0].visible">
+            <template slot-scope="scope">
+              {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
+            </template>
+          </el-table-column>
                     <el-table-column label="类型" align="center" prop="type" v-if="columns[1].visible">
                     </el-table-column>
                     <el-table-column label="参照位置" align="center" prop="referenceLocation" v-if="columns[2].visible">
@@ -255,8 +259,14 @@
                     </el-table-column>
                     <el-table-column label="第12次" align="center" prop="twelfthInstance" v-if="columns[19].visible">
                     </el-table-column>
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100">
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="140">
                 <template slot-scope="scope">
+                    <el-button
+                            size="mini"
+                            type="text"
+                            icon="el-icon-view"
+                            @click="handleViewDetail(scope.row)"
+                    >详情</el-button>
                     <el-button
                             size="mini"
                             type="text"
@@ -283,7 +293,7 @@
                 @pagination="getList"
         />
 
-        <!-- 添加或修改行李系统安全门铅酸电池生命周期对话框 -->
+        <!-- 添加  或修改  行李系统安全门铅酸电池生命周期对话框 -->
         <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
             <el-form ref="form" :model="form" :rules="rules" label-width="100px">
                                 <el-form-item label="类型" prop="type">
@@ -451,11 +461,176 @@
                 <el-button @click="upload.open = false">取 消</el-button>
             </div>
         </el-dialog>
+
+        <!-- 详情抽屉 -->
+        <el-drawer
+            title="安全门电池生命周期详情"
+            :visible.sync="detailDrawer"
+            direction="rtl"
+            size="50%"
+            :before-close="() => detailDrawer = false"
+        >
+            <div style="padding: 20px;">
+                <el-descriptions :column="1" border>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">类型</span>
+                        </template>
+                        {{ currentRecord.type || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">参照位置</span>
+                        </template>
+                        {{ currentRecord.referenceLocation || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">位置描述</span>
+                        </template>
+                        <div style="max-height: 100px; overflow-y: auto;">
+                            {{ currentRecord.locationDescription || '-' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">取电</span>
+                        </template>
+                        {{ currentRecord.powerSource || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">电池类型</span>
+                        </template>
+                        {{ currentRecord.batteryType || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">图片</span>
+                        </template>
+                        <image-preview v-if="currentRecord.imageAddress" :src="currentRecord.imageAddress" :width="100" :height="100"/>
+                        <span v-else>-</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">备注</span>
+                        </template>
+                        <div style="max-height: 100px; overflow-y: auto;">
+                            {{ currentRecord.remarks || '-' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第1次</span>
+                        </template>
+                        {{ currentRecord.firstInstance || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第2次</span>
+                        </template>
+                        {{ currentRecord.secondInstance || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第3次</span>
+                        </template>
+                        {{ currentRecord.thirdInstance || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第4次</span>
+                        </template>
+                        {{ currentRecord.fourthInstance || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第5次</span>
+                        </template>
+                        {{ currentRecord.fifthInstance || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第6次</span>
+                        </template>
+                        {{ currentRecord.sixthInstance || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第7次</span>
+                        </template>
+                        {{ currentRecord.seventhInstance || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第8次</span>
+                        </template>
+                        {{ currentRecord.eighthInstance || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第9次</span>
+                        </template>
+                        {{ currentRecord.ninthInstance || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第10次</span>
+                        </template>
+                        {{ currentRecord.tenthInstance || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第11次</span>
+                        </template>
+                        {{ currentRecord.eleventhInstance || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第12次</span>
+                        </template>
+                        {{ currentRecord.twelfthInstance || '-' }}
+                    </el-descriptions-item>
+                </el-descriptions>
+            </div>
+        </el-drawer>
+
+        <!-- 右击菜单 -->
+        <div
+            v-show="contextMenu.visible"
+            :style="{
+                position: 'fixed',
+                top: contextMenu.top + 'px',
+                left: contextMenu.left + 'px',
+                zIndex: 9999
+            }"
+            class="context-menu"
+            @click.stop
+        >
+            <div class="context-menu-item" @click="contextMenuViewDetail">
+                <i class="el-icon-view"></i> 查看详情
+            </div>
+            <div
+                class="context-menu-item"
+                @click="contextMenuEdit"
+                v-if="checkPermi(['ems/info:securityDoorBatteryLifecycle:edit'])"
+            >
+                <i class="el-icon-edit"></i> 修改
+            </div>
+            <div
+                class="context-menu-item"
+                @click="contextMenuDelete"
+                v-if="checkPermi(['ems/info:securityDoorBatteryLifecycle:remove'])"
+            >
+                <i class="el-icon-delete"></i> 删除
+            </div>
+        </div>
     </div>
 </template>
 
 <script>
     import { listSecurityDoorBatteryLifecycle, getSecurityDoorBatteryLifecycle, delSecurityDoorBatteryLifecycle, addSecurityDoorBatteryLifecycle, updateSecurityDoorBatteryLifecycle } from "@/api/ems/info/securityDoorBatteryLifecycle";
+    import { checkPermi } from "@/utils/permission";
 
     export default {
         name: "SecurityDoorBatteryLifecycle",
@@ -512,7 +687,7 @@
                     ]
                 },
                 columns: [
-                        { key: 0, label: `主键，自增ID`, visible: false },
+                        { key: 0, label: `序号`, visible: true },
                         { key: 1, label: `类型`, visible: true },
                         { key: 2, label: `参照位置`, visible: true },
                         { key: 3, label: `位置描述`, visible: true },
@@ -540,6 +715,16 @@
                     updateSupport: false,
                     isUploading: false,
                     headers: {}
+                },
+                // 详情抽屉
+                detailDrawer: false,
+                currentRecord: {},
+                // 右击菜单
+                contextMenu: {
+                    visible: false,
+                    top: 0,
+                    left: 0,
+                    row: null
                 }
             };
         },
@@ -548,6 +733,12 @@
             this.upload.url = process.env.VUE_APP_BASE_API + "/ems/info/securityDoorBatteryLifecycle/importData";
             this.upload.headers = { Authorization: "Bearer " + this.$store.getters.token };
         },
+        mounted() {
+            document.addEventListener('click', this.hideContextMenu);
+        },
+        beforeDestroy() {
+            document.removeEventListener('click', this.hideContextMenu);
+        },
         methods: {
             /** 查询行李系统安全门铅酸电池生命周期列表 */
             getList() {
@@ -609,16 +800,16 @@
             handleAdd() {
                 this.reset();
                 this.open = true;
-                this.title = "添加行李系统安全门铅酸电池生命周期";
+                this.title = "添加  行李系统安全门铅酸电池生命周期";
             },
-            /** 修改按钮操作 */
+            /** 修改  按钮操作 */
             handleUpdate(row) {
                 this.reset();
                 const objid = row.objid || this.ids
                 getSecurityDoorBatteryLifecycle(objid).then(response => {
                     this.form = response.data;
                     this.open = true;
-                    this.title = "修改行李系统安全门铅酸电池生命周期";
+                    this.title = "修改  行李系统安全门铅酸电池生命周期";
                 });
             },
             /** 提交按钮 */
@@ -682,7 +873,108 @@
     // 提交上传文件
     submitFileForm() {
         this.$refs.upload.submit();
+    },
+    // 查看详情
+    handleViewDetail(row) {
+        this.currentRecord = { ...row };
+        this.detailDrawer = true;
+    },
+    // 处理表格行右击事件
+    handleRowContextMenu(row, column, event) {
+        event.preventDefault();
+        this.contextMenu.row = row;
+        this.contextMenu.visible = true;
+
+        // 计算菜单位置
+        const x = event.clientX;
+        const y = event.clientY;
+        const menuWidth = 120;
+        const menuHeight = 120;
+        const windowWidth = window.innerWidth;
+        const windowHeight = window.innerHeight;
+
+        this.contextMenu.left = (x + menuWidth > windowWidth) ? x - menuWidth : x;
+        this.contextMenu.top = (y + menuHeight > windowHeight) ? y - menuHeight : y;
+    },
+    // 隐藏右击菜单
+    hideContextMenu() {
+        this.contextMenu.visible = false;
+    },
+    // 右击菜单 - 查看详情
+    contextMenuViewDetail() {
+        if (this.contextMenu.row) {
+            this.handleViewDetail(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 右击菜单 - 修改
+    contextMenuEdit() {
+        if (this.contextMenu.row && this.checkPermi(['ems/info:securityDoorBatteryLifecycle:edit'])) {
+            this.handleUpdate(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 右击菜单 - 删除
+    contextMenuDelete() {
+        if (this.contextMenu.row && this.checkPermi(['ems/info:securityDoorBatteryLifecycle:remove'])) {
+            this.handleDelete(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 权限检查方法
+    checkPermi(permissions) {
+        return checkPermi(permissions);
     }
     }
     };
 </script>
+
+<style scoped>
+.context-menu-table tbody tr:hover {
+    cursor: context-menu;
+}
+
+.context-menu {
+    background: white;
+    border: 1px solid #ebeef5;
+    border-radius: 4px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    padding: 4px 0;
+    min-width: 120px;
+}
+
+.context-menu-item {
+    padding: 8px 16px;
+    cursor: pointer;
+    font-size: 14px;
+    color: #606266;
+    display: flex;
+    align-items: center;
+}
+
+.context-menu-item:hover {
+    background-color: #f5f7fa;
+    color: #409eff;
+}
+
+.context-menu-item i {
+    margin-right: 8px;
+    font-size: 14px;
+}
+
+.el-descriptions__label {
+    width: 90px !important;
+}
+
+@media (max-width: 768px) {
+    .el-drawer {
+        width: 90% !important;
+    }
+}
+
+@media print {
+    .context-menu {
+        display: none !important;
+    }
+}
+</style>
diff --git a/src/views/ems/info/sparePartsInventory/index.vue b/src/views/ems/info/sparePartsInventory/index.vue
index 2b74a7d..6160dfc 100644
--- a/src/views/ems/info/sparePartsInventory/index.vue
+++ b/src/views/ems/info/sparePartsInventory/index.vue
@@ -126,10 +126,10 @@
             </el-col>
             <el-col :span="1.5" v-if="lowStockCount > 0">
                 <el-badge :value="lowStockCount" class="item" type="danger">
-                    <el-button 
-                        type="danger" 
-                        plain 
-                        icon="el-icon-warning" 
+                    <el-button
+                        type="danger"
+                        plain
+                        icon="el-icon-warning"
                         size="mini"
                         @click="filterLowStock"
                     >库存预警</el-button>
@@ -149,14 +149,18 @@
         >
         </el-alert>
 
-        <el-table 
-            v-loading="loading" 
-            :data="sparePartsInventoryList" 
+        <el-table
+            v-loading="loading"
+            :data="sparePartsInventoryList"
             @selection-change="handleSelectionChange"
             :row-class-name="getRowClassName"
         >
             <el-table-column type="selection" width="55" align="center" />
-            <el-table-column label="主键" align="center" prop="objid" v-if="columns[0].visible"/>
+          <el-table-column label="序号" align="center" width="60" v-if="columns[0].visible">
+            <template slot-scope="scope">
+              {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
+            </template>
+          </el-table-column>
             <el-table-column label="入库时间" align="center" prop="warehouseDate" v-if="columns[1].visible"/>
             <el-table-column label="采购方式" align="center" prop="purchaseMethod" v-if="columns[2].visible"/>
             <el-table-column label="库存位置" align="center" prop="storageLocation" v-if="columns[3].visible"/>
@@ -181,19 +185,19 @@
                 </template>
             </el-table-column>
             <el-table-column label="备注" align="center" prop="remarks" v-if="columns[10].visible"/>
-            
+
             <!-- 动态盘点列 -->
-            <el-table-column 
-                v-for="(checkColumn, index) in dynamicColumns" 
+            <el-table-column
+                v-for="(checkColumn, index) in dynamicColumns"
                 :key="'check_' + index"
-                :label="checkColumn" 
+                :label="checkColumn"
                 align="center"
                 width="120">
                 <template slot-scope="scope">
                     <span>{{ getCheckValue(scope.row, checkColumn) }}</span>
                 </template>
             </el-table-column>
-            
+
             <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="120">
                 <template slot-scope="scope">
                     <div v-if="isLowStock(scope.row)" style="margin-bottom: 5px;">
@@ -229,7 +233,7 @@
                 @pagination="getList"
         />
 
-        <!-- 添加或修改备件库记录主对话框 -->
+        <!-- 添加  或修改  备件库记录主对话框 -->
         <el-dialog :title="title" :visible.sync="open" width="800px" append-to-body>
             <el-form ref="form" :model="form" :rules="rules" label-width="100px">
                 <el-row>
@@ -289,10 +293,10 @@
                 <el-row>
                     <el-col :span="12">
                         <el-form-item label="库存阈值" prop="threshold">
-                            <el-input-number 
-                                v-model="form.threshold" 
-                                :min="0" 
-                                placeholder="请输入库存阈值" 
+                            <el-input-number
+                                v-model="form.threshold"
+                                :min="0"
+                                placeholder="请输入库存阈值"
                                 style="width: 100%"
                             />
                         </el-form-item>
@@ -304,27 +308,27 @@
                 <el-form-item label="备注" prop="remarks">
                     <el-input v-model="form.remarks" type="textarea" placeholder="请输入内容" />
                 </el-form-item>
-                
+
                 <!-- 盘点记录部分 -->
                 <el-divider content-position="left">盘点记录</el-divider>
                 <div style="margin-bottom: 10px;">
-                    <el-button 
-                        type="primary" 
-                        size="small" 
-                        icon="el-icon-plus" 
+                    <el-button
+                        type="primary"
+                        size="small"
+                        icon="el-icon-plus"
                         @click="addCheckRecord"
-                    >添加盘点记录</el-button>
+                    >添加  盘点记录</el-button>
                 </div>
-                <el-table 
-                    :data="form.checkData" 
-                    border 
+                <el-table
+                    :data="form.checkData"
+                    border
                     style="width: 100%; margin-bottom: 20px;"
                     max-height="300"
                 >
                     <el-table-column label="盘点名称" width="200">
                         <template slot-scope="scope">
-                            <el-input 
-                                v-model="scope.row.checkName" 
+                            <el-input
+                                v-model="scope.row.checkName"
                                 placeholder="如: 2023.3盘点"
                                 size="small"
                             />
@@ -332,8 +336,8 @@
                     </el-table-column>
                     <el-table-column label="盘点数量" width="150">
                         <template slot-scope="scope">
-                            <el-input-number 
-                                v-model="scope.row.checkQuantity" 
+                            <el-input-number
+                                v-model="scope.row.checkQuantity"
                                 :min="0"
                                 size="small"
                                 style="width: 100%"
@@ -342,9 +346,9 @@
                     </el-table-column>
                     <el-table-column label="操作" width="80">
                         <template slot-scope="scope">
-                            <el-button 
-                                type="danger" 
-                                size="mini" 
+                            <el-button
+                                type="danger"
+                                size="mini"
                                 icon="el-icon-delete"
                                 @click="removeCheckRecord(scope.$index)"
                             ></el-button>
@@ -387,13 +391,13 @@
 </template>
 
 <script>
-    import { 
-        listSparePartsInventoryWithDynamicColumns, 
-        getSparePartsInventoryWithDynamicColumns, 
-        delSparePartsInventory, 
-        addSparePartsInventoryWithDynamicColumns, 
+    import {
+        listSparePartsInventoryWithDynamicColumns,
+        getSparePartsInventoryWithDynamicColumns,
+        delSparePartsInventory,
+        addSparePartsInventoryWithDynamicColumns,
         updateSparePartsInventoryWithDynamicColumns,
-        getDynamicColumns 
+        getDynamicColumns
     } from "@/api/ems/info/sparePartsInventory";
 
     export default {
@@ -487,14 +491,14 @@
                     this.loading = false;
                 });
             },
-            
+
             /** 获取动态列列表 */
             getDynamicColumnsList() {
                 getDynamicColumns().then(response => {
                     this.dynamicColumns = response.data || [];
                 });
             },
-            
+
             /** 获取盘点值 */
             getCheckValue(row, checkName) {
                 if (row.checkData && row.checkData[checkName] !== undefined && row.checkData[checkName] !== null) {
@@ -502,8 +506,8 @@
                 }
                 return '';
             },
-            
-            /** 添加盘点记录 */
+
+            /** 添加  盘点记录 */
             addCheckRecord() {
                 if (!this.form.checkData) {
                     this.form.checkData = [];
@@ -513,12 +517,12 @@
                     checkQuantity: 0
                 });
             },
-            
+
             /** 删除盘点记录 */
             removeCheckRecord(index) {
                 this.form.checkData.splice(index, 1);
             },
-            
+
             // 取消按钮
             cancel() {
                 this.open = false;
@@ -562,9 +566,9 @@
             handleAdd() {
                 this.reset();
                 this.open = true;
-                this.title = "添加备件库记录主";
+                this.title = "添加  备件库记录主";
             },
-            /** 修改按钮操作 */
+            /** 修改  按钮操作 */
             handleUpdate(row) {
                 this.reset();
                 const objid = row.objid || this.ids
@@ -581,7 +585,7 @@
                         this.form.checkData = [];
                     }
                     this.open = true;
-                    this.title = "修改备件库记录主";
+                    this.title = "修改  备件库记录主";
                 });
             },
             /** 提交按钮 */
@@ -600,7 +604,7 @@
                             });
                             submitData.checkData = checkDataObj;
                         }
-                        
+
                         if (this.form.objid != null) {
                             updateSparePartsInventoryWithDynamicColumns(submitData).then(response => {
                                 this.$modal.msgSuccess("修改成功");
@@ -666,7 +670,7 @@
             isLowStock(row) {
                 return row.remainingQuantity != null && row.threshold != null && row.remainingQuantity <= row.threshold;
             },
-            
+
             // 获取整行样式类名
             getRowClassName({row, rowIndex}) {
                 if (this.isLowStock(row)) {
@@ -674,17 +678,17 @@
                 }
                 return '';
             },
-            
+
             // 过滤显示低库存记录
             filterLowStock() {
                 this.$message({
                     message: `正在显示 ${this.lowStockCount} 项库存不足的记录`,
                     type: 'warning'
                 });
-                // 这里可以实现具体的过滤逻辑，比如修改查询参数
+                // 这里可以实现具体的过滤逻辑，比如修改  查询参数
                 // 暂时只是提示用户，实际项目中可以根据需要实现过滤功能
             },
-            
+
             // 获取剩余数量类
             getRemainingQuantityClass(row) {
                 // 当剩余数量低于或等于阈值时显示为红色警告
diff --git a/src/views/ems/info/sparePartsInventoryCheck/index.vue b/src/views/ems/info/sparePartsInventoryCheck/index.vue
index 550a70d..c5a2755 100644
--- a/src/views/ems/info/sparePartsInventoryCheck/index.vue
+++ b/src/views/ems/info/sparePartsInventoryCheck/index.vue
@@ -1,376 +1,376 @@
-<!-- <template>
-    <div class="app-container">
-        <!-- <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
-                        <el-form-item label="备件库存主表ID" prop="inventoryObjid">
-                            <el-input
-                                    v-model="queryParams.inventoryObjid"
-                                    placeholder="请输入备件库存主表ID"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="盘点名称" prop="checkName">
-                            <el-input
-                                    v-model="queryParams.checkName"
-                                    placeholder="请输入盘点名称"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="盘点数量" prop="checkQuantity">
-                            <el-input
-                                    v-model="queryParams.checkQuantity"
-                                    placeholder="请输入盘点数量"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-                        <el-form-item label="盘点日期" prop="checkDate">
-                            <el-input
-                                    v-model="queryParams.checkDate"
-                                    placeholder="请输入盘点日期"
-                                    clearable
-                                    @keyup.enter.native="handleQuery"
-                            />
-                        </el-form-item>
-            <el-form-item>
-                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
-                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
-            </el-form-item>
-        </el-form> -->
+<!--&lt;!&ndash; <template>-->
+<!--    <div class="app-container">-->
+<!--         <el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">-->
+<!--                        <el-form-item label="备件库存主表ID" prop="inventoryObjid">-->
+<!--                            <el-input-->
+<!--                                    v-model="queryParams.inventoryObjid"-->
+<!--                                    placeholder="请输入备件库存主表ID"-->
+<!--                                    clearable-->
+<!--                                    @keyup.enter.native="handleQuery"-->
+<!--                            />-->
+<!--                        </el-form-item>-->
+<!--                        <el-form-item label="盘点名称" prop="checkName">-->
+<!--                            <el-input-->
+<!--                                    v-model="queryParams.checkName"-->
+<!--                                    placeholder="请输入盘点名称"-->
+<!--                                    clearable-->
+<!--                                    @keyup.enter.native="handleQuery"-->
+<!--                            />-->
+<!--                        </el-form-item>-->
+<!--                        <el-form-item label="盘点数量" prop="checkQuantity">-->
+<!--                            <el-input-->
+<!--                                    v-model="queryParams.checkQuantity"-->
+<!--                                    placeholder="请输入盘点数量"-->
+<!--                                    clearable-->
+<!--                                    @keyup.enter.native="handleQuery"-->
+<!--                            />-->
+<!--                        </el-form-item>-->
+<!--                        <el-form-item label="盘点日期" prop="checkDate">-->
+<!--                            <el-input-->
+<!--                                    v-model="queryParams.checkDate"-->
+<!--                                    placeholder="请输入盘点日期"-->
+<!--                                    clearable-->
+<!--                                    @keyup.enter.native="handleQuery"-->
+<!--                            />-->
+<!--                        </el-form-item>-->
+<!--            <el-form-item>-->
+<!--                <el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>-->
+<!--                <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>-->
+<!--            </el-form-item>-->
+<!--        </el-form> &ndash;&gt;-->
 
-        <el-row :gutter="10" class="mb8">
-            <el-col :span="1.5">
-                <el-button
-                        type="primary"
-                        plain
-                        icon="el-icon-plus"
-                        size="mini"
-                        @click="handleAdd"
-                        v-hasPermi="['ems/info:sparePartsInventoryCheck:add']"
-                >新增</el-button>
-            </el-col>
-            <el-col :span="1.5">
-                <el-button
-                        type="success"
-                        plain
-                        icon="el-icon-edit"
-                        size="mini"
-                        :disabled="single"
-                        @click="handleUpdate"
-                        v-hasPermi="['ems/info:sparePartsInventoryCheck:edit']"
-                >修改</el-button>
-            </el-col>
-            <el-col :span="1.5">
-                <el-button
-                        type="danger"
-                        plain
-                        icon="el-icon-delete"
-                        size="mini"
-                        :disabled="multiple"
-                        @click="handleDelete"
-                        v-hasPermi="['ems/info:sparePartsInventoryCheck:remove']"
-                >删除</el-button>
-            </el-col>
-            <el-col :span="1.5">
-                <el-button
-                        type="warning"
-                        plain
-                        icon="el-icon-download"
-                        size="mini"
-                        @click="handleExport"
-                        v-hasPermi="['ems/info:sparePartsInventoryCheck:export']"
-                >导出</el-button>
-            </el-col>
-            <el-col :span="1.5">
-                <el-button
-                        type="info"
-                        plain
-                        icon="el-icon-upload2"
-                        size="mini"
-                        @click="handleImport"
-                        v-hasPermi="['ems/info:sparePartsInventoryCheck:add']"
-                >导入</el-button>
-            </el-col>
-            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
-        </el-row>
+<!--        <el-row :gutter="10" class="mb8">-->
+<!--            <el-col :span="1.5">-->
+<!--                <el-button-->
+<!--                        type="primary"-->
+<!--                        plain-->
+<!--                        icon="el-icon-plus"-->
+<!--                        size="mini"-->
+<!--                        @click="handleAdd"-->
+<!--                        v-hasPermi="['ems/info:sparePartsInventoryCheck:add']"-->
+<!--                >新增</el-button>-->
+<!--            </el-col>-->
+<!--            <el-col :span="1.5">-->
+<!--                <el-button-->
+<!--                        type="success"-->
+<!--                        plain-->
+<!--                        icon="el-icon-edit"-->
+<!--                        size="mini"-->
+<!--                        :disabled="single"-->
+<!--                        @click="handleUpdate"-->
+<!--                        v-hasPermi="['ems/info:sparePartsInventoryCheck:edit']"-->
+<!--                >修改</el-button>-->
+<!--            </el-col>-->
+<!--            <el-col :span="1.5">-->
+<!--                <el-button-->
+<!--                        type="danger"-->
+<!--                        plain-->
+<!--                        icon="el-icon-delete"-->
+<!--                        size="mini"-->
+<!--                        :disabled="multiple"-->
+<!--                        @click="handleDelete"-->
+<!--                        v-hasPermi="['ems/info:sparePartsInventoryCheck:remove']"-->
+<!--                >删除</el-button>-->
+<!--            </el-col>-->
+<!--            <el-col :span="1.5">-->
+<!--                <el-button-->
+<!--                        type="warning"-->
+<!--                        plain-->
+<!--                        icon="el-icon-download"-->
+<!--                        size="mini"-->
+<!--                        @click="handleExport"-->
+<!--                        v-hasPermi="['ems/info:sparePartsInventoryCheck:export']"-->
+<!--                >导出</el-button>-->
+<!--            </el-col>-->
+<!--            <el-col :span="1.5">-->
+<!--                <el-button-->
+<!--                        type="info"-->
+<!--                        plain-->
+<!--                        icon="el-icon-upload2"-->
+<!--                        size="mini"-->
+<!--                        @click="handleImport"-->
+<!--                        v-hasPermi="['ems/info:sparePartsInventoryCheck:add']"-->
+<!--                >导入</el-button>-->
+<!--            </el-col>-->
+<!--            <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>-->
+<!--        </el-row>-->
 
-        <el-table v-loading="loading" :data="sparePartsInventoryCheckList" @selection-change="handleSelectionChange">
-            <el-table-column type="selection" width="55" align="center" />
-                    <el-table-column label="主键" align="center" prop="id" v-if="columns[0].visible"/>
-                    <el-table-column label="备件库存主表ID" align="center" prop="inventoryObjid" v-if="columns[1].visible"/>
-                    <el-table-column label="盘点名称" align="center" prop="checkName" v-if="columns[2].visible"/>
-                    <el-table-column label="盘点数量" align="center" prop="checkQuantity" v-if="columns[3].visible"/>
-                    <el-table-column label="盘点日期" align="center" prop="checkDate" v-if="columns[4].visible"/>
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100">
-                <template slot-scope="scope">
-                    <el-button
-                            size="mini"
-                            type="text"
-                            icon="el-icon-edit"
-                            @click="handleUpdate(scope.row)"
-                            v-hasPermi="['ems/info:sparePartsInventoryCheck:edit']"
-                    >修改</el-button>
-                    <el-button
-                            size="mini"
-                            type="text"
-                            icon="el-icon-delete"
-                            @click="handleDelete(scope.row)"
-                            v-hasPermi="['ems/info:sparePartsInventoryCheck:remove']"
-                    >删除</el-button>
-                </template>
-            </el-table-column>
-        </el-table>
+<!--        <el-table v-loading="loading" :data="sparePartsInventoryCheckList" @selection-change="handleSelectionChange">-->
+<!--            <el-table-column type="selection" width="55" align="center" />-->
+<!--                    <el-table-column label="主键" align="center" prop="id" v-if="columns[0].visible"/>-->
+<!--                    <el-table-column label="备件库存主表ID" align="center" prop="inventoryObjid" v-if="columns[1].visible"/>-->
+<!--                    <el-table-column label="盘点名称" align="center" prop="checkName" v-if="columns[2].visible"/>-->
+<!--                    <el-table-column label="盘点数量" align="center" prop="checkQuantity" v-if="columns[3].visible"/>-->
+<!--                    <el-table-column label="盘点日期" align="center" prop="checkDate" v-if="columns[4].visible"/>-->
+<!--            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100">-->
+<!--                <template slot-scope="scope">-->
+<!--                    <el-button-->
+<!--                            size="mini"-->
+<!--                            type="text"-->
+<!--                            icon="el-icon-edit"-->
+<!--                            @click="handleUpdate(scope.row)"-->
+<!--                            v-hasPermi="['ems/info:sparePartsInventoryCheck:edit']"-->
+<!--                    >修改</el-button>-->
+<!--                    <el-button-->
+<!--                            size="mini"-->
+<!--                            type="text"-->
+<!--                            icon="el-icon-delete"-->
+<!--                            @click="handleDelete(scope.row)"-->
+<!--                            v-hasPermi="['ems/info:sparePartsInventoryCheck:remove']"-->
+<!--                    >删除</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"
-        />
+<!--        <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="500px" append-to-body>
-            <el-form ref="form" :model="form" :rules="rules" label-width="100px">
-                                <el-form-item label="备件库存主表ID" prop="inventoryObjid">
-                                    <el-input v-model="form.inventoryObjid" placeholder="请输入备件库存主表ID" />
-                                </el-form-item>
-                                <el-form-item label="盘点名称" prop="checkName">
-                                    <el-input v-model="form.checkName" placeholder="请输入盘点名称" />
-                                </el-form-item>
-                                <el-form-item label="盘点数量" prop="checkQuantity">
-                                    <el-input v-model="form.checkQuantity" placeholder="请输入盘点数量" />
-                                </el-form-item>
-                                <el-form-item label="盘点日期" prop="checkDate">
-                                    <el-date-picker
-                                        v-model="form.checkDate"
-                                        type="date"
-                                        placeholder="请选择盘点日期"
-                                        value-format="yyyy/MM/dd"
-                                        format="yyyy/MM/dd"
-                                    />
-                                </el-form-item>
-            </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>
+<!--        &lt;!&ndash; 添加  或修改  备件盘点记录明细对话框 &ndash;&gt;-->
+<!--        <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>-->
+<!--            <el-form ref="form" :model="form" :rules="rules" label-width="100px">-->
+<!--                                <el-form-item label="备件库存主表ID" prop="inventoryObjid">-->
+<!--                                    <el-input v-model="form.inventoryObjid" placeholder="请输入备件库存主表ID" />-->
+<!--                                </el-form-item>-->
+<!--                                <el-form-item label="盘点名称" prop="checkName">-->
+<!--                                    <el-input v-model="form.checkName" placeholder="请输入盘点名称" />-->
+<!--                                </el-form-item>-->
+<!--                                <el-form-item label="盘点数量" prop="checkQuantity">-->
+<!--                                    <el-input v-model="form.checkQuantity" placeholder="请输入盘点数量" />-->
+<!--                                </el-form-item>-->
+<!--                                <el-form-item label="盘点日期" prop="checkDate">-->
+<!--                                    <el-date-picker-->
+<!--                                        v-model="form.checkDate"-->
+<!--                                        type="date"-->
+<!--                                        placeholder="请选择盘点日期"-->
+<!--                                        value-format="yyyy/MM/dd"-->
+<!--                                        format="yyyy/MM/dd"-->
+<!--                                    />-->
+<!--                                </el-form-item>-->
+<!--            </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="upload.title" :visible.sync="upload.open" width="400px" append-to-body>
-            <el-upload
-                ref="upload"
-                :limit="1"
-                accept=".xlsx, .xls"
-                :headers="upload.headers"
-                :action="upload.url + '?updateSupport=' + upload.updateSupport"
-                :disabled="upload.isUploading"
-                :on-progress="handleFileUploadProgress"
-                :on-success="handleFileSuccess"
-                :auto-upload="false"
-                drag
-            >
-                <i class="el-icon-upload"></i>
-                <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
-                <div class="el-upload__tip text-center" slot="tip">
-<!--                    <div class="el-upload__tip" slot="tip">-->
-<!--                        <el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的数据-->
-<!--                    </div>-->
-                    <span>仅允许导入xls、xlsx格式文件。</span>
-<!--                    <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="importTemplate">下载模板</el-link>-->
-                </div>
-            </el-upload>
-            <div slot="footer" class="dialog-footer">
-                <el-button type="primary" @click="submitFileForm">确 定</el-button>
-                <el-button @click="upload.open = false">取 消</el-button>
-            </div>
-        </el-dialog>
-    </div>
-</template>
+<!--        &lt;!&ndash; 导入对话框 &ndash;&gt;-->
+<!--        <el-dialog :title="upload.title" :visible.sync="upload.open" width="400px" append-to-body>-->
+<!--            <el-upload-->
+<!--                ref="upload"-->
+<!--                :limit="1"-->
+<!--                accept=".xlsx, .xls"-->
+<!--                :headers="upload.headers"-->
+<!--                :action="upload.url + '?updateSupport=' + upload.updateSupport"-->
+<!--                :disabled="upload.isUploading"-->
+<!--                :on-progress="handleFileUploadProgress"-->
+<!--                :on-success="handleFileSuccess"-->
+<!--                :auto-upload="false"-->
+<!--                drag-->
+<!--            >-->
+<!--                <i class="el-icon-upload"></i>-->
+<!--                <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>-->
+<!--                <div class="el-upload__tip text-center" slot="tip">-->
+<!--&lt;!&ndash;                    <div class="el-upload__tip" slot="tip">&ndash;&gt;-->
+<!--&lt;!&ndash;                        <el-checkbox v-model="upload.updateSupport" /> 是否更新已经存在的数据&ndash;&gt;-->
+<!--&lt;!&ndash;                    </div>&ndash;&gt;-->
+<!--                    <span>仅允许导入xls、xlsx格式文件。</span>-->
+<!--&lt;!&ndash;                    <el-link type="primary" :underline="false" style="font-size:12px;vertical-align: baseline;" @click="importTemplate">下载模板</el-link>&ndash;&gt;-->
+<!--                </div>-->
+<!--            </el-upload>-->
+<!--            <div slot="footer" class="dialog-footer">-->
+<!--                <el-button type="primary" @click="submitFileForm">确 定</el-button>-->
+<!--                <el-button @click="upload.open = false">取 消</el-button>-->
+<!--            </div>-->
+<!--        </el-dialog>-->
+<!--    </div>-->
+<!--</template>-->
 
-<script>
-    import { listSparePartsInventoryCheck, getSparePartsInventoryCheck, delSparePartsInventoryCheck, addSparePartsInventoryCheck, updateSparePartsInventoryCheck } from "@/api/ems/info/sparePartsInventoryCheck";
+<!--<script>-->
+<!--    import { listSparePartsInventoryCheck, getSparePartsInventoryCheck, delSparePartsInventoryCheck, addSparePartsInventoryCheck, updateSparePartsInventoryCheck } from "@/api/ems/info/sparePartsInventoryCheck";-->
 
-    export default {
-        name: "SparePartsInventoryCheck",
-        data() {
-            return {
-                // 遮罩层
-                loading: true,
-                // 选中数组
-                ids: [],
-                // 非单个禁用
-                single: true,
-                // 非多个禁用
-                multiple: true,
-                // 显示搜索条件
-                showSearch: true,
-                // 总条数
-                total: 0,
-                // 备件盘点记录明细表格数据
-                    sparePartsInventoryCheckList: [],
-                // 弹出层标题
-                title: "",
-                // 是否显示弹出层
-                open: false,
-                // 查询参数
-                queryParams: {
-                    pageNum: 1,
-                    pageSize: 10,
-                                inventoryObjid: null,
-                                checkName: null,
-                                checkQuantity: null,
-                                checkDate: null
-                },
-                // 表单参数
-                form: {},
-                // 表单校验
-                rules: {
-                },
-                columns: [
-                        { key: 0, label: `主键`, visible: false },
-                        { key: 1, label: `备件库存主表ID`, visible: true },
-                        { key: 2, label: `盘点名称`, visible: true },
-                        { key: 3, label: `盘点数量`, visible: true },
-                        { key: 4, label: `盘点日期`, visible: true },
-                ],
-                upload: {
-                    title: "导入备件盘点记录明细",
-                    open: false,
-                    url: "",
-                    updateSupport: false,
-                    isUploading: false,
-                    headers: {}
-                }
-            };
-        },
-        created() {
-            this.getList();
-            this.upload.url = process.env.VUE_APP_BASE_API + "/ems/info/sparePartsInventoryCheck/importData";
-            this.upload.headers = { Authorization: "Bearer " + this.$store.getters.token };
-        },
-        methods: {
-            /** 查询备件盘点记录明细列表 */
-            getList() {
-                this.loading = true;
-                listSparePartsInventoryCheck(this.queryParams).then(response => {
-                    this.sparePartsInventoryCheckList = response.rows;
-                    this.total = response.total;
-                    this.loading = false;
-                });
-            },
-            // 取消按钮
-            cancel() {
-                this.open = false;
-                this.reset();
-            },
-            // 表单重置
-            reset() {
-                this.form = {
-                                id: null,
-                                inventoryObjid: null,
-                                checkName: null,
-                                checkQuantity: null,
-                                checkDate: null
-                };
-                this.resetForm("form");
-            },
-            /** 搜索按钮操作 */
-            handleQuery() {
-                this.queryParams.pageNum = 1;
-                this.getList();
-            },
-            /** 重置按钮操作 */
-            resetQuery() {
-                this.resetForm("queryForm");
-                this.handleQuery();
-            },
-            // 多选框选中数据
-            handleSelectionChange(selection) {
-                this.ids = selection.map(item => item.id)
-                this.single = selection.length!==1
-                this.multiple = !selection.length
-            },
-            /** 新增按钮操作 */
-            handleAdd() {
-                this.reset();
-                this.open = true;
-                this.title = "添加备件盘点记录明细";
-            },
-            /** 修改按钮操作 */
-            handleUpdate(row) {
-                this.reset();
-                const id = row.id || this.ids
-                getSparePartsInventoryCheck(id).then(response => {
-                    this.form = response.data;
-                    this.open = true;
-                    this.title = "修改备件盘点记录明细";
-                });
-            },
-            /** 提交按钮 */
-            submitForm() {
-                this.$refs["form"].validate(valid => {
-                    if (valid) {
-                        if (this.form.id != null) {
-                            updateSparePartsInventoryCheck(this.form).then(response => {
-                                this.$modal.msgSuccess("修改成功");
-                                this.open = false;
-                                this.getList();
-                            });
-                        } else {
-                            addSparePartsInventoryCheck(this.form).then(response => {
-                                this.$modal.msgSuccess("新增成功");
-                                this.open = false;
-                                this.getList();
-                            });
-                        }
-                    }
-                });
-            },
-            /** 删除按钮操作 */
-            handleDelete(row) {
-                const ids = row.id || this.ids;
-                this.$modal.confirm('是否确认删除备件盘点记录明细编号为"' + ids + '"的数据项？').then(function() {
-                    return delSparePartsInventoryCheck(ids);
-                }).then(() => {
-                    this.getList();
-                    this.$modal.msgSuccess("删除成功");
-                }).catch(() => {});
-            },
-    /** 导出按钮操作 */
-    handleExport() {
-        this.download('ems/info/sparePartsInventoryCheck/export', {
-            ...this.queryParams
-        }, `sparePartsInventoryCheck_${new Date().getTime()}.xlsx`)
-    },
-    /** 导入按钮操作 */
-    handleImport() {
-        this.upload.title = "导入备件盘点记录明细";
-        this.upload.open = true;
-    },
-    /** 下载模板操作 */
-    importTemplate() {
-        this.download('ems/info/sparePartsInventoryCheck/importTemplate', {
-        }, `备件盘点记录明细数据模板_${new Date().getTime()}.xlsx`)
-    },
-    // 文件上传中处理
-    handleFileUploadProgress(event, file, fileList) {
-        this.upload.isUploading = true;
-    },
-    // 文件上传成功处理
-    handleFileSuccess(response, file, fileList) {
-        this.upload.open = false;
-        this.upload.isUploading = false;
-        this.$refs.upload.clearFiles();
-        this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });
-        this.getList();
-    },
-    // 提交上传文件
-    submitFileForm() {
-        this.$refs.upload.submit();
-    }
-    }
-    };
-</script>
+<!--    export default {-->
+<!--        name: "SparePartsInventoryCheck",-->
+<!--        data() {-->
+<!--            return {-->
+<!--                // 遮罩层-->
+<!--                loading: true,-->
+<!--                // 选中数组-->
+<!--                ids: [],-->
+<!--                // 非单个禁用-->
+<!--                single: true,-->
+<!--                // 非多个禁用-->
+<!--                multiple: true,-->
+<!--                // 显示搜索条件-->
+<!--                showSearch: true,-->
+<!--                // 总条数-->
+<!--                total: 0,-->
+<!--                // 备件盘点记录明细表格数据-->
+<!--                    sparePartsInventoryCheckList: [],-->
+<!--                // 弹出层标题-->
+<!--                title: "",-->
+<!--                // 是否显示弹出层-->
+<!--                open: false,-->
+<!--                // 查询参数-->
+<!--                queryParams: {-->
+<!--                    pageNum: 1,-->
+<!--                    pageSize: 10,-->
+<!--                                inventoryObjid: null,-->
+<!--                                checkName: null,-->
+<!--                                checkQuantity: null,-->
+<!--                                checkDate: null-->
+<!--                },-->
+<!--                // 表单参数-->
+<!--                form: {},-->
+<!--                // 表单校验-->
+<!--                rules: {-->
+<!--                },-->
+<!--                columns: [-->
+<!--                        { key: 0, label: `主键`, visible: false },-->
+<!--                        { key: 1, label: `备件库存主表ID`, visible: true },-->
+<!--                        { key: 2, label: `盘点名称`, visible: true },-->
+<!--                        { key: 3, label: `盘点数量`, visible: true },-->
+<!--                        { key: 4, label: `盘点日期`, visible: true },-->
+<!--                ],-->
+<!--                upload: {-->
+<!--                    title: "导入备件盘点记录明细",-->
+<!--                    open: false,-->
+<!--                    url: "",-->
+<!--                    updateSupport: false,-->
+<!--                    isUploading: false,-->
+<!--                    headers: {}-->
+<!--                }-->
+<!--            };-->
+<!--        },-->
+<!--        created() {-->
+<!--            this.getList();-->
+<!--            this.upload.url = process.env.VUE_APP_BASE_API + "/ems/info/sparePartsInventoryCheck/importData";-->
+<!--            this.upload.headers = { Authorization: "Bearer " + this.$store.getters.token };-->
+<!--        },-->
+<!--        methods: {-->
+<!--            /** 查询备件盘点记录明细列表 */-->
+<!--            getList() {-->
+<!--                this.loading = true;-->
+<!--                listSparePartsInventoryCheck(this.queryParams).then(response => {-->
+<!--                    this.sparePartsInventoryCheckList = response.rows;-->
+<!--                    this.total = response.total;-->
+<!--                    this.loading = false;-->
+<!--                });-->
+<!--            },-->
+<!--            // 取消按钮-->
+<!--            cancel() {-->
+<!--                this.open = false;-->
+<!--                this.reset();-->
+<!--            },-->
+<!--            // 表单重置-->
+<!--            reset() {-->
+<!--                this.form = {-->
+<!--                                id: null,-->
+<!--                                inventoryObjid: null,-->
+<!--                                checkName: null,-->
+<!--                                checkQuantity: null,-->
+<!--                                checkDate: null-->
+<!--                };-->
+<!--                this.resetForm("form");-->
+<!--            },-->
+<!--            /** 搜索按钮操作 */-->
+<!--            handleQuery() {-->
+<!--                this.queryParams.pageNum = 1;-->
+<!--                this.getList();-->
+<!--            },-->
+<!--            /** 重置按钮操作 */-->
+<!--            resetQuery() {-->
+<!--                this.resetForm("queryForm");-->
+<!--                this.handleQuery();-->
+<!--            },-->
+<!--            // 多选框选中数据-->
+<!--            handleSelectionChange(selection) {-->
+<!--                this.ids = selection.map(item => item.id)-->
+<!--                this.single = selection.length!==1-->
+<!--                this.multiple = !selection.length-->
+<!--            },-->
+<!--            /** 新增按钮操作 */-->
+<!--            handleAdd() {-->
+<!--                this.reset();-->
+<!--                this.open = true;-->
+<!--                this.title = "添加  备件盘点记录明细";-->
+<!--            },-->
+<!--            /** 修改  按钮操作 */-->
+<!--            handleUpdate(row) {-->
+<!--                this.reset();-->
+<!--                const id = row.id || this.ids-->
+<!--                getSparePartsInventoryCheck(id).then(response => {-->
+<!--                    this.form = response.data;-->
+<!--                    this.open = true;-->
+<!--                    this.title = "修改  备件盘点记录明细";-->
+<!--                });-->
+<!--            },-->
+<!--            /** 提交按钮 */-->
+<!--            submitForm() {-->
+<!--                this.$refs["form"].validate(valid => {-->
+<!--                    if (valid) {-->
+<!--                        if (this.form.id != null) {-->
+<!--                            updateSparePartsInventoryCheck(this.form).then(response => {-->
+<!--                                this.$modal.msgSuccess("修改成功");-->
+<!--                                this.open = false;-->
+<!--                                this.getList();-->
+<!--                            });-->
+<!--                        } else {-->
+<!--                            addSparePartsInventoryCheck(this.form).then(response => {-->
+<!--                                this.$modal.msgSuccess("新增成功");-->
+<!--                                this.open = false;-->
+<!--                                this.getList();-->
+<!--                            });-->
+<!--                        }-->
+<!--                    }-->
+<!--                });-->
+<!--            },-->
+<!--            /** 删除按钮操作 */-->
+<!--            handleDelete(row) {-->
+<!--                const ids = row.id || this.ids;-->
+<!--                this.$modal.confirm('是否确认删除备件盘点记录明细编号为"' + ids + '"的数据项？').then(function() {-->
+<!--                    return delSparePartsInventoryCheck(ids);-->
+<!--                }).then(() => {-->
+<!--                    this.getList();-->
+<!--                    this.$modal.msgSuccess("删除成功");-->
+<!--                }).catch(() => {});-->
+<!--            },-->
+<!--    /** 导出按钮操作 */-->
+<!--    handleExport() {-->
+<!--        this.download('ems/info/sparePartsInventoryCheck/export', {-->
+<!--            ...this.queryParams-->
+<!--        }, `sparePartsInventoryCheck_${new Date().getTime()}.xlsx`)-->
+<!--    },-->
+<!--    /** 导入按钮操作 */-->
+<!--    handleImport() {-->
+<!--        this.upload.title = "导入备件盘点记录明细";-->
+<!--        this.upload.open = true;-->
+<!--    },-->
+<!--    /** 下载模板操作 */-->
+<!--    importTemplate() {-->
+<!--        this.download('ems/info/sparePartsInventoryCheck/importTemplate', {-->
+<!--        }, `备件盘点记录明细数据模板_${new Date().getTime()}.xlsx`)-->
+<!--    },-->
+<!--    // 文件上传中处理-->
+<!--    handleFileUploadProgress(event, file, fileList) {-->
+<!--        this.upload.isUploading = true;-->
+<!--    },-->
+<!--    // 文件上传成功处理-->
+<!--    handleFileSuccess(response, file, fileList) {-->
+<!--        this.upload.open = false;-->
+<!--        this.upload.isUploading = false;-->
+<!--        this.$refs.upload.clearFiles();-->
+<!--        this.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true });-->
+<!--        this.getList();-->
+<!--    },-->
+<!--    // 提交上传文件-->
+<!--    submitFileForm() {-->
+<!--        this.$refs.upload.submit();-->
+<!--    }-->
+<!--    }-->
+<!--    };-->
+<!--</script>-->
diff --git a/src/views/ems/info/sparePartsRegistration/index.vue b/src/views/ems/info/sparePartsRegistration/index.vue
index c2f82ea..ba0a4bd 100644
--- a/src/views/ems/info/sparePartsRegistration/index.vue
+++ b/src/views/ems/info/sparePartsRegistration/index.vue
@@ -127,9 +127,13 @@
             <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
         </el-row>
 
-        <el-table v-loading="loading" :data="sparePartsRegistrationList" @selection-change="handleSelectionChange">
+        <el-table v-loading="loading" :data="sparePartsRegistrationList" @selection-change="handleSelectionChange" @row-contextmenu="handleRowContextMenu" class="context-menu-table">
             <el-table-column type="selection" width="55" align="center" />
-                    <el-table-column label="主键，自增ID" align="center" prop="objid" v-if="columns[0].visible"/>
+          <el-table-column label="序号" align="center" width="60" v-if="columns[0].visible">
+            <template slot-scope="scope">
+              {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
+            </template>
+          </el-table-column>
                     <el-table-column label="日期" align="center" prop="date" v-if="columns[1].visible">
                     </el-table-column>
                     <el-table-column label="备件名称" align="center" prop="sparePartsName" v-if="columns[2].visible">
@@ -145,8 +149,14 @@
                     </el-table-column>
                     <el-table-column label="备注" align="center" prop="remarks" v-if="columns[7].visible">
                     </el-table-column>
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160">
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="200">
                 <template slot-scope="scope">
+                    <el-button
+                            size="mini"
+                            type="text"
+                            icon="el-icon-view"
+                            @click="handleViewDetail(scope.row)"
+                    >详情</el-button>
                     <el-button
                             size="mini"
                             type="text"
@@ -179,7 +189,7 @@
                 @pagination="getList"
         />
 
-        <!-- 添加或修改动力能源部行输科废旧备件登记对话框 -->
+        <!-- 添加  或修改  动力能源部行输科废旧备件登记对话框 -->
         <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
             <el-form ref="form" :model="form" :rules="rules" label-width="100px">
                                 <el-form-item label="日期" prop="date">
@@ -237,12 +247,108 @@
                 <el-button @click="upload.open = false">取 消</el-button>
             </div>
         </el-dialog>
+
+        <!-- 详情抽屉 -->
+        <el-drawer
+            title="备件登记详情"
+            :visible.sync="detailDrawer"
+            direction="rtl"
+            size="50%"
+            :before-close="() => detailDrawer = false"
+        >
+            <div style="padding: 20px;">
+                <el-descriptions :column="1" border>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">日期</span>
+                        </template>
+                        {{ currentRecord.date || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">备件名称</span>
+                        </template>
+                        {{ currentRecord.sparePartsName || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">备件型号</span>
+                        </template>
+                        {{ currentRecord.sparePartModel || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">废存数量</span>
+                        </template>
+                        {{ currentRecord.wasteQuantity || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">存放位置</span>
+                        </template>
+                        {{ currentRecord.storageLocation || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">登记人</span>
+                        </template>
+                        {{ currentRecord.registrar || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">库管确认</span>
+                        </template>
+                        {{ currentRecord.warehouseConfirmation || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">备注</span>
+                        </template>
+                        <div style="max-height: 100px; overflow-y: auto;">
+                            {{ currentRecord.remarks || '-' }}
+                        </div>
+                    </el-descriptions-item>
+                </el-descriptions>
+            </div>
+        </el-drawer>
+
+        <!-- 右击菜单 -->
+        <div
+            v-show="contextMenu.visible"
+            :style="{
+                position: 'fixed',
+                top: contextMenu.top + 'px',
+                left: contextMenu.left + 'px',
+                zIndex: 9999
+            }"
+            class="context-menu"
+            @click.stop
+        >
+            <div class="context-menu-item" @click="contextMenuViewDetail">
+                <i class="el-icon-view"></i> 查看详情
+            </div>
+            <div
+                class="context-menu-item"
+                @click="contextMenuEdit"
+                v-if="checkPermi(['ems/info:sparePartsRegistration:edit'])"
+            >
+                <i class="el-icon-edit"></i> 修改
+            </div>
+            <div
+                class="context-menu-item"
+                @click="contextMenuDelete"
+                v-if="checkPermi(['ems/info:sparePartsRegistration:remove'])"
+            >
+                <i class="el-icon-delete"></i> 删除
+            </div>
+        </div>
     </div>
 </template>
 
 <script>
     import { listSparePartsRegistration, getSparePartsRegistration, delSparePartsRegistration, addSparePartsRegistration, updateSparePartsRegistration } from "@/api/ems/info/sparePartsRegistration";
     import { getToken } from "@/utils/auth";
+    import { checkPermi } from "@/utils/permission";
 
     export default {
         name: "SparePartsRegistration",
@@ -290,7 +396,7 @@
 
                 },
                 columns: [
-                        { key: 0, label: `主键，自增ID`, visible: false },
+                        { key: 0, label: `序号`, visible: true },
                         { key: 1, label: `日期`, visible: true },
                         { key: 2, label: `备件名称`, visible: true },
                         { key: 3, label: `废存数量`, visible: true },
@@ -314,12 +420,28 @@
                     headers: { Authorization: "Bearer " + getToken() },
                     // 上传的地址
                     url: process.env.VUE_APP_BASE_API + "/ems/info/sparePartsRegistration/importData"
+                },
+                // 详情抽屉
+                detailDrawer: false,
+                currentRecord: {},
+                // 右击菜单
+                contextMenu: {
+                    visible: false,
+                    top: 0,
+                    left: 0,
+                    row: null
                 }
             };
         },
         created() {
             this.getList();
         },
+        mounted() {
+            document.addEventListener('click', this.hideContextMenu);
+        },
+        beforeDestroy() {
+            document.removeEventListener('click', this.hideContextMenu);
+        },
         methods: {
             /** 查询动力能源部行输科废旧备件登记列表 */
             getList() {
@@ -374,16 +496,16 @@
                     this.form.sparePartModel = this.copiedData.sparePartModel;
                 }
                 this.open = true;
-                this.title = "添加动力能源部行输科废旧备件登记";
+                this.title = "添加  动力能源部行输科废旧备件登记";
             },
-            /** 修改按钮操作 */
+            /** 修改  按钮操作 */
             handleUpdate(row) {
                 this.reset();
                 const objid = row.objid || this.ids
                 getSparePartsRegistration(objid).then(response => {
                     this.form = response.data;
                     this.open = true;
-                    this.title = "修改动力能源部行输科废旧备件登记";
+                    this.title = "修改  动力能源部行输科废旧备件登记";
                 });
             },
             /** 提交按钮 */
@@ -455,7 +577,108 @@
             sparePartModel: row.sparePartModel
         };
         this.$modal.msgSuccess("已复制备件名称和型号");
+    },
+    // 查看详情
+    handleViewDetail(row) {
+        this.currentRecord = { ...row };
+        this.detailDrawer = true;
+    },
+    // 处理表格行右击事件
+    handleRowContextMenu(row, column, event) {
+        event.preventDefault();
+        this.contextMenu.row = row;
+        this.contextMenu.visible = true;
+
+        // 计算菜单位置
+        const x = event.clientX;
+        const y = event.clientY;
+        const menuWidth = 120;
+        const menuHeight = 120;
+        const windowWidth = window.innerWidth;
+        const windowHeight = window.innerHeight;
+
+        this.contextMenu.left = (x + menuWidth > windowWidth) ? x - menuWidth : x;
+        this.contextMenu.top = (y + menuHeight > windowHeight) ? y - menuHeight : y;
+    },
+    // 隐藏右击菜单
+    hideContextMenu() {
+        this.contextMenu.visible = false;
+    },
+    // 右击菜单 - 查看详情
+    contextMenuViewDetail() {
+        if (this.contextMenu.row) {
+            this.handleViewDetail(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 右击菜单 - 修改
+    contextMenuEdit() {
+        if (this.contextMenu.row && this.checkPermi(['ems/info:sparePartsRegistration:edit'])) {
+            this.handleUpdate(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 右击菜单 - 删除
+    contextMenuDelete() {
+        if (this.contextMenu.row && this.checkPermi(['ems/info:sparePartsRegistration:remove'])) {
+            this.handleDelete(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 权限检查方法
+    checkPermi(permissions) {
+        return checkPermi(permissions);
     }
     }
     };
 </script>
+
+<style scoped>
+.context-menu-table tbody tr:hover {
+    cursor: context-menu;
+}
+
+.context-menu {
+    background: white;
+    border: 1px solid #ebeef5;
+    border-radius: 4px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    padding: 4px 0;
+    min-width: 120px;
+}
+
+.context-menu-item {
+    padding: 8px 16px;
+    cursor: pointer;
+    font-size: 14px;
+    color: #606266;
+    display: flex;
+    align-items: center;
+}
+
+.context-menu-item:hover {
+    background-color: #f5f7fa;
+    color: #409eff;
+}
+
+.context-menu-item i {
+    margin-right: 8px;
+    font-size: 14px;
+}
+
+.el-descriptions__label {
+    width: 90px !important;
+}
+
+@media (max-width: 768px) {
+    .el-drawer {
+        width: 90% !important;
+    }
+}
+
+@media print {
+    .context-menu {
+        display: none !important;
+    }
+}
+</style>
diff --git a/src/views/ems/info/sparePartsUsageRecord/index.vue b/src/views/ems/info/sparePartsUsageRecord/index.vue
index 2631eb1..ddaf998 100644
--- a/src/views/ems/info/sparePartsUsageRecord/index.vue
+++ b/src/views/ems/info/sparePartsUsageRecord/index.vue
@@ -151,9 +151,13 @@
             <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
         </el-row>
 
-        <el-table v-loading="loading" :data="sparePartsUsageRecordList" @selection-change="handleSelectionChange">
+        <el-table v-loading="loading" :data="sparePartsUsageRecordList" @selection-change="handleSelectionChange" @row-contextmenu="handleRowContextMenu" class="context-menu-table">
             <el-table-column type="selection" width="55" align="center" />
-                    <el-table-column label="主键，自增ID" align="center" prop="id" v-if="columns[0].visible"/>
+          <el-table-column label="序号" align="center" width="60" v-if="columns[0].visible">
+            <template slot-scope="scope">
+              {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
+            </template>
+          </el-table-column>
                     <el-table-column label="日期" align="center" prop="date" v-if="columns[1].visible"/>
                     <el-table-column label="备件名称" align="center" prop="sparePartName" v-if="columns[2].visible"/>
                     <el-table-column label="备件型号" align="center" prop="sparePartModel" v-if="columns[3].visible"/>
@@ -165,8 +169,15 @@
                     <el-table-column label="库管确认人" align="center" prop="warehouseManagerConfirmation" v-if="columns[9].visible"/>
                     <el-table-column label="库存表状态" align="center" prop="inventoryStatus" v-if="columns[10].visible"/>
                     <el-table-column label="部门仓库" align="center" prop="departmentWarehouse" v-if="columns[11].visible"/>
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="160">
+                    <el-table-column label="备注" align="center" prop="remarks" v-if="columns[12].visible" show-overflow-tooltip/>
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="200">
                 <template slot-scope="scope">
+                    <el-button
+                            size="mini"
+                            type="text"
+                            icon="el-icon-view"
+                            @click="handleViewDetail(scope.row)"
+                    >详情</el-button>
                     <el-button
                             size="mini"
                             type="text"
@@ -199,7 +210,7 @@
                 @pagination="getList"
         />
 
-        <!-- 添加或修改动力能源部行输科备件领用更换记录对话框 -->
+        <!-- 添加  或修改  动力能源部行输科备件领用更换记录对话框 -->
         <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
             <el-form ref="form" :model="form" :rules="rules" label-width="100px">
                                 <el-form-item label="日期" prop="date">
@@ -241,6 +252,9 @@
                                 <el-form-item label="部门仓库" prop="departmentWarehouse">
                                     <el-input v-model="form.departmentWarehouse" placeholder="请输入部门仓库" />
                                 </el-form-item>
+                                <el-form-item label="备注" prop="remarks">
+                                    <el-input v-model="form.remarks" type="textarea" :rows="3" placeholder="请输入备注" />
+                                </el-form-item>
             </el-form>
             <div slot="footer" class="dialog-footer">
                 <el-button type="primary" @click="submitForm">确 定</el-button>
@@ -254,11 +268,11 @@
                 <i class="el-icon-upload"></i>
                 <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
                 <div class="el-upload__tip text-center" slot="tip">
-                    <div class="el-upload__tip" slot="tip">
-                        <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的数据
-                    </div>
+<!--                    <div class="el-upload__tip" slot="tip">-->
+<!--                        <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的数据-->
+<!--                    </div>-->
                     <span>仅允许导入xls、xlsx格式文件。</span>
-                    <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate">下载模板</el-link>
+<!--                    <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate">下载模板</el-link>-->
                 </div>
             </el-upload>
             <div slot="footer" class="dialog-footer">
@@ -266,12 +280,132 @@
                 <el-button @click="upload.open = false">取 消</el-button>
             </div>
         </el-dialog>
+
+        <!-- 详情抽屉 -->
+        <el-drawer
+            title="备件使用记录详情"
+            :visible.sync="detailDrawer"
+            direction="rtl"
+            size="50%"
+            :before-close="() => detailDrawer = false"
+        >
+            <div style="padding: 20px;">
+                <el-descriptions :column="1" border>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">日期</span>
+                        </template>
+                        {{ currentRecord.date || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">备件名称</span>
+                        </template>
+                        {{ currentRecord.sparePartName || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">备件型号</span>
+                        </template>
+                        {{ currentRecord.sparePartModel || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">使用数量</span>
+                        </template>
+                        {{ currentRecord.quantityUsed || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">剩余数量</span>
+                        </template>
+                        {{ currentRecord.remainingQuantity || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">领用库房</span>
+                        </template>
+                        {{ currentRecord.issuingWarehouse || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">更换位置</span>
+                        </template>
+                        {{ currentRecord.replacementLocation || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">领用人</span>
+                        </template>
+                        {{ currentRecord.personReceived || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">库管确认人</span>
+                        </template>
+                        {{ currentRecord.warehouseManagerConfirmation || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">库存表状态</span>
+                        </template>
+                        {{ currentRecord.inventoryStatus || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">部门仓库</span>
+                        </template>
+                        {{ currentRecord.departmentWarehouse || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">备注</span>
+                        </template>
+                        <div style="max-height: 100px; overflow-y: auto; word-wrap: break-word;">
+                            {{ currentRecord.remarks || '-' }}
+                        </div>
+                    </el-descriptions-item>
+                </el-descriptions>
+            </div>
+        </el-drawer>
+
+        <!-- 右击菜单 -->
+        <div
+            v-show="contextMenu.visible"
+            :style="{
+                position: 'fixed',
+                top: contextMenu.top + 'px',
+                left: contextMenu.left + 'px',
+                zIndex: 9999
+            }"
+            class="context-menu"
+            @click.stop
+        >
+            <div class="context-menu-item" @click="contextMenuViewDetail">
+                <i class="el-icon-view"></i> 查看详情
+            </div>
+<!--            <div-->
+<!--                class="context-menu-item"-->
+<!--                @click="contextMenuEdit"-->
+<!--                v-if="checkPermi(['ems/info:sparePartsUsageRecord:edit'])"-->
+<!--            >-->
+<!--                <i class="el-icon-edit"></i> 修改-->
+<!--            </div>-->
+<!--            <div-->
+<!--                class="context-menu-item"-->
+<!--                @click="contextMenuDelete"-->
+<!--                v-if="checkPermi(['ems/info:sparePartsUsageRecord:remove'])"-->
+<!--            >-->
+<!--                <i class="el-icon-delete"></i> 删除-->
+<!--            </div>-->
+        </div>
     </div>
 </template>
 
 <script>
     import { listSparePartsUsageRecord, getSparePartsUsageRecord, delSparePartsUsageRecord, addSparePartsUsageRecord, updateSparePartsUsageRecord } from "@/api/ems/info/sparePartsUsageRecord";
     import { getToken } from "@/utils/auth";
+    import { checkPermi } from "@/utils/permission";
 
     export default {
         name: "SparePartsUsageRecord",
@@ -311,7 +445,8 @@
                                 personReceived: null,
                                 warehouseManagerConfirmation: null,
                                 inventoryStatus: null,
-                                departmentWarehouse: null
+                                departmentWarehouse: null,
+                                remarks: null
                 },
                 // 表单参数
                 form: {},
@@ -322,7 +457,7 @@
                     ],
                 },
                 columns: [
-                        { key: 0, label: `主键，自增ID`, visible: false },
+                        { key: 0, label: `序号`, visible: true },
                         { key: 1, label: `日期`, visible: true },
                         { key: 2, label: `备件名称`, visible: true },
                         { key: 3, label: `备件型号`, visible: true },
@@ -334,6 +469,7 @@
                         { key: 9, label: `库管确认人`, visible: true },
                         { key: 10, label: `库存表状态`, visible: true },
                         { key: 11, label: `部门仓库`, visible: true },
+                        { key: 12, label: `备注`, visible: true },
                 ],
                 // 数据导入参数
                 upload: {
@@ -349,12 +485,28 @@
                     headers: { Authorization: "Bearer " + getToken() },
                     // 上传的地址
                     url: process.env.VUE_APP_BASE_API + "/ems/info/sparePartsUsageRecord/importData"
+                },
+                // 详情抽屉
+                detailDrawer: false,
+                currentRecord: {},
+                // 右击菜单
+                contextMenu: {
+                    visible: false,
+                    top: 0,
+                    left: 0,
+                    row: null
                 }
             };
         },
         created() {
             this.getList();
         },
+        mounted() {
+            document.addEventListener('click', this.hideContextMenu);
+        },
+        beforeDestroy() {
+            document.removeEventListener('click', this.hideContextMenu);
+        },
         methods: {
             /** 查询动力能源部行输科备件领用更换记录列表 */
             getList() {
@@ -384,7 +536,8 @@
                                 personReceived: null,
                                 warehouseManagerConfirmation: null,
                                 inventoryStatus: null,
-                                departmentWarehouse: null
+                                departmentWarehouse: null,
+                                remarks: null
                 };
                 this.resetForm("form");
             },
@@ -413,16 +566,16 @@
                     this.form.sparePartModel = this.copiedData.sparePartModel;
                 }
                 this.open = true;
-                this.title = "添加动力能源部行输科备件领用更换记录";
+                this.title = "添加  动力能源部行输科备件领用更换记录";
             },
-            /** 修改按钮操作 */
+            /** 修改  按钮操作 */
             handleUpdate(row) {
                 this.reset();
                 const id = row.id || this.ids
                 getSparePartsUsageRecord(id).then(response => {
                     this.form = response.data;
                     this.open = true;
-                    this.title = "修改动力能源部行输科备件领用更换记录";
+                    this.title = "修改  动力能源部行输科备件领用更换记录";
                 });
             },
             /** 提交按钮 */
@@ -494,7 +647,108 @@
             sparePartModel: row.sparePartModel
         };
         this.$modal.msgSuccess("已复制备件名称和型号");
+    },
+    // 查看详情
+    handleViewDetail(row) {
+        this.currentRecord = { ...row };
+        this.detailDrawer = true;
+    },
+    // 处理表格行右击事件
+    handleRowContextMenu(row, column, event) {
+        event.preventDefault();
+        this.contextMenu.row = row;
+        this.contextMenu.visible = true;
+
+        // 计算菜单位置
+        const x = event.clientX;
+        const y = event.clientY;
+        const menuWidth = 120;
+        const menuHeight = 120;
+        const windowWidth = window.innerWidth;
+        const windowHeight = window.innerHeight;
+
+        this.contextMenu.left = (x + menuWidth > windowWidth) ? x - menuWidth : x;
+        this.contextMenu.top = (y + menuHeight > windowHeight) ? y - menuHeight : y;
+    },
+    // 隐藏右击菜单
+    hideContextMenu() {
+        this.contextMenu.visible = false;
+    },
+    // 右击菜单 - 查看详情
+    contextMenuViewDetail() {
+        if (this.contextMenu.row) {
+            this.handleViewDetail(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 右击菜单 - 修改
+    contextMenuEdit() {
+        if (this.contextMenu.row && this.checkPermi(['ems/info:sparePartsUsageRecord:edit'])) {
+            this.handleUpdate(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 右击菜单 - 删除
+    contextMenuDelete() {
+        if (this.contextMenu.row && this.checkPermi(['ems/info:sparePartsUsageRecord:remove'])) {
+            this.handleDelete(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 权限检查方法
+    checkPermi(permissions) {
+        return checkPermi(permissions);
     }
     }
     };
 </script>
+
+<style scoped>
+.context-menu-table tbody tr:hover {
+    cursor: context-menu;
+}
+
+.context-menu {
+    background: white;
+    border: 1px solid #ebeef5;
+    border-radius: 4px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    padding: 4px 0;
+    min-width: 120px;
+}
+
+.context-menu-item {
+    padding: 8px 16px;
+    cursor: pointer;
+    font-size: 14px;
+    color: #606266;
+    display: flex;
+    align-items: center;
+}
+
+.context-menu-item:hover {
+    background-color: #f5f7fa;
+    color: #409eff;
+}
+
+.context-menu-item i {
+    margin-right: 8px;
+    font-size: 14px;
+}
+
+.el-descriptions__label {
+    width: 90px !important;
+}
+
+@media (max-width: 768px) {
+    .el-drawer {
+        width: 90% !important;
+    }
+}
+
+@media print {
+    .context-menu {
+        display: none !important;
+    }
+}
+</style>
diff --git a/src/views/ems/info/supervisionChecklist/index.vue b/src/views/ems/info/supervisionChecklist/index.vue
index 4ec3508..13af0cd 100644
--- a/src/views/ems/info/supervisionChecklist/index.vue
+++ b/src/views/ems/info/supervisionChecklist/index.vue
@@ -159,9 +159,13 @@
             <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
         </el-row>
 
-        <el-table v-loading="loading" :data="supervisionChecklistList" @selection-change="handleSelectionChange">
+        <el-table v-loading="loading" :data="supervisionChecklistList" @selection-change="handleSelectionChange" @row-contextmenu="handleRowContextMenu" class="context-menu-table">
             <el-table-column type="selection" width="55" align="center" />
-                    <el-table-column label="主键，自增ID" align="center" prop="id" v-if="columns[0].visible"/>
+          <el-table-column label="序号" align="center" width="60" v-if="columns[0].visible">
+            <template slot-scope="scope">
+              {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
+            </template>
+          </el-table-column>
                     <el-table-column label="日期" align="center" prop="date" v-if="columns[1].visible"/>
                     <el-table-column label="作业类别" align="center" prop="jobCategory" v-if="columns[2].visible"/>
                     <el-table-column label="作业单位" align="center" prop="jobUnit" v-if="columns[3].visible"/>
@@ -178,8 +182,14 @@
                     <el-table-column label="工单变更内容" align="center" prop="workOrderChangeContent" v-if="columns[14].visible"/>
                     <el-table-column label="本工单是否闭环" align="center" prop="isWorkOrderClosedLoop" v-if="columns[15].visible"/>
                     <el-table-column label="备注" align="center" prop="remarks" v-if="columns[16].visible"/>
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100">
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="140">
                 <template slot-scope="scope">
+                    <el-button
+                            size="mini"
+                            type="text"
+                            icon="el-icon-view"
+                            @click="handleViewDetail(scope.row)"
+                    >详情</el-button>
                     <el-button
                             size="mini"
                             type="text"
@@ -206,7 +216,7 @@
                 @pagination="getList"
         />
 
-        <!-- 添加或修改动力能源部监督检查清单对话框 -->
+        <!-- 添加  或修改  动力能源部监督检查清单对话框 -->
         <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
             <el-form ref="form" :model="form" :rules="rules" label-width="100px">
                                 <el-form-item label="日期" prop="date">
@@ -299,11 +309,161 @@
                 <el-button @click="upload.open = false">取 消</el-button>
             </div>
         </el-dialog>
+
+        <!-- 详情抽屉 -->
+        <el-drawer
+            title="监督检查清单详情"
+            :visible.sync="detailDrawer"
+            direction="rtl"
+            size="60%"
+            :before-close="() => detailDrawer = false"
+        >
+            <div style="padding: 20px;">
+                <el-descriptions :column="1" border>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">日期</span>
+                        </template>
+                        {{ currentRecord.date || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">作业类别</span>
+                        </template>
+                        {{ currentRecord.jobCategory || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">作业单位</span>
+                        </template>
+                        {{ currentRecord.jobUnit || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">作业名称</span>
+                        </template>
+                        {{ currentRecord.jobName || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">作业风险</span>
+                        </template>
+                        {{ currentRecord.jobRisk || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">风险管控措施</span>
+                        </template>
+                        <div style="max-height: 100px; overflow-y: auto;">
+                            {{ currentRecord.riskControlMeasures || '-' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">监督检查层级</span>
+                        </template>
+                        {{ currentRecord.supervisionLevel || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">监督检查落实情况</span>
+                        </template>
+                        <div style="max-height: 100px; overflow-y: auto;">
+                            {{ currentRecord.supervisionImplementation || '-' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">作业科室</span>
+                        </template>
+                        {{ currentRecord.jobDepartment || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">监管人员</span>
+                        </template>
+                        {{ currentRecord.regulatoryPersonnel || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">检查人员</span>
+                        </template>
+                        {{ currentRecord.inspectionPersonnel || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">检查出的问题</span>
+                        </template>
+                        <div style="max-height: 100px; overflow-y: auto;">
+                            {{ currentRecord.problemsFound || '-' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">外包单位责任人</span>
+                        </template>
+                        {{ currentRecord.outsourcingUnitResponsiblePerson || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">工单变更内容</span>
+                        </template>
+                        <div style="max-height: 150px; overflow-y: auto;" v-html="currentRecord.workOrderChangeContent || '-'"></div>
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">本工单是否闭环</span>
+                        </template>
+                        {{ currentRecord.isWorkOrderClosedLoop || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">备注</span>
+                        </template>
+                        <div style="max-height: 100px; overflow-y: auto;">
+                            {{ currentRecord.remarks || '-' }}
+                        </div>
+                    </el-descriptions-item>
+                </el-descriptions>
+            </div>
+        </el-drawer>
+
+        <!-- 右击菜单 -->
+        <div
+            v-show="contextMenu.visible"
+            :style="{
+                position: 'fixed',
+                top: contextMenu.top + 'px',
+                left: contextMenu.left + 'px',
+                zIndex: 9999
+            }"
+            class="context-menu"
+            @click.stop
+        >
+            <div class="context-menu-item" @click="contextMenuViewDetail">
+                <i class="el-icon-view"></i> 查看详情
+            </div>
+            <div
+                class="context-menu-item"
+                @click="contextMenuEdit"
+                v-if="checkPermi(['ems/info:supervisionChecklist:edit'])"
+            >
+                <i class="el-icon-edit"></i> 修改
+            </div>
+            <div
+                class="context-menu-item"
+                @click="contextMenuDelete"
+                v-if="checkPermi(['ems/info:supervisionChecklist:remove'])"
+            >
+                <i class="el-icon-delete"></i> 删除
+            </div>
+        </div>
     </div>
 </template>
 
 <script>
     import { listSupervisionChecklist, getSupervisionChecklist, delSupervisionChecklist, addSupervisionChecklist, updateSupervisionChecklist } from "@/api/ems/info/supervisionChecklist";
+    import { checkPermi } from "@/utils/permission";
 
     export default {
         name: "SupervisionChecklist",
@@ -357,7 +517,7 @@
                     ],
                 },
                 columns: [
-                        { key: 0, label: `主键，自增ID`, visible: false },
+                        { key: 0, label: `序号`, visible: true },
                         { key: 1, label: `日期`, visible: true },
                         { key: 2, label: `作业类别`, visible: true },
                         { key: 3, label: `作业单位`, visible: true },
@@ -384,6 +544,16 @@
                     headers: {
                         Authorization: "Bearer " + localStorage.getItem("token")
                     }
+                },
+                // 详情抽屉
+                detailDrawer: false,
+                currentRecord: {},
+                // 右击菜单
+                contextMenu: {
+                    visible: false,
+                    top: 0,
+                    left: 0,
+                    row: null
                 }
             };
         },
@@ -391,6 +561,12 @@
             this.getList();
             this.upload.url = process.env.VUE_APP_BASE_API + "/ems/info/supervisionChecklist/importData";
         },
+        mounted() {
+            document.addEventListener('click', this.hideContextMenu);
+        },
+        beforeDestroy() {
+            document.removeEventListener('click', this.hideContextMenu);
+        },
         methods: {
             /** 查询动力能源部监督检查清单列表 */
             getList() {
@@ -449,16 +625,16 @@
             handleAdd() {
                 this.reset();
                 this.open = true;
-                this.title = "添加动力能源部监督检查清单";
+                this.title = "添加  动力能源部监督检查清单";
             },
-            /** 修改按钮操作 */
+            /** 修改  按钮操作 */
             handleUpdate(row) {
                 this.reset();
                 const id = row.id || this.ids
                 getSupervisionChecklist(id).then(response => {
                     this.form = response.data;
                     this.open = true;
-                    this.title = "修改动力能源部监督检查清单";
+                    this.title = "修改  动力能源部监督检查清单";
                 });
             },
             /** 提交按钮 */
@@ -522,7 +698,108 @@
      // 提交上传文件
      submitFileForm() {
          this.$refs.upload.submit();
+    },
+    // 查看详情
+    handleViewDetail(row) {
+        this.currentRecord = { ...row };
+        this.detailDrawer = true;
+    },
+    // 处理表格行右击事件
+    handleRowContextMenu(row, column, event) {
+        event.preventDefault();
+        this.contextMenu.row = row;
+        this.contextMenu.visible = true;
+
+        // 计算菜单位置
+        const x = event.clientX;
+        const y = event.clientY;
+        const menuWidth = 120;
+        const menuHeight = 120;
+        const windowWidth = window.innerWidth;
+        const windowHeight = window.innerHeight;
+
+        this.contextMenu.left = (x + menuWidth > windowWidth) ? x - menuWidth : x;
+        this.contextMenu.top = (y + menuHeight > windowHeight) ? y - menuHeight : y;
+    },
+    // 隐藏右击菜单
+    hideContextMenu() {
+        this.contextMenu.visible = false;
+    },
+    // 右击菜单 - 查看详情
+    contextMenuViewDetail() {
+        if (this.contextMenu.row) {
+            this.handleViewDetail(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 右击菜单 - 修改
+    contextMenuEdit() {
+        if (this.contextMenu.row && this.checkPermi(['ems/info:supervisionChecklist:edit'])) {
+            this.handleUpdate(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 右击菜单 - 删除
+    contextMenuDelete() {
+        if (this.contextMenu.row && this.checkPermi(['ems/info:supervisionChecklist:remove'])) {
+            this.handleDelete(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 权限检查方法
+    checkPermi(permissions) {
+        return checkPermi(permissions);
     }
     }
     };
 </script>
+
+<style scoped>
+.context-menu-table tbody tr:hover {
+    cursor: context-menu;
+}
+
+.context-menu {
+    background: white;
+    border: 1px solid #ebeef5;
+    border-radius: 4px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    padding: 4px 0;
+    min-width: 120px;
+}
+
+.context-menu-item {
+    padding: 8px 16px;
+    cursor: pointer;
+    font-size: 14px;
+    color: #606266;
+    display: flex;
+    align-items: center;
+}
+
+.context-menu-item:hover {
+    background-color: #f5f7fa;
+    color: #409eff;
+}
+
+.context-menu-item i {
+    margin-right: 8px;
+    font-size: 14px;
+}
+
+.el-descriptions__label {
+    width: 90px !important;
+}
+
+@media (max-width: 768px) {
+    .el-drawer {
+        width: 90% !important;
+    }
+}
+
+@media print {
+    .context-menu {
+        display: none !important;
+    }
+}
+</style>
diff --git a/src/views/ems/info/upsBatteryLifecycle/index.vue b/src/views/ems/info/upsBatteryLifecycle/index.vue
index a89e95a..e88c154 100644
--- a/src/views/ems/info/upsBatteryLifecycle/index.vue
+++ b/src/views/ems/info/upsBatteryLifecycle/index.vue
@@ -215,9 +215,13 @@
             <right-toolbar :showSearch.sync="showSearch" @queryTable="getList" :columns="columns"></right-toolbar>
         </el-row>
 
-        <el-table v-loading="loading" :data="upsBatteryLifecycleList" @selection-change="handleSelectionChange">
+        <el-table v-loading="loading" :data="upsBatteryLifecycleList" @selection-change="handleSelectionChange" @row-contextmenu="handleRowContextMenu" class="context-menu-table">
             <el-table-column type="selection" width="55" align="center" />
-                    <el-table-column label="主键，自增ID" align="center" prop="id" v-if="columns[0].visible"/>
+          <el-table-column label="序号" align="center" width="60" v-if="columns[0].visible">
+            <template slot-scope="scope">
+              {{ (queryParams.pageNum - 1) * queryParams.pageSize + scope.$index + 1 }}
+            </template>
+          </el-table-column>
                     <el-table-column label="类型" align="center" prop="type" v-if="columns[1].visible"/>
                     <el-table-column label="UPS安装柜体名称" align="center" prop="upsInstallationCabinetName" v-if="columns[2].visible"/>
                     <el-table-column label="参照位置" align="center" prop="referenceLocation" v-if="columns[3].visible"/>
@@ -238,8 +242,14 @@
                     <el-table-column label="第10次" align="center" prop="replacement10" v-if="columns[18].visible"/>
                     <el-table-column label="第11次" align="center" prop="replacement11" v-if="columns[19].visible"/>
                     <el-table-column label="第12次" align="center" prop="replacement12" v-if="columns[20].visible"/>
-            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="100">
+            <el-table-column label="操作" align="center" class-name="small-padding fixed-width" width="140">
                 <template slot-scope="scope">
+                    <el-button
+                            size="mini"
+                            type="text"
+                            icon="el-icon-view"
+                            @click="handleViewDetail(scope.row)"
+                    >详情</el-button>
                     <el-button
                             size="mini"
                             type="text"
@@ -266,7 +276,7 @@
                 @pagination="getList"
         />
 
-        <!-- 添加或修改行李系统UPS电池生命周期对话框 -->
+        <!-- 添加  或修改  行李系统UPS电池生命周期对话框 -->
         <el-dialog :title="title" :visible.sync="open" width="500px" append-to-body>
             <el-form ref="form" :model="form" :rules="rules" label-width="100px">
                                 <el-form-item label="类型" prop="type">
@@ -414,11 +424,11 @@
                 <i class="el-icon-upload"></i>
                 <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
                 <div class="el-upload__tip text-center" slot="tip">
-                    <div class="el-upload__tip" slot="tip">
+                    <!-- <div class="el-upload__tip" slot="tip">
                         <el-checkbox v-model="upload.updateSupport" />是否更新已经存在的数据
-                    </div>
+                    </div> -->
                     <span>仅允许导入xls、xlsx格式文件。</span>
-                    <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate">下载模板</el-link>
+                    <!-- <el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline" @click="importTemplate">下载模板</el-link> -->
                 </div>
             </el-upload>
             <div slot="footer" class="dialog-footer">
@@ -426,12 +436,190 @@
                 <el-button @click="upload.open = false">取 消</el-button>
             </div>
         </el-dialog>
+
+        <!-- 详情抽屉 -->
+        <el-drawer
+            title="UPS电池生命周期详情"
+            :visible.sync="detailDrawer"
+            direction="rtl"
+            size="60%"
+            :before-close="() => detailDrawer = false"
+        >
+            <div style="padding: 20px;">
+                <el-descriptions :column="1" border>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">类型</span>
+                        </template>
+                        {{ currentRecord.type || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">UPS安装柜体名称</span>
+                        </template>
+                        {{ currentRecord.upsInstallationCabinetName || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">参照位置</span>
+                        </template>
+                        {{ currentRecord.referenceLocation || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">位置描述</span>
+                        </template>
+                        <div style="max-height: 100px; overflow-y: auto;">
+                            {{ currentRecord.locationDescription || '-' }}
+                        </div>
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">现UPS来源</span>
+                        </template>
+                        {{ currentRecord.currentUps || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">取电</span>
+                        </template>
+                        {{ currentRecord.powerSource || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">涉及区域</span>
+                        </template>
+                        {{ currentRecord.affectedArea || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">备注</span>
+                        </template>
+                        <div style="max-height: 100px; overflow-y: auto;">
+                            {{ currentRecord.remarks || '-' }}
+                        </div>
+                    </el-descriptions-item>
+
+                    <!-- 更换记录 -->
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block; color: #409eff;">更换记录</span>
+                        </template>
+                        <span style="color: #409eff;">以下为12次更换记录</span>
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第1次</span>
+                        </template>
+                        {{ currentRecord.replacement1 || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第2次</span>
+                        </template>
+                        {{ currentRecord.replacement2 || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第3次</span>
+                        </template>
+                        {{ currentRecord.replacement3 || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第4次</span>
+                        </template>
+                        {{ currentRecord.replacement4 || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第5次</span>
+                        </template>
+                        {{ currentRecord.replacement5 || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第6次</span>
+                        </template>
+                        {{ currentRecord.replacement6 || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第7次</span>
+                        </template>
+                        {{ currentRecord.replacement7 || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第8次</span>
+                        </template>
+                        {{ currentRecord.replacement8 || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第9次</span>
+                        </template>
+                        {{ currentRecord.replacement9 || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第10次</span>
+                        </template>
+                        {{ currentRecord.replacement10 || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第11次</span>
+                        </template>
+                        {{ currentRecord.replacement11 || '-' }}
+                    </el-descriptions-item>
+                    <el-descriptions-item>
+                        <template slot="label">
+                            <span style="font-weight: bold; width: 90px; display: inline-block;">第12次</span>
+                        </template>
+                        {{ currentRecord.replacement12 || '-' }}
+                    </el-descriptions-item>
+                </el-descriptions>
+            </div>
+        </el-drawer>
+
+        <!-- 右击菜单 -->
+        <div
+            v-show="contextMenu.visible"
+            :style="{
+                position: 'fixed',
+                top: contextMenu.top + 'px',
+                left: contextMenu.left + 'px',
+                zIndex: 9999
+            }"
+            class="context-menu"
+            @click.stop
+        >
+            <div class="context-menu-item" @click="contextMenuViewDetail">
+                <i class="el-icon-view"></i> 查看详情
+            </div>
+            <div
+                class="context-menu-item"
+                @click="contextMenuEdit"
+                v-if="checkPermi(['ems/info:upsBatteryLifecycle:edit'])"
+            >
+                <i class="el-icon-edit"></i> 修改
+            </div>
+            <div
+                class="context-menu-item"
+                @click="contextMenuDelete"
+                v-if="checkPermi(['ems/info:upsBatteryLifecycle:remove'])"
+            >
+                <i class="el-icon-delete"></i> 删除
+            </div>
+        </div>
     </div>
 </template>
 
 <script>
     import { listUpsBatteryLifecycle, getUpsBatteryLifecycle, delUpsBatteryLifecycle, addUpsBatteryLifecycle, updateUpsBatteryLifecycle } from "@/api/ems/info/upsBatteryLifecycle";
     import { getToken } from "@/utils/auth";
+    import { checkPermi } from "@/utils/permission";
 
     export default {
         name: "UpsBatteryLifecycle",
@@ -492,7 +680,7 @@
                     ]
                 },
                 columns: [
-                        { key: 0, label: `主键，自增ID`, visible: false },
+                        { key: 0, label: `序号`, visible: true },
                         { key: 1, label: `类型`, visible: true },
                         { key: 2, label: `UPS安装柜体名称`, visible: true },
                         { key: 3, label: `参照位置`, visible: true },
@@ -528,12 +716,28 @@
                     headers: { Authorization: "Bearer " + getToken() },
                     // 上传的地址
                     url: process.env.VUE_APP_BASE_API + "/ems/info/upsBatteryLifecycle/importData"
+                },
+                // 详情抽屉
+                detailDrawer: false,
+                currentRecord: {},
+                // 右击菜单
+                contextMenu: {
+                    visible: false,
+                    top: 0,
+                    left: 0,
+                    row: null
                 }
             };
         },
         created() {
             this.getList();
         },
+        mounted() {
+            document.addEventListener('click', this.hideContextMenu);
+        },
+        beforeDestroy() {
+            document.removeEventListener('click', this.hideContextMenu);
+        },
         methods: {
             /** 查询行李系统UPS电池生命周期列表 */
             getList() {
@@ -596,16 +800,16 @@
             handleAdd() {
                 this.reset();
                 this.open = true;
-                this.title = "添加行李系统UPS电池生命周期";
+                this.title = "添加  行李系统UPS电池生命周期";
             },
-            /** 修改按钮操作 */
+            /** 修改  按钮操作 */
             handleUpdate(row) {
                 this.reset();
                 const id = row.id || this.ids
                 getUpsBatteryLifecycle(id).then(response => {
                     this.form = response.data;
                     this.open = true;
-                    this.title = "修改行李系统UPS电池生命周期";
+                    this.title = "修改  行李系统UPS电池生命周期";
                 });
             },
             /** 提交按钮 */
@@ -669,7 +873,108 @@
             // 提交上传文件
             submitFileForm() {
                 this.$refs.upload.submit();
+    },
+    // 查看详情
+    handleViewDetail(row) {
+        this.currentRecord = { ...row };
+        this.detailDrawer = true;
+    },
+    // 处理表格行右击事件
+    handleRowContextMenu(row, column, event) {
+        event.preventDefault();
+        this.contextMenu.row = row;
+        this.contextMenu.visible = true;
+
+        // 计算菜单位置
+        const x = event.clientX;
+        const y = event.clientY;
+        const menuWidth = 120;
+        const menuHeight = 120;
+        const windowWidth = window.innerWidth;
+        const windowHeight = window.innerHeight;
+
+        this.contextMenu.left = (x + menuWidth > windowWidth) ? x - menuWidth : x;
+        this.contextMenu.top = (y + menuHeight > windowHeight) ? y - menuHeight : y;
+    },
+    // 隐藏右击菜单
+    hideContextMenu() {
+        this.contextMenu.visible = false;
+    },
+    // 右击菜单 - 查看详情
+    contextMenuViewDetail() {
+        if (this.contextMenu.row) {
+            this.handleViewDetail(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 右击菜单 - 修改
+    contextMenuEdit() {
+        if (this.contextMenu.row && this.checkPermi(['ems/info:upsBatteryLifecycle:edit'])) {
+            this.handleUpdate(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 右击菜单 - 删除
+    contextMenuDelete() {
+        if (this.contextMenu.row && this.checkPermi(['ems/info:upsBatteryLifecycle:remove'])) {
+            this.handleDelete(this.contextMenu.row);
+        }
+        this.hideContextMenu();
+    },
+    // 权限检查方法
+    checkPermi(permissions) {
+        return checkPermi(permissions);
     }
     }
     };
 </script>
+
+<style scoped>
+.context-menu-table tbody tr:hover {
+    cursor: context-menu;
+}
+
+.context-menu {
+    background: white;
+    border: 1px solid #ebeef5;
+    border-radius: 4px;
+    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
+    padding: 4px 0;
+    min-width: 120px;
+}
+
+.context-menu-item {
+    padding: 8px 16px;
+    cursor: pointer;
+    font-size: 14px;
+    color: #606266;
+    display: flex;
+    align-items: center;
+}
+
+.context-menu-item:hover {
+    background-color: #f5f7fa;
+    color: #409eff;
+}
+
+.context-menu-item i {
+    margin-right: 8px;
+    font-size: 14px;
+}
+
+.el-descriptions__label {
+    width: 90px !important;
+}
+
+@media (max-width: 768px) {
+    .el-drawer {
+        width: 90% !important;
+    }
+}
+
+@media print {
+    .context-menu {
+        display: none !important;
+    }
+}
+</style>