perf(TabBar):数字角标刷新方式优化

pages/contacts/index.vue

@@ -1,26 +1,6 @@
 <template>
 	<view class="contact_container">
 		<uv-index-list :index-list="indexList">
-			<!-- <template v-slot:header>
-				<view class="top">
-					<uni-list>
-						<uni-list-item :clickable="true" @click="clickTop" :to="'./group/index'">
-							<template v-slot:body>
-								<view class="top_slot_container">
-									<uni-row>
-										<uni-col :xs="5" :sm="4">
-											<uni-icons color="#ffffff" type="staff" size="50"></uni-icons>
-										</uni-col>
-										<uni-col :xs="17" :sm="18">
-											<view class="top_text">部门</view>
-										</uni-col>
-									</uni-row>
-								</view>
-							</template>
-</uni-list-item>
-</uni-list>
-</view>
-</template> -->
 			<template v-for="(items, index) in itemArr" :key="index">
 				<uv-index-item>
 					<uv-index-anchor :text="indexList[index]" size="16"></uv-index-anchor>
@@ -46,13 +26,11 @@ import { onMounted, ref } from 'vue'
 import $tab from '@/plugins/tab.js'
 import { getContactAllUser } from '@/api/contacts.js'
 import { useUserStore } from '@/store/user.js'
-import { getUnProcessNum } from '@/api/process';
-import { getUnReadMessageNum } from '@/api/message';
+import { onShow } from '@dcloudio/uni-app'
 import config from '@/config';
 const userStore = useUserStore()
 
 onMounted(() => {
-	showTarBarBadge()
 	// 获取 通讯录 索引列表
 	let unitId = userStore.user.unitId
 	if ( unitId === 0 ) unitId = userStore.user.groupid
@@ -61,26 +39,11 @@ onMounted(() => {
 		getContactList(res.returnParams)
 	})
 })
-function showTarBarBadge(){
-		let unReadMsgNum=0;
-		let unProcessNum=0;
-		getUnProcessNum(userStore.user.useId,"").then(res=>{
-			unProcessNum=parseInt(res.returnParams.total, 10);
-			getUnReadMessageNum(userStore.user.useId).then(res=>{
-				unReadMsgNum=parseInt(res.returnParams, 10)+unProcessNum;
-				if(unReadMsgNum==0){
-					uni.removeTabBarBadge({
-						index:0
-					})
-				}else{
-					uni.setTabBarBadge({
-					  index: 0,
-					  text: unReadMsgNum>99?'99+':String(unReadMsgNum)
-					})
-				}
-			})
-		})		
-	}
+
+onShow(()=>{
+	uni.$emit('showTabBarBadge')
+})
+
 // 索引列表
 const indexList = ref([])
 const itemArr = ref([])

pages/message/index.vue

@@ -28,7 +28,7 @@
 			title="公告"></message-list>
 
 		<!-- 消息列表 -->
-		<message-list ref="msgListRef" @readMsg="setAllMsgRead" :unReadNum="unReadNum" 
+		<message-list ref="msgListRef" @readMsg="setAllMsgRead" :unReadNum="unReadMsgNum" 
 			@clickSegment="getMessageData" @clickItem="handleToMessageDetail" @scrollToBottom="getMessagePage"
 			:defaultCurrent="1" :pSize="5" :pageNo="1" :anime="true" :open="true"
 			:segments="{ '全部': '', '未读': '0', '已读': '1' }" title="消息"></message-list>
@@ -49,7 +49,7 @@
 
 <script setup lang="ts">
 import { onBeforeMount, onMounted, onUpdated, ref } from 'vue';
-import { onLoad } from '@dcloudio/uni-app'
+import { onLoad,onShow } from '@dcloudio/uni-app'
 import { getMessageList, getNoticeList, getUnReadMessageNum, setMsgIsRead } from '@/api/message.js';
 import { getUserProcess, getUnProcessNum } from '@/api/process';
 import $tab from '@/plugins/tab.js';
@@ -58,27 +58,29 @@ import processList from '@/components/ygoa/processList.vue'
 import messageList from '@/components/ygoa/messageList.vue'
 import { useUserStore } from '@/store/user.js'
 import { getLoginInfo } from '@/utils/auth';
+
 const userStore = useUserStore()
 
 const processListRef = ref(null)
 onMounted(() => {
 	uni.$on('ReloadProcessData', (res) => {
-		console.log('res: ', res);
 		processListRef.value.onClickItem()
 	})
+	uni.$on('showTabBarBadge', showTabBarBadge)
 })
 onLoad((options) => {
 	// 是否跳转打卡页
 	if (options.to == 'clockIn') toClockIn()
 })
+onShow(()=>{
+	showTabBarBadge();
+})
 onBeforeMount(() => {
 	uni.removeTabBarBadge({
 		index: 0
 	})
 })
