feat 添加登录

.vscode/settings.json

@@ -33,5 +33,8 @@
   "editor.tabSize": 2,
   "[wxml]": {
     "editor.defaultFormatter": "wechat.miniprogram.wxml-language-features"
+  },
+  "[css]": {
+    "editor.defaultFormatter": "HookyQR.beautify"
   }
 }

app.json

@@ -2,10 +2,13 @@
   "pages": [
     "pages/home/home",
     "pages/login/login",
+    "pages/login/authorize-avatar-name/index",
+    "pages/login/phone-register/index",
     "pages/usercenter/index",
     "pages/usercenter/person-info/index",
     "pages/usercenter/address/list/index",
     "pages/usercenter/address/edit/index",
+    "pages/usercenter/set/index",
     "pages/goods/list/index",
     "pages/goods/details/index",
     "pages/goods/category/index",

package.json

@@ -24,6 +24,7 @@
     ]
   },
   "dependencies": {
+    "@vant/weapp": "^1.10.19",
     "dayjs": "^1.9.3",
     "tdesign-miniprogram": "^1.0.0",
     "tslib": "^1.11.1"

pages/login/authorize-avatar-name/index.js

@@ -0,0 +1,107 @@
+// pages/login/authorize-avatar-name/index.js
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    image: "https://cdn-we-retail.ym.tencent.com/miniapp/usercenter/icon-user-center-avatar@2x.png",
+  },
+
+  login() {
+    var that = this;
+    // 基础库要在2.27.1以下才可以使用
+    wx.getUserProfile({
+      //获取用户信息。页面产生点击事件（例如 button 上 bindtap 的回调中）后才可调用，每次请求都会弹出授权窗口，用户同意后返回 userInfo,用于替换 wx.getUserInfo
+      lang: 'zh_CN',
+      desc: '用于在后台更好的识别您的身份', //声明获取用户个人信息后的用途
+      success(user) {
+        //接口调用成功的回调函数
+        const data = {
+          encryptedData: user.encryptedData,
+          iv: user.iv,
+          // signature: user.signature,
+          // rawData: user.rawData,
+          userInfo: user.userInfo,
+        };
+
+        // app.request({
+        //   url: `login`,
+        //   method: 'POST',
+        //   data: data,
+        //   success: async function (res) {
+        //     // wx.setStorageSync('userInfo', res);
+        //     app.put('userInfo', res, 86400);
+        //     const userInfo = app.get('userInfo');
+
+        //     // 如果第一次登录就注册一个客户账号
+
+      
+        //   },
+        // });
+      },
+      fail() {
+        wx.switchTab({
+          url: '/pages/home/home',
+        });
+      },
+    });
+  },
+
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/login/authorize-avatar-name/index.json

@@ -0,0 +1,7 @@
+{
+  "usingComponents": {
+    "t-avatar": "tdesign-miniprogram/avatar/avatar",
+    "van-button": "@vant/weapp/button/index"
+  },
+  "navigationBarTitleText": "授权登录"
+}

pages/login/authorize-avatar-name/index.wxml

@@ -0,0 +1,25 @@
+<!-- 授权头像昵称登录页 -->
+<view class="mainContainer">
+
+  <!-- 头部头像盒子 -->
+  <view class="top-avatar-box">
+    <view class="avatar-img-box">
+      <image class="avatar-img" src="{{image}}"></image>
+    </view>
+    <view class="avatar-line"></view>
+  </view>
+
+  <!-- 权限文字盒子 -->
+  <view class="authorize-content-box">
+    <view class="authorize-content-title">申请获取以下权限</view>
+    <view class="authorize-content-text">获得你的公开信息（昵称、头像等）</view>
+  </view>
+
+  <!-- 授权按钮盒子 -->
+  <view class="authorize-btn-box">
+    <van-button type="primary" round block bind:tap="login">授权登录</van-button>
+    <view class="authorize-btn"></view>
+    <van-button round block>暂不登录</van-button>
+  </view>
+
+</view>

