Initial Commit

pages/index_search/index_search.js

@@ -0,0 +1,69 @@
+// pages/index/index_search/index_search.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    hot:['国产粮油','国产粮油国产粮油','国产粮油','国产粮油','国产粮油','国产粮国产粮油油','国产粮油','国产粮油',],
+    inputShowed:true
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function (options) {
+    
+  },
+
+  //搜索
+  search(){
+    // wx.navigateTo({
+    //   url: '/pages/search_details/search_details',
+    // })
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function () {
+    this.setData({
+      inputShowed:true
+    })
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function () {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function () {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function () {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function () {
+
+  },
+})

pages/index_search/index_search.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {},
+  "navigationBarTitleText": "搜索"
+}

pages/index_search/index_search.wxml

@@ -0,0 +1,15 @@
+<!--pages/index/index_search/index_search.wxml-->
+<view class="top_fi">
+	<view class="top">
+		<view class="search">
+			<image src="/icon/search.png"></image>
+			<input placeholder="搜索商品" focus='{{inputShowed}}' bindinput="search_input" placeholder-style="color:#aaa;"></input>
+      <image src="/icon/delete.png"></image>
+		</view>
+		<view catchtap='search' class="sear">搜索</view>
+	</view>
+  <view class="hot">热门推荐</view>
+  <view class="hot-all">
+    <view class="hot-cont" wx:for='{{hot}}' wx:key="index">{{item}}</view>
+  </view>
+</view>

pages/index_search/index_search.wxss

@@ -0,0 +1,73 @@
+/* pages/index/index_search/index_search.wxss */
+page{
+  background-color: #f5f5f5;
+}
+.top {
+  height: 100rpx;
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 0 30rpx;
+}
+
+.top_fi {
+  width: 100%;
+  background: #fff;
+}
+
+.search {
+  font-size: 24rpx;
+  flex: 1;
+  display: flex;
+  align-items: center;
+  height: 60rpx;
+  background-color: #f5f5f5;
+  border-radius: 40rpx;
+  padding-left: 39rpx;
+}
+
+.search image:first-child{
+  width: 32rpx;
+  height: 32rpx;
+  margin-right: 20rpx;
+}
+.search image:last-child{
+  width: 32rpx;
+  height: 32rpx;
+}
+.search input {
+  width: 470rpx;
+}
+
+.sear {
+  font-size: 24rpx;
+  color: #999;
+  padding-left: 30rpx;
+}
+
+.hot{
+  padding: 0 30rpx;
+  font-size: 32rpx;
+  color: #333333;
+  margin-top: 20rpx;
+}
+.hot-all{
+  padding: 0 30rpx;
+  margin-top: 40rpx;
+}
+.hot-all::after{
+  display: block;
+  content: '';
+  clear: both;
+}
+.hot-cont{
+  float: left;
+	height: 40rpx;
+	line-height: 40rpx;
+	background-color: #f3f4f8;
+  border-radius: 4rpx;
+  font-size: 24rpx;
+  color: #666666;
+  padding: 0 14rpx;
+  margin:0 24rpx 30rpx 0;
+}