perf: 修改 detail card

src/layout/components/Page/PageHeading.vue

@@ -67,7 +67,7 @@ export default {
 h2 {
   font-size: 16px;
   font-weight: 600;
-  line-height: 2;
+  line-height: 50px;
   color: var(--color-text-primary);
   overflow: hidden;
   white-space: nowrap;

src/styles/index.scss

@@ -526,3 +526,24 @@ li.rmenu i.fa {
 .el-checkbox__inner {
   border-radius: 1px !important;
 }
+
+.el-alert.el-alert--info.is-light {
+  i.el-icon-info.is-big {
+    font-size: 16px;
+    width: 18px;
+  }
+}
+
+.el-card.no-border {
+  margin-bottom: 20px;
+
+  .el-card__header {
+    padding-top: 20px;
+    padding-bottom: 0;
+
+    border-bottom: none;
+    display: inline-block;
+    font-size: 14px;
+    font-weight: 500;
+  }
+}

src/utils/theme/color.js

@@ -90,22 +90,20 @@ export function changeMenuColor(themeColors) {
     colors['--menu-hover'] = mix(white, menuActiveTextColor.replace(/#/g, ''), 90)
   }
 
-  const lights = [15, 40, 60, 80]
+  const lights = [15, 40, 60, 80, 90]
-  const darken = [15, 30, 40, 60]
+  const darken = [15, 30, 40, 60, 80]
 
   for (const key in colors) {
     const currentColor = colors[key]
     elementStyle.setProperty(key, currentColor)
 
-    if (key === '--color-primary') {
+    for (const [i, light] of lights.entries()) {
-      for (const [i, light] of lights.entries()) {
+      const color = mix(white, currentColor.replace(/#/g, ''), light)
-        const color = mix(white, currentColor.replace(/#/g, ''), light)
+      elementStyle.setProperty(key + '-light' + '-' + i, color)
-        elementStyle.setProperty(key + '-light' + '-' + i, color)
+    }
-      }
+    for (const [i, dark] of darken.entries()) {
-      for (const [i, dark] of darken.entries()) {
+      const color = mix(black, currentColor.replace(/#/g, ''), dark)
-        const color = mix(black, currentColor.replace(/#/g, ''), dark)
+      elementStyle.setProperty(key + '-dark' + '-' + i, color)
-        elementStyle.setProperty(key + '-dark' + '-' + i, color)
-      }
     }
 
     if (key.includes('--color')) {

src/utils/theme/index.js

@@ -47,6 +47,9 @@ export function changeElementColor(themeColors) {
         .el-tag--dark.el-tag--${key} {
           background-color: ${value} !important;
         }
+        .el-alert.el-alert--${key}.is-light {
+          background-color: var(--color-${key}-light-4);
+        }
       `
     }
   }

src/views/assets/Asset/AssetList/components/BaseList.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <el-alert v-if="helpMessage" type="success">
+    <el-alert v-if="helpMessage" show-icon type="info">
       <span class="announcement-main" v-html="helpMessage" />
     </el-alert>
     <ListTable ref="ListTable" :header-actions="iHeaderActions" :table-config="iTableConfig" />

src/views/assets/Domain/DomainDetail/Detail.vue

@@ -22,7 +22,7 @@ export default {
   },
   data() {
     return {
-      url: `/api/v1/assets/domains/${this.object.id}`,
+      url: `/api/v1/assets/domains/${this.object.id}/`,
       detailFields: [
         'name', 'assets_amount',
         {

src/views/assets/Domain/DomainDetail/index.vue

@@ -25,6 +25,7 @@ export default {
       TaskDetail: {},
       config: {
         activeMenu: 'Detail',
+        url: '/api/v1/assets/domains/',
         submenu: [
           {
             title: this.$t('Detail'),

src/views/workbench/myhome/components/HomeCard.vue

@@ -1,6 +1,6 @@
 <template>
   <div id="HomeCard">
-    <el-card class="box-card" shadow="never">
+    <el-card class="box-card no-border" shadow="never">
       <div v-show="title || btnText" slot="header" class="clearfix">
         <span v-show="title" class="head-title">{{ title }}</span>
         <el-button
@@ -73,13 +73,9 @@ export default {
     position: relative;
     width: 100%;
     background-color: #fff;
-    //box-shadow: 0 2px 4px 0 rgb(54 58 80 / 32%);
     transition: all 0.4s ease;
     overflow: hidden;
-    &>>> .el-card__header {
+
-      padding: 20px 20px 0;
-      border-bottom: 0;
-    }
     &:nth-child(n) {
       margin-bottom: 20px;
     }
@@ -92,11 +88,6 @@ export default {
       font-size: 110px;
       opacity: .1;
     }
-    .head-title {
-      display: inline-block;
-      font-size: 14px;
-      font-weight: 500;
-    }
     .others {
       width: 100%;
       height: auto;

src/views/workbench/myhome/components/User.vue

@@ -1,5 +1,5 @@
 <template>
-  <el-card class="box-card" shadow="never">
+  <el-card class="box-card no-border" shadow="never">
     <div slot="header" class="title">
       <span>{{ $t('YourProfile') }}</span>
     </div>
@@ -10,10 +10,10 @@
         </el-col>
         <el-col ::md="20" :sm="24">
           <ul>
-            <li><span class="title">{{ $t('Username') }}</span>：<span>{{ users.name }}</span></li>
+            <li><span class="title">{{ $t('Username') }}:</span><span>{{ users.name }}</span></li>
-            <li><span class="title">{{ $t('Email') }}</span>：<span>{{ users.email }}</span></li>
+            <li><span class="title">{{ $t('Email') }}:</span><span>{{ users.email }}</span></li>
             <li>
-              <span class="title">{{ $t('LoginDate') }}</span>：
+              <span class="title">{{ $t('LoginDate') }}:</span>
               <span>{{ users.last_login | date }}</span>
             </li>
           </ul>
@@ -60,14 +60,14 @@ li {
     min-width: 100px;
   }
 }
-
+//
-.box-card {
+//.box-card {
-  margin-bottom: 20px;
+//  margin-bottom: 20px;
-
+//
-  & >>> .el-card__header {
+//  & >>> .el-card__header {
-    padding-top: 20px;
+//    padding-top: 20px;
-  }
+//  }
-}
+//}
 
 .content {
   overflow: hidden;