hookehuyr

feat(ScanCheckinList): 优化签到列表项UI与交互体验

修复已打卡状态同时显示操作按钮的问题,替换文字标签为专用图标,添加悬停指针样式并扩大点击区域
......@@ -58,6 +58,7 @@
.scan-checkin-list-content {
flex: 1;
min-width: 0;
cursor: pointer;
}
.scan-checkin-list-name {
......@@ -87,15 +88,11 @@
flex-shrink: 0;
}
.scan-checkin-list-checked-tag {
padding: 10rpx 18rpx;
border-radius: 999rpx;
background: rgba(54, 181, 187, 0.12);
color: #2c9ca2;
font-size: 24rpx;
line-height: 1;
font-weight: 500;
.scan-checkin-list-action-image {
width: 72rpx;
height: 72rpx;
flex-shrink: 0;
cursor: pointer;
}
.scan-checkin-list-load-more,
......
......@@ -21,13 +21,19 @@
<IconFont size="30" name="https://cdn.ipadbiz.cn/lls_prog/icon/check_list_logo.png" />
</view>
<view class="scan-checkin-list-content">
<view class="scan-checkin-list-content" @click="goToDetail(point)">
<text class="scan-checkin-list-name">{{ point.title }}</text>
</view>
<text v-if="point.isChecked === true" class="scan-checkin-list-checked-tag">已打卡</text>
<image
v-if="point.isChecked === true"
class="scan-checkin-list-action-image"
src="https://cdn.ipadbiz.cn/lls_prog/icon/yidaka_icon.png"
mode="aspectFit"
@click="goToDetail(point)"
/>
<view class="scan-checkin-list-action" @click="goToDetail(point)">
<view v-else class="scan-checkin-list-action" @click="goToDetail(point)">
<Scan2 size="20" />
</view>
</view>
......