ak/crm-uniapp
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

修复搜索框问题

Browse Source
This commit is contained in:
hupeng 2024-10-10 11:16:42 +08:00
parent 8d49a72484
commit 88d1c503c8
1 changed files with 20 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

84
pages/index/index.vue
View File

@ -1,15 +1,14 @@
<template> <template>
<uv-navbar leftIcon="" :safeAreaInsetTop="true" :fixed="false" bgColor="#09b4f1"> <uv-navbar leftIcon="" :safeAreaInsetTop="true" :fixed="false" bgColor="#09b4f1">
<!-- <view class="slot-wrap "> -->
<template v-slot:center> <template v-slot:center>
<uv-search placeholder="请输入搜索客户名称" v-model="keyword" bgColor="#ffffff" :showAction="false" :customStyle="customStyle" @focus="onSearch"></uv-search> <view class="slot-wrap">
<uv-search placeholder="请输入搜索客户名称" v-model="keyword" bgColor="#ffffff" :showAction="false"
:customStyle="customStyle" @focus="onSearch"></uv-search>
</view>
</template> </template>
<!-- </view> -->
</uv-navbar> </uv-navbar>
<view class="container"> <view class="container">
<!-- 浮动顶部导航 -->
<view class="top" style="background-color: #09b4f1;"> <view class="top" style="background-color: #09b4f1;">
<view class="statusBar" :is-back="false" style="height: 30rpx;" ></view> <view class="statusBar" :is-back="false" style="height: 30rpx;" ></view>
@ -63,11 +62,17 @@ import {
} from '@/api/index' } from '@/api/index'
const main = useMainStore() const main = useMainStore()
const statusBarHeight = ref(0) const statusBarHeight = ref(0)
const rightSafeArea = ref(0)
statusBarHeight.value = uni.getSystemInfoSync().statusBarHeight statusBarHeight.value = uni.getSystemInfoSync().statusBarHeight
const windowInfo = uni.getWindowInfo()
const { left } = uni.getMenuButtonBoundingClientRect()
rightSafeArea.value = windowInfo.windowWidth - left + 'px'
const customStyle = computed(() =>{ const customStyle = computed(() =>{
return { return {
paddingLeft:'20rpx', //width:'100%'
paddingRight:'180rpx' // paddingLeft:'20rpx',
paddingRight: rightSafeArea.value
} }
}) })
const customStyle2 = computed(() =>{ const customStyle2 = computed(() =>{
@ -257,24 +262,15 @@ const gopage2 = (url) =>{
padding-bottom: 50px; padding-bottom: 50px;
min-height: 100vh; min-height: 100vh;
} }
.status_bar {
height: var(--status-bar-height);
width: 100%;
}
.top { .top {
height: 110rpx; height: 110rpx;
/* #ifdef H5 */ /* #ifdef H5 */
height: 360rpx; height: 360rpx;
/* #endif */ /* #endif */
color: #fff; color: #fff;
// background-image: linear-gradient(#FF7E69, #FE644A);
} }
.share {
border: 1px solid #fff;
border-radius: 5px;
padding: 15rpx 30rpx;
}
.notice { .notice {
margin: -56px 8px 10px 8px; margin: -56px 8px 10px 8px;
left: 0; left: 0;
@ -326,6 +322,7 @@ const gopage2 = (url) =>{
display: flex; display: flex;
align-items: center; align-items: center;
padding: 0 30rpx; padding: 0 30rpx;
flex:1
} }
.statusBar { .statusBar {
position: relative; position: relative;
@ -335,11 +332,7 @@ const gopage2 = (url) =>{
bottom: 16px; bottom: 16px;
left: 10px; left: 10px;
} }
// /deep/ .u-avatar {
// display: block !important;
// }
// 图表样式
/* 请根据需求修改图表容器尺寸，如果父容器没有高度图表则会显示异常 */
.charts-box{ .charts-box{
.charts { .charts {
width: 100%; width: 100%;
@ -371,49 +364,8 @@ const gopage2 = (url) =>{
} }
} }
} }
// /deep/.left-icon .u-size-mini {
// display: block;
// }
// /deep/ .u-model__footer__button {
// height: auto !important;
// line-height: inherit !important;
// }
// /deep/ .u-border-top:after {
// border-top-width: 0;
// }
.privacy_block {
padding: 15px 20px;
font-size: 14px;
line-height: 24px;
text-align: justify;
}
.disagree-btn {
border-radius: 100px;
color: #323233;
background-color: #fff;
padding: 0 12px;
font-size: 14px;
height: 40px;
width: 100%;
border: none;
}
.agree-btn {
border-radius: 100px;
color: white;
background-color: #F15A24;
border-color: #F15A24 !important;
border-width: 1px !important;
border-style: solid !important;
padding: 0 12px;
font-size: 14px;
height: 40px;
width: 100%;
}
.disagree-btn::after, .agree-btn::after {
border: none;
}
.modal_btn {
padding: 0 30px 15px;
}
</style> </style>