智慧保安互联网APP
shuishen
2021-08-18 1b1d3e2b3c9e767932bddf2671172235b8fbd16a
pages/groupChat/groupChat.vue
@@ -3,11 +3,11 @@
   <view class="work">
      <!-- 自定义顶部导航栏 -->
      <!-- <navBarTop :title="'聊天室'"></navBarTop> -->
      <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: -20rpx;" :is-fixed="false" :border-bottom="false" :is-back="false" title="好友"
            :background="{ background: '#0BB9C8' }" title-color="#fff">
         <u-navbar style="position: relative;left: -20rpx;" :is-fixed="false" :border-bottom="false" :is-back="false"
            title="好友" :background="{ background: '#0BB9C8' }" title-color="#fff">
            <image slot="right" src="/static/images/home/message.png" class="message-icon" mode="widthFix"></image>
         </u-navbar>
         <u-tabs :list="list" :is-scroll="false" :current="current" active-color="#14B9C8" inactive-color="#595959"
@@ -30,8 +30,21 @@
               <div>
                  <div class="m-main">
                     <!-- <view class="inTitle">{{Task}}</view> -->
                     <view class="applys" @click="toFriendRequest">
                        <view class="head-wrap">
                           <image src="../../static/apply.png" class="head" />
                           <view v-if=false class="tip">233</view>
                        </view>
                        <view class="content-wrap">
                           <text class="name">好友申请</text>
                           <text class="mess">若人生只如初见</text>
                        </view>
                        <view class="data-wrap">
                           <text class="data"></text>
                        </view>
                     </view>
                     <view class="inTmain">
                        <contacts v-for="(item,index) in dataListQZ" :key="index" :Pdata="item" :fromW="indexs"
                        <contacts v-for="(item,index) in dataListTXL" :key="index" :Pdata="item" :fromW="indexs"
                           @refreshTask="refreshTask"></contacts>
                     </view>
                  </div>
@@ -42,7 +55,7 @@
                  <div class="m-main">
                     <!-- <view class="inTitle">{{Task}}</view> -->
                     <view class="inTmain">
                        <contacts v-for="(item,index) in dataListTXL" :key="index" :Pdata="item" :fromW="indexs"
                        <contacts v-for="(item,index) in dataListQZ" :key="index" :Pdata="item" :fromW="indexs"
                           @refreshTask="refreshTask"></contacts>
                     </view>
                  </div>
@@ -50,7 +63,7 @@
            </view>
         </swiper-item>
      </swiper>
   </view>
