0925

src/views/zhinengxunjian/qiangxiujilu.vue

@@ -251,10 +251,6 @@
                 <span class="info-label">维修人：</span>
                 <span class="info-value">{{ detailData.sendPersonVo?.userName || '-' }}</span>
               </div>
-              <div class="info-item">
-                <span class="info-label">所属团队：</span>
-                <span class="info-value">{{ detailData.sendPersonVo?.teamName || '-' }}</span>
-              </div>
             </div>
           </div>
         </div>
@@ -281,12 +277,9 @@
               </div>
               <div class="info-item">
                 <span class="info-label">现场支持：</span>
-                <span class="info-value">{{
-                  detailData.support === '1' ? '支持' : detailData.support === '2' ? '不支持' : detailData.support || '-'
-                }}</span>
+                <span class="info-value">{{ detailData.support || '-' }}</span>
               </div>
             </div>
-
             <!-- 已完成状态的额外信息 -->
             <div v-if="detailData.status === '3'" class="info-row">
               <div class="info-item">
@@ -1386,45 +1379,51 @@ const handleInspectionManagement2 = () => {
 }
 
 /* 详情弹窗样式 */
-.task-detail-container {
-  max-height: 600px;
+.custom-experiment-dialog .el-dialog__body {
+  max-height: 60vh;
   overflow-y: auto;
+  padding: 24px;
 }
 
+.task-detail-container {
+  padding: 10px 0;
+}
+
+/* 详情卡片样式 */
 .detail-card {
+  background-color: #fff;
+  border-radius: 8px;
+  padding: 20px;
   margin-bottom: 20px;
-  border: 1px solid #ebeef5;
-  border-radius: 4px;
-  overflow: hidden;
+  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.05);
+  border: 1px solid #f0f2f5;
 }
 
 .card-title {
-  padding: 16px 20px;
-  margin: 0;
-  background-color: #fafafa;
-  border-bottom: 1px solid #ebeef5;
   font-size: 16px;
-  font-weight: 500;
-  color: #303133;
+  font-weight: 600;
+  color: #1d2129;
+  margin-bottom: 16px;
+  padding-bottom: 12px;
+  border-bottom: 2px solid #409eff;
 }
 
 .card-content {
-  padding: 20px;
+  padding: 0 4px;
 }
 
+/* 信息行和信息项样式 */
 .info-row {
   display: flex;
-  flex-wrap: wrap;
   margin-bottom: 16px;
-}
-
-.info-row:last-child {
-  margin-bottom: 0;
+  flex-wrap: wrap;
 }
 
 .info-item {
   flex: 0 0 50%;
   margin-bottom: 12px;
+  display: flex;
+  align-items: flex-start;
 }
 
 .info-item.full-width {
@@ -1432,47 +1431,104 @@ const handleInspectionManagement2 = () => {
 }
 
 .info-label {
-  color: #909399;
-  font-size: 14px;
+  font-weight: 500;
+  color: #86909c;
   margin-right: 8px;
+  min-width: 80px;
+  flex-shrink: 0;
 }
 
 .info-value {
-  color: #303133;
+  color: #4e5969;
+  flex: 1;
+  word-break: break-all;
   font-size: 14px;
-  word-break: break-word;
+}
+
+/* 图片容器样式 */
+.images-container {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 16px;
+  margin-top: 12px;
+  padding: 10px;
+  background-color: #f9f9f9;
+  border-radius: 8px;
+}
+
+/* 单个图片项样式 */
+.image-item {
+  flex: 0 0 auto;
+  width: 200px; /* 固定宽度 */
+  height: 160px; /* 固定高度 */
+  border-radius: 6px;
+  overflow: hidden;
+  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
+  transition: transform 0.3s ease;
+}
+
+.image-item:hover {
+  transform: scale(1.03);
+}
+
+/* 图片样式 */
+.detail-image {
+  width: 100%;
+  height: 100%;
+  object-fit: cover; /* 保持比例填充容器 */
+  display: block;
+  border-radius: 4px;
+  transition: transform 0.3s ease;
+}
+
+.detail-image:hover {
+  transform: scale(1.02);
+}
+
+/* 图片加载失败样式 */
+.detail-image[src=''] {
+  background-color: #f0f0f0;
+  display: flex;
 }
 
 /* 骨架屏样式 */
 .skeleton-loading {
-  padding: 20px;
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
 }
 
 .skeleton-card {
-  margin-bottom: 20px;
-  border-radius: 4px;
-  overflow: hidden;
-  background-color: #f8f9fa;
+  background-color: #f5f5f5;
+  border-radius: 8px;
+  padding: 16px;
 }
 
 .skeleton-header {
-  height: 56px;
-  background-color: #f1f3f5;
+  height: 20px;
+  width: 30%;
+  background-color: #e0e0e0;
+  border-radius: 4px;
+  margin-bottom: 12px;
 }
 
 .skeleton-content {
-  padding: 20px;
+  display: flex;
+  flex-direction: column;
+  gap: 8px;
 }
 
 .skeleton-row {
-  height: 20px;
-  margin-bottom: 12px;
-  background-color: #e9ecef;
+  height: 16px;
+  background-color: #e0e0e0;
   border-radius: 4px;
 }
 
-.skeleton-row:last-child {
-  margin-bottom: 0;
+/* 无数据提示 */
+.no-info {
+  text-align: center;
+  color: #909399;
+  padding: 60px 20px;
 }
 
 /* 分配弹窗样式 */