Hướng dẫn tích hợp TRS cho nhà phát triển mới

Tài liệu hướng dẫn mẫu TRS

Phân trang ngược (từ cuối về đầu)

Khi hiển thị danh sách tài liệu theo thứ tự thời gian ngược, cần điều chỉnh chỉ số trang hiện tại sao cho trang mới nhất luôn ở vị trí 1. Đoạn mã sau sử dụng thư viện laypage để thực hiện phân trang đảo chiều:

<script>
    layui.use('laypage', function () {
        var laypage = layui.laypage;
        const maxItemsPerPage = parseInt('<TRS_ECHO VALUE="${概览文章数量}"/>');
        const currentPageIndex = parseInt('${PAGE_INDEX}');
        const totalRecords = parseInt('<TRS_CHANNEL FIELD="_DATACOUNT" />');

        // Tính toán trang hiện tại theo thứ tự ngược: trang cuối → trang 1
        const totalPages = Math.ceil(totalRecords / maxItemsPerPage) || 1;
        const reversedCurrentPage = currentPageIndex === 0 ? 1 : totalPages - currentPageIndex;

        laypage.render({
            elem: 'laypage',
            theme: 'pageTheme',
            groups: parseInt('<TRS_ECHO VALUE="${分页连续页数}"/>') || 5,
            count: totalRecords,
            limit: maxItemsPerPage,
            curr: reversedCurrentPage,
            layout: ['count', 'prev', 'page', 'next', 'skip'],
            jump: function (obj, isInit) {
                if (!isInit) {
                    const targetPage = obj.curr === 1 
                        ? `${PAGE_NAME}.${PAGE_EXT}` 
                        : `${PAGE_NAME}_${totalPages - obj.curr + 1}.${PAGE_EXT}`;
                    location.href = targetPage;
                }
            }
        });
    });
</script>

Sao chép nội dung tương thích đa trình duyệt

Đoạn mã sau đảm bảo sao chép văn bản hoạt động trên cả trình duyệt cũ (IE) và mới (Chrome/Firefox/Edge), đồng thời tránh treo giao diện khi xử lý khối dữ liệu lớn:

function copyToClipboard(content) {
    if (navigator.clipboard && window.isSecureContext) {
        return navigator.clipboard.writeText(content);
    }

    const tempInput = document.createElement('textarea');
    tempInput.value = content;
    tempInput.style.cssText = 'position:fixed; left:-9999px; top:-9999px; opacity:0;';
    document.body.appendChild(tempInput);
    tempInput.select();
    
    try {
        document.execCommand('copy');
    } finally {
        document.body.removeChild(tempInput);
    }
}

// Sử dụng:
copyToClipboard('Nội dung cần sao chép — xin chào từ hệ thống TRS!');

Giới hạn số lượng bản ghi trong các thẻ TRS

  • Thẻ <TRS_DOCUMENTS>: Nếu không khai báo thuộc tính NUM, mặc định lấy tối đa 500 bản ghi. Giá trị tối đa bị ràng buộc bởi cấu hình wcm-outline-contents-max-num trong tệp config.xml (nếu bằng 0, coi như 1000).
  • Thẻ <TRS_VIEWDATAS>: Không khai báo NUM → tối đa 1000 bản ghi; có khai báo → lấy đúng giá trị NUM.
  • Trên môi trường Hải Vân (HyCloud), tham số này được kiểm soát bởi biến môi trường WCM_OUTLINE_CONTENTS_MAX_NUM.

Vô hiệu hóa tự động chuyển đổi đường dẫn tài nguyên trong WCM

Mặc định, WCM sẽ chuyển các đường dẫn src/href thành đường dẫn tương đối và lưu bản sao (APD). Để giữ nguyên đường dẫn gốc:

  1. Thêm thuộc tính ignoreapd="1" vào thẻ HTML cần bảo toàn (ví dụ: <img ignoreapd="1" src="...">).
  2. Hoặc tắt hoàn toàn cơ chế APD bằng cách chỉnh sửa file cấu hình:
    wcm/WEB-INF/classes/trsconfig/domain/com.trs.components.common.publish/config.xml
  3. Loại bỏ IMG khỏi danh sách <tags-having-src> và loại bỏ SRC tương ứng trong <tag-src-attribute-names>.
  4. Nếu cần loại trừ thêm SCRIPT, thực hiện tương tự với SCRIPTsrc/href tùy ngữ cảnh.

Ví dụ cấu hình gốc (trước khi chỉnh sửa):

<tags-having-src>BODY,TABLE,TD,IMG,INPUT,LINK,SCRIPT,EMBED</tags-having-src>
<tag-src-attribute-names>BACKGROUND,BACKGROUND,BACKGROUND,SRC,SRC,HREF,SRC,SRC</tag-src-attribute-names>
<supported-apd-exts>BMP,GIF,JPG,JPEG,PNG,CSS,SWF,WAV,WMV,RM,EXE,COM,BAT,PDF,RAR,ZIP,JS</supported-apd-exts>

Tải tệp đính kèm có tên tiếng Trung mà không bị lỗi mã hóa

Giải pháp dựa trên BlobURL.createObjectURL(), hỗ trợ đặt tên tệp chính xác khi tải xuống — phù hợp với tệp nhỏ < 50MB. Với tệp lớn, nên kết hợp kiểm tra kích thước trước khi khởi tạo yêu cầu:

<TRS_XAPPENDIXS MODE="FILE">
    <a id="download-trigger"
       href="javascript:void(0)"
       data-url='<TRS_XAPPENDIX FIELD="_RECURL" URLISABS="TRUE"/>'
       data-filename='<TRS_XAPPENDIX FIELD="APPDESC" AUTOLINK="FALSE"/>'>
        <TRS_XAPPENDIX FIELD="APPDESC" AUTOLINK="FALSE"/>
    </a>
</TRS_XAPPENDIXS>

<script>
document.getElementById('download-trigger').addEventListener('click', function (e) {
    const url = this.dataset.url;
    const filename = this.dataset.filename || 'file';
    downloadWithBlob(url, filename);
});

function downloadWithBlob(src, name) {
    const extMatch = src.match(/\.([^.]+)(?:\?|$)/i);
    const ext = extMatch ? '.' + extMatch[1] : '';
    const finalName = name.replace(/\.[^.]*$/, '') + ext;

    if (typeof window.navigator.msSaveOrOpenBlob !== 'undefined') {
        // IE/Edge cũ
        fetch(src).then(r => r.blob()).then(blob => {
            window.navigator.msSaveOrOpenBlob(blob, finalName);
        });
    } else {
        // Các trình duyệt hiện đại
        const a = document.createElement('a');
        a.href = src;
        a.download = finalName;
        document.body.appendChild(a);
        a.click();
        document.body.removeChild(a);
    }
}
</script>

Thẻ: TRS WCM layui JavaScript blob

Đăng vào ngày 7 tháng 6 lúc 18:24