重写登录和注册

app/api/mobile/apis/users.rb

@@ -4,6 +4,17 @@ module Mobile
     class Users < Grape::API
       resource :users do
 
+
+        desc "绑定微信用户"
+        params do
+          requires :login, type: String, desc: 'username'
+          requires :mail, type: String, desc: 'mail'
+          requires :password, type: String, desc: 'password'
+        end
+        post '/bindwx' do
+
+        end
+
         desc "注册用户"
         params do
           requires :login, type: String, desc: 'username'

app/controllers/wechats_controller.rb

@@ -145,7 +145,7 @@ class WechatsController < ActionController::Base
 
 您还未绑定确实的用户，请先绑定，谢谢！" } }
     request.reply.news(news) do |article, n, index| # article is return object
-      url = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=#{Wechat.config.appid}&redirect_uri=#{login_wechat_url}&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect"
+      url = "https://open.weixin.qq.com/connect/oauth2/authorize?appid=#{Wechat.config.appid}&redirect_uri=#{root_url+'/assets/wechat/app.html#login'}&response_type=code&scope=snsapi_base&state=STATE#wechat_redirect"
       pic_url = "#{Setting.protocol}://#{Setting.host_name}/images/weixin_pic.jpg"
       article.item title: "#{n[:title]}",
                    description: n[:content],
@@ -175,7 +175,7 @@ class WechatsController < ActionController::Base
         code = params[:code] || session[:wechat_code]
         openid = get_openid_from_code(code)
 
-        raise "无法获取到openid" unless openid
+        raise "无法获取到openid,请在微信中打开本页面" unless openid
         raise "此微信号已绑定用户, 不能重复绑定" if user_binded?(openid)
 
         user, last_login_on = User.try_to_login(params[:username], params[:password])

app/models/course.rb

@@ -465,11 +465,6 @@ class Course < ActiveRecord::Base
     code
   end
 
-  def 
-    
-  end
-
-
 end
 
 

public/assets/wechat/app.html

@@ -10,6 +10,7 @@
     <meta content='True' name='HandheldFriendly' />
     <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
 
+    <link type="text/css" rel="stylesheet" href="/stylesheets/weui/weui.min.css" />
     <link type="text/css" rel="stylesheet" href="/stylesheets/weui/weixin.css" />
 
 </head>
@@ -17,8 +18,9 @@
 <div ng-view>
 </div>
 
+
 <script type="text/javascript">
-    window.g_openid = 'oCnvgvz8R7QheXE-R9Kkr39j8Ndg';
+    //window.g_openid = 'oCnvgvz8R7QheXE-R9Kkr39j8Ndg';
     window.g_debug = true; //调试标志,如果在本地请置为true
     window.apiUrl = 'http://localhost:3000/api/v1/';
 </script>
@@ -30,8 +32,12 @@
 <script src="/javascripts/wechat/app.js"></script>
 <script src="/javascripts/wechat/others/factory.js"></script>
 <script src="/javascripts/wechat/others/filter.js"></script>
+<script src="/javascripts/wechat/directives/alert.js"></script>
+<script src="/javascripts/wechat/directives/form_validate.js"></script>
 <script src="/javascripts/wechat/directives/input_auto.js"></script>
 <script src="/javascripts/wechat/directives/loading_spinner.js"></script>
+<script src="/javascripts/wechat/controllers/reg.js"></script>
+<script src="/javascripts/wechat/controllers/login.js"></script>
 <script src="/javascripts/wechat/controllers/activity.js"></script>
 <script src="/javascripts/wechat/controllers/add_class.js"></script>
 <script src="/javascripts/wechat/controllers/blog.js"></script>

public/assets/wechat/login.html

