impl password reset

src/app.rs

@@ -12,10 +12,11 @@ use yew::{
 
 use crate::routes::{
     console::view::Console,
-    login::Login,
-    logout::Logout,
-    register::Register,
-    active::Active,
+    user::login::Login,
+    user::logout::Logout,
+    user::register::Register,
+    user::active::Active,
+    user::forget::Forget,
     AppRoute,
     fix_fragment_routes,
 };
@@ -114,7 +115,8 @@ impl Component for App {
                             AppRoute::Console => html! {<Console />},
                             AppRoute::Logout => html! {<Logout callback=callback_logout />},
                             AppRoute::Register => html! {<Register />},
-                            AppRoute::Active => html! {<Active />}
+                            AppRoute::Active => html! {<Active />},
+                            AppRoute::Forget => html! {<Forget />}
                         }
                     } else {
                         html! { "No found" }
@@ -147,6 +149,7 @@ impl App {
                 AppRoute::Logout => {}
                 AppRoute::Register => {}
                 AppRoute::Active => {}
+                AppRoute::Forget => {}
             }
         }
     }

src/routes/from_js.rs

@@ -12,4 +12,8 @@ extern "C" {
     pub fn register_btn_enable();
     pub fn active_btn_disable();
     pub fn active_btn_enable();
+    pub fn send_btn_disable();
+    pub fn send_btn_enable();
+    pub fn change_btn_disable();
+    pub fn change_btn_enable();
 }

src/routes/mod.rs

@@ -1,7 +1,4 @@
-pub mod login;
-pub mod logout;
-pub mod register;
-pub mod active;
+pub mod user;
 pub mod console;
 pub mod from_js;
 
@@ -18,6 +15,8 @@ pub enum AppRoute {
     Register,
     #[to = "/#/active"]
     Active,
+    #[to = "/#/forget"]
+    Forget,
     #[to = "/#"]
     Login,
 }

src/routes/user/forget.rs

