[FEATURE] Cần cơ chế view cụ thể nội dung/kết quả chạy Testcase trên giao diện web

[nvatuan]

Đôi khi có sự nhầm lẫn mà testcase trên hệ thống không đúng với testcase đã chuẩn bị. Cơ chế này sẽ giúp quản trị viên theo dõi và phát hiện lỗi sai.

[nvatuan]

Admin có thể xem 1 phần của output của code và ans để biết đề đúng hay sai

[nvatuan]

• Chưa có code đọc một file từ zip ra (đọc theo chunk)
• Chưa có UI, chưa có các handler API,
  Nên Size = Large

[nvatuan]

• Phần General sẽ chuyển Result, Total Time, Memory xuống phần bên dưới.
• Phần bên dưới (lúc trước là Source) giờ là Execution:
  • Có kết quả của Result ở góc phải trên (giữ nguyên style)
  • Language, Total Time, Memory inline, nếu tràn màn hình thì mỗi thằng trên một line riêng.
  • OPTIONAL: Language nếu được thì thêm cái logo của ngôn ngữ nữa (hardcode vào một file nào đó để map dữ liệu language hoặc language_ace sang assets, không tìm thấy mặc định không show)
  • Source: Dùng lại code editor ace đang dùng (read only), như hiện tại thì OK, nhưng có height theo content, và height maximum không chiếm hơn 40% màn hình. (Nếu effort hơn 30p vẫn chưa tìm cách thì cứ để height constant như cũ)
  • Compile Mesage: Data từ data.error là lỗi compile trả về. Đây là một chuỗi ANSI dùng để format màu trên console, convert chúng sang HTML (tham khảo: https://www.npmjs.com/package/ansi-to-html), sau đó bỏ nội dung convert vào thẻ <pre> thì chắc là OK. Height theo content và có Max Height khoảng 300~400px.
• Testcase:
  • Chỉ hiển thị nút và cho phép Expand nếu sub.can_view_test_data là true.
  • Thao tác Expand đầu tiên sẽ gọi đến /api/problem/<problem_shortname>/data/test/ và sử dụng dữ liệu đó cho các thao tác khác.
  • Có nút Expand All mở tất cả
  • Case có thể đóng mở như trên hình.
  • Data ở ô dropdown (Input, Output...) là font monospace (check file global), tốt nhất thêm background để phân tách text với background.
  • Participant's Output: Data có khi fetch Submission
  • Input và Judge's Output: Data có khi fetch testcase lần đầu

[nvatuan]

Có vấn đề gì không giống với mô tả, hay không rõ ràng, hay là mục nào Quang đang phân vân cứ báo cho mình biết. Quang có thể tự do áp dụng những thứ khác, những thứ mà được mô tả ở trên là minimum requirement thôi. Chút nữa sẽ add Quang vào Postman.

Một chút guideline lại:

• Không có deadline, nhưng nếu finish trong 2 tuần thì tuyệt.
• Cố gắng hạn chế tạo thêm những thành phần mới (new styles, new font, new lib,...) tận dụng lại những thứ cũ
• Project hình như đang dùng file .prettierrc.json ngoài ra thì không rằng buộc code style.