diff --git a/src/static/common.less b/src/static/common.less
index d7b5a6a..b3a0bc3 100644
--- a/src/static/common.less
+++ b/src/static/common.less
@@ -202,7 +202,67 @@ html, body, #app, .layout {
     overflow: auto;
   }
 }
-.el-tabs--card.nav-tabs > .el-tabs__header {
-  margin-bottom: 0;
-  border-bottom: none;
+.el-tabs--card.nav-tabs {
+  > .el-tabs__header {
+    margin-bottom: 0;
+    border-bottom: none;
+    background: var(--el-bg-color);
+    padding: 0 4px;
+    border-radius: 8px 8px 0 0;
+
+    .el-tabs__nav-wrap {
+      margin-bottom: 0;
+    }
+
+    .el-tabs__nav {
+      border: none;
+    }
+
+    .el-tabs__item {
+      height: 36px;
+      line-height: 36px;
+      padding: 0 16px;
+      font-size: var(--el-font-size-small);
+      color: var(--el-text-color-secondary);
+      border: none;
+      border-radius: 6px 6px 0 0;
+      margin-right: 2px;
+      transition: color 0.2s, background 0.2s;
+      position: relative;
+
+      &:hover {
+        color: var(--el-color-primary);
+        background: var(--el-color-primary-light-9);
+      }
+
+      &.is-active {
+        color: var(--el-color-primary);
+        font-weight: var(--el-font-weight-primary);
+        background: var(--el-fill-color);
+
+        &::after {
+          content: '';
+          position: absolute;
+          bottom: 0;
+          left: 0;
+          right: 0;
+          height: 2px;
+          background: var(--el-color-primary);
+          border-radius: 2px 2px 0 0;
+        }
+      }
+
+      .is-icon-close {
+        font-size: 11px;
+        margin-left: 4px;
+        border-radius: 50%;
+        transition: background 0.2s;
+
+        &:hover {
+          background: var(--el-color-danger-light-7);
+          color: var(--el-color-danger);
+        }
+      }
+    }
+  }
 }
\ No newline at end of file
diff --git a/src/views/api/Music.vue b/src/views/api/Music.vue
index ba3a159..ee61805 100644
--- a/src/views/api/Music.vue
+++ b/src/views/api/Music.vue
@@ -153,7 +153,7 @@ import { ref, reactive } from 'vue'
 import { useStore } from 'vuex'
 import { useBaseList } from '@/model/baselist'
 import { MsgResult, Page } from '@/model/common.dto'
-import { ElUploadInstance, ElMessage, ElMessageBox } from 'element-plus'
+import { UploadInstance, ElMessage, ElMessageBox } from 'element-plus'
 import { MusicModel, MusicLibModel, MusicLyricModel, MusicPlayerItem } from '@/model/api/music'
 import APlayer from './aplayer/vue-aplayer.vue'
 import prettyBytes from 'pretty-bytes'
@@ -179,7 +179,7 @@ class MusicPage extends Page {
 }
 
 const store = useStore()
-const { loading, modalLoading, total, search, setLoadData, loadDataBase, reset, pageChange, pageSizeChange, datetimeFormat } = useBaseList(new MusicPage())
+const { loading, modalLoading, total, search, setLoadData, loadDataBase, reset, pageChange, pageSizeChange } = useBaseList(new MusicPage())
 
 const currentRow = ref<MusicModel | null>(null)
 const libIdSelected = ref<string | null>(null)
@@ -193,7 +193,7 @@ const musicPlaying = ref(false)
 const musicList = ref<MusicPlayerItem[]>([])
 const currentMusic = ref<MusicPlayerItem>()
 const lyricForm = ref<VForm>()
-const musicUpload = ref<ElUploadInstance>()
+const musicUpload = ref<UploadInstance>()
 const player = ref<any>()
 
 const lyricRuleValidate = {