From c832bf2e80ac465e71b7a1c1f7a59d4252030989 Mon Sep 17 00:00:00 2001
From: 张含笑 <zhx18749296735@163.com>
Date: Tue, 05 Aug 2025 17:33:08 +0800
Subject: [PATCH] feat:事件工单滚动条
---
src/views/tickets/ticket.vue | 59 ++++++++++++++++++++++++++++++++++++-----------------------
1 files changed, 36 insertions(+), 23 deletions(-)
diff --git a/src/views/tickets/ticket.vue b/src/views/tickets/ticket.vue
index 8cb2837..cce063b 100644
--- a/src/views/tickets/ticket.vue
+++ b/src/views/tickets/ticket.vue
@@ -374,7 +374,7 @@
</el-dialog>
<!-- 工单详情对话框 -->
- <el-dialog align-center v-model="detailVisible" title="工单详情" width="80%" append-to-body>
+ <el-dialog class="custom-dialog" align-center v-model="detailVisible" title="工单详情" width="80%" append-to-body>
<div class="detail-container">
<div class="detail-top-title">
<div class="event-title-center event-orderNumber">
@@ -417,7 +417,8 @@
</el-steps>
</div>
- <!-- 基本信息表格 -->
+ <div class="PopUpTableScrolls">
+ <!-- 基本信息表格 -->
<el-table :show-header="false" :data="formattedDetailFields" border class="tableCss">
<el-table-column prop="label1" label="基本信息" width="150">
<template #default="{ row }">
@@ -644,6 +645,7 @@
</el-row>
</div>
+ </div>
<!-- 操作按钮 -->
<div class="dialog-footer">
@@ -652,9 +654,9 @@
:class="currentIndex === 0 ? 'disableds' : ''"
@click="leftClick"
>
- <el-icon><ArrowLeft /></el-icon>
+ 上一页
</div>
- <div>
+ <div class="btngroups">
<template v-if="currentDetail.status === 2">
<!-- 待审核 -->
<el-button
@@ -713,7 +715,7 @@
class="leftBtn"
@click="rightClick"
>
- <el-icon><ArrowRight /></el-icon>
+ 下一页
</div>
</div>
</div>
@@ -2950,7 +2952,9 @@
};
</script>
-
+<style lang="scss">
+.custom-dialog { height: 96vh; /* 80% 视口高度 */}
+</style>
<style lang="scss" scoped>
::v-deep(.el-tabs) {
@@ -3157,22 +3161,29 @@
}
.dialog-footer {
-display: flex;
- text-align: center;
- align-items: center;
- justify-content: space-between;
- padding-top: 16px;
- border-top: 1px solid #ebeef5;
-
+ position: sticky;
+ bottom: 28px;
+ left: 0;
+ right: 0;
+ background: white;
+ z-index: 10;
+ padding: 16px 20px;
+ border-top: 1px solid #ebeef5;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
.el-button + .el-button {
margin-left: 12px;
}
-
+.btngroups {
+margin-left: 12px;
+}
.el-button {
padding: 9px 20px;
&:last-child {
margin-left: 12px;
+ margin-right: 12px;
}
}
}
@@ -3338,18 +3349,16 @@
}
.leftBtn {
- width: 36px;
- height: 36px;
+ width: 70px;
+ height: 32px;
background-color: #999;
- border-radius: 50%;
+ border-radius: 5px;
text-align: center;
- line-height: 36px;
+line-height: 32px;
color: #fff;
cursor: pointer;
opacity: 0.8;
-display: flex;
-align-items: center;
-justify-content: center;
+
}
.disableds {
@@ -3358,7 +3367,11 @@
pointer-events: none;
opacity: 0.3 !important;
}
-
+.PopUpTableScrolls{
+height: 600px;
+overflow-y: scroll;
+overflow-x: hidden;
+}
.media-box {
width: 100%;
border: 1px solid #dcdfe6;
@@ -3374,7 +3387,7 @@
.media-content {
position: relative;
- height: 250px;
+ height: 500px;
:deep(.el-image) {
width: 100% !important;
--
Gitblit v1.9.3