@@ -0,0 +1,220 @@
+use yew::{
+    ComponentLink,
+    Component,
+    Html,
+};
+
+use yew::prelude::*;
+use yew::services::fetch::FetchTask;
+use status_protoc::my_trait::StatusTrait;
+use yew_router::agent::RouteAgent;
+use yew_router::agent::RouteRequest::ChangeRoute;
+use status_protoc::status::user::check::{CheckStatus, _CheckStatus};
+use status_protoc::status::user::change::{ChangeStatus, _ChangeStatus};
+use crate::error::Error;
+use crate::services::auth::Auth;
+use crate::routes::AppRoute;
+use crate::components::footer::Footer;
+use crate::types::auth::NewPassword;
+use crate::routes::from_js::{change_btn_disable, change_btn_enable, send_btn_enable, send_btn_disable};
+
+pub struct Forget {
+    auth: Auth,
+    request: NewPassword,
+    response_change: Callback<Result<ChangeStatus, Error>>,
+    response_send: Callback<Result<CheckStatus, Error>>,
+    ready: bool,
+    email: String,
+    tip: Html,
+    task: Option<FetchTask>,
+    router_agent: Box<dyn Bridge<RouteAgent>>,
+    link: ComponentLink<Self>,
+}
+
+pub enum Msg {
+    ResponseChange(Result<ChangeStatus, Error>),
+    ResponseSend(Result<CheckStatus, Error>),
+    RequestChange,
+    RequestSend,
+    UpdateCode(String),
+    UpdatePassword(String),
+    UpdateEmail(String),
+    Ignore,
+}
+
+impl Component for Forget {
+    type Message = Msg;
+    type Properties = ();
+
+    fn create(_props: Self::Properties, link: ComponentLink<Self>) -> Self {
+        Self {
+            auth: Auth::new(),
+            request: NewPassword::default(),
+            response_change: link.callback(Msg::ResponseChange),
+            response_send: link.callback(Msg::ResponseSend),
+            ready: false,
+            email: String::default(),
+            tip: html! {<p class="alert alert-info">{ "密码重置, 重置成功将会跳转到登录界面" }</p>},
+            task: None,
+            router_agent: RouteAgent::bridge(link.callback(|_| Msg::Ignore)),
+            link,
+        }
+    }
+
+    fn update(&mut self, msg: Self::Message) -> bool {
+        match msg {
+            Msg::ResponseChange(Ok(response)) => {
+                self.task = None;
+                match response.status() {
+                    _ChangeStatus::InvalidCode => {
+                        self.tip = html! { <p class="alert alert-danger">{ "验证码错误" }</p> };
+                    }
+                    _ChangeStatus::PasswordTooShort => {
+                        self.tip = html! { <p class="alert alert-danger">{ "密码太短" }</p> };
+                    }
+                    _ChangeStatus::DbAPIError => {
+                        self.tip = html! { <p class="alert alert-danger">{ "数据库错误，请联系管理员" }</p> };
+                    }
+                    _ChangeStatus::ChangeSuccessfully => {
+                        self.router_agent.send(ChangeRoute(AppRoute::Login.into()))
+                    }
+                }
+                change_btn_enable();
+            }
+            Msg::ResponseSend(Ok(response)) => {
+                self.task = None;
+                match response.status() {
+                    _CheckStatus::SendSuccessfully => {
+                        self.ready = true;
+                        self.tip = html! { <p class="alert alert-success">{ "验证码发送成功" }</p> };
+                    }
+                    _CheckStatus::SendEmailError => {
+                        self.tip = html! { <p class="alert alert-danger">{ "邮件发送错误，请联系管理员" }</p> };
+                    }
+                    _CheckStatus::InvalidEmailAddress => {
+                        self.tip = html! { <p class="alert alert-danger">{ "邮件格式错误" }</p> };
+                    }
+                    _CheckStatus::DbAPIError => {
+                        self.tip = html! { <p class="alert alert-danger">{ "数据库错误，请联系管理员" }</p> };
+                    }
+                }
+                send_btn_enable();
+            }
+            Msg::RequestChange => {
+                self.task = Some(self.auth.reset_password(self.request.clone(), self.response_change.clone()));
+                change_btn_disable();
+            },
+            Msg::RequestSend => {
+                self.task = Some(self.auth.send_check_code(self.email.clone(), self.response_send.clone()));
+                send_btn_disable();
+            }
+            Msg::UpdateCode(code) => self.request.code = code,
+            Msg::UpdatePassword(pd) => self.request.new_password = pd,
+            Msg::UpdateEmail(e) => self.email = e,
+            Msg::Ignore => (),
+            Msg::ResponseChange(Err(_)) => (),
+            Msg::ResponseSend(Err(_)) => ()
+        }
+        true
+    }
+
+    fn change(&mut self, _props: Self::Properties) -> bool {
+        true
+    }
+
+    fn view(&self) -> Html {
+        let inner = if !self.ready {
+            let oninput_email = self
+                .link
+                .callback(|ev: InputData| Msg::UpdateEmail(ev.value));
+
+            let onsubmit = self.link.callback(|ev: FocusEvent| {
+                ev.prevent_default();
+                Msg::RequestSend
+            });
+
+            html! {
+                <div class="container">
+                    <form onsubmit=onsubmit>
+                        <h1>{ "Pipe" }<sup>{ "alpha" }</sup></h1>
+                        { self.tip.clone() }
+
+                        <div class="form-group">
+                            <label class="control-label" for="email">{ "邮箱" }</label>
+                            <input type="email" class="form-control"
+                            name="email"
+                            id="email"
+                            placeholder="请输入 邮箱"
+                            required=true
+                            value=&self.email
+                            oninput=oninput_email
+                            />
+                        </div>
+
+                        <p class="help-block"> { "如果用户存在，会将发送密码重置验证码到您的邮箱，请注意查收。" }</p>
+                        <div class="text-right">
+                            <button type="submit" id="send_btn" class="btn btn-default">{ "发送" }</button>
+                        </div>
+                    </form>
+                </div>
+            }
+        } else {
+            let oninput_code = self
+                .link
+                .callback(|ev: InputData| Msg::UpdateCode(ev.value));
+
+            let oninput_password = self
+                .link
+                .callback(|ev: InputData| Msg::UpdatePassword(ev.value));
+
+            let onsubmit = self.link.callback(|ev: FocusEvent| {
+                ev.prevent_default();
+                Msg::RequestChange
+            });
+
+            html! {
+                <div class="container">
+                    <form onsubmit=onsubmit>
+                        <h1>{ "Pipe" }<sup>{ "alpha" }</sup></h1>
+                        { self.tip.clone() }
+                        <div class="form-group">
+                            <label class="control-label" for="code">{ "验证码" }</label>
+                            <input type="text" class="form-control"
+                            name="code"
+                            id="code"
+                            placeholder="请输入 验证码"
+                            required=true
+                            value=&self.request.code
+                            oninput=oninput_code
+                            />
+                        </div>
+
+                        <div class="form-group">
+                            <label class="control-label" for="password">{ "密码" }</label>
+                            <input type="password" class="form-control"
+                            name="password"
+                            id="password"
+                            placeholder="请输入 新密码"
+                            required=true
+                            value=&self.request.new_password
+                            oninput=oninput_password
+                            />
+                        </div>
+
+                        <div class="text-right">
+                            <button type="submit" id="change_btn" class="btn btn-default">{ "修改" }</button>
+                        </div>
+                    </form>
+                </div>
+            }
+        };
+
+        html! {
+            <>
+                <link href="register.css" rel="stylesheet" type="text/css"/>
+                { inner }
+                <Footer />
+            </>
+        }
+    }
+}

