:four_leaf_clover: 用户注册,前端

mini-app/pages/auth/login/login.js

@@ -1,106 +0,0 @@
-var api = require('../../../config/api.js');
-var app = getApp();
-Page({
-  data: {
-    username: '',
-    password: '',
-    code: '',
-    loginErrorCount: 0
-  },
-  onLoad: function (options) {
-    // 页面初始化 options为页面跳转所带来的参数
-    // 页面渲染完成
-
-  },
-  onReady: function () {
-
-  },
-  onShow: function () {
-    // 页面显示
-  },
-  onHide: function () {
-    // 页面隐藏
-
-  },
-  onUnload: function () {
-    // 页面关闭
-
-  },
-  startLogin: function () {
-    var that = this;
-
-    if (that.data.password.length < 1 || that.data.username.length < 1) {
-      wx.showModal({
-        title: '错误信息',
-        content: '请输入用户名和密码',
-        showCancel: false
-      });
-      return false;
-    }
-
-    wx.request({
-      url: api.ApiRootUrl + 'auth/login',
-      data: {
-        username: that.data.username,
-        password: that.data.password
-      },
-      method: 'POST',
-      header: {
-        'content-type': 'application/json'
-      },
-      success: function (res) {
-        if(res.data.code == 200){
-          that.setData({
-            'loginErrorCount': 0
-          });
-          wx.setStorage({
-            key:"token",
-            data: res.data.data.token,
-            success: function(){
-              wx.switchTab({
-                url: '/pages/ucenter/index/index'
-              });
-            }
-          });
-        }
-      }
-    });
-  },
-  bindUsernameInput: function (e) {
-
-    this.setData({
-      username: e.detail.value
-    });
-  },
-  bindPasswordInput: function (e) {
-
-    this.setData({
-      password: e.detail.value
-    });
-  },
-  bindCodeInput: function (e) {
-
-    this.setData({
-      code: e.detail.value
-    });
-  },
-  clearInput: function (e) {
-    switch (e.currentTarget.id) {
-      case 'clear-username':
-        this.setData({
-          username: ''
-        });
-        break;
-      case 'clear-password':
-        this.setData({
-          password: ''
-        });
-        break;
-      case 'clear-code':
-        this.setData({
-          code: ''
-        });
-        break;
-    }
-  }
-})

mini-app/pages/auth/login/login.wxml

@@ -1,30 +0,0 @@
-<view class="container">
-    <view class="form-box">
-
-    	<view class="form-item">
-    		<input class="username" value="{{username}}" bindinput="bindUsernameInput" placeholder="账号" auto-focus/>
-    		<image wx:if="{{ username.length > 0 }}" id="clear-username" class="clear" src="/static/images/clear_input.png" catchtap="clearInput"></image>
-    	</view>
-
-    	<view class="form-item">
-    		<input class="password" value="{{password}}" password bindinput="bindPasswordInput" placeholder="密码"/>
-    		<image class="clear" id="clear-password" wx:if="{{ password.length > 0 }}" src="/static/images/clear_input.png" catchtap="clearInput"></image>
-    	</view>
-
-		<view class="form-item-code" wx-if="{{loginErrorCount >= 3}}">
-			<view class="form-item code-item">
-				<input class="code" value="{{code}}" bindinput="bindCodeInput" placeholder="验证码"/>
-				<image class="clear" id="clear-code" wx:if="{{ code.length > 0 }}" src="/static/images/clear_input.png" catchtap="clearInput"></image>
-			</view>
-			<image class="code-img" src="https://dl.reg.163.com/cp?pd=yanxuan_web&pkid=SkeBZeG&random=1489903563234"></image>
-		</view>
-
-    	<button type="default" class="login-btn" bindtap="startLogin">登录</button>
-
-    	<view class="form-item-text">
-    		<navigator url="/pages/auth/register/register" class="register">注册账号</navigator>
-			<navigator url="/pages/auth/reset/reset" class="reset">忘记密码</navigator>
-    	</view>
-
-    </view>
-</view>

mini-app/pages/auth/login/login.wxss

