1
This commit is contained in:
Vinjor
parent
329fb41324
commit
2973b7c1a5
@ -19,6 +19,9 @@
|
||||
<view :style="{ color: titleColor }" class="navigationBarTitle">
|
||||
{{ title }}
|
||||
</view>
|
||||
<view v-if="showClear" @click="clearNoReadFun" class="navigationBarIcon" :style="{ color: titleColor }">
|
||||
<image src="@/static/images/clear.png" mode="" class="clear-icon"></image>
|
||||
</view>
|
||||
</template>
|
||||
<view class="navigationBarBackExtra">
|
||||
<slot name="extra">
|
||||
@ -46,6 +49,10 @@ export default {
|
||||
leftTitle: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
showClear: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
mounted() {
|
||||
@ -78,6 +85,9 @@ export default {
|
||||
methods: {
|
||||
back() {
|
||||
uni.navigateBack()
|
||||
},
|
||||
clearNoReadFun(){
|
||||
this.$emit('clearNoRead')
|
||||
}
|
||||
}
|
||||
}
|
||||
@ -109,5 +119,13 @@ export default {
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.navigationBarIcon {
|
||||
display: flex;
|
||||
}
|
||||
.clear-icon{
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@ -3,14 +3,18 @@
|
||||
<!--<VNavigationBar style="position: relative;z-index: 99;" leftTitle="true" backgroundColor="rgba(0,0,0,0)" title-color="#fff" title=" "></VNavigationBar>-->
|
||||
<view class="bodyTopBg"></view>
|
||||
<view class="body">
|
||||
<view class="userInfoBox" @click="showUserDetail">
|
||||
<image style="width: 104rpx;height: 104rpx;border-radius: 50%;" v-if="''==userInfo.avatar || null == userInfo.avatar" :src="defaultAvatar" mode="scaleToFill" @error="avatarErr"></image>
|
||||
<image style="width: 104rpx;height: 104rpx;border-radius: 50%;" v-else :src="imgUrlPrex+userInfo.avatar" mode="scaleToFill" @error="avatarErr"></image>
|
||||
<view class="userInfo">
|
||||
<view class="userInfoBox" >
|
||||
<image @click="showUserDetail" style="width: 104rpx;height: 104rpx;border-radius: 50%;" v-if="''==userInfo.avatar || null == userInfo.avatar" :src="defaultAvatar" mode="scaleToFill" @error="avatarErr"></image>
|
||||
<image @click="showUserDetail" style="width: 104rpx;height: 104rpx;border-radius: 50%;" v-else :src="imgUrlPrex+userInfo.avatar" mode="scaleToFill" @error="avatarErr"></image>
|
||||
<view class="userInfo" @click="showUserDetail">
|
||||
<text class="userName">{{ userInfo.nickname }}</text>
|
||||
<text class="userType">{{ userInfo.roleNames }}</text>
|
||||
</view>
|
||||
<image style="width: 48rpx;height: 48rpx" src="/static/icons/more.png" mode="aspectFita"></image>
|
||||
<view class="msg-box" @click="gotoMsg">
|
||||
<image mode="aspectFita" src="@/pages-home/static/msg.png" style="width: 48rpx;height: 48rpx"></image>
|
||||
<view class="msg-num" v-if="noReadNum>0">{{noReadNum}}</view>
|
||||
</view>
|
||||
<image @click="showUserDetail" style="width: 48rpx;height: 48rpx" src="/static/icons/more.png" mode="aspectFita"></image>
|
||||
</view>
|
||||
<!-- 服务顾问才能开单-->
|
||||
<view class="body-top-grid" v-if="userInfo.roleCodes.includes('service_advisor')">
|
||||
@ -54,6 +58,14 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 通知公告 -->
|
||||
<view class="notice-dom" v-if="noticeNum>0" @click="gotoNotice">
|
||||
<view class="notice-box">
|
||||
<image class="left-img" src="@/pages-home/static/notice.png" ></image>
|
||||
<view class="center-text">你有{{noticeNum}}条来自平台的通知公告</view>
|
||||
<u-icon style="width: 20rpx" color="#999" name="arrow-right" size="12"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 服务顾问角色 -->
|
||||
<view class="orderCount" v-if="userInfo.roleCodes.includes('service_advisor')" @click="serviceWork">
|
||||
<view class="orderCountItem">
|
||||
@ -163,7 +175,11 @@ export default {
|
||||
workingNum:0,
|
||||
doneNum:0
|
||||
},
|
||||
defaultAvatar: require('@/static/icons/avatar.png')
|
||||
defaultAvatar: require('@/static/icons/avatar.png'),
|
||||
//未读消息数量
|
||||
noReadNum:0,
|
||||
//通知公告数量
|
||||
noticeNum:0,
|
||||
}
|
||||
},
|
||||
onLoad(){
|
||||
@ -185,6 +201,8 @@ export default {
|
||||
}else{
|
||||
//直接取缓存中的用户信息
|
||||
this.userInfo = getUserInfo()
|
||||
this.getNoReadNum()
|
||||
this.getNoticeList()
|
||||
this.onRefresherrefresh()
|
||||
if(this.userInfo.roleCodes.includes('repair_staff')){
|
||||
//维修工
|
||||
@ -199,6 +217,12 @@ export default {
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
gotoMsg(){
|
||||
//去消息中心
|
||||
uni.navigateTo({
|
||||
url: '/pages-home/msg/message'
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 上滑加载数据
|
||||
*/
|
||||
@ -392,7 +416,49 @@ export default {
|
||||
uni.navigateTo({
|
||||
url: '/pages-home/service/applyList'
|
||||
})
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 获取未读消息数量
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async getNoReadNum(){
|
||||
await request({
|
||||
url: "/admin-api/system/notify-message/get-unread-count",
|
||||
method: "GET"
|
||||
}).then((res) => {
|
||||
if(res.code==200){
|
||||
this.noReadNum = res.data>99?99:res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 跳转通知公告列表页
|
||||
*/
|
||||
gotoNotice(){
|
||||
uni.navigateTo({
|
||||
url: '/pages-home/notice/notice'
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 查通知公告--查数量
|
||||
*/
|
||||
async getNoticeList(){
|
||||
const res = await request({
|
||||
url: "/admin-api/base/notice/page",
|
||||
method: "get",
|
||||
params: {
|
||||
pageNo:1,
|
||||
pageSize:1,
|
||||
type:1,
|
||||
parentServer: "weixiu",
|
||||
server: "app"
|
||||
},
|
||||
tenantIdFlag:false
|
||||
})
|
||||
if(res.code==200){
|
||||
this.noticeNum = res.data.total
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -459,6 +525,25 @@ export default {
|
||||
padding: 8rpx 16rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.msg-box{
|
||||
position: relative;
|
||||
margin-right: 40rpx;
|
||||
.msg-num{
|
||||
position: absolute;
|
||||
right: -15rpx;
|
||||
color: white;
|
||||
background: #d74a43;
|
||||
width: 35rpx;
|
||||
height: 35rpx;
|
||||
line-height: 35rpx;
|
||||
text-align: center;
|
||||
font-weight: 800;
|
||||
font-size: 11px;
|
||||
border-radius: 50%;
|
||||
top: -15rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.body-top-grid {
|
||||
display: grid;
|
||||
@ -556,7 +641,30 @@ export default {
|
||||
}
|
||||
}
|
||||
}
|
||||
.notice-dom {
|
||||
margin: 40rpx 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.notice-box{
|
||||
display: flex;
|
||||
width: 100%;
|
||||
.left-img{
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
}
|
||||
.center-text{
|
||||
width: calc(100% - 70rpx);
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
padding:0 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.orderCount {
|
||||
margin: 40rpx 32rpx;
|
||||
background: #FFFFFF;
|
||||
|
||||
253
pages-home/msg/message.vue
Normal file
253
pages-home/msg/message.vue
Normal file
@ -0,0 +1,253 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<VNavigationBar style="position: relative;z-index: 99;" backgroundColor="#fff" title-color="#000" title="消息中心" :showClear="showClear" @clearNoRead="clearNoReadFun"></VNavigationBar>
|
||||
<!-- <VNavigationBar background-color="#fff" title-color="#333" title="消息中心" :showClear="showClear" @clearNoRead="clearNoReadFun"></VNavigationBar>-->
|
||||
<view class="body">
|
||||
<view class="messageList">
|
||||
<scroll-view style="height: 100%;" scroll-y="true" class="itemContent" @scrolltolower="onReachBottomCus"
|
||||
refresher-enabled @refresherrefresh="onRefresherrefresh" :refresher-triggered="isTriggered">
|
||||
<view v-for="(item, index) in messageList" :key="index" class="messageItem" @click="readNotice(item)">
|
||||
<image class="messageIcon" src="../../static/icons/message-icon1.png" mode="aspectFit"></image>
|
||||
<view class="messageContent">
|
||||
<view :class="{'messageTitle':item.readStatus,'noReadTitle':!item.readStatus}" >系统通知</view>
|
||||
<view class="messageContent_content">{{item.templateContent}}</view>
|
||||
<view class="messageContent_content" style="text-align: right">{{formatTime(item.createTime)}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="text-align: center" v-if="messageList.length==0">
|
||||
<image class="" src="@/static/images/nothing.png"></image>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 提示窗示例 -->
|
||||
<uni-popup ref="alertDialog" type="dialog">
|
||||
<uni-popup-dialog :type="msgType" cancelText="关闭" confirmText="我知道了" title="系统通知" :content="nowReadItem.templateContent" @confirm="dialogToggle"
|
||||
@close="dialogToggle"></uni-popup-dialog>
|
||||
</uni-popup>
|
||||
<!-- <!– 普通弹窗 –>-->
|
||||
<!-- <uni-popup ref="popup" background-color="#fff" >-->
|
||||
<!-- <view class="popup-content" :class="{ 'popup-height': type === 'left' || type === 'right' }">-->
|
||||
<!-- <text class="text popup-content-text">{{ nowReadItem.templateContent }}</text>-->
|
||||
<!-- <button class="button popup-info" @click="dialogToggle"><text-->
|
||||
<!-- class="button-text info-text">知道了</text></button>-->
|
||||
<!-- </view>-->
|
||||
<!-- </uni-popup>-->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import VNavigationBar from '@/components/VNavigationBar.vue'
|
||||
import request from "@/utils/request";
|
||||
import {formatTimestamp} from "@/utils/utils";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
VNavigationBar,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
msgType: 'success',
|
||||
messageList: [],
|
||||
pageNo: 1,
|
||||
pageSize: 15,
|
||||
total: 0,
|
||||
//下来刷新状态
|
||||
isTriggered:false,
|
||||
//是否显示一键清空
|
||||
showClear:true,
|
||||
nowReadItem:{},
|
||||
};
|
||||
},
|
||||
onLoad(){
|
||||
|
||||
},
|
||||
onShow(){
|
||||
this.getList()
|
||||
},
|
||||
methods:{
|
||||
/**
|
||||
* 点击阅读消息
|
||||
*/
|
||||
async readNotice(item) {
|
||||
this.nowReadItem = item
|
||||
// open 方法传入参数 等同在 uni-popup 组件上绑定 type属性
|
||||
this.$refs.alertDialog.open()
|
||||
//直接请求后台已读
|
||||
await request({
|
||||
url: "/admin-api/system/notify-message/update-read",
|
||||
method: "PUT",
|
||||
params:{ids:this.nowReadItem.id},
|
||||
tenantIdFlag:false
|
||||
}).then((res) => {
|
||||
if(res.code==200){
|
||||
this.onRefresherrefresh()
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 消息设置为已读
|
||||
*/
|
||||
dialogToggle(){
|
||||
|
||||
},
|
||||
/**
|
||||
* 一键清空未读消息
|
||||
*/
|
||||
async clearNoReadFun(){
|
||||
console.log("清空了")
|
||||
await request({
|
||||
url: "/admin-api/system/notify-message/update-all-read",
|
||||
method: "PUT",
|
||||
tenantIdFlag:false
|
||||
}).then((res) => {
|
||||
if(res.code==200){
|
||||
uni.showToast({
|
||||
title: '操作成功',
|
||||
icon: 'none'
|
||||
})
|
||||
setTimeout(()=>{
|
||||
this.onRefresherrefresh()
|
||||
},500)
|
||||
}
|
||||
})
|
||||
},
|
||||
formatTime(value){
|
||||
return formatTimestamp(value)
|
||||
},
|
||||
/**
|
||||
* 上滑加载数据
|
||||
*/
|
||||
onReachBottomCus() {
|
||||
//判断 如果页码*页容量大于等于总条数，提示该页数据加载完毕
|
||||
if (this.pageNo * this.pageSize >= this.total) {
|
||||
uni.$u.toast('没有更多数据了')
|
||||
return
|
||||
}
|
||||
//页码+1,调用获取数据的方法获取第二页数据
|
||||
this.pageNo++
|
||||
//此处调用自己获取数据列表的方法
|
||||
this.getList()
|
||||
},
|
||||
/**
|
||||
* 下拉刷新数据
|
||||
*/
|
||||
onRefresherrefresh(){
|
||||
this.isTriggered = true
|
||||
this.pageNo = 1
|
||||
this.total = 0
|
||||
this.messageList = []
|
||||
this.getList()
|
||||
},
|
||||
/**
|
||||
* 分页查询
|
||||
*/
|
||||
async getList(){
|
||||
await request({
|
||||
url: "/admin-api/system/notify-message/my-page",
|
||||
method: "GET",
|
||||
params:{
|
||||
pageNo:this.pageNo,
|
||||
pageSize:this.pageSize
|
||||
}
|
||||
}).then((res) => {
|
||||
//判断 如果获取的数据的页码不是第一页，就让之前赋值获取过的数组数据 concat连接 刚获取的第n页数据
|
||||
if (this.pageNo != 1) {
|
||||
this.messageList = this.messageList.concat(res.data.list)
|
||||
} else {
|
||||
this.messageList = res.data.list
|
||||
}
|
||||
//将获取的总条数赋值
|
||||
this.total = res.data.total
|
||||
this.isTriggered = false
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.container {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.body {
|
||||
flex: 1;
|
||||
height: calc(100vh - env(safe-area-inset-top));
|
||||
overflow: auto;
|
||||
}
|
||||
.messageList {
|
||||
padding: 0 32rpx;
|
||||
height: 100%;
|
||||
}
|
||||
.messageItem {
|
||||
padding: 30rpx 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 20rpx;
|
||||
border-bottom: 1rpx solid #EEEEEE;
|
||||
|
||||
.messageIcon {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
.noReadTitle {
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
}
|
||||
.noReadTitle:after{
|
||||
content: "*";
|
||||
color: red;
|
||||
display: block; /* 或者其他的块级显示类型，比如 inline-block, table 等 */
|
||||
position: absolute; /* 或者 absolute 或者 fixed，取决于你的布局需求 */
|
||||
z-index: 1; /* 确保它在元素的上方 */
|
||||
right: 0;
|
||||
}
|
||||
|
||||
.messageContent {
|
||||
flex: 1;
|
||||
width: 0;
|
||||
}
|
||||
.messageTitle {
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
}
|
||||
.messageContent_content {
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #858BA0;
|
||||
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
.popup-content {
|
||||
padding: 15px;
|
||||
height: auto;
|
||||
margin: auto;
|
||||
width: 80%;
|
||||
background-color: #fff;
|
||||
}
|
||||
.popup-content-text {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.popup-info {
|
||||
margin-top: 30rpx;
|
||||
color: #fff;
|
||||
background-color: #f2f6fc;
|
||||
}
|
||||
|
||||
.info-text {
|
||||
color: #909399;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
194
pages-home/notice/notice.vue
Normal file
194
pages-home/notice/notice.vue
Normal file
@ -0,0 +1,194 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<VNavigationBar style="position: relative;z-index: 99;" backgroundColor="#fff" title-color="#000" title="通知公告"></VNavigationBar>
|
||||
<view class="body">
|
||||
<view class="messageList">
|
||||
<scroll-view style="height: 100%;" scroll-y="true" class="itemContent" @scrolltolower="onReachBottomCus"
|
||||
refresher-enabled @refresherrefresh="onRefresherrefresh" :refresher-triggered="isTriggered">
|
||||
<view v-for="(item, index) in messageList" :key="index" class="messageItem" @click="readNotice(item)">
|
||||
<image class="messageIcon" src="../../static/icons/message-icon1.png" mode="aspectFit"></image>
|
||||
<view class="messageContent">
|
||||
<view class="messageTitle" >{{item.title}}</view>
|
||||
<!-- <view class="messageContent_content">{{item.templateContent}}</view>-->
|
||||
<view class="messageContent_content" style="text-align: right">{{formatTime(item.createTime)}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view style="text-align: center" v-if="messageList.length==0">
|
||||
<image class="" src="@/static/images/nothing.png"></image>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import VNavigationBar from '@/components/VNavigationBar.vue'
|
||||
import request from "@/utils/request";
|
||||
import {formatTimestamp} from "@/utils/utils";
|
||||
import {setJSONData} from "@/utils/auth";
|
||||
|
||||
export default {
|
||||
components: {
|
||||
VNavigationBar,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
type:"center",
|
||||
messageList: [],
|
||||
pageNo: 1,
|
||||
pageSize: 15,
|
||||
total: 0,
|
||||
//下来刷新状态
|
||||
isTriggered:false,
|
||||
};
|
||||
},
|
||||
onLoad(){
|
||||
|
||||
},
|
||||
onShow(){
|
||||
this.getList()
|
||||
},
|
||||
methods:{
|
||||
/**
|
||||
* 看通知公告详情
|
||||
*/
|
||||
readNotice(item){
|
||||
setJSONData("notice",item)
|
||||
uni.navigateTo({
|
||||
url: "/pages-home/notice/noticeContent",
|
||||
})
|
||||
},
|
||||
formatTime(value){
|
||||
return formatTimestamp(value)
|
||||
},
|
||||
/**
|
||||
* 上滑加载数据
|
||||
*/
|
||||
onReachBottomCus() {
|
||||
//判断 如果页码*页容量大于等于总条数，提示该页数据加载完毕
|
||||
if (this.pageNo * this.pageSize >= this.total) {
|
||||
uni.$u.toast('没有更多数据了')
|
||||
return
|
||||
}
|
||||
//页码+1,调用获取数据的方法获取第二页数据
|
||||
this.pageNo++
|
||||
//此处调用自己获取数据列表的方法
|
||||
this.getList()
|
||||
},
|
||||
/**
|
||||
* 下拉刷新数据
|
||||
*/
|
||||
onRefresherrefresh(){
|
||||
this.isTriggered = true
|
||||
this.pageNo = 1
|
||||
this.total = 0
|
||||
this.messageList = []
|
||||
this.getList()
|
||||
},
|
||||
/**
|
||||
* 分页查询
|
||||
*/
|
||||
async getList(){
|
||||
await request({
|
||||
url: "/admin-api/base/notice/page",
|
||||
method: "GET",
|
||||
params:{
|
||||
pageNo:this.pageNo,
|
||||
pageSize:this.pageSize,
|
||||
type:1,
|
||||
parentServer: "weixiu",
|
||||
server: "app"
|
||||
}
|
||||
}).then((res) => {
|
||||
//判断 如果获取的数据的页码不是第一页，就让之前赋值获取过的数组数据 concat连接 刚获取的第n页数据
|
||||
if (this.pageNo != 1) {
|
||||
this.messageList = this.messageList.concat(res.data.records)
|
||||
} else {
|
||||
this.messageList = res.data.records
|
||||
}
|
||||
//将获取的总条数赋值
|
||||
this.total = res.data.total
|
||||
this.isTriggered = false
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.container {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.body {
|
||||
flex: 1;
|
||||
height: calc(100vh - env(safe-area-inset-top));
|
||||
overflow: auto;
|
||||
}
|
||||
.messageList {
|
||||
padding: 0 32rpx;
|
||||
height: 100%;
|
||||
}
|
||||
.messageItem {
|
||||
padding: 30rpx 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
column-gap: 20rpx;
|
||||
border-bottom: 1rpx solid #EEEEEE;
|
||||
|
||||
.messageIcon {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
|
||||
.messageContent {
|
||||
flex: 1;
|
||||
width: 0;
|
||||
}
|
||||
.messageTitle {
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
.messageContent_content {
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #858BA0;
|
||||
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
.popup-content {
|
||||
padding: 15px;
|
||||
height: auto;
|
||||
margin: auto;
|
||||
width: 80%;
|
||||
background-color: #fff;
|
||||
}
|
||||
.popup-content-text {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.text {
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.popup-info {
|
||||
margin-top: 30rpx;
|
||||
color: #fff;
|
||||
background-color: #f2f6fc;
|
||||
}
|
||||
|
||||
.info-text {
|
||||
color: #909399;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
82
pages-home/notice/noticeContent.vue
Normal file
82
pages-home/notice/noticeContent.vue
Normal file
@ -0,0 +1,82 @@
|
||||
<template>
|
||||
<view class="container">
|
||||
<VNavigationBar style="position: relative;z-index: 99;" backgroundColor="#fff" title-color="#000" title="通知公告详情"></VNavigationBar>
|
||||
<div class="body">
|
||||
<rich-text style="width: 100%" :nodes="richTextHtml | formatRichText" />
|
||||
</div>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import request from "../../utils/request";
|
||||
import config from '@/config'
|
||||
import parser from 'rich-text-parser'
|
||||
import VNavigationBar from "../../components/VNavigationBar.vue";
|
||||
import {getJSONData} from "@/utils/auth";
|
||||
|
||||
export default {
|
||||
name: "content",
|
||||
components: {VNavigationBar},
|
||||
filters: {
|
||||
formatRichText(html) { // 控制小程序中图片大小
|
||||
// console.log(html)
|
||||
const nodes = parser.getRichTextJson(html)
|
||||
return nodes.children
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
richTextHtml: '',
|
||||
toUrl:null,
|
||||
};
|
||||
},
|
||||
onLoad(data) {
|
||||
let notice = getJSONData("notice")
|
||||
this.richTextHtml = notice.content
|
||||
},
|
||||
methods:{
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
img{
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
.container {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.body{
|
||||
padding: 15rpx;
|
||||
flex: 1;
|
||||
height: 0;
|
||||
overflow: auto;
|
||||
}
|
||||
}
|
||||
.fixed-button {
|
||||
position: fixed;
|
||||
bottom: 3rem; /* 距离底部的距离 */
|
||||
right: 2rem; /* 距离右边的距离 */
|
||||
z-index: 1000; /* 确保按钮在其他元素之上 */
|
||||
width: 80px; /* 按钮直径 */
|
||||
height: 80px; /* 按钮直径 */
|
||||
background-color: #f00; /* 按钮背景颜色 */
|
||||
color: #fff; /* 文字颜色 */
|
||||
border-radius: 50%; /* 圆形 */
|
||||
display: flex; /* 使用弹性盒子布局 */
|
||||
justify-content: center; /* 水平居中文本 */
|
||||
align-items: center; /* 垂直居中文本 */
|
||||
font-size: 18px; /* 字体大小 */
|
||||
text-align: center; /* 文字水平居中 */
|
||||
line-height: normal; /* 使用默认行高 */
|
||||
font-family: 'Arial', sans-serif; /* 选择字体 */
|
||||
}
|
||||
|
||||
/* 为了确保文本垂直居中并且分行 */
|
||||
.fixed-button br {
|
||||
content: '';
|
||||
display: block;
|
||||
}
|
||||
</style>
|
||||
BIN
pages-home/static/msg.png
Normal file
BIN
pages-home/static/msg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 512 B |
BIN
pages-home/static/notice.png
Normal file
BIN
pages-home/static/notice.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 681 B |
@ -3,18 +3,31 @@
|
||||
<!--<VNavigationBar style="position: relative;z-index: 99;" leftTitle="true" backgroundColor="rgba(0,0,0,0)" title-color="#fff" title=" "></VNavigationBar>-->
|
||||
<view class="bodyTopBg"></view>
|
||||
<view class="body">
|
||||
<view class="userInfoBox" @click="showUserDetail">
|
||||
<image v-if="''==userInfo.avatar || null == userInfo.avatar"
|
||||
<view class="userInfoBox">
|
||||
<image @click="showUserDetail" v-if="''==userInfo.avatar || null == userInfo.avatar"
|
||||
:src="defaultAvatar" mode="scaleToFill" style="width: 104rpx;height: 104rpx;border-radius: 50%;"
|
||||
@error="avatarErr"></image>
|
||||
<image v-else :src="imgUrlPrex+userInfo.avatar" mode="scaleToFill"
|
||||
<image @click="showUserDetail" v-else :src="imgUrlPrex+userInfo.avatar" mode="scaleToFill"
|
||||
style="width: 104rpx;height: 104rpx;border-radius: 50%;" @error="avatarErr"></image>
|
||||
<view class="userInfo">
|
||||
<view @click="showUserDetail" class="userInfo">
|
||||
<text class="userName">{{ userInfo.nickname }}</text>
|
||||
<text class="userType">{{ userInfo.roleNames }}</text>
|
||||
</view>
|
||||
<image mode="aspectFita" src="/static/icons/more.png" style="width: 48rpx;height: 48rpx"></image>
|
||||
<view class="msg-box" @click="gotoMsg">
|
||||
<image mode="aspectFita" src="@/pages-home/static/msg.png" style="width: 48rpx;height: 48rpx"></image>
|
||||
<view class="msg-num" v-if="noReadNum>0">{{noReadNum}}</view>
|
||||
</view>
|
||||
<image @click="showUserDetail" mode="aspectFita" src="/static/icons/more.png" style="width: 48rpx;height: 48rpx"></image>
|
||||
</view>
|
||||
<!-- 通知公告 -->
|
||||
<view class="notice-dom" v-if="noticeNum>0" @click="gotoNotice">
|
||||
<view class="notice-box">
|
||||
<image class="left-img" src="@/pages-home/static/notice.png" ></image>
|
||||
<view class="center-text">你有{{ noticeNum }}条来自平台的通知公告</view>
|
||||
<u-icon style="width: 20rpx" color="#999" name="arrow-right" size="12"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="body-top">
|
||||
<view class="body-top-search">
|
||||
<input class="body-top-search-input" v-model="queryParams.query" placeholder="工单号、车牌号、联系电话" placeholder-style="font-size: 28rpx"
|
||||
@ -128,7 +141,11 @@ export default {
|
||||
shopList: [],
|
||||
bannerList: [],
|
||||
richTextHtml: null,
|
||||
defaultAvatar: require('@/static/icons/avatar.png')
|
||||
defaultAvatar: require('@/static/icons/avatar.png'),
|
||||
//未读消息数量
|
||||
noReadNum:0,
|
||||
//通知公告数量
|
||||
noticeNum:0,
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
@ -155,10 +172,17 @@ export default {
|
||||
roleNames: '角色'
|
||||
}
|
||||
this.onRefresherrefresh()
|
||||
this.getNoReadNum()
|
||||
this.getNoticeList()
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
gotoMsg(){
|
||||
//去消息中心
|
||||
uni.navigateTo({
|
||||
url: '/pages-home/msg/message'
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 领配件、退配件Tab页
|
||||
*/
|
||||
@ -260,7 +284,49 @@ export default {
|
||||
uni.navigateTo({
|
||||
url: '/pages/my/myInfo'
|
||||
})
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 获取未读消息数量
|
||||
* @returns {Promise<void>}
|
||||
*/
|
||||
async getNoReadNum(){
|
||||
await request({
|
||||
url: "/admin-api/system/notify-message/get-unread-count",
|
||||
method: "GET"
|
||||
}).then((res) => {
|
||||
if(res.code==200){
|
||||
this.noReadNum = res.data>99?99:res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 跳转通知公告列表页
|
||||
*/
|
||||
gotoNotice(){
|
||||
uni.navigateTo({
|
||||
url: '/pages-home/notice/notice'
|
||||
})
|
||||
},
|
||||
/**
|
||||
* 查通知公告--查数量
|
||||
*/
|
||||
async getNoticeList(){
|
||||
const res = await request({
|
||||
url: "/admin-api/base/notice/page",
|
||||
method: "get",
|
||||
params: {
|
||||
pageNo:1,
|
||||
pageSize:1,
|
||||
type:1,
|
||||
parentServer: "weixiu",
|
||||
server: "app"
|
||||
},
|
||||
tenantIdFlag:false
|
||||
})
|
||||
if(res.code==200){
|
||||
this.noticeNum = res.data.total
|
||||
}
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -302,6 +368,31 @@ export default {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.notice-dom {
|
||||
margin: 40rpx 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
padding: 20rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.notice-box{
|
||||
display: flex;
|
||||
|
||||
.left-img{
|
||||
width: 48rpx;
|
||||
height: 48rpx;
|
||||
}
|
||||
.center-text{
|
||||
width: calc(100% - 130rpx);
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
padding:0 20rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.userInfoBox {
|
||||
margin: 0 32rpx 40rpx;
|
||||
|
||||
@ -330,6 +421,25 @@ export default {
|
||||
padding: 8rpx 16rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.msg-box{
|
||||
position: relative;
|
||||
margin-right: 40rpx;
|
||||
.msg-num{
|
||||
position: absolute;
|
||||
right: -15rpx;
|
||||
color: white;
|
||||
background: #d74a43;
|
||||
width: 35rpx;
|
||||
height: 35rpx;
|
||||
line-height: 35rpx;
|
||||
text-align: center;
|
||||
font-weight: 800;
|
||||
font-size: 11px;
|
||||
border-radius: 50%;
|
||||
top: -15rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.body-top {
|
||||
|
||||
18
pages.json
18
pages.json
@ -129,6 +129,24 @@
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "msg/message",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "notice/notice",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "notice/noticeContent",
|
||||
"style": {
|
||||
"navigationBarTitleText": ""
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "service/todoDetail",
|
||||
"style": {
|
||||
|
||||
BIN
static/images/clear.png
Normal file
BIN
static/images/clear.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.1 KiB |
Loading…
Reference in New Issue
Block a user