Untitled
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