All checks were successful
Deploy SOLUTION_ERP / build-deploy (push) Successful in 3m20s
UAT feedback 2026-05-15 sau Run #211 deploy: bro request hiển thị rõ ràng giống admin Designer (panel per NV + 7 label tiếng Việt) + màu sắc khác nhau giữa Cấp duyệt + giữa Phòng ban để phân biệt. Redesign WorkflowMatrixViewPage.tsx ~250 LOC (drop table 11 cột symbol khó hiểu): NEW layout per Step (Phòng): - Step container có unique color (cycle 5 màu: blue/purple/emerald/amber/pink) - Step header bar với tone đậm: "Bước N — Phòng X" - Group levels theo level.order → 1 Cấp group = N NV panel song song (OR-of-N) - Cấp badge có unique color (cycle 5 màu: violet/sky/teal/orange/rose) - "1 NV duyệt" hoặc "N NV (OR-of-N — chỉ cần 1 NV duyệt là qua Cấp)" hint - NV permission panel mirror admin Designer line 853-949: - Header "QUYỀN DUYỆT {NV name} {email}" amber-700 uppercase - 7 checkbox label tiếng Việt rõ (read-only disabled accent-emerald): 1. Trả về 1 Cấp trước 2. Trả về 1 Bước trước 3. Trả về Người chỉ định 4. Trả về Drafter (mặc định) 5. Cho phép chỉnh sửa Section 2 (Hạng mục/NCC/Báo giá) lúc đang duyệt 6. Cho phép chỉnh sửa Section ngân sách lúc đang duyệt 7. Cho phép duyệt thẳng Cấp cuối khi đang duyệt - Grid 2-col cho 4 return mode + col-span-2 cho 3 Allow* label dài - Inactive label slate-400, active slate-800 font-medium Color palette (Tailwind JIT — full class strings array): - STEP_PALETTE: 5 màu cycle theo sIdx % 5 - LEVEL_PALETTE: 5 màu cycle theo (level.order - 1) % 5 Drop FlagCell table cell helper. Replace với StepBlock + NvPermissionPanel + FlagRow components. Verify: - npm run build fe-user PASS clean 0 TS err, 423ms, 1907 modules - Bundle 1282.91 KB (+0.32 KB from baseline — minor add new components) Em main solo CSS/UX redesign decision (criteria #2 Implementer REFUSE — UX flow decision needed cho color palette + layout structure). Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
React + TypeScript + Vite
This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
Currently, two official plugins are available:
- @vitejs/plugin-react uses Oxc
- @vitejs/plugin-react-swc uses SWC
React Compiler
The React Compiler is not enabled on this template because of its impact on dev & build performances. To add it, see this documentation.
Expanding the ESLint configuration
If you are developing a production application, we recommend updating the configuration to enable type-aware lint rules:
export default defineConfig([
globalIgnores(['dist']),
{
files: ['**/*.{ts,tsx}'],
extends: [
// Other configs...
// Remove tseslint.configs.recommended and replace with this
tseslint.configs.recommendedTypeChecked,
// Alternatively, use this for stricter rules
tseslint.configs.strictTypeChecked,
// Optionally, add this for stylistic rules
tseslint.configs.stylisticTypeChecked,
// Other configs...
],
languageOptions: {
parserOptions: {
project: ['./tsconfig.node.json', './tsconfig.app.json'],
tsconfigRootDir: import.meta.dirname,
},
// other options...
},
},
])
You can also install eslint-plugin-react-x and eslint-plugin-react-dom for React-specific lint rules:
// eslint.config.js
import reactX from 'eslint-plugin-react-x'
import reactDom from 'eslint-plugin-react-dom'
export default defineConfig([
globalIgnores(['dist']),
{
files: ['**/*.{ts,tsx}'],
extends: [
// Other configs...
// Enable lint rules for React
reactX.configs['recommended-typescript'],
// Enable lint rules for React DOM
reactDom.configs.recommended,
],
languageOptions: {
parserOptions: {
project: ['./tsconfig.node.json', './tsconfig.app.json'],
tsconfigRootDir: import.meta.dirname,
},
// other options...
},
},
])