后端请求成功

api/common.js

@@ -0,0 +1,9 @@
+import request from './request'
+
+module.exports = {
+  community:{
+    list(params){
+      return request.get('/api/community')
+    }
+  }
+}

api/request.js

@@ -0,0 +1,35 @@
+const baseUrl = 'https://api-dev.beefast.co';
+let token;
+wx.getStorage({
+  key:'accessToken',
+  success:(res)=>{
+    token = res.data;
+  }
+})
+
+const sendRequest = (options)=>{
+  return new Promise((rs,rj)=>{
+    wx.request({
+      url: `${baseUrl}${options.url}`,
+      success:(result)=>{
+        rs(result.data.data);
+      },
+      method:options.method,
+      data:options.data,
+      params:options.params,
+      header:{
+        Authorization: `Bearer ${token}`
+      },
+      fail:rj
+    })
+  })
+}
+
+export default {
+  get(url,params){
+    sendRequest({url,method:'get',params});
+  },
+  post(url,data){
+    sendRequest({url,method:'post',data});
+  }
+}

api/user.js

@@ -0,0 +1,22 @@
+import request from './request';
+
+export default {
+  getPhoneByCode(code){
+    return request.post('/api/user/send-code',{})
+  },
+  loginWithPhone(phone){
+    return request.post('/api/user/phone-login',{
+      phone
+    })
+  },
+  loginWithCode(wxCode,phoneCode,rCode){
+    return request.post('/api/wechat/phone-login',{
+      login_code:wxCode,
+      phone_code:phoneCode,
+      referral_code:rCode
+    });
+  },
+  info(){
+    return request.get('/api/user/info');
+  }
+}

app.js

@@ -1,4 +1,4 @@
-// app.js
+import userApi from './api/user';
 App({
   onLaunch() {
     // 展示本地存储能力
@@ -12,8 +12,17 @@ App({
         // 发送 res.code 到后台换取 openId, sessionKey, unionId
       }
     })
+    wx.getStorage({
+      key:'accessToken',
+      success:(res)=>{
+        console.log(res.data);
+        this.globalData.accessToken = res.data;
+        userApi.info()
+      }
+    })
   },
   globalData: {
-    userInfo: null
+    userInfo: null,
+    accessToken:null
   }
 })

app.wxss

