Đặc tả màn — Phân hệ Bảng tin

Pair với mockup: ui-mockups/longdo-erp/web/nhat-ky-cong-viec.html · them-nhat-ky.html · trang-ca-nhan-nguoi-khac.html Các màn báo cáo công trường (them-bao-cao-cong-truong.html · danh-sach-bao-cao.html · xac-nhan-bao-cao.html · thiet-lap-ky-bao-cao.html · bao-cao-*.html) chưa có đặc tả màn ở trang này — UI chi tiết xem thẳng tai-lieu-nghiep-vu/bang-tin.md mục 1.3 (FR-BT-03, FR-BT-11…13). Mục đích: feed nhật ký công việc toàn công ty — xem, đăng/sửa bài, tương tác (thích · bình luận · chia sẻ) và xem trang cá nhân người khác. Quyền xem: mọi nhân viên; mỗi bài chỉ hiện với người nằm trong phạm vi hiển thị do người đăng đặt. Loại màn: danh sách/feed + form nhập liệu.

Nháp sinh từ mockup — chờ BA rà

Trang này mô tả giao diện 3 màn Bảng tin để bàn giao Dev. Ràng buộc nghiệp vụ (mã FR-BT / BR-BT, phạm vi hiển thị, nguồn số liệu báo cáo…) nằm ở tài liệu nghiệp vụ tai-lieu-nghiep-vu/bang-tin.md. Nguồn dữ liệu (API/entity) ở đây là dự kiến — BA & Dev chốt khi hiện thực.

Vào phân hệ

• Rail điều hướng (thanh icon trái, lặp ở mọi trang): mục Bảng tin (icon feed) ở đầu rail, ngay dưới avatar → mở nhat-ky-cong-viec.html. Sáng (active) khi đang ở một trong các màn Bảng tin.
• Màn Đăng bài (them-nhat-ky.html) mở theo ngữ cảnh nguồn — xem Luồng chuyển màn.

---

Màn 1 — Bảng tin toàn công ty (nhat-ky-cong-viec.html)

Feed dọc, một cột, gộp bài nhật ký công việc của toàn công ty theo thời gian mới nhất.

Thanh công cụ (header)

Thành phần	Kiểu	Bắt buộc	Nguồn / Tùy chọn	Ràng buộc / Hành vi
Ô tìm kiếm	text	–	–	tìm theo nội dung bài & tên người; khi đang tìm thì ẩn ô soạn bài
Lọc theo dự án	multi-select	–	danh sách dự án	mặc định "Tất cả dự án"; chọn ≥ 1 → badge đếm số dự án; lọc feed theo dự án đã chọn
Chuông thông báo	hành động	–	–	chấm đỏ khi có thông báo chưa đọc

Ô soạn bài & danh sách bài

Thành phần	Kiểu	Bắt buộc	Nguồn	Ràng buộc / Hành vi
Ô soạn bài nhanh	hành động	–	–	bấm → mở popup soạn bài (compose-modal.js); ẩn khi đang tìm kiếm
Bài đăng (article)	list	✔	GET /feed (dự kiến)	mỗi bài: avatar + tên người đăng, thời gian, phạm vi hiển thị (🌐 Công khai…), nội dung, thẻ dự án (nếu có), ảnh/video
Số liệu tương tác	int	–	theo bài	số ❤️ thích · số bình luận · số chia sẻ
Menu ⋯ (bài của mình)	hành động	–	–	chỉ hiện ở bài của người đang đăng nhập: Sửa bài · Xóa bài
Menu ⋯ (bài người khác)	hành động	–	–	ở bài của người khác: Ẩn bài viết (kèm Hoàn tác) — theo tai-lieu-nghiep-vu/bang-tin.md §1.1.3 · FR-BT-07
Trạng thái cuối feed	–	–	–	"Bạn đã xem hết bài mới" khi hết dữ liệu

Hành động trên mỗi bài

Nút	Điều kiện	Kết quả
Thích	–	đổi 🤍↔❤️, cập nhật số đếm
Bình luận	–	mở khu bình luận dưới bài; nhập + Gửi
Chia sẻ	–	mở popup Chia sẻ — chọn người/nhóm (có ô tìm), gửi vào đoạn chat
Bấm tên/avatar người đăng	–	mở trang cá nhân người đó (Màn 3) hoặc trang của mình

