search-line.vue
1.74 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
<template>
<Page name="search">
<template #header>
<search-bar v-model="searchForm.query" placeholder="请输入搜索关键词" auto @confirm="onSearch" />
</template>
<template #content>
<List ref="list" v-model="list" :api="searchAPI" :addOption='addOption'>
<template v-for="(item, index) in list">
<zui-cell :key="index" @click="onSelect(item, index)">
<template #title>{{ item[label] }}</template>
<template #right>{{ item.code }}</template>
</zui-cell>
</template>
</List>
</template>
</Page>
</template>
<script>
export default {
data() {
return {
searchForm: {
query: ''
},
list: [],
label: 'name',
}
},
onLoad(option) {
if (option.label) this.label = option.label;
if (option.mode === 'select') {
uni.setNavigationBarTitle({ title: '选择线路' });
}
},
methods: {
searchAPI(params) {
return uni.$u.api.filter.lineSelect({ ...params, ...this.searchForm });
},
addOption(list){
let obj = {
code: '',
name: '不限',
};
let hash = {};
let options = [obj, ...list].reduce((result, item) => {
let hashKey = `${item.code}` || '_empty';
if (!hash[hashKey]) {
hash[hashKey] = true;
if (item.name) {
result.push(item);
}
}
return result; // 返回结果数组
}, []);
this.$emit('input', options);
},
onSelect(item) {
const $params = this.$params;
if ($params.mode === 'select') {
uni.$emit('select-line', item.name == '不限' && !item.code ? { code: '', name: '' } : item);
uni.navigateBack();
}
}
}
}
</script>