1

lzhe

2024-09-26 7d59e8e2c727dd49d9552a8febc2af47c5b95a69

 src/layout/components/userbar.vue

@@ -1,18 +1,28 @@
<template>
   <div class="user-bar">
      <div class="panel-item hidden-sm-and-down" @click="search">
      <!-- <div class="panel-item hidden-sm-and-down" @click="search">
         <el-icon><el-icon-search /></el-icon>
      </div>
      <div class="screen panel-item hidden-sm-and-down" @click="screen">
         <el-icon><el-icon-full-screen /></el-icon>
      </div>
      <div class="tasks panel-item" @click="tasks">
      </div> -->
		
      <el-dropdown trigger="click">
         <div class="screen panel-item hidden-sm-and-down">
            <el-icon><el-icon-full-screen /></el-icon>
         </div>
         <template #dropdown>
         <el-dropdown-menu>
            <el-dropdown-item @click="closeOther">关闭其他</el-dropdown-item>
            <el-dropdown-item @click="closeAll">关闭所有</el-dropdown-item>
         </el-dropdown-menu>
         </template>
      </el-dropdown>
      <!-- <div class="tasks panel-item" @click="tasks">
         <el-icon><el-icon-sort /></el-icon>
      </div>
      </div> -->
      <div class="msg panel-item" @click="showMsg">
         <el-badge :hidden="msgList.length==0" :value="msgList.length" class="badge" type="danger">
         <el-icon><el-icon-chat-dot-round /></el-icon>
         <!-- <el-badge :hidden="msgList.length==0" :value="msgList.length" class="badge newbadge" type="danger">
            <el-icon><el-icon-chat-dot-round /></el-icon>
         </el-badge>
         </el-badge> -->
         <el-drawer title="新消息" v-model="msg" :size="400" append-to-body destroy-on-close>
            <el-container>
               <el-main class="nopadding">
@@ -21,7 +31,7 @@
                        <li v-for="item in msgList" v-bind:key="item.id">
                           <a :href="item.link" target="_blank">
                              <div class="msg-list__icon">
                                 <el-badge is-dot type="danger">
                                 <el-badge is-dot type="danger" calss="newbadge">
                                    <el-avatar :size="40" :src="item.avatar"></el-avatar>
                                 </el-badge>
                              </div>
@@ -72,6 +82,7 @@
</template>

<script>
   import useTabs from '@/utils/useTabs'
   import search from './search.vue'
   import tasks from './tasks.vue'

@@ -124,6 +135,13 @@
         this.userNameF = this.userName.substring(0,1);
      },
      methods: {
         closeOther() {
            useTabs.closeOther();
         },
         closeAll() {
            useTabs.closeOther();
            useTabs.close();
         },
         //个人信息
         handleUser(command) {
            if(command == "uc"){
@@ -166,7 +184,8 @@
         },
         //显示短消息
         showMsg(){
            this.msg = true
            //this.msg = true
            this.$router.push({path: '/notification/notice/newsmail'});
         },
         //标记已读
         markRead(){
@@ -186,7 +205,7 @@

<style scoped>
   .user-bar {display: flex;align-items: center;height: 100%;}
   .user-bar .panel-item {padding: 0 10px;cursor: pointer;height: 100%;display: flex;align-items: center;}
   .user-bar .panel-item {padding: 0 0 0 10px;cursor: pointer;height: 100%;display: flex;align-items: center;}
   .user-bar .panel-item i {font-size: 16px;}
   .user-bar .panel-item:hover {background: rgba(0, 0, 0, 0.1);}
   .user-bar .user-avatar {height:49px;display: flex;align-items: center;}
@@ -204,4 +223,5 @@
   .dark .msg-list__main h2 {color: #d0d0d0;}
   .dark .msg-list li {border-top:1px solid #363636;}
   .dark .msg-list li a:hover {background: #383838;}
   .newbadge /deep/ .el-badge__content{top: 13px;}
</style>