张延森 5 anni fa
parent
commit
3b2df2dd4e

+ 1
- 0
config/config.js Vedi File

@@ -83,6 +83,7 @@ export default {
83 83
   },
84 84
   publicPath: './',
85 85
   history: 'hash',
86
+  treeShaking: true,
86 87
   devtool: isAntDesignProPreview ? 'source-map' : false,
87 88
   // umi routes: https://umijs.org/zh/guide/router.html
88 89
   routes,

+ 29
- 18
src/components/XForm/ImageUpload.jsx Vedi File

@@ -16,28 +16,39 @@ class ImageUpload extends React.Component {
16 16
       this.setState({ loading: true });
17 17
       return;
18 18
     }
19
+    
20
+    if (info.file.status === 'removed') {
21
+      this.props.onChange();
22
+    }
19 23
 
20
-    if (info.file.status === "done") {
21
-      this.setState({
22
-        loading: false,
23
-      })
24
+    // if (info.file.status === "done") {
25
+    //   this.setState({
26
+    //     loading: false,
27
+    //   })
24 28
 
25
-      if (info.file.response && info.file.response.url) {
26
-        this.setState({
27
-          imageUrl: info.file.response.thumbUrl,
28
-        });
29
+    //   if (info.file.response && info.file.response.url) {
30
+    //     this.setState({
31
+    //       imageUrl: info.file.response.thumbUrl,
32
+    //     });
29 33
 
30
-        if (typeof this.props.onChange === 'function') {
31
-          this.props.onChange(info.file.response.url);
32
-        }
33
-      }
34
-    }
34
+    //     if (typeof this.props.onChange === 'function') {
35
+    //       this.props.onChange(info.file.response.url);
36
+    //     }
37
+    //   }
38
+    // }
35 39
   };
36 40
 
37
-  render () {
41
+  handleUploadSucess = (url) => {
42
+    this.setState({ loading: false });
43
+    if (typeof this.props.onChange === 'function') {
44
+      this.props.onChange(url);
45
+    }
46
+  }
47
+
48
+  render() {
38 49
     const uploadButton = (
39 50
       <div>
40
-        <Icon style={{ fontSize: '2em', color: '#aaa' }} type={this.state.loading ? "loading" : "plus"} />        
51
+        <Icon style={{ fontSize: '2em', color: '#aaa' }} type={this.state.loading ? "loading" : "plus"} />
41 52
       </div>
42 53
     );
43 54
 
@@ -50,14 +61,14 @@ class ImageUpload extends React.Component {
50 61
         showUploadList={false}
51 62
         beforeUpload={this.props.beforeUpload}
52 63
         onChange={this.handleChange}
53
-
54 64
         {...uploaderProps}
65
+        onSuccess={this.handleUploadSucess}
55 66
       >
56 67
         {(this.state.imageUrl || value) ? (
57 68
           <img src={this.state.imageUrl || value} alt="avatar" style={{ width: "100%" }} />
58 69
         ) : (
59
-          uploadButton
60
-        )}
70
+            uploadButton
71
+          )}
61 72
       </Upload>
62 73
     );
63 74
   }

+ 10
- 0
src/layouts/BasicLayout.jsx Vedi File

@@ -54,6 +54,15 @@ const footerRender = (_, defaultDom) => {
54 54
   )
55 55
 };
56 56
 
