sfms3.0
/
sfms3.0-uniapp
3
1
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

添加消息列表

wms3.0_pda
lijuncheng 11 months ago
parent
c6e4b3cdb7
commit
1313f08ea9
5 changed files with 495 additions and 2 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Unified View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 54
      api/request2.js
  2. 23
      pages.json
  3. 96
      pages/message/details.vue
  4. 318
      pages/message/index.vue
  5. 4
      static/images/message.svg

54
api/request2.js
View File

@ -96,6 +96,60 @@ export function updateUserPwd(oldPassword, newPassword) {
}) })
} }
/**
* 获取消息列表
* @param {*}
*
*/
export function getMessageList(pageNo,pageSize) {
return request({
url: baseApi + "/system/notify-message/my-page?pageNo="+pageNo+"&pageSize="+pageSize,
method: "get",
data: {},
});
}
/**
* 标记站内信为已读
* @param {*}
*
*/
export function setMessageUpdateRead(ids) {
return request({
url: baseApi + "/system/notify-message/update-read?ids="+ids,
method: "put",
data: {},
});
}
/**
* 标记所有站内信为已读
* @param {*}
*
*/
export function setAllMessageUpdateRead() {
return request({
url: baseApi + "/system/notify-message/update-all-read",
method: "put",
data: {},
});
}
/**
* 获取当前用户的未读站内信数量
* @param {*}
*
*/
export function getMessageUnreadCount() {
return request({
url: baseApi + "/system/notify-message/get-unread-count",
method: "get",
data: {},
});
}
/** /**
* 获取配置字典 * 获取配置字典
* @param {*} * @param {*}

23
pages.json
View File

@ -24,6 +24,28 @@
} }
} }
}, },
{
"path": "pages/message/details",
"style": {
"navigationBarTitleText": "消息详情",
"enablePullDownRefresh": false,
"titleNView": {
// "autoBackButton": "true",
"buttons": [
// 右边按钮
{
"float": "right",
"fontSize": "58rpx", //按钮上文字的大小
"text": "\ue696",
"fontSrc": "/static/ali_icon/iconfont.ttf"
}
]
}
}
},
{ {
"path": "pages/common/webview/index", "path": "pages/common/webview/index",
@ -1801,6 +1823,7 @@
"pagePath": "pages/message/index", "pagePath": "pages/message/index",
"iconPath": "static/bar/xx.svg", "iconPath": "static/bar/xx.svg",
"selectedIconPath": "static/bar/xxa.svg", "selectedIconPath": "static/bar/xxa.svg",
"enablePullDownRefresh": true,
"text": "消息" "text": "消息"
}, { }, {
"pagePath": "pages/setter/index", "pagePath": "pages/setter/index",

96
pages/message/details.vue
View File

@ -0,0 +1,96 @@
<template>
<view class="contant" style="background-color: #fff;">
<view class="title">{{detail.templateNickname}}</view>
<view class="article">消息类型 : {{detail.templateCode}}</view>
<view class="article">消息内容 : {{detail.templateContent}}</view>
<view class="article">读取状态 : {{detail.readStatus==true?"已读":"未读"}}</view>
<view class="righttext">创建时间 : {{formatDate(detail.createTime)}}</view>
</view>
</template>
<script>
import {
goHome
} from '@/common/basic.js';
import {
dateFormat
} from '@/common/basic.js';
export default {
onNavigationBarButtonTap(e) {
if (e.index === 0) {
goHome();
}else if(e.index === 1){
window.location.reload();
}
},
data() {
return {
detail: {}
}
},
// created() {
// this.getmessages()
// },
onLoad: function(param) {
this.detail = JSON.parse(decodeURIComponent(param.detail));
},
methods: {
formatDate(date) {
return dateFormat(date)
},
}
}
</script>
<style>
.contant {
padding: 20upx;
}
.authorbox {
display: flex;
justify-content: space-between;
color: #808080;
align-items: center;
border-bottom: 1rpx solid #eeeeee;
font-size: 30upx;
padding-bottom: 30upx;
}
.author {
display: flex;
justify-content: space-between;
color: #808080;
align-items: center;
}
.picture {
width: 80upx;
height: 80upx;
border-radius: 50upx;
margin-right: 25upx;
}
.title {
font-size: 40upx;
padding: 30upx 0 20upx 0;
}
.article {
font-size: 35upx;
color: #555555;
padding: 20upx 0 20upx 0;
}
.righttext {
text-align: right;
font-size: 35upx;
color: #555555;
padding: 30upx 0 20upx 0;
}
</style>

318
pages/message/index.vue
View File

@ -1,9 +1,325 @@
<template> <template>
消息
<view class="body-view msg_body">
<!-- 头部 -->
<scroll-view class="top-menu-view" scroll-x="true" :scroll-left="scrollLeft">
<block v-for="(menuTab,index) in menuTabs" :key="index">
<view class="menu-topic-view" v-bind:id="'tabNum'+index" @click="swichMenu(index)" clickable>
<view :class="[currentTab==index ? 'menu-topic-act' : 'menu-topic']">
<view class="menu-topic-txt">{{menuTab.name}}
<text v-if="menuTab.name == '全部'"
:class="[unreadCount>0?'tipred':'' ]">{{Math.abs(unreadCount)>99?'99+':unreadCount==0?'':unreadCount}}</text>
</view>
<view class="menu-topic-bottom">
<view class="menu-topic-bottom-color"></view>
</view>
</view>
</view>
</block>
</scroll-view>
<view class="flex flex-column" style="display: flex;flex-direction: column; width: 100%;margin-bottom: 120rpx;">
<view class="">
<!-- :badge-text="item.readStatus == false?'dot':''" -->
<uni-list class="list msg_list">
<uni-list :border="true" v-for="(item, index) in allMessageList " :key="item.id">
<uni-list-chat :title="item.templateCode" avatar="/static/images/message.svg" clickable
:note="item.templateContent" :time="formatDate(item.createTime)" badge-positon="left"
@click="jumpdetails(item)"
:class="item.readStatus == false?'':'hasread'" is=""></uni-list-chat>
<u-line color="#909399" />
</uni-list>
</uni-list>
</view>
<uni-load-more :status="loadingType" v-if="allMessageList.length>0" />
</view>
<com-message ref="comMessage"></com-message>
</view>
</template> </template>
<script> <script>
import comMessage from '@/mycomponents/common/comMessage.vue'
import {
getMessageList,
getMessageUnreadCount,
setMessageUpdateRead
} from '@/api/request2.js';
import {
dateFormat
} from '@/common/basic.js';
export default {
name: '',
components: {
comMessage
},
data() {
return {
messageList: [],
pageNo: 1,
pageSize: 10,
allMessageList: [],
loadingType: "nomore",
unreadCount: 0,
indicatorDots: true,
autoplay: true,
interval: 2000,
duration: 500,
scrollLeft: 0,
isClickChange: false,
currentTab: 0,
// Tab分类标题
menuTabs: [{
name: '全部'
},
// {
// name: '系统'
// }, {
// name: '通知'
// }, {
// name: '私信'
// },
],
};
},
onShow() {
this.getMessageList("refresh")
this.getMessageUnreadCount();
},
onPullDownRefresh() {
this.getMessageList('refresh');
this.getMessageUnreadCount();
},
onReachBottom() {
//避免多次触发
if (this.loadingType == 'loading' || this.loadingType == 'nomore') {
return;
}
this.getMessageList("more");
},
methods: {
getMessageList(type) {
uni.showLoading({
title: "加载中....",
mask: true
});
if (type == "refresh") {
this.pageNo = 1
this.pageSize = 10
this.allMessageList = []
}
getMessageList(this.pageNo, this.pageSize).then(res => {
uni.hideLoading();
if (type === "refresh") {
uni.stopPullDownRefresh();
}
var list = res.data.list;
this.loadingType = "loadmore";
if (list == null || list.length == 0) {
this.loadingType = "nomore";
return;
}
this.allMessageList = type === "refresh" ? list : this.allMessageList.concat(list);
this.pageNo++;
}).catch(error => {
uni.hideLoading();
this.showMessage(error);
})
},
showMessage(message) {
this.$refs.comMessage.showErrorMessage(message, res => {
if (res) {
}
});
},
formatDate(date) {
return dateFormat(date)
},
getMessageUnreadCount() {
getMessageUnreadCount().then(res => {
this.unreadCount = res.data
})
},
jumpdetails(detail) {
if (!detail.readStatus) {
setMessageUpdateRead(detail.id).then((res) => {
detail.readStatus = true
uni.navigateTo({
url: './details?detail=' + encodeURIComponent(JSON.stringify(detail))
});
})
} else {
uni.navigateTo({
url: './details?detail=' + encodeURIComponent(JSON.stringify(detail))
});
}
},
}
}
</script> </script>
<style> <style>
.body-view {
height: 100%;
width: 100%;
display: flex;
flex: 1;
flex-direction: column;
overflow: hidden;
align-items: flex-start;
justify-content: center;
}
.body-view .right-arrow {
position: absolute;
top: 22upx;
right: 0upx;
padding-left: 60upx;
padding-right: 20upx;
line-height: 42upx;
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 60%);
}
.body-view .right-arrow .iconfont {
font-size: 24upx;
font-family: iconfont;
color: #909399;
}
.top-menu-view {
display: flex;
white-space: nowrap;
width: 100%;
background-color: #FFFFFF;
height: 86upx;
/* border-top: 1px solid #d8dbe6;
border-bottom: 1px solid #d8dbe6; */
}
.top-menu-view .menu-topic-view {
display: inline-block;
white-space: nowrap;
height: 86upx;
position: relative;
}
.top-menu-view .menu-topic-view .menu-topic {
margin-left: 30upx;
margin-right: 10upx;
position: relative;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.uni-list--border:after {
height: 0;
}
.top-menu-view .menu-topic-view .menu-topic:first-child {
margin-left: 30upx;
}
.top-menu-view .menu-topic-view:last-child .menu-topic {
margin-right: 80upx;
}
.top-menu-view .menu-topic-view .menu-topic .menu-topic-txt {
font-size: 30upx;
color: #303133;
}
.top-menu-view .menu-topic-view .menu-topic .menu-topic-bottom {
position: absolute;
bottom: 0;
width: 100%;
}
.top-menu-view .menu-topic-view .menu-topic .menu-topic-bottom .menu-topic-bottom-color {
width: 40upx;
height: 4upx;
}
.top-menu-view .menu-topic-view .menu-topic-act {
margin-left: 30upx;
margin-right: 10upx;
position: relative;
height: 100%;
display: flex;
align-items: center;
justify-content: center;
}
.top-menu-view .menu-topic-view:last-child .menu-topic-act {
margin-right: 80upx;
}
.top-menu-view .menu-topic-view .menu-topic-act .menu-topic-txt {
font-size: 1rem;
color: #3d7eff;
font-weight: 600;
}
.top-menu-view .menu-topic-view .menu-topic-act .menu-topic-bottom {
position: absolute;
bottom: 0;
width: 100%;
display: flex;
justify-content: center;
}
.top-menu-view .menu-topic-view .menu-topic-act .menu-topic-bottom .menu-topic-bottom-color {
width: 40upx;
height: 6upx;
background: #3d7eff;
}
.swiper-box-list {
flex: 1;
width: 100%;
height: auto;
height: 900upx;
background-color: #FFFFFF;
}
.swiper-topic-list {
height: 100%;
width: 100%;
}
.list {
width: 100%;
}
.tipred {
position: absolute;
top: 0;
right: -40rpx;
background-color: red;
color: #FFFFFF;
font-size: .7rem;
display: inline-block;
width: 46rpx;
height: 46rpx;
margin-bottom: 10upx;
text-align: center;
line-height: 46rpx;
border-radius: 50%;
overflow: hidden;
margin-left: 10upx;
font-size: 20upx;
}
</style> </style>

4
static/images/message.svg
View File

@ -0,0 +1,4 @@
<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M26.7208 12.1858C26.7208 9.87284 25.802 7.65464 24.1665 6.01914C22.531 4.38365 20.3128 3.46484 17.9999 3.46484C15.6869 3.46484 13.4687 4.38365 11.8332 6.01914C10.1977 7.65464 9.27892 9.87284 9.27892 12.1858C9.27892 22.3602 4.91846 25.2672 4.91846 25.2672H31.0812C31.0812 25.2672 26.7208 22.3602 26.7208 12.1858Z" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
<path d="M20.5144 31.082C20.2589 31.5226 19.8921 31.8882 19.4508 32.1424C19.0095 32.3966 18.5092 32.5304 17.9999 32.5304C17.4906 32.5304 16.9903 32.3966 16.549 32.1424C16.1077 31.8882 15.7409 31.5226 15.4854 31.082" stroke="white" stroke-width="3" stroke-linecap="round" stroke-linejoin="round"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 803 B

Write Preview
Loading…
Cancel
Save