cxw-010203

app.json

@@ -10,9 +10,9 @@
   ],
   "window": {
     "backgroundTextStyle": "light",
-    "navigationBarBackgroundColor": "#fff",
-    "navigationBarTitleText": "首页",
-    "navigationBarTextStyle": "black"
+    "navigationBarBackgroundColor": "#006BFF",
+    "navigationBarTitleText": "硕为思汽车智能洞查",
+    "navigationBarTextStyle": "white"
   },
   "tabBar": {
     "custom": true,
@@ -54,7 +54,17 @@
     "van-button": "@vant/weapp/button/index",
     "van-tabbar": "@vant/weapp/tabbar/index",
     "van-tabbar-item": "@vant/weapp/tabbar-item/index",
-    "tabbar": "/custom-tab-bar/index"
+    "tabbar": "/custom-tab-bar/index",
+    "van-search": "@vant/weapp/search/index",
+    "van-index-bar": "@vant/weapp/index-bar/index",
+    "van-index-anchor": "@vant/weapp/index-anchor/index",
+    "van-icon": "@vant/weapp/icon/index",
+    "van-cell": "@vant/weapp/cell/index",
+    "van-cell-group": "@vant/weapp/cell-group/index",
+    "van-tab": "@vant/weapp/tab/index",
+    "van-tabs": "@vant/weapp/tabs/index"
+  
+    
   }
   
 }

app.wxss

@@ -1,10 +1,5 @@
 /**app.wxss**/
 .container {
   height: 100%;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: space-between;
-  padding: 200rpx 0;
-  box-sizing: border-box;
+  width: 100%;
 } 

pages/brandSearch/index.js

@@ -2,6 +2,8 @@
 
 Page({
     data: {
+        value: "",
+        active: 0
     },
     onShow() {
         this.getTabBar().init();

pages/brandSearch/index.json

@@ -1,5 +1,5 @@
 {
     "usingComponents": {
-        
+
     }
 }

pages/brandSearch/index.wxml

@@ -1,3 +1,28 @@
 <view class="container">
-  <text>品牌搜索</text>
+    <view class="bs-top">
+      <van-icon size="26px" color="#fff" name="arrow-left" style="background: #006BFF"/>
+      <van-search style="width: 100%;" shape="round" background="#006BFF" value="{{ value }}" placeholder="请输入品牌" />
+    </view>
+    <van-tabs active="{{ active }}">
+      <van-tab title="标签 1">内容 1</van-tab>
+      <van-tab title="标签 2">内容 2</van-tab>
+      <van-tab title="标签 3">内容 3</van-tab>
+      <van-tab title="标签 4">内容 4</van-tab>
+      <van-tab title="标签 5">内容 5</van-tab>
+      <van-tab title="标签 6">内容 6</van-tab>
+    </van-tabs>
+    <van-index-bar>
+      <view>
+        <van-index-anchor index="A" />
+        <van-cell title="文本" />
+        <van-cell title="文本" />
+        <van-cell title="文本" />
+      </view>
+      <view>
+        <van-index-anchor index="B" />
+        <van-cell title="文本" />
+        <van-cell title="文本" />
+        <van-cell title="文本" />
+      </view>
+    </van-index-bar>
 </view>

pages/brandSearch/index.wxss

@@ -1,4 +1,12 @@
 .container {
     width: 100%;
-    height: 330px;
 }
+.bs-top {
+    display: flex;
+    justify-content: flex-start;
+    height: 67px;
+    align-items: center;
+    background: #006BFF;
+    padding-left: 13rpx;
+    padding-right: 13rpx;
+  }

pages/index/index.js

@@ -68,7 +68,6 @@ Page({
   currentTab: 0,
   navScrollLeft: 0
    
-
   },
   switchNav(event){
     // 获取当前tab 的id
@@ -89,7 +88,6 @@ Page({
         })
     }
 },
-
 switchTab(event){
     var cur = event.detail.current;
     var singleNavWidth = this.data.windowWidth / 5;

pages/index/index.json

@@ -1,8 +1,4 @@
 {
   "usingComponents": {
-  },
-  "backgroundTextStyle": "light",
-  "navigationBarBackgroundColor": "#006BFF",
-  "navigationBarTitleText": "硕为思汽车智能洞查",
-  "navigationBarTextStyle": "white"
+  }
 }