@@ -1,89 +0,0 @@
-.form-box{
-    width: 100%;
-    height: auto;
-    overflow: hidden;
-    padding: 0 40rpx;
-    margin-top: 96rpx;
-    background: #fff;
-}
-
-.form-item{
-    position: relative;
-    background: #fff;
-    height: 96rpx;
-    border-bottom: 1px solid #d9d9d9;
-}
-
-.form-item .username, .form-item .password, .form-item .code{
-    position: absolute;
-    top: 26rpx;
-    left: 0;
-    display: block;
-    width: 100%;
-    height: 44rpx;
-    background: #fff;
-    color: #333;
-    font-size: 30rpx;
-}
-
-.form-item-code{
-    margin-top:32rpx;
-    height: auto;
-    overflow: hidden;
-    width: 100%;
-}
-
-.form-item-code .form-item{
-    float: left;
-    width: 350rpx;
-}
-
-.form-item-code .code-img{
-    float: right;
-    margin-top: 4rpx;
-    height: 88rpx;
-    width: 236rpx;
-}
-
-.form-item .clear{
-    position: absolute;
-    top: 26rpx;
-    right: 18rpx;
-    z-index: 2;
-    display: block;
-    background: #fff;
-    height: 44rpx;
-    width: 44rpx;
-}
-
-.login-btn{
-    margin: 60rpx 0 40rpx 0;
-    height: 96rpx;
-    line-height: 96rpx;
-    color: #fff;
-    font-size: 30rpx;
-    width: 100%;
-    background: #b4282d;
-    border-radius: 6rpx;
-}
-
-.form-item-text{
-    height: 35rpx;
-    width: 100%;
-}
-
-.form-item-text .register{
-    display: block;
-    height: 34rpx;
-    float: left;
-    font-size: 28rpx;
-    color: #999;
-}
-
-.form-item-text .reset{
-    display: block;
-    height: 34rpx;
-    float: right;
-    font-size: 28rpx;
-    color: #999;
-}

mini-app/pages/auth/register/register.js

@@ -1,130 +0,0 @@
-var api = require('../../../config/api.js');
-var app = getApp();
-Page({
-  data: {
-    username: '',
-    password: '',
-    confirmPassword: '',
-    code: '',
-    loginErrorCount: 0
-  },
-  onLoad: function (options) {
-    // 页面初始化 options为页面跳转所带来的参数
-    // 页面渲染完成
-
-  },
-  onReady: function () {
-
-  },
-  onShow: function () {
-    // 页面显示
-
-  },
-  onHide: function () {
-    // 页面隐藏
-
-  },
-  onUnload: function () {
-    // 页面关闭
-
-  },
-  startRegister: function () {
-    var that = this;
-
-    if (that.data.password.length < 3 || that.data.username.length < 3) {
-      wx.showModal({
-        title: '错误信息',
-        content: '用户名和密码不得少于3位',
-        showCancel: false
-      });
-      return false;
-    }
-
-    if (that.data.password != that.data.confirmPassword) {
-      wx.showModal({
-        title: '错误信息',
-        content: '确认密码不一致',
-        showCancel: false
-      });
-      return false;
-    }
-
-    wx.request({
-      url: api.ApiRootUrl + 'auth/register',
-      data: {
-        username: that.data.username,
-        password: that.data.password
-      },
-      method: 'POST',
-      header: {
-        'content-type': 'application/json'
-      },
-      success: function (res) {
-        if (res.data.code == 200) {
-          that.setData({
-            'loginErrorCount': 0
-          });
-          wx.setStorage({
-            key: "token",
-            data: res.data.data.token,
-            success: function () {
-              wx.switchTab({
-                url: '/pages/ucenter/index/index'
-              });
-            }
-          });
-
-        }
-        console.log(res.data.data.token)
-      }
-    });
-  },
-  bindUsernameInput: function (e) {
-
-    this.setData({
-      username: e.detail.value
-    });
-  },
-  bindPasswordInput: function (e) {
-
-    this.setData({
-      password: e.detail.value
-    });
-  },
-  bindConfirmPasswordInput: function (e) {
-
-    this.setData({
-      confirmPassword: e.detail.value
-    });
-  },
-  bindCodeInput: function (e) {
-
-    this.setData({
-      code: e.detail.value
-    });
-  },
-  clearInput: function (e) {
-    switch (e.currentTarget.id) {
-      case 'clear-username':
-        this.setData({
-          username: ''
-        });
-        break;
-      case 'clear-password':
-        this.setData({
-          password: ''
-        });
-        break;
-      case 'clear-confirm-password':
-        this.setData({
-          confirmPassword: ''
-        });
-        break;
-      case 'clear-code':
-        this.setData({
-          code: ''
-        });
-        break;
-    }
-  }
-})

