js 搜索记录

背景：

移动端的搜索记录，不可能通过调取接口来记录瑟，所以通过在某某.js一个文件定义和处理逻辑。

代码：

//某某.js
var yumingSearch = {init: function () {initF7.GloblalF7.onPageInit("yumingSearch", function (data) {yumingSearch.bindDomEvent();});/*** 我的页面返回按钮时执行*/initF7.GloblalF7.onPageAfterBack("yumingSearch", function (page) {MAPutils.GlobalMap.updateSize();layui.layer.closeAll();});},bindDomEvent: function () {let searchValue = GlobalUtils.debounce(yumingSearch.searchValue, 400)$(".yuming-search-input").on("input propertychange", function (e) {searchValue($(this).val())})$(".yuming-search-quxiao").on("click", function () {$(".yuming-search-list").empty()$(".yuming-search-input").val("")})if (Config.isMobile) {this.setSearchSql(this.getSql)}$(".sousuo-shanchu").on("clcik", function () {yumingSearch.setSearchSql(yumingSearch.delSql)})},listPageV2: null,searchValue: function (val) {if (!val) {return}if (yumingSearch.listPageV2) {yumingSearch.listPageV2.abort();}yumingSearch.listPageV2 = $.ajax({url: Config.API_SERVER_URL + "/enav/appTemplabel/listPageV2",type: "POST",data: {param: JSON.stringify({page: 1,limit: 50,names: val,dataType: 1,username: Config.userInfo.name})}}).always(function (res) {if (res.data && res.data.length > 0) {let content = ""$.each(res.data, function (i, item) {content += `<div class="yuming-search-item" data-obj='${JSON.stringify(item)}'>${item.names}</div>`})$(".yuming-search-list").html(content);$(".yuming-search-item").on("click", function () {let obj = $(this).attr("data-obj");if (obj) {MapInit.backMap();let o = JSON.parse(obj)MAPutils.createYmQuyu(o)yumingSearch.setSearchSql(yumingSearch.saveSql, obj)}})} else {// layui.layer.msg("暂无相关数据")$(".yuming-search-list").html('<div class="yuming-search-item">暂无相关数据</div>')}})},setSearchSql: function (callback, obj) {var db = window.sqlitePlugin.openDatabase({name: Config.databasename,location: 'default',})db.transaction(function (tx) {tx.executeSql("CREATE TABLE IF NOT EXISTS ymSearch (guid text,jsonobj text,createdTime TimeStamp DEFAULT (datetime('now','localtime')))")callback(tx, obj)})},saveSql: function (tx, obj) {tx.executeSql("SELECT * FROM ymSearch WHERE guid = ?", [obj.guid], function (tx, res) {if (res.rows.length > 0) {tx.executeSql("UPDATE ymSearch set jsonobj = ? WHERE guid = ?", [JSON.stringify(obj), obj.guid], function (tx, res) {//                                layui.layer.msg('修改成功！');}, function (e) {//                                layui.layer.msg('修改失败，插入数据！');})} else {tx.executeSql("INSERT INTO ymSearch (guid,jsonobj) VALUES (?,?)", [obj.guid, JSON.stringify(obj)], function (tx, res) {//                                                       layui.layer.msg('插入成功！');console.log('插入成功！');}, function (e) {console.log("插入失败了呀");})}})},delSql: function (tx) {tx.executeSql("DELETE FROM ymSearch", [], function (tx, res) {if (res.rowsAffected > 0) {// layui.layer.msg('清除成功！')$('.yuming-jilu-box').empty()}}, function (e) {layui.layer.msg('清除失败！')})},getSql: function (tx) {tx.executeSql("SELECT * FROM ymSearch DESC LIMIT 10", [], function (tx, res) {if (res.rows.length > 0) {let content = "";for (var i = 0; i < res.rows.length; i++) {let obj = JSON.parse(JSON.parse(res.rows.item(i).jsonobj));content += `<div class="yuming-jilu-item" data-obj='${JSON.stringify(obj)}'>${obj.names}</div>`}$('.yuming-jilu-box').html(content);$(".yuming-jilu-item").on("click", function () {let obj = $(this).attr("data-obj");if (obj) {MapInit.backMap();let o = JSON.parse(obj)MAPutils.createYmQuyu(o)}})}})}
}
yumingSearch.init();

核心方法：

外部通过调用这个方法，并传callback()

实际代码：

外部使用，如下：

var mainSearchLog = {init: function () {initF7.GloblalF7.onPageInit("mainSearchLog", function (data) {mainSearchLog.bindDomEvent();});/*** 返回按钮时执行*/initF7.GloblalF7.onPageAfterBack("mainSearchLog", function (page) {MAPutils.GlobalMap.updateSize();});},bindDomEvent: function () {if (Config.isMobile) {yumingSearch.setSearchSql(mainSearchLog.getYumingSearchSql)}},/*** 判断手机端* 查询yumingSearch sql表*/getYumingSearchSql: function (tx) {tx.executeSql("SELECT * FROM ymSearch DESC LIMIT 50", [], function (tx, res) {if (res.rows.length > 0) {let content = "";for (var i = 0; i < res.rows.length; i++) {let obj = JSON.parse(JSON.parse(res.rows.item(i).jsonobj));content += `<div class="search-log-box" data-obj='${JSON.stringify(obj)}'>${obj.names}</div>`}$('.yuming .searchLogBox').html(content);$(".search-log-box").on("click", function () {let obj = $(this).attr("data-obj");if (obj) {MapInit.backMap();let o = JSON.parse(obj)MAPutils.createYmQuyu(o)}})}})},
}
mainSearchLog.init()

核心调用：