src/routes/login.rs → src/routes/user/login.rs

@@ -133,7 +133,7 @@ impl Component for Login {
                         { self.tip.clone() }
                         <div class="form-group ">
                             <label class="control-label" for="name">{ "用户名" }</label>
-                            <input type="name" class="form-control"
+                            <input type="text" class="form-control"
                             name="name"
                             id="name"
                             placeholder="请输入 用户名"
@@ -156,6 +156,8 @@ impl Component for Login {
                         </div>
 
                         <div class="text-right">
+                            <p><a href="/#/forget">{ "忘记密码?" }</a></p>
+                            <p><a href="/#/active">{ "未激活账户?" }</a></p>
                             <button type="submit" id="login_btn" class="btn btn-default">{ "登录" }</button>
                             <button type="submit" class="btn btn-default" onclick=register>{ "注册" }</button>
                         </div>

src/routes/user/mod.rs

@@ -0,0 +1,5 @@
+pub mod login;
+pub mod logout;
+pub mod register;
+pub mod active;
+pub mod forget;

src/services/auth.rs

@@ -1,12 +1,14 @@
-use crate::types::auth::{LoginInfo, UserInfo, RegisterInfo};
+use crate::types::auth::{LoginInfo, UserInfo, RegisterInfo, NewPassword};
 
 use yew::callback::Callback;
 use yew::services::fetch::FetchTask;
 use status_protoc::status::user::login::LoginStatus;
 use status_protoc::status::user::register::RegisterStatus;
+use status_protoc::status::user::active::ActiveStatus;
+use status_protoc::status::user::check::CheckStatus;
+use status_protoc::status::user::change::ChangeStatus;
 use crate::error::Error;
 use crate::services::requests::Requests;
-use status_protoc::status::user::active::ActiveStatus;
 
 /// Apis for authentication
 #[derive(Default, Debug)]
@@ -77,4 +79,27 @@ impl Auth {
             callback,
         )
     }
+
+    pub fn send_check_code(
+        &mut self,
+        email: String,
+        callback: Callback<Result<CheckStatus, Error>>
+    ) -> FetchTask {
+        self.requests.get::<CheckStatus>(
+            format!("/user/send_code/{}", email),
+            callback
+        )
+    }
+
+    pub fn reset_password(
+        &mut self,
+        new: NewPassword,
+        callback: Callback<Result<ChangeStatus, Error>>
+    ) -> FetchTask {
+        self.requests.post::<NewPassword, ChangeStatus>(
+            format!("/user/update_password"),
+            new,
+            callback
+        )
+    }
 }

src/types/auth.rs

@@ -11,6 +11,12 @@ pub struct RegisterInfo {
     pub user_email: String,
 }
 
+#[derive(Clone, Debug, Default, Serialize, Deserialize)]
+pub struct NewPassword {
+    pub code: String,
+    pub new_password: String,
+}
+
 #[derive(Clone, Debug, Default, Serialize, Deserialize)]
 pub struct UserInfo {
     pub authorized: bool,