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/job/components/DeviceJobDetails.vue | 56 ++++++++++++++++++++++----------------------------------
1 files changed, 22 insertions(+), 34 deletions(-)
diff --git a/src/views/job/components/DeviceJobDetails.vue b/src/views/job/components/DeviceJobDetails.vue
index c1aa005..d31673a 100644
--- a/src/views/job/components/DeviceJobDetails.vue
+++ b/src/views/job/components/DeviceJobDetails.vue
@@ -1,7 +1,7 @@
<!-- 历史任务详情 -->
<template>
<el-dialog class="ztzf-dialog" append-to-body modal-class="detailsOfHistoricalTasks" v-model="isShow" title="历史任务详情"
- width="1800" :close-on-click-modal="false" :destroy-on-close="true">
+ :width="pxToRem(1700)" :close-on-click-modal="false" :destroy-on-close="true">
<div class="content">
<div class="contentLeft">
<div class="machineTableDetailsTitle"><span>详情</span></div>
@@ -69,7 +69,7 @@
</template>
<script setup>
-// import { pxToRem } from '@/utils/rem'
+import { pxToRem } from '@/utils/rem'
import JobRelatedEvents from './JobRelatedEvents.vue'
import { getEventMediaListApi, getJobDetails, getJobInfoFiles } from '@/api/job/task'
import DeviceJobDetailsMap from './DeviceJobDetailsMap.vue'
@@ -206,8 +206,7 @@
.content {
display: flex;
height: 100%;
-
- .contentLeft {
+.contentLeft {
margin-left: 35px;
margin-right: 24px;
width: 1150px;
@@ -222,7 +221,7 @@
display: inline-block;
margin-left: 30px;
font-size: 16px;
- color: #363636;
+ color: #0282ff;
line-height: 20px;
text-align: left;
margin-bottom: 8px;
@@ -279,36 +278,36 @@
.itemBox {
display: flex;
align-items: center;
- // background: #152743;
+ background: #fff;
height: 43px;
- // border-top: 2px solid #eeeeee;
+ border-top: 2px solid #EFEFEF;
}
}
.itemCon:nth-last-child(-n+2) {
- border-bottom: 2px solid #eeeeee;
+ border-bottom: 2px solid #EFEFEF;
}
.itemBox:nth-last-child(-n+2) .itemTitle {
- border-bottom: 1px solid #eeeeee;
+ border-bottom: 1px solid #EFEFEF;
}
.itemTitle {
- color: #363636;
+ color: #0B1D38;
width: 26%;
text-align: right;
- // background: #0B1D38;
+ background: #F3F6FF;
height: 43px;
line-height: 43px;
padding-right: 10px;
- border-top: 1px solid #eeeeee
+ border-top: 1px solid #EFEFEF;
}
.itemValue {
font-size: 14px;
- color: #363636;
+ color: #747e91;
text-align: center;
width: 74%;
@@ -348,34 +347,23 @@
position: relative;
}
- .videobutton {
- position: absolute;
- top: 40%;
- left: 45%;
- transform: translate(-50%);
- cursor: pointer;
- width: 40px;
- height: 40px;
- display: inline-block;
- }
+ // .videobutton {
+ // position: absolute;
+ // top: 40%;
+ // left: 45%;
+ // transform: translate(-50%);
+ // cursor: pointer;
+ // width: 40px;
+ // height: 40px;
+ // display: inline-block;
+ // }
}
-
.contentRight {
width: 0;
flex-grow: 1;
background: #19ad8d;
margin-right: 17px;
}
-
-
-
- // .fullscreen-video {
- // width: 100%;
- // height: 100%;
- // max-width: 800px;
- // max-height: 800px;
- // object-fit: contain;
- // }
}
</style>
--
Gitblit v1.9.3