$(function() { $(".selectBox").on("click", function (e) { if($(this).siblings(".checkboxes").find("label").css("display") == "block") { if($(this).siblings(".checkboxes").css("display") == "none") { $(".checkboxes").css("display", "none"); $(this).siblings(".checkboxes").css("display", "block"); } else { $(".checkboxes").css("display", "none"); } } }); $("body").on("click", function (event) { if (!$(event.target).hasClass("overSelect")) { if (($(event.target).closest(".checkboxes").length == 0)) { $(".checkboxes").css("display", "none"); } } }); $(".multiselect #category-any").on("change", function() { $("#notes").slideUp(200); $(".category-option").prop("checked", false); if(this.checked) { search_data["category"] = get_value_list_by_key(db_table["category"], null, -1, "category_id"); search_data["project"] = get_value_list_by_key(db_table["project"], null, -1, "project_id"); search_data["type"] = get_value_list_by_key(db_table["type"], null, -1, "type_id"); } else { search_data["category"] = []; search_data["project"] = []; search_data["type"] = []; } notes_show = get_notes_list_by_project(notes_button_list); set_select_text("category", false); show_select_option("project", search_data["project"], "p", true); show_select_option("type", search_data["type"], "t", true); show_select_option("notes", notes_show, "n", true); }); $(".multiselect .category-option").on("change", function() { $("#notes").slideUp(200); category_id_list = []; list_id_list = []; //set search_data check_list = get_multi_checkbox_check_list("category-option"); check_list.forEach(element => { category_id_list.push(element.split("-")[0].replace("c", "")); list_id_list.push(element.split("-")[1].replace("l", "")); }); search_data["category"] = category_id_list; search_data["project"] = get_value_list_by_key(db_table["project"], "category_id", category_id_list, "project_id"); target_type_id_list = get_value_list_by_key(db_table["category_type"], "list_id", list_id_list, "category_list"); search_data["type"] = merge_string_to_list(target_type_id_list); notes_show = get_notes_list_by_project(notes_button_list); //set view if(search_data["category"].length == db_table["category"].length) { $("#category .checkboxes input").prop("checked", false); $("#category-any").prop("checked", true); } else { $("#category-any").prop("checked", false); } set_select_text("category", false); show_select_option("project", search_data["project"], "p", true); show_select_option("type", search_data["type"], "t", true); show_select_option("notes", notes_show, "n", true); }); $(".multiselect #project-any").on("change", function() { $("#notes").slideUp(200); $(".project-option").prop("checked", false); search_data["project"] = []; if(this.checked) { $(".project-button:visible").each(function(){ search_data["project"].push($(this).find("input").attr("id").replace("p", "")); }); } notes_show = get_notes_list_by_project(notes_button_list); set_select_text("project", false); reset_checkbox("type", "t", true); show_select_option("notes", notes_show, "n", true); }); $(".multiselect .project-option").on("change", function() { $("#notes").slideUp(200); search_data["project"] = get_multi_checkbox_check_list("project-option", "p"); notes_show = get_notes_list_by_project(notes_button_list); if($(".project-option:checked").length == $(".project-button:visible").length) { $("#project .checkboxes input").prop("checked", false); $("#project-any").prop("checked", true); } else { $("#project-any").prop("checked", false); } set_select_text("project", false); reset_checkbox("type", "t", true); show_select_option("notes", notes_show, "n", true); }); $(".multiselect #type-any").on("change", function() { $("#notes").slideUp(200); $(".type-option").prop("checked", false); search_data["type"] = []; if(this.checked) { $(".type-button:visible").each(function(){ search_data["type"].push($(this).find("input").attr("id").replace("t", "")); }); } set_select_text("type", false); reset_checkbox("notes", "n", true); }); $(".multiselect .type-option").on("change", function() { search_data["type"] = get_multi_checkbox_check_list("type-option", "t"); if($(".type-option:checked").length == $(".type-button:visible").length) { $("#type .checkboxes input").prop("checked", false); $("#type-any").prop("checked", true); } else { $("#type-any").prop("checked", false); } set_select_text("type", false); if($("#t3").prop("checked")) { $("#notes").slideDown(200); reset_checkbox("notes", "n", true); } else { $("#notes").slideUp(200); } }); $(".multiselect #notes-any").on("change", function() { $(".notes-option").prop("checked", false); search_data["notes"] = []; if(this.checked) { $(".notes-button:visible").each(function(){ search_data["notes"].push(notes_button_list[parseInt($(this).find("input").attr("id").replace("n", ""))]); }); } set_select_text("notes", false); }); $(".multiselect .notes-option").on("change", function() { search_data["notes"] = get_multi_checkbox_check_list("notes-option", "n"); if($(".notes-option:checked").length == $(".notes-button:visible").length) { $("#notes .checkboxes input").prop("checked", false); $("#notes-any").prop("checked", true); } else { $("#notes-any").prop("checked", false); } set_select_text("notes", false); }); }); function merge_string_to_list(string_list) { output = []; string_list.forEach(element => { output = output.concat(element.split(",")); }); return output; } function string_concat_list(name, target_list) { output_list = []; target_list.forEach(element => { output_list.push(name + element); }); return output_list; } function get_multi_checkbox_check_list(checkbox_class, name_replace) { output = []; var $select_option = $("."+checkbox_class+":checked"); $select_option.each(function(){ if(checkbox_class == "notes-option") { output.push($(this).attr('value')); } else { output.push($(this).attr('id').replace(name_replace, "")); } }); return output; } function set_select_text(address, lock) { //unlock select bar $("#"+address+" select").prop("disabled", false); //get option name that show on select bar show_list = []; if($("#"+address+"-any").prop("checked")) { $("."+address+"-button").each(function() { if($(this).css("display") == "block") { show_list = show_list.concat($(this).find("input").attr("value")); } }); } else { $("."+address+"-option:checked").each(function() { show_list = show_list.concat($(this).attr("value")); }); } //set select bar text if(show_list.length == 0){ if(lock) { $("#"+address+" select option").text("無符合條件選項"); $("#"+address+" select").prop("disabled", true); } else { $("#"+address+" select option").text("未選擇任何專案"); } } else { if(show_list.length > 2) { $("#"+address+" select option").text("已選擇 "+show_list.length+" 項"); } else { $("#"+address+" select option").text(show_list); } } } function show_select_option(address, show_list, id_name, lock) { //init option $("#" + address + " .checkboxes input").prop("checked", false); $("#" + address + " .checkboxes label").css("display", "none"); //show option show_list.forEach(element => { $("#"+id_name+element).parent().css("display", "block"); }); if(show_list.length) { $("#" + address + " #" + address + "-any").prop("checked", true); $("#" + address + " #" + address + "-any").parent().css("display", "block"); } set_select_text(address, lock); } function reset_checkbox(checkbox_class, id_name, lock) { search_data[checkbox_class] = []; $("#"+checkbox_class+" ." + checkbox_class + "-button").each(function() { if($(this).css("display") == "block") { if(checkbox_class == "notes") { search_data[checkbox_class] = search_data[checkbox_class].concat($(this).find("input").attr("value")); } else { search_data[checkbox_class] = search_data[checkbox_class].concat($(this).find("input").attr("id").replace(id_name, "")); } } }); $("#"+checkbox_class+" .checkboxes input").prop("checked", false); $("#"+checkbox_class+" #" + checkbox_class + "-any").prop("checked", true); set_select_text(checkbox_class, lock) } function get_notes_list_by_project(notes_order_list) { search_data["notes"] = [] search_data["project"].forEach(element => { search_data["notes"] = search_data["notes"].concat(db_table["notes"][element]); }); search_data["notes"] = [...new Set(search_data["notes"])]; output_notes_order = [] search_data["notes"].forEach(element => { for(i=0; i