113 lines
4.9 KiB
Vue
113 lines
4.9 KiB
Vue
<template>
|
||
<view>
|
||
<status-nav navBarTitle="消息中心" returnColor="#c2c2c2"></status-nav>
|
||
<view v-show="ifDel" class="bacf pad-sx20 pad-zy40 fon24 disjbac animated" :class="ifDel ? 'fadeInDown' :'fadeOutUp'" style="position: sticky;" :style="{top: newTop+'px'}">
|
||
<view @tap="delEv(0)">删除所有</view>
|
||
<view @tap="delEv(1)">删除（{{delNum}}）</view>
|
||
</view>
|
||
<container-subgroup>
|
||
<view slot="content">
|
||
<view @longtap.stop="longTap(index)" @tap="chooseDel(index,item.id)" class="mar-x10 bacf" :style="{backgroundColor: (ifDel && item.status) ? '#dddddd' :''}" v-for="(item,index) in dataList" :key="index">
|
||
<view class="pad-sx30 pad-zy20 disjbac">
|
||
<view class="fon30 message-circle disac" :class="['activity-message','audit-failed','system-notification'][index]">{{item.title}}{{item.id}}</view>
|
||
<view class="fon26 col9">{{item.time}}</view>
|
||
</view>
|
||
<view class="bbot"></view>
|
||
<view class="fon27 line-h46 pad-zy20 pad-sx30" style="color: #737373;">{{item.content}}</view>
|
||
</view>
|
||
<pitera v-if="total==dataList.length" textStr="暂无更多"></pitera>
|
||
</view>
|
||
</container-subgroup>
|
||
<nothing-page v-if="dataList.length==0"></nothing-page>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
import pitera from '@/components/nothing/pitera.vue';
|
||
export default {
|
||
components:{
|
||
pitera
|
||
},
|
||
data() {
|
||
return {
|
||
delNum:0,
|
||
newTop: uni.getSystemInfoSync().statusBarHeight + 40,
|
||
ifDel:false,
|
||
total:12,
|
||
dataList:[
|
||
{id:1,title:'活动消息',time:'2020.06.17 18:30',content:'恭喜您成为第99位会员，我们将赠送您一张优惠 券，您可以享受8折优惠购买....',status:false},
|
||
{id:2,title:'活动消息',time:'2020.06.17 18:30',content:'恭喜您成为第99位会员，我们将赠送您一张优惠 券，您可以享受8折优惠购买....',status:false},
|
||
{id:3,title:'活动消息',time:'2020.06.17 18:30',content:'恭喜您成为第99位会员，我们将赠送您一张优惠 券，您可以享受8折优惠购买....',status:false},
|
||
{id:4,title:'活动消息',time:'2020.06.17 18:30',content:'恭喜您成为第99位会员，我们将赠送您一张优惠 券，您可以享受8折优惠购买....',status:false},
|
||
{id:5,title:'活动消息',time:'2020.06.17 18:30',content:'恭喜您成为第99位会员，我们将赠送您一张优惠 券，您可以享受8折优惠购买....',status:false},
|
||
{id:6,title:'活动消息',time:'2020.06.17 18:30',content:'恭喜您成为第99位会员，我们将赠送您一张优惠 券，您可以享受8折优惠购买....',status:false},
|
||
{id:7,title:'活动消息',time:'2020.06.17 18:30',content:'恭喜您成为第99位会员，我们将赠送您一张优惠 券，您可以享受8折优惠购买....',status:false},
|
||
{id:8,title:'活动消息',time:'2020.06.17 18:30',content:'恭喜您成为第99位会员，我们将赠送您一张优惠 券，您可以享受8折优惠购买....',status:false},
|
||
{id:9,title:'活动消息',time:'2020.06.17 18:30',content:'恭喜您成为第99位会员，我们将赠送您一张优惠 券，您可以享受8折优惠购买....',status:false},
|
||
{id:10,title:'活动消息',time:'2020.06.17 18:30',content:'恭喜您成为第99位会员，我们将赠送您一张优惠 券，您可以享受8折优惠购买....',status:false},
|
||
{id:11,title:'活动消息',time:'2020.06.17 18:30',content:'恭喜您成为第99位会员，我们将赠送您一张优惠 券，您可以享受8折优惠购买....',status:false},
|
||
{id:12,title:'活动消息',time:'2020.06.17 18:30',content:'恭喜您成为第99位会员，我们将赠送您一张优惠 券，您可以享受8折优惠购买....',status:false},
|
||
],
|
||
delArrId:[]
|
||
}
|
||
},
|
||
onLoad() {
|
||
this.getMessageList();
|
||
},
|
||
methods: {
|
||
// 查询消息列表
|
||
getMessageList(){
|
||
this.$requst.get('/universal/api.message/message_list',{page: 1,list_rows: 200}).then(res=>{
|
||
|
||
})
|
||
},
|
||
// 长按事件
|
||
longTap(index) {
|
||
console.log(index);
|
||
this.ifDel = true;
|
||
this.dataList[index].status = true;
|
||
this.delNum++;
|
||
this.delArrId.push(this.dataList[index].id);
|
||
},
|
||
// 删除事件
|
||
delEv(index) {
|
||
if(index) {
|
||
console.log('删除选中项');
|
||
this.delArrId.forEach(item=>{
|
||
this.dataList.forEach((item1,index1)=>{
|
||
if(item == item1.id) {
|
||
console.log(item);
|
||
this.dataList.splice(index1,1);
|
||
}
|
||
})
|
||
})
|
||
} else {
|
||
console.log('清空所有');
|
||
this.dataList = [];
|
||
}
|
||
this.ifDel = false;
|
||
this.delNum = 0;
|
||
this.delArrId = [];
|
||
},
|
||
// 选中删除
|
||
chooseDel(index,id){
|
||
if(this.ifDel) {
|
||
this.dataList[index].status = !this.dataList[index].status;
|
||
this.delNum = 0;
|
||
this.delArrId = [];
|
||
this.dataList.forEach(item=>{
|
||
if(item.status) {
|
||
this.delNum++;
|
||
this.delArrId.push(item.id);
|
||
}
|
||
})
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style>
|
||
|
||
</style>
|