修改输入框样式问题,首页布局问题
This commit is contained in:
@@ -304,7 +304,7 @@ onReady(() => {
|
|||||||
padding: 20rpx 0rpx;
|
padding: 20rpx 0rpx;
|
||||||
margin-top: 10rpx;
|
margin-top: 10rpx;
|
||||||
justify-content: flex-start;
|
justify-content: flex-start;
|
||||||
gap: 20rpx;
|
gap: 30rpx;
|
||||||
margin: 0rpx 40rpx;
|
margin: 0rpx 40rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -192,7 +192,9 @@ const handleConfirm = () => {
|
|||||||
flex: 1;
|
flex: 1;
|
||||||
font-size: 32rpx;
|
font-size: 32rpx;
|
||||||
color: #333;
|
color: #333;
|
||||||
height: 100%;
|
/* height: 100%; */
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 密码规则提示 */
|
/* 密码规则提示 */
|
||||||
|
|||||||
@@ -210,7 +210,8 @@ const handleConfirm = () => {
|
|||||||
flex: 1;
|
flex: 1;
|
||||||
font-size: 32rpx;
|
font-size: 32rpx;
|
||||||
color: #333;
|
color: #333;
|
||||||
height: 100%;
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
.verify-input {
|
.verify-input {
|
||||||
padding-right: 20rpx;
|
padding-right: 20rpx;
|
||||||
|
|||||||
@@ -5,6 +5,8 @@
|
|||||||
|
|
||||||
<!-- 页面内容区 -->
|
<!-- 页面内容区 -->
|
||||||
<view class="page-content">
|
<view class="page-content">
|
||||||
|
<!-- 粘性顶部区域(状态栏 + 导航栏 + 小区选择) -->
|
||||||
|
<view class="sticky-header">
|
||||||
<!-- 状态栏占位 -->
|
<!-- 状态栏占位 -->
|
||||||
<view class="status_bar" :style="{ height: statusBarHeight + 'px' }"></view>
|
<view class="status_bar" :style="{ height: statusBarHeight + 'px' }"></view>
|
||||||
<!-- 导航栏 -->
|
<!-- 导航栏 -->
|
||||||
@@ -31,7 +33,10 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- 可滚动内容区 -->
|
||||||
|
<view class="scroll-content">
|
||||||
<!-- banner -->
|
<!-- banner -->
|
||||||
<view class="bannarClass">
|
<view class="bannarClass">
|
||||||
<uni-swiper-dot
|
<uni-swiper-dot
|
||||||
@@ -146,11 +151,12 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref } from 'vue'
|
import { ref } from 'vue'
|
||||||
import { onLoad, onUnload } from '@dcloudio/uni-app'
|
import { onLoad, onUnload ,onShow} from '@dcloudio/uni-app'
|
||||||
import {
|
import {
|
||||||
getCurrentVillage,
|
getCurrentVillage,
|
||||||
getTodayInspection,
|
getTodayInspection,
|
||||||
@@ -297,13 +303,16 @@ const slelctHomeData = data => {
|
|||||||
getNoticeData()
|
getNoticeData()
|
||||||
getInspectionData()
|
getInspectionData()
|
||||||
}
|
}
|
||||||
|
onShow(()=>{
|
||||||
|
getbannarData()
|
||||||
|
})
|
||||||
|
|
||||||
onLoad(() => {
|
onLoad(() => {
|
||||||
uni.$on('confirm', slelctHomeData)
|
uni.$on('confirm', slelctHomeData)
|
||||||
// 优先调用接口获取当前小区,失败时再读缓存
|
// 优先调用接口获取当前小区,失败时再读缓存
|
||||||
currentVillageData()
|
currentVillageData()
|
||||||
getInspectionData()
|
getInspectionData()
|
||||||
getbannarData()
|
// getbannarData()
|
||||||
})
|
})
|
||||||
|
|
||||||
onUnload(() => {
|
onUnload(() => {
|
||||||
@@ -326,13 +335,13 @@ const onSwiperChange = e => {
|
|||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 顶部渐变背景 */
|
/* 顶部渐变背景 - 增加高度确保覆盖粘性头部区域 */
|
||||||
.bg-gradient {
|
.bg-gradient {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
top: 0;
|
top: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
height: 400rpx;
|
height: 600rpx;
|
||||||
background: repeating-linear-gradient(to right, #edf4fa, #c0e4fb);
|
background: repeating-linear-gradient(to right, #edf4fa, #c0e4fb);
|
||||||
z-index: 0;
|
z-index: 0;
|
||||||
}
|
}
|
||||||
@@ -344,6 +353,19 @@ const onSwiperChange = e => {
|
|||||||
padding: 0 40rpx 40rpx;
|
padding: 0 40rpx 40rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 粘性头部区域 - 滚动时固定在顶部 */
|
||||||
|
.sticky-header {
|
||||||
|
position: sticky;
|
||||||
|
top: 0;
|
||||||
|
z-index: 100;
|
||||||
|
/* 与顶部渐变背景一致,保证滚动时视觉效果连贯 */
|
||||||
|
background: repeating-linear-gradient(to right, #edf4fa, #c0e4fb);
|
||||||
|
margin: 0 -40rpx; /* 抵消父容器内边距,使背景完全延伸 */
|
||||||
|
padding: 0 40rpx;
|
||||||
|
/* 可选:添加轻微阴影增强层次感 */
|
||||||
|
box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.02);
|
||||||
|
}
|
||||||
|
|
||||||
.status_bar {
|
.status_bar {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
@@ -407,6 +429,12 @@ const onSwiperChange = e => {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 可滚动内容区域 */
|
||||||
|
.scroll-content {
|
||||||
|
/* 确保内部元素正常布局 */
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
.bannarClass {
|
.bannarClass {
|
||||||
padding: 20rpx 0;
|
padding: 20rpx 0;
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user