Repository navigation
Feature/t225 inventory dashboard layout - #63
Conversation
📝 WalkthroughWalkthroughPR cập nhật quy trình phê duyệt phiếu nhập và phiếu xuất với bộ lọc kho. Sidebar chuyển sang menu theo nhóm. Dashboard dùng state-card và lưới responsive mới. CSS chung cập nhật bố cục cho màn hình nhỏ. ChangesQuy trình phê duyệt
Điều hướng responsive
Dashboard
Estimated code review effort: 4 (Complex) | ~60 minutes Possibly related PRs
Suggested reviewers: 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches📝 Generate docstrings
🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Actionable comments posted: 4
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@src/views/ApprovalsView.vue`:
- Around line 489-497: Use each record’s document type instead of the filter
state: in the row template, pass row.documentType to documentTypeBadgeClass and
documentTypeLabel; in the detail section, use detailState.receipt.documentType
for the badge and display “Khách hàng” instead of “Nhà cung cấp” when the type
is out, applying the same conditional label to the modal title.
- Around line 480-488: Update the DataTable rendering in ApprovalsView so it is
hidden whenever isLoading is true, preventing the empty state from appearing
alongside the loading message. Preserve the existing table and empty-text
behavior once loading completes.
- Around line 322-325: Update approveLabel to remove the redundant
isPendingApproval(status) conditional and return the single unchanged label
directly, preserving the current "Duyệt phiếu" result for every status.
In `@src/views/DashboardView.vue`:
- Around line 800-813: Bổ sung empty state cho section “Truy cập nhanh” khi
visibleQuickAccess không có phần tử do canAccessRoute lọc hết mục. Cập nhật
template quanh danh sách quick-links để hiển thị state-card--empty hoặc ẩn toàn
bộ section trong trạng thái này, đồng thời giữ nguyên danh sách hiện tại khi vẫn
có mục truy cập.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: ASSERTIVE
Plan: Pro Plus
Run ID: e59b164d-2805-457b-92bd-a6f777547200
📒 Files selected for processing (6)
src/components/AppSidebar.vuesrc/services/exportReceiptService.jssrc/services/importReceiptService.jssrc/style.csssrc/views/ApprovalsView.vuesrc/views/DashboardView.vue
| function approveLabel(status) { | ||
| if (isPendingApproval(status)) return 'Duyệt phiếu' | ||
| return 'Duyệt phiếu' | ||
| if (isPendingApproval(status)) return "Duyệt phiếu"; | ||
| return "Duyệt phiếu"; | ||
| } |
There was a problem hiding this comment.
📐 Maintainability & Code Quality | 🔵 Trivial | 💤 Low value
approveLabel có nhánh vô nghĩa.
Hai nhánh trả về cùng một chuỗi. Bỏ nhánh điều kiện để tránh gây hiểu nhầm là nhãn thay đổi theo trạng thái.
♻️ Rút gọn
-function approveLabel(status) {
- if (isPendingApproval(status)) return "Duyệt phiếu";
- return "Duyệt phiếu";
-}
+function approveLabel() {
+ return "Duyệt phiếu";
+}📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| function approveLabel(status) { | |
| if (isPendingApproval(status)) return 'Duyệt phiếu' | |
| return 'Duyệt phiếu' | |
| if (isPendingApproval(status)) return "Duyệt phiếu"; | |
| return "Duyệt phiếu"; | |
| } | |
| function approveLabel() { | |
| return "Duyệt phiếu"; | |
| } |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@src/views/ApprovalsView.vue` around lines 322 - 325, Update approveLabel to
remove the redundant isPendingApproval(status) conditional and return the single
unchanged label directly, preserving the current "Duyệt phiếu" result for every
status.
| <p v-if="isLoading" class="muted loading-line"> | ||
| Đang tải danh sách phiếu chờ duyệt... | ||
| </p> | ||
|
|
||
| <DataTable :columns="columns" :rows="receipts" empty-text="Không có phiếu nào đang chờ duyệt"> | ||
| <template #warehouseName="{ value }">{{ value || '-' }}</template> | ||
| <template #supplierName="{ value }">{{ value || '-' }}</template> | ||
| <template #createdByName="{ value }">{{ value || '-' }}</template> | ||
| <DataTable | ||
| :columns="columns" | ||
| :rows="receipts" | ||
| empty-text="Không có phiếu nào đang chờ duyệt" | ||
| > |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
Empty state hiện cùng lúc với loading.
Khi tải lần đầu, receipts rỗng nên DataTable hiển thị "Không có phiếu nào đang chờ duyệt" ngay bên dưới dòng "Đang tải...". Hãy ẩn bảng trong khi isLoading là true.
🩹 Patch
<DataTable
+ v-if="!isLoading"
:columns="columns"
:rows="receipts"
empty-text="Không có phiếu nào đang chờ duyệt"
>📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| <p v-if="isLoading" class="muted loading-line"> | |
| Đang tải danh sách phiếu chờ duyệt... | |
| </p> | |
| <DataTable :columns="columns" :rows="receipts" empty-text="Không có phiếu nào đang chờ duyệt"> | |
| <template #warehouseName="{ value }">{{ value || '-' }}</template> | |
| <template #supplierName="{ value }">{{ value || '-' }}</template> | |
| <template #createdByName="{ value }">{{ value || '-' }}</template> | |
| <DataTable | |
| :columns="columns" | |
| :rows="receipts" | |
| empty-text="Không có phiếu nào đang chờ duyệt" | |
| > | |
| <p v-if="isLoading" class="muted loading-line"> | |
| Đang tải danh sách phiếu chờ duyệt... | |
| </p> | |
| <DataTable | |
| v-if="!isLoading" | |
| :columns="columns" | |
| :rows="receipts" | |
| empty-text="Không có phiếu nào đang chờ duyệt" | |
| > |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@src/views/ApprovalsView.vue` around lines 480 - 488, Update the DataTable
rendering in ApprovalsView so it is hidden whenever isLoading is true,
preventing the empty state from appearing alongside the loading message.
Preserve the existing table and empty-text behavior once loading completes.
Source: Path instructions
| <template #code="{ row, value }"> | ||
| <div class="document-cell"> | ||
| <span class="document-code">{{ value || "-" }}</span> | ||
| <span | ||
| class="badge doc-badge" | ||
| :class="documentTypeBadgeClass(documentType)" | ||
| >{{ documentTypeLabel(documentType) }}</span | ||
| > | ||
| </div> |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
Template đọc loại phiếu từ state filter thay vì từ dữ liệu bản ghi. Cả hai vị trí dùng documentType (biến của bộ lọc). Giá trị này đổi ngay khi người dùng chọn loại phiếu khác, còn dữ liệu đang hiển thị vẫn là dữ liệu cũ, nên nhãn và badge có thể sai. Dữ liệu đã mang sẵn documentType (gán ở dòng 142 và 202-204).
src/views/ApprovalsView.vue#L489-L497: đổidocumentTypeBadgeClass(documentType)vàdocumentTypeLabel(documentType)sangrow.documentType.src/views/ApprovalsView.vue#L620-L639: dùngdetailState.receipt.documentTypecho badge, và đổi nhãn "Nhà cung cấp" thành "Khách hàng" khi loại phiếu làout; áp dụng tương tự cho tiêu đề modal ở dòng 581-583.
📍 Affects 1 file
src/views/ApprovalsView.vue#L489-L497(this comment)src/views/ApprovalsView.vue#L620-L639
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@src/views/ApprovalsView.vue` around lines 489 - 497, Use each record’s
document type instead of the filter state: in the row template, pass
row.documentType to documentTypeBadgeClass and documentTypeLabel; in the detail
section, use detailState.receipt.documentType for the badge and display “Khách
hàng” instead of “Nhà cung cấp” when the type is out, applying the same
conditional label to the modal title.
| <div class="quick-links"> | ||
| <button | ||
| v-for="item in visibleQuickAccess" | ||
| :key="item.title" | ||
| class="quick-link" | ||
| @click="openRoute(item.route)" | ||
| > | ||
| <i class="mdi" :class="item.icon"></i> | ||
| <span> | ||
| <strong>{{ item.title }}</strong> | ||
| <small>{{ item.description }}</small> | ||
| </span> | ||
| </button> | ||
| </div> |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
Thêm empty state cho “Truy cập nhanh”.
Nếu canAccessRoute lọc hết mục, visibleQuickAccess là mảng rỗng và section chỉ hiển thị khoảng trống. Hiển thị state-card--empty hoặc ẩn toàn bộ section trong trường hợp này.
As per path instructions: "Kiểm tra loading, empty state, error state".
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@src/views/DashboardView.vue` around lines 800 - 813, Bổ sung empty state cho
section “Truy cập nhanh” khi visibleQuickAccess không có phần tử do
canAccessRoute lọc hết mục. Cập nhật template quanh danh sách quick-links để
hiển thị state-card--empty hoặc ẩn toàn bộ section trong trạng thái này, đồng
thời giữ nguyên danh sách hiện tại khi vẫn có mục truy cập.
Source: Path instructions
chekc giúp tui
Summary by CodeRabbit
Tính năng mới
Cải tiến giao diện