dev/dcp-app-gate/pages/message/pageP.vue

<template>
  <view class="pagep">
	<view class="msgitem" v-for="(msgitem,msgidx) in dataList" :key = "msgidx">
		<uni-swipe-action style="width: 100%;">
			<uni-swipe-action-item :right-options="options" @click="deleteMsg(msgidx,msgitem)" >
				<view class="itemwrap"  @click = "goDetail(msgitem)">
					<view class="msgtitle">
						<view class="titletext">
							<text class="tag" v-if="msgitem.params!='read' && !msgitem.readStatus"></text>
							<text class="tag" v-if="msgitem.readStatus!='read' && !msgitem.params"></text>
							<text class="title">{{msgitem.title}}</text>
						</view>
						<view class="date">{{formatDate(msgitem.createDate)}}</view>
					</view>
					<view class="content">{{msgitem.content}}</view>
				</view>
			</uni-swipe-action-item>
		</uni-swipe-action>
	</view>
	<!-- 页面优化提示 -->
	<view class="loading" v-if="showLoading">
		<u-loadmore :status="status" iconType="flower" :load-text="{loading: $t('common.Loading')}"/>
	</view>
	<view class="nodata" v-if="!showLoading && dataList.length==0" style="text-align: center;margin-top: 120upx;">
		<view style="height:600upx;margin-bottom:60upx">
			<image src="../../static/img/public/7.png" style="width: 80%;margin:0 10%" mode="widthFix"></image>
		</view>
		<text style="font-size: 30upx;color:#ccc">{{$t('common.Nodata')}}</text>
	</view>
	<u-toast ref="uToast" />
  </view>
</template>

<script>
  import uniSwipeAction from '@/components/uni-swipe-action/uni-swipe-action.vue'

  export default {
    components: {
	  uniSwipeAction
    },
    data() {
      return {
		token:'',
		userId:'',
		pageSize:50,
		pageNo:1,
		msgType:'',
        dataList: [],
		Botcurrent:0,
		showLoading:true,
		status:'loading',
		BotMenuList: [
			{
				id: "tab01",
				name: this.$t('common.All'),
				msgid: 0
			},
			{
				id: "tab02",
				// name: '活动消息',
				name:this.$t('common.ActiveMessage'),
				msgid: 23
			},
			{
				id: "tab03",
				// name: '服务消息',
				name:this.$t('common.ServiceMessage'),
				msgid: 223
			}, {
				id: "tab04",
				// name: '审核消息',
				name:this.$t('common.ReviewMessage'),
				msgid: 221
			}
		],
		options:[
			{
				text:this.$t('common.Delete'),
				style: {
					fontSize:'12px',
					height:'30px',
					backgroundColor:'#f2a059',
					height:'60px'
				}
			}
		],
      }
    },
	onLoad(e){
		
	},
	created(){
		this.loadData()
	},
	onShow(){
		this.loadingText = this.$i18n.locale=='en'?'Loading ...':'加载中...';
		this.token=uni.getStorageSync('Auth-Token')?'Bearer '+uni.getStorageSync('Auth-Token'):'';
		this.userId  = uni.getStorageSync('user')? JSON.parse(uni.getStorageSync('user')).id:'';
	},
	onReachBottom(){
		this.loadMore()
	},
    methods: {
	  //加载数据
      async loadData(loadmore) {
		let params = {
			query:'',
			size:this.pageSize,
			page:this.pageNo
		}
		let res = await this.$myRequest({
			url:'/uc/platformNotify/findAll/',
			header:{token:this.token},
			data:params
		})
		if(res.status==200){
			let data =res.data
			if(data.list){
				if(data.list && Array.isArray(data.list) && data.list.length>0){
					if (!loadmore) {
					  this.dataList =data.list;
					} else {
					  this.dataList = this.dataList.concat(data.list);
					}
				}else{
					this.isNoData = true;
				}
			}
		}else{
			this.isNoData = true;
		}
		this.showLoading=false;
      }, 
	  
      loadMore(e) {
		this.pageNo++;
        this.loadData('loadmore');
      },
	  
	  // 删除数据
	  async deleteMsg(index,item){
		let res = await this.$myRequest({
			'method':'delete',
			url:'uc/sysPushMessages/deleteMsg',
			data:{ids:item.id}
		})
		if(res.status==200){
			this.$refs.uToast.show({
				title: this.$i18n.locale=='en'?'Delete Success ...':'删除成功',
				type: 'success',
			})
			if(this.dataList.length>0){
				this.dataList.splice(index,1)
			}
		}else{
			this.$refs.uToast.show({
				title: this.$i18n.locale=='en'?'Delete Fail ...':'删除失败',
				type: 'error',
			})
		}
	  },
	  
      goDetail(item) {
		 uni.setStorageSync('MsgDetail',item)
		 uni.navigateTo({
			url:'/pages/message/msgDetail?msgId='+item.id+'&msgType=0'
		 })
      },
    }
  }
</script>

<style scoped lang="scss">
  .msgitem{
  	  margin:20upx;
  	  padding:20upx 0;
  	  border-bottom:1px solid #eee;
  	  .itemwrap{
  		  width:100%;
  		  .msgtitle{
  			  display:flex;
  			  flex:1;
  			  justify-content:space-between;
  			  width:100%;
  			  .titletext{
  				  flex:1;
  				  .title{
  					  font-size:28upx;
  					  color:#333;
  				  }
  				  .tag{
  					  width:0;
  					  height:0;
  					  padding:8upx;
  					  border-radius:50%;
  					  background:#C50606;
  					  margin-right:8upx;
  				  }
  			  }
  			  .date{
  				  color:#aaa;
  				  margin-right:20upx;
  			  } 
  		  }
  		  .content{
  			  margin-top:10upx;
  			  line-height:50upx;
  			  color:#999;
  		  }
  	  }
  }
 
</style>