feat: 小程序首页新增查询待处理角标显示

pages/home/consult.vue

@@ -4,8 +4,9 @@
 
     <view class="consult-grid">
       <view class="consult-item" v-for="item in consultItems" :key="item.id" @click="handleItemClick(item)">
-        <view class="item-icon">
+        <view class="relative item-icon">
           <image :src="item.icon" class="icon-img" mode="aspectFill" />
+          <view v-if="badgeMap[item.badge]" class="item-dot"></view>
         </view>
         <view class="item-label">{{ item.label }}</view>
       </view>
@@ -18,7 +19,7 @@
 </template>
 
 <script setup>
-import { ref, computed } from "vue";
+import { ref, watch } from "vue";
 import { storeToRefs } from "pinia";
 import useAccount from "@/store/account";
 import api from "@/utils/api";
@@ -46,6 +47,8 @@ const props = defineProps({
 
 const { account } = storeToRefs(useAccount());
 const consultantPopup = ref(null);
+const badgeMap = ref({});
+let loading = false;
 
 const consultItems = ref([
   {
@@ -53,24 +56,28 @@ const consultItems = ref([
     label: "聊天咨询",
     icon: "/static/home/chat-consult.png",
     needSelectConsultant: true,
+    badge: 'chat'
   },
   {
     id: "education",
     label: "我的宣教",
     icon: "/static/home/my-education.png",
     path: "/pages/article/article-list",
+    badge: 'article'
   },
   {
     id: "survey",
     label: "我的问卷",
     icon: "/static/home/my-questionnaire.png",
     path: "/pages/survey/survey-list",
+    badge: 'survey'
   },
   {
     id: "rating",
     label: "服务评价",
     icon: "/static/home/service-rating.png",
     path: "/pages/rate/rate-list",
+    badge: 'rate'
   },
 ]);
 
@@ -156,6 +163,33 @@ function handleAddNewArchive() {
     url: `/pages/archive/edit-archive?corpId=${props.corpId}&teamId=${props.teamId}`,
   });
 }
+
+async function getBadgeCount() {
+  if (loading) return;
+  loading = true;
+  const customerIds = props.customers.map((item) => item._id);
+  if (customerIds.length === 0) {
+    badgeMap.value = {};
+    loading = false
+    return
+  }
+  const res = await api('getMiniAppHomeStats', { corpId: props.corpId, customerIds })
+  const data = res?.data || {};
+  const article = typeof data.article === 'number' ? data.article : 0;
+  const survey = typeof data.survey === 'number' ? data.survey : 0;
+  const rate = typeof data.rate === 'number' ? data.rate : 0;
+  badgeMap.value = { article, survey, rate };
+  loading = false;
+}
+
+watch(() => props.customers, n => {
+  console.error('wwwwatch: ')
+  getBadgeCount()
+}, { immediate: true })
+
+defineExpose({
+  getBadgeCount,
+})
 </script>
 
 <style lang="scss" scoped>
@@ -204,6 +238,16 @@ function handleAddNewArchive() {
   overflow: hidden;
 }
 
+.item-dot {
+  position: absolute;
+  right: 0;
+  top: 0;
+  width: 20rpx;
+  height: 20rpx;
+  background: red;
+  border-radius: 50%;
+}
+
 .consult-item:active .item-icon {
   transform: scale(0.95);
 }

pages/home/home.vue

@@ -8,7 +8,7 @@
       <customer-archive :corpId="corpId" :team="team" @update:customers="handleCustomersUpdate" />
     </view>
     <view class="home-section">
-      <consult :corpId="corpId" :teamId="team.teamId" :team="team" :customers="customers" />
+      <consult ref="consultRef" :corpId="corpId" :teamId="team.teamId" :team="team" :customers="customers" />
     </view>
     <!-- <view class="home-section">
       <team-mate :team="team" />
@@ -46,6 +46,7 @@ const team = ref(null);
 const teams = ref([]);
 const loading = ref(false);
 const customers = ref([]);
+const consultRef = ref(null)
 
 const corpId = computed(() => team.value?.corpId);
 
@@ -102,7 +103,11 @@ onShow(async () => {
   } else {
     teams.value = [];
   }
+  if (consultRef.value && typeof consultRef.value.getBadgeCount === 'function') {
+    consultRef.value.getBadgeCount()
+  }
 });
+
 watch(account, (n, o) => {
   if (n && !o) {
     getTeams();

utils/api.js

@@ -12,7 +12,8 @@ const urlsConfig = {
     getCorpMemberJob: "getCorpMemberJob",
     bindWxappWithTeam: 'bindWxappWithTeam',
     getWxappRelateTeams: 'getWxappRelateTeams',
-    getTeamMemberAvatarsAndName: "getTeamMemberAvatarsAndName"
+    getTeamMemberAvatarsAndName: "getTeamMemberAvatarsAndName",
+    getMiniAppHomeStats: "getMiniAppHomeStats"
   },
 
   knowledgeBase: {