-onUpdated(() => {
-	showTarBarBadge();
-})
+
 // 跳转打卡页
 function toClockIn() {
 	// 确认是否跳转打卡页
@@ -89,53 +91,6 @@ function toClockIn() {
 
 //子组件
 const msgListRef = ref(null)
-//设置消息已读
-function setMsgRead() {
-	$modal.confirm('是否一键已读').then(res => {
-		if (res) {
-			const params = {
-				currentUser: userStore.user.useId,
-				isRead: "0",
-				pSize: unReadNum.value,
-				type: "",
-				p: 1,
-			}
-			getMessageList(params).then(({ returnParams }) => {
-				const unReadMsgIds = returnParams.ids === "" ? "" : returnParams.ids + ",";
-				setMsgIsRead(unReadMsgIds).then((res) => {
-					if (Number.isInteger(res)) {
-						switch (res) {
-							case -1:
-								$modal.msgError('操作失败')
-								break
-							case -2:
-							case 0:
-								$modal.msg('不存在未读消息')
-								break
-							default:
-								$modal.msgSuccess('操作成功')
-								//刷新页面
-								msgListRef.value.reload();// 调用子组件刷新数据
-							// showTarBarBadge();
-						}
-					} else {
-						// $modal.msgError('jssesionid失效')
-						$modal.confirm('jssesionid失效，您可以继续留在该页面，或者重新登录?').then(res=>{
-							const loginInfo=getLoginInfo();
-							userStore.LogOut().then(res=>{
-								uni.setStorageSync('loginInfo',loginInfo)
-								$tab.reLaunch('/pages/login')
-							})
-						})
-						
-					}
-				})
-			})
-		}
-	})
-
-
-}
 
 // 获取待办消息列表数据
 function getProcessData({ pSize, pageNo }, callback) {
@@ -275,10 +230,10 @@ function toClockInBtn() {
 //待办流程数
 const unProcessNum = ref(0)
 //未读消息数
-const unReadNum = ref(0)
-//待阅消息数+待办流程数(用于tarbar导航栏)
 const unReadMsgNum = ref(0)
-function showTarBarBadge() {
+//待阅消息数+待办流程数(用于tarbar导航栏)
+const unReadNum = ref(0)
+function showTabBarBadge() {
 	getUnProcessNum(userStore.user.useId, "").then(res => {
 		if ("failed" == res.returnMsg) {
 			$modal.showToast('待办流程数获取失败')
@@ -287,16 +242,16 @@ function showTarBarBadge() {
 			unProcessNum.value = parseInt(res.returnParams.total, 10);
 		}
 		getUnReadMessageNum(userStore.user.useId).then(res => {
-			unReadNum.value = parseInt(res.returnParams, 10);
-			unReadMsgNum.value = unReadNum.value + unProcessNum.value;
-			if (unReadMsgNum.value == 0) {
+			unReadMsgNum.value = parseInt(res.returnParams, 10);
+			unReadNum.value = unReadMsgNum.value + unProcessNum.value;
+			if (unReadNum.value == 0) {
 				uni.removeTabBarBadge({
 					index: 0
 				})
 			} else {
 				uni.setTabBarBadge({
 					index: 0,
-					text: unReadMsgNum.value > 99 ? '99+' : String(unReadMsgNum.value)
+					text: unReadNum.value > 99 ? '99+' : String(unReadNum.value)
 				})
 			}
 		})
@@ -309,7 +264,7 @@ function setAllMsgRead() {
 			const params = {
 				currentUser: userStore.user.useId,
 				isRead: "0",
-				pSize: unReadNum.value,
+				pSize: unReadMsgNum.value,
 				type: "",
 				p: 1,
 			}
@@ -324,12 +279,14 @@ function setAllMsgRead() {
 							case -2:
 							case 0:
 								$modal.msg('不存在未读消息')
+								msgListRef.value.reload();// 调用子组件刷新数据
+								showTabBarBadge()
 								break
 							default:
 								$modal.msgSuccess('操作成功')
 								//刷新页面
 								msgListRef.value.reload();// 调用子组件刷新数据
-							// showTarBarBadge();
+								showTabBarBadge()
 						}
 					} else {
 						$modal.confirm('登录状态失效，您可以继续留在该页面，或者重新登录?').then(res => {

pages/mine/index.vue

@@ -70,56 +70,17 @@
 </template>
 
 <script setup lang="ts">
-	import {
-		ref,
-		reactive,
-		onMounted
-	} from 'vue';
-
+	import {ref} from 'vue';
 	import $tab from "@/plugins/tab.js"
-	import { getUnReadMessageNum } from '@/api/message';
-	import { getUnProcessNum } from '@/api/process';
 	import {useUserStore} from '@/store/user.js'
 	import config from '@/config';
+	import { onShow } from '@dcloudio/uni-app'
 	const userStore = useUserStore()
-	const headImg=ref()
-	onMounted(() => {
-		//TODO
-		showTarBarBadge();
+
+	onShow(()=>{
+		uni.$emit('showTabBarBadge')
 	})
 	
-	function showTarBarBadge(){
-		let unReadMsgNum=0;
-		let unProcessNum=0;
-		getUnProcessNum(userStore.user.useId,"").then(res=>{
-			unProcessNum=parseInt(res.returnParams.total, 10);
-			// console.log('unProcessNum',res.returnParams.total);
-			// if(unProcessNum==0){
-			// 	uni.removeTabBarBadge({
-			// 		index:1
-			// 	})
-			// }else{
-			// 	uni.setTabBarBadge({
-			// 	  index: 1,
-			// 	  text: String(unProcessNum)
-			// 	})
-			// }
-			getUnReadMessageNum(userStore.user.useId).then(res=>{
-				unReadMsgNum=parseInt(res.returnParams, 10)+unProcessNum;
-				if(unReadMsgNum==0){
-					uni.removeTabBarBadge({
-						index:0
-					})
-				}else{
-					uni.setTabBarBadge({
-					  index: 0,
-					  text: unReadMsgNum>99?'99+':String(unReadMsgNum)
-					})
-				}
-			})
-		})
-		
-	}
 	// 部门数组
 	const array = ref(['研发部', '业务部', '法务部']);
 	const index = ref(0);

pages/process/index.vue

@@ -48,9 +48,9 @@ import processList from '@/components/ygoa/processList.vue'
 import { onShow } from '@dcloudio/uni-app'
 import { reactive, ref,onMounted, onUpdated } from 'vue';
 import $tab from '@/plugins/tab.js'
-import { getUserProcess, getUserProcessed, getUserProcessing, getUserAllProcess, getUnProcessNum } from '@/api/process';
+import { getUserProcess, getUserProcessed, getUserProcessing, getUserAllProcess } from '@/api/process';
 import { useUserStore } from '@/store/user';
-import { getUnReadMessageNum } from '@/api/message';
+
 
 onMounted(() => {
 	uni.$on('ReloadProcessData', (res) => {
@@ -58,30 +58,9 @@ onMounted(() => {
 		processListRef.value.onClickItem()
 	})
 })
-onUpdated(()=>{
-	showTarBarBadge();
+onShow(()=>{
+		uni.$emit('showTabBarBadge')
 })
-function showTarBarBadge() {
-	let unReadMsgNum = 0;
-	let unProcessNum = 0;
-	getUnProcessNum(userStore.user.useId, "").then(res => {
-		unProcessNum = parseInt(res.returnParams.total, 10);
-		getUnReadMessageNum(userStore.user.useId).then(res => {
-			unReadMsgNum = parseInt(res.returnParams, 10) + unProcessNum;
-			if (unReadMsgNum == 0) {
-				uni.removeTabBarBadge({
-					index: 0
-				})
-			} else {
-				uni.setTabBarBadge({
-					index: 0,
-					text: unReadMsgNum > 99 ? '99+' : String(unReadMsgNum)
-				})
-			}
-		})
-	})
-
-}
 const userStore = useUserStore();
 // 分段器选项
 const items = reactive(['我的', '待办', '在办', '办结'])

pages/work/index.vue

@@ -86,36 +86,18 @@ import { onMounted, ref } from "vue"
 import $tab from "@/plugins/tab.js"
 import { useUserStore } from '@/store/user.js'
 import { getProcessList } from '@/api/work.js'
-import { getUnProcessNum } from "@/api/process"
-import { getUnReadMessageNum } from "@/api/message"
 import { clearCache } from '@/utils/ygoa.js'
+import { onShow } from '@dcloudio/uni-app'
 const userStore = useUserStore()
 
 onMounted(() => {
 	initProcessList()
-	showTarBarBadge()
 })
 
-function showTarBarBadge(){
-		let unReadMsgNum=0;
-		let unProcessNum=0;
-		getUnProcessNum(userStore.user.useId,"").then(res=>{
-			unProcessNum=parseInt(res.returnParams.total, 10);
-			getUnReadMessageNum(userStore.user.useId).then(res=>{
-				unReadMsgNum=parseInt(res.returnParams, 10)+unProcessNum;
-				if(unReadMsgNum==0){
-					uni.removeTabBarBadge({
-						index:0
-					})
-				}else{
-					uni.setTabBarBadge({
-					  index: 0,
-					  text: unReadMsgNum>99?'99+':String(unReadMsgNum)
-					})
-				}
-			})
-		})		
-	}
+
+onShow(()=>{
+		uni.$emit('showTabBarBadge')
+})
 // 流程列表
 const processList = ref({
 	fList: [],