cps：新增搜索页

htmldev/cps/src/router/index.js

@@ -166,6 +166,15 @@ const routes = [
         })
       }
     ]
+  },
+  {
+    path: '/search', // 搜索
+    name: 'Search',
+    component: _import('views/search/index'),
+    meta: {
+      isUseCache: false,
+      keepAlive: true
+    }
   }
 ]
 

htmldev/cps/src/views/category/index/child/main.vue

@@ -224,7 +224,7 @@ export default {
 .wrapper {
   position: absolute;
   left: 0;
-  top: 95px;
+  top: 137px;
   right: 0;
   bottom: 0;
   width: 100%;

htmldev/cps/src/views/category/index/index.vue

@@ -1,6 +1,16 @@
 <template>
   <div
     class="category-container">
+    <!--模拟搜索-->
+    <div class="jump-search">
+      <van-search
+        :shape="'round'"
+        v-model="searchValue"
+        placeholder="搜索商品标题 领优惠券拿返现"/>
+      <router-link
+        :to="{name: 'Search'}">去搜索页
+      </router-link>
+    </div>
     <!--商家-->
     <div class="business-list">
       <van-tabs
@@ -66,7 +76,7 @@
 </template>
 
 <script>
-import { Tab, Tabs, DropdownMenu, DropdownItem, Icon, Toast } from 'vant'
+import { Tab, Tabs, DropdownMenu, DropdownItem, Icon, Toast, Search } from 'vant'
 import Main from './child/main'
 import { apiCateList } from './api/api'
 
@@ -78,10 +88,12 @@ export default {
     'van-dropdown-menu': DropdownMenu,
     'van-dropdown-item': DropdownItem,
     'van-icon': Icon,
+    'van-search': Search,
     Main
   },
   data () {
     return {
+      searchValue: '',
       sourceList: [
         {
           name: '京东',
@@ -112,6 +124,7 @@ export default {
   },
   activated () {
     if (!this.$route.meta.isUseCache) {
+      this.searchValue = ''
       this.businessValue = this.sourceList[0].value
       this.catId = ''
       this.numPositionY = 0
@@ -178,6 +191,34 @@ export default {
   width: 100%;
 }
 
+.jump-search {
+  ::v-deep .van-search {
+    padding-bottom: 0;
+
+    input {
+      &::-webkit-input-placeholder {
+        -webkit-text-fill-color: #999;
+        opacity: 1;
+        color: #999;
+      }
+    }
+  }
+
+  position: relative;
+  left: 0;
+  top: 0;
+  overflow: hidden;
+
+  a {
+    position: absolute;
+    left: 12px;
+    top: 10px;
+    right: 12px;
+    bottom: 0;
+    opacity: 0;
+  }
+}
+
 .business-list {
   position: relative;
   left: 0;

htmldev/cps/src/views/search/index.vue

@@ -0,0 +1,13 @@
+<template>
+  <div>111</div>
+</template>
+
+<script>
+export default {
+  name: 'index'
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>