HtmlPage Definition

Giới thiệu

Chức năng này dùng để tạo các nội dung Html để trình bày lên giao diện hoặc lên báo cáo.

Tương tự Report Profile chức năng này hỗ trợ nhiều Rendering Engine để tạo nội dung.

Xem ví dụ cách chức năng này được sử dụng để tạo nội dung của 1 trong các page của chức năng V360 Profile

Sử dụng

29eacdbe-da06-4118-84db-53000549cbed.pbs_bo_forms_htmlpage_md

Các trường dữ liệu

PageType ^K (General)

Mã hiệu page

Description (General)

Diễn giải

DataProfile (DataSource)

Khai báo profile Report Dataset dùng để lấy dữ liệu cho nội dung Html. Ta có thể chọn 1 profile định nghĩa trước hoặc nhập thẳng câu lệnh phoebus data url ở đây.

^{This profile defines the dataset, which will be presented in the output report}.

UseBusinessObject (DataSource)

Nếu muốn trình bày 1 mẩu tin cụ thể thay vì 1 bảng dữ liệu hoặc tập hợp các bảng dữ liệu. Ta cần khai báo Data profile là phoebus data url và bật ON ở tùy chọn này.

^{Prefer data profile to return a business object}.

RenderingEngine (Engine)

Tương tự Report Profile, ta có thể sử dụng 1 trong 4 Rendering Engine để tạo nội dung html từ dữ liệu.

^{This reporting engine will be used for building the output}.

TemplateCode (Output)

Mã hiệu template để trình bày nội dung. Template này có thể là Excel hoặc Formated Text hoặc Snap tùy theo Rendering Engine được chọn.

^{Depend on the engine, this template may be formatted text, excel or snap}.

CssContent (Output)

Nội dung html được tạo ra có thể được thay đổi bề ngoài 1 lần nữa bằng nội dung css ở đây.

CssUrls (Output)

Nếu nội dung css là file ngoài, ta khai báo các file đó ở đây, cách nhau bằng dấu ,

Ngầm định hệ thống sử dụng css của Bootstrap 4.x

Các nút lệnh

Lệnh	Diễn giải
Test	Test
Template	Template
DataSource	Data Source

Tạo nội dung Html bằng Format Text

Rendering Engine này dùng format text để tạo nội dung, các trường dữ liệu được điền vào template thông qua các trường dữ liệu nằm giữa các ký tự [ và ]. Tương tự cách tạo email thông báo.

Rendering Engine này dùng Formated Text để thiết kế nội dung.

Tạo nội dung bằng scriban

Cũng sử dụng Formated Text để thiết kế, cộng thêm ngôn ngữ Scriban để trình bày các bảng dữ liệu con.

Engine này chạy rất nhanh so với Excel engine, nhưng thiết kế không thuận tiện bằng.

Template

79bbf5b0-f455-4f3b-a293-843190070691.pbs_bo_forms_htmlpage_md

Kết quả trên V360

530cf026-0538-47f9-8179-e8e196ca4132.pbs_bo_forms_htmlpage_md

Trong ví dụ trên hãy để ý đến nội dung Css quy định tag H2 màu đỏ được thêm vào nội dung html tạo ra.

Ta cũng có thể thêm các lệnh vào giao diện html thông qua hyperlink hoặc nút bấm. trong hình trên

Hyperlink có cú pháp:

[Test Command Url](pbs.bo.la.na)

🔔 Kết quả

Test Command Url

khi bấm vào sẽ thực hiện lệnh pbs.bo.la.na do nội dung hyperlink trỏ đến lệnh này

Thêm nút bấm trên trang web, hãy dùng cú pháp sau:

[::Mở chức năng Địa chỉ::{.btn .btn-primary}](pbs.BO.LA.NA)

🔔 Kết quả

Mở chức năng Địa chỉ

khi bấm vào sẽ thực hiện lệnh pbs.bo.la.na do nội dung hyperlink trỏ đến lệnh này

Tạo nội dung bằng Excel Template

Rendering Engine Excel là công cụ tiện lợi nhất để tạo nội dung html.

Để tạo nội dung html responsive theo kích thước màn hình, hãy dùng Excel template để tạo ra file markdown, rồi mới chuyển qua html. kết quả sẽ đồng nhất hơn rất nhiều so với tạo html trực tiếp từ Excel

Template - Tải về tại đây

DataSource - Tải về tại đây và tải nhập vào pbs.bo.data.rds

f488dd9b-6bce-4623-b1f1-fdb1c67eedd8.pbs_bo_forms_htmlpage_md

Chú ý rằng tuy template là excel, nhưng ta chỉ cần mô tả nội dung dữ liệu mà thôi, không cần quan tâm đến format, vì excel report sẽ tạo ra file markdown, file này sẽ được định dạng lần nữa theo bootstrap và css nếu có.

Hơn nữa các lệnh thêm hyperlink và button ở phần trên hoàn toàn có thể áp dụng ở đây.

Kết quả trên V360

Windows Client

85fe0092-390a-46da-9dbf-18a9880cba9b.pbs_bo_forms_htmlpage_md

Web Client

3cb0d51f-e610-47de-b1d8-9b3226fb20e9.pbs_bo_forms_htmlpage_md

⚠️ Chú ý

Khi xây dựng trang html cho V360 có các liên kết đến chức năng phoebus command url, ta phải thêm prefix phoebus:// trước liên kết lệnh phoebus url nếu câu lệnh này có tham số sau dấu ?.

Yêu cầu này là bắt buộc vì hyperlink trong web phải có schema. Nếu không chỉ định phoebus:// chương trình sẽ hiểu liên kết này tương ứng với 1 file ở máy tính và thêm thư mục gốc vào.

Liên kết với 1 file không hỗ trợ parameter string, do đó toàn bộ tham số câu lệnh sẽ bị bỏ qua.

Tóm lại:

Câu lệnh có tham số sau ? phải có prefix phoebus://
Câu lệnh không có tham số sau ? thì không cần.
V360 html panel chạy trên web desktop không cần phoebus://

Xem thêm

_{Updated on : 2022-09-21 04:55:16}. _{by : . at X1-EXTREME}.

_{Topic : HtmlPage Definition. pbs.bo.forms.htmlpage}