成都seo网站建设,wordpress 网页缩放,电子商务网站计划书,静态网站开发篇欢迎大家加入开源鸿蒙跨平台开发者社区#xff0c;一起共建开源鸿蒙跨平台生态。 高级搜索系统概述
高级搜索系统为用户提供了更精细的搜索控制。在Cordova框架与OpenHarmony系统的结合下#xff0c;我们需要实现一个功能完整的高级搜索系统#xff0c;支持多条件组合搜索和…欢迎大家加入开源鸿蒙跨平台开发者社区一起共建开源鸿蒙跨平台生态。高级搜索系统概述高级搜索系统为用户提供了更精细的搜索控制。在Cordova框架与OpenHarmony系统的结合下我们需要实现一个功能完整的高级搜索系统支持多条件组合搜索和复杂的查询逻辑。高级搜索查询模型classAdvancedSearchQuery{constructor(){this.conditions[];this.operatorAND;// AND 或 ORthis.sortByrelevance;// relevance, date, namethis.sortOrderdesc;// asc 或 desc}addCondition(field,operator,value){this.conditions.push({field:field,operator:operator,// , !, , , , , contains, startsWith, endsWithvalue:value});}removeCondition(index){this.conditions.splice(index,1);}clearConditions(){this.conditions[];}}classAdvancedSearchEngine{constructor(){this.querynewAdvancedSearchQuery();}executeQuery(){letresults[];// 搜索植物resultsresults.concat(this.searchPlants());// 搜索记录resultsresults.concat(this.searchRecords());// 应用排序resultsthis.sortResults(results);returnresults;}searchPlants(){returnplants.filter(plantthis.evaluateConditions(plant));}searchRecords(){constallRecords[...wateringManager.records,...fertilizingManager.records,...pruningManager.records];returnallRecords.filter(recordthis.evaluateConditions(record));}evaluateConditions(item){if(this.query.conditions.length0)returntrue;constresultsthis.query.conditions.map(conditionthis.evaluateCondition(item,condition));if(this.query.operatorAND){returnresults.every(rr);}else{returnresults.some(rr);}}evaluateCondition(item,condition){constvalueitem[condition.field];switch(condition.operator){case:returnvaluecondition.value;case!:returnvalue!condition.value;case:returnvaluecondition.value;case:returnvaluecondition.value;case:returnvaluecondition.value;case:returnvaluecondition.value;casecontains:returnString(value).includes(String(condition.value));casestartsWith:returnString(value).startsWith(String(condition.value));caseendsWith:returnString(value).endsWith(String(condition.value));default:returnfalse;}}sortResults(results){returnresults.sort((a,b){letcompareValue0;if(this.query.sortBydate){compareValuenewDate(a.date)-newDate(b.date);}elseif(this.query.sortByname){compareValueString(a.name).localeCompare(String(b.name));}returnthis.query.sortOrderasc?compareValue:-compareValue;});}}这个高级搜索系统定义了AdvancedSearchQuery和AdvancedSearchEngine类。支持多条件组合搜索和复杂的查询逻辑。与OpenHarmony数据库的集成functionexecuteAdvancedSearchInDatabase(query){cordova.exec(function(result){console.log(高级搜索完成);renderAdvancedSearchResults(result);},function(error){console.error(搜索失败:,error);},DatabasePlugin,advancedSearch,[{conditions:query.conditions,operator:query.operator,sortBy:query.sortBy,sortOrder:query.sortOrder}]);}这段代码展示了如何与OpenHarmony的数据库进行高级搜索。高级搜索页面functionrenderAdvancedSearchPage(){constcontainerdocument.getElementById(page-container);container.innerHTMLdiv classadvanced-search-page h2高级搜索/h2 div classsearch-builder div classconditions-section h3搜索条件/h3 div idconditions-list/div button onclickaddSearchCondition()➕ 添加条件/button /div div classoperator-section label input typeradio nameoperator valueAND checked 所有条件都满足 (AND) /label label input typeradio nameoperator valueOR 任意条件满足 (OR) /label /div div classsort-section label排序方式: select idsort-by option valuerelevance相关性/option option valuedate日期/option option valuename名称/option /select /label label input typeradio namesort-order valuedesc checked 降序 /label label input typeradio namesort-order valueasc 升序 /label /div div classsearch-actions button onclickexecuteAdvancedSearch() 搜索/button button onclickresetAdvancedSearch()重置/button /div /div div idadvanced-search-results/div /div;renderConditionsList();}functionaddSearchCondition(){constconditionsListdocument.getElementById(conditions-list);constconditionIndexconditionsList.children.length;constconditionDivdocument.createElement(div);conditionDiv.classNamecondition-item;conditionDiv.idcondition-${conditionIndex};conditionDiv.innerHTMLselect classcondition-field onchangeupdateConditionOperators(${conditionIndex}) option value选择字段/option option valuename植物名称/option option valuespecies物种/option option valuelocation位置/option option valuehealth健康状态/option option valuedate日期/option option valueamount数量/option /select select classcondition-operator option value/option option value!!/option option value/option option value/option option valuecontains包含/option option valuestartsWith开头是/option option valueendsWith结尾是/option /select input typetext classcondition-value placeholder输入值 button onclickremoveSearchCondition(${conditionIndex})✕/button;conditionsList.appendChild(conditionDiv);}functionremoveSearchCondition(index){constconditionDivdocument.getElementById(condition-${index});if(conditionDiv){conditionDiv.remove();}}functionexecuteAdvancedSearch(){constquerynewAdvancedSearchQuery();// 收集条件constconditionItemsdocument.querySelectorAll(.condition-item);conditionItems.forEach(item{constfielditem.querySelector(.condition-field).value;constoperatoritem.querySelector(.condition-operator).value;constvalueitem.querySelector(.condition-value).value;if(fieldvalue){query.addCondition(field,operator,value);}});// 获取操作符constoperatorRadiosdocument.querySelectorAll(input[nameoperator]);operatorRadios.forEach(radio{if(radio.checked){query.operatorradio.value;}});// 获取排序选项query.sortBydocument.getElementById(sort-by).value;constsortOrderRadiosdocument.querySelectorAll(input[namesort-order]);sortOrderRadios.forEach(radio{if(radio.checked){query.sortOrderradio.value;}});// 执行搜索constsearchEnginenewAdvancedSearchEngine();searchEngine.queryquery;constresultssearchEngine.executeQuery();renderAdvancedSearchResults(results);}functionresetAdvancedSearch(){document.getElementById(conditions-list).innerHTML;document.getElementById(advanced-search-results).innerHTML;renderAdvancedSearchPage();}这个函数创建高级搜索页面允许用户添加多个搜索条件并设置排序选项。搜索结果展示functionrenderAdvancedSearchResults(results){constresultsContainerdocument.getElementById(advanced-search-results);resultsContainer.innerHTMLdiv classresults-header h3搜索结果/h3 p找到${results.length}个结果/p /div;if(results.length0){resultsContainer.innerHTMLp classempty-message未找到匹配的结果/p;return;}constresultsListdocument.createElement(div);resultsList.classNameresults-list;results.forEach(result{constresultItemdocument.createElement(div);resultItem.classNameresult-item;if(result.name){resultItem.innerHTMLh4${result.name}/h4 p${result.species||result.type||}/p p${result.location||result.date||}/p;}else{resultItem.innerHTMLh4${result.plantId}/h4 p类型:${result.type||记录}/p p日期:${newDate(result.date).toLocaleDateString(zh-CN)}/p;}resultsList.appendChild(resultItem);});resultsContainer.appendChild(resultsList);}这个函数负责渲染高级搜索的结果。搜索模板classSearchTemplate{constructor(name,conditions){this.idtemplate_Date.now();this.namename;this.conditionsconditions;}}classSearchTemplateManager{constructor(){this.templates[];this.loadFromStorage();}saveTemplate(name,conditions){consttemplatenewSearchTemplate(name,conditions);this.templates.push(template);this.saveToStorage();returntemplate;}loadTemplate(templateId){returnthis.templates.find(tt.idtemplateId);}deleteTemplate(templateId){this.templatesthis.templates.filter(tt.id!templateId);this.saveToStorage();}}这个SearchTemplateManager类管理搜索模板。用户可以保存常用的搜索条件组合以便快速重复使用。总结高级搜索系统为用户提供了强大的搜索能力。通过支持多条件组合搜索和复杂的查询逻辑我们可以创建一个功能完整的高级搜索系统帮助用户精确找到所需的信息。