73 |
74 |
75 |
76 |
77 |
78 |
record.id}
83 | pagination={false}
84 | />
85 |
92 |
93 |
94 | );
95 | }
96 |
97 | function mapStateToProps(state) {
98 | const { list, total, page } = state['BLOCK_NAME'];
99 | return {
100 | list,
101 | total,
102 | page,
103 | loading: state.loading.models['BLOCK_NAME'],
104 | };
105 | }
106 |
107 | export default connect(mapStateToProps)(Users);
108 |
--------------------------------------------------------------------------------
/templates/user-dashboard/src/index.js:
--------------------------------------------------------------------------------
1 | import { Component } from 'react';
2 | import { connect } from 'dva';
3 | import Users from './components/Users';
4 |
5 | class BLOCK_NAME_CAMEL_CASE extends Component {
6 | componentDidMount() {
7 | this.props.dispatch({
8 | type: 'BLOCK_NAME/fetch',
9 | payload: {
10 | page: 1,
11 | },
12 | });
13 | }
14 |
15 | render() {
16 | return (
17 |
18 |
19 |
20 | );
21 | }
22 | }
23 |
24 | export default connect()(BLOCK_NAME_CAMEL_CASE);
25 |
--------------------------------------------------------------------------------
/templates/user-dashboard/src/model.js:
--------------------------------------------------------------------------------
1 | import * as usersService from './service';
2 |
3 | export default {
4 | namespace: 'BLOCK_NAME',
5 | state: {
6 | list: [],
7 | total: null,
8 | page: null,
9 | },
10 | reducers: {
11 | save(state, { payload: { data: list, total, page } }) {
12 | return { ...state, list, total, page };
13 | },
14 | },
15 | effects: {
16 | *fetch({ payload: { page = 1 } }, { call, put }) {
17 | const { data, total, page: currentPage } = yield call(usersService.fetch, { page });
18 | yield put({
19 | type: 'save',
20 | payload: {
21 | data,
22 | total,
23 | page: currentPage,
24 | },
25 | });
26 | },
27 | *remove({ payload: id }, { call, put, select }) {
28 | yield call(usersService.remove, id);
29 | const page = yield select(state => state['BLOCK_NAME'].page);
30 | yield put({ type: 'fetch', payload: { page } });
31 | },
32 | *patch({ payload: { id, values } }, { call, put, select }) {
33 | yield call(usersService.patch, id, values);
34 | const page = yield select(state => state['BLOCK_NAME'].page);
35 | yield put({ type: 'fetch', payload: { page } });
36 | },
37 | *create({ payload: values }, { call, put, select }) {
38 | yield call(usersService.create, values);
39 | const page = yield select(state => state['BLOCK_NAME'].page);
40 | yield put({ type: 'fetch', payload: { page } });
41 | },
42 | },
43 | };
44 |
--------------------------------------------------------------------------------
/templates/user-dashboard/src/service.js:
--------------------------------------------------------------------------------
1 | import request from 'umi-request';
2 |
3 | const API_PREFIX = `/api/BLOCK_NAME`;
4 |
5 | export function fetch({ page = 1 }) {
6 | return request(`${API_PREFIX}?page=${page}`);
7 | }
8 |
9 | export function remove(id) {
10 | return request(`${API_PREFIX}/${id}`, {
11 | method: 'DELETE',
12 | });
13 | }
14 |
15 | export function patch(id, values) {
16 | // TODO:
17 | // use umi-request after the issue is closed
18 | // https://github.com/umijs/umi-request/issues/5
19 | return window.fetch(`${API_PREFIX}/${id}`, {
20 | method: 'PATCH',
21 | headers: {
22 | 'Content-Type': 'application/json',
23 | },
24 | body: JSON.stringify(values),
25 | });
26 | }
27 |
28 | export function create(values) {
29 | return request(API_PREFIX, {
30 | method: 'POST',
31 | data: values,
32 | });
33 | }
34 |
--------------------------------------------------------------------------------
/templates/user-dashboard/src/utils/constants.js:
--------------------------------------------------------------------------------
1 | export const PAGE_SIZE = 3;
2 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "outDir": "build/dist",
4 | "module": "esnext",
5 | "target": "esnext",
6 | "lib": ["esnext", "dom"],
7 | "sourceMap": true,
8 | "baseUrl": ".",
9 | "jsx": "react",
10 | "allowSyntheticDefaultImports": true,
11 | "moduleResolution": "node",
12 | "rootDirs": ["/src", "/test", "/mock", "./typings"],
13 | "forceConsistentCasingInFileNames": true,
14 | "noImplicitReturns": true,
15 | "suppressImplicitAnyIndexErrors": true,
16 | "noUnusedLocals": true,
17 | "allowJs": true,
18 | "resolveJsonModule": true,
19 | "experimentalDecorators": true,
20 | "strict": true,
21 | "paths": {
22 | "@/*": ["./src/*"]
23 | }
24 | },
25 | "include": [".", "./typings.d"],
26 | "exclude": ["node_modules", "_scripts", "jest", "tslint:latest", "tslint-config-prettier"]
27 | }
28 |
--------------------------------------------------------------------------------
/typings.d.ts:
--------------------------------------------------------------------------------
1 | declare module '*.css';
2 | declare module '*.less';
3 | declare module '*.scss';
4 | declare module '*.sass';
5 | declare module '*.svg';
6 | declare module '*.png';
7 | declare module '*.jpg';
8 | declare module '*.jpeg';
9 | declare module '*.gif';
10 | declare module '*.bmp';
11 | declare module '*.tiff';
12 | declare module 'mockjs';
13 |
14 | declare module '@umijs/ui-flag';
15 |
--------------------------------------------------------------------------------