修改图标和权限*拦截邮件

mail-vue/src/components/email-scroll/index.vue

@@ -45,14 +45,14 @@
                 <div class="email-sender" :style=" showStatus ? 'gap: 10px;' : ''">
                   <div class="email-status" v-if="showStatus">
                     <el-tooltip v-if="item.status ===  0" effect="dark" :content="$t('received')">
-                      <Icon icon="ic:round-mark-email-read" style="color: #67C23A" width="20" height="20"/>
+                      <Icon icon="ic:round-mark-email-read" style="color: #51C76B" width="20" height="20"/>
                       />
                     </el-tooltip>
                     <el-tooltip v-if="item.status ===  1" effect="dark" :content="$t('sent')">
-                      <Icon icon="bi:send-arrow-up-fill" style="color: #67C23A" width="20" height="20"/>
+                      <Icon icon="bi:send-arrow-up-fill" style="color: #51C76B" width="20" height="20"/>
                     </el-tooltip>
                     <el-tooltip v-if="item.status ===  2" effect="dark" :content="$t('delivered')">
-                      <Icon icon="bi:send-check-fill" style="color: #67C23A" width="20" height="20"/>
+                      <Icon icon="bi:send-check-fill" style="color: #51C76B" width="20" height="20"/>
                     </el-tooltip>
                     <el-tooltip v-if="item.status ===  3" effect="dark" :content="$t('bounced')">
                       <Icon icon="bi:send-x-fill" style="color: #F56C6C" width="20" height="20"/>

mail-vue/src/layout/write/index.vue

@@ -40,7 +40,7 @@
           </div>
           <div class="att-list">
             <div class="att-item" v-for="(item,index) in form.attachments" :key="index">
-              <Icon :icon="getIconByName(item.filename)" width="20" height="20"/>
+              <Icon v-bind="getIconByName(item.filename)"/>
               <span class="att-filename">{{ item.filename }}</span>
               <span class="att-size">{{ formatBytes(item.size) }}</span>
               <Icon style="cursor: pointer;" icon="material-symbols-light:close-rounded" @click="delAtt(index)"
