refactor:优化基础组件（面板组件、标题组件）

src/components/base-header/base-header.vue

@@ -1,11 +1,17 @@
 <template>
   <div class="base-header">
-    <slot></slot>
+    <slot name="title" v-if="$slots.title"></slot>
+    <span v-else class="title">{{ title }}</span>
   </div>
 </template>
 
 <script>
-export default { name: 'BaseHeader' }
+export default {
+  name: 'BaseHeader',
+  props: {
+    title: { type: String, default: '' }
+  }
+}
 </script>
 
 <style lang="scss" scoped>
@@ -20,5 +26,17 @@ export default { name: 'BaseHeader' }
   font-weight: 500;
   background-size: cover;
   background-image: url('@/assets/image/common/header-bg.png');
+  .title {
+    position: relative;
+    overflow: hidden;
+    padding: 0 0.08rem;
+    width: 100%;
+    height: 0.48rem;
+    color: #ffffff;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+    display: flex;
+    align-items: center;
+  }
 }
 </style>

src/components/base-panel/base-panel-left.vue

@@ -1,10 +1,9 @@
 <template>
   <div class="left-wrapper">
     <div class="base-panel-left" :class="{ hide: isHide }">
+      <slot></slot>
       <div class="leftbtn" @click="toggleLeftPanel"></div>
-      <div class="left-background" :class="{ leftHide: isHide }">
-        <slot></slot>
-      </div>
+      <div class="left-background" :class="{ leftHide: isHide }"></div>
     </div>
   </div>
 </template>
@@ -34,8 +33,8 @@ export default {
     left: 0;
     height: 100vh;
     width: 4.62rem;
-    padding-top: 0.92rem;
-    padding-left: 0.22rem;
+    padding-top: 0.82rem;
+    padding-left: 0.12rem;
     transition: all 0.3s;
     pointer-events: auto;
     z-index: 40;

src/components/base-panel/base-panel-right.vue

@@ -1,10 +1,9 @@
 <template>
   <div class="right-wrapper">
     <div class="base-panel-right" :class="{ hide: isHide }">
+      <slot></slot>
       <div class="rightbtn" @click="toggleRightPanel"></div>
-      <div class="right-background" :class="{ rightHide: isHide }">
-        <slot></slot>
-      </div>
+      <div class="right-background" :class="{ rightHide: isHide }"></div>
     </div>
   </div>
 </template>