1

app.js

@@ -13,10 +13,16 @@ App({
         // 发送 res.code 到后台换取 openId, sessionKey, unionId
       }
     })
+
+    wx.setTabBarBadge({
+      index: 2,
+      text: '2'
+    })
+
   },
   globalData: {
     userInfo: null
   },
-  api:api
+  api: api
 
 })

app.json

@@ -1,10 +1,9 @@
 {
     "pages": [
         "pages/tabber/home/index",
-        "pages/tabber/news/index",
-        "pages/tabber/my/index",
-        "pages/index/index",
-        "pages/logs/logs"
+        "pages/tabber/order/index",
+        "pages/tabber/set/index",
+        "pages/tabber/builds/index"
     ],
     "window": {
         "backgroundTextStyle": "light",
@@ -16,25 +15,31 @@
         "color": "#666666",
         "selectedColor": "#4699FF",
         "backgroundColor": "#fff",
-        "list": [{
+        "list": [
+            {
                 "pagePath": "pages/tabber/home/index",
                 "text": "首页",
-                "iconPath": "pages/image/tabber/home.png",
-                "selectedIconPath": "pages/image/tabber/home-active.png"
+                "iconPath": "image/tabber/home.png",
+                "selectedIconPath": "image/tabber/home-active.png"
+            },
+            {
+                "pagePath": "pages/tabber/order/index",
+                "text": "分拣单",
+                "iconPath": "image/tabber/order.png",
+                "selectedIconPath": "image/tabber/order-active.png"
             },
             {
-                "pagePath": "pages/tabber/news/index",
-                "text": "消息",
-                "iconPath": "pages/image/tabber/news.png",
-                "selectedIconPath": "pages/image/tabber/news-active.png"
+                "pagePath": "pages/tabber/builds/index",
+                "text": "打包",
+                "iconPath": "image/tabber/build.png",
+                "selectedIconPath": "image/tabber/build-active.png"
             },
             {
-                "pagePath": "pages/tabber/my/index",
-                "text": "我的",
-                "iconPath": "pages/image/tabber/my.png",
-                "selectedIconPath": "pages/image/tabber/my-active.png"
+                "pagePath": "pages/tabber/set/index",
+                "text": "设置",
+                "iconPath": "image/tabber/set.png",
+                "selectedIconPath": "image/tabber/set-active.png"
             }
-
         ]
     },
     "sitemapLocation": "sitemap.json"

app.wxss

@@ -1,25 +1,138 @@
 /**app.wxss**/
-view{
+view {
   box-sizing: border-box;
-  transition: all 0.4s cubic-bezier(0.075, 0.82, 0.165, 1);
+  transition: all 0.4s cubic-bezier(0.55, 0.085, 0.68, 0.53);
 }
-.flex{
+
+.flex {
   display: flex;
   align-items: center;
 }
 
-.ju-c{
+.al-e {
+  align-items: flex-end;
+}
+
+.al-s {
+  align-items: flex-start;
+}
+
+.ju-c {
   justify-content: center;
 }
 
-.ju-b{
+.ju-a {
+  justify-content: space-around;
+}
+
+.ju-b {
   justify-content: space-between;
 }
 
-.img-bgs{
-    inset: 0;
-    position: absolute;
-    z-index: -1;
-    width: 100%;
-    height: 100%;
+.ju-e {
+  justify-content: flex-end;
+}
+
+.m-top-15 {
+  margin-top: 15rpx;
+}
+
+.m-top-20 {
+  margin-top: 20rpx;
+}
+
+.m-top-25 {
+  margin-top: 25rpx;
+}
+
+.m-top-30 {
+  margin-top: 30rpx;
+}
+
+.m-top-40 {
+  margin-top: 40rpx;
+}
+
+
+.m-left-10 {
+  margin-left: 10rpx;
+}
+
+.m-left-25 {
+  margin-left: 25rpx;
+}
+
+.m-bottom-20 {
+  margin-bottom: 20rpx;
+}
+
+.m-bottom-25 {
+  margin-bottom: 25rpx;
+
+}
+
+.m-bottom-30 {
+  margin-bottom: 30rpx;
+
+}
+
+.m-right-10 {
+  margin-right: 10rpx;
+}
+
+.m-right-15 {
+  margin-right: 15rpx;
+}
+
+.m-right-25 {
+  margin-right: 25rpx;
+}
+
+.m-right-20 {
+  margin-right: 20rpx;
+}
+
+
+.img-bgs {
+  left: 0;
+  top: 0;
+  position: absolute;
+  z-index: -1;
+  width: 100%;
+  height: 100%;
+}
+
+.b-bottom {
+  border-bottom: 1rpx solid #EDEDED;
+}
+
+.t-text-ellipsis2 {
+  text-overflow: -o-ellipsis-lastline;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;
+  line-clamp: 2;
+  -webkit-box-orient: vertical;
+}
+
+/*隐藏滚动条*/
+
+::-webkit-scrollbar {
+  width: 0;
+  height: 0;
+  color: transparent;
+}
+
+.btn-sky {
+
+  background: linear-gradient(270deg, #467FFF 0%, #4699FF 100%);
+  text-align: center;
+  color: #FFFFFF;
+}
+
+.btn-border {
+  text-align: center;
+  color: #191C27;
+  border: 1rpx solid #CCCCCC;
 }

pages/common/toast.js

@@ -1,48 +0,0 @@
-Component({
-    options: {
-      multipleSlots: true // 在组件定义时的选项中启用多slot支持 
-    },
-    /** 
-     * 私有数据,组件的初始数据 
-     * 可用于模版渲染 
-     */
-    properties:{
-      icon:{
-        type:String
-      }
-    },
-    data: { // 弹窗显示控制 
-      animationData: {},
-      content: '提示内容',
-      
-    },
-    /**
-     * 组件的方法列表 
-     */
-    methods: {
-      /** 
-       * 显示toast，定义动画
-       */
-      showToast(val) {
-        var animation = wx.createAnimation({
-          duration: 300,
-          timingFunction: 'ease',
-        })
-        this.animation = animation
-        animation.opacity(1).step()
-        this.setData({
-          animationData: animation.export(),
-          content: val
-        })
-        /**
-         * 延时消失
-         */
-        setTimeout(function () {
-          animation.opacity(0).step()
-          this.setData({
-            animationData: animation.export()
-          })
-        }.bind(this), 1500)
-      }
-    }
-  })

pages/common/toast.json

@@ -1,4 +0,0 @@
-{
-    "component": true,
-    "usingComponents": {}
-}

pages/common/toast.wxml

@@ -1,6 +0,0 @@
-<view class='wx-toast-box' animation="{{animationData}}">
-  <view class='wx-toast-content'>
-    <image src="{{icon}}" class="icon"></image>
-    <view class='wx-toast-toast'>{{ content }}</view>
-  </view>
-</view>

pages/common/toast.wxss

@@ -1,35 +0,0 @@
-.wx-toast-box {
-  display: flex;
-  width: 100%;
-  justify-content: center;
-  position: fixed;
-  z-index: 999;
-  top: 50%;
-  left: 50%;
-  transform: translate(-50%, -50%);
-  opacity: 0;
-}
-
-.wx-toast-content {
-  width: 226rpx;
-  min-height: 174rpx;
-  background: rgba(0, 0, 0, 0.8);
-  border-radius: 8rpx;
-  padding: 30rpx;
-
-}
-
-.wx-toast-toast {
-  height: 100%;
-  width: 100%;
-  color: #fff;
-  font-size: 28rpx;
-  text-align: center;
-}
-
-.icon {
-  width: 80rpx;
-  height: 80rpx;
-  display: block;
-  margin:15rpx auto;
-}

pages/index/index.js

@@ -1,48 +0,0 @@
-// 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/index/index.wxml

@@ -1,23 +0,0 @@
-<!--index.wxml-->
-<view class="container">
-  <view class="userinfo">
-    <block wx:if="{{canIUseOpenData}}">
-      <view class="userinfo-avatar" bindtap="bindViewTap">
-        <open-data type="userAvatarUrl"></open-data>
-      </view>
-      <open-data type="userNickName"></open-data>
-    </block>
-    <block wx:elif="{{!hasUserInfo}}">
-      <button wx:if="{{canIUseGetUserProfile}}" bindtap="getUserProfile"> 获取头像昵称 </button>
-      <button wx:elif="{{canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
-      <view wx:else> 请使用1.4.4及以上版本基础库 </view>
-    </block>
-    <block wx:else>
-      <image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>
-      <text class="userinfo-nickname">{{userInfo.nickName}}</text>
-    </block>
-  </view>
-  <view class="usermotto">
-    <text class="user-motto">{{motto}}</text>
-  </view>
-</view>

pages/index/index.wxss

@@ -1,19 +0,0 @@
-/**index.wxss**/
-.userinfo {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  color: #aaa;
-}
-
-.userinfo-avatar {
-  overflow: hidden;
-  width: 128rpx;
-  height: 128rpx;
-  margin: 20rpx;
-  border-radius: 50%;
-}
-
-.usermotto {
-  margin-top: 200px;
-}

pages/logs/logs.js

@@ -1,18 +0,0 @@
-// logs.js
-const util = require('../../utils/util.js')
-
-Page({
-  data: {
-    logs: []
-  },
-  onLoad() {
-    this.setData({
-      logs: (wx.getStorageSync('logs') || []).map(log => {
-        return {
-          date: util.formatTime(new Date(log)),
-          timeStamp: log
-        }
-      })
-    })
-  }
-})

pages/logs/logs.json

@@ -1,4 +0,0 @@
-{
-  "navigationBarTitleText": "查看启动日志",
-  "usingComponents": {}
-}

pages/logs/logs.wxml

@@ -1,6 +0,0 @@
-<!--logs.wxml-->
-<view class="container log-list">
-  <block wx:for="{{logs}}" wx:key="timeStamp" wx:for-item="log">
-    <text class="log-item">{{index + 1}}. {{log.date}}</text>
-  </block>
-</view>

pages/logs/logs.wxss

@@ -1,8 +0,0 @@
-.log-list {
-  display: flex;
-  flex-direction: column;
-  padding: 40rpx;
-}
-.log-item {
-  margin: 10rpx;
-}

pages/tabber/builds/index.js

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

pages/tabber/builds/index.wxml

@@ -0,0 +1,2 @@
+<!--pages/tabber/builds/index.wxml-->
+<text>pages/tabber/builds/index.wxml</text>

pages/tabber/builds/index.wxss

@@ -0,0 +1 @@
+/* pages/tabber/builds/index.wxss */

pages/tabber/home/index.js

@@ -7,27 +7,28 @@ Page({
      * 页面的初始数据
      */
     data: {
-        menuList: [
+        menuList:[
             {
-                url: '/pages/image/home/ruhexiadan.png',
-                text: '如何下单'
+                icon:'/image/home/icon_ruchangqianshou.png',
+                tit:'入厂签收'
             },
             {
-                url: '/pages/image/home/changjianwenti.png',
-                text: '常见问题'
-            }
-            ,
+                icon:'/image/home/icon_fenjianluru.png',
+                tit:'分拣录入'
+            },
+            {
+                icon:'/image/home/icon_zhijian.png',
+                tit:'质检上挂'
+            },
             {
-                url: '/pages/image/home/xidifanwei.png',
-                text: '洗涤范围'
+                icon:'/image/home//icon_yichang.png',
+                tit:'异常单'
             },
             {
-                url: '/pages/image/home/fenxianghaoyou.png',
-                text: '分享好友'
-            }
-        ],
-        current: 3,
-        btnInfo: {},
+                icon:'/image/home/icon_yiwupandian.png',
+                tit:'衣物盘点'
+            },
+        ]
     },
 
     /**
@@ -38,21 +39,6 @@ Page({
         //     console.log(res);
         // })
 
-        var info = wx.getMenuButtonBoundingClientRect()
-        console.log(info);
-        this.setData({
-            btnInfo: info
-        })
-        setTimeout(()=>{
-            
-            this.listenerLogin()
-        },1000)
-    },
-    onReady: function () {
-        this.toast = this.selectComponent("#toast");
-    },
-    listenerLogin: function () {
-        this.toast.showToast('领取成功');
     },
 
 

pages/tabber/home/index.json

@@ -1,8 +1,6 @@
 {
   "usingComponents": {
-    "van-button": "@vant/weapp/button/index",
-    "toast": "../../common/toast"
   },
-  "navigationStyle": "custom"
+  "navigationBarTitleText": "洗护管家"
   
 }

pages/tabber/home/index.wxml

@@ -1,74 +1,39 @@
-<!--pages/tabber/home/index.wxml-->
-<view class="topBg">
-    <image src="/pages/image/home/bg.png" class="img-bgs"></image>
-    <view class="contioner">
-        <image src="/pages/image/home/logo.png" class="tit"></image>
-        <view class="tips">洗衣·洗鞋·高端护理</view>
-    </view>
-
-
-    <view class="shoppingBoxs flex ju-b">
-        <view class="le flex ju-b">
-            <image src="/pages/image/home/pic.png" class="pic"></image>
-            <view class="content">
-                <view class="tit">创星汇科技园B栋1号柜</view>
-                <view class="message">离您最近｜距离40米</view>
-                <view class="tags">可下单</view>
+<view class="topBox m-bottom-30">
+    <view class="top  flex ju-b al-s">
+        <view class="le flex">
+            <image src="/image/home/user.png" class="user m-right-20"></image>
+            <view class="message">
+                <view class="name">大黄</view>
+                <view class="work">分拣员 北京一号线</view>
             </view>
         </view>
+        <view class="lr flex ">
+            <text class="m-right-10">退出</text>
+            <image src="/image/icon/back.png" class="icon"></image>
 
-        <view class="lr">
-            <image src="/pages/image/icon/location.png" class="icon"></image>
-            <view class="tips">更换</view>
         </view>
-    </view>
-</view>
 
-<view class="mainBoxs flex ju-b">
-    <view class="mainItem" wx:for="{{menuList}}" wx:key="{{index}}">
-        <image src="{{item.url}}" class="icon"></image>
-        <view class="text">{{item.text}}</view>
     </view>
-</view>
-
-<!-- or gray -->
-<view class="btns skyBlue ">
-    <text>下单洗衣</text>
-    <view class="tips flex">活动活动活动活动</view>
-</view>
-
-<view class="footerBoxs flex ju-b">
-    <image class="img-bgs" src="/pages/image/home/bottom-bg.png"></image>
-
-    <view class="le flex ju-b">
-        <image src="/pages/image/home/hongbao.png" class="bag"></image>
-        <view>
-            <view class="tit">
-                再完成<text>2单</text>得红包
-            </view>
-            <view class="flex ju-b">
-                <view wx:for="{{5}}" wx:key="*this">
-                    <image src="/pages/image/home/chiose-active.png" class="dot" wx:if="{{current-1 >= index}}"></image>
-                    <image src="/pages/image/home/chiose.png" class="dot" wx:else></image>
 
-                </view>
-            </view>
+    <view class="bottom flex ju-b m-top-40">
+        <view class="item flex ju-c">
+            <view class="num">18</view>
+            <view class="tips">待入厂</view>
+        </view>
+        <view class="item  flex ju-c">
+            <view class="num">18</view>
+            <view class="tips">清洗中</view>
+        </view>
+        <view class="item  flex ju-c">
+            <view class="num">18</view>
+            <view class="tips">待出厂</view>
         </view>
     </view>
-
-    <view class="lr">去下单</view>
 </view>
 
-<view class="footerTips flex ju-b">
-    <image src="/pages/image/home/tips.png" class="tips"></image>
-    <view class="message">春节期间暂停服务，放假安排：2022-01-01至2022-02-02，
-        暂停期间干洗柜中未取衣物可超常取出</view>
-</view>
-
-<view class="infoBoxs" style="right:{{0}}px;top:{{btnInfo.top+btnInfo.height}}px;">
-    <image src="/pages/image/home/tishi.png" class="img-bgs"></image>
-    <view class="close"></view>
-</view>
-
-<toast id='toast' icon="/pages/image/icon/success.png">
-</toast>
+<view class="contioner flex">
+    <view class="items flex ju-c" wx:for="{{menuList}}" wx:key="*this">
+        <image class="icon" src="{{item.icon}}"></image>
+        <text class="tit">{{item.tit}}</text>
+    </view>
+</view>

pages/tabber/home/index.wxss

@@ -1,248 +1,85 @@
 /* pages/tabber/home/index.wxss */
-page{
+page {
     padding-bottom: 50rpx;
-}
-
-.infoBoxs{
-    position: fixed;
-    width: 512rpx;
-    height: 153rpx;
-    z-index: 20;
-}
-
-.infoBoxs .close{
-    width: 30rpx;
-    height: 30rpx;
-    border: 1px solid red;
-    position: absolute;
-    right: 40rpx;
-    top: 50rpx;
-}
-.topBg {
     width: 750rpx;
-    height: 536rpx;
-    position: relative;
-    z-index: 1;
+    min-height: 100vh;
+    background: #F8F8F8;
 }
 
-
-.topBg .contioner {
-    position: absolute;
-    left: 50%;
-    top: 50%;
-    transform: translate(-50%, -50%);
-}
-
-.topBg .contioner .tit {
-    color: #191C27;
-    width: 240rpx;
-    height: 60rpx;
-    display: block;
-    margin: auto;
-}
-
-.topBg .contioner .tips {
-    margin: 30rpx auto;
-
-    font-size: 32rpx;
-    color: #191C27;
-    letter-spacing: 6rpx;
-}
-
-.shoppingBoxs {
-    width: 702rpx;
-    height: 168rpx;
+.topBox {
+    width: 750rpx;
     background: #FFFFFF;
-    box-shadow: 0px 10rpx 16rpx 0px rgba(17, 48, 105, 0.04), 0px -10px 16px 0px rgba(17, 48, 105, 0.04);
-    border-radius: 12rpx;
-    position: absolute;
-    left: 50%;
-    bottom: -15%;
-    transform: translate(-50%, 0%);
-    padding: 24rpx;
-
+    padding: 24rpx 30rpx 40rpx;
 }
 
-.shoppingBoxs .le .content {
-    line-height: 48rpx;
-    display: flex;
-    flex-direction: column;
-    margin-left: 25rpx;
+.topBox .user {
+    width: 80rpx;
+    height: 80rpx;
 }
 
-.shoppingBoxs .le .content .tit {
+.topBox .name {
     font-size: 28rpx;
     font-weight: 500;
-    color: #191C27;
+    color: #333333;
 }
 
-.shoppingBoxs .le .content .message {
+.topBox .work {
     font-size: 24rpx;
     color: #999999;
 }
 
-.shoppingBoxs .le .content .tags {
-    font-size: 22rpx;
-    color: #4699FF;
-    height: 30rpx;
-    width: 78rpx;
-    background: #E8F2FF;
-    border-radius: 2rpx;
-    text-align: center;
-    line-height: 30rpx;
-}
-
-.shoppingBoxs .le .pic {
-    width: 120rpx;
-    height: 120rpx;
-}
-
-.shoppingBoxs .lr {
-    position: relative;
-    width: 100rpx;
-}
-
-.shoppingBoxs .lr::before {
-    content: '';
-    display: block;
-    width: 2rpx;
-    height: 100%;
-    background: #E9E9E9;
-    position: absolute;
-    left: 0;
-    top: 0;
-}
-
-.shoppingBoxs .lr .icon {
-
-    width: 40rpx;
-    height: 40rpx;
-    display: block;
-    margin: auto;
-}
-
-.shoppingBoxs .lr .tips {
-    font-size: 24rpx;
+.topBox .lr {
+    font-size: 28rpx;
     color: #666666;
-    text-align: center;
-    margin-top: 10rpx;
-}
-
-.mainBoxs {
-    padding: 120rpx 65rpx;
-}
-
-.mainBoxs .mainItem .icon {
-    width: 48rpx;
-    height: 48rpx;
-    display: block;
-    margin: auto;
-}
-
-.mainBoxs .mainItem .text {
-    font-size: 24rpx;
-    text-align: center;
-    color: #191C27;
-    margin-top: 15rpx;
-}
-
-.btns {
-    margin: auto;
-    width: 686rpx;
-    height: 98rpx;
-    box-shadow: 0px 10rpx 20rpx 0px rgba(35, 107, 248, 0.2);
-    border-radius: 49rpx;
-    text-align: center;
-    line-height: 98rpx;
-    font-size: 32rpx;
-    font-weight: 500;
-    position: relative;
-}
-
-.btns.skyBlue {
-    background: linear-gradient(270deg, #467FFF 0%, #4699FF 100%);
-    color: #FFFFFF;
 }
 
-.btns.gray {
-    color: #FFFFFF;
-    background: #CCCCCC;
-}
-
-
-.btns .tips {
-    height: 38rpx;
-    background: #FF663D;
-    border-radius: 19rpx 19rpx 19rpx 0px;
-    position: absolute;
-    right: 0;
-    top: -20rpx;
-    font-size: 22rpx;
-    color: #FFFFFF;
-    padding: 0 8rpx;
-}
-
-.footerBoxs {
-    width: 700rpx;
-    height: 110rpx;
-    position: relative;
-    margin: 80rpx auto;
-    padding: 0 20rpx;
+.topBox .icon {
+    width: 32rpx;
+    height: 32rpx;
 }
 
-.footerBoxs .bag {
-    width: 80rpx;
-    height: 80rpx;
+.topBox .bottom .item {
+    width: 196rpx;
+    height: 123rpx;
+    background: #F8F8F8;
+    border-radius: 8rpx;
+    flex-direction: column;
 }
 
-.footerBoxs .le .tit {
-    font-size: 28rpx;
+.topBox .bottom .item .num {
+    font-size: 40rpx;
     font-weight: 500;
-    color: #191C27;
-}
-
-.footerBoxs .le .tit text {
-    color: #FF663D;
+    color: #333333;
 }
 
-.footerBoxs .le .dot {
-    width: 24rpx;
-    height: 24rpx;
-}
-
-.footerBoxs .lr {
-    width: 136rpx;
-    height: 48rpx;
-    background: #FF663D;
-    border-radius: 25rpx;
-    color: #fff;
-    line-height: 48rpx;
-    text-align: center;
+.topBox .bottom .item .tips {
     font-size: 24rpx;
-    font-weight: 500;
-    color: #FFFFFF;
+    color: #999999;
 }
 
+.contioner {
+    width: 100%;
+    padding: 0 40rpx;
+    flex-direction: column;
+    align-items: flex-start;
+    justify-content: space-between;
+}
 
-.footerTips {
-    position: fixed;
-    z-index: 10;
-    left: 0;
-    bottom: 0;
-    width: 750rpx;
-    height: 104rpx;
-    background: #FDFCEC;
-    padding: 0 24rpx;
+.contioner .items {
+    width: 305rpx;
+    height: 230rpx;
+    background: #FFFFFF;
+    border-radius: 8rpx;
+    flex-direction: column;
+    margin-bottom: 30rpx;
 }
 
-.footerTips .tips {
-    width: 32rpx;
-    height: 32rpx;
+.contioner .items .icon {
+    width: 90rpx;
+    height: 90rpx;
 }
 
-.footerTips .message {
-    font-size: 24rpx;
-    color: #FF663D;
-    line-height: 30rpx;
-    width: 660rpx;
+.contioner .items .tit {
+    font-size: 30rpx;
+    color: #333333;
 }