Hooke / lls_program

Go to a project
Toggle navigation Toggle navigation pinning
hookehuyr
a7f53771 1 parent ce42013c

fix: 统一图片显示模式为widthFix和aspectFit 

修复多个页面中图片显示模式不一致的问题，将大部分图片的mode从aspectFill改为widthFix以保持统一显示效果，部分头像图片改为aspectFit以更好适应圆形显示
Inline Side-by-side
Showing 13 changed files with 16 additions and 17 deletions
......@@ -15,7 +15,6 @@ declare module 'vue' {
NutActionSheet: typeof import('@nutui/nutui-taro')['ActionSheet']
NutButton: typeof import('@nutui/nutui-taro')['Button']
NutDatePicker: typeof import('@nutui/nutui-taro')['DatePicker']
NutDialog: typeof import('@nutui/nutui-taro')['Dialog']
NutImagePreview: typeof import('@nutui/nutui-taro')['ImagePreview']
NutInput: typeof import('@nutui/nutui-taro')['Input']
NutPicker: typeof import('@nutui/nutui-taro')['Picker']
......
......@@ -3,7 +3,7 @@
<!-- Avatar -->
<view class="flex flex-col items-center py-8" @click="changeAvatar">
<view class="w-24 h-24 rounded-full bg-gray-100 flex items-center justify-center mb-2 overflow-hidden">
<image :src="formData.avatar_url || defaultAvatar" class="w-full h-full" mode="aspectFill" />
<image :src="formData.avatar_url || defaultAvatar" class="w-full h-full" mode="aspectFit" />
</view>
<text class="text-gray-500 text-sm">上传头像</text>
</view>
......
......@@ -21,7 +21,7 @@
<image
:src="item.type === 'video' ? item.thumbnail : item.url"
class="w-full h-full object-cover"
mode="aspectFill"
mode="widthFix"
/>
<!-- 视频播放标识 -->
......
......@@ -108,7 +108,7 @@
<image
:src="familyAvatar || defaultFamilyCover"
class="w-full h-48 rounded-lg object-cover"
mode="aspectFill"
mode="widthFix"
@tap="previewAvatar"
/>
<view
......
......@@ -88,7 +88,7 @@
</view>
<view class="grid grid-cols-4 gap-2">
<view v-for="member in familyMembers" :key="member.user_id" class="flex flex-col items-center">
<image :src="member.avatar_url || defaultAvatar" mode="aspectFill" :alt="member.role" class="w-16 h-16 rounded-full mb-1" />
<image :src="member.avatar_url || defaultAvatar" mode="aspectFit" :alt="member.role" class="w-16 h-16 rounded-full mb-1" />
<span class="text-sm text-gray-700">
{{ member?.today_step?.toLocaleString() }}步
</span>
......@@ -401,7 +401,7 @@ useDidShow(async () => {
family_id.value = data[0].id;
// 先初始化基础页面数据（不包含步数相关数据）
await initPageData();
// 检查是否应该显示手动更新按钮
if (stepsStore.shouldShowManualUpdate()) {
// 如果之前有更新失败记录，直接显示手动更新按钮，不自动获取步数
......
......@@ -107,7 +107,7 @@
<image
:src="familyAvatar || defaultFamilyCover"
class="w-full h-48 rounded-lg object-cover"
mode="aspectFill"
mode="widthFix"
@tap="previewAvatar"
/>
<view
......
......@@ -3,7 +3,7 @@
<!-- Avatar -->
<view class="flex flex-col items-center py-8" @click="changeAvatar">
<view class="w-24 h-24 rounded-full bg-gray-100 flex items-center justify-center mb-2 overflow-hidden">
<image :src="formData.avatar_url || defaultAvatar" class="w-full h-full" mode="aspectFill" />
<image :src="formData.avatar_url || defaultAvatar" class="w-full h-full" mode="aspectFit" />
</view>
<text class="text-gray-500 text-sm">上传头像</text>
</view>
......
......@@ -28,7 +28,7 @@
<image
:src="item.url"
class="w-24 h-24 rounded-lg object-cover"
mode="aspectFill"
mode="widthFix"
@tap="() => previewImage(index)"
/>
<view
......
<!--
* @Date: 2022-09-19 14:11:06
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-09-04 10:35:11
* @LastEditTime: 2025-09-05 09:36:17
* @FilePath: /lls_program/src/pages/MyFamily/index.vue
* @Description: 我的家庭页面 - 展示用户加入的家庭列表
-->
......@@ -36,7 +36,7 @@
<image
:src="family.avatar_url || defaultFamilyCoverSvg"
class="w-full h-44 object-cover"
mode="aspectFill"
mode="widthFix"
/>
<!-- 家庭名称和大家长信息覆盖层 -->
......@@ -54,7 +54,7 @@
<!-- 成员头像叠加效果 -->
<view class="avatar-overlap">
<image
mode="aspectFill"
mode="aspectFit"
v-for="(member, index) in family?.users?.slice(0, 4) || []"
:key="member.id"
:src="member.avatar_url || defaultAvatar"
......
......@@ -33,7 +33,7 @@
<view v-if="currentPoster.path" class="w-full h-full relative">
<image
:src="currentPoster.path"
mode="aspectFit"
mode="widthFix"
class="w-full h-full"
/>
<!-- 打卡点标题 -->
......
<template>
<view class="min-h-screen bg-white pb-24">
<!-- 分享按钮 -->
<button id="share" data-name="shareBtn" open-type="share" style="font-size: 0.9rem; padding: 0; position: absolute; right: 40rpx; top: 40rpx; z-index: 1000;color: white; width: 70rpx; height: 70rpx; border-radius: 50%; background: rgba(0, 0, 0, 0.6);">分享</button>
<button id="share" data-name="shareBtn" open-type="share" style="font-size: 0.83rem; line-height: 3; padding: 0; position: absolute; right: 40rpx; top: 40rpx; z-index: 1000;color: white; width: 70rpx; height: 70rpx; border-radius: 50%; background: rgba(0, 0, 0, 0.6);">分享</button>
<!-- Top Image -->
<view class="w-full h-48">
<image :src="reward.image" class="w-full h-full object-cover" />
......
......@@ -25,7 +25,7 @@
<image
:src="uploadedFile.url"
class="w-full h-64 object-cover cursor-pointer"
mode="aspectFit"
mode="widthFix"
@tap="previewImage"
/>
<view
......@@ -46,7 +46,7 @@
v-if="uploadedFile.thumbnail"
:src="uploadedFile.thumbnail"
class="w-full h-full object-cover"
mode="aspectFit"
mode="widthFix"
/>
<view class="absolute inset-0 flex items-center justify-center">
<view class="w-16 h-16 bg-black bg-opacity-60 rounded-full flex items-center justify-center">
......
<!--
* @Date: 2022-09-19 14:11:06
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-09-04 09:20:14
* @LastEditTime: 2025-09-05 09:38:36
* @FilePath: /lls_program/src/pages/auth/index.vue
* @Description: 文件描述
-->
......