mini-app/pages/auth/register/register.json

@@ -1 +0,0 @@
-{}

mini-app/pages/auth/register/register.wxml

@@ -1,30 +0,0 @@
-<view class="container">
-    <view class="form-box">
-
-    	<view class="form-item">
-    		<input class="username" value="{{username}}" bindinput="bindUsernameInput" placeholder="用户名" auto-focus/>
-    		<image wx:if="{{ username.length > 0 }}" id="clear-username" class="clear" src="/static/images/clear_input.png" catchtap="clearInput"></image>
-    	</view>
-
-    	<view class="form-item">
-    		<input class="password" value="{{password}}" password bindinput="bindPasswordInput" placeholder="密码"/>
-    		<image class="clear" id="clear-password" wx:if="{{ password.length > 0 }}" src="/static/images/clear_input.png" catchtap="clearInput"></image>
-    	</view>
-
-        <view class="form-item">
-    		<input class="password" value="{{confirmPassword}}" password bindinput="bindConfirmPasswordInput" placeholder="确认密码"/>
-    		<image class="clear" id="clear-confirm-password" wx:if="{{ confirmPassword.length > 0 }}" src="/static/images/clear_input.png" catchtap="clearInput"></image>
-    	</view>
-
-		<view class="form-item-code" >
-			<view class="form-item code-item">
-				<input class="code" value="{{code}}" bindinput="bindCodeInput" placeholder="验证码"/>
-				<image class="clear" id="clear-code" wx:if="{{ code.length > 0 }}" src="/static/images/clear_input.png" catchtap="clearInput"></image>
-			</view>
-			<image class="code-img" src="https://dl.reg.163.com/cp?pd=yanxuan_web&pkid=SkeBZeG&random=1489903563234"></image>
-		</view>
-
-    	<button type="default" class="login-btn" bindtap="startRegister">注册</button>
-
-    </view>
-</view>

mini-app/pages/auth/reset/reset.js

@@ -1,56 +0,0 @@
-var app = getApp();
-Page({
-  data: {
-    username: '',
-    code: ''
-  },
-  onLoad: function (options) {
-    // 页面初始化 options为页面跳转所带来的参数
-    // 页面渲染完成
-    
-  },
-  onReady: function () {
-
-  },
-  onShow: function () {
-    // 页面显示
-
-  },
-  onHide: function () {
-    // 页面隐藏
-
-  },
-  onUnload: function () {
-    // 页面关闭
-
-  },
-  startLogin: function(){
-    var that = this;
-  },
-  bindUsernameInput: function(e){
-    
-    this.setData({
-      username: e.detail.value
-    });
-  },
-  bindCodeInput: function(e){
-    
-    this.setData({
-      code: e.detail.value
-    });
-  },
-  clearInput: function(e){
-    switch (e.currentTarget.id){
-      case 'clear-username':
-        this.setData({
-          username: ''
-        });
-        break;
-        case 'clear-code':
-        this.setData({
-          code: ''
-        });
-        break;
-    }
-  }
-})

mini-app/pages/auth/reset/reset.json

@@ -1 +0,0 @@
-{}

mini-app/pages/auth/reset/reset.wxml