pages/login/authorize-avatar-name/index.wxss

@@ -0,0 +1,61 @@
+/* pages/login/authorize-avatar-name/index.wxss */
+
+.mainContainer {
+  width: 85%;
+  margin: 0 auto;
+}
+
+/* 头部头像盒子 */
+.top-avatar-box {
+  margin-top: 50rpx;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+}
+
+.avatar-img-box {
+  width: 180rpx;
+  height: 180rpx;
+  border-radius: 50%;
+  overflow: hidden;
+  padding: 5rpx;
+  box-shadow: 0 0 15rpx 5rpx #e8e8e8;
+}
+
+.avatar-img {
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
+}
+
+.avatar-line {
+  width: 100%;
+  height: 1px;
+  background-color: #e3e3e3;
+  margin-top: 50rpx;
+}
+
+
+/* 权限文字盒子 */
+.authorize-content-box {
+  margin: 80rpx 0;
+}
+
+.authorize-content-title {
+  font-size: 35rpx;
+  margin-bottom:40rpx;
+  color: #585858;
+}
+
+.authorize-content-text{
+  font-size:30rpx;
+  color: #888888;
+}
+
+
+/* 授权按钮盒子 */
+.authorize-btn{
+  margin-bottom: 25rpx;
+}
+

pages/login/login.js

@@ -1,93 +1,58 @@
 // pages/login/login.js
