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

mail-vue/index.html

@@ -5,7 +5,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
   <meta name="theme-color" content="#D3E3FD" id="theme-color-meta">
   <title></title>
-  <link rel="icon" href="./src/assets/favicon.png" type="image/png">
+  <link rel="icon" href="./public/mail.png" type="image/png">
   <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;600&display=swap" rel="stylesheet">
   <script src="https://challenges.cloudflare.com/turnstile/v0/api.js" async defer></script>
   <script>

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) {

mail-vue/vite.config.js

@@ -17,9 +17,8 @@ export default defineConfig(({mode}) => {
         base: env.VITE_STATIC_URL || '/',
         plugins: [vue(),
             VitePWA({
-                registerType: 'autoUpdate',
-
-                includeAssets: ['favicon.svg', 'robots.txt'],
+                registerType: 'autoUpdate',  // 配置 service worker 的注册方式
+                includeAssets: ['favicon.svg', 'robots.txt'],  // 指定需要包含的静态资源
                 manifest: {
                     name: 'Cloud Mail',
                     short_name: 'Cloud Mail',
@@ -27,27 +26,10 @@ export default defineConfig(({mode}) => {
                     theme_color: '#FFFFFF',
                     icons: [
                         {
-                            src: 'mail-192.png',
+                            src: 'mail-pwa.png',//像素尺寸一定要对应
                             sizes: '192x192',
                             type: 'image/png',
-                        },
-                        {
-                            src: 'mail-512.png',
-                            sizes: '512x512',
-                            type: 'image/png'
-                        },
-                        {
-                            src: 'mail-512.png',
-                            sizes: '512x512',
-                            type: 'image/png',
-                            purpose: 'any'
-                        },
-                        {
-                            src: 'mail-512.png',
-                            sizes: '512x512',
-                            type: 'image/png',
-                            purpose: 'maskable'
-                        },
+                        }
                     ],
                 },
             }),

mail-worker/package.json

@@ -5,9 +5,8 @@
 	"scripts": {
 		"dev": "wrangler dev --config wrangler-dev.toml",
 		"test": "wrangler deploy --config wrangler-test.toml",
-		"deploy": "npm --prefix ../mail-vue run build && wrangler deploy",
-		"start": "wrangler dev",
-		"build": "npm --prefix ../mail-vue run build"
+		"deploy": "wrangler deploy",
+		"start": "wrangler dev"
 	},
 	"devDependencies": {
 		"@cloudflare/vitest-pool-workers": "^0.7.5",

mail-worker/src/email/email.js

@@ -65,6 +65,11 @@ export async function email(message, env, ctx) {
 
 			banEmail = banEmail.split(',').filter(item => item !== '');
 
+
+			if (banEmail.includes('*')) {
+				return;
+			}
+
 			for (const item of banEmail) {
 
 				if (verifyUtils.isDomain(item)) {

mail-worker/src/service/role-service.js

@@ -23,7 +23,7 @@ const roleService = {
 
 		let roleRow = await orm(c).select().from(role).where(eq(role.name, name)).get();
 
-		const notEmailIndex = banEmail.findIndex(item => (!verifyUtils.isEmail(item) && !verifyUtils.isDomain(item)))
+		const notEmailIndex = banEmail.findIndex(item => (!verifyUtils.isEmail(item) && !verifyUtils.isDomain(item)) && item !== "*");
 
 		if (notEmailIndex > -1) {
 			throw new BizError(t('notEmail'));
@@ -72,7 +72,7 @@ const roleService = {
 
 		delete params.isDefault
 
-		const notEmailIndex = banEmail.findIndex(item => (!verifyUtils.isEmail(item) && !verifyUtils.isDomain(item)))
+		const notEmailIndex = banEmail.findIndex(item => (!verifyUtils.isEmail(item) && !verifyUtils.isDomain(item)) && item !== "*")
 
 		if (notEmailIndex > -1) {
 			throw new BizError(t('notEmail'));

mail-worker/src/service/setting-service.js

@@ -23,7 +23,7 @@ const settingService = {
 
 	async query(c) {
 
-		if (c.get('setting')) {
+		if (c.get?.('setting')) {
 			return c.get('setting')
 		}
 
@@ -45,7 +45,7 @@ const settingService = {
 
 		domainList = domainList.map(item => '@' + item);
 		setting.domainList = domainList;
-		c.set('setting', setting);
+		c.set?.('setting', setting);
 		return setting;
 	},
 

mail-worker/wrangler-dev.toml

@@ -22,17 +22,8 @@ id = "2io01d4b299e481b9de060ece9e7785c"
 binding = "r2"
 bucket_name = "email"
 
-[assets]
-binding = "assets"
-directory = "./dist"
-not_found_handling = "single-page-application"
-run_worker_first = true
-
-[triggers]
-crons = ["0 16 * * *"]
-
 [vars]
-orm_log = true
+orm_log = false
 domain = ["example.com", "example2.com", "example3.com", "example4.com"]
 admin = "admin@example.com"
 jwt_secret = "b7f29a1d-18e2-4d3b-941f-f6b2c97c02fd"

mail-worker/wrangler.toml

@@ -31,6 +31,9 @@ crons = ["0 16 * * *"]	#定时任务每天晚上12点执行
 
 #[vars]
 #orm_log = false
-#domain = []				#邮件域名可配置多个 示例: ["example1.com","example2.com"]
+#domain = []				#邮件域名可可配置多个 示例: ["example1.com","example2.com"]
 #admin = ""				#管理员的邮箱	示例: admin@example.com
 #jwt_secret = ""			#jwt令牌的密钥,随便填一串字符串
+
+[build]
+command = "pnpm --prefix ../mail-vue install && pnpm --prefix ../mail-vue run build"