From 45af9ec519e4d93d79ddfa48a6c6c82b7ef94008 Mon Sep 17 00:00:00 2001 From: liukangdong <898885815@qq.com> Date: 星期六, 14 九月 2024 13:54:34 +0800 Subject: [PATCH] ll --- h5/pages/staff/task/driver.vue | 100 ++++++++++++++++++++++++++++++++++++------------- 1 files changed, 73 insertions(+), 27 deletions(-) diff --git a/h5/pages/staff/task/driver.vue b/h5/pages/staff/task/driver.vue index 7bc40ed..dcb6811 100644 --- a/h5/pages/staff/task/driver.vue +++ b/h5/pages/staff/task/driver.vue @@ -61,15 +61,18 @@ <view class="list" v-if="info.approveDateVO != null && info.approveDateVO.approveList != null"> <view class="item" v-for="item,index in info.approveDateVO.approveList"> <view v-if="index != info.approveDateVO.approveList.length - 1" class="separate"></view> - <view class="avatar_wrap"> + <view class="avatar"> <image + v-if="item.type == 1" class="img" - :src=" - item.faceImg - ? item.faceImg - : require('@/static/meeting/common/default_user@2x.png') - " + src="@/static/staff/ic_chaosong@2x.png" /> + <image + v-else-if="item.approveType == 1 || item.approveType == 0" + class="img" + src="@/static/staff/ic_shenpiren@2x.png" + /> + <span v-else class="img_name">{{item.memberName && item.memberName.slice(0,1)}}</span> <image v-if="item.status == 2" class="status" @@ -220,38 +223,45 @@ .flow_wrap { padding: 30rpx 0; - + .flow_title { font-weight: 600; font-size: 32rpx; color: #222222; margin-bottom: 24rpx; } - + .list { .item { display: flex; margin-bottom: 48rpx; - position: relative; - .separate { - position: absolute; - width: 4rpx; - height: calc( 100% - 52rpx ); - background-color: #eeeeee; - left: 40rpx; - top: 90rpx; - } - .avatar_wrap { + position: relative; + .separate { + position: absolute; + width: 4rpx; + height: 100%; + background-color: #eeeeee; + left: 40rpx; + transform: translate(-50%, 0); + top: 80rpx; + } + .avatar { width: 80rpx; height: 80rpx; position: relative; margin-right: 20rpx; + display: flex; + align-items: center; + justify-content: center; .img { width: 80rpx; height: 80rpx; border-radius: 50%; } - + .img_name{ + font-size: 32rpx; + color: #FFFFFF; + } .status { width: 28rpx; height: 28rpx; @@ -260,36 +270,67 @@ right: 0; bottom: 0; } - } - + .content { flex: 1; - + .head { display: flex; justify-content: space-between; margin-bottom: 4rpx; - + .event { font-size: 30rpx; } - + .time { font-size: 26rpx; color: #999999; } } - + .name_wrap { font-size: 26rpx; color: #777777; - + .status { color: $uni-color-primary; } } - + .children { + display: flex; + flex-wrap: wrap; + margin-top: 12rpx; + .child { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + margin-right: 12rpx; + font-size: 26rpx; + color: #777777; + .child_img { + width: 48rpx; + height: 48rpx; + border-radius: 50%; + margin-bottom: 2rpx; + } + .child_name{ + margin-bottom: 2rpx; + width: 48rpx; + height: 48rpx; + text-align: center; + justify-content: center; + padding-top: 4rpx; + font-size: 28rpx; + border-radius: 50%; + color: #FFFFFF; + background-color: $uni-color-primary; + } + } + } + .remark { margin-top: 12rpx; background-color: #f7f7f7; @@ -320,6 +361,11 @@ } } } + &:nth-last-child(1) { + .separate { + height: 0; + } + } } } } -- Gitblit v1.9.3