Untitled

 avatar
unknown
plain_text
2 years ago
7.7 kB
8
Indexable
import {
    getBarangays,
    getProvinces,
    getCities,
    getRegions,
    getAllProvinces,
    addressSort,
} from "./utils";

/**
 * Description show all regions
 * @date 9/19/2023 - 10:26:40 PM
 *
 * @param {JQuery_Element} $selector
 */
export const showRegions = async ($selector) => {
    removeSelectChildren($selector);

    let regions = await getRegions();
    for (const region of regions) {
        let isSelected =
            $selector.data("val") === region.region_name ? "selected" : "";

        $selector.append(
            `<option value="${region.region_name}" ${isSelected} data-code="${region.region_code}">${region.region_name}</option>`,
        );
    }
};

/**
 * Description show all provinces
 * @date 9/19/2023 - 10:26:40 PM
 *
 * @param {JQuery_Element} $selector
 * @param {string} code
 */
export const showProvinces = async ($selector, code) => {
    removeSelectChildren($selector);

    let provinces = await getProvinces(code);
    for (const province of provinces) {
        $selector.append(
            `<option value="${province.province_name}" data-code="${province.province_code}">${province.province_name}</option>`,
        );
    }
};

/**
 * Description placeholder
 * @date 9/20/2023 - 1:09:12 PM
 *
 * @param {JQuery_Element} $selector
 * @param {string} [def=""]
 */
export const showAllProvinces = async ($selector) => {
    removeSelectChildren($selector);

    let provinces = addressSort(await getAllProvinces());

    for (const province of provinces) {
        let isSelected =
            $selector.data("val") === province.province_name ? "selected" : "";

        $selector.append(
            `<option value="${province.province_name}" ${isSelected} data-code="${province.province_code}">${province.province_name}</option>`,
        );
    }
};
/**
 * Description show all cities
 * @date 9/19/2023 - 10:26:40 PM
 *
 * @param {JQuery_Element} $selector
 * @param {string} code
 */
export const showCities = async ($selector, code) => {
    removeSelectChildren($selector);

    let cities = await getCities(code);

    for (const city of cities) {
        let isSelected =
            $selector.data("val") === city.city_name ? "selected" : "";
        $selector.append(
            `<option value="${city.city_name}" ${isSelected} data-code="${city.city_code}">${city.city_name}</option>`,
        );
    }
};
/**
 * Description show all barangays
 * @date 9/19/2023 - 10:26:40 PM
 *
 * @param {JQuery_Element} $selector
 * @param {string} code
 */
export const showBarangays = async ($selector, code) => {
    removeSelectChildren($selector);

    let barangays = await getBarangays(code);
    for (const barangay of barangays) {
        let isSelected =
            $selector.data("val") === barangay.brgy_name ? "selected" : "";
        $selector.append(
            `<option value="${barangay.brgy_name}" ${isSelected} data-code="${barangay.brgy_code}">${barangay.brgy_name}</option>`,
        );
    }
};

/**
 * Description dynamic onchange event
 * @date 9/19/2023 - 10:26:40 PM
 *
 * @export
 * @param {JQuery_Element} $self
 * @param {JQuery_Element} $selector
 * @param {string} address
 */
export const onChange = async ($self, $selector, address) => {
    let code = $self.find("option:selected").data("code")?.toString();

    switch (address) {
        case "province":
            await showProvinces($selector, code);
            break;
        case "city":
            await showCities($selector, code);
            break;
        case "barangay":
            await showBarangays($selector, code);
            break;
    }
};

/**
 * Description placeholder
 * @date 9/20/2023 - 1:09:12 PM
 *
 * @param {JQuery_Element} $self
 * @param {Jquery_Element} $country
 * @param {string[]} selectors
 */
export const alterElements = (
    $self,
    $country,
    selectors,
    edit = "",
    classes = "form-control",
) => {
    if ($self.is(":checked")) {
        $country.attr("readonly", "true");
        $country.val("Philippines");
        for (const selector of selectors) {
            $(`${edit} .${selector.replace("edit-", "")}-error`)
                .prev()
                .remove();
            $(`<select class="${classes}" name="${selector.replace(
                "edit-",
                "",
            )}" id="${selector}"
            autocomplete="off"></select>`).insertBefore(
                `${edit} .${selector.replace("edit-", "")}-error`,
            );
        }
    } else {
        $country.removeAttr("readonly");
        for (const selector of selectors) {
            $(`${edit} .${selector.replace("edit-", "")}-error`)
                .prev()
                .remove();
            $(`<input class="${classes}" name="${selector.replace(
                "edit-",
                "",
            )}" id="${selector}"
            autocomplete="off" />`).insertBefore(
                `${edit} .${selector.replace("edit-", "")}-error`,
            );
        }
    }
};

/**
 * Description placeholder
 * @date 9/20/2023 - 1:09:12 PM
 *
 * @param {JQuery_Element} $selector
 */
export const removeSelectChildren = ($selector) => {
    $selector.children().each(function (e) {
        $(this).remove();
    });
};

export const getBarangaysData = async (
    province_data,
    city_data,
    barangay_data,
    brgy_el_name,
    init,
    includeEdit = "",
) => {
    const provinces = await getAllProvinces();
    const province = provinces.find((el) => el.province_name === province_data);

    if (province) {
        const cities = await getCities(province.province_code);
        const city = cities.find((city) => city.city_name === city_data);

        if (city) {
            const brgys = await getBarangays(city.city_code);
            const hasData = brgys.some(
                (brgy) => brgy.brgy_name === barangay_data,
            );
            $(
                `.${
                    includeEdit
                        ? brgy_el_name
                        : brgy_el_name.replace("edit-", "")
                }-error`,
            )
                .prev()
                .remove();
            let $element = "";
            if (hasData) {
                $element = $(
                    `<select class="form-control" name="${brgy_el_name.replace(
                        "edit-",
                        "",
                    )}" id="${brgy_el_name}" data-val="${barangay_data}" autocomplete="off"></select>`,
                );
            } else {
                $element = $(
                    `<input class="form-control" name="${brgy_el_name.replace(
                        "edit-",
                        "",
                    )}" id="${brgy_el_name}" autocomplete="off" value="${barangay_data}" />`,
                );

                $(
                    `.${
                        includeEdit
                            ? brgy_el_name
                            : brgy_el_name.replace("edit-", "")
                    }-error`,
                )
                    .parent()
                    .find("input[type=checkbox]")
                    .removeAttr("checked");
            }
            $element.insertBefore(
                `.${
                    includeEdit
                        ? brgy_el_name
                        : brgy_el_name.replace("edit-", "")
                }-error`,
            );
            if (hasData) {
                init();
            }
        }
    }
};
Editor is loading...
Leave a Comment