提交 109e71ef37ad927a785e9d3484f60dea64b7bd99

作者 愚道
1 个父辈 3438f682

improve block basicprofile code

... ... @@ -14,10 +14,6 @@
14 14 "ant-design-pro": "^2.1.1",
15 15 "antd": "^3.10.9",
16 16 "dva": "^2.4.0",
17   - "hash.js": "^1.1.5",
18   - "moment": "^2.22.2",
19   - "nzh": "^1.0.3",
20   - "qs": "^6.6.0",
21 17 "react": "^16.6.3",
22 18 "umi-request": "^1.0.0"
23 19 },
... ...
... ... @@ -76,83 +76,11 @@ const basicProgress = [
76 76 },
77 77 ];
78 78
79   -const advancedOperation1 = [
80   - {
81   - key: 'op1',
82   - type: '订购关系生效',
83   - name: '曲丽丽',
84   - status: 'agree',
85   - updatedAt: '2017-10-03 19:23:12',
86   - memo: '-',
87   - },
88   - {
89   - key: 'op2',
90   - type: '财务复审',
91   - name: '付小小',
92   - status: 'reject',
93   - updatedAt: '2017-10-03 19:23:12',
94   - memo: '不通过原因',
95   - },
96   - {
97   - key: 'op3',
98   - type: '部门初审',
99   - name: '周毛毛',
100   - status: 'agree',
101   - updatedAt: '2017-10-03 19:23:12',
102   - memo: '-',
103   - },
104   - {
105   - key: 'op4',
106   - type: '提交订单',
107   - name: '林东东',
108   - status: 'agree',
109   - updatedAt: '2017-10-03 19:23:12',
110   - memo: '很棒',
111   - },
112   - {
113   - key: 'op5',
114   - type: '创建订单',
115   - name: '汗牙牙',
116   - status: 'agree',
117   - updatedAt: '2017-10-03 19:23:12',
118   - memo: '-',
119   - },
120   -];
121   -
122   -const advancedOperation2 = [
123   - {
124   - key: 'op1',
125   - type: '订购关系生效',
126   - name: '曲丽丽',
127   - status: 'agree',
128   - updatedAt: '2017-10-03 19:23:12',
129   - memo: '-',
130   - },
131   -];
132   -
133   -const advancedOperation3 = [
134   - {
135   - key: 'op1',
136   - type: '创建订单',
137   - name: '汗牙牙',
138   - status: 'agree',
139   - updatedAt: '2017-10-03 19:23:12',
140   - memo: '-',
141   - },
142   -];
143   -
144 79 const getProfileBasicData = {
145 80 basicGoods,
146 81 basicProgress,
147 82 };
148 83
149   -const getProfileAdvancedData = {
150   - advancedOperation1,
151   - advancedOperation2,
152   - advancedOperation3,
153   -};
154   -
155 84 export default {
156   - 'GET /api/profile/advanced': getProfileAdvancedData,
157   - 'GET /api/profile/basic': getProfileBasicData,
  85 + 'GET /api/BLOCK_NAME/basic': getProfileBasicData,
158 86 };
... ...
... ... @@ -3,29 +3,22 @@ import { FormattedMessage } from 'umi/locale';
3 3 import Link from 'umi/link';
4 4 import { PageHeader } from 'ant-design-pro';
5 5 import styles from './index.less';
6   -import MenuContext from '../../layouts/MenuContext';
7 6
8 7 const PageHeaderWrapper = ({ children, contentWidth, wrapperClassName, top, ...restProps }) => (
9 8 <div style={{ margin: '-24px -24px 0' }} className={wrapperClassName}>
10   - {top}
11   - <MenuContext.Consumer>
12   - {value => (
13   - <PageHeader
14   - wide={contentWidth === 'Fixed'}
15   - home={<FormattedMessage id="menu.home" defaultMessage="Home" />}
16   - {...value}
17   - key="pageheader"
18   - {...restProps}
19   - linkElement={Link}
20   - itemRender={item => {
21   - if (item.locale) {
22   - return <FormattedMessage id={item.locale} defaultMessage={item.title} />;
23   - }
24   - return item.title;
25   - }}
26   - />
27   - )}
28   - </MenuContext.Consumer>
  9 + <PageHeader
  10 + wide={contentWidth === 'Fixed'}
  11 + home={<FormattedMessage id="menu.home" defaultMessage="Home" />}
  12 + key="pageheader"
  13 + {...restProps}
  14 + linkElement={Link}
  15 + itemRender={item => {
  16 + if (item.locale) {
  17 + return <FormattedMessage id={item.locale} defaultMessage={item.title} />;
  18 + }
  19 + return item.title;
  20 + }}
  21 + />
29 22 {children ? <div className={styles.content}>{children}</div> : null}
30 23 </div>
31 24 );
... ...
... ... @@ -41,21 +41,21 @@ const progressColumns = [
41 41 },
42 42 ];
43 43
44   -@connect(({ profile, loading }) => ({
45   - profile,
46   - loading: loading.effects['profile/fetchBasic'],
  44 +@connect(({ BLOCK_NAME, loading }) => ({
  45 + BLOCK_NAME,
  46 + loading: loading.effects['BLOCK_NAME/fetchBasic'],
47 47 }))
48   -class BasicProfile extends Component {
  48 +class PAGE_NAME_UPPER_CAMEL_CASE extends Component {
49 49 componentDidMount() {
50 50 const { dispatch } = this.props;
51 51 dispatch({
52   - type: 'profile/fetchBasic',
  52 + type: 'BLOCK_NAME/fetchBasic',
53 53 });
54 54 }
55 55
56 56 render() {
57   - const { profile, loading } = this.props;
58   - const { basicGoods, basicProgress } = profile;
  57 + const { BLOCK_NAME, loading } = this.props;
  58 + const { basicGoods, basicProgress } = BLOCK_NAME;
59 59 let goodsData = [];
60 60 if (basicGoods.length) {
61 61 let num = 0;
... ... @@ -182,4 +182,4 @@ class BasicProfile extends Component {
182 182 }
183 183 }
184 184
185   -export default BasicProfile;
  185 +export default PAGE_NAME_UPPER_CAMEL_CASE;
... ...
1   -import { createContext } from 'react';
2   -
3   -export default createContext();
1   -import { queryBasicProfile, queryAdvancedProfile } from '../services/api';
  1 +import { queryBasicProfile } from './service';
2 2
3 3 export default {
4   - namespace: 'profile',
  4 + namespace: 'BLOCK_NAME',
5 5
6 6 state: {
7 7 basicGoods: [],
8   - advancedOperation1: [],
9   - advancedOperation2: [],
10   - advancedOperation3: [],
11 8 },
12 9
13 10 effects: {
... ... @@ -18,13 +15,6 @@ export default {
18 15 payload: response,
19 16 });
20 17 },
21   - *fetchAdvanced(_, { call, put }) {
22   - const response = yield call(queryAdvancedProfile);
23   - yield put({
24   - type: 'show',
25   - payload: response,
26   - });
27   - },
28 18 },
29 19
30 20 reducers: {
... ...
  1 +import request from 'umi-request';
  2 +
  3 +export async function queryBasicProfile() {
  4 + return request('/api/BLOCK_NAME/basic');
  5 +}
... ...
1   -import { stringify } from 'qs';
2   -import request from '../utils/request';
3   -
4   -export async function queryProjectNotice() {
5   - return request('/api/project/notice');
6   -}
7   -
8   -export async function queryActivities() {
9   - return request('/api/activities');
10   -}
11   -
12   -export async function queryRule(params) {
13   - return request(`/api/rule?${stringify(params)}`);
14   -}
15   -
16   -export async function removeRule(params) {
17   - return request('/api/rule', {
18   - method: 'POST',
19   - body: {
20   - ...params,
21   - method: 'delete',
22   - },
23   - });
24   -}
25   -
26   -export async function addRule(params) {
27   - return request('/api/rule', {
28   - method: 'POST',
29   - body: {
30   - ...params,
31   - method: 'post',
32   - },
33   - });
34   -}
35   -
36   -export async function updateRule(params) {
37   - return request('/api/rule', {
38   - method: 'POST',
39   - body: {
40   - ...params,
41   - method: 'update',
42   - },
43   - });
44   -}
45   -
46   -export async function fakeSubmitForm(params) {
47   - return request('/api/forms', {
48   - method: 'POST',
49   - body: params,
50   - });
51   -}
52   -
53   -export async function fakeChartData() {
54   - return request('/api/fake_chart_data');
55   -}
56   -
57   -export async function queryTags() {
58   - return request('/api/tags');
59   -}
60   -
61   -export async function queryBasicProfile() {
62   - return request('/api/profile/basic');
63   -}
64   -
65   -export async function queryAdvancedProfile() {
66   - return request('/api/profile/advanced');
67   -}
68   -
69   -export async function queryFakeList(params) {
70   - return request(`/api/fake_list?${stringify(params)}`);
71   -}
72   -
73   -export async function removeFakeList(params) {
74   - const { count = 5, ...restParams } = params;
75   - return request(`/api/fake_list?count=${count}`, {
76   - method: 'POST',
77   - body: {
78   - ...restParams,
79   - method: 'delete',
80   - },
81   - });
82   -}
83   -
84   -export async function addFakeList(params) {
85   - const { count = 5, ...restParams } = params;
86   - return request(`/api/fake_list?count=${count}`, {
87   - method: 'POST',
88   - body: {
89   - ...restParams,
90   - method: 'post',
91   - },
92   - });
93   -}
94   -
95   -export async function updateFakeList(params) {
96   - const { count = 5, ...restParams } = params;
97   - return request(`/api/fake_list?count=${count}`, {
98   - method: 'POST',
99   - body: {
100   - ...restParams,
101   - method: 'update',
102   - },
103   - });
104   -}
105   -
106   -export async function fakeAccountLogin(params) {
107   - return request('/api/login/account', {
108   - method: 'POST',
109   - body: params,
110   - });
111   -}
112   -
113   -export async function fakeRegister(params) {
114   - return request('/api/register', {
115   - method: 'POST',
116   - body: params,
117   - });
118   -}
119   -
120   -export async function queryNotices() {
121   - return request('/api/notices');
122   -}
123   -
124   -export async function getFakeCaptcha(mobile) {
125   - return request(`/api/captcha?mobile=${mobile}`);
126   -}
1   -import request from 'umi-request';
2   -import { notification } from 'antd';
3   -import router from 'umi/router';
4   -import hash from 'hash.js';
5   -import { isAntdPro } from './utils';
6   -
7   -const codeMessage = {
8   - 200: '服务器成功返回请求的数据。',
9   - 201: '新建或修改数据成功。',
10   - 202: '一个请求已经进入后台排队(异步任务)。',
11   - 204: '删除数据成功。',
12   - 400: '发出的请求有错误,服务器没有进行新建或修改数据的操作。',
13   - 401: '用户没有权限(令牌、用户名、密码错误)。',
14   - 403: '用户得到授权,但是访问是被禁止的。',
15   - 404: '发出的请求针对的是不存在的记录,服务器没有进行操作。',
16   - 406: '请求的格式不可得。',
17   - 410: '请求的资源被永久删除,且不会再得到的。',
18   - 422: '当创建一个对象时,发生一个验证错误。',
19   - 500: '服务器发生错误,请检查服务器。',
20   - 502: '网关错误。',
21   - 503: '服务不可用,服务器暂时过载或维护。',
22   - 504: '网关超时。',
23   -};
24   -
25   -const checkStatus = response => {
26   - if (response.status >= 200 && response.status < 300) {
27   - return response;
28   - }
29   - const errortext = codeMessage[response.status] || response.statusText;
30   - notification.error({
31   - message: `请求错误 ${response.status}: ${response.url}`,
32   - description: errortext,
33   - });
34   - const error = new Error(errortext);
35   - error.name = response.status;
36   - error.response = response;
37   - throw error;
38   -};
39   -
40   -const cachedSave = (response, hashcode) => {
41   - /**
42   - * Clone a response data and store it in sessionStorage
43   - * Does not support data other than json, Cache only json
44   - */
45   - const contentType = response.headers.get('Content-Type');
46   - if (contentType && contentType.match(/application\/json/i)) {
47   - // All data is saved as text
48   - response
49   - .clone()
50   - .text()
51   - .then(content => {
52   - sessionStorage.setItem(hashcode, content);
53   - sessionStorage.setItem(`${hashcode}:timestamp`, Date.now());
54   - });
55   - }
56   - return response;
57   -};
58   -
59   -/**
60   - * Requests a URL, returning a promise.
61   - *
62   - * @param {string} url The URL we want to request
63   - * @param {object} [option] The options we want to pass to "fetch"
64   - * @return {object} An object containing either "data" or "err"
65   - */
66   -export default function(url, option) {
67   - const options = {
68   - expirys: isAntdPro(),
69   - ...option,
70   - };
71   - /**
72   - * Produce fingerprints based on url and parameters
73   - * Maybe url has the same parameters
74   - */
75   - const fingerprint = url + (options.body ? JSON.stringify(options.body) : '');
76   - const hashcode = hash
77   - .sha256()
78   - .update(fingerprint)
79   - .digest('hex');
80   -
81   - const defaultOptions = {
82   - credentials: 'include',
83   - };
84   - const newOptions = { ...defaultOptions, ...options };
85   - if (
86   - newOptions.method === 'POST' ||
87   - newOptions.method === 'PUT' ||
88   - newOptions.method === 'DELETE'
89   - ) {
90   - if (!(newOptions.body instanceof FormData)) {
91   - newOptions.headers = {
92   - Accept: 'application/json',
93   - 'Content-Type': 'application/json; charset=utf-8',
94   - ...newOptions.headers,
95   - };
96   - newOptions.body = JSON.stringify(newOptions.body);
97   - } else {
98   - // newOptions.body is FormData
99   - newOptions.headers = {
100   - Accept: 'application/json',
101   - ...newOptions.headers,
102   - };
103   - }
104   - }
105   -
106   - const expirys = options.expirys && 60;
107   - // options.expirys !== false, return the cache,
108   - if (options.expirys !== false) {
109   - const cached = sessionStorage.getItem(hashcode);
110   - const whenCached = sessionStorage.getItem(`${hashcode}:timestamp`);
111   - if (cached !== null && whenCached !== null) {
112   - const age = (Date.now() - whenCached) / 1000;
113   - if (age < expirys) {
114   - const response = new Response(new Blob([cached]));
115   - return response.json();
116   - }
117   - sessionStorage.removeItem(hashcode);
118   - sessionStorage.removeItem(`${hashcode}:timestamp`);
119   - }
120   - }
121   - return fetch(url, newOptions)
122   - .then(checkStatus)
123   - .then(response => cachedSave(response, hashcode))
124   - .then(response => {
125   - // DELETE and 204 do not return data by default
126   - // using .json will report an error.
127   - if (newOptions.method === 'DELETE' || response.status === 204) {
128   - return response.text();
129   - }
130   - return response.json();
131   - })
132   - .catch(e => {
133   - const status = e.name;
134   - if (status === 401) {
135   - // @HACK
136   - /* eslint-disable no-underscore-dangle */
137   - window.g_app._store.dispatch({
138   - type: 'login/logout',
139   - });
140   - return;
141   - }
142   - // environment should not be used
143   - if (status === 403) {
144   - router.push('/exception/403');
145   - return;
146   - }
147   - if (status <= 504 && status >= 500) {
148   - router.push('/exception/500');
149   - return;
150   - }
151   - if (status >= 404 && status < 422) {
152   - router.push('/exception/404');
153   - }
154   - });
155   -}
1   -import moment from 'moment';
2   -import React from 'react';
3   -import nzh from 'nzh/cn';
4   -import { parse, stringify } from 'qs';
5   -
6   -export function fixedZero(val) {
7   - return val * 1 < 10 ? `0${val}` : val;
8   -}
9   -
10   -export function getTimeDistance(type) {
11   - const now = new Date();
12   - const oneDay = 1000 * 60 * 60 * 24;
13   -
14   - if (type === 'today') {
15   - now.setHours(0);
16   - now.setMinutes(0);
17   - now.setSeconds(0);
18   - return [moment(now), moment(now.getTime() + (oneDay - 1000))];
19   - }
20   -
21   - if (type === 'week') {
22   - let day = now.getDay();
23   - now.setHours(0);
24   - now.setMinutes(0);
25   - now.setSeconds(0);
26   -
27   - if (day === 0) {
28   - day = 6;
29   - } else {
30   - day -= 1;
31   - }
32   -
33   - const beginTime = now.getTime() - day * oneDay;
34   -
35   - return [moment(beginTime), moment(beginTime + (7 * oneDay - 1000))];
36   - }
37   -
38   - if (type === 'month') {
39   - const year = now.getFullYear();
40   - const month = now.getMonth();
41   - const nextDate = moment(now).add(1, 'months');
42   - const nextYear = nextDate.year();
43   - const nextMonth = nextDate.month();
44   -
45   - return [
46   - moment(`${year}-${fixedZero(month + 1)}-01 00:00:00`),
47   - moment(moment(`${nextYear}-${fixedZero(nextMonth + 1)}-01 00:00:00`).valueOf() - 1000),
48   - ];
49   - }
50   -
51   - const year = now.getFullYear();
52   - return [moment(`${year}-01-01 00:00:00`), moment(`${year}-12-31 23:59:59`)];
53   -}
54   -
55   -export function getPlainNode(nodeList, parentPath = '') {
56   - const arr = [];
57   - nodeList.forEach(node => {
58   - const item = node;
59   - item.path = `${parentPath}/${item.path || ''}`.replace(/\/+/g, '/');
60   - item.exact = true;
61   - if (item.children && !item.component) {
62   - arr.push(...getPlainNode(item.children, item.path));
63   - } else {
64   - if (item.children && item.component) {
65   - item.exact = false;
66   - }
67   - arr.push(item);
68   - }
69   - });
70   - return arr;
71   -}
72   -
73   -export function digitUppercase(n) {
74   - return nzh.toMoney(n);
75   -}
76   -
77   -function getRelation(str1, str2) {
78   - if (str1 === str2) {
79   - console.warn('Two path are equal!'); // eslint-disable-line
80   - }
81   - const arr1 = str1.split('/');
82   - const arr2 = str2.split('/');
83   - if (arr2.every((item, index) => item === arr1[index])) {
84   - return 1;
85   - }
86   - if (arr1.every((item, index) => item === arr2[index])) {
87   - return 2;
88   - }
89   - return 3;
90   -}
91   -
92   -function getRenderArr(routes) {
93   - let renderArr = [];
94   - renderArr.push(routes[0]);
95   - for (let i = 1; i < routes.length; i += 1) {
96   - // 去重
97   - renderArr = renderArr.filter(item => getRelation(item, routes[i]) !== 1);
98   - // 是否包含
99   - const isAdd = renderArr.every(item => getRelation(item, routes[i]) === 3);
100   - if (isAdd) {
101   - renderArr.push(routes[i]);
102   - }
103   - }
104   - return renderArr;
105   -}
106   -
107   -/**
108   - * Get router routing configuration
109   - * { path:{name,...param}}=>Array<{name,path ...param}>
110   - * @param {string} path
111   - * @param {routerData} routerData
112   - */
113   -export function getRoutes(path, routerData) {
114   - let routes = Object.keys(routerData).filter(
115   - routePath => routePath.indexOf(path) === 0 && routePath !== path
116   - );
117   - // Replace path to '' eg. path='user' /user/name => name
118   - routes = routes.map(item => item.replace(path, ''));
119   - // Get the route to be rendered to remove the deep rendering
120   - const renderArr = getRenderArr(routes);
121   - // Conversion and stitching parameters
122   - const renderRoutes = renderArr.map(item => {
123   - const exact = !routes.some(route => route !== item && getRelation(route, item) === 1);
124   - return {
125   - exact,
126   - ...routerData[`${path}${item}`],
127   - key: `${path}${item}`,
128   - path: `${path}${item}`,
129   - };
130   - });
131   - return renderRoutes;
132   -}
133   -
134   -export function getPageQuery() {
135   - return parse(window.location.href.split('?')[1]);
136   -}
137   -
138   -export function getQueryPath(path = '', query = {}) {
139   - const search = stringify(query);
140   - if (search.length) {
141   - return `${path}?${search}`;
142   - }
143   - return path;
144   -}
145   -
146   -/* eslint no-useless-escape:0 */
147   -const reg = /(((^https?:(?:\/\/)?)(?:[-;:&=\+\$,\w]+@)?[A-Za-z0-9.-]+(?::\d+)?|(?:www.|[-;:&=\+\$,\w]+@)[A-Za-z0-9.-]+)((?:\/[\+~%\/.\w-_]*)?\??(?:[-\+=&;%@.\w_]*)#?(?:[\w]*))?)$/;
148   -
149   -export function isUrl(path) {
150   - return reg.test(path);
151   -}
152   -
153   -export function formatWan(val) {
154   - const v = val * 1;
155   - if (!v || Number.isNaN(v)) return '';
156   -
157   - let result = val;
158   - if (val > 10000) {
159   - result = Math.floor(val / 10000);
160   - result = (
161   - <span>
162   - {result}
163   - <span
164   - style={{
165   - position: 'relative',
166   - top: -2,
167   - fontSize: 14,
168   - fontStyle: 'normal',
169   - marginLeft: 2,
170   - }}
171   - >
172   -
173   - </span>
174   - </span>
175   - );
176   - }
177   - return result;
178   -}
179   -
180   -// 给官方演示站点用,用于关闭真实开发环境不需要使用的特性
181   -export function isAntdPro() {
182   - return window.location.hostname === 'preview.pro.ant.design';
183   -}
注册登录 后发表评论