-const app = getApp();
+import {
+  login
+} from '~/services/login/login';
 
 Page({
   /**
    * 页面的初始数据
    */
   data: {
-    back: true,
+    bg_image: "",
-    code: '',
+    checked: true,
+    code: ""
   },
-  login() {
-    var that = this;
-    wx.getUserProfile({
-      //获取用户信息。页面产生点击事件（例如 button 上 bindtap 的回调中）后才可调用，每次请求都会弹出授权窗口，用户同意后返回 userInfo,用于替换 wx.getUserInfo
-      lang: 'zh_CN',
-      desc: '用于在后台更好的识别您的身份', //声明获取用户个人信息后的用途
-      success(user) {
-        //接口调用成功的回调函数
 
-        const data = {
+  // 获取手机号
-          encryptedData: user.encryptedData,
+  getPhoneNumber(e) {
-          iv: user.iv,
+    let that = this
-          // signature: user.signature,
+    if (e.detail.code) {
-          // rawData: user.rawData,
+      let phoneCode = e.detail.code
-          code: that.data.code,
+      let data = {
-        };
+        CustomerXcxOpenid: that.data.code,
-        // console.log(data);
+        Code: phoneCode
+      }
 
-        app.request({
+      // 登录请求
-          url: `login`,
+      login(data)
-          method: 'POST',
+    } else {}
-          data: data,
+  },
-          success: async function (res) {
-            // wx.setStorageSync('userInfo', res);
-            app.put('userInfo', res, 86400);
-            const userInfo = app.get('userInfo');
 
-            // 如果第一次登录就注册一个客户账号
+  // 跳转到手机号登录
-            app.request({
+  gotoPhoneRegister() {
-              url: `login/addCustomer`,
+    wx.navigateTo({
-              method: 'POST',
+      url: `/pages/login/phone-register/index`,
-              data: {
-                CustomerId: 0,
-                CustomerGuid: 0,
-                CustomerXcxOpenid: userInfo.openId,
-                CustomerXcxName: userInfo.nickName,
-                CustomerXcxImg: userInfo.avatarUrl,
-                CustomerSex: userInfo.gender,
-              },
-              success(res) {
-                app.put('Authorization', res.data, 86400);
-
-                const pages = getCurrentPages(); //获取小程序页面栈
-                const beforePage = pages[pages.length - 2]; //获取上个页面的实例对象  -3是上上一个页面
-                that.setData({
-                  back: false,
-                });
-                wx.navigateBack({
-                  delta: 2,
-                });
-                beforePage.onLoad();
-                // console.log(wx.getStorageSync('userInfo'));
-                wx.showToast({
-                  icon: 'success',
-                  title: '登录成功',
-                });
-              },
-            });
-          },
-        });
-      },
-      fail() {
-        wx.switchTab({
-          url: '/pages/home/home',
-        });
-      },
     });
   },
+
+  // 选择是否已同意
+  onChangeChecked() {
+    this.setData({
+      checked: !this.data.checked
+    })
+  },
+
   /**
    * 生命周期函数--监听页面加载
    */
   onLoad() {
-    var that = this;
+    let that = this
-
+    // 获取OpenId
     wx.login({
       success(res) {
         that.setData({
-          code: res.code,
+          code: res.code
-        });
+        })
       },
     });
   },
@@ -111,17 +76,9 @@ Page({
    * 生命周期函数--监听页面卸载
    */
   onUnload() {
-    var that = this;
+    wx.navigateTo({
-    //设置缓存允许下次跳转登录页
+      url: `/pages/home/home`
-    wx.setStorage({
-      key: 'isshowLogin',
-      data: false,
     });
-    if (that.data.back === true) {
-      wx.reLaunch({
-        url: '/pages/home/home',
-      });
-    }
   },
 
   /**

pages/login/login.json

@@ -1,4 +1,7 @@
 {
-  "usingComponents": {},
+  "usingComponents": {
+    "van-button": "@vant/weapp/button/index",
+    "van-checkbox": "@vant/weapp/checkbox/index"
+  },
   "navigationBarTitleText": "授权登录"
 }

pages/login/login.wxml

@@ -1,8 +1,30 @@
-<!--pages/login/login.wxml-->
+<!-- 登录页 -->
-<!-- <header backOptional="true">授权登录</header> -->
+
-<view class="loginBox">
+<!-- 背景图盒子 -->
-  <view class="title">授权登录</view>
+<view class="bg-box">
-  <view class="NeedText">快转铺请求授权以下消息</view>
+  <image class="bg-box-img" src="http://tool.aerwen.net/prod-api/Uploads/uploads/20230606/6CC15E3D7D4EB305.png" />
-  <view class="NeedLabel"><view></view>获取您的公开信息（名称、头像等）</view>
+</view>
-  <view class="button" bindtap="login">授权名称/头像</view>
+
+
+<!-- 登录盒子 -->
+<view class="login-pos-box">
+  <view class="login-container-box">
+    <view class="login-box">
+      <view class="login-btn-box">
+        <van-button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber" icon="wechat" type="primary" size="large" custom-style="font-size: 31rpx;font-weight: bold;" round block>微信一键登录</van-button>
+        <view class="mb-30"></view>
+        <van-button icon="phone" color="#eff0f1" size="large" custom-style="font-size: 31rpx;color: #999999;font-weight: bold;" round block bind:click="gotoPhoneRegister">手机号登录/注册</van-button>
+      </view>
+
+      <view class="agree-box">
+        <van-checkbox icon-size="35rpx" value="{{ checked }}" checked-color="#fc2e2a" bind:change="onChangeChecked"></van-checkbox>
+        <view class="agree-text">
+          我已阅读并同意
+          <span class="agree-link">《阿尔文电商用户协议》</span>  
+          <span class="agree-link">《阿尔文电商隐私政策》</span>
+        </view>
+      </view>
+
+    </view>
+  </view>
 </view>

pages/login/login.wxss

@@ -1,44 +1,61 @@
-/* pages/login/login.wxss */
+
-page{
+/* 背景图盒子 */
-  background-color: black;
+.bg-box{
-}
-.loginBox{
-  width: 75%;
-  display: flex;
-  flex-wrap: wrap;
-  margin: 0 auto;
-  padding: 30rpx;
-  margin-top: 50%;
-  background-color: white;
-}
-.loginBox .title{
   width: 100%;
-  text-align: center;
+  height: 100vh;
-  font-size: 38rpx;
+  position: absolute;
-  font-weight: 600;
+  top: 0;
-  margin-bottom: 5rpx;
+  left: 0;
+  overflow: hidden;
+  z-index: -1;
 }
 
-.loginBox .NeedLabel{
+.bg-box-img{
-  display: flex;
-  align-items: center;
-  color: rgb(190, 190, 190);
-  font-size: 30rpx;
-  margin: 15rpx 0;
-}
-.NeedLabel view{
-  width: 15rpx;
-  height: 15rpx;
-  border-radius: 50%;
-  margin-right: 15rpx;
-  background-color: rgb(190, 190, 190);
-}
-.loginBox .button{
   width: 100%;
-  text-align: center;
+  height: 100%;
-  padding: 25rpx 0;
+}
-  border-radius: 15rpx;
+
-  color: white;
+
-  font-size: 36rpx;
+
-  background-color: rgb(30, 153, 30);
+
+/* 登录盒子 */
+.login-pos-box{
+  height: 100vh;
+  position: relative;
+  display: flex;
+  justify-content: center;
+}
+
+.login-container-box{
+  width: 90%;
+  position: absolute;
+  bottom: 25%;
+  height: 430rpx;
+  background-color: white;
+  border-radius: 20rpx;
+}
+
+.login-box{
+  padding: 50rpx 40rpx;
+}
+
+.phone-btn{
+  color: black !important;
+  font-weight: bold;
+}
+
+.agree-box{
+  margin-top: 50rpx;
+  display: flex;
+}
+
+.agree-text{
+  font-size: 25rpx;
+  color: #555555;
+  margin-top: -3rpx;
+}
+
+.agree-link{
+  font-size: 26rpx;
+  color: red;
 }

pages/login/phone-register/index.js

@@ -0,0 +1,115 @@
+// pages/login/phone-register/index.js
+import {
+  sendPhoneCode
+} from '~/services/login/phone-register';
+
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    logoImg: "https://tool.aerwen.net/prod-api/Open/20230602/8969EAF2294B1FF4.png",
+    phoneNumber: "", //手机号
+    phoneError: false, // 手机号验证
+    verifyCode: "", //验证码
+  },
+
+
+  /** 发送验证码 */
+  send() {
+    if (!this.data.phoneNumber) {
+      wx.showToast({
+        icon: 'error',
+        title: '请输入手机号',
+      });
+      return;
+    }
+    const isPhoneNumber = /^[1][3,4,5,7,8,9][0-9]{9}$/.test(this.data.phoneNumber);
+    if(!isPhoneNumber){
+      wx.showToast({
+        icon: 'error',
+        title: '手机号格式不正确',
+      });
+      return;
+    }
+
+    let data = {
+      PhoneNumber: this.data.phoneNumber,
+    }
+    sendPhoneCode(data)
+  },
+
+
+  /** 手机号验证 */
+  onPhoneInput(e) {
+    const {
+      phoneError
+    } = this.data;
+    const isPhoneNumber = /^[1][3,4,5,7,8,9][0-9]{9}$/.test(e.detail.value);
+    if (phoneError === isPhoneNumber) {
+      this.setData({
+        phoneError: !isPhoneNumber,
+        phoneNumber: e.detail.value,
+      });
+    }
+  },
+
+
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/login/phone-register/index.json

@@ -0,0 +1,7 @@
+{
+  "usingComponents": {
+    "t-input": "tdesign-miniprogram/input/input",
+    "van-button": "@vant/weapp/button/index"
+  },
+  "navigationBarTitleText": ""
+}

pages/login/phone-register/index.wxml

@@ -0,0 +1,50 @@
+<!-- 手机号登录页 -->
+
+<view class="phone-register-pos-box">
+
+  <!-- Logo盒子 -->
+  <view class="logo-box">
+    <view class="logo-img-box">
+      <image class="logo-img" src="{{logoImg}}" mode="heightFix" />
+    </view>
+    <view class="logo-title">阿尔文电商</view>
+    <view class="logo-text">一家有感情的电商模板</view>
+  </view>
+
+
+  <!-- 表单 -->
+  <view class="register-form">
+    <view class="register-form-box">
+      <!-- 手机号 -->
+      <t-input
+      value="{{phoneNumber}}"
+      placeholder="请输入手机号"
+      borderless="{{true}}"
+      style="border-radius: 100rpx; background-color: #f3f4f6;margin-bottom: 50rpx;height: 50rpx;"
+      tips="{{phoneError ? '手机号输入不正确' : ''}}"
+      bindchange="onPhoneInput"
+    />
+
+    <!-- 验证码 -->
+    <t-input
+      placeholder="请输入验证码"
+      value="{{verifyCode}}"
+      borderless="{{true}}"
+      style="border-radius: 100rpx; background-color: #f3f4f6; height: 50rpx;"
+    >
+      <view slot="suffix" style="display: flex; align-items: center">
+        <view class="suffix--line"></view>
+        <van-button size="small" round type="info" bind:click="send">发送验证码</van-button>
+      </view>
+    </t-input>
+
+    <!-- 提交按钮 -->
+    <view class="submit-btn">
+      <van-button type="info" size="large" round block>登录/注册</van-button>
+    </view>
+
+    </view>
+  </view>
+
+
+</view>

pages/login/phone-register/index.wxss

@@ -0,0 +1,43 @@
+/* 手机号登录页Css */
+
+/* Logo盒子 */
+.logo-box{
+  margin-top: 50rpx;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  align-items: center;
+  text-align: center;
+}
+
+.logo-img{
+  width: 230rpx;
+  height: 230rpx;
+}
+
+.logo-title{
+  font-size: 40rpx;
+  letter-spacing: 4rpx;
+  font-weight: bold;
+}
+
+.logo-text{
+  font-size: 28rpx;
+  margin-top: 20rpx;
+  color: #999999;
+  letter-spacing: 2rpx;
+}
+
+
+/* 表单 */
+.register-form{
+  margin-top: 100rpx;
+}
+.register-form-box{
+  width: 90%;
+  margin: 0 auto;
+}
+
+.submit-btn{
+  margin-top: 50rpx;
+}

pages/usercenter/components/user-center-card/index.js

@@ -31,5 +31,8 @@ Component({
     gotoUserEditPage() {
       this.triggerEvent('gotoUserEditPage');
     },
+    gotoLogin(){
+      wx.navigateTo({ url: '/pages/login/login' });
+    }
   },
 });

pages/usercenter/components/user-center-card/index.wxml

@@ -1,7 +1,11 @@
+<wxs module="phoneReg">
+  var toHide = function (array) { var mphone = array.substring(0, 3) + '****' + array.substring(7); return mphone; }
+  module.exports.toHide = toHide;
+</wxs>
 <view class="user-center-card">
   <!-- 未登录的情况 -->
   <block wx:if="{{currAuthStep === AuthStepType.ONE}}">
-    <view class="user-center-card__header" bind:tap="gotoUserEditPage">
+    <view class="user-center-card__header" bind:tap="gotoLogin">
       <t-avatar image="{{userInfo.avatarUrl || defaultAvatarUrl}}" class="user-center-card__header__avatar" />
       <view class="user-center-card__header__name">{{'请登录'}}</view>
     </view>
@@ -10,7 +14,10 @@
   <block wx:if="{{currAuthStep === AuthStepType.TWO}}">
     <view class="user-center-card__header">
       <t-avatar image="{{userInfo.avatarUrl || defaultAvatarUrl}}" class="user-center-card__header__avatar" />
-      <view class="user-center-card__header__name">{{userInfo.nickName || '微信用户'}}</view>
+      <view class="user-center-card__heade__text__box">
+        <view class="user-center-card__header__name">{{userInfo.nickName || '微信用户'}}</view>
+        <view class="user-center-card__header__phone">{{phoneReg.toHide(userInfo.phoneNumber || '')}}</view>
+      </view>
       <!-- 需要授权用户信息，通过slot添加弹窗 -->
       <view class="user-center-card__header__transparent" wx:if="{{isNeedGetUserInfo}}">
         <slot name="getUserInfo" />
@@ -22,13 +29,12 @@
   <!-- 已登录且已经授权用户信息的情况 -->
   <block wx:if="{{currAuthStep === AuthStepType.THREE}}">
     <view class="user-center-card__header" bind:tap="gotoUserEditPage">
-      <t-avatar
+      <t-avatar t-class="avatar" mode="aspectFill" class="user-center-card__header__avatar" image="{{userInfo.avatarUrl || defaultAvatarUrl}}" />
-        t-class="avatar"
-        mode="aspectFill"
-        class="user-center-card__header__avatar"
-        image="{{userInfo.avatarUrl || defaultAvatarUrl}}"
-      />
       <view class="user-center-card__header__name">{{userInfo.nickName || '微信用户'}}</view>
+      <view class="user-center-card__heade__text__box">
+        <view class="user-center-card__header__name">{{userInfo.nickName || '微信用户'}}</view>
+        <view class="user-center-card__header__phone">{{phoneReg.toHide(userInfo.phoneNumber || '')}}</view>
+      </view>
     </view>
   </block>
 </view>

pages/usercenter/components/user-center-card/index.wxss

@@ -7,7 +7,7 @@
   background-image: url('https://cdn-we-retail.ym.tencent.com/miniapp/template/user-center-bg-v1.png');
   background-size: cover;
   background-repeat: no-repeat;
-  padding: 0 24rpx;
+  padding: 0 35rpx;
 }
 .user-center-card__header {
   margin-top: 192rpx;
@@ -27,14 +27,23 @@
   overflow: hidden;
 }
 
+.user-center-card__heade__text__box{
+  margin-left: 24rpx;
+}
+
 .user-center-card__header__name {
   font-size: 36rpx;
   line-height: 48rpx;
   color: #333;
   font-weight: bold;
-  margin-left: 24rpx;
   margin-right: 16rpx;
 }
+.user-center-card__header__phone {
+  font-size: 30rpx;
+  margin-right: 16rpx;
+  margin-top: 5rpx;
+}
+
 .user-center-card__header__transparent {
   position: absolute;
   left: 0;

pages/usercenter/index.js

@@ -1,4 +1,4 @@
-import { fetchUserCenter } from '../../services/usercenter/fetchUsercenter';
+import { fetchUserCenter } from '~/services/usercenter/fetchUsercenter';
 import Toast from 'tdesign-miniprogram/toast/index';
 
 const menuData = [
@@ -21,6 +21,12 @@ const menuData = [
       url: '',
       type: 'point',
     },
+    {
+      title: '设置',
+      tit: '',
+      url: '',
+      type: 'set',
+    },
   ],
   [
     {
@@ -111,32 +117,34 @@ Page({
     this.fetUseriInfoHandle();
   },
 
+  /** 获取客户信息 */ 
   fetUseriInfoHandle() {
     fetchUserCenter().then(
       ({
         userInfo,
-        countsData,
+        // countsData,
-        orderTagInfos: orderInfo,
+        // orderTagInfos: orderInfo,
-        customerServiceInfo,
+        // customerServiceInfo,
       }) => {
+        /** 用户订单数据 */
         // eslint-disable-next-line no-unused-expressions
-        menuData?.[0].forEach((v) => {
+        // menuData?.[0].forEach((v) => {
-          countsData.forEach((counts) => {
+        //   countsData.forEach((counts) => {
-            if (counts.type === v.type) {
+        //     if (counts.type === v.type) {
-              // eslint-disable-next-line no-param-reassign
+        //       // eslint-disable-next-line no-param-reassign
-              v.tit = counts.num;
+        //       v.tit = counts.num;
-            }
+        //     }
-          });
+        //   });
-        });
+        // });
-        const info = orderTagInfos.map((v, index) => ({
+        // const info = orderTagInfos.map((v, index) => ({
-          ...v,
+        //   ...v,
-          ...orderInfo[index],
+        //   ...orderInfo[index],
-        }));
+        // }));
         this.setData({
           userInfo,
-          menuData,
+          // menuData,
-          orderTagInfos: info,
+          // orderTagInfos: info,
-          customerServiceInfo,
+          // customerServiceInfo,
           currAuthStep: 2,
         });
         wx.stopPullDownRefresh();
@@ -180,6 +188,10 @@ Page({
         wx.navigateTo({ url: '/pages/coupon/coupon-list/index' });
         break;
       }
+      case 'set': {
+        wx.navigateTo({ url: '/pages/usercenter/set/index' });
+        break;
+      }
       default: {
         Toast({
           context: this,
@@ -226,7 +238,7 @@ Page({
     if (currAuthStep === 2) {
       wx.navigateTo({ url: '/pages/usercenter/person-info/index' });
     } else {
-      this.fetUseriInfoHandle();
+      // this.fetUseriInfoHandle();
     }
   },
 

pages/usercenter/index.wxml

@@ -7,6 +7,7 @@
   currAuthStep="{{currAuthStep}}"
   bind:gotoUserEditPage="gotoUserEditPage"
 />
+
 <view class="content-wrapper">
   <view class="order-group-wrapper">
     <t-order-group orderTagInfos="{{orderTagInfos}}" bind:onClickTop="jumpAllOrder" bind:onClickItem="jumpNav" />

pages/usercenter/set/index.js

@@ -0,0 +1,76 @@
+// pages/usercenter/set/index.js
+import { logout } from '~/services/usercenter/set/logout';
+
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+
+  },
+
+
+
+  /** 登出 */
+  logOut(){
+    console.log(111);
+    logout();
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad(options) {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage() {
+
+  }
+})

pages/usercenter/set/index.json

@@ -0,0 +1,6 @@
+{
+  "usingComponents": {
+    "van-button": "@vant/weapp/button/index"
+  },
+  "navigationBarTitleText": "设置"
+}

pages/usercenter/set/index.wxml

@@ -0,0 +1,12 @@
+<!-- 设置页 -->
+
+<view class="set-pos-box">
+  
+
+
+  <!-- 退出登录按钮 -->
+  <view class="log-out-btn-box">
+    <van-button block round bind:click="logOut">退出当前账号</van-button>
+  </view>
+
+</view>

pages/usercenter/set/index.wxss

@@ -0,0 +1,11 @@
+/* pages/usercenter/set/index.wxss */
+
+
+
+
+.log-out-btn-box{
+  width:85%;
+  position: absolute;
+  bottom: 10%;
+  left: 8%;
+}

services/_utils/request.js

@@ -1,4 +1,9 @@
-const ServerBasePath = 'https://localhost:8888/api/';
+import {
+  setStorage,
+  getStorage
+} from '~/utils/storage'
+
+const ServerBasePath = 'http://localhost:8888/api/';
 
 // 网络请求封装
 export function request(option) {
@@ -17,17 +22,15 @@ export function request(option) {
     (option,
     {
       header: {
-        Authorization: `Bearer ${that.get('Authorization')}`,
+        Authorization: `Bearer ${getStorage('Authorization')}`,
       },
       timeout: 30000, //设置超时时间
       url: ServerBasePath + url,
       data: data,
       method: method,
       success: function (res) {
-        // var pages = getCurrentPages(); // 获取页面指针数组
-        // var currentPage = pages[pages.length - 2]; // 获取当前页
         if (res.data.Code === 401) {
-          const userInfo = that.get('userInfo');
+          const userInfo = getStorage('userInfo');
           //初次跳转登录页
           if (!userInfo) {
             wx.navigateTo({

services/login/login.js

@@ -1 +1,32 @@
-// import { request } from '../_utils/request';
+import {
+  request
+} from '../_utils/request';
+import {
+  setStorage,
+  getStorage
+} from '~/utils/storage'
+
+/** 登录 */
+export function login(data) {
+
+  request({
+    url: `WeChatLogin/Login`,
+    method: 'POST',
+    data: data,
+    success: async function (res) {
+      setStorage('userInfo', res.data.user, 86400);
+      setStorage('Authorization', res.data.jwt, 86400);
+      const pages = getCurrentPages(); //获取小程序页面栈
+      const beforePage = pages[pages.length - 1]; //获取上个页面的实例对象  -3是上上一个页面
+      wx.navigateBack({
+        delta: 2,
+      });
+      beforePage.onLoad();
+      wx.showToast({
+        icon: 'success',
+        title: '登录成功',
+      });
+    },
+  });
+
+}

services/login/phone-register.js

@@ -0,0 +1,21 @@
+import {
+  request
+} from '../_utils/request';
+import {
+  setStorage,
+  getStorage
+} from '~/utils/storage'
+
+/** 发送验证码 */
+export function sendPhoneCode(data) {
+
+  request({
+    url: `WeChatLogin/sendPhoneCode`,
+    method: 'POST',
+    data: data,
+    success: async function (res) {
+      
+    },
+  });
+
+}

services/usercenter/fetchUsercenter.js

@@ -1,18 +1,31 @@
-import { config } from '../../config/index';
+import {
-
+  request
-/** 获取个人中心信息 */
+} from '../_utils/request';
-function mockFetchUserCenter() {
+import {
-  const { delay } = require('../_utils/delay');
+  getStorage
-  const { genUsercenter } = require('../../model/usercenter');
+} from '~/utils/storage'
-  return delay(200).then(() => genUsercenter());
+const userData = getStorage('userInfo');
-}
 
 /** 获取个人中心信息 */
 export function fetchUserCenter() {
-  if (config.useMock) {
+  return new Promise((resolve, reject) => {
-    return mockFetchUserCenter();
+    request({
-  }
+      url: `CustomerApi/getCustomerDetails?CustomerGuid=` + userData?.customerGuid,
-  return new Promise((resolve) => {
+      method: 'GET',
-    resolve('real api');
+      success: function (res) {
+        let userInfo = res.data;
+        let data = {
+          userInfo: {
+            avatarUrl: userInfo.customerAvatar,
+            nickName: userInfo.customerNickname,
+            phoneNumber: userInfo.customerMobilePhoneNumber,
+          }
+        };
+        resolve(data);
+      },
+      fail: function (error) {
+        reject(error);
+      }
+    });
   });
 }

services/usercenter/set/logout.js

@@ -0,0 +1,38 @@
+import {
+  request
+} from '~/services/_utils/request'
+import {
+  removeStorage
+} from '~/utils/storage'
+
+/** 登出 */
+export function logout() {
+  return new Promise((resolve, reject) => {
+    request({
+      url: `WeChatLogin/logout`,
+      method: 'POST',
+      success: function (res) {
+
+        // 清空登录信息缓存
+        removeStorage('userInfo')
+        removeStorage('Authorization')
+
+        // 回到上一页
+        const pages = getCurrentPages(); //获取小程序页面栈
+        const beforePage = pages[pages.length - 1]; //获取上个页面的实例对象  -3是上上一个页面
+        wx.navigateBack({
+          delta: 2,
+        });
+        beforePage.onLoad();
+        wx.showToast({
+          icon: 'success',
+          title: '登出成功',
+        });
+        resolve(res);
+      },
+      fail: function (error) {
+        reject(error);
+      }
+    });
+  });
+}

style/theme.wxss

@@ -45,3 +45,15 @@
 .dialog__button-cancel {
   color: #aeb3b7 !important;
 }
+
+.mt-25{
+  margin-top: 25rpx;
+}
+
+.mb-25{
+  margin-bottom: 25rpx;
+}
+
+.mb-30{
+  margin-bottom: 30rpx;
+}

utils/storage.js

@@ -1,3 +1,5 @@
+const redis= "redis"
+
 /**
  * 设置存储
  * k 键key