@@ -1,20 +0,0 @@
-<view class="container">
-    <view class="form-box">
-
-    	<view class="form-item">
-    		<input class="username" value="{{username}}" bindinput="bindUsernameInput" placeholder="请输入账号" auto-focus/>
-    		<image wx:if="{{ username.length > 0 }}" id="clear-username" class="clear" src="/static/images/clear_input.png" catchtap="clearInput"></image>
-    	</view>
-
-		<view class="form-item-code" >
-			<view class="form-item code-item">
-				<input class="code" value="{{code}}" bindinput="bindCodeInput" placeholder="验证码"/>
-				<image class="clear" id="clear-code" wx:if="{{ code.length > 0 }}" src="/static/images/clear_input.png" catchtap="clearInput"></image>
-			</view>
-			<image class="code-img" src="https://dl.reg.163.com/cp?pd=yanxuan_web&pkid=SkeBZeG&random=1489903563234"></image>
-		</view>
-
-    	<button type="default" class="login-btn" bindtap="startNext">下一步</button>
-
-    </view>
-</view>

mini-app/pages/auth/reset/reset.wxss

@@ -1,68 +0,0 @@
-.form-box{
-    width: 100%;
-    height: auto;
-    overflow: hidden;
-    padding: 0 40rpx;
-    margin-top: 96rpx;
-    background: #fff;
-}
-
-.form-item{
-    position: relative;
-    background: #fff;
-    height: 96rpx;
-    border-bottom: 1px solid #d9d9d9;
-}
-
-.form-item .username, .form-item .code{
-    position: absolute;
-    top: 26rpx;
-    left: 0;
-    display: block;
-    width: 100%;
-    height: 44rpx;
-    background: #fff;
-    color: #333;
-    font-size: 30rpx;
-}
-
-.form-item-code{
-    margin-top:32rpx;
-    height: auto;
-    overflow: hidden;
-    width: 100%;
-}
-
-.form-item-code .form-item{
-    float: left;
-    width: 350rpx;
-}
-
-.form-item-code .code-img{
-    float: right;
-    margin-top: 4rpx;
-    height: 88rpx;
-    width: 236rpx;
-}
-
-.form-item .clear{
-    position: absolute;
-    top: 26rpx;
-    right: 18rpx;
-    z-index: 2;
-    display: block;
-    background: #fff;
-    height: 44rpx;
-    width: 44rpx;
-}
-
-.login-btn{
-    margin: 60rpx 0 40rpx 0;
-    height: 96rpx;
-    line-height: 96rpx;
-    color: #fff;
-    font-size: 30rpx;
-    width: 100%;
-    background: #b4282d;
-    border-radius: 6rpx;
-}

mini-app/app.json → wx-front/app.json

@@ -13,9 +13,6 @@
     "pages/ucenter/feedback/feedback",
     "pages/ucenter/coupon/coupon",
     "pages/ucenter/collect/collect",
-    "pages/auth/login/login",
-    "pages/auth/register/register",
-    "pages/auth/reset/reset",
     "pages/pay/pay",
     "pages/payResult/payResult",
     "pages/ucenter/index/index",
@@ -32,7 +29,8 @@
     "pages/shopping/address/address",
     "pages/shopping/addressAdd/addressAdd",
     "pages/goods/goods",