</template>
@@ -59,9 +72,10 @@
   import axios from '../../static/lib/axios.js'
   import contacts from '../../components/contacts/contacts.vue'
   import navBarTop from '../../components/nav-bar-top/nav-bar-top.vue';
   export default{
   export default {
      components: {
         navBarTop,contacts
         navBarTop,
         contacts
      },
      data() {
         return {
@@ -69,10 +83,10 @@
                  name: '正在聊天'
               },
               {
                  name: '群组'
                  name: '好友'
               },
               {
                  name: '好友'
                  name: '群组'
               }
            ],
            swiperHeight: 0,
@@ -81,7 +95,7 @@
            show: true,
            dataListP: [],
            dataListQZ: [],
            dataListTXL:[],
            dataListTXL: [],
            fromW: '',
            onTop: false, //是否吸顶
            rect: '', //页面滚动距离
@@ -91,30 +105,30 @@
            userName: '',
         }
      },
      activated(){
            this.beginObj();
            this.getdataList(0);
          },
         onReady() {
            let that = this;
            uni.getSystemInfo({
               success(e) {
                  console.log(e);
                  let {
                     windowWidth,
                     windowHeight,
                     safeArea
                  } = e;
                  const query = uni.createSelectorQuery().in(that);
                  query
                     .select('#swiperBox')
                     .boundingClientRect(data => {
                        that.swiperHeight = safeArea.bottom - data.top;
                     })
                     .exec();
               }
            });
         },
      activated() {
         this.beginObj();
         this.getdataList(0);
      },
      onReady() {
         let that = this;
         uni.getSystemInfo({
            success(e) {
               console.log(e);
               let {
                  windowWidth,
                  windowHeight,
                  safeArea
               } = e;
               const query = uni.createSelectorQuery().in(that);
               query
                  .select('#swiperBox')
                  .boundingClientRect(data => {
                     that.swiperHeight = safeArea.bottom - data.top;
                  })
                  .exec();
            }
         });
      },
      methods: {
         change(index) {
            this.current = index;
@@ -137,17 +151,17 @@
         },
         getdataList() {
            var that = this;
            if(this.current == 0){
            if (this.current == 0) {
               uni.request({
                  url:"http://223.82.109.183:2080/api/chat-records/getChatListPage",
                  method:"get",
                  data:{
                  url: this.$store.state.piAPI + "/chat-records/getChatListPage",
                  method: "get",
                  data: {
                     senderId: WxStorage.get("ids")
                  },
                  success:(res)=> {
                  success: (res) => {
                     var resdata = res.data.data;
                     for (var i = 0; i < resdata.length; i++) {
                        if(resdata[i].avatar == null || resdata[i].avatar == ""){
                        if (resdata[i].avatar == null || resdata[i].avatar == "") {
                           resdata[i].avatar = "http://s16s652780.51mypc.cn/img/bg/img-logo.png";
                        }
                     }
@@ -155,54 +169,59 @@
                     that.swiperHeight = resdata.length * 85;
                  }
               });
            }else if(this.current == 1){
            } else if (this.current == 1) {
               uni.request({
                  url:"http://223.82.109.183:2080/api/chatgroup/selectList",
                  method:"POST",
                  data:{
                  url: this.$store.state.piAPI + "/friend/page?current=1&size=9999",
                  method: "get",
                  data: {
                     applicant: WxStorage.get("ids")
                  },
                  success: (res) => {
                     var resdata = res.data.data.records;
                     for (var i = 0; i < resdata.length; i++) {
                        if (resdata[i].avatar == null || resdata[i].avatar == "") {
                           resdata[i].avatar = "http://s16s652780.51mypc.cn/img/bg/img-logo.png";
                        }
                     }
                     that.dataListTXL = resdata;
                     // that.swiperHeight = resdata.length * 95;
                  }
               })
            } else if (this.current == 2) {
               uni.request({
                  url: this.$store.state.piAPI + "/chatgroup/selectList",
                  method: "POST",
                  data: {
                     senderId: WxStorage.get("ids")
                  },
                  success:(res)=> {
                     var resdata = res.data.data;
                  success: (res) => {
                     var resdata = res.data.data;
                     for (var i = 0; i < resdata.length; i++) {
                        if(resdata[i].avatar == null || resdata[i].avatar == ""){
                        if (resdata[i].avatar == null || resdata[i].avatar == "") {
                           resdata[i].avatar = "http://s16s652780.51mypc.cn/img/bg/qunz.png";
                        }
                     }
                     that.dataListQZ = resdata;
                     that.swiperHeight = resdata.length * 85;
                  }
               })
            }else if(this.current == 2){
               uni.request({
                  url:"http://223.82.109.183:2080/api/blade-user/page?current=1&size=9999",
                  method:"get",
                  data:{
                     senderId: WxStorage.get("ids")
                  },
                  success:(res)=> {
                     var resdata = res.data.data.records;
                     for (var i = 0; i < resdata.length; i++) {
                        if(resdata[i].avatar == null || resdata[i].avatar == ""){
                           resdata[i].avatar = "http://s16s652780.51mypc.cn/img/bg/img-logo.png";
                        }
                     }
                     that.dataListTXL = resdata;
                     that.swiperHeight = resdata.length * 85;
                  }
               })
               });
            }
         },
         refreshTask() {
            this.getdataList(1);
         },
         toFriendRequest(){
            uni.navigateTo({
               url: '/pages/groupChat/friendrequest?'
            });
         }
      },
      mounted() {
         this.beginObj();
         this.getdataList(0);
      },
      onPageScroll(e) {
         // console.log(e.scrollTop, 'pingmu')
@@ -220,14 +239,14 @@
      onLoad: function(options) {
         this.userName = options.login;
         // if(options.txlType == 2){
            this.current = 2;
         // this.current = 0;
         // }
      }
   }
</script>
<style lang="scss">
<style lang="scss" scoped>
   .work {
      width: 100%;
      height: 100%;
@@ -269,8 +288,8 @@
      }
      .main {
         margin-top: 0.625rem;
         margin-top: 0.225rem;
         .m-title {
            width: 100%;
            height: 2rem;
@@ -307,18 +326,102 @@
               padding-bottom: 0.5rem;
               box-sizing: border-box;
            }
         }
         .m-main {
            padding-left: 32upx;
            box-sizing: border-box;
         }
      }
   }
   .message-icon {
      width: 32rpx;
      height: auto;
      margin-right: 27rpx;
   }
   .top-bar {
      background-color: rgba(255, 255, 255, .96);
      // background-color: #42B983;
      box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, .1);
   }
   .applys {
      display: flex;
      // margin: 40rpx 0;
      padding: 40rpx 0;
      height: 130rpx;
      padding: 16upx 0;
      align-items: center;
      border-bottom: 1px solid rgba(0, 0, 0, .1);
      &:active {
         background-color: rgba(243, 244, 246, 1);
      }
      .head-wrap {
         position: relative;
         image {
            width: 96rpx;
            height: 96rpx;
            border-radius: 20upx;
            background-color: rgba(255, 228, 49, 1);
         }
         .tip {
            position: absolute;
            top: -6rpx;
            left: 68rpx;
            height: 36rpx;
            min-width: 20rpx;
            min-height: 20rpx;
            background-color: rgba(255, 93, 91, 1);
            border-radius: 18rpx;
            padding: 0 6rpx;
            font-size: 24upx;
            color: rgba(255, 228, 49, 1);
            line-height: 36rpx;
            text-align: center;
         }
      }
      .content-wrap {
         margin-left: 32rpx;
         flex: 1;
         .name {
            display: block;
            color: rgba(39, 40, 50, 1);
            font-size: 36rpx;
            font-weight: 400;
            line-height: 50rpx;
         }
         .mess {
            display: block;
            color: rgba(39, 40, 50, .6);
            font-size: 28upx;
            line-height: 40rpx;
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 1;
            overflow: hidden;
         }
      }
      .data-wrap {
         justify-content: right;
         .data {
            font-size: 24upx;
            color: rgba(39, 40, 50, 0.4);
            line-height: 50rpx;
         }
      }
   }
</style>