@@ -0,0 +1,25 @@
+<div class="post-container">
+    <div loading-spinner></div>
+
+    <form name="loginFrm" novalidate>
+    <div class="blue-title">绑定<span class="f13 blue-title-sub" ng-click="goReg()">注册</span></div>
+    <div class="input-box-wrap login-wrap mt30">
+        <input name="login" ng-model="user.login" required class="input-box f12" placeholder="请输入电子邮箱地址或登录名" />
+        <div ng-show="loginFrm.$submitted || loginFrm.login.$touched">
+            <span ng-show="loginFrm.login.$error.required" class="c-red fl f12">电子邮箱地址或登录名不能为空</span>
+        </div>
+    </div>
+    <div class="input-box-wrap login-wrap mt10 mb20">
+        <input class="input-box f12" placeholder="请输入密码" name="password" type="password" ng-model="user.password" required />
+        <div ng-show="loginFrm.$submitted || loginFrm.password.$touched">
+            <span ng-show="loginFrm.password.$error.required" class="c-red fl f12">密码不能为空</span>
+        </div>
+
+    </div>
+    <div class="login-wrap mt5"><a href="javascript:void(0);" ng-class="['btn1', 'bg-blue', 'f18', {'btn-disabled':!loginFrm.$valid} ]" ng-click="login(loginFrm, user)">确定绑定</a></div>
+    <div class="forget-psw-wrap"><a href="javascript:void(0);" class="f12 forget-psw" ng-click="showBox()">忘记密码？</a></div>
+        <my-alert message="findPwdDialog.message" title="findPwdDialog.title" visible="findPwdDialog.visible"></my-alert>
+    </form>
+</div>
+
+<my-alert message="alertService.message" title="alertService.title" visible="alertService.visible"></my-alert>

public/assets/wechat/reg.html

@@ -0,0 +1,43 @@
+<div class="post-container">
+    <form name="regFrm" novalidate>
+        <div class="blue-title">注册<span class="f13 blue-title-sub" ng-click="goLogin()">登录</span></div>
+        <img src="/images/wechat/male.jpg" width="60" class="img-circle mt15 block-center"/>
+        <div class="input-box-wrap login-wrap mt10 mb20">
+            <input class="input-box f12" type="email" ng-model="user.email" name="email" required placeholder="请输入电子邮箱地址"/>
+            <div ng-show="regFrm.$submitted || regFrm.email.$touched">
+                <span class="f12 c-red fl" ng-show="regFrm.email.$error.required">电子邮箱地址不能为空</span>
+                <span class="f12 c-red fl" ng-show="regFrm.email.$error.email">电子邮箱地址不合法</span>
+            </div>
+        </div>
+        <div class="input-box-wrap login-wrap mb20">
+            <input class="input-box f12" type="password" ng-model="user.password" name="password" ng-maxlength="20" ng-minlength="8" required placeholder="请输入密码"/>
+            <div ng-show="regFrm.$submitted || regFrm.password.$touched">
+                <span class="f12 c-red fl" ng-show="regFrm.password.$error.required">密码不能为空</span>
+                <span class="f12 c-red fl" ng-show="regFrm.password.$error.minlength">密码长度为8-20位</span>
+                <span class="f12 c-red fl" ng-show="regFrm.password.$error.maxlength">密码长度为8-20位</span>
+            </div>
+        </div>
+        <div class="input-box-wrap login-wrap mb20">
+            <input class="input-box f12" type="password" ng-model="user.password_confirm" name="password_confirm"  required placeholder="请再次输入密码" pwdconfirm/>
+            <div ng-show="regFrm.$submitted || regFrm.password_confirm.$touched">
+                <span class="f12 c-red fl" ng-show="regFrm.password_confirm.$error.pwdconfirm">两次密码不一致</span>
+            </div>
+        </div>
+        <div class="input-box-wrap login-wrap mb20">
+            <input class="input-box f12" required ng-model="user.username" name="username" placeholder="输入用户登录名"/>
+            <div ng-show="regFrm.$submitted || regFrm.username.$touched">
+                <span class="f12 c-red fl" ng-show="regFrm.username.$error.required">用户名不能为空</span>
+            </div>
+        </div>
+
+        <div class="login-op-wrap login-wrap f12 c-grey3">
+            <span ng-class="['login-box', 'mr5',{'checked': isagreed}]"
+                                                                ng-click="agreed(isagreed)"></span>我已阅读并接受<a
+                href="javascript:void(0);" class="link-blue2">Trustie服务协议</a>条款
+        </div>
+        <div class="login-wrap mt5"><a href="javascript:void(0);" ng-class="['btn1', 'bg-blue', 'f18', {'btn-disabled':!regFrm.$valid} ]" ng-click="reg(regFrm, user)">确定注册</a></div>
+
+    </form>
+</div>
+
+<my-alert message="errDialog.message" title="errDialog.title" visible="errDialog.visible"></my-alert>

