样式调整

shuishen

2021-08-19 6c2ee92d94328d24d4d734bae6dd2c6304c2a500

样式调整

 pages/groupChat/groupChat.vue

@@ -6,14 +6,17 @@

        <view style="height:205rpx;"></view>
        <view class="tab" style="position: fixed;top: 0;width: 100%;height: 205rpx;z-index: 100;">
            <u-navbar style="position: relative;left: -18rpx;" :is-fixed="false" :border-bottom="false" :is-back="false"
            <u-navbar style="position: relative;" :is-fixed="false" :border-bottom="false" :is-back="false"
                title="好友" :background="{ background: '#0BB9C8' }" title-color="#fff">
                <image @click="addFriend" slot="right" src="../../static/add.png" class="message-icon" mode="widthFix"></image>
                <u-icon @click="addFriend" slot="right" class="message-icon" mode="widthFix" name="plus" color="#fff">
                </u-icon>
                <!-- <image  src="../../static/add.png" ></image> -->
            </u-navbar>
            <u-tabs :list="list" :is-scroll="false" :current="current" active-color="#14B9C8" inactive-color="#595959"
                height="100" @change="change" style="background-color:rgba(255,255,255,0.8)"></u-tabs>
                height="100" @change="change" style="background-color:rgba(255,255,255,0.8); "></u-tabs>
        </view>
        <swiper id="swiperBox" style="height: 100%;" :current="current" @change="tabsChange">
		
        <swiper id="swiperBoxPeo" :style="{ height: swiperHeight + 'px' }" :current="current" @change="tabsChange">
            <swiper-item class="swiper-item" v-for="(item, indexs) in list" :key="indexs">
                <view v-if="indexs == 0" class="main">
                    <div>
@@ -128,7 +131,6 @@
            let that = this;
            uni.getSystemInfo({
                success(e) {
                    console.log(e);
                    let {
                        windowWidth,
                        windowHeight,
@@ -136,9 +138,11 @@
                    } = e;
                    const query = uni.createSelectorQuery().in(that);
                    query
                        .select('#swiperBox')
                        .select('#swiperBoxPeo')
                        .boundingClientRect(data => {
							
                            that.swiperHeight = safeArea.bottom - data.top;
							
                        })
                        .exec();
                }
@@ -181,7 +185,6 @@
                                }
                            }
                            that.dataListP = resdata;
                            that.swiperHeight = resdata.length * 85;
                        }
                    });
                } else if (this.current == 1) {
@@ -199,8 +202,14 @@
                                    resdata[i].avatar = "http://s16s652780.51mypc.cn/img/bg/img-logo.png";
                                }
                            }
                            that.dataListTXL = resdata;
                            // that.swiperHeight = resdata.length * 95;

                            that.dataListTXL = [];
                            for (var i = 0; i < 100; i++) {
                                that.dataListTXL.push(resdata[0])
                            }


                            // that.dataListTXL = resdata;
                        }
                    })
                } else if (this.current == 2) {
@@ -249,7 +258,6 @@

        },
        onPageScroll(e) {
            // console.log(e.scrollTop, 'pingmu')
            this.rect = e.scrollTop
        },
        watch: {
@@ -275,7 +283,7 @@
    .work {
        width: 100%;
        height: 100%;
        padding: 0rem 2.5% 3rem 2.5%;
        padding: 0;
        box-sizing: border-box;

        .hello {
@@ -355,15 +363,16 @@
            }

            .m-main {
                padding-left: 32upx;
                box-sizing: border-box;
                .main {
                    padding: 0 16px;
                }
            }
        }
    }

    .message-icon {
        width: 42rpx;
        height: auto;
        font-size: 28px;
        margin-right: 27rpx;
    }

@@ -376,9 +385,8 @@
    .applys {
        display: flex;
        // margin: 40rpx 0;
        padding: 40rpx 0;
        margin: 16rpx 32rpx !important;
        height: 130rpx;
        padding: 16upx 0;
        align-items: center;
        border-bottom: 1px solid rgba(0, 0, 0, .1);

@@ -477,4 +485,8 @@
            }
        }
    }
	
    .swiper-item {
        overflow-y: auto !important;
    }
</style>