search

@@ -27,10 +27,13 @@ Component({
    * 组件的初始数据
    */
   data: {
-
+    hidden:true,
   },
   attached(){
     this.params={}
+    this.setData({
+      hidden:!this.data.hasPage
+    })
   },
   /**
    * 组件的方法列表
@@ -54,5 +57,15 @@ Component({
         paramObj:paramObj,
       })
     },
+    show(){
+      this.setData({
+        hidden:false
+      })
+    },
+    hide(){
+      this.setData({
+        hidden:true
+      })
+    },
   }
 })

 <!--components/reserve/search/how/index.wxml-->
-<view class="mask" wx:if="{{!hasPage}}"></view>
-<view class="{{hasPage?'pages':'pages-window'}}">
-    <view class="title flex-lr">
-        <view class="title-name">您好，几位，什么时候</view>
-        <view class="close"></view>
-    </view>
-    <view>
-        <pnum bindevent="paramEvent" pi="{{pnum_pi}}"></pnum>
-        <view style="margin: 60rpx 0">
-            <date bindevent="paramEvent" pi="{{pnum_pi}}"></date>
+<view hidden="{{hidden}}">
+    <view class="mask" wx:if="{{!hasPage}}" bindtap="hide"></view>
+    <view class="{{hasPage?'pages':'pages-window'}}">
+        <view class="title flex-lr">
+            <view class="title-name">您好，几位，什么时候</view>
+            <view class="close" bindtap="hide"></view>
+        </view>
+        <view>
+            <pnum bindevent="paramEvent" pi="{{pnum_pi}}"></pnum>
+            <view style="margin: 60rpx 0">
+                <date bindevent="paramEvent" pi="{{pnum_pi}}"></date>
+            </view>
+            <dur bindevent="paramEvent" pi="{{dur_pi}}"></dur>
         </view>
-        <dur bindevent="paramEvent" pi="{{dur_pi}}"></dur>
+        <view class="submit" bindtap="submit">查找餐厅</view>
     </view>
 </view>
-<view class="submit" bindtap="submit">查找餐厅</view>
-

@@ -6,6 +6,13 @@
 .pages-window{
     padding: 58rpx 0;
     border-radius:20rpx 20rpx 0 0;
+    position: fixed;
+    bottom: 0;
+    background-color: #fff;
+    width: 100%;
+    z-index: 9999;
+    height: 870rpx;
+    box-sizing: border-box;
 }
 .pages .close{
     display: none;

@@ -240,5 +240,8 @@ Page({
     //   }
     // })
     return sellers;
+  },
+  dispalySearchHow(){
+    this.selectComponent('#search-how').show();
   }
 })
\ No newline at end of file

@@ -8,6 +8,7 @@
     "getpos":"/components/userinfo/getpos",
     "sb-tr":"/components/reserve/seller-box-transverse/seller-box",
     "caixi":"/components/reserve/caixi",
+    "search-how":"/components/reserve/search/how/index",
     "hr":"/components/hr"
   }
 }
\ No newline at end of file

 <!--pages/reserve/indexList.wxml-->
 <nav>周到安排</nav>
 <view class="header">
-    <view class="transverse-search flex-ll {{hasDisabled?'disabled':''}}">
+    <view class="searchAddrView" bindtap="dispalySearchHow">
+        <view class="searchAddr flex-ll">
+            <image class="icon" src="http://qn.colorcun.com/reserve/images/find-black.png"></image>
+            <input style="width: 100%;" placeholder="您好，几位，什么时候"
+                   type="text"
+                   value="{{keyword}}"/>
+        </view>
+    </view>
+    <view class="transverse-search flex-lr {{hasDisabled?'disabled':''}}">
         <view
                 bindtap="caixiShow"
                 class="tags {{multiIndex[0]>0?'active':''}}"
         >
-            <view class="picker flex-lr">
+            <view class="picker flex-cc">
                 <view class="input">
                     <block wx:if="{{multiIndex[0]==0}}">菜系</block>
                     <block wx:else="">{{multiArray[0][multiIndex[0]]}}</block>
@@ -52,4 +60,5 @@
 </view>
 <caixi multiArray="{{multiArray}}" multiIndex="{{multiIndex}}"
        bindactive="caixiActive" id="caixi"
-></caixi>
\ No newline at end of file
+></caixi>
+<search-how id="search-how"></search-how>

@@ -13,32 +13,38 @@
   width: 100%;
   margin: 0 auto;
   font-size: 24rpx;
-  padding-left: 20rpx;
 }
 .transverse-search .tags{
-  height: 50rpx;
-  line-height: 50rpx;
-  background-color: #F0F0F9;
-  border-radius: 4rpx;
-  margin-right: 30rpx;
-  padding: 0 16rpx;
+  height: 30rpx;
+  line-height: 30rpx;
+  /*background-color: #F0F0F9;*/
+  /*border-radius: 4rpx;*/
+  padding: 0 22rpx;
+  border-right:2rpx solid #E0E0E0;
+  text-align: center;
+  width: 25%;
+  box-sizing: border-box;
+}
+.transverse-search .tags:first-child{
+  padding-left: 0;
 }
 .transverse-search .tags:last-child{
   margin-right: 0;
+  border-right-width:0;
 }
 .transverse-search .tags.active{
-  background-color: #F4DAB9;
-  color:#8B5318;
+  /*background-color: #F4DAB9;*/
+  color:#C0A369;
   font-weight: 900;
 }
 
 .picker{
-  height: 50rpx;
-  line-height: 50rpx;
+  height: 30rpx;
+  line-height: 30rpx;
 }
 .picker .input{
-  height: 50rpx;
-  line-height: 50rpx;
+  height: 30rpx;
+  line-height: 30rpx;
   margin-right: 10rpx;
 }
 .picker .more{
@@ -58,7 +64,7 @@
 }
 .pages{
   width: 100%;
-  margin: 81rpx auto 0;
+  margin: 151rpx auto 0;
   color:#fff;
   font-size: 28rpx;
 }
@@ -96,4 +102,28 @@
 }
 .empty view.empry-info2{
   margin-top: 20rpx;
+}
+
+.searchAddrView{
+  width: 100%;
+  height: 70rpx;
+  background-color: #ffffff;
+  z-index: 9;
+}
+.searchAddr {
+  width: 90%;
+  height: 60rpx;
+  background-color: #F5F5F5;
+  border-radius: 30rpx;
+  line-height: 60rpx;
+  color:#999999;
+  line-height: 60rpx;
+  font-size: 28rpx;
+  margin:0 auto;
+}
+.searchAddr .icon{
+  min-width: 32rpx;
+  width:32rpx;
+  height: 30rpx;
+  margin: 0 20rpx;
 }
\ No newline at end of file