修改登录页面

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

@@ -334,7 +334,7 @@ function submit()  {
   .item {
     background-color: #fff;
     border-radius: 8px;
-    padding: 12px;
+    padding: 12px 10px;
     margin-bottom: 10px;
     margin-left: 10px;
     margin-right: 10px;

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

@@ -52,11 +52,6 @@
       </el-menu>
     </div>
   </el-scrollbar>
-  <div class="github">
-    <a href="https://github.com/LaziestRen/cloud-mail">
-      <Icon icon="codicon:github-inverted" width="28" height="28" />
-    </a>
-  </div>
 </template>
 
 <script setup>
@@ -75,7 +70,7 @@ const route = useRoute();
 .title {
   margin: 15px 10px;
   height: 50px;
-  border-radius: 8px;
+  border-radius: 6px;
   display: flex;
   position: relative;
   font-size: 16px;
@@ -110,7 +105,7 @@ const route = useRoute();
 
 .el-menu-item {
   margin: 5px 10px !important;
-  border-radius: 8px;
+  border-radius: 6px;
   height: 36px;
   padding: 10px !important;
 }
@@ -148,7 +143,7 @@ const route = useRoute();
   border-right: 0;
   width: 250px;
   @media (max-width: 1199px) {
-    width: 230px;
+    width: 250px;
   }
 }
 

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

@@ -29,7 +29,7 @@
               {{ userStore.user.email }}
             </div>
             <div class="detail-user-type">
-              <el-tag  type="warning">{{userStore.user.role.name}}</el-tag>
+              <el-tag >{{userStore.user.role.name}}</el-tag>
             </div>
             <div class="action-info">
               <div>
@@ -38,14 +38,14 @@
               </div>
               <div>
                 <div>
-                  <span v-if="sendCount !== null" style="margin-right: 5px">{{  sendCount }}</span>
-                  <el-tag v-if="!hasPerm('email:send')" type="warning">{{sendType}}</el-tag>
-                  <el-tag v-else type="success">{{sendType}}</el-tag>
+                  <span v-if="sendCount" style="margin-right: 5px" >{{  sendCount }}</span>
+                  <el-tag v-if="!hasPerm('email:send')" >{{sendType}}</el-tag>
+                  <el-tag v-else >{{sendType}}</el-tag>
                 </div>
                 <div>
                   <span v-if="accountCount && hasPerm('account:add')" style="margin-right: 5px">{{  accountCount }}个</span>
-                  <el-tag v-if="!accountCount && hasPerm('account:add')" type="success">无限制</el-tag>
-                  <el-tag v-if="!hasPerm('account:add')" type="warning">无权限</el-tag>
+                  <el-tag v-if="!accountCount && hasPerm('account:add')" >无限制</el-tag>
+                  <el-tag v-if="!hasPerm('account:add')" >无权限</el-tag>
                 </div>
               </div>
             </div>
@@ -84,6 +84,11 @@ const sendType = computed(() => {
   if (!hasPerm('email:send')) {
     return '无权限'
   }
+
+  if (userStore.user.role.sendCount === 0) {
+    return '无限制'
+  }
+
   if (userStore.user.role.sendType === 'day') {
     return '每天'
   }
@@ -99,7 +104,7 @@ const sendCount = computed(() => {
   }
 
   if (!userStore.user.role.sendCount) {
-    return '无限制'
+    return null
   }
   return userStore.user.sendCount + '/' + userStore.user.role.sendCount
 })
@@ -143,7 +148,7 @@ function formatName(email) {
 }
 
 :deep(.el-popper.is-pure) {
-  border-radius: 8px;
+  border-radius: 10px;
 }
 
 .user-details {
@@ -196,20 +201,21 @@ function formatName(email) {
     padding-right: 10px;
     padding-bottom: 10px;
     .el-button {
-      height: 26px;
+      border-radius: 8px;
+      height: 28px;
       width: 100%;
     }
   }
   .details-avatar {
     margin-top: 20px;
-    height: 45px;
-    width: 45px;
+    height: 40px;
+    width: 40px;
     border: 1px solid #ccc;
     font-size: 18px;
     display: flex;
     align-items: center;
     justify-content: center;
-    border-radius: 8px;
+    border-radius: 10px;
   }
 }
 

mail-vue/src/layout/index.vue

@@ -31,10 +31,10 @@ import writer from '@/layout/write/index.vue'
 
 const uiStore = useUiStore();
 const writerRef = ref({})
-const isMobile = ref(window.innerWidth < 992)
+const isMobile = ref(window.innerWidth < 1024)
 const handleResize = () => {
-  isMobile.value = window.innerWidth < 992
-  uiStore.asideShow = window.innerWidth >= 991;
+  isMobile.value = window.innerWidth < 1024
+  uiStore.asideShow = window.innerWidth >= 1024;
 }
 
 onMounted(() => {
@@ -66,7 +66,7 @@ onBeforeUnmount(() => {
   transform: translateX(0);
   transition: all 100ms ease;
   z-index: 101;
-  @media (max-width: 991px) {
+  @media (max-width: 1024px) {
     position: fixed;
     top: 0;
     left: 0;

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

@@ -78,7 +78,7 @@ const handleResize = () => {
   @media (max-width: 767px) {
     position: fixed;
     z-index: 100;
-    width: 229px;
+    width: 250px;
   }
 }
 
@@ -87,8 +87,8 @@ const handleResize = () => {
   position: fixed;
   transform: translateX(-100%);
   opacity: 0;
-  @media (max-width: 991px) {
-    width: 229px;
+  @media (max-width: 1024px) {
+    width: 250px;
     z-index: 100;
   }
 }
@@ -99,7 +99,7 @@ const handleResize = () => {
   grid-template-columns: 250px  1fr;
   height: calc(100% - 60px);
   @media (max-width: 1200px) {
-    grid-template-columns: 229px  1fr;
+    grid-template-columns: 250px  1fr;
   }
   @media (max-width: 767px) {
     grid-template-columns: 1fr;

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

@@ -285,13 +285,13 @@ function close() {
     border-radius: 8px;
     display: flex;
     flex-direction: column;
-    @media (max-width: 991px) {
+    @media (max-width: 1024px) {
       width: 100%;
       height: 100%;
       border-radius: 0;
     }
 
-    @media (min-width: 992px) {
+    @media (min-width: 1024px) {
       height: min(800px, calc(100vh - 60px));
     }