html条件查询,vue，自写多条件查询

多条件查询

关键词模糊查询

类别查询

容器：

size="small"

v-model="page.c_type"

:options="options"

@change="handleChange">

重置

查询

对象数据：pagepage: {

list_page: getQueryVariable('list_page'),

keyword: getQueryString('keyword'),

c_type: getQueryArray('c_type'),

},

拼接对象的key与键 添加到url中 防止刷新之后，筛选条件丢失

let getQueryVariable = (variable) => {

var query = window.location.hash.substring(1);

var vars = query.split("&");

for (var i = 0; i < vars.length; i++) {

var pair = vars[i].split("=");

if (pair[0] == variable) {

return Number(pair[1]);

}

}

return (1);

}

let getQueryString = (variable) => {

var query = window.location.hash.substring(1);

var vars = query.split("&");

for (var i = 0; i < vars.length; i++) {

var pair = vars[i].split("=");

if (pair[0] == variable) {

return decodeURIComponent(pair[1]);

}

}

return ('');

}

let getQueryArray = (variable) => {

var query = window.location.hash.substring(1);

var vars = query.split("&");

for (var i = 0; i < vars.length; i++) {

var pair = vars[i].split("=");

if (pair[0] == variable) {

let arr = pair[1].split(',');

for (let i in arr ){

arr[i] = Number(arr[i])

}

return arr;

}

}

return '';

}

let addUrlPara = (page) => {

var currentUrl = window.location.href.split('#')[0];

let str = ''

Object.keys(page).forEach(key=>{

if (page[key] !== '') {

str+=key+'='+page[key]+'&'

}

})

window.location.href = currentUrl + '#' + str.substr(0,str.length-1)

}

搜索及翻页handleSearch(){

addUrlPara(this.page)

},

currentChange(index) {

this.page.list_page = index

this.fetchList()

addUrlPara(this.page)

console.log()

},

请求fetchList() {

let that = this

that.fileLoading = this.$loading({

lock: true,

text: '列表加载中',

spinner: 'el-icon-loading',

background: 'rgba(255,255,255, 0.8)',

customClass: 'el-loading-box-white',

target: '.menber-center-content-box-fixed',

});

console.log(this.page)

fetch_POST_NOT(JS_API.release, this.page).then(response => {

if (response.data.code === 0) {

that.fileLoading.spinner = 'el-loading-success'

that.fileLoading.text = '列表加载完毕'

that.list = response.data.data.list

that.count = response.data.data.count

for (let i in this.list) {

that.list[i].shwoBackground = that.handleBackWord(that.list[i].file_suffix)

}

} else {

that.fileLoading.spinner = 'el-loading-warn'

that.fileLoading.text = response.data.word

}

setTimeout(() => {

that.fileLoading.close()

}, 1500)

})

}

后端if ($keyword == '') {

$search = [

['user_id', '=', $menberId],

['is_auth', '=', 1],

['type', '>', 2]

];

$count = Db::table('admin_m_menber_upload')

->where($search);

$list = Db::table('admin_m_menber_upload')

->where($search)

->limit(12)

->page($page)

->select();

} else{

$search = [

['user_id', '=', $menberId],

['is_auth', '=', 1],

['type', '>', 2],

['title','like','%'.$keyword.'%']

];

$count = Db::table('admin_m_menber_upload')

->where($search);

$list = Db::table('admin_m_menber_upload')

->where($search)

->whereOr([

['keyword','like','%'.$keyword.'%']

])

->whereOr([

['remarks','like','%'.$keyword.'%']

])

->limit(12)

->page($page)

->select();

}