diff --git a/src/pages/index/bangumi.vue b/src/pages/index/bangumi.vue
index 2fcf3185..1ecdb4a3 100644
--- a/src/pages/index/bangumi.vue
+++ b/src/pages/index/bangumi.vue
@@ -72,7 +72,7 @@ definePage({
   <div flex="~ wrap" gap-y-12px gap-x-50px>
     <ab-bangumi-card
       v-for="i in data"
-      v-show="!i.deleted"
+      :class="[i.deleted && 'grayscale']"
       :key="i.id"
       :poster="i.poster_link ?? ''"
       :name="i.official_title"
diff --git a/src/store/bangumi.ts b/src/store/bangumi.ts
index fda03dad..64b1a10d 100644
--- a/src/store/bangumi.ts
+++ b/src/store/bangumi.ts
@@ -6,7 +6,15 @@ export const useBangumiStore = defineStore('bangumi', () => {
 
   const getAll = async () => {
     const res = await apiBangumi.getAll();
-    data.value = res.sort((a, b) => b.id - a.id);
+
+    const sort = (arr: BangumiRule[]) => {
+      return arr.sort((a, b) => b.id - a.id);
+    };
+
+    const enabled = sort(res.filter((e) => !e.deleted));
+    const disabled = sort(res.filter((e) => e.deleted));
+
+    data.value = [...enabled, ...disabled];
   };
 
   const updateRule = async (newRule: BangumiRule) => {