feature: 添加搜索界面

remeio · Apr 2, 2021 · 0006c5e · 0006c5e
1 parent 17570ac
commit 0006c5e
Show file tree

Hide file tree

Showing 7 changed files with 66 additions and 9 deletions.
diff --git a/app.json b/app.json
@@ -47,6 +47,9 @@
     "van-tabs": "@vant/weapp/tabs/index",
     "van-empty": "@vant/weapp/empty/index",
     "van-card": "@vant/weapp/card/index",
-    "van-count-down": "@vant/weapp/count-down/index"
+    "van-count-down": "@vant/weapp/count-down/index",
+    "van-search": "@vant/weapp/search/index",
+    "van-notice-bar": "@vant/weapp/notice-bar/index",
+    "van-sticky": "@vant/weapp/sticky/index"
   }
 }
diff --git a/components/home/home.js b/components/home/home.js
@@ -75,6 +75,11 @@ Component({
         }
       })
     },
+    toSearch() {
+      wx.navigateTo({
+        url: '/pages/search/search',
+      })
+    },
     toFeedback() {
       wx.navigateTo({
         url: '/pages/feedback/feedback',

diff --git a/components/home/home.json b/components/home/home.json
@@ -1,8 +1,6 @@
 {
   "component": true,
   "usingComponents": {
-    "van-search": "@vant/weapp/search/index",
-    "van-notice-bar": "@vant/weapp/notice-bar/index",
     "banner": "/components/banner/banner",
     "book-grid": "/components/book_grid/book_grid",
     "ranking-list": "/components/ranking_list/ranking_list"

diff --git a/components/home/home.wxml b/components/home/home.wxml
@@ -1,9 +1,9 @@
 <van-row>
   <van-col span="24">
     <!-- 搜索框 -->
-    <van-search value="{{ value }}" placeholder="请输入搜索关键词" use-action-slot uq-right-icon-slot shape="round">
+    <van-search value="{{ value }}" placeholder="输入书名、ISBN" disabled bind:tap="toSearch" use-action-slot uq-right-icon-slot shape="round">
       <view slot="action" class="view-center">
-        <van-icon name="/resources/images/home/scan.png" size="24px" bind:tap="uploadByScanCode" />
+        <van-icon name="/resources/images/home/scan.png" size="24px" catchtap="uploadByScanCode" />
       </view>
     </van-search>
     <banner></banner>

diff --git a/pages/search/search.js b/pages/search/search.js
@@ -1,11 +1,40 @@
 // pages/search/search.js
+var globalData = getApp().globalData;
 Page({
 
   /**
    * 页面的初始数据
    */
   data: {
-
+    bookList: null,
+    keyword: ''
+  },
+  onChange(e) {
+    this.setData({
+      keyword: e.detail,
+    });
+  },
+  getSearchBookList() {
+    let me = this
+    wx.request({
+      url: globalData.serverUrl + '/book/getSearchBookList',
+      data: {keyword: me.data.keyword},
+      header: {
+        "Content-Type": "application/json",
+        'authorization': globalData.token
+      },
+      method: 'POST',
+      success: function (res) {
+        let dts = res.data
+        if (!dts.success) {
+          return;
+        }
+        let bookList = dts.bookDTOList
+        me.setData({
+          bookList: bookList
+        })
+      }
+    })
   },
 
   /**

diff --git a/pages/search/search.json b/pages/search/search.json
@@ -1,3 +1,6 @@
 {
-  "usingComponents": {}
+  "navigationBarTitleText": "搜索书籍",
+  "usingComponents": {
+    "book-grid": "/components/book_grid/book_grid"
+  }
 }
diff --git a/pages/search/search.wxml b/pages/search/search.wxml
@@ -1,2 +1,21 @@
-<!--pages/search/search.wxml-->
-<text>pages/search/search.wxml</text>
+<view class="page">
+  <van-row>
+    <van-col span="24">
+      <van-sticky>
+        <van-search value="{{ keyword }}" bind:change="onChange" focus="{{ true }}" bind:search="getSearchBookList"
+          placeholder="请输入书名或ISBN，或免押金" shape="round">
+        </van-search>
+      </van-sticky>
+      <view style="margin-top: 12px"></view>
+      <van-empty image="search" description="没有搜索到相关内容~" wx:if="{{bookList.length == 0}}" />
+      <van-row>
+        <book-grid bookList="{{ bookList }}"></book-grid>
+      </van-row>
+      <van-row style="margin: 12px" wx:if="{{ bookList.length > 0 }}">
+        <van-col span="8" offset="8">
+          <van-divider contentPosition="center" dashed>到底了~</van-divider>
+        </van-col>
+      </van-row>
+    </van-col>
+  </van-row>
+</view>