write a custom verification rule in the validator of tp5, and verify that the utf8 encoded character length of the input field is within 31

coding is not very good at conversion. In the previous paragraph, I did the page verification of js. The code is as follows:

related codes

    str = $("-sharptxt_ssid7").val();
    var byteSize = 0;
    for (var i = 0; i < str.length; iPP) {
        var charCode = str.charCodeAt(i);
        if (0 <= charCode && charCode <= 0x7f) {
            byteSize += 1;
        } else if (128 <= charCode && charCode <= 0x7ff) {
            byteSize += 2;
        } else if (2048 <= charCode && charCode <= 0xffff) {
            byteSize += 3;
        } else if (65536 < charCode && charCode <= 0x1FFFFF) {
            byteSize += 4;
        } else if (0x200000 < charCode && charCode <= 0x3FFFFFF) {
            byteSize += 5;
        } else if (0x4000000 < charCode && charCode <= 0x7FFFFFFF) {
            byteSize += 6;
        }
    }
    if (byteSize > 31) {
       alert("");
    }

how can the same effect be achieved in the tp5 validator? I have tried to find it on the Internet, but they input 6 characters and there are 30 Chinese characters in length. That Chinese character occupies 3, must input at least 10 Chinese characters + one alphanumeric astringent.