Hooke / manulife-weapp

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
dc7b2b17 1 parent 5057e59a

style(ui): 统一查看按钮图标并优化交互样式 

- 将计划列表中的查看按钮图标从 "order" 更改为 "eye" 以保持一致性
- 在物料列表项中移除整个项的点击事件，改为独立的查看按钮，避免误触
- 为物料列表的查看按钮添加明确的视觉样式和点击反馈
Inline Side-by-side
Showing 2 changed files with 22 additions and 12 deletions
...@@ -21,8 +21,8 @@ ...@@ -21,8 +21,8 @@
21 <div class="px-[32rpx] mt-[32rpx]"> 21 <div class="px-[32rpx] mt-[32rpx]">
22 <div class="flex flex-col gap-[24rpx]"> 22 <div class="flex flex-col gap-[24rpx]">
23 <div v-for="(item, index) in list" :key="index" 23 <div v-for="(item, index) in list" :key="index"
24 - class="material-item bg-white rounded-[24rpx] p-[24rpx] shadow-sm flex items-start active:scale-[0.98] transition-all duration-200 border border-gray-50" 24 + class="material-item bg-white rounded-[24rpx] p-[24rpx] shadow-sm flex items-start transition-all duration-200 border border-gray-50"
25 - :style="{ animationDelay: `${index * 50}ms` }" @click="onView(item)"> 25 + :style="{ animationDelay: `${index * 50}ms` }">
26 26
27 <!-- 左侧图标 --> 27 <!-- 左侧图标 -->
28 <div 28 <div
...@@ -53,15 +53,25 @@ ...@@ -53,15 +53,25 @@
53 </div> 53 </div>
54 </div> 54 </div>
55 55
56 - <!-- 底部信息：文件大小 --> 56 + <!-- 底部信息：文件类型、大小和查看按钮 -->
57 - <div class="flex items-center gap-[12rpx]"> 57 + <div class="flex items-center justify-between">
58 - <span 58 + <div class="flex items-center gap-[12rpx]">
59 - class="inline-flex items-center justify-center px-[12rpx] py-[4rpx] bg-gray-100 text-gray-500 text-[20rpx] font-medium rounded-[8rpx]"> 59 + <span
60 - PDF 60 + class="inline-flex items-center justify-center px-[12rpx] py-[4rpx] bg-gray-100 text-gray-500 text-[20rpx] font-medium rounded-[8rpx]">
61 - </span> 61 + PDF
62 - <span class="text-[#9CA3AF] text-[22rpx]"> 62 + </span>
63 - {{ item.size }} 63 + <span class="text-[#9CA3AF] text-[22rpx]">
64 - </span> 64 + {{ item.size }}
65 + </span>
66 + </div>
67 +
68 + <!-- 查看按钮 -->
69 + <view
70 + class="flex items-center justify-center px-[20rpx] py-[10rpx] bg-blue-50 rounded-full active:bg-blue-100 transition-colors"
71 + @tap.stop="onView(item)">
72 + <IconFont name="eye" size="14" color="#2563EB" class="mr-[6rpx]" />
73 + <text class="text-[24rpx] text-blue-600 font-medium leading-none">查看</text>
74 + </view>
65 </div> 75 </div>
66 </div> 76 </div>
67 </div> 77 </div>
......
...@@ -55,7 +55,7 @@ ...@@ -55,7 +55,7 @@
55 <!-- Actions --> 55 <!-- Actions -->
56 <view class="flex justify-end gap-[24rpx]"> 56 <view class="flex justify-end gap-[24rpx]">
57 <view class="flex items-center text-blue-600" @tap="onView(item)"> 57 <view class="flex items-center text-blue-600" @tap="onView(item)">
58 - <IconFont name="order" size="14" class="mr-[8rpx]" /> 58 + <IconFont name="eye" size="14" class="mr-[8rpx]" />
59 <text class="text-[24rpx]">查看</text> 59 <text class="text-[24rpx]">查看</text>
60 </view> 60 </view>
61 <view class="flex items-center text-red-500" @tap="onDelete(item)"> 61 <view class="flex items-center text-red-500" @tap="onDelete(item)">
......