Commit 211df7f9 by 汪睦雄

修改搜索

parent 752d842a
/**app.wxss**/ /**app.wxss**/
page{
background: #f5f5f5;
}
.container { .container {
height: 100%; height: 100%;
display: flex; display: flex;
......
// components/search-filter/index.js
import api from '../../utils/Api.js'
const app = getApp()
Component({
/**
* 组件的属性列表
*/
properties: {
},
/**
* 组件的初始数据
*/
data: {
},
/**
* 组件的初始数据
*/
ready(){
api.home.banner({token:app.globalData.token}).then(res=>{
console.log(res)
})
},
/**
* 组件的方法列表
*/
methods: {
firstTap: function (){
var myEventDetail = {test:"helloworld"} // detail对象,提供给事件监听函数
var myEventOption = {} // 触发事件的选项
this.triggerEvent('change', myEventDetail, myEventOption)
}
}
})
{
"component": true,
"usingComponents": {
"i-row": "/iview/row/index",
"i-col": "/iview/col/index"
}
}
\ No newline at end of file
<!--components/search-filter/index.wxml-->
<i-row i-class='row-filter'>
<i-col span="6">
<view class="filter-item" bindtap='firstTap'>
<text class='active'>全部项目</text>
<image class="search-icon" src='/images/icon-down-select.png'></image>
</view>
</i-col>
<i-col span="6" i-class="col-class">
<view class="filter-item">
<text>分类</text>
<image class="search-icon" src='/images/icon-down-select.png'></image>
</view>
</i-col>
<i-col span="6" i-class="col-class">
<view class="filter-item">
<text>地域</text>
<image class="search-icon" src='/images/icon-down-select.png'></image>
</view>
</i-col>
<i-col span="6" i-class="col-class">
<view class="filter-item">
<text>标签</text>
<image class="search-icon" src='/images/icon-down-select.png'></image>
</view>
</i-col>
</i-row>
<view>
</view>
\ No newline at end of file
/* components/search-filter/index.wxss */
.row-filter{
padding: 36rpx 0px;
}
.filter-item{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.filter-item > image{
width: 12rpx;
height: 10rpx;
margin-left: 12rpx;
}
.filter-item > text{
color: rgb(51, 51, 51);
font-size: 28rpx;
}
.filter-item > text.active{
color: rgb(43, 163, 215);
}
...@@ -62,5 +62,9 @@ Page({ ...@@ -62,5 +62,9 @@ Page({
*/ */
onShareAppMessage: function () { onShareAppMessage: function () {
},
filterChange: function (event){
console.log(event)
} }
}) })
\ No newline at end of file
{ {
"usingComponents": { "usingComponents": {
"i-row": "/iview/row/index", "search-filter": "/components/search-filter/index"
"i-col": "/iview/col/index"
} }
} }
\ No newline at end of file
<!--pages/search/index.wxml--> <!--pages/search/index.wxml-->
<view class='search-wrapper'> <view class="header">
<view class='search-wrapper'>
<image class="search-icon" src='/images/icon_search.png'></image> <image class="search-icon" src='/images/icon_search.png'></image>
<input class='search-input' placeholder='关键词如地名、游泳等'></input> <view class='search-input'>关键词如地名、游泳等</view>
</view>
<i-row i-class='row-filter'>
<i-col span="6">
<view class="filter-item">
<text class='active'>全部项目</text>
<image class="search-icon" src='/images/icon-down-select.png'></image>
</view>
</i-col>
<i-col span="6" i-class="col-class">
<view class="filter-item">
<text>分类</text>
<image class="search-icon" src='/images/icon-down-select.png'></image>
</view>
</i-col>
<i-col span="6" i-class="col-class">
<view class="filter-item">
<text>地域</text>
<image class="search-icon" src='/images/icon-down-select.png'></image>
</view> </view>
</i-col> <search-filter bind:change="filterChange" />
<i-col span="6" i-class="col-class"> </view>
<view class="filter-item"> \ No newline at end of file
<text>标签</text>
<image class="search-icon" src='/images/icon-down-select.png'></image>
</view>
</i-col>
</i-row>
\ No newline at end of file
/* pages/search/index.wxss */ /* pages/search/index.wxss */
.header{
background: white;
}
.search-wrapper{ .search-wrapper{
display: flex; display: flex;
justify-content: flex-start; justify-content: flex-start;
...@@ -16,30 +19,9 @@ ...@@ -16,30 +19,9 @@
} }
.search-input{ .search-input{
font-size: 26rpx; font-size: 26rpx;
color: black; color: rgb(153, 153, 153);
padding-left: 10rpx; padding-left: 10rpx;
} }
.search-input:-moz-placeholder, .search-input:-ms-input-placeholder, .search-input::-webkit-input-placeholder{ .search-input:-moz-placeholder, .search-input:-ms-input-placeholder, .search-input::-webkit-input-placeholder{
color: rgb(153, 153, 153); color: rgb(153, 153, 153);
} }
.row-filter{
padding: 36rpx 0px;
}
.filter-item{
width: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.filter-item > image{
width: 12rpx;
height: 10rpx;
margin-left: 12rpx;
}
.filter-item > text{
color: rgb(51, 51, 51);
font-size: 28rpx;
}
.filter-item > text.active{
color: rgb(43, 163, 215);
}
\ No newline at end of file
...@@ -37,7 +37,7 @@ ...@@ -37,7 +37,7 @@
"list": [] "list": []
}, },
"miniprogram": { "miniprogram": {
"current": 0, "current": 3,
"list": [ "list": [
{ {
"id": 0, "id": 0,
...@@ -56,6 +56,11 @@ ...@@ -56,6 +56,11 @@
"name": "下单", "name": "下单",
"pathName": "pages/me/order/index", "pathName": "pages/me/order/index",
"query": "" "query": ""
},
{
"id": -1,
"name": "搜索",
"pathName": "pages/search/index"
} }
] ]
} }
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment