From 77737f4e73f7267170b9b06fc73d1610c29c0661 Mon Sep 17 00:00:00 2001
From: 马宇豪 <978517621@qq.com>
Date: 星期二, 12 十一月 2024 13:18:35 +0800
Subject: [PATCH] 新增
---
src/views/specialWorkSystem/specialIndex/components/workRecord.vue | 28 +++++++++++++++++++++++-----
1 files changed, 23 insertions(+), 5 deletions(-)
diff --git a/src/views/specialWorkSystem/specialIndex/components/workRecord.vue b/src/views/specialWorkSystem/specialIndex/components/workRecord.vue
index 5c9efeb..26ff22d 100644
--- a/src/views/specialWorkSystem/specialIndex/components/workRecord.vue
+++ b/src/views/specialWorkSystem/specialIndex/components/workRecord.vue
@@ -11,15 +11,21 @@
<!-- </el-steps>-->
<div class="item" v-for="(item,index) in data" :key="index">
<div class="marker">
- <div class="dot"></div>
+ <div class="dot" :class="item.operationTitle == '作业验收'?'greenDot':''"></div>
<div class="line"></div>
</div>
<div class="content">
- <div class="tit">{{item.operationTitle}}<span>{{index == data.length - 1 ? '[进行中]': '[已完成]'}}</span></div>
+ <div class="tit">{{item.operationTitle}}<span :class="item.operationTitle == '作业验收'?'green':''">{{item.operationTitle == '作业验收'?'[已完成]':(index == data.length - 1 ? '[进行中]': '[已完成]')}}</span></div>
<div>{{item.operationUtype}}：{{item.operationUname}}</div>
<div>操作时间：{{item.operationTime}}</div>
<div>操作内容：{{item.content}}</div>
<div>操作意见：{{item.approvalOpinions}}</div>
+ <div v-if="item.fileUrl" style="display: flex;align-items: flex-start">附件内容：
+ <el-image v-for="(i,index) in item.fileUrl.split(',')" :key="index" :preview-src-list="item.fileUrl.split(',')" :initial-index="0" style="width: 150px; height: 150px;margin-right: 50px;margin-bottom: 20px" :src="i" fit="cover" />
+ </div>
+ <div v-if="item.signUrl" style="display: flex;align-items: flex-start">签字图片：
+ <el-image v-for="(i,index) in item.signUrl.split(',')" :key="index" :preview-src-list="item.signUrl.split(',')" :initial-index="0" style="width: 150px; height: 150px;margin-right: 50px;margin-bottom: 20px" :src="i" fit="cover" />
+ </div>
</div>
</div>
</el-dialog>
@@ -101,16 +107,21 @@
}
.item{
display: flex;
- align-items: flex-start;
+ align-items: stretch; /* 使 marker 和 content 高度一致 */
width: 100%;
padding-left: 50px;
margin-bottom: 10px;
+ position: relative;
.marker{
+ position: absolute;
+ left: 0;
+ top: 0;
+ bottom: 0;
display: flex;
flex-direction: column;
align-items: center;
- margin-right: 20px;
+ height: 100%; /* 使 marker 高度自适应父元素 */
.dot{
width: 28px;
@@ -121,11 +132,12 @@
}
.line{
width: 1px;
- height: 120px;
+ flex-grow: 1; /* 自动适应剩余高度 */
background: #13ce66;
}
}
.content{
+
div{
margin-bottom: 6px;
}
@@ -150,10 +162,16 @@
.line{
display: none;
}
+ .greenDot{
+ background: #13ce66;
+ }
.tit{
span{
color: #409eff;
}
+ .green{
+ color: #13ce66;
+ }
}
}
}
--
Gitblit v1.9.2