1
0
Fork 0

feat: add my page

Signed-off-by: MiaoWoo <admin@yumc.pw>
master
MiaoWoo 2019-07-30 18:35:09 +08:00
Ursprung 07f128ca04
Commit 9de6a1eb36
19 geänderte Dateien mit 306 neuen und 127 gelöschten Zeilen

Datei anzeigen

@ -1,10 +1,26 @@
{
"extends": ["taro"],
"extends": [
"taro"
],
"rules": {
"no-unused-vars": ["error", { "varsIgnorePattern": "Taro" }],
"react/jsx-filename-extension": [1, { "extensions": [".js", ".jsx", ".tsx"] }]
"no-unused-vars": [
"error",
{
"varsIgnorePattern": "Taro"
}
],
"react/jsx-filename-extension": [
1,
{
"extensions": [
".js",
".jsx",
".tsx"
]
}
]
},
"parser": "@typescript-eslint/parser",
"parser": "@typescript-eslint/parser",
"parserOptions": {
"ecmaFeatures": {
"jsx": true
@ -12,4 +28,4 @@
"useJSXTextNode": true,
"project": "./tsconfig.json"
}
}
}

Datei anzeigen

@ -8,4 +8,14 @@
.flex-item{
flex-grow: 1;
text-align: center;
}
}
.page {
position: relative;
background-color: #FDFDFD;
view,
div {
box-sizing: border-box;
}
}

Datei anzeigen