-    "pages/topicDetail/topicDetail"
+    "pages/topicDetail/topicDetail",
+    "pages/auth/auth"
   ],
   "window": {
     "backgroundTextStyle": "dark",

mini-app/config/api.js → wx-front/config/api.js

@@ -1,5 +1,5 @@
 //const ApiRootUrl = 'https://23788fbf.ngrok.io/';
-const ApiRootUrl = 'http://127.0.0.1:8804/';
+const ApiRootUrl = 'http://127.0.0.1:8803/';
 
 module.exports = {
   IndexUrl: ApiRootUrl + 'index/index', //首页数据接口

wx-front/pages/auth/auth.js

@@ -0,0 +1,120 @@
+// pages/auth/auth.js
+var app = getApp();
+var api = require('../../config/api.js');
+var util = require('../../utils/util.js');
+Page({
+
+  /**
+   * 页面的初始数据
+   */
+  data: {
+    userInfo: app.globalData.userInfo,
+    hasUserInfo: false,
+    canIUse: wx.canIUse('button.open-type.getUserInfo')
+  },
+
+  /**
+   * 生命周期函数--监听页面加载
+   */
+  onLoad: function(options) {
+
+  },
+
+  startLogin: function(e) {
+    console.log(e);
+    this.login(e.detail).then((userInfo) => {
+      this.setData({
+        userInfo: userInfo,
+        hasUserInfo: true
+      })
+    });
+  },
+
+  login: function (detail) {
+    let code = null;
+    return new Promise(function (resolve, reject) {
+      return util.login().then((res) => {
+        code = res.code;
+      }).then(() => {
+        //登录远程服务器
+        util.request(api.AuthLoginByWeixin, {
+          code: code,
+          detail: detail,
+          firstLogin: true
+        }, 'POST').then(res => {
+          if (res.errno === 0) {
+            //存储用户信息
+            wx.setStorageSync('userInfo', res.data.userInfo);
+            wx.setStorageSync('token', res.data.token);
+
+            //反应到当前登录
+            app.globalData.userInfo = res.data.userInfo;
+            app.globalData.token = res.data.token;
+
+            resolve(res.data.userInfo);
+          } else {
+            reject(res.data.userInfo);
+          }
+        }).catch((err) => { //request
+          reject(err);
+        });
+      }).catch((err) => {   //login
+        reject(err);
+      })
+    });
+  },
+  goback: function () {
+    wx.navigateBack({
+      delta: 1
+    })
+  },
+
+  /**
+   * 生命周期函数--监听页面初次渲染完成
+   */
+  onReady: function() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面显示
+   */
+  onShow: function() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面隐藏
+   */
+  onHide: function() {
+
+  },
+
+  /**
+   * 生命周期函数--监听页面卸载
+   */
+  onUnload: function() {
+
+  },
+
+  /**
+   * 页面相关事件处理函数--监听用户下拉动作
+   */
+  onPullDownRefresh: function() {
+
+  },
+
+  /**
+   * 页面上拉触底事件的处理函数
+   */
+  onReachBottom: function() {
+
+  },
+
+  /**
+   * 用户点击右上角分享
+   */
+  onShareAppMessage: function() {
+
+  }
+})

wx-front/pages/auth/auth.wxml

@@ -0,0 +1,20 @@
+<view class="container">
+  <view class="form-box">
+
+    <view class="userinfo">
+      <block>
+        <image class="userinfo-avatar" src="{{userInfo.avatar}}" mode="cover"></image>
+        <text class="userinfo-nickname">{{userInfo.nickname}}</text>
+      </block>
+    </view>
+
+    <!-- 不能用 open-type="getUserInfo" 的版本 -->
+    <button wx:if="{{!canIUse}}" class="btn" disabled="true" >微信版本过低,请更新后再尝试授权</button>
+    
+    <button wx:elif="{{!hasUserInfo}}" class="btn" open-type="getUserInfo" bindgetuserinfo="startLogin">授权登录</button>
+    <button wx:else disabled="true" class="btn">授权成功</button>
+
+    <button type="default" class="btn" bindtap="goback">返回上一页</button>
+
+  </view>
+</view>

mini-app/pages/auth/register/register.wxss → wx-front/pages/auth/auth.wxss

@@ -56,14 +56,14 @@
     width: 44rpx;
 }
 
-.login-btn{
+.btn{
     margin: 60rpx 0 40rpx 0;
     height: 96rpx;
     line-height: 96rpx;
     color: #fff;
     font-size: 30rpx;
     width: 100%;
-    background: #b4282d;
+    background: #ef5a5a;
     border-radius: 6rpx;
 }
 
@@ -86,4 +86,21 @@
     float: right;
     font-size: 28rpx;
     color: #999;
+}
+
+.userinfo {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
+.userinfo-avatar {
+  width: 128rpx;
+  height: 128rpx;
+  margin: 20rpx;
+  border-radius: 50%;
+}
+
+.userinfo-nickname {
+  color: #aaa;
 }

mini-app/pages/search/search.wxml → wx-front/pages/search/search.wxml

@@ -22,6 +22,8 @@
       <text class="title">热门搜索</text>
     </view>
     <view class="b">
+    <view class="item active" hover-class="navigator-hover">aa</view>
+    <view  class="item" hover-class="navigator-hover">aa</view>
       <view class="item {{item.is_hot === 1 ? 'active' : ''}}" hover-class="navigator-hover" bindtap="onKeywordTap" data-keyword="{{item.keyword}}" wx:for="{{hotKeyword}}">{{item.keyword}}</view>
     </view>
   </view>