diff --git a/core/core-frontend/src/components/drawer-filter/src/DrawerEnumFilter.vue b/core/core-frontend/src/components/drawer-filter/src/DrawerEnumFilter.vue
index f2754bb8e1..ce58700b7f 100644
--- a/core/core-frontend/src/components/drawer-filter/src/DrawerEnumFilter.vue
+++ b/core/core-frontend/src/components/drawer-filter/src/DrawerEnumFilter.vue
@@ -36,7 +36,7 @@ defineExpose({
 </script>
 
 <template>
-  <div class="filter">
+  <div class="draw-filter_enum">
     <span>{{ title }}</span>
     <div class="filter-item">
       <span
@@ -51,7 +51,7 @@ defineExpose({
   </div>
 </template>
 <style lang="less" scope>
-.filter {
+.draw-filter_enum {
   display: flex;
   align-items: center;
   min-height: 46px;
diff --git a/core/core-frontend/src/components/drawer-filter/src/DrawerFilter.vue b/core/core-frontend/src/components/drawer-filter/src/DrawerFilter.vue
index 6b458892f7..e1a45df91c 100644
--- a/core/core-frontend/src/components/drawer-filter/src/DrawerFilter.vue
+++ b/core/core-frontend/src/components/drawer-filter/src/DrawerFilter.vue
@@ -44,7 +44,7 @@ defineExpose({
 </script>
 
 <template>
-  <div class="filter">
+  <div class="draw-filter_base">
     <span>{{ title }}</span>
     <div class="filter-item">
       <el-select
@@ -68,7 +68,7 @@ defineExpose({
   </div>
 </template>
 <style lang="less" scope>
-.filter {
+.draw-filter_base {
   display: flex;
   align-items: center;
   min-height: 46px;
diff --git a/core/core-frontend/src/components/drawer-filter/src/DrawerTimeFilter.vue b/core/core-frontend/src/components/drawer-filter/src/DrawerTimeFilter.vue
index 93e5ca707e..5a941459f7 100644
--- a/core/core-frontend/src/components/drawer-filter/src/DrawerTimeFilter.vue
+++ b/core/core-frontend/src/components/drawer-filter/src/DrawerTimeFilter.vue
@@ -62,7 +62,7 @@ defineExpose({
 </script>
 
 <template>
-  <div class="filter">
+  <div class="draw-filter_time">
     <span>{{ title }}</span>
     <div class="filter-item">
       <el-date-picker
@@ -82,7 +82,7 @@ defineExpose({
   </div>
 </template>
 <style lang="less" scope>
-.filter {
+.draw-filter_time {
   display: flex;
   align-items: center;
   min-height: 32px;
@@ -95,7 +95,6 @@ defineExpose({
     line-height: 24px;
     white-space: nowrap;
     width: 116px;
-    // margin-top: 5px;
   }
 
   .filter-item {
diff --git a/core/core-frontend/src/components/drawer-filter/src/DrawerTreeFilter.vue b/core/core-frontend/src/components/drawer-filter/src/DrawerTreeFilter.vue
index 15d70378cf..ebd0a7d590 100644
--- a/core/core-frontend/src/components/drawer-filter/src/DrawerTreeFilter.vue
+++ b/core/core-frontend/src/components/drawer-filter/src/DrawerTreeFilter.vue
@@ -75,7 +75,7 @@ defineExpose({
 </script>
 
 <template>
-  <div class="filter">
+  <div class="draw-filter_tree">
     <span>{{ title }}</span>
     <div class="filter-item">
       <el-tree-select
@@ -97,7 +97,7 @@ defineExpose({
   </div>
 </template>
 <style lang="less" scope>
-.filter {
+.draw-filter_tree {
   display: flex;
   align-items: center;
   min-height: 46px;