can filter shard recovery stage

src/components/shardrecovery/ShardRecovery.vue

@@ -27,6 +27,5 @@
   const t = useTranslation()
 
   const { requestState, data, load } = useElasticsearchRequest<IndexRecovery>('recovery')
-
   onMounted(() => (load()))
 </script>

src/components/shardrecovery/ShardRecoveryRow.vue

@@ -6,7 +6,7 @@
       <span class="text-muted">Type: {{ shardRecovery.type }}</span>
     </td>
     <td>
-      <span v-if="shardRecovery.stage === 'done'">{{ shardRecovery.stage }}</span>
+      <span v-if="shardRecovery.stage === 'DONE'">{{ shardRecovery.stage }}</span>
       <span v-else class="text-warning">{{ shardRecovery.stage }}</span>
     </td>
     <td>

src/components/shardrecovery/ShardRecoveryTable.vue

@@ -5,6 +5,14 @@
                   :filtered-results-count="filterStateProps.filteredResultsCount" />
 
     <div class="flex q-ml-auto">
+      <q-select v-model="stage"
+                :options="['INIT', 'INDEX', 'VERIFY_INDEX', 'TRANSLOG', 'FINALIZE', 'DONE']"
+                :label="t('shard_recovery_table.stage')"
+                clearable
+                dense
+                outlined
+                class="q-mr-md"
+                style="min-width: 140px" />
       <filter-input v-model="shardRecoveryStore.filter" :columns="['index']" />
 
       <q-btn icon="settings" round flat class="q-ml-sm">
@@ -59,5 +67,5 @@
   const shardRecoveryStore = useShardRecoveryStore()
   const resizeStore = useResizeStore()
 
-  const { filterStateProps, filteredResults, columns } = useShardRecoveryTable(props)
+  const { filterStateProps, filteredResults, columns, stage } = useShardRecoveryTable(props)
 </script>

src/composables/components/shardrecovery/ShardRecoveryTable.ts

@@ -1,8 +1,9 @@
 import { genColumns } from '../../../helpers/tableColumns.ts'
 import { useTranslation } from '../../i18n.ts'
-import { computed } from 'vue'
+import { computed, ref } from 'vue'
 import { useShardRecoveryStore } from '../../../store/shardRecovery.ts'
 import { setupFilterState } from '../shared/FilterState.ts'
+import { filterItems } from '../../../helpers/filters.ts'
 
 export type ShardRecovery = {
   index: string
@@ -90,12 +91,18 @@ export type ShardRecoveryTableProps = {
 export const useShardRecoveryTable = (props: ShardRecoveryTableProps) => {
   const t = useTranslation()
   const shardRecoveryStore = useShardRecoveryStore()
+  const stage = ref(null)
 
   const results = computed(() => transformRecoveryResponse(props.shardRecoveries))
   const filteredResults = computed(() => {
-    if (shardRecoveryStore.filter.length === 0) return results.value
+    if (shardRecoveryStore.filter.length === 0 && !stage.value) return results.value
 
-    return results.value.filter(shard => shard.index.includes(shardRecoveryStore.filter))
+    let items = results.value
+    if (stage.value) {
+      items = items.filter(r => r.stage === stage.value)
+    }
+
+    return filterItems(items, shardRecoveryStore.filter, ['index'])
   })
 
   function transformRecoveryResponse (input: IndexRecovery): ShardRecovery[] {
@@ -110,8 +117,8 @@ export const useShardRecoveryTable = (props: ShardRecoveryTableProps) => {
           total_time_in_millis: shard.total_time_in_millis,
           start_time_in_millis: shard.start_time_in_millis,
           stop_time_in_millis: shard.stop_time_in_millis,
-          type: shard.type.toLowerCase(),
-          stage: shard.stage.toLowerCase(),
+          type: shard.type,
+          stage: shard.stage,
           source_host: shard.source.host,
           source_node: shard.source.name,
           target_host: shard.target.host,
@@ -147,6 +154,7 @@ export const useShardRecoveryTable = (props: ShardRecoveryTableProps) => {
   ])
 
   return {
+    stage,
     filterStateProps,
     filteredResults,
     columns

src/locales/cn.json

@@ -522,6 +522,7 @@
     "heading": "分片恢复"
   },
   "shard_recovery_table": {
+    "stage": "阶段",
     "columns": {
       "index": "索引",
       "stage": "阶段",

src/locales/en.json

@@ -522,6 +522,7 @@
     "heading": "Shard recovery"
   },
   "shard_recovery_table": {
+    "stage": "Stage",
     "columns": {
       "index": "Index",
       "stage": "Stage",

src/locales/fr.json

@@ -522,6 +522,7 @@
     "heading": "Récupération de shard"
   },
   "shard_recovery_table": {
+    "stage": "Étape",
     "columns": {
       "index": "Index",
       "stage": "Étape",