增加用户绑定页面

qingyiay

2023-06-20 3f10299a92e23fd902e4bd51a6d59f9bf0c7d7ec

 pages/public-page/message/message.vue

@@ -1,22 +1,47 @@
<template>
   <view class="message-body">
      <u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png" v-if="messageList.length == 0" width="400" height="400" textSize="18"></u-empty>
      <u-list @scroll="scrolltolower" :height="1400">
      <u-empty mode="data"
         icon="http://cdn.uviewui.com/uview/empty/data.png"
         v-if="messageList.length == 0"
         width="400"
         height="400"
         textSize="18"></u-empty>
      <view class="message-list">
         <u-list @scrolltolower="scrolltolower"
            :height="1400">
         <u-list-item>
            <u-swipe-action>
               <u-swipe-action-item :options="options1" v-for="(item, index) in messageList" :key="item.id" @click="deleteMsg(item, index)">
                  <u-badge :isDot="true" type="error" v-if="item.status !== 1"></u-badge>
                  <u-cell size="large" :title="item.title" @click="messageDetails(item, index)">
                     <u-parse :content="item.content" slot="label"></u-parse>
                  <u-swipe-action-item :options="options1"
                     :threshold="50"
                     v-for="(item, index) in messageList"
                     :key="item.id"
                     @click="deleteMsg(item, index)">
                     <u-badge :isDot="true"
                        type="error"
                        v-if="item.status !== 1"></u-badge>
                     <u-cell size="large"
                        :title="item.title"
                        @click="messageDetails(item, index)">
                        <u-parse :content="item.content"
                           slot="label"></u-parse>

                     <view class="prepose" slot="icon"><u-icon name="volume" color="#035CFB" size="40"></u-icon></view>
                        <view class="prepose"
                           slot="icon"><u-icon name="volume"
                              color="#035CFB"
                              size="40"></u-icon></view>
                  </u-cell>
               </u-swipe-action-item>
            </u-swipe-action>
         </u-list-item>
         <view class="more-text" v-if="showMoreData && messageList.length !== 0">没有数据了...</view>
            <!-- <view class="more-text"
               v-if="showMoreData && messageList.length !== 0">没有数据了...</view> -->
      </u-list>
      <u-modal :show="show" :content="content" :showCancelButton="true" @confirm="confirm" @cancel="cancel"></u-modal>
      </view>
      <u-modal :show="show"
         :content="content"
         :showCancelButton="true"
         @confirm="confirm"
         @cancel="cancel"></u-modal>
   </view>
</template>

@@ -29,11 +54,9 @@
         total: '',
         messageList: [],
         showMoreData: false,
         options1: [
            {
            options1: [{
               text: '删除'
            }
         ],
            }],
         show: false,
         content: '是否确认删除',
         id: '',
@@ -63,21 +86,17 @@
            if (res.code == 0) {
               uni.hideLoading();
               this.total = res.data.total;
               const regex = /<[^>]*>([^<]*)<\/[^>]*>/g;

               const solveHandle = v => {
                  const regex = /<[^>]*>([^<]*)<\/[^>]*>/g;
                  let result = v.replace(regex, (match, p1) => {
                     return p1.length > 8 ? p1.slice(0, 8) + '...' : p1;
                  });
                  return result;
               };
                  function removeTags(str) {
                     return str.replace(/<\/?[^>]+>/gi, '');
                  }
               if (this.pageNum > 1) {
                  this.messageList = this.messageList.concat(res.data.records);
                  this.messageList = this.messageList.map(v => {
                     return {
                        ...v,
                        content: solveHandle(v.content)
                           title: v.title.slice(0, 8) + '...',
                           content: removeTags(v.content).trim().slice(0, 8) + '...'
                     };
                  });
               } else if (this.pageNum == 1) {
@@ -85,7 +104,8 @@
                  this.messageList = this.messageList.map(v => {
                     return {
                        ...v,
                        content: solveHandle(v.content)
                           title: v.title.slice(0, 8) + '...',
                           content: removeTags(v.content).trim().slice(0, 8) + '...'
                     };
                  });
               }
@@ -97,7 +117,11 @@
      // 已读消息
      messageDetails(value, index) {
         if (value.status == 0) {
            this.$reqAllJson('readMessage', { id: value.id, status: value.status }, { method: 'PUT', 'Content-Type': 'application/json' }).then(res => {
               this.$reqAllJson('readMessage', {
                  id: value.id,
                  status: value
                     .status
               }, { method: 'PUT', 'Content-Type': 'application/json' }).then(res => {
               if (res.code == 0) {
                  uni.navigateTo({
                     url: `/pages/public-page/messageDetails/messageDetails?messageId=${value.messageId}&id=${value.id}`
@@ -125,9 +149,12 @@
                  uni.showLoading({
                     title: '加载中'
                  });
                  this.$reqGet('getMessageByUser', { current: 1, size: this.pageSize }).then(res => {
                     this.$reqGet('getMessageByUser', { current: 1, size: this.pageSize }).then(
                        res => {
                     uni.hideLoading();
                     this.total = res.data.total;
                           this.messageList = [];
                           this.pageNum = 1
                     this.messageList = res.data.records;
                  });
               }, 800);
@@ -143,20 +170,24 @@
};
</script>

<style lang="scss" scoped>
<style lang="scss"
   scoped>
@mixin flex {
   display: flex;
   justify-content: center;
   align-items: center;
}

::v-deep .u-list-item- {
   position: relative;

   .u-badge {
      position: absolute;
      left: vww(45);
      top: vww(13);
   }
}

::v-deep .u-cell__title-text {
   height: 32rpx;
   font-size: 34rpx !important;
@@ -164,9 +195,15 @@
   color: #2f2f2f !important;
   margin-bottom: vww(18);
}

.message-body {
   width: 100%;
   height: 100%;

      .message-list {
         margin: vww(5) 0;
      }

   .prepose {
      width: 89rpx;
      height: 89rpx;
@@ -175,6 +212,7 @@
      @include flex;
      margin-right: vww(32);
   }

   .more-text {
      color: #999;
      font-size: 24rpx;