Trạng thái màn

Trạng thái	Hiển thị
Đang tải	khung xương (skeleton) các thẻ bài đầu feed
Rỗng (không có bài trong bộ lọc)	khối "empty state" — không có bài phù hợp
Lỗi tải	thông báo lỗi + nút "Thử lại"
Đang tìm kiếm	ẩn ô soạn bài, chỉ hiện kết quả khớp

---

Màn 2 — Đăng / sửa bài (them-nhat-ky.html)

Form nhập liệu chiếm cả trang để soạn một bài nhật ký công việc.

Thành phần	Kiểu	Bắt buộc	Nguồn / Tùy chọn	Ràng buộc / Hành vi
Người đăng	hiển thị	✔	người đăng nhập	avatar + tên, không sửa
Phạm vi hiển thị	enum	✔	Công khai · Chỉ hiển thị với… · Không hiển thị với… · Chỉ mình tôi	mặc định Công khai; 2 lựa chọn "…với…" mở bộ chọn người/nhóm
Lập báo cáo theo dự án	select (có tìm)	–	danh sách dự án	để trống = bài thường (hiện ô "Bạn đang nghĩ gì?"); chọn dự án = hiện bảng báo cáo công việc
Bảng báo cáo công việc	bảng động	–	người dùng nhập	cột: Vị trí/Lý trình · Nội dung công việc / Tiêu hao · Đơn vị · Khối lượng (Kế hoạch/Định mức · Thực tế) · Tỷ lệ hoàn thành (tự tính). Dòng tiêu hao con (vật tư/nhân công/ca máy): bỏ trống Vị trí, gõ tên vào cột Nội dung công việc / Tiêu hao (thụt dưới hạng mục), chỉ có Đơn vị · Thực tế — không có Kế hoạch, không đánh số, không tính tỷ lệ. Dòng trống tự bỏ khi đăng
Ô "Bạn đang nghĩ gì?"	textarea	–	–	chỉ hiện khi không chọn dự án
Ảnh / video đính kèm	file[]	–	–	lưới media + ô ＋; nhận ảnh & video, nhiều tệp

Hành động

Nút	Điều kiện	Kết quả
Đăng bài	có nội dung báo cáo hoặc status	lưu bài → quay về nguồn mở màn (xem Luồng chuyển màn)
Hủy	–	bỏ, quay về nguồn mở màn
Mũi tên quay lại (header)	–	quay về nguồn mở màn

Trạng thái màn

Trạng thái	Hiển thị
Đang lưu	nút Đăng bài chuyển trạng thái chờ, khóa thao tác
Thiếu dự án (bài có báo cáo)	chặn đăng + cảnh báo "Bài có báo cáo — vui lòng chọn dự án", mở bộ chọn dự án (theo tai-lieu-nghiep-vu/bang-tin.md)
Lỗi lưu	giữ nội dung đã nhập + thông báo lỗi, cho thử lại

---

Màn 3 — Xem trang người khác (trang-ca-nhan-nguoi-khac.html)

Trang cá nhân của một người khác, mở từ tên/avatar trong feed.

Thành phần	Kiểu	Bắt buộc	Nguồn	Ràng buộc / Hành vi
Thẻ hồ sơ	hiển thị	✔	GET /users/{id} (dự kiến)	avatar lớn, họ tên, badge trạng thái (vd "Chính thức"), chức vụ · phòng ban · mã NV
Nút Nhắn tin	hành động	✔	–	→ mở khung chat (chat.html) với người này
Tab Bài viết	tab	✔	–	mặc định chọn; liệt kê bài của người này mà mình được phép xem
Tab Ảnh	tab	–	–	lưới ảnh trích từ các bài của người này
Tab Thông tin	tab	–	–	bảng Thông tin công khai (xem dưới)
Bài (tab Bài viết)	list	✔	theo người	như bài ở Màn 1 nhưng không có menu Sửa/Xóa (không phải bài của mình)

