党建主题适配

components/layout/AiDvPanel/AiDvPanel.vue

@@ -1,6 +1,6 @@
 <template>
   <section class="AiDvPanel">
-    <component :is="border" :title="title" v-if="border">
+    <component :is="border" :title="title" v-if="border" :theme="theme">
       <template v-if="$slots.title" #title>
         <slot name="title"/>
       </template>
@@ -24,7 +24,11 @@ export default {
   components: { Border0, Border1, Border2, Border3, Border4, Border5, border6 },
   props: {
     title: {default: "请传入标题"},
-    border: {default: "border0"}
+    border: {default: "border0"},
+    theme: {
+      type: String,
+      default: '0'
+    }
   },
   mounted() {
   },

components/layout/AiDvPanel/borders/border6.vue

@@ -1,6 +1,9 @@
 <template>
-  <section class="border6">
-    <h2>{{ title }}</h2>
+  <section class="border6" :class="'border6-' + theme">
+    <div class="border6-title">
+      <img src="../asset/ic-badge.png" v-if="theme === '1'" />
+      <h2>{{ title }}</h2>
+    </div>
     <div class="slot">
       <slot/>
     </div>
@@ -10,9 +13,8 @@
 <script>
 export default {
   name: 'border6',
-  props: {
-    title: String
-  }
+
+  props: ['title', 'theme']
 }
 </script>
 
@@ -20,20 +22,33 @@ export default {
 .border6 {
   height: 100%;
 
-  h2 {
+  .border6-title {
+    display: flex;
     position: relative;
     height: 40px;
-    line-height: 26px;
+    // line-height: 26px;
     padding: 4px 0 0 22px;
-    color: #fff;
-    font-size: 22px;
-    font-weight: normal;
+    box-sizing: border-box;
     font-family: PingFangSC-Medium, PingFang SC;
     background-image: url(../asset/title6.png);
     background-position: bottom;
     background-size: 100% 7px;
     background-repeat: no-repeat;
 
+    h2 {
+      line-height: 1;
+      color: #fff;
+      font-size: 20px;
+      font-weight: normal;
+      letter-spacing: 1px;
+    }
+
+    img {
+      width: 28px;
+      height: 28px;
+      margin-right: 8px;
+    }
+
     &:after {
       position: absolute;
       top: 16px;
@@ -47,6 +62,15 @@ export default {
     }
   }
 
+  &.border6-1 .border6-title {
+    background-image: url(../asset/title-6-dj.png);
+    background-position: bottom;
+
+    &:after {
+      background: #FFA086;
+    }
+  }
+
   .slot {
     height: calc(100% - 40px);
     padding-top: 19px;