样式调整

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>
@@ -53,7 +56,7 @@
            <view v-if="indexs == 2" class="main">
               <div>
                  <div class="m-main">
							

                     <view class="applys" @click="newGroup">
                        <view class="head-wraps">
                           <image src="../../static/qunzhu.png" class="head" />
@@ -67,7 +70,7 @@
                           <text class="data"></text>
                        </view>
                     </view>
							

                     <!-- <view class="inTitle">{{Task}}</view> -->
                     <view class="inTmain">
                        <contacts v-for="(item,index) in dataListQZ" :key="index" :Pdata="item" :fromW="indexs"
@@ -78,7 +81,7 @@
            </view>
         </swiper-item>
      </swiper>

		
   </view>
</template>

@@ -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) {
@@ -211,7 +220,7 @@
                  data: {
                     id: WxStorage.get("ids")
                  },
                  contentType:"application/x-www-form-urlencoded",
                  contentType: "application/x-www-form-urlencoded",
                  success: (res) => {
                     var resdata = res.data.data;
                     for (var i = 0; i < resdata.length; i++) {
@@ -227,17 +236,17 @@
         refreshTask() {
            this.getdataList(1);
         },
         toFriendRequest(){
         toFriendRequest() {
            uni.navigateTo({
               url: '/pages/groupChat/friendrequest?'
            });
         },
         addFriend(){
         addFriend() {
            uni.navigateTo({
               url: '/pages/groupChat/addFriend?'
            });
         },
         newGroup(){
         newGroup() {
            uni.navigateTo({
               url: '/pages/groupChat/newGroup/newGroup?'
            });
@@ -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);

@@ -413,18 +421,18 @@
            text-align: center;
         }
      }
		

      .head-wraps {
         position: relative;
		
		


         image {
            width: 96rpx;
            height: 96rpx;
            border-radius: 20upx;
            background-color: rgba(85, 170, 255, 1.0);
         }
		

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