Tab Thông tin — Thông tin công khai (chỉ các trường công khai):

Trường	Ví dụ
Họ và tên	Trần Văn Bình
Mã nhân viên	NV-0207
Chức vụ	Kỹ sư điện
Phòng ban	Phòng Kỹ thuật điện
Nơi làm việc	Công trường Điện lực Linh Đàm – Hà Nội
Ngày vào làm	08/09/2022
Email công việc	binh.tv@longdo.vn

• Ghi chú quyền xem hiển thị đầu tab Bài viết: "Chỉ hiển thị bài bạn được phép xem."
• Tab Thông tin không hiện người quản lý, số điện thoại đầy đủ hay chữ ký cá nhân (theo tai-lieu-nghiep-vu/bang-tin.md §1.8.2 · BR-BT-14).
• Tương tác (Thích · Bình luận · Chia sẻ) giống Màn 1.

Trạng thái màn

Trạng thái	Hiển thị
Đang tải	khung xương (skeleton) thẻ hồ sơ + danh sách bài
Rỗng (chưa có bài được phép xem)	"empty state" — chưa có bài nào bạn được phép xem
Không đủ quyền	vẫn hiện thẻ hồ sơ + tab Thông tin; danh sách bài rỗng theo phạm vi hiển thị

---

Luồng chuyển màn

Rail "Bảng tin" (mọi trang)
        │
        ▼
┌──────────────────────────────┐      ô soạn bài
│  Màn 1 — Bảng tin (feed)      │───────────────► popup soạn bài (compose-modal.js)
│                              │
│  tên/avatar người đăng ──────┼──► Màn 3 — Trang người khác ──► Nhắn tin (chat.html)
└──────────────────────────────┘

Trang cá nhân (mục Nhật ký) ──"Sửa bài"──► Màn 2 — Đăng/sửa bài ──Đăng/Hủy──► về nguồn
        (Màn 2 linh hoạt theo nguồn: vào từ Trang cá nhân → về Trang cá nhân;
         vào từ Bảng tin (?from=bang-tin) → về Bảng tin)

• Màn 2 điều hướng linh hoạt theo nguồn: đọc ?from= trên URL (ca-nhan | bang-tin), dự phòng theo document.referrer; mặc định Trang cá nhân (hiện chỉ Trang cá nhân mở màn này — feed dùng popup soạn bài). Nhánh ?from=bang-tin để sẵn cho luồng Bảng tin.

Ghi chú nghiệp vụ

• Bài trên Nhật ký cá nhân của Trang cá nhân cũng là nguồn cho Bảng tin — cùng một bài nhật ký.
• Phạm vi hiển thị người đăng đặt quyết định ai thấy bài trong feed và trên trang cá nhân.
• Số liệu bảng báo cáo công việc (khối lượng, tiêu hao) — công thức & nguồn do BA chốt ở tai-lieu-nghiep-vu/bang-tin.md.
• Báo cáo đi theo chức vụ: chọn dự án trong popup soạn bài thì popup nhúng biểu mẫu báo cáo rời của chức vụ người đăng — Cán bộ kỹ thuật = Nhật ký thi công · Lái máy = Nhật trình máy · Thủ kho = Báo cáo kho ngày / tuần kho · Thủ quỹ = Báo cáo quỹ · Chỉ huy trưởng = Báo cáo ngày (tờ A4 gộp các báo cáo rời đã xác nhận). Popup không còn khối riêng cho Lái máy và không có chữ ký. Đặc tả: tai-lieu-nghiep-vu/bang-tin.md mục 1.3 (FR-BT-03, FR-BT-11). Trên mockup có thanh "Chức vụ của bạn (demo)" để đổi qua lại khi duyệt — bản thật lấy chức vụ từ hồ sơ nhân sự, không có thanh này.
• Màn them-nhat-ky.html (Đăng bài riêng) chưa cập nhật theo biểu mẫu nhúng theo chức vụ — xem Câu hỏi mở số 12 của tai-lieu-nghiep-vu/bang-tin.md.
• Bản web dùng giao diện sáng (Modern SaaS); nút đổi sáng/tối ở header là dự phòng.