update

src/App.vue

@@ -1,6 +1,7 @@
 <script>
 import {useUserStore} from "./pinia/UserStore/index.js";
 import {toPage} from "./utils/uils.js";
+import {useSystemStore} from "./pinia/SystemStore/index.js";
 
 export default {
     onLaunch: function () {
@@ -12,6 +13,8 @@ export default {
             toPage('/pages/login/index');
         }
         // #endif
+        const SystemStore = useSystemStore();
+        SystemStore.getMessageCount();
     },
     onHide: function () {
     },

src/api/system/index.js

@@ -460,6 +460,13 @@ const system = {
             data: data
         });
     },
+    getChildrenCount: async (data) => {
+        return request({
+            method: MethodsENUM.POST,
+            url: "/task/getChildrenCount",
+            data: data
+        });
+    },
 }
 
 export default system;

src/components/MessageCard.vue

@@ -70,7 +70,6 @@ const openOpenTypeFun = () => {
 onMounted(() => {
     if (type === 1) {
         const now = SystemStore.message.find(v => v.id === data.id);
-        console.log(now);
         if (!now) SystemStore.message.push({...data, is_read: false});
     }
 });

src/components/TaskCard.vue

@@ -68,6 +68,10 @@ const {data} = defineProps({
                 <view>领取时间:</view>
                 <view>{{ data.accept_time }}</view>
             </view>
+            <view v-if="data.is_settlement === 2" class="!flex gap-[8rpx] justify-between">
+                <view>提示:</view>
+                <view>{{ data.retention }}</view>
+            </view>
         </view>
     </view>
 </template>

src/components/XCountdown.vue

@@ -41,10 +41,13 @@ watch(
         <slot></slot>
         <view class="!flex gap-[16rpx] items-center">
             <view class="time-block" v-if="hours && hours>0">{{ hours < 10 ? `0${hours}` : hours }}</view>
+            <view class="time-block" v-else>00</view>
             <view v-if="hours">:</view>
             <view class="time-block" v-if="minutes && minutes>0">{{ minutes < 10 ? `0${minutes}` : minutes }}</view>
+            <view class="time-block" v-else>00</view>
             <view v-if="minutes">:</view>
             <view class="time-block" v-if="seconds && seconds>0">{{ seconds < 10 ? `0${seconds}` : seconds }}</view>
+            <view class="time-block" v-else>00</view>
         </view>
     </view>
 </template>

src/pages/messageCenter/index.vue

@@ -6,13 +6,17 @@ import XLink from "../../components/XLink.vue";
 import MessageCard from "../../components/MessageCard.vue";
 import useTableQuery from "../../hooks/useTableQuery.js";
 import Api from "../../api/index.js";
+import {useSystemStore} from "../../pinia/SystemStore/index.js";
 
+const SystemStore = useSystemStore();
 const tabs = [
     {
         name: '任务消息',
+        num: SystemStore.messageCount.one,
     },
     {
         name: '平台消息',
+        num: SystemStore.messageCount.two,
     },
 ];
 

src/pages/taskDetails/components/CollectMaterials.vue

@@ -32,7 +32,8 @@ const list = computed(() => data.children.material[current.value].comment?.flatM
     </view>
 
     <template v-if="true">
-        <view class="block" v-if="data.material_type?.title_limit > 0">
+        <view class="block"
+              v-if="data.material_type?.title_limit > 0 && data.children.material[current].title.length > 0">
             <view class="block-title">
                 标题:
             </view>

src/pinia/SystemStore/index.js

@@ -1,14 +1,53 @@
 import {defineStore} from "pinia";
 import {reactive, ref} from "vue";
+import Api from "../../api/index.js";
 
 export const useSystemStore = defineStore('SystemStore', () => {
     const accountManagementPo = reactive({
         pid: null,
     });
     const message = ref([]);
+    const messageCount = ref({
+        one: 0,
+        two: 0,
+    });
+
+    const getMessageCount = async () => {
+        const {data: {list}} = await Api.system.getMessageCenter({type: 2});
+        list.forEach(data => {
+            const now = message.value.find(v => v.id === data.id);
+            if (!now) message.value.push({...data, is_read: false});
+        })
+        const {data: {count}} = await Api.system.getChildrenCount();
+
+        messageCount.value.one = count;
+        messageCount.value.two = message.value.filter(v => !v.is_read).length;
+
+        // 生成角标
+        const tabbar = document.querySelectorAll('.uni-tabbar__item')[2].querySelector('.uni-tabbar__bd');
+        tabbar.style.position = 'relative';
+        const div = document.createElement('div');
+        div.style.position = 'absolute';
+        div.style.backgroundColor = 'red';
+        div.style.color = 'white';
+        div.style.width = '16px';
+        div.style.height = '16px';
+        div.style.borderRadius = '50%';
+        div.style.display = 'flex';
+        div.style.justifyContent = 'center';
+        div.style.alignItems = 'center';
+        div.style.fontSize = '12px';
+        div.style.right = '-12px';
+        div.style.top = '0';
+        div.innerText = messageCount.value.one + messageCount.value.two;
+        tabbar.appendChild(div);
+    }
+
     return {
         accountManagementPo,
         message,
+        messageCount,
+        getMessageCount,
     }
 }, {
     persist: {

src/scss/global.scss

@@ -5,6 +5,11 @@ $primary-color: #2D5CF6;
     @apply box-border;
 }
 
+.safe-b {
+    padding-bottom: calc(24rpx + constant(safe-area-inset-bottom)) !important;
+    padding-bottom: calc(24rpx + env(safe-area-inset-bottom)) !important;
+}
+
 .tui-btn {
     border-radius: 10rpx !important;
 }
@@ -48,6 +53,10 @@ $primary-color: #2D5CF6;
     text-overflow: ellipsis; /* 超出部分显示省略号 */
 }
 
+.tui-tabs__badge {
+    aspect-ratio: 1 / 1;
+}
+
 .nowrap {
     white-space: nowrap;
 }