@ -9,9 +9,9 @@ import './app.scss'
// 如果需要在 h5 环境中开启 React Devtools
// 取消以下注释:
if (process.env.NODE_ENV !== 'production' && process.env.TARO_ENV === 'h5') {
require('nerv-devtools')
}
// if (process.env.NODE_ENV !== 'production' && process.env.TARO_ENV === 'h5') {
// require('nerv-devtools')
// }
const app = dva.createApp({
initialState: {},

Datei anzeigen

@ -1,2 +1,3 @@
import Index from '../pages/index/model'
export default [Index];
import My from '../pages/my/model'
export default [Index, My];

Datei anzeigen

@ -1,3 +1,18 @@
/**
* @type P: Type of payload
* @type C: Type of callback
*/
export type Dispatch = <P = any, C = (payload: P) => void>(action: {
type: string;
payload?: P;
callback?: C;
[key: string]: any;
}) => any;
export interface DefaultProps {
dispatch: Dispatch
}
export interface DefaultModel<T> {
namespace: string,
state: T,

6
src/models/utils.ts Normal file
Datei anzeigen

@ -0,0 +1,6 @@
let mapDefaultProps = ({ def }) => ({ ...def })
export {
mapDefaultProps
}

Datei anzeigen

@ -1,13 +1,3 @@
.page {
position: relative;
background-color: #FDFDFD;
view,
div {
box-sizing: border-box;
}
}
.page-index {
padding: 0 0 30px;

Datei anzeigen

@ -1,18 +1,23 @@
import { AtCard, AtNoticebar } from 'taro-ui'
import { connect } from '@tarojs/redux';
import { View, Image } from '@tarojs/components'
import Taro, { Component, Config } from '@tarojs/taro'
import { AtCard, AtNoticebar } from 'taro-ui';
import { View, Image } from '@tarojs/components';
import Taro, { Component, Config } from '@tarojs/taro';
import './index.scss'
import logoImg from '../../assets/images/logo.png'
import { IndexProps } from './type';
import logoImg from '../../assets/images/logo.png';
import { mapDefaultProps } from '../../models/utils';
@connect(({ index }): IndexProps => ({ ...index }))
export default class Index extends Component<IndexProps> {
import './index.scss';
import { IndexProps, IndexState } from './type';
@connect(mapDefaultProps)
export default class Index extends Component<IndexProps, IndexState> {
config: Config = {
navigationBarTitleText: '首页',
enablePullDownRefresh: true
}
state = {
notify: '通知: 钱包目前处于测试阶段 如果发现BUG 请及时反馈!'
}
componentDidMount() {
Taro.startPullDownRefresh();
@ -25,26 +30,27 @@ export default class Index extends Component<IndexProps> {
}
render() {
const {
data
} = this.props
const data = this.props
const info = (
<AtCard className='base-info' title='基本信息'>
<View>: {data.version}</View>
<View>: {data.block}</View>
<View>: {data.supply}</View>
<View> : {data.percent}</View>
<View>: {data.lastNumber}</View>
<View> : {data.lastMiner} {data.lastName}</View>
</AtCard>
)
return (
<View className='page page-index'>
<AtNoticebar close marquee icon='volume-plus'>
: BUG !
{this.state.notify}
</AtNoticebar>
<View className='logo'>
<Image src={logoImg} className='img' mode='scaleToFill' />
</View>
<View className='page-title'></View>
<AtCard className='base-info' title='基本信息'>
<View>: {data.version}</View>
<View>: {data.block}</View>
<View>: {data.supply}</View>
<View> : {data.percent}</View>
<View>: {data.lastMiner}</View>
<View> : {data.lastNumber} {data.lastName}</View>
</AtCard>
{info}
</View>
)
}

Datei anzeigen

@ -1,33 +1,30 @@
import { getInfo } from './service'
import { DefaultModel } from 'src/models/types';
import { IndexProps } from './type';
import { DefaultModel } from '../../models/types';
import { getInfo } from './service';
import { IndexModel } from './type';
export default {
namespace: 'index',
state: {
data: {
version: 0,
block: 0,
supply: 0,
percent: '0.00',
lastMiner: 0,
lastName: 'system',
lastNumber: 0,
}
version: 0,
block: 0,
supply: 0,
percent: '0.00',
lastMiner: 0,
lastName: 'system',
lastNumber: 0,
},
effects: {
*getCurrentInfo({ }, { call, put }) {
let info = yield call(getInfo);
yield put({
type: "setState", payload: {
data: info
}
type: "setState", payload: info
});
}
},
reducers: {
setState(state: IndexProps, { payload }) {
setState(state: IndexModel, { payload }) {
return { ...state, ...payload }
}
}
} as DefaultModel<IndexProps>
} as DefaultModel<IndexModel>

Datei anzeigen

@ -1,7 +1,8 @@
import { getCurrentInfo, getBlockInfo, getAccount, getHistoryTransactions } from '../../rpc/tera'
import coinKit from '../../utils/coin-kit'
import Taro from '@tarojs/taro';
import coinKit from '../../utils/coin-kit'
import { getCurrentInfo, getBlockInfo, getAccount, getHistoryTransactions } from '../../rpc/tera'
const MAX_CENT = 1e9
async function getInfo() {

Datei anzeigen

@ -1,8 +1,8 @@
export interface IndexProps {
dispatch?: any,
data: IndexData
}
export interface IndexData {
import { DefaultProps } from "../../models/types";
export type IndexProps = IndexModel & DefaultProps
export interface IndexModel {
version: number;
block: number;
supply: number;
@ -11,3 +11,6 @@ export interface IndexData {
lastName: string;
lastNumber: number;
}
export interface IndexState {
notify: string
}

Datei anzeigen

@ -31,4 +31,12 @@
line-height: 34px;
}
}
}
}
.my {
padding: 30px;
}
.account {
margin-top: 30px;
}

Datei anzeigen

@ -1,36 +1,106 @@
import Taro, { Component, Config } from '@tarojs/taro'
import { View, Text, Image } from '@tarojs/components'
import defaultImage from '../../assets/images/logo.png'
import './index.scss'
import { connect } from '@tarojs/redux';
import { AtList, AtListItem } from 'taro-ui';
import Taro, { Component, Config } from '@tarojs/taro';
import { View, Text, Image } from '@tarojs/components';
class Index extends Component {
config: Config = {
navigationBarTitleText: '个人中心',
disableScroll: true
}
state = {
nickName: 'MiaoWoo',
avatarUrl: defaultImage
}
render() {
const {
nickName,
avatarUrl
} = this.state;
return (
<View className='more'>
<View className='user flex-wrp'>
<View className='avatar flex-item'>
<Image className='userinfo-avatar' src={avatarUrl}></Image>
</View>
<View className='user-info flex-item'>
<Text className='userinfo-nickname'>{nickName}</Text>
<Text className='edit'></Text>
</View>
</View>
</View>
)
import coinKit from '../../utils/coin-kit';
import { mapDefaultProps } from '../../models/utils';
import defaultImage from '../../assets/images/logo.png';
import './index.scss';
import { MyIndexProps, MyState } from './type';
@connect(mapDefaultProps)
class Index extends Component<MyIndexProps, MyState> {
config: Config = {
navigationBarTitleText: '个人中心',
enablePullDownRefresh: true
}
state = {
nickName: 'MiaoWoo',
avatarUrl: defaultImage,
}
onPullDownRefresh() {
const { dispatch } = this.props;
if (dispatch) {
dispatch({
type: 'my/getAccounts',
playload: '02078AC7F16BAF88F9A6F8FA05D5C9F697596402D9EB774A36C74E52A3470EA85B'
})
}
}
componentDidMount() {
Taro.startPullDownRefresh();
}
render() {
const {
nickName,
avatarUrl
} = this.state;
const accounts = this.props.accounts.map(a => {
return <AtListItem
key={a.Num}
hasBorder={false}
title={`${a.Num}(${a.Name})`}
note={`${coinKit.toNumber(a.Value)}`}
iconInfo={{
size: 20,
color: 'green',
value: 'credit-card',
}}
extraThumb={defaultImage}
/>
})
return (
<View className='page'>
<View className='user flex-wrp'>
<View className='avatar flex-item'>
<Image className='userinfo-avatar' src={avatarUrl}></Image>
</View>
<View className='user-info flex-item'>
<Text className='userinfo-nickname'>{nickName}</Text>
<Text className='edit'></Text>
</View>
</View>
<View className='my'>
<AtList hasBorder={false}>
<AtListItem
hasBorder={false}
title='创建/绑定私钥'
iconInfo={{
size: 20,
color: 'red',
value: 'lock',
}} />
<AtListItem
hasBorder={false}
title='创建账户'
iconInfo={{
size: 20,
color: 'green',
value: 'credit-card',
}} />
</AtList>
<View className='account'>
<AtList >
<AtListItem
hasBorder={false}
title='账户列表'
iconInfo={{
size: 20,
color: 'blue',
value: 'numbered-list',
}} />
{accounts}
</AtList>
</View>
</View>
</View>
)
}
}
export default Index
export default Index

24
src/pages/my/model.ts Normal file
Datei anzeigen

@ -0,0 +1,24 @@
import { DefaultModel } from '../../models/types';
import { getAccounts } from './service';
import { MyProps } from './type';
export default {
namespace: 'my',
state: {
accounts: []
},
effects: {
*['getAccounts']({ playload }, { call, put }) {
let accounts = yield call(getAccounts, playload);
yield put({
type: "setState", playload: accounts
});
}
},
reducers: {
setState(state: MyProps, { playload }) {
return { ...state, ...playload }
}
}
} as DefaultModel<MyProps>

15
src/pages/my/service.ts Normal file
Datei anzeigen

@ -0,0 +1,15 @@
import Taro from '@tarojs/taro';
import { getAccountListByKey } from '../../rpc/tera';
async function getAccounts(key: string) {
Taro.showLoading({
title: '加载中...'
})
let result = await getAccountListByKey(key);
Taro.hideLoading()
Taro.stopPullDownRefresh()
return { accounts: result };
}
export { getAccounts }

12
src/pages/my/type.ts Normal file
Datei anzeigen

@ -0,0 +1,12 @@
import { Account } from '../../rpc/types';
import { DefaultProps } from '../../models/types';
export type MyIndexProps = MyProps & DefaultProps
export interface MyProps {
accounts: Account[];
}
export interface MyState {
nickName: string;
avatarUrl: any;
}

Datei anzeigen

@ -1,4 +1,4 @@
import Taro from "@tarojs/taro";
import Taro from '@tarojs/taro';
let host = 'https://teraapi.sixi.com'
@ -15,7 +15,7 @@ function printRequest(method: string, path: string, data: any, response: any, co
function showError(content) {
Taro.showModal({
title: "网络请求错误",
title: '网络请求错误',
content,
showCancel: false
})

Datei anzeigen

@ -1,4 +1,4 @@
import rpc from './index'
import rpc from './index';
import { BlockInfo, CurrentInfo, Account } from './types';
async function getCurrentInfo(): Promise<CurrentInfo> {
@ -29,9 +29,18 @@ async function getHistoryTransactions(id: number, count: number = 3, getDes: num
return result.History;
}
async function getAccountListByKey(key: string): Promise<Account[]> {
let result = await rpc.get('/api/v1/GetAccountListByKey', {
Key: key,
AllData: 1
})
return result.arr;
}
export {
getAccount,
getCurrentInfo,
getBlockInfo,
getHistoryTransactions
getHistoryTransactions,
getAccountListByKey
}

Datei anzeigen

@ -1,29 +1,25 @@
import i18n from '@/i18n/index.js'
function formatShortTime(time, count = 4) {
const t = Math.floor(time / 86400);
const h = Math.floor((time / 3600) % 24);
const m = Math.floor((time / 60) % 60);
const s = Math.floor(time % 60);
var timeStr = '';
if (t > 0) {
timeStr = timeStr + t + '天';
count--;
}
if (h > 0 && count > 0) {
timeStr = timeStr + h + '时';
count--;
}
if (m > 0 && count > 0) {
timeStr = timeStr + m + '分';
count--;
}
if (count > 0) {
timeStr = timeStr + s + '秒';
}
return timeStr;
const t = Math.floor(time / 86400);
const h = Math.floor((time / 3600) % 24);
const m = Math.floor((time / 60) % 60);
const s = Math.floor(time % 60);
var timeStr = '';
if (t > 0) {
timeStr = timeStr + t + '天';
count--;
}
if (h > 0 && count > 0) {
timeStr = timeStr + h + '时';
count--;
}
if (m > 0 && count > 0) {
timeStr = timeStr + m + '分';
count--;
}
if (count > 0) {
timeStr = timeStr + s + '秒';
}
return timeStr;
}
module.exports = {
formatShortTime
}
export { formatShortTime }