57
+const menuHeaderRender = (logo, title) => {
58
+  return (
59
+    <Link to="/">
60
+      {logo}
61
+      {title}
62
+    </Link>
63
+  );
64
+}
65
+
57 66
 const BasicLayout = props => {
58 67
   const { dispatch, children, settings } = props;
59 68
   /**
@@ -114,6 +123,7 @@ const BasicLayout = props => {
114 123
       }}
115 124
       footerRender={footerRender}
116 125
       menuDataRender={menuDataRender}
126
+      menuHeaderRender={menuHeaderRender}
117 127
       // formatMessage={formatMessage}
118 128
       rightContentRender={rightProps => <RightContent {...rightProps} />}
119 129
       {...props}

+ 1
- 1
src/pages/UserManage/Editor/User.jsx Vedi File

@@ -80,9 +80,9 @@ export default (props) => {
80 80
       loginPassword: md5(defaultPass),
81 81
     }
82 82
 
83
+    const data = { ...user, ...dt }
83 84
     setSubmitting(true)
84 85
     if (user && user.userId) {
85
-      const data = { ...user, ...dt }
86 86
       updateUser({ urlData: { id: user.userId }, data }).then((user) => {
87 87
         setSubmitting(false)
88 88
         notification.success({message: '编辑信息成功'})

+ 12
- 2
src/pages/UserManage/index.jsx Vedi File

@@ -45,6 +45,12 @@ export default (props) => {
45 45
     }).catch()
46 46
   }, []);
47 47
 
48
+  const changeMemberStatus = (member, status) => {
49
+    setMembers(members.map((mem) => {
50
+      return mem.userId === member.userId ? { ...member, status } : mem
51
+    }))
52
+  }
53
+
48 54
   const CardBody = (cbProps) => {
49 55
     const handleSwitch = (on) => () => {
50 56
       if (!on) {
@@ -52,13 +58,17 @@ export default (props) => {
52 58
           title: '确定禁用当前用户?',
53 59
           onOk() {
54 60
             turnMember({ urlData: { type: 'off', id: cbProps.userId } }).then(() => {
55
-              notification.success({ message: '禁用成功'})
61
+              notification.success({ message: '禁用成功'});
62
+              // window.location.reload();
63
+              changeMemberStatus(cbProps, 9)
56 64
             }).catch()
57 65
           },
58 66
         });
59 67
       } else {
60 68
         turnMember({ urlData: { type: 'on', id: cbProps.userId } }).then(() => {
61
-          notification.success({ message: '开启成功'})
69
+          notification.success({ message: '开启成功'});
70
+          // window.location.reload();
71
+          changeMemberStatus(cbProps, 1)
62 72
         }).catch()
63 73
       }
64 74
     }

+ 7
- 2
src/services/apis.js Vedi File

@@ -75,11 +75,16 @@ const apis = {
75 75
     },
76 76
   },
77 77
   image: {
78
-    upload: {
78
+    uploadForAnt: {
79 79
       url: `${prefix}/antd/image`,
80 80
       method: 'POST',
81 81
       action: 'center',
82
-    }
82
+    },
83
+    upload: {
84
+      url: `${prefix}/image`,
85
+      method: 'POST',
86
+      action: 'center',
87
+    },
83 88
   },
84 89
 }
85 90
 

+ 40
- 30
src/utils/request.js Vedi File

@@ -26,43 +26,46 @@ const codeMessage = {
26 26
 };
27 27
 
28 28
 const replaceURLParams = (url, params = {}) => {
29
-  return Object.keys(params).reduce((acc, k) => {
30
-    // 此方法对每个元素进行处理
31
-    const re = new RegExp(`:${k}(?!w)`, 'i');
32
-    return acc.replace(re, params[k]);
33
-  }, url);
34
-};
29
+  return Object.keys(params).reduce((acc, k) => { // 此方法对每个元素进行处理
30
+    const re = new RegExp(`:${k}(?!w)`, 'i')
31
+    return acc.replace(re, params[k])
32
+  }, url)
33
+}
35 34
 
36 35
 request.interceptors.request.use((url, options) => {
37
-  const { urlData, headers = {}, logout = false, login = false, action, data, ...opts } = options;
38
-  const apiURL = urlData ? replaceURLParams(url, urlData) : url;
39
-  const token = mixStr(window.localStorage.getItem('test-foobar'));
36
+  const { urlData, headers = {}, logout = false, login = false, action, data, ...opts } = options
37
+  const apiURL = urlData ? replaceURLParams(url, urlData) : url
38
+  const token = mixStr(window.localStorage.getItem('test-foobar'))
40 39
 
41 40
   if (login || logout) {
42
-    window.localStorage.removeItem('test-foobar');
41
+    window.localStorage.removeItem('test-foobar')
43 42
   }
44 43
 
45
-  const authHeader = !login ? { Authorization: `Bearer ${token}` } : {};
46
-  const actionHeader = action ? { 'X-ACTION': action } : {};
44
+  const authHeader = !login ? { Authorization: `Bearer ${token}` } : {}
45
+  const actionHeader = action ? { 'X-ACTION': action  }: {}
47 46
 
48
-  return {
49
-    url: apiURL,
50
-    options: {
51
-      ...opts,
52
-      headers: {
53
-        ...authHeader,
54
-        ...actionHeader,
55
-        ...headers,
47
+  return (
48
+    {
49
+      url: apiURL,
50
+      options: {
51
+        ...opts,
52
+        headers: {
53
+          ...authHeader,
54
+          ...actionHeader,
55
+          ...headers,
56
+        },
57
+        data,
58
+        requestType: data instanceof FormData ? 'form' : 'json',
59
+        credentials: 'include', // 带 cookie
60
+        interceptors: true,
61
+        getResponse: true,
56 62
       },
57
-      data,
58
-      requestType: data instanceof FormData ? 'form' : 'json',
59
-      credentials: 'include', // 带 cookie
60
-      interceptors: true,
61
-    },
62
-  };
63
+    }
64
+  );
63 65
 });
64 66
 
65 67
 request.interceptors.response.use(async (response, options) => {
68
+
66 69
   if (response && response.status) {
67 70
     if (response.status != 200) {
68 71
       const errorText = codeMessage[response.status] || response.statusText;
@@ -73,6 +76,12 @@ request.interceptors.response.use(async (response, options) => {
73 76
       });
74 77
       throw new Error(response.statusText);
75 78
     } else {
79
+      console.log('response.headers: ', response.headers)
80
+      console.log('response.headers.Content-Type: ', response.headers.get('Content-Type'))
81
+      if (response.headers.get('Content-Type') === 'application/octet-stream;charset=utf-8') {
82
+        return await response.clone().blob();
83
+      }
84
+
76 85
       const { code, data, message } = await response.clone().json();
77 86
       if (code != 1000) {
78 87
         if (code === 1001) {
@@ -91,7 +100,7 @@ request.interceptors.response.use(async (response, options) => {
91 100
       }
92 101
 
93 102
       if (data && data.token) {
94
-        window.localStorage.setItem('test-foobar', mixStr(data.token));
103
+        window.localStorage.setItem('test-foobar', mixStr(data.token))
95 104
       }
96 105
 
97 106
       return data;
@@ -104,15 +113,16 @@ request.interceptors.response.use(async (response, options) => {
104 113
   }
105 114
 });
106 115
 
107
-const fetch = api => options => request(api.url, { ...api, ...(options || {}) });
116
+
117
+const fetch = api => options => request(api.url, {...api, ...options || {}})
108 118
 
109 119
 export default config => {
110 120
   if (typeof config === 'string') {
111 121
     return request(config);
112 122
   } else {
113
-    const { url, ...options } = config;
123
+    const {url, ...options} = config;
114 124
     return request(url, options);
115 125
   }
116 126
 };
117 127
 
118
-export { fetch, apis };
128
+export { fetch, apis }

+ 33
- 5
src/utils/upload.js Vedi File

@@ -1,11 +1,39 @@
1
-import apis from '../services/apis';
1
+import { fetch, apis } from './request';
2
+import mixStr from './mixStr';
3
+
4
+const getToken = () => mixStr(window.localStorage.getItem('test-foobar'))
5
+
6
+const uploadImage = fetch(apis.image.upload)
2 7
 
3 8
 const uploaderProps = {
4 9
   name: 'file',
5
-  action: apis.image.upload.url,
6
-  headers: {
7
-    Authorization: `Bearer ${window.localStorage.getItem('x-token')}`
8
-  }
10
+  // action: apis.image.uploadForAnt.url,
11
+  accept: '.png, .jpg, .jpeg, .gif',
12
+  // headers: {
13
+  //   Authorization: `Bearer ${getToken()}`
14
+  // },
15
+  customRequest({
16
+    action,
17
+    file,
18
+    headers,
19
+    onError,
20
+    onProgress,
21
+    onSuccess,
22
+    withCredentials,
23
+  }) {
24
+    const data = new FormData()
25
+    data.append('file', file)
26
+
27
+    uploadImage({ data }).then((img) => {
28
+      onSuccess(img, file);
29
+    }).catch(onError);
30
+
31
+    return {
32
+      abort() {
33
+        console.log('upload progress is aborted.');
34
+      },
35
+    };
36
+  },
9 37
 }
10 38
 
11 39
 export { uploaderProps }