131 lines
2.1 KiB
Vue
131 lines
2.1 KiB
Vue
|
|
<template>
|
|||
|
|
|
|||
|
|
<view class="content">
|
|||
|
|
|
|||
|
|
<!-- <view style="margin-top: 16px;"> -->
|
|||
|
|
|
|||
|
|
<!-- keyStr: 设置存储key hisClick: 设置历史事件 searchClick:设置搜索事件 -->
|
|||
|
|
|
|||
|
|
<cc-SearchBarHisView keyStr="productHisArr" searchPlaceHolder="请输入搜索内容" @hisClick="selHisClick"
|
|||
|
|
@searchClick="goSearchClick"></cc-SearchBarHisView>
|
|||
|
|
|
|||
|
|
<!-- </view> -->
|
|||
|
|
<uni-list v-for="item in resultList" :key="item">
|
|||
|
|
<uni-list-item v-if="item.icon.includes('icon')" :show-extra-icon="true"
|
|||
|
|
:extraIcon="{customPrefix:'iconfont',type:item.icon,color:item.color}"
|
|||
|
|
:title="item.style.navigationBarTitleText" link :to="item.path">
|
|||
|
|
</uni-list-item>
|
|||
|
|
<uni-list-item v-else :show-extra-icon="true" :extraIcon="{type:item.icon,color:item.color}"
|
|||
|
|
:title="item.style.navigationBarTitleText" link :to="item.path">
|
|||
|
|
</uni-list-item>
|
|||
|
|
</uni-list>
|
|||
|
|
</view>
|
|||
|
|
|
|||
|
|
</template>
|
|||
|
|
|
|||
|
|
<script>
|
|||
|
|
// import CCSearchHisView from '@/components/CCSearchHisView.vue';
|
|||
|
|
import data from './data.json'
|
|||
|
|
export default {
|
|||
|
|
|
|||
|
|
components: {
|
|||
|
|
|
|||
|
|
// CCSearchHisView
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
data() {
|
|||
|
|
|
|||
|
|
return {
|
|||
|
|
resultList: [],
|
|||
|
|
dataList: data,
|
|||
|
|
focus: false
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
onLoad() {
|
|||
|
|
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
methods: {
|
|||
|
|
searchByItem(item) {
|
|||
|
|
this.resultList = [];
|
|||
|
|
this.dataList.forEach(res => {
|
|||
|
|
if (res.style.navigationBarTitleText.includes(item)) {
|
|||
|
|
this.resultList.push(res);
|
|||
|
|
}
|
|||
|
|
})
|
|||
|
|
console.log(this.resultList);
|
|||
|
|
},
|
|||
|
|
selHisClick(item) {
|
|||
|
|
console.log('选择的值 = ' + item);
|
|||
|
|
this.searchByItem(item)
|
|||
|
|
},
|
|||
|
|
goSearchClick(item) {
|
|||
|
|
console.log(item);
|
|||
|
|
this.searchByItem(item)
|
|||
|
|
},
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
|
|||
|
|
<style scoped>
|
|||
|
|
view {
|
|||
|
|
font-size: 15px;
|
|||
|
|
/* line-height: inherit; */
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
page {
|
|||
|
|
|
|||
|
|
background-color: '#F6F7FA' !important;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.content {
|
|||
|
|
|
|||
|
|
display: flex;
|
|||
|
|
|
|||
|
|
flex-direction: column;
|
|||
|
|
|
|||
|
|
background-color: #F6F7FA;
|
|||
|
|
|
|||
|
|
height: 100vh;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.logo {
|
|||
|
|
|
|||
|
|
height: 200rpx;
|
|||
|
|
|
|||
|
|
width: 200rpx;
|
|||
|
|
|
|||
|
|
margin-top: 200rpx;
|
|||
|
|
|
|||
|
|
margin-left: auto;
|
|||
|
|
|
|||
|
|
margin-right: auto;
|
|||
|
|
|
|||
|
|
margin-bottom: 50rpx;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.text-area {
|
|||
|
|
|
|||
|
|
display: flex;
|
|||
|
|
|
|||
|
|
justify-content: center;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.title {
|
|||
|
|
|
|||
|
|
font-size: 36rpx;
|
|||
|
|
|
|||
|
|
color: #8f8f94;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
</style>
|