-
Notifications
You must be signed in to change notification settings - Fork 141
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
[optimize] upgrade Session Box component & other Upstream packages
- Loading branch information
Showing
10 changed files
with
73 additions
and
108 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
This file was deleted.
Oops, something went wrong.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -1,26 +1,25 @@ | ||
| import { component, mixin, watch, createCell } from 'web-cell'; | ||
| import { observer } from 'mobx-web-cell'; | ||
| import { InputGroup } from 'boot-cell/source/Form/InputGroup'; | ||
| import { Field } from 'boot-cell/source/Form/Field'; | ||
| import { Button } from 'boot-cell/source/Form/Button'; | ||
| import { WebCell, attribute, component, observer } from 'web-cell'; | ||
| import { observable } from 'mobx'; | ||
| import { InputGroup, FormControl, Button } from 'boot-cell'; | ||
|
|
||
| import { User } from '../service'; | ||
| import { session } from '../model'; | ||
|
|
||
| @observer | ||
| export interface SessionBox extends WebCell {} | ||
|
|
||
| @component({ | ||
| tagName: 'session-box', | ||
| renderTarget: 'children' | ||
| mode: 'open' | ||
| }) | ||
| export class SessionBox extends mixin() { | ||
| @watch | ||
| countDown = 0; | ||
| @observer | ||
| export class SessionBox extends HTMLElement implements WebCell { | ||
| @attribute | ||
| @observable | ||
| accessor countDown = 0; | ||
|
|
||
| emitSignIn = (user: User) => this.emit('signin', user, {}); | ||
|
|
||
| connectedCallback() { | ||
| super.connectedCallback(); | ||
|
|
||
| if (session.user) this.emitSignIn(session.user); | ||
| else session.getProfile().then(this.emitSignIn); | ||
| } | ||
|
|
@@ -56,50 +55,65 @@ export class SessionBox extends mixin() { | |
| else this.classList.add(...Classes); | ||
| } | ||
|
|
||
| render() { | ||
| renderForm() { | ||
| const { countDown } = this; | ||
|
|
||
| return session.user ? ( | ||
| this.defaultSlot | ||
| ) : ( | ||
| return ( | ||
| <form | ||
| // @ts-ignore | ||
| className="mx-auto my-3 p-3 border rounded" | ||
| style={{ maxWidth: '20rem' }} | ||
| onSubmit={this.handleSignIn} | ||
| > | ||
| <h2 className="text-center mb-3">登录</h2> | ||
|
|
||
| <InputGroup size="lg" className="mb-3"> | ||
| <Field | ||
| <FormControl | ||
| type="tel" | ||
| name="phone" | ||
| maxLength="11" | ||
| maxLength={11} | ||
| required | ||
| placeholder="手机号" | ||
| /> | ||
| </InputGroup> | ||
|
|
||
| <InputGroup size="lg" className="mb-3"> | ||
| <Field | ||
| <FormControl | ||
| name="code" | ||
| required | ||
| placeholder="短信验证码" | ||
| autocomplete="off" | ||
| /> | ||
| <Button | ||
| outline | ||
| color="secondary" | ||
| variant="outline-secondary" | ||
| onClick={this.handleSMSCode} | ||
| disabled={!!countDown} | ||
| > | ||
| {countDown ? countDown + 's' : '获取'} | ||
| </Button> | ||
| </InputGroup> | ||
|
|
||
| <Button type="submit" block color="primary" size="lg"> | ||
| <Button | ||
| type="submit" | ||
| className="d-block w-100" | ||
| variant="primary" | ||
| size="lg" | ||
| > | ||
| 登录 | ||
| </Button> | ||
| </form> | ||
| ); | ||
| } | ||
|
|
||
| render() { | ||
| return ( | ||
| <> | ||
| <link | ||
| rel="stylesheet" | ||
| href="https://unpkg.com/[email protected]/dist/css/bootstrap.min.css" | ||
| /> | ||
| {session.user ? <slot /> : this.renderForm()} | ||
| </> | ||
| ); | ||
| } | ||
| } | ||
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
5f8f43eThere was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Deploy preview for wuhan2020 ready!
✅ Preview
https://wuhan2020-663t1wie2-techquery.vercel.app
Built with commit 5f8f43e.
This pull request is being automatically deployed with vercel-action