# Expense Categories Module

## Cấu trúc thư mục

```
expense-categories/
├── components/           # Các component tái sử dụng
│   ├── CategoryForm.vue         # Form tạo/sửa danh mục chi phí
│   └── index.js                 # Export các components
├── index.vue             # Trang danh sách danh mục chi phí
├── detail.vue            # Trang chi tiết danh mục chi phí
├── create-or-update.vue  # Trang tạo/sửa danh mục chi phí
├── index.js              # Export các views
└── README.md             # Tài liệu này
```

## Components

### CategoryForm
- Form tạo mới hoặc chỉnh sửa danh mục chi phí
- Validation với VeeValidate và Yup
- Tích hợp với LadaSelect cho người phê duyệt
- Tự động load danh sách người dùng khi cần

## Views

### index.vue
- Trang danh sách danh mục chi phí
- Tích hợp tìm kiếm, phân trang
- Modal tạo/sửa danh mục
- Modal xác nhận xóa

### detail.vue
- Trang chi tiết danh mục chi phí
- Hiển thị đầy đủ thông tin danh mục
- Nút chỉnh sửa

### create-or-update.vue
- Trang tạo mới hoặc chỉnh sửa danh mục chi phí
- Sử dụng CategoryForm component
- Xử lý routing động dựa trên params

## Dependencies

- Vue 3 Composition API
- Vue Router 4
- VeeValidate + Yup
- Vue Toastification
- Bootstrap 5
- LadaSelect component

## Services

- `expenseCategoryService`: Xử lý API calls cho danh mục chi phí
- `userService`: Xử lý API calls cho người dùng

## Routing

Các routes được định nghĩa trong router configuration:
- `/quan-ly-danh-muc-chi-phi` - Danh sách danh mục chi phí
- `/quan-ly-danh-muc-chi-phi/them-moi` - Tạo mới danh mục chi phí
- `/quan-ly-danh-muc-chi-phi/chinh-sua/:id` - Chỉnh sửa danh mục chi phí
- `/chi-tiet-danh-muc-chi-phi/:id` - Chi tiết danh mục chi phí

## Features

- Quản lý danh mục chi phí với đầy đủ CRUD operations
- Tìm kiếm theo từ khóa
- Phân trang
- Validation form đầy đủ
- Tích hợp với hệ thống người dùng
- Responsive design