@@ -5,6 +5,8 @@ page{
   background-color:#F5F5F5;
   color: #222222;
   padding-bottom:80rpx;
+  --main-color:#FEC400;
+  --main-hover-color:#fcce39;
 }
 
 button{
@@ -29,10 +31,11 @@ button:not([size=mini]) .icon{
 }
 
 button[type=primary]{
-  background-color:#1A4DEB;
+  background-color:var(--main-color);
+  color:#222222;
 }
 button:not([plain])[type=primary]:hover{
-  background-color:#043eec;
+  background-color:var(--main-hover-color);
 }
 button[type=default]{
   color: #333333;
@@ -41,8 +44,8 @@ button[type=default]{
 }
 
 button[type=primary][plain]{
-  border-color: #1A4DEB;
+  border-color: var(--main-color);
-  color:#1A4DEB;
+  color:var(--main-color);
   padding:28rpx 25rpx;
 }
 button[type=primary][plain]:hover{
@@ -271,3 +274,7 @@ page-container .content{
 .tab-bar .current .item::before{
   opacity: 1;
 }
+
+navigator button{
+  vertical-align: middle;
+}

pages/help/community/index.js

@@ -1,18 +1,38 @@
-// pages/help/community/index.js
+const commonApi = require('../../../api/common');
+
 Page({
 
   /**
    * 页面的初始数据
    */
   data: {
-
+    currentCommunity:null,
+    communityList:[]
+  },
+  onSelectItem(event){
+    const currentCommunity = event.currentTarget.dataset.item;
+    this.setData({currentCommunity})
+    wx.setStorage({
+      key:"currentCommunity",
+      data:currentCommunity
+    });
   },
 
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad(options) {
-
+    wx.getStorage({
+      key:'currentCommunity',
+      success:(res)=>{
+        console.log(res);
+        this.setData({currentCommunity:res.data})
+      }
+    })
+    commonApi.community.list().then((data)=>{
+      const communityList = data.items;
+      this.setData({communityList});
+    });
   },
 
   /**

pages/help/community/index.json

@@ -1,3 +1,4 @@
 {
-  "usingComponents": {}
+  "usingComponents": {},
+  "navigationBarTitleText": "开通小区"
 }

pages/help/community/index.wxml

@@ -1,22 +1,13 @@
 <view class="community-list">
-  <view class="item">
+  <view class="item {{item.id==currentCommunity.id?'current':''}}" wx:for="{{communityList}}" wx:key="index" 
+    bind:tap="onSelectItem" data-item="{{item}}">
     <view class="title">
       <image class="icon" src="/assets/icon/help/house@2x.png"/>
-      <label class="label">佳兆业丽晶公馆</label>
+      <label class="label">{{item.name}}</label>
     </view>
     <view class="sub-title">
-      <label class="key">四川省成都市温江区花都大道西段318号</label>
+      <label class="key">{{item.address}}</label>
-      <label class="value">1.2km</label>
+      <label class="value">{{item.distance||''}}</label>
-    </view>
-  </view>
-  <view class="item current">
-    <view class="title">
-      <image class="icon" src="/assets/icon/help/house@2x.png"/>
-      <label class="label">佳兆业丽晶公馆</label>
-    </view>
-    <view class="sub-title">
-      <label class="key">四川省成都市温江区花都大道西段318号</label>
-      <label class="value">1.2km</label>
     </view>
   </view>
 </view>

pages/help/community/index.wxss

@@ -25,6 +25,7 @@
   display: flex;
   font-size:28rpx;
   margin-top:34rpx;
+  line-height: 1.3;
 }
 .community-list .item .sub-title .key{
   color: #888;

pages/help/index/index.js

@@ -1,4 +1,4 @@
-// pages/help/index/index.js
+
 Page({
 
   /**
@@ -6,14 +6,15 @@ Page({
    */
   data: {
     index:0,
-    array:[1,2,3,4]
+    array:[1,2,3,4],
+    communityList:[],
+    currentCommunity:null
   },
 
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad(options) {
-
   },
 
   /**
@@ -26,7 +27,14 @@ Page({
    * 生命周期函数--监听页面显示
    */
   onShow() {
-
+    wx.getStorage({
+      key:"currentCommunity",
+      success:(res)=>{
+        this.setData({
+          currentCommunity:res.data
+        })
+      }
+    })
   },
 
   /**

pages/help/index/index.wxml

@@ -4,7 +4,7 @@
     <image class="logo" src="/assets/icon/navbar/lanfeng@2x.png"/>
   </nav-bar>
   <view class="choose-community" bind:tap="goToCommunity">
-    <view class="text">选择小区</view>
+    <view class="text">{{currentCommunity?currentCommunity.name:'选择小区'}}</view>
     <image class="arrow" src="/assets/icon/help/arrow-down@2x.png"/>
   </view>
   <view class="address-panel">
@@ -41,6 +41,13 @@
     </view>
   </view>
   <button type="primary" class="order-button">立即下单</button>
+  <view class="login-panel">
+    <image class="icon" src="/assets/icon/help/redpacket@2x.png"/>
+    <view class="text">登录后享跑腿服务</view>
+    <navigator url="/pages/login/login">
+      <button class="button" size="mini">一键登录</button>
+    </navigator>
+  </view>
   <view class="promotion-panel">
     <view class="text">
       <view class="title">您有<label class="spec">2张</label>免费跑腿券待领取</view>

pages/help/index/index.wxss

@@ -127,3 +127,32 @@
   padding:0;
   line-height: 100rpx;
 }
+
+.login-panel{
+  display:flex;
+  background-color: #000;
+  border-radius: 20rpx;
+  align-items: center;
+  padding:20rpx;
+  position: fixed;
+  bottom:0;
+  left:20rpx;
+  right:20rpx;
+}
+.login-panel .icon{
+  width:42rpx;height:56rpx;
+}
+.login-panel .text{
+  font-size:30rpx;
+  font-weight: 500;
+  color:#fff;
+  flex:1;
+  margin-left:23rpx;
+}
+.login-panel .button{
+  font-size: 26rpx;
+  font-weight: 500;
+  line-height: 1;
+  padding:16rpx 22rpx;
+  border-radius: 60rpx;
+}

pages/login/login.js

@@ -1,6 +1,8 @@
+import userApi from '../../api/user';
+
 Page({
   data: {
-    isAgree: false
+    isAgree: true
   },
 
   handleAgreeChange(e) {
@@ -9,7 +11,7 @@ Page({
     })
   },
 
-  handleLogin() {
+  onLogin() {
     if (!this.data.isAgree) {
       wx.showToast({
         title: '请先同意用户协议和隐私政策',
@@ -18,11 +20,23 @@ Page({
       return
     }
     
+  },
+  getPhoneNumber(event){
+    console.log(event);
     wx.login({
       success: (res) => {
         // 实现登录逻辑
         console.log('登录成功', res)
+        this.sendLogin(res.code,event.detail.code);
       }
     })
+  },
+  sendLogin(wxcode,phonecode){
+    userApi.loginWithCode(wxcode,phonecode).then((data)=>{
+      wx.setStorage({
+        key:"accessToken",
+        data:data.access_token
+      })
+    })
   }
 }) 

pages/login/login.wxml

@@ -1,34 +1,14 @@
-<view class="login-container">
+<view class="head">
-  <!-- 顶部导航区域 -->
+</view>
-  <view class="nav-area">
+<view class="bottom">
-    <view class="home-icon">
+  <radio-group>
-      <image src="/assets/images/home.png" mode="aspectFit"></image>
+    <label class="policy">
-    </view>
+      <radio class="radio" checked="{{isAgree}}"></radio>
-    <view class="more-icon">
+      <label>我已阅读并同意
-      <image src="/assets/images/more.png" mode="aspectFit"></image>
+        <label class="yellow">《用户协议》</label>与<label class="yellow">《隐私政策》</label>
-    </view>
+      </label>
-  </view>
+    </label>
-
+  </radio-group>
-  <!-- 标题区域 -->
+  <button class="button" type="primary"
-  <view class="title-area">
+    open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">手机号快捷登录</button>
-    <view class="main-title">闪兔到家</view>
-    <view class="sub-title">一刻钟便民生活圈</view>
-  </view>
-
-  <!-- 登录区域 -->
-  <view class="login-area">
-    <!-- 协议勾选 -->
-    <view class="agreement">
-      <checkbox-group bindchange="handleAgreeChange">
-        <checkbox value="agree" checked="{{isAgree}}"/>
-        <text>我已阅读并同意</text>
-        <text class="link">《用户协议》</text>
-        <text>与</text>
-        <text class="link">《隐私政策》</text>
-      </checkbox-group>
-    </view>
-
-    <!-- 登录按钮 -->
-    <button class="login-btn" hover-class="none" bindtap="handleLogin">手机号快捷登录</button>
-  </view>
 </view>

pages/login/login.wxss

@@ -1,106 +1,27 @@
-.login-container {
+.head{
-  min-height: 100vh;
+  height:554rpx;
-  background-color: #4555FF;
+  background-color: #F4BD00;
-  padding: 0 40rpx;
-  position: relative;
 }
-
+.bottom{
-.nav-area {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding-top: 120rpx;
-}
-
-.home-icon,
-.more-icon {
-  width: 80rpx;
-  height: 80rpx;
-  background: rgba(255, 255, 255, 0.2);
-  border-radius: 50%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-
-.home-icon image,
-.more-icon image {
-  width: 36rpx;
-  height: 36rpx;
-}
-
-.title-area {
-  margin-top: 120rpx;
-  color: #fff;
-}
-
-.main-title {
-  font-size: 72rpx;
-  font-weight: bold;
-  margin-bottom: 24rpx;
-  letter-spacing: 4rpx;
-}
-
-.sub-title {
-  font-size: 36rpx;
-  opacity: 0.9;
-}
-
-.login-area {
-  position: fixed;
-  left: 40rpx;
-  right: 40rpx;
-  bottom: 80rpx;
-}
-
-.agreement {
-  color: #fff;
-  font-size: 26rpx;
-  margin-bottom: 40rpx;
-  display: flex;
-  align-items: center;
-}
-
-.agreement checkbox-group {
-  display: flex;
-  align-items: center;
-}
-
-.agreement .link {
-  color: #fff;
-  text-decoration: underline;
-  padding: 0 4rpx;
-}
-
-.login-btn {
-  background: linear-gradient(90deg, #0BBFF5 0%, #4285FF 100%);
-  color: #fff;
-  font-size: 32rpx;
-  font-weight: 500;
-  border-radius: 45rpx;
-  height: 100rpx;
-  line-height: 100rpx;
-  box-shadow: 0 8rpx 20rpx rgba(66, 133, 255, 0.3);
-}
-
-.login-btn::after {
-  border: none;
-}
-
-checkbox .wx-checkbox-input {
-  width: 32rpx;
-  height: 32rpx;
-  border-radius: 50%;
-  border-color: rgba(255, 255, 255, 0.8);
-  margin-right: 12rpx;
-}
-
-checkbox .wx-checkbox-input.wx-checkbox-input-checked {
   background-color: #fff;
-  border-color: #fff;
+  position: absolute;
+  bottom: 0;
+  top:530rpx;
+  left:0;right:0;
+  border-radius: 24rpx 24rpx 0 0;
+  padding:60rpx 40rpx;
 }
-
+.bottom .yellow{
-checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
+  color:#FEC400;
-  color: #4555FF;
+}
-  font-size: 24rpx;
+.policy{
+  font-size: 26rpx;
+  display: flex;
+  align-items: center;
+}
+.policy .radio{
+  margin-right:10rpx;
+}
+.button{
+  margin-top:40rpx;
 }