293 lines
6.3 KiB
Vue
293 lines
6.3 KiB
Vue
<!-- 消息通知 -->
|
|
<template>
|
|
|
|
<view style="position: fixed; top: 0;bottom: 0; left: 0; right: 0;background:#ffffff; z-index: -2;"></view>
|
|
|
|
<view class="box">
|
|
<view class="boxview" @click="handerTo('./Interactivemessage')">
|
|
<view class="boxmessge"></view>
|
|
<image class="boximage" src="../../static/images/sign/message2.png"></image>
|
|
<text class="boxtext">互动消息</text>
|
|
</view>
|
|
<view class="boxview" @click="handerTo('./systemnotification?id=1')">
|
|
<view class="boxmessge"></view>
|
|
<image class="boximage" src="../../static/images/sign/message.png"></image>
|
|
<text class="boxtext">系统通知</text>
|
|
</view>
|
|
<view class="boxview" @click="handerTo('./systemnotification?id=2')">
|
|
<view class="boxmessge"></view>
|
|
<image class="boximage" src="../../static/images/sign/message1.png"></image>
|
|
<text class="boxtext">审核通知</text>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
<!-- 内容 -->
|
|
<view>
|
|
<up-swipe-action v-for="item in arrlist" :key="index"
|
|
style="margin-left: 32rpx; margin-right: 32rpx;margin-top: 48rpx;">
|
|
<up-swipe-action-item :options="options1" v-if="item.sysUserInfo.userId != myuserid">
|
|
<view class="contentbox, swipe-action__content__text" style="display: flex;"
|
|
@click="gotoAddr(item.sysUserInfo.userId,item.sysUserInfo.infoName)">
|
|
<view>
|
|
<view class="contentboxtop" v-if="myuserid.value == item.notificationHistorical.senderId.value && item.notificationHistorical.sattic == 0 " ></view>
|
|
<image class="contentboximage" src="../../static/images/icon/tu4-1.jpg"></image>
|
|
</view>
|
|
<view style="margin-left: 26rpx;width: 612rpx;">
|
|
<text class="contentboxtexttop">{{item.sysUserInfo.infoName}}</text>
|
|
|
|
<text
|
|
v-if="myuserid.value == item.notificationHistorical.senderId.value && item.notificationHistorical.sendTime != null "
|
|
class="contentboxtextmiddle">{{item.notificationHistorical.sendTime}}</text>
|
|
<text v-else class="contentboxtextmiddle">{{new Date().getMonth()+1 +"-"+ new Date().getDate()}}</text>
|
|
|
|
<text
|
|
v-if="myuserid.value == item.notificationHistorical.senderId.value && item.notificationHistorical.messageType == 1"
|
|
class="contentboxtextbottom">{{item.notificationHistorical.messageText}}</text>
|
|
<text
|
|
v-else-if="myuserid.value == item.notificationHistorical.senderId.value && item.notificationHistorical.messageType == 0"
|
|
class="contentboxtextbottom">[图片]</text>
|
|
|
|
</view>
|
|
</view>
|
|
</up-swipe-action-item>
|
|
</up-swipe-action>
|
|
</view>
|
|
|
|
|
|
|
|
</template>
|
|
|
|
<script setup>
|
|
import {
|
|
onMounted,
|
|
ref,
|
|
reactive,
|
|
getCurrentInstance
|
|
} from 'vue';
|
|
import {
|
|
listFriendShip,
|
|
getFriendShip,
|
|
delFriendShip,
|
|
addFriendShip,
|
|
updateFriendShip,
|
|
listFriendShipId,
|
|
} from "@/api/signln/FriendShip/FriendShip";
|
|
|
|
import {
|
|
GetListid
|
|
} from "@/api/signln/SignTa/SignTa";
|
|
|
|
import {
|
|
listLatestarticle
|
|
} from "@/api/signln/NotificationHistorical/NotificationHistorical";
|
|
const {
|
|
proxy
|
|
} = getCurrentInstance();
|
|
|
|
const arrlist = ref([
|
|
// {
|
|
// id: 1,
|
|
// name: "恋爱60秒",
|
|
// time: "12:00",
|
|
// content: "你有空把上次布置得任务交一下"
|
|
// },
|
|
// {
|
|
// id: 2,
|
|
// name: "恋爱60秒1",
|
|
// time: "12:00",
|
|
// content: "你有空把上次布置得任务交一下"
|
|
// },
|
|
// {
|
|
// id: 3,
|
|
// name: "恋爱60秒2",
|
|
// time: "12:00",
|
|
// content: "你有空把上次布置得任务交一下"
|
|
// },
|
|
])
|
|
|
|
// 使用 reactive 创建响应式对象
|
|
const options1 = reactive([{
|
|
text: '已读',
|
|
style: {
|
|
backgroundColor: '#3c9cff'
|
|
}
|
|
},
|
|
|
|
// {
|
|
// text: '',
|
|
// style: {
|
|
// backgroundColor: '#f56c6c'
|
|
// }
|
|
// }
|
|
|
|
]);
|
|
// 前面的跳转
|
|
function handerTo(url) {
|
|
uni.navigateTo({
|
|
url: url
|
|
});
|
|
}
|
|
//聊天的跳转
|
|
function gotoAddr(id,name) {
|
|
proxy.$tab.navigateTo("/pages/Friend/messagechat?id=" + id +"&name="+name)
|
|
}
|
|
|
|
const form = {
|
|
// pageNum: 1,
|
|
// pageSize: 10,
|
|
userId: null,
|
|
friendId: null,
|
|
actionUserId: null,
|
|
actionTime: null,
|
|
status: null
|
|
}
|
|
const myuserid = ref(0);
|
|
onMounted(() => {
|
|
//获取$("#")
|
|
const getuser = GetListid().then(res => {
|
|
myuserid.value = res;
|
|
console.log("党情登录用户" + myuserid.value)
|
|
})
|
|
})
|
|
//获取所有的好友
|
|
function GetList() {
|
|
listFriendShipId(form.value).then(response => {
|
|
arrlist.value = response.rows;
|
|
// console.log(arrlist.value)
|
|
});
|
|
}
|
|
GetList();
|
|
</script>
|
|
|
|
<style scoped>
|
|
.swipe-action__content__text {
|
|
padding: 0rpx !important;
|
|
margin: 0rpx !important;
|
|
height: 82rpx !important;
|
|
}
|
|
|
|
:deep(.u-index-list__letter[data-v-5e193795]) {
|
|
top: 90.5px !important;
|
|
}
|
|
|
|
.box {
|
|
height: 208rpx;
|
|
border-radius: 24rpx 24rpx 0rpx 0rpx;
|
|
background-color: #ffffff;
|
|
display: flex;
|
|
margin-left: 32rpx;
|
|
margin-right: 32rpx;
|
|
}
|
|
|
|
.boxmessge {
|
|
width: 24rpx;
|
|
height: 24rpx;
|
|
background: #fa3939;
|
|
border-radius: 24rpx;
|
|
position: relative;
|
|
left: 96rpx;
|
|
top: 24rpx;
|
|
}
|
|
|
|
.boximage {
|
|
width: 120rpx;
|
|
height: 120rpx;
|
|
}
|
|
|
|
.boxview {
|
|
margin: 0 auto;
|
|
}
|
|
|
|
.boxtext {
|
|
font-weight: 600;
|
|
/* width: 112rpx; */
|
|
height: 28rpx;
|
|
font-size: 28rpx;
|
|
text-align: left;
|
|
color: #000000;
|
|
display: block;
|
|
}
|
|
|
|
.contentbox {
|
|
/* width: 750rpx; */
|
|
height: 82rpx;
|
|
/* margin-top: -24rpx; */
|
|
display: flex;
|
|
}
|
|
|
|
.contentboximage {
|
|
width: 82rpx;
|
|
height: 82rpx;
|
|
border-radius: 82rpx;
|
|
}
|
|
|
|
.contentboxtop {
|
|
width: 24rpx;
|
|
height: 24rpx;
|
|
background: #fa3939;
|
|
border-radius: 24rpx;
|
|
position: fixed;
|
|
left: 56rpx;
|
|
/* top: 24rpx; */
|
|
z-index: 3;
|
|
}
|
|
|
|
|
|
.u-page {
|
|
padding: 0;
|
|
}
|
|
|
|
.u-demo-block__title {
|
|
padding: 10px 0 2px 15px;
|
|
}
|
|
|
|
.swipe-action {
|
|
&__content {
|
|
padding: 25rpx 0;
|
|
|
|
&__text {
|
|
font-size: 15px;
|
|
color: $u-main-color;
|
|
padding-left: 30rpx;
|
|
}
|
|
}
|
|
}
|
|
|
|
.contentboxtexttop {
|
|
font-weight: 600;
|
|
/* width: 125rpx; */
|
|
height: 30rpx;
|
|
font-size: 30rpx;
|
|
text-align: left;
|
|
color: #000000;
|
|
vertical-align: middle;
|
|
}
|
|
|
|
.contentboxtextmiddle {
|
|
font-weight: Regular;
|
|
/* width: 50rpx; */
|
|
height: 17rpx;
|
|
font-size: 20rpx;
|
|
text-align: right;
|
|
color: #999999;
|
|
vertical-align: middle;
|
|
float: right;
|
|
display: block;
|
|
/* margin-left: 381rpx; */
|
|
margin-right: 24rpx;
|
|
}
|
|
|
|
.contentboxtextbottom {
|
|
font-weight: Regular;
|
|
/* width: 364rpx; */
|
|
height: 26rpx;
|
|
font-size: 26rpx;
|
|
text-align: left;
|
|
color: #999999;
|
|
vertical-align: middle;
|
|
display: block;
|
|
line-height: 26rpx;
|
|
margin-top: 12rpx;
|
|
}
|
|
</style> |