diff --git a/src/pages/09_task-order/TaskStatusComponent.vue b/src/pages/09_task-order/TaskStatusComponent.vue
index 589e2065..626cca53 100644
--- a/src/pages/09_task-order/TaskStatusComponent.vue
+++ b/src/pages/09_task-order/TaskStatusComponent.vue
@@ -23,6 +23,11 @@ const statusList = [
     icon: 'mdi-file-check-outline',
     color: 'positive',
   },
+  {
+    value: TaskStatus.Canceled,
+    icon: 'mdi-file-remove-outline',
+    color: 'negative',
+  },
 ];
 
 const currStatus = computed(() =>
diff --git a/src/pages/09_task-order/constants.ts b/src/pages/09_task-order/constants.ts
index e2bf30c6..87816296 100644
--- a/src/pages/09_task-order/constants.ts
+++ b/src/pages/09_task-order/constants.ts
@@ -89,11 +89,6 @@ export const taskStatusOrderToggle = [
     icon: 'mdi-file-remove-outline',
     color: 'negative',
   },
-  {
-    value: TaskStatus.Canceled,
-    icon: 'mdi-file-remove-outline',
-    color: 'negative',
-  },
 ];
 
 export const column = [