张延森 4 years ago
parent
commit
9296e0d7a8
2 changed files with 7 additions and 42 deletions
  1. 3
    41
      src/pages/mpSetting/components/MiniAppMedia.jsx
  2. 4
    1
      src/pages/mpSetting/index.jsx

+ 3
- 41
src/pages/mpSetting/components/MiniAppMedia.jsx View File

1
 import React, { useEffect, useMemo, useState, useCallback } from 'react'
1
 import React, { useEffect, useMemo, useState, useCallback } from 'react'
2
-import { Icon, Upload, Modal } from 'antd'
2
+import { Icon, Upload, Button } from 'antd'
3
 import { fetch, apis } from '@/utils/request'
3
 import { fetch, apis } from '@/utils/request'
4
 
4
 
5
 const postMiniApp = fetch(apis.mp.miniapp)
5
 const postMiniApp = fetch(apis.mp.miniapp)
6
 
6
 
7
-export default props => {
8
-  const [previewVisible, setPreviewVisible] = useState(false)
9
-  const [previewImage, setPreviewImage] = useState()
10
-  const [imageUrl, setImageUrl] = useState()
11
-  const [fileList, setFileList] = useState([])
12
-
13
-  const uploadButton = useMemo(() => {
14
-    return (
15
-      <div>
16
-        <Icon type="plus" />
17
-        <div>Upload</div>
18
-      </div>
19
-    )
20
-  }, [])
21
-  
7
+export default props => {  
22
   const customRequest = useCallback(({file, onError, onSuccess}) => {
8
   const customRequest = useCallback(({file, onError, onSuccess}) => {
23
     const data = new FormData()
9
     const data = new FormData()
24
     data.append('file', file)
10
     data.append('file', file)
25
 
11
 
26
     postMiniApp({ data }).then((res) => {
12
     postMiniApp({ data }).then((res) => {
27
-      setImageUrl(res.url)
28
-      setFileList([{
29
-        uid: '-1',
30
-        name: 'image.png',
31
-        status: 'done',
32
-        url: res.url,
33
-      }])
34
       props.onChange(res)
13
       props.onChange(res)
35
       onSuccess(res.url, file)
14
       onSuccess(res.url, file)
36
     }).catch(onError)
15
     }).catch(onError)
42
     }
21
     }
43
   }, [])
22
   }, [])
44
 
23
 
45
-  useEffect(() => {
46
-    if (props.value) {
47
-      setFileList([{
48
-        uid: '-1',
49
-        name: 'image.png',
50
-        status: 'done',
51
-        url: props.value,
52
-      }])
53
-    }
54
-  }, [props.value])
55
-
56
   return (
24
   return (
57
     <div>
25
     <div>
58
       <Upload
26
       <Upload
59
         name="file"
27
         name="file"
60
         accept=".jpg, .jpeg"
28
         accept=".jpg, .jpeg"
61
-        listType="picture-card"
62
-        fileList={fileList}
63
         customRequest={customRequest}
29
         customRequest={customRequest}
64
-        onPreview={() => setPreviewVisible(true)}
65
       >
30
       >
66
-        {fileList.length >= 1 ? null : uploadButton}
31
+        <Button><Icon type="upload" /> 上传</Button>
67
       </Upload>
32
       </Upload>
68
-      <Modal visible={previewVisible} footer={null} onCancel={() => setPreviewVisible(false)}>
69
-        <img alt="" style={{ width: '100%' }} src={previewImage} />
70
-      </Modal>
71
     </div>
33
     </div>
72
   )
34
   )
73
 }
35
 }

+ 4
- 1
src/pages/mpSetting/index.jsx View File

77
           }
77
           }
78
         </Form.Item>
78
         </Form.Item>
79
         <Form.Item label="小程序封面" help="仅支持JPG图片,建议大小为520*416">
79
         <Form.Item label="小程序封面" help="仅支持JPG图片,建议大小为520*416">
80
-          <MiniAppMedia onChange={handleMiniAppChange} value={detailData.miniapp_url} />
80
+          <div>
81
+            {detailData.miniappMedia && <span style={{display: 'inline-block', marginRight: '24px'}}>{detailData.miniappMedia}</span>}
82
+            <MiniAppMedia onChange={handleMiniAppChange} value={detailData.miniapp_url} />
83
+          </div>
81
         </Form.Item>
84
         </Form.Item>
82
       </Form>
85
       </Form>
83
     </div>
86
     </div>