@@ -560,10 +560,9 @@ function close() {
             gap: 5px;
             height: 32px;
             font-size: 14px;
-            border: 1px solid var(--el-border-color-light);
-            padding: 5px 5px;
+            padding: 4px 5px;
+            background: var(--light-ill);
             border-radius: 4px;
-
             .att-filename {
               white-space: nowrap;
               text-overflow: ellipsis;

mail-vue/src/utils/icon-utils.js

@@ -2,15 +2,65 @@ import {getExtName} from "@/utils/file-utils.js";
 
 export function getIconByName(filename) {
     const extName = getExtName(filename)
-    if (['zip', 'rar', '7z', 'tar', 'tgz'].includes(extName)) return 'octicon:file-zip-24';
-    if (['png', 'jpg', 'jpeg','gif','webp','jfif'].includes(extName)) return 'mingcute:pic-line';
-    if (['mp4', 'avi', 'mkv', 'mov', 'wmv', 'flv'].includes(extName)) return 'fluent:video-clip-24-regular';
-    if (['txt', 'doc', 'docx', 'md','ini','conf'].includes(extName)) return 'hugeicons:google-doc'
-    if (['xls', 'csv', 'xlsx'].includes(extName)) return 'codicon:table';
-    if (['mp3', 'wav', 'aac', 'ogg', 'flac', 'm4a'].includes(extName)) return 'mynaui:music';
-    if (['.ppt', 'pptx', 'pps', 'potx', 'pot'].includes(extName)) return 'lsicon:file-ppt-filled'
-    if (extName === 'pdf') return 'hugeicons:pdf-02';
-    if (extName === 'apk') return 'proicons:android';
-    if (extName === 'exe') return 'bi:filetype-exe';
-    return "hugeicons:attachment-01"
-}
+    if (['zip', 'rar', '7z', 'tar', 'tgz'].includes(extName)) return {
+        icon: 'mdi:zip-box',
+        width: '24px',
+        height: '24px',
+        color: '#FBBD08',
+    };
+    if (['png', 'jpg', 'jpeg','gif','webp','jfif'].includes(extName)) return {
+        icon: 'fluent-color:image-24',
+        width: '24px',
+        height: '24px',
+        color: ''
+    };
+    if (['mp4', 'avi', 'mkv', 'mov', 'wmv', 'flv'].includes(extName)) return {
+        icon: 'fluent:video-clip-20-filled',
+        width: '24px',
+        height: '24px',
+        color: '#658bff'
+    };
+    if (['txt','md','ini','conf'].includes(extName)) return {
+        icon: 'fluent-color:document-48',
+        width: '24px',
+        height: '24px',
+        color: ''
+    };
+    if (['doc', 'docx'].includes(extName)) return {
+        icon: 'vscode-icons:file-type-word',
+        width: '23px',
+        height: '23px',
+        color: ''
+    };
+    if (['xls', 'csv', 'xlsx'].includes(extName)) return {
+        icon: 'vscode-icons:file-type-excel',
+        width: '23px',
+        height: '23px',
+        color: ''
+    };
+    if (['mp3', 'wav', 'aac', 'ogg', 'flac', 'm4a'].includes(extName)) return {
+        icon: 'lineicons:apple-music',
+        width: '24px',
+        height: '24px',
+        color: '#e91e63'
+    };
+    if (['ppt', 'pptx', 'pps', 'potx', 'pot'].includes(extName)) return {
+        icon: 'vscode-icons:file-type-powerpoint',
+        width: '24px',
+        height: '24px',
+        color: ''
+    };
+    if (extName === 'pdf') return {
+        icon: 'material-icon-theme:pdf',
+        width: '24px',
+        height: '24px',
+        color: ''
+    };
+    return {
+        icon: "solar:paperclip-rounded-2-bold",
+        width: '24px',
+        height: '24px',
+        color: '#1CBBF0'
+    };
+
+}

mail-vue/src/views/content/index.vue

@@ -4,10 +4,10 @@
       <Icon class="icon" icon="material-symbols-light:arrow-back-ios-new" width="20" height="20" @click="handleBack"/>
       <Icon v-perm="'email:delete'" class="icon" icon="uiw:delete" width="16" height="16" @click="handleDelete"/>
       <span class="star" v-if="emailStore.contentData.showStar">
-        <Icon class="icon" @click="changeStar" v-if="email.isStar" icon="fluent-color:star-16" width="21" height="20"/>
-        <Icon class="icon" @click="changeStar" v-else icon="solar:star-line-duotone" width="19" height="19"/>
+        <Icon class="icon" @click="changeStar" v-if="email.isStar" icon="fluent-color:star-16" width="20" height="20"/>
+        <Icon class="icon" @click="changeStar" v-else icon="solar:star-line-duotone" width="18" height="18"/>
       </span>
-      <Icon class="icon" v-if="emailStore.contentData.showReply" v-perm="'email:send'"  @click="openReply" icon="carbon:reply" width="20" height="20" />
+      <Icon class="icon" v-if="emailStore.contentData.showReply" v-perm="'email:send'"  @click="openReply" icon="la:reply" width="20" height="20" />
     </div>
     <div></div>
     <el-scrollbar class="scrollbar">
@@ -46,7 +46,7 @@
 
               <div class="att-item" v-for="att in email.attList" :key="att.attId">
                 <div class="att-icon" @click="showImage(att.key)">
-                  <Icon :icon="getIconByName(att.filename)" width="20" height="20"/>
+                  <Icon v-bind="getIconByName(att.filename)" />
                 </div>
                 <div class="att-name" @click="showImage(att.key)">
                   {{ att.filename }}
@@ -213,6 +213,7 @@ const handleDelete = () => {
   .star {
     display: flex;
     align-items: center;
+    justify-content: center;
     min-width: 21px;
   }
   .icon {
@@ -252,19 +253,20 @@ const handleDelete = () => {
     .att {
       margin-top: 30px;
       margin-bottom: 30px;
-      border: 1px solid var(--el-border-color);
-      padding: 10px;
-      border-radius: 4px;
+      border: 1px solid var(--light-border-color);
+      padding: 14px;
+      border-radius: 6px;
       width: fit-content;
       .att-box {
         min-width: min(410px,calc(100vw - 53px));
+        max-width: 600px;
         display: grid;
-        gap: 10px;
+        gap: 12px;
         grid-template-rows: 1fr;
       }
 
       .att-title {
-        margin-bottom: 5px;
+        margin-bottom: 8px;
         display: flex;
         justify-content: space-between;
         span:first-child {
@@ -277,15 +279,12 @@ const handleDelete = () => {
         div {
           align-self: center;
         }
-
-        padding: 5px 8px;
+        background: var(--light-ill);
+        padding: 5px 7px;
         border-radius: 4px;
         align-self: start;
-        border: 1px solid var(--base-border-color);
         display: grid;
         grid-template-columns: auto 1fr auto auto;
-        gap: 10px;
-
         .att-icon {
           display: grid;
         }
@@ -295,7 +294,8 @@ const handleDelete = () => {
         }
 
         .att-name {
-          margin-right: 10px;
+          margin-left: 8px;
+          margin-right: 8px;
           white-space: nowrap;
           overflow: hidden;
           text-overflow: ellipsis;
@@ -309,6 +309,7 @@ const handleDelete = () => {
         }
 
         .opt-icon {
+          padding-left: 10px;
           color: var(--secondary-text-color);
           align-items: center;
           display: flex;

mail-vue/src/views/role/index.vue

@@ -230,7 +230,7 @@ function banEmailAddTag(val) {
   form.banEmail.splice(form.banEmail.length - 1, 1)
 
   emails.forEach(email => {
-    if ((isEmail(email) || isDomain(email)) && !form.banEmail.includes(email)) {
+    if ((isEmail(email) || isDomain(email) || email === '*') && !form.banEmail.includes(email)) {
       form.banEmail.push(email)
     }
   })

mail-vue/src/views/sys-setting/index.vue

@@ -1285,8 +1285,8 @@ function editSetting(settingForm, refreshStatus = true) {
 }
 
 .background {
-  width: 250px;
-  height: 140px;
+  width: 230px;
+  height: 120px;
   border-radius: 4px;
   border: 1px solid var(--light-border);
   @media (max-width: 500px) {