Quellcode durchsuchen

导航栏-通知:样式调整

Xiao_123 vor 4 Wochen
Ursprung
Commit
74bedeb333
2 geänderte Dateien mit 18 neuen und 19 gelöschten Zeilen
  1. 17 18
      src/layout/message.vue
  2. 1 1
      src/layout/personal/navBar.vue

+ 17 - 18
src/layout/message.vue

@@ -1,16 +1,18 @@
 <template>
-  <v-badge
-    color="error"
-    :content="IM.unreadCount > 99 ? '99+' : 85"
-    :model-value="IM.unreadCount > 0"
-    offset-y="1"
-    offset-x="4"
-  >
-    <div class="customIcon" :class="{'noUnReadWidth': IM.unreadCount <= 0}" @click="router.push(path)">
-      <v-icon color="primary" size="16">mdi-bell</v-icon>
-    </div>
-
-  </v-badge>
+  <div @click.stop="router.push(path)">
+    <v-badge
+      class="cursor-pointer"
+      color="error"
+      :content="IM.unreadCount > 99 ? '99+' : IM.unreadCount"
+      :model-value="IM.unreadCount > 0"
+      offset-y="1"
+      offset-x="4"
+    >
+      <div class="customIcon" :class="{'noUnReadWidth': !IM.unreadCount || IM.unreadCount <= 0}" >
+        <v-icon color="primary" size="16">mdi-bell</v-icon>
+      </div>
+    </v-badge>
+  </div>
 </template>
 
 <script setup>
@@ -19,7 +21,7 @@ import { useIM } from '@/hooks/web/useIM'
 import { useIMStore } from '@/store/im'
 import { useRouter } from 'vue-router'
 
-defineProps({
+const props = defineProps({
   path: {
     type: String,
     default: '/recruit/personal/message'
@@ -28,9 +30,6 @@ defineProps({
 const router = useRouter()
 
 const IM = useIMStore()
-// useDataSource()
-
-// const { resetConfig } = useIM()
 useIM()
 </script>
 
@@ -56,9 +55,9 @@ useIM()
   width: 26px;
 }
 :deep(.v-badge__badge) {
-  width: 17px;
+  width: 25px;
   height: 17px;
-  min-width: 17px;
+  min-width: 25px;
   font-size: 10px;
 }
 </style>

+ 1 - 1
src/layout/personal/navBar.vue

@@ -107,7 +107,7 @@
           <div class="d-flex align-center ml-4" v-if="showBall">
             <message-notification v-if="showBall" :path="paths[3]"></message-notification>
           </div>
-          <div v-if="isLogin" class="d-flex align-center ml-4 cursor-pointer">
+          <div v-if="isLogin" class="d-flex align-center ml-6 cursor-pointer">
             <v-chip v-if="showTeacherLogin" label size="small" color="primary" variant="flat" @click="handleSwitchTeacher">切换为老师</v-chip>
             <v-chip v-else label color="primary" size="small" variant="flat" @click="handleSwitchEnterprise">我要招聘</v-chip>
           </div>