public/assets/wechat/templates/alert.html

@@ -0,0 +1,12 @@
+<!--BEGIN dialog2-->
+<div class="weui_dialog_alert" id="dialog2" ng-show="visible">
+    <div class="weui_mask"></div>
+    <div class="weui_dialog">
+        <div class="weui_dialog_hd"><strong class="weui_dialog_title">{{title}}</strong></div>
+        <div class="weui_dialog_bd"><span class="weui_dialog_info">{{message}}</span></div>
+        <div class="weui_dialog_ft">
+            <a href="javascript:;" class="weui_btn_dialog primary" ng-click="dismiss()">确定</a>
+        </div>
+    </div>
+</div>
+<!--END dialog2-->

public/javascripts/wechat/app.js

@@ -1 +1,8 @@
 var app = angular.module('wechat', ['ngRoute']);
+
+app.constant('config', {
+    rootPath: '/assets/wechat/',
+    rootUrl: '/',
+    apiUrl: '/api/v1/'
+
+});

public/javascripts/wechat/controllers/login.js

@@ -0,0 +1,54 @@
+app.controller('LoginController', ['$scope', '$http', '$location', '$routeParams', 'alertService', 'config','auth','session',
+    function ($scope, $http, $location, $routeParams, alertService, config, auth,session) {
+
+        if($routeParams.code){
+            session.save('code', $routeParams.code);
+        }
+
+        var vm = $scope;
+        vm.loginFailed = false;
+        vm.alertService = alertService.create();
+        vm.findPwdDialog = alertService.create();
+
+        vm.login = function (frm, user) {
+            frm.$setSubmitted();
+            console.log(user);
+
+            if (!frm.$valid) {
+                console.log(frm.$error);
+                return;
+            }
+
+            console.log(apiUrl + "auth");
+
+            auth.getOpenId().then(
+                function(){
+                    return $http.post(
+                        config.rootUrl + "wxbind",
+                        {login: user.login, password: user.password, openid: openid}
+                    );
+                }
+            ).then(
+                function(response) {
+                    vm.loginFailed = (response.data.status != 0);
+                    console.log(response.data);
+                    vm.alertService.showMessage('出错了', response.data.msg);
+
+                    if (!$scope.loginFailed) { //绑定成功
+                    } else {
+                        vm.alertService.showMessage('出错了', response.data.msg);
+                    }
+                }
+            ).catch(function(e){
+                vm.alertService.showMessage('出错了', e);
+            });
+        };
+
+        vm.showBox = function () {
+            vm.findPwdDialog.showMessage("提示", "请访问www.trustie.net获取密码，谢谢！");
+        }
+
+        vm.goReg = function () {
+            $location.path('/reg');
+        }
+    }]);

public/javascripts/wechat/controllers/reg.js

@@ -0,0 +1,42 @@
+app.controller('RegController', ['$scope', '$http', '$location', 'alertService',
+    function ($scope, $http, $location, alertService) {
+
+        var vm = $scope;
+        vm.errDialog = alertService.create();
+
+        vm.goLogin = function () {
+            $location.path("/login");
+        }
+
+        vm.isagreed = true;
+        vm.agreed = function (_isagreed) {
+            vm.isagreed = !_isagreed;
+        };
+
+        vm.reg = function (frm, user) {
+
+            frm.$setSubmitted();
+
+            console.log(frm);
+            if (!frm.$valid) {
+                console.log(frm.$error);
+                return;
+            }
+
+            console.log(user);
+
+            $http.post(
+                apiUrl + "users",
+                {login: user.username, password: user.password, mail: user.email}
+            ).then(function (response) {
+                if (response.data.status != 0) {
+                    vm.errDialog.showMessage('出错了',response.data.message);
+                } else {
+                    vm.errDialog.showMessage("提示","注册且绑定微信成功");
+                }
+            }, function (response) {
+                vm.errDialo.showMessage('出错了',response.data);
+            });
+        }
+
+    }]);