小程序修正

This commit is contained in:
2025-12-23 13:27:36 +08:00
parent cfb160cf09
commit ce66812c82
48 changed files with 766 additions and 735 deletions

View File

@@ -10,30 +10,30 @@
top: 0;
left: 0;
right: 0;
height: 176rpx;
padding-top: 88rpx;
background: #fff;
display: flex;
align-items: center;
flex-direction: row;
align-items: flex-end;
padding-left: 24rpx;
padding-right: 24rpx;
padding-bottom: 16rpx;
box-sizing: border-box;
z-index: 100;
}
.nav-back {
width: 60rpx;
height: 60rpx;
height: 64rpx;
display: flex;
align-items: center;
justify-content: center;
}
.back-arrow {
.nav-back-icon {
width: 20rpx;
height: 20rpx;
border-left: 4rpx solid #222;
border-bottom: 4rpx solid #222;
border-left: 4rpx solid #333;
border-bottom: 4rpx solid #333;
transform: rotate(45deg);
}
@@ -43,6 +43,7 @@
font-weight: 600;
color: #222;
margin-left: 16rpx;
line-height: 64rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;

View File

@@ -6,7 +6,7 @@
<!-- 自定义导航栏 -->
<view class="nav" :style="{ paddingTop: headerPaddingTop + 'px', height: headerTotalHeight + 'px' }">
<view class="nav-back" @tap="goBack">
<text class="nav-back-icon"></text>
<view class="nav-back-icon"></view>
</view>
<text class="nav-title">{{ roomName }}</text>
<view class="nav-actions">

View File

@@ -8,57 +8,55 @@
top: 0;
left: 0;
right: 0;
height: 176rpx;
padding-top: 88rpx;
background: #fff;
display: flex;
align-items: center;
justify-content: flex-start;
flex-direction: row;
align-items: flex-end;
padding-left: 24rpx;
padding-right: 24rpx;
padding-bottom: 16rpx;
box-sizing: border-box;
z-index: 100;
}
.nav-back {
width: 60rpx;
height: 60rpx;
height: 64rpx;
display: flex;
align-items: center;
justify-content: center;
}
.back-arrow {
.nav-back-icon {
width: 20rpx;
height: 20rpx;
border-left: 4rpx solid #222;
border-bottom: 4rpx solid #222;
border-left: 4rpx solid #333;
border-bottom: 4rpx solid #333;
transform: rotate(45deg);
}
.nav-title {
font-size: 34rpx;
font-weight: 600;
color: #222;
flex: 1;
font-size: 34rpx;
font-weight: 500;
color: #333;
text-align: center;
padding-right: 174rpx;
line-height: 64rpx;
}
.nav-capsule {
width: 174rpx;
height: 64rpx;
border-radius: 32rpx;
}
.list {
margin-top: 176rpx;
padding: 20rpx 24rpx;
padding-bottom: 60rpx;
}
.room-card {
display: flex;
flex-direction: row;
align-items: center;
padding: 24rpx;
background: #fff;
@@ -85,12 +83,14 @@
.room-info {
flex: 1;
flex-direction: column;
margin-left: 20rpx;
overflow: hidden;
}
.room-header {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin-bottom: 12rpx;
@@ -115,6 +115,7 @@
.room-footer {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}

View File

@@ -4,16 +4,16 @@
<!-- #endif -->
<view class="page">
<!-- 自定义导航栏 -->
<view class="nav" :style="{ paddingTop: headerPaddingTop + 'px', height: headerTotalHeight + 'px' }">
<view class="nav" :style="{ paddingTop: navPaddingTop + 'px', height: navHeight + 'px' }">
<view class="nav-back" @tap="goBack">
<text class="nav-back-icon"></text>
<view class="nav-back-icon"></view>
</view>
<text class="nav-title">我的聊天室</text>
<view class="nav-capsule"></view>
</view>
<!-- 聊天室列表 -->
<scroll-view class="list" scroll-y="true" :style="{ marginTop: headerTotalHeight + 'px' }">
<scroll-view class="list" scroll-y="true" :style="{ marginTop: navHeight + 'px' }">
<view class="room-card" v-for="(room, index) in chatRooms" :key="index" @tap="enterRoom(room)">
<view class="room-avatar">
<text class="avatar-text">{{ room.guestName?.charAt(0) || '客' }}</text>
@@ -53,9 +53,10 @@
import { ref, onMounted } from 'vue'
import type { ChatRoomVO } from '@/types/workcase'
// 响应式数据
const headerPaddingTop = ref<number>(44)
const headerTotalHeight = ref<number>(88)
// 导航栏
const navPaddingTop = ref<number>(0)
const navHeight = ref<number>(44)
const capsuleHeight = ref<number>(32)
// 聊天室列表
const chatRooms = ref<ChatRoomVO[]>([
@@ -94,24 +95,23 @@ const chatRooms = ref<ChatRoomVO[]>([
// 生命周期
onMounted(() => {
uni.getSystemInfo({
success: (res) => {
// #ifdef MP-WEIXIN
try {
const menuButtonInfo = uni.getMenuButtonBoundingClientRect()
headerPaddingTop.value = menuButtonInfo.top
headerTotalHeight.value = menuButtonInfo.bottom + 8
} catch (e) {
headerPaddingTop.value = res.statusBarHeight || 44
headerTotalHeight.value = (res.statusBarHeight || 44) + 44
}
// #endif
// #ifndef MP-WEIXIN
headerPaddingTop.value = res.statusBarHeight || 44
headerTotalHeight.value = (res.statusBarHeight || 44) + 44
// #endif
}
})
// #ifdef MP-WEIXIN
try {
const menuButton = uni.getMenuButtonBoundingClientRect()
navPaddingTop.value = menuButton.top
capsuleHeight.value = menuButton.height
navHeight.value = menuButton.bottom + 8
} catch (e) {
const sysInfo = uni.getSystemInfoSync()
navPaddingTop.value = sysInfo.statusBarHeight || 20
navHeight.value = navPaddingTop.value + 44
}
// #endif
// #ifndef MP-WEIXIN
const sysInfo = uni.getSystemInfoSync()
navPaddingTop.value = sysInfo.statusBarHeight || 20
navHeight.value = navPaddingTop.value + 44
// #endif
loadChatRooms()
})