diff --git a/src/components/ui/VnCard.vue b/src/components/ui/VnCard.vue
new file mode 100644
index 000000000..ca4a02009
--- /dev/null
+++ b/src/components/ui/VnCard.vue
@@ -0,0 +1,18 @@
+<script setup>
+import { useI18n } from 'vue-i18n';
+
+const $props = defineProps({
+    columns: { type: Object, require: true, default: null },
+    rows: { type: Object, require: true, default: null },
+});
+const { t } = useI18n();
+</script>
+<template>
+    <QCard>
+        <slot name="header"></slot>
+        <slot name="body"></slot>
+
+        <slot name="footer"></slot>
+    </QCard>
+</template>
+<style lang="scss" scoped></style>