From c4937c4cc375bb9465eab15f0c7fd352dec91b3b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=99=88=E5=B8=85?= Date: Tue, 16 Apr 2019 16:37:29 +0800 Subject: [PATCH] BasicForm finish --- .umirc.js | 26 +++++++--- AccountCenter/src/model.ts | 47 ++++++++++-------- AccountSettings/package.json | 15 +++--- AccountSettings/src/model.ts | 48 +++++++++++++++---- AdvancedForm/package.json | 19 ++++---- AdvancedForm/src/model.ts | 21 +++++++- AdvancedProfile/package.json | 3 +- AdvancedProfile/src/data.d.ts | 32 +++++++++++++ AdvancedProfile/src/index.tsx | 37 ++------------ AdvancedProfile/src/model.ts | 25 +++++++++- Analysis/src/model.tsx | 27 ++++++++++- BasicForm/package.json | 3 +- .../src/components/PageHeaderWrapper/index.js | 25 ---------- .../components/PageHeaderWrapper/index.tsx | 28 +++++++++++ BasicForm/src/{index.js => index.tsx} | 18 ++++--- BasicForm/src/model.js | 15 ------ BasicForm/src/model.ts | 33 +++++++++++++ BasicForm/src/{service.js => service.ts} | 0 package.json | 5 +- 19 files changed, 285 insertions(+), 142 deletions(-) create mode 100644 AdvancedProfile/src/data.d.ts delete mode 100644 BasicForm/src/components/PageHeaderWrapper/index.js create mode 100644 BasicForm/src/components/PageHeaderWrapper/index.tsx rename BasicForm/src/{index.js => index.tsx} (94%) delete mode 100644 BasicForm/src/model.js create mode 100644 BasicForm/src/model.ts rename BasicForm/src/{service.js => service.ts} (100%) diff --git a/.umirc.js b/.umirc.js index 218e63be..85f1038f 100644 --- a/.umirc.js +++ b/.umirc.js @@ -1,10 +1,22 @@ export default { plugins: [ - ['umi-plugin-block-dev', {layout: 'ant-design-pro',}], - ['umi-plugin-react', { - dva: true, - locale: true, - antd: true, - }] + [ + 'umi-plugin-block-dev', + { + layout: 'ant-design-pro', + menu: { + name: '主页', + icon: 'home', + }, + }, + ], + [ + 'umi-plugin-react', + { + dva: true, + locale: true, + antd: true, + }, + ], ], -} +}; diff --git a/AccountCenter/src/model.ts b/AccountCenter/src/model.ts index 37454d35..f75f0857 100644 --- a/AccountCenter/src/model.ts +++ b/AccountCenter/src/model.ts @@ -1,14 +1,31 @@ import { queryCurrent } from './service'; -import { Dispatch } from 'redux'; import { CurrentUser } from './data'; export interface ModalState { - currentUser: CurrentUser; + currentUser: Partial; } -type callType = (thisArg?: T, ...args: A) => R; -Function.call; -export default { +import { Reducer } from 'redux'; +import { EffectsCommandMap } from 'dva'; +import { AnyAction } from 'redux'; + +export type Effect = ( + action: AnyAction, + effects: EffectsCommandMap & { select: (func: (state: ModalState) => T) => T } +) => void; + +export interface ModelType { + namespace: string; + state: ModalState; + effects: { + fetchCurrent: Effect; + }; + reducers: { + saveCurrentUser: Reducer; + }; +} + +const Model: ModelType = { namespace: 'BLOCK_NAME_CAMEL_CASE', state: { @@ -16,16 +33,7 @@ export default { }, effects: { - *fetchCurrent( - _: ModalState, - { - call, - put, - }: { - call: callType>; - put: Dispatch; - } - ) { + *fetchCurrent(_, { call, put }) { const response = yield call(queryCurrent); yield put({ type: 'saveCurrentUser', @@ -35,12 +43,7 @@ export default { }, reducers: { - saveCurrentUser( - state: ModalState, - action: { - payload: CurrentUser; - } - ) { + saveCurrentUser(state, action) { return { ...state, currentUser: action.payload || {}, @@ -48,3 +51,5 @@ export default { }, }, }; + +export default Model; diff --git a/AccountSettings/package.json b/AccountSettings/package.json index 54e3b9a1..808a0638 100644 --- a/AccountSettings/package.json +++ b/AccountSettings/package.json @@ -2,15 +2,17 @@ "name": "@umi-block/account-settings", "version": "0.0.1", "description": "AccountSettings", - "main": "src/index.js", - "scripts": { - "dev": "umi dev" - }, "repository": { "type": "git", "url": "https://github.com/umijs/umi-blocks/ant-design-pro/accountsettings" }, + "license": "ISC", + "main": "src/index.js", + "scripts": { + "dev": "umi dev" + }, "dependencies": { + "@ant-design/pro-layout": "^4.0.5", "antd": "^3.10.9", "dva": "^2.4.0", "react": "^16.6.3", @@ -20,6 +22,5 @@ "umi": "^2.6.9", "umi-plugin-block-dev": "^1.0.0", "umi-plugin-react": "^1.3.0-beta.1" - }, - "license": "ISC" -} + } +} \ No newline at end of file diff --git a/AccountSettings/src/model.ts b/AccountSettings/src/model.ts index 99fc23a3..4c48f2e7 100644 --- a/AccountSettings/src/model.ts +++ b/AccountSettings/src/model.ts @@ -1,13 +1,47 @@ import { query as queryUsers, queryCurrent, queryProvince, queryCity } from './service'; +import { Reducer } from 'redux'; +import { EffectsCommandMap } from 'dva'; +import { AnyAction } from 'redux'; +import { CurrentUser, City, Province } from './data'; -export default { +export interface ModalState { + currentUser?: Partial; + province?: Province[]; + city?: City[]; + isLoading?: boolean; +} + +export type Effect = ( + action: AnyAction, + effects: EffectsCommandMap & { select: (func: (state: ModalState) => T) => T } +) => void; + +export interface ModelType { + namespace: string; + state: ModalState; + effects: { + fetchCurrent: Effect; + fetch: Effect; + fetchProvince: Effect; + fetchCity: Effect; + }; + reducers: { + saveCurrentUser: Reducer; + changeNotifyCount: Reducer; + setProvince: Reducer; + setCity: Reducer; + changeLoading: Reducer; + }; +} + +const Model: ModelType = { namespace: 'BLOCK_NAME_CAMEL_CASE', state: { - list: [], currentUser: {}, province: [], city: [], + isLoading: false, }, effects: { @@ -46,19 +80,13 @@ export default { }, reducers: { - save(state, action) { - return { - ...state, - list: action.payload, - }; - }, saveCurrentUser(state, action) { return { ...state, currentUser: action.payload || {}, }; }, - changeNotifyCount(state, action) { + changeNotifyCount(state = {}, action) { return { ...state, currentUser: { @@ -88,3 +116,5 @@ export default { }, }, }; + +export default Model; diff --git a/AdvancedForm/package.json b/AdvancedForm/package.json index 7d684e4b..eb255871 100644 --- a/AdvancedForm/package.json +++ b/AdvancedForm/package.json @@ -2,15 +2,17 @@ "name": "@umi-block/advanced-form", "version": "0.0.1", "description": "AdvancedForm", - "main": "src/index.js", - "scripts": { - "dev": "umi dev" - }, "repository": { "type": "git", "url": "https://github.com/umijs/umi-blocks/ant-design-pro/advancedform" }, + "license": "ISC", + "main": "src/index.js", + "scripts": { + "dev": "umi dev" + }, "dependencies": { + "@ant-design/pro-layout": "^4.0.5", "ant-design-pro": "^2.1.1", "antd": "^3.10.9", "dva": "^2.4.0", @@ -20,8 +22,7 @@ }, "devDependencies": { "umi": "^2.6.9", - "umi-plugin-react": "^1.7.2", - "umi-plugin-block-dev": "^1.0.0" - }, - "license": "ISC" -} + "umi-plugin-block-dev": "^1.0.0", + "umi-plugin-react": "^1.7.2" + } +} \ No newline at end of file diff --git a/AdvancedForm/src/model.ts b/AdvancedForm/src/model.ts index d07e0193..2c4d3ef2 100644 --- a/AdvancedForm/src/model.ts +++ b/AdvancedForm/src/model.ts @@ -1,7 +1,24 @@ import { message } from 'antd'; import { fakeSubmitForm } from './service'; +import { EffectsCommandMap } from 'dva'; +import { AnyAction } from 'redux'; -export default { +export interface ModalState {} + +export type Effect = ( + action: AnyAction, + effects: EffectsCommandMap & { select: (func: (state: ModalState) => T) => T } +) => void; + +export interface ModelType { + namespace: string; + state: ModalState; + effects: { + submitAdvancedForm: Effect; + }; +} + +const Model: ModelType = { namespace: 'BLOCK_NAME_CAMEL_CASE', state: {}, @@ -13,3 +30,5 @@ export default { }, }, }; + +export default Model; diff --git a/AdvancedProfile/package.json b/AdvancedProfile/package.json index e97a6a98..386e0e13 100644 --- a/AdvancedProfile/package.json +++ b/AdvancedProfile/package.json @@ -16,7 +16,8 @@ "dva": "^2.4.0", "lodash-decorators": "^6.0.0", "react": "^16.6.3", - "umi-request": "^1.0.0" + "umi-request": "^1.0.0", + "@ant-design/pro-layout": "^4.0.5" }, "devDependencies": { "umi": "^2.6.9", diff --git a/AdvancedProfile/src/data.d.ts b/AdvancedProfile/src/data.d.ts new file mode 100644 index 00000000..64f7e78e --- /dev/null +++ b/AdvancedProfile/src/data.d.ts @@ -0,0 +1,32 @@ +export interface AdvancedOperation1 { + key: string; + type: string; + name: string; + status: string; + updatedAt: string; + memo: string; +} + +export interface AdvancedOperation2 { + key: string; + type: string; + name: string; + status: string; + updatedAt: string; + memo: string; +} + +export interface AdvancedOperation3 { + key: string; + type: string; + name: string; + status: string; + updatedAt: string; + memo: string; +} + +export interface AdvancedProfileData { + advancedOperation1: AdvancedOperation1[]; + advancedOperation2: AdvancedOperation2[]; + advancedOperation3: AdvancedOperation3[]; +} diff --git a/AdvancedProfile/src/index.tsx b/AdvancedProfile/src/index.tsx index 34ef7252..f9ba1b1b 100644 --- a/AdvancedProfile/src/index.tsx +++ b/AdvancedProfile/src/index.tsx @@ -24,6 +24,7 @@ import { TabsProps } from 'antd/lib/tabs'; import classNames from 'classnames'; import DescriptionList from './DescriptionList'; import styles from './style.less'; +import { AdvancedProfileData } from './data'; const { Step } = Steps; const { Description } = DescriptionList; @@ -230,45 +231,13 @@ const columns = [ key: 'memo', }, ]; -export interface AdvancedOperation1 { - key: string; - type: string; - name: string; - status: string; - updatedAt: string; - memo: string; -} - -export interface AdvancedOperation2 { - key: string; - type: string; - name: string; - status: string; - updatedAt: string; - memo: string; -} - -export interface AdvancedOperation3 { - key: string; - type: string; - name: string; - status: string; - updatedAt: string; - memo: string; -} - -export interface RootDataObject { - advancedOperation1: AdvancedOperation1[]; - advancedOperation2: AdvancedOperation2[]; - advancedOperation3: AdvancedOperation3[]; -} @connect( ({ BLOCK_NAME_CAMEL_CASE, loading, }: { - BLOCK_NAME_CAMEL_CASE: RootDataObject; + BLOCK_NAME_CAMEL_CASE: AdvancedProfileData; loading: { effects: { [key: string]: boolean }; }; @@ -278,7 +247,7 @@ export interface RootDataObject { }) ) class PAGE_NAME_UPPER_CAMEL_CASE extends Component< - { loading: boolean; BLOCK_NAME_CAMEL_CASE: RootDataObject; dispatch: Dispatch }, + { loading: boolean; BLOCK_NAME_CAMEL_CASE: AdvancedProfileData; dispatch: Dispatch }, { operationKey: string; stepDirection: 'horizontal' | 'vertical'; diff --git a/AdvancedProfile/src/model.ts b/AdvancedProfile/src/model.ts index 429f72dc..9045285b 100644 --- a/AdvancedProfile/src/model.ts +++ b/AdvancedProfile/src/model.ts @@ -1,6 +1,27 @@ import { queryAdvancedProfile } from './service'; +import { Reducer } from 'redux'; +import { EffectsCommandMap } from 'dva'; +import { AnyAction } from 'redux'; -export default { +import { AdvancedProfileData } from './data'; + +export type Effect = ( + action: AnyAction, + effects: EffectsCommandMap & { select: (func: (state: AdvancedProfileData) => T) => T } +) => void; + +export interface ModelType { + namespace: string; + state: AdvancedProfileData; + effects: { + fetchAdvanced: Effect; + }; + reducers: { + show: Reducer; + }; +} + +const Model: ModelType = { namespace: 'BLOCK_NAME_CAMEL_CASE', state: { @@ -28,3 +49,5 @@ export default { }, }, }; + +export default Model; diff --git a/Analysis/src/model.tsx b/Analysis/src/model.tsx index 4e062cc3..c88112d0 100644 --- a/Analysis/src/model.tsx +++ b/Analysis/src/model.tsx @@ -1,6 +1,28 @@ import { fakeChartData } from './service'; +import { IAnalysisData } from './data'; +import { Reducer } from 'redux'; +import { EffectsCommandMap } from 'dva'; +import { AnyAction } from 'redux'; -export default { +export type Effect = ( + action: AnyAction, + effects: EffectsCommandMap & { select: (func: (state: IAnalysisData) => T) => T } +) => void; + +export interface ModelType { + namespace: string; + state: IAnalysisData; + effects: { + fetch: Effect; + fetchSalesData: Effect; + }; + reducers: { + save: Reducer; + clear: Reducer; + }; +} + +const Model: ModelType = { namespace: 'BLOCK_NAME_CAMEL_CASE', state: { @@ -14,7 +36,6 @@ export default { salesTypeDataOnline: [], salesTypeDataOffline: [], radarData: [], - loading: false, }, effects: { @@ -59,3 +80,5 @@ export default { }, }, }; + +export default Model; diff --git a/BasicForm/package.json b/BasicForm/package.json index 59a87d80..62a6f81d 100644 --- a/BasicForm/package.json +++ b/BasicForm/package.json @@ -15,7 +15,8 @@ "antd": "^3.10.9", "dva": "^2.4.0", "react": "^16.6.3", - "umi-request": "^1.0.0" + "umi-request": "^1.0.0", + "@ant-design/pro-layout": "^4.0.5" }, "devDependencies": { "umi": "^2.6.9", diff --git a/BasicForm/src/components/PageHeaderWrapper/index.js b/BasicForm/src/components/PageHeaderWrapper/index.js deleted file mode 100644 index 1a40e25d..00000000 --- a/BasicForm/src/components/PageHeaderWrapper/index.js +++ /dev/null @@ -1,25 +0,0 @@ -import React from 'react'; -import { FormattedMessage } from 'umi-plugin-react/locale'; -import Link from 'umi/link'; -import { PageHeader } from 'ant-design-pro'; -import styles from './index.less'; - -const PageHeaderWrapper = ({ children, wrapperClassName, ...restProps }) => ( -
- } - key="pageheader" - {...restProps} - linkElement={Link} - itemRender={item => { - if (item.locale) { - return ; - } - return item.title; - }} - /> - {children ?
{children}
: null} -
-); - -export default PageHeaderWrapper; diff --git a/BasicForm/src/components/PageHeaderWrapper/index.tsx b/BasicForm/src/components/PageHeaderWrapper/index.tsx new file mode 100644 index 00000000..8b18708e --- /dev/null +++ b/BasicForm/src/components/PageHeaderWrapper/index.tsx @@ -0,0 +1,28 @@ +import React from 'react'; +import { RouteContext } from '@ant-design/pro-layout'; +import { PageHeader } from 'antd'; +import styles from './index.less'; + +interface IPageHeaderWrapperProps { + content: React.ReactNode; + title: React.ReactNode; +} + +const PageHeaderWrapper: React.SFC = ({ + children, + content, + ...restProps +}) => ( + + {value => ( +
+ + {content} + + {children ?
{children}
: null} +
+ )} + +); + +export default PageHeaderWrapper; diff --git a/BasicForm/src/index.js b/BasicForm/src/index.tsx similarity index 94% rename from BasicForm/src/index.js rename to BasicForm/src/index.tsx index a140e9be..4f066cac 100644 --- a/BasicForm/src/index.js +++ b/BasicForm/src/index.tsx @@ -1,4 +1,4 @@ -import React, { PureComponent } from 'react'; +import React, { Component } from 'react'; import { connect } from 'dva'; import { formatMessage, FormattedMessage } from 'umi-plugin-react/locale'; import { @@ -15,18 +15,24 @@ import { } from 'antd'; import PageHeaderWrapper from './components/PageHeaderWrapper'; import styles from './style.less'; +import { FormComponentProps } from 'antd/lib/form'; +import { Dispatch } from 'redux'; const FormItem = Form.Item; const { Option } = Select; const { RangePicker } = DatePicker; const { TextArea } = Input; -@connect(({ loading }) => ({ +interface PAGE_NAME_UPPER_CAMEL_CASEProps extends FormComponentProps { + submitting: boolean; + dispatch: Dispatch; +} + +@connect(({ loading }: { loading: { effects: { [key: string]: boolean } } }) => ({ submitting: loading.effects['BLOCK_NAME_CAMEL_CASE/submitRegularForm'], })) -@Form.create() -class PAGE_NAME_UPPER_CAMEL_CASE extends PureComponent { - handleSubmit = e => { +class PAGE_NAME_UPPER_CAMEL_CASE extends Component { + handleSubmit = (e: React.FormEvent) => { const { dispatch, form } = this.props; e.preventDefault(); form.validateFieldsAndScroll((err, values) => { @@ -247,4 +253,4 @@ class PAGE_NAME_UPPER_CAMEL_CASE extends PureComponent { } } -export default PAGE_NAME_UPPER_CAMEL_CASE; +export default Form.create()(PAGE_NAME_UPPER_CAMEL_CASE); diff --git a/BasicForm/src/model.js b/BasicForm/src/model.js deleted file mode 100644 index 010e5a59..00000000 --- a/BasicForm/src/model.js +++ /dev/null @@ -1,15 +0,0 @@ -import { message } from 'antd'; -import { fakeSubmitForm } from './service'; - -export default { - namespace: 'BLOCK_NAME_CAMEL_CASE', - - state: {}, - - effects: { - *submitRegularForm({ payload }, { call }) { - yield call(fakeSubmitForm, payload); - message.success('提交成功'); - }, - }, -}; diff --git a/BasicForm/src/model.ts b/BasicForm/src/model.ts new file mode 100644 index 00000000..c511e8ae --- /dev/null +++ b/BasicForm/src/model.ts @@ -0,0 +1,33 @@ +import { message } from 'antd'; +import { fakeSubmitForm } from './service'; +import { EffectsCommandMap } from 'dva'; +import { AnyAction } from 'redux'; + +export interface ModalState {} + +export type Effect = ( + action: AnyAction, + effects: EffectsCommandMap & { select: (func: (state: ModalState) => T) => T } +) => void; + +export interface ModelType { + namespace: string; + state: ModalState; + effects: { + submitRegularForm: Effect; + }; +} +const Model: ModelType = { + namespace: 'BLOCK_NAME_CAMEL_CASE', + + state: {}, + + effects: { + *submitRegularForm({ payload }, { call }) { + yield call(fakeSubmitForm, payload); + message.success('提交成功'); + }, + }, +}; + +export default Model; diff --git a/BasicForm/src/service.js b/BasicForm/src/service.ts similarity index 100% rename from BasicForm/src/service.js rename to BasicForm/src/service.ts diff --git a/package.json b/package.json index 2147aeec..60eae38b 100644 --- a/package.json +++ b/package.json @@ -1,7 +1,7 @@ { "private": true, "scripts": { - "dev": "cross-env PAGES_PATH='Analysis/src' umi dev", + "dev": "cross-env PAGES_PATH='BasicForm/src' umi dev", "lint:style": "stylelint \"src/**/*.less\" --syntax less", "lint": "eslint --ext .js src mock tests && npm run lint:style", "lint:fix": "eslint --fix --ext .js src mock tests && npm run lint:style", @@ -29,7 +29,7 @@ "stylelint-config-prettier": "^4.0.0", "stylelint-config-standard": "^18.0.0", "umi": "^2.3.0-0", - "umi-plugin-block-dev": "^2.0.1", + "umi-plugin-block-dev": "^2.0.2", "umi-plugin-react": "^1.3.0-0", "umi-request": "^1.0.0" }, @@ -47,7 +47,6 @@ } }, "dependencies": { - "@ant-design/pro-layout": "^4.0.5", "cross-env": "^5.2.0" } } -- GitLab