搜索页面和主页页面

app.json

@@ -5,7 +5,12 @@
     "pages/success/paySuccess",
     "pages/business/business",
     "pages/search/search",
-    "pages/newUser/newUser"
+    "pages/newUser/newUser",
+    "pages/mine/mine",
+    "pages/select-history/select-history",
+    "pages/select-nothing/select-nothing",
+    "pages/select-shopping/select-shopping",
+    "pages/zhuye/zhuye"
   ],
   "window": {
     "backgroundTextStyle": "light",
@@ -13,6 +18,23 @@
     "navigationBarTitleText": "Weixin",
     "navigationBarTextStyle": "black"
   },
+  "tabBar": {
+    "selectedColor": "#ea9518",
+    "list": [
+      {
+        "pagePath": "pages/zhuye/zhuye",
+        "text": "首页",
+        "iconPath": "./pages/image/home.png",
+        "selectedIconPath": "./pages/image/home-active.png"
+      },
+      {
+        "pagePath": "pages/mine/mine",
+        "text": "我的",
+        "iconPath": "./pages/image/wode.png",
+        "selectedIconPath": "./pages/image/wode-active.png"
+      }
+    ]
+  },
   "sitemapLocation": "sitemap.json",
   "usingComponents": {
     "van-button": "@vant/weapp/button/index",

pages/mine/mine.js

@@ -0,0 +1,66 @@
+// pages/mine/mine.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/mine/mine.json

@@ -0,0 +1,3 @@
+{
+"navigationBarTitleText":"我的"
+}

pages/mine/mine.wxml

@@ -0,0 +1,46 @@
+<!-- 头部  -->
+<view class="head">
+  <image src="../image/touxiang.png" class="touxiang"></image>
+  <view class="headtext1">
+    <text>江湖姐妹花</text>
+    <view class="student">学生认证</view>
+  </view>
+    <view class="headtext2">
+    <text>132******2159</text>
+</view>
+<view class="headtext3">
+<van-icon name="points" />
+520
+</view>
+</view>
+<!-- 中间部分 -->
+<view class="medium">
+<view class="bank">民生银行社保卡</view>
+<view class="number">6250**** **** 0299</view>
+<view class="card">我是一个三代社保卡使用者</view>
+</view>
+<!-- 底部部分 -->
+<view class="bottom-text">
+ <text class="dingdan">我的订单</text>
+ <text class="fuhao">></text>
+</view>
+ 
+ <view class="bottom">
+ <view class="first">
+ <image src="../image/未支付.png" class="need-work"></image>
+
+ <view class="first-text">待支付</view>
+</view>
+
+ <view class="second">
+ <image src="../image/songhuo.png" class="icon-car"></image>
+ <view class="second-text" >待送达</view>
+</view>
+
+<view class="third">
+ <image src="../image/已支付.png" class="icon-completed"></image>
+ <view class="third-text">已支付</view>
+</view>
+</view>
+
+ 

pages/mine/mine.wxss

@@ -0,0 +1,125 @@
+
+.touxiang{
+  width: 50px;
+  height: 50px;
+  margin-left: 25px;
+  position: absolute;
+}
+.head{
+  width: 100%;
+  height: 90px;
+  margin-top: 15px;
+  position: relative;
+}
+.headtext1{
+  float: right;
+  font-size: 14px;
+  margin-right: 90px;
+}
+.student{
+  width: 50px;
+  font-size: 11px;
+  margin-left: 10px;
+  border: 1px solid white;
+  border-radius: 15%;
+  background-color: turquoise;
+  text-align: center;
+  float: right;
+}
+
+.headtext2{
+  font-size: 11px;
+  float: left;
+ margin-top: 6px;
+  margin-left: 100px;
+}
+.headtext3{
+  float: right;
+  width: 200px;
+  height: 15px;
+  font-size: 12px;
+  color:orange;
+  margin-top: 6px;
+  margin-right: 18px;
+}
+/* 中部 */
+.medium{
+  width: 90%;
+  height: 100px;
+  border: 1px solid white;
+  border-radius: 8%;
+  background: linear-gradient(#FF6347,red);
+  margin-left: 15px;
+  position: relative;
+  border-bottom-left-radius:55px;
+  border-bottom-right-radius:55px;
+}
+.number{
+  float: right;
+  font-size: 12px;
+  color: white;
+  padding-top: 8px;
+  padding-right: 10px;
+}
+.bank{
+  float: left;
+  color: white;
+  font-size: 14px;
+  font-weight: 200px;
+  padding-top: 8px;
+  padding-left: 10px;
+}
+.card{
+  float: left;
+  font-size: 11px;
+  color: white;
+  position: absolute;
+  margin-top: 32px;
+  margin-left: 10px;
+}
+/* 底部 */
+.bottom-text{
+  margin-top: 13px;
+}
+.dingdan{
+  margin-left: 20px;
+}
+.fuhao{
+  display: inline-block;
+  float: right;
+  margin-right: 15px;
+}
+.need-work{
+  width: 55px;
+  height: 55px;
+}
+.icon-car{
+  width: 54px;
+  height: 63px;
+}
+.icon-completed{
+  width: 50px;
+  height: 45px;
+}
+.bottom{
+  position: relative;
+}
+.first{
+  position: absolute;
+  float: left;
+  margin-left: 16px;
+  font-size: 14px;
+  margin-top: 8px;
+}
+.second{
+ margin-left: 126px;
+ font-size: 14px;
+ position: absolute;
+}
+
+.third{
+  font-size: 14px;
+  margin-left: 245px;
+  margin-top: 15px;
+  position: absolute;
+}

pages/select-history/select-history.js

@@ -0,0 +1,48 @@
+// index.js
+// 获取应用实例
+const app = getApp()
+
+Page({
+  data: {
+    motto: 'Hello World',
+    userInfo: {},
+    hasUserInfo: false,
+    canIUse: wx.canIUse('button.open-type.getUserInfo'),
+    canIUseGetUserProfile: false,
+    canIUseOpenData: wx.canIUse('open-data.type.userAvatarUrl') && wx.canIUse('open-data.type.userNickName') // 如需尝试获取用户信息可改为false
+  },
+  // 事件处理函数
+  bindViewTap() {
+    wx.navigateTo({
+      url: '../logs/logs'
+    })
+  },
+  onLoad() {
+    if (wx.getUserProfile) {
+      this.setData({
+        canIUseGetUserProfile: true
+      })
+    }
+  },
+  getUserProfile(e) {
+    // 推荐使用wx.getUserProfile获取用户信息，开发者每次通过该接口获取用户个人信息均需用户确认，开发者妥善保管用户快速填写的头像昵称，避免重复弹窗
+    wx.getUserProfile({
+      desc: '展示用户信息', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
+      success: (res) => {
+        console.log(res)
+        this.setData({
+          userInfo: res.userInfo,
+          hasUserInfo: true
+        })
+      }
+    })
+  },
+  getUserInfo(e) {
+    // 不推荐使用getUserInfo获取用户信息，预计自2021年4月13日起，getUserInfo将不再弹出弹窗，并直接返回匿名的用户个人信息
+    console.log(e)
+    this.setData({
+      userInfo: e.detail.userInfo,
+      hasUserInfo: true
+    })
+  }
+})

pages/select-history/select-history.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

pages/select-history/select-history.wxml

@@ -0,0 +1,26 @@
+<van-search
+  value="{{ value }}"
+  placeholder="麻辣烫"
+  use-action-slot
+  bind:change="onChange"
+  bind:search="onSearch"
+>
+  <button slot="action" bind:tap="onClick"
+class="text">搜索</button>
+</van-search>
+
+<view class="history">
+<text class="select">搜索历史</text>
+<view class="clean">
+<van-icon name="delete-o" class="lajitong"/>
+<text >清除记录</text>
+</view>
+</view>
+
+<view class="buttons">
+<van-button type="primary" size="mini" round type="info"
+color="#C0C0C0" class="first"
+>麻辣烫</van-button>
+<van-button type="primary" size="mini" round type="info"color="#C0C0C0" class="second">贵州麻辣烫</van-button>
+</view>
+

pages/select-history/select-history.wxss

@@ -0,0 +1,29 @@
+.text{
+ background-color: orange;
+ font-size:12px;
+ color:white;
+border-radius: 15px;
+}
+
+.select{
+  font-size: 14px;
+  color: rgb(133, 133, 133);
+  margin-left: 30px;
+}
+
+.clean{
+  float: right;
+  font-size: 12px;
+  color: rgb(133, 133, 133);
+  margin-top: 5px;
+  margin-right:10px ;
+}
+.buttons{
+  margin-top: 10px;
+}
+.first{
+margin-left: 25px;
+}
+.second{
+  margin-left: 15px;
+}

pages/select-nothing/select-nothing.js

@@ -0,0 +1,66 @@
+// pages/select-nothing/select-nothing.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/select-nothing/select-nothing.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

pages/select-nothing/select-nothing.wxml

@@ -0,0 +1,16 @@
+
+<van-search
+  value="{{ value }}"
+  placeholder="麻辣烫"
+  use-action-slot
+  bind:change="onChange"
+  bind:search="onSearch"
+>
+  <button slot="action" bind:tap="onClick"
+class="text">搜索</button>
+</van-search>
+
+<view class="mediunm">
+<image src="../image/weisousuodao@2x(1).png" class="photo"></image>
+<view class="medium-text"> 没有找到匹配的结果</view>
+</view>

pages/select-nothing/select-nothing.wxss

@@ -0,0 +1,19 @@
+.text{
+  background-color: orange;
+  font-size:12px;
+  color:white;
+ border-radius: 15px;
+ }
+ .photo{
+   width: 150px;
+   height: 100px;
+  margin-top: 120px;
+  margin-left: 85px;
+ }
+ .medium-text{
+   font-weight: 200px;
+   font-size: 13px;
+   color: rgb(133, 133, 133);
+   padding-top: 15px;
+  margin-left: 85px;
+ }

pages/select-shopping/select-shopping.js

@@ -0,0 +1,66 @@
+// pages/select-shopping/select-shopping.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/select-shopping/select-shopping.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

pages/select-shopping/select-shopping.wxml

@@ -0,0 +1,40 @@
+<van-search value="{{ value }}" placeholder="麻辣烫" use-action-slot bind:change="onChange" bind:search="onSearch">
+  <button slot="action" bind:tap="onClick" class="text">搜索</button>
+</van-search>
+
+<view class="body">
+  <image src="../image/baner(1).png" class="meishi"></image>
+  <view class="bodytext1">
+    <text>二食堂二楼麻辣烫麻辣拌...</text>
+  </view>
+    <view class="bodytext2">
+    <text>起送</text><text class="bianse">￥15</text><text>货到付款</text>
+    <text>月售</text><text class="bianse">231</text>
+    <view class="minute">30分钟</view>
+</view>
+<view class="bodytext3">
+  <van-icon name="balance-list-o" />
+积分抵扣有优惠
+</view>
+  </view>
+
+  <view class="body2">
+  <view class="photo2">
+  <image src="../image/baner(1).png" class="meishi"></image>
+  <view class="relaxing">休息中</view>
+</view>
+  <view class="bodytext1">
+    <text>二食堂二楼麻辣烫麻辣拌...</text>
+  </view>
+    <view class="bodytext2">
+    <text>起送</text><text class="bianse">￥15</text><text>货到付款</text>
+    <text>月售</text><text class="bianse">231</text>
+    <view class="minute">30分钟</view>
+</view>
+<view class="bodytext3">
+  <van-icon name="balance-list-o" />
+积分抵扣有优惠
+</view>
+  </view>
+  
+  

pages/select-shopping/select-shopping.wxss

@@ -0,0 +1,76 @@
+/* pages/select-shopping/select-shopping.wxss */
+.text{
+  background-color: orange;
+  font-size:12px;
+  color:white;
+ border-radius: 15px;
+ }
+ .meishi{
+   width: 105px;
+   height: 70px;
+   margin-left: 10px;
+   position: absolute;
+ }
+ .body{
+   width: 100%;
+   height: 80px;
+   margin-top: 20px;
+  
+ }
+ .bodytext1{
+   float: right;
+   font-size: 16px;
+   margin-right: 12px;
+   font-weight: bold;
+  
+ }
+ .bianse{
+   color: orange;
+ }
+ .bodytext2{
+   box-sizing: border-box;
+   font-size: 11px;
+   float: right;
+   margin-right: 10px;
+   margin-top: 10px;
+ }
+ .minute{
+   width: 40px;
+   height: 15px;
+   float: right;
+   margin-left: 5px;
+   background-color: orange;
+   color: white;
+   text-align: center;
+   border: 1px solid white;
+ }
+ .bodytext3{
+   float: right;
+   width: 200px;
+   height: 15px;
+   font-size: 12px;
+   text-align: center;
+   background-color: orange;
+   border-radius: 8%;
+   color:white;
+   margin-top: 10px;
+ }
+
+.body2{
+  margin-top: 20px;
+}
+.photo2{
+position: relative;
+}
+.relaxing{
+  width: 105px;
+  height: 20px;
+  background-color: #666666;
+  color: white;
+  font-size: 11px;
+  position: absolute;
+  margin-left: 10px;
+  margin-top: 50px;
+  position: absolute;
+  text-align: center;
+}

pages/zhuye/zhuye.js

@@ -0,0 +1,66 @@
+// pages/zhuye/zhuye.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/zhuye/zhuye.json

@@ -0,0 +1,3 @@
+{
+  "usingComponents": {}
+}

pages/zhuye/zhuye.wxml

@@ -0,0 +1,51 @@
+<!--pages/zhuye/zhuye.wxml-->
+
+<van-search value="{{ value }}" placeholder="搜索商家名称" use-action-slot bind:change="onChange" bind:search="onSearch">
+  <button slot="action" bind:tap="onClick" class="text">搜索</button>
+</van-search>
+<view>
+<!-- 轮播图 -->
+  <swiper class="lunbo" autoplay indicator-dots circular interval="2000" indicator-color="white" indicator-active-color="grey">
+<swiper-item>
+<image src="../image/shaokao.jpg"mode="widthFix"></image>
+</swiper-item>
+<swiper-item>
+<image src="../image/shaokao2.jpg" mode="widthFix"></image>
+</swiper-item>
+</swiper>
+  </view>
+<!-- 商品 -->
+<view class="body">
+  <image src="../image/baner(1).png" class="meishi"></image>
+  <view class="bodytext1">
+    <text>二食堂二楼麻辣烫麻辣拌...</text>
+  </view>
+    <view class="bodytext2">
+    <text>起送</text><text class="bianse">￥15</text><text>货到付款</text>
+    <text>月售</text><text class="bianse">231</text>
+    <view class="minute">30分钟</view>
+</view>
+<view class="bodytext3">
+  <van-icon name="balance-list-o" />
+积分抵扣有优惠
+</view>
+</view>
+<!-- 休息中商品 -->
+  <view class="body2">
+  <view class="photo2">
+  <image src="../image/baner(1).png" class="meishi"></image>
+  <view class="relaxing">休息中</view>
+</view>
+  <view class="bodytext1">
+    <text>二食堂二楼麻辣烫麻辣拌...</text>
+  </view>
+    <view class="bodytext2">
+    <text>起送</text><text class="bianse">￥15</text><text>货到付款</text>
+    <text>月售</text><text class="bianse">231</text>
+    <view class="minute">30分钟</view>
+</view>
+<view class="bodytext3">
+  <van-icon name="balance-list-o" />
+积分抵扣有优惠
+</view>
+  </view>

pages/zhuye/zhuye.wxss

@@ -0,0 +1,78 @@
+/* pages/zhuye/zhuye.wxss */
+.text{
+  background-color: orange;
+  font-size:12px;
+  color:white;
+ border-radius: 15px;
+ }
+.lunbo{
+  height: 120px;
+}
+ .meishi{
+  width: 105px;
+  height: 70px;
+  margin-left: 10px;
+  position: absolute;
+}
+.body{
+  width: 100%;
+  height: 80px;
+  margin-top: 20px;
+ 
+}
+.bodytext1{
+  float: right;
+  font-size: 16px;
+  margin-right: 12px;
+  font-weight: bold;
+ 
+}
+.bianse{
+  color: orange;
+}
+.bodytext2{
+  box-sizing: border-box;
+  font-size: 11px;
+  float: right;
+  margin-right: 10px;
+  margin-top: 10px;
+}
+.minute{
+  width: 40px;
+  height: 15px;
+  float: right;
+  margin-left: 5px;
+  background-color: orange;
+  color: white;
+  text-align: center;
+  border: 1px solid white;
+}
+.bodytext3{
+  float: right;
+  width: 200px;
+  height: 15px;
+  font-size: 12px;
+  text-align: center;
+  background-color: orange;
+  border-radius: 8%;
+  color:white;
+  margin-top: 10px;
+}
+.body2{
+  margin-top: 20px;
+}
+.photo2{
+position: relative;
+}
+.relaxing{
+  width: 105px;
+  height: 20px;
+  background-color: #666666;
+  color: white;
+  font-size: 12px;
+  position: absolute;
+  margin-left: 10px;
+  margin-top: 50px;
+  position: absolute;
+  text-align: center;
+}

project.private.config.json

@@ -34,6 +34,41 @@
           "query": "",
           "launchMode": "default",
           "scene": null
+        },
+        {
+          "name": "me",
+          "pathName": "pages/mine/mine",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
+        },
+        {
+          "name": "history",
+          "pathName": "pages/select-history/select-history",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
+        },
+        {
+          "name": "nothing",
+          "pathName": "pages/select-nothing/select-nothing",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
+        },
+        {
+          "name": "shopping",
+          "pathName": "pages/select-shopping/select-shopping",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
+        },
+        {
+          "name": "zhuye",
+          "pathName": "pages/zhuye/zhuye",
+          "query": "",
+          "launchMode": "default",
+          "scene": null
         }
       ]
     }