ช่วยปรับหน้า "บทเรียนออนไลน์" ให้เหมือนหน้า "ประวัติการอบรม"

สิ่งที่ต้องแก้:

1. เอา Card ที่ครอบตารางรายการบทเรียนออกทั้งหมด
   - ลบ <Card>
   - ลบ <CardContent>
   - ลบ padding ของ Card
   - ไม่ต้องมี Shadow รอบตาราง

2. ให้ Table แสดงผลเหมือนหน้า "ประวัติการอบรม" ทุกประการ
   - Table อยู่ต่อจาก Search/Filter ทันที
   - ใช้ DataTable Component เดียวกัน
   - ใช้ border และ rounded ของ DataTable เหมือนหน้า "ประวัติการอบรม"
   - ใช้ spacing เดียวกัน

3. Search / Filter ยังอยู่ใน Card เหมือนเดิม
   แต่ส่วนรายการ Table ไม่ต้องอยู่ใน Card

ตัวอย่าง Layout ที่ต้องการ

---

หัวข้อ

Card
├── Search
├── Filter
└── View

DataTable
├── Header
├── Rows
├── Pagination
└── Total

---

ไม่ต้องเป็น

---

Card
DataTable

---

4. Pagination และจำนวนรายการ
   ให้แสดงเหมือนหน้า "ประวัติการอบรม"

เช่น

ทั้งหมด 5 รายการ

                 จำนวนต่อหน้า [10]
                 หน้า 1 จาก 1

5. Table ต้องใช้ Layout เดียวกับหน้า "ประวัติการอบรม"

- overflow-x-auto
- rounded-lg border
- table-fixed
- hover row
- row height
- header style
- spacing
- badge
- action menu

เหมือนกันทั้งหมด

6. ห้ามแก้ Business Logic

- API
- Query
- Data
- Columns

แก้เฉพาะ Layout

ผลลัพธ์ที่ต้องการ

หน้า "บทเรียนออนไลน์" มี Layout เหมือนหน้า "ประวัติการอบรม" โดย Search/Filter อยู่ด้านบน และตารางแสดงต่อทันทีโดยไม่มี Card ครอบตาราง