diff --git a/packages/common/business_components/src/ui/table/index.tsx b/packages/common/business_components/src/ui/table/index.tsx
index 08941bc5f..a5191eca6 100644
--- a/packages/common/business_components/src/ui/table/index.tsx
+++ b/packages/common/business_components/src/ui/table/index.tsx
@@ -11,6 +11,7 @@ type UiTableProps = {
   children: React.ReactNode | undefined;
   cellClick : ((index:number|undefined)=>void) | undefined;
   onPageChange: (page: number) => void;
+  className?: string;
 }
 
 type UiHeadProps = {
@@ -18,7 +19,7 @@ type UiHeadProps = {
   title: string;
 }
 
-export function UiTable({ tableData, headlist, pageSize, total, children, headName, cellClick, onPageChange }: UiTableProps) {
+export function UiTable({ tableData, headlist, pageSize, total, children, headName, cellClick, onPageChange, className = '' }: UiTableProps) {
   const [cur, setCur] = useState<number>(1);
   const handlePageChange = (page: number) => {
     setCur(page);
@@ -31,7 +32,7 @@ export function UiTable({ tableData, headlist, pageSize, total, children, headNa
       {headName ? <div className="card-header">
         <h3 className="text-2xl font-medium text-label">{headName}</h3>
         </div> : <></>}
-      <div className={`card !m-[1.2rem] !p-0r`}>
+      <div className={`card !m-[1.2rem] !p-0r ${className}`}>
         <Table>
           <TableHeader>
           {children ? <>{children}</> : <TableRow>