diff --git a/ui/src/components/card-checkbox/index.vue b/ui/src/components/card-checkbox/index.vue
index bf8fc431b..cfac7a208 100644
--- a/ui/src/components/card-checkbox/index.vue
+++ b/ui/src/components/card-checkbox/index.vue
@@ -14,7 +14,7 @@
         </slot>
         <slot></slot>
       </div>
-      <input class="checkbox" type="checkbox" id="checkbox" :checked="modelValue.includes(toModelValue)" />
+      <el-checkbox v-bind:modelValue="modelValue.includes(toModelValue)"> </el-checkbox>
     </div>
   </el-card>
 </template>
@@ -86,5 +86,4 @@ const checked = () => {
     }
   }
 }
-
 </style>