Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
J
jinfa-admin
Project
Project
Details
Activity
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
shenshaokai
jinfa-admin
Commits
73bdc9e6
Commit
73bdc9e6
authored
Jun 09, 2021
by
XieZhiXiong
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: 添加 FixUpload 组件
parent
2cd161b8
Show whitespace changes
Inline
Side-by-side
Showing
3 changed files
with
89 additions
and
19 deletions
+89
-19
index.tsx
src/components/NiceForm/components/AntUpload/index.tsx
+61
-17
FixUpload.tsx
src/components/NiceForm/components/FixUpload.tsx
+26
-0
index.tsx
src/components/NiceForm/index.tsx
+2
-2
No files found.
src/components/NiceForm/components/AntUpload/index.tsx
View file @
73bdc9e6
...
@@ -7,8 +7,11 @@ import {
...
@@ -7,8 +7,11 @@ import {
LoadingOutlined
,
LoadingOutlined
,
PlusOutlined
,
PlusOutlined
,
UploadOutlined
,
UploadOutlined
,
InboxOutlined
InboxOutlined
,
FileFilled
,
DeleteOutlined
}
from
'@ant-design/icons'
}
from
'@ant-design/icons'
const
{
Dragger
:
UploadDragger
}
=
AntdUpload
const
{
Dragger
:
UploadDragger
}
=
AntdUpload
const
exts
=
[
const
exts
=
[
...
@@ -93,6 +96,26 @@ const testOpts = (ext, options) => {
...
@@ -93,6 +96,26 @@ const testOpts = (ext, options) => {
return
true
return
true
}
}
const
getURL
=
(
target
:
any
)
=>
{
return
target
?.[
'url'
]
||
target
?.[
'downloadURL'
]
||
target
?.[
'imgURL'
]
}
const
getThumbURL
=
(
target
:
any
)
=>
{
return
(
target
?.[
'thumbUrl'
]
||
target
?.[
'url'
]
||
target
?.[
'downloadURL'
]
||
target
?.[
'imgURL'
]
)
}
const
getState
=
(
target
:
any
)
=>
{
if
(
target
?.
success
===
false
)
return
'error'
if
(
target
?.
failed
===
true
)
return
'error'
if
(
target
?.
error
)
return
'error'
return
target
?.
state
||
target
?.
status
}
const
getImageByUrl
=
(
url
,
options
)
=>
{
const
getImageByUrl
=
(
url
,
options
)
=>
{
for
(
let
i
=
0
;
i
<
exts
.
length
;
i
++
)
{
for
(
let
i
=
0
;
i
<
exts
.
length
;
i
++
)
{
if
(
exts
[
i
].
ext
.
test
(
url
)
&&
testOpts
(
exts
[
i
].
ext
,
options
))
{
if
(
exts
[
i
].
ext
.
test
(
url
)
&&
testOpts
(
exts
[
i
].
ext
,
options
))
{
...
@@ -105,17 +128,19 @@ const getImageByUrl = (url, options) => {
...
@@ -105,17 +128,19 @@ const getImageByUrl = (url, options) => {
const
normalizeFileList
=
fileList
=>
{
const
normalizeFileList
=
fileList
=>
{
if
(
fileList
&&
fileList
.
length
)
{
if
(
fileList
&&
fileList
.
length
)
{
return
fileList
.
map
(
file
=>
{
return
fileList
.
map
((
file
,
index
)
=>
{
return
file
.
response
?
{
return
{
uid
:
file
.
uid
,
...
file
,
status
:
file
.
status
,
uid
:
file
.
uid
||
`
${
index
}
`
,
name
:
file
.
name
,
status
:
getState
(
file
.
response
)
||
getState
(
file
),
url
:
file
.
downloadURL
||
file
.
imgURL
||
file
.
url
,
url
:
getURL
(
file
)
||
getURL
(
file
?.
response
),
...
file
.
response
.
data
,
thumbUrl
:
getImageByUrl
(
thumbUrl
:
file
.
imgURL
||
getImageByUrl
(
file
.
downloadURL
||
file
.
url
,
{
getThumbURL
(
file
)
||
getThumbURL
(
file
?.
response
),
exclude
:
[
'.png'
,
'.jpg'
,
'.jpeg'
,
'.gif'
]
{
})
exclude
:
[
'.png'
,
'.jpg'
,
'.jpeg'
,
'.gif'
],
}
:
file
;
}
),
}
})
})
}
}
return
[]
return
[]
...
@@ -153,6 +178,7 @@ export interface IUploaderProps {
...
@@ -153,6 +178,7 @@ export interface IUploaderProps {
locale
:
{
[
name
:
string
]:
any
}
locale
:
{
[
name
:
string
]:
any
}
value
:
any
[]
value
:
any
[]
listType
?:
UploadListType
listType
?:
UploadListType
readOnly
?:
boolean
}
}
export
const
Upload
=
connect
({
export
const
Upload
=
connect
({
...
@@ -181,12 +207,20 @@ export const Upload = connect({
...
@@ -181,12 +207,20 @@ export const Upload = connect({
const
fileList
=
[]
const
fileList
=
[]
value
.
forEach
(
item
=>
{
value
.
forEach
(
item
=>
{
if
(
item
.
uid
!==
file
.
uid
)
{
if
(
item
.
uid
!==
file
.
uid
)
{
fileList
.
push
(
item
)
fileList
.
push
(
item
as
never
)
}
}
})
})
this
.
props
.
onChange
(
fileList
)
this
.
props
.
onChange
(
fileList
)
}
}
public
removeItem
=
(
item
)
=>
{
const
{
onChange
}
=
this
.
props
this
.
setState
({
value
:
this
.
state
.
value
.
filter
(
ele
=>
ele
.
uid
!==
item
.
uid
)
})
onChange
(
this
.
state
.
value
.
filter
(
ele
=>
ele
.
uid
!==
item
.
uid
))
}
public
onChangeHandler
=
({
fileList
})
=>
{
public
onChangeHandler
=
({
fileList
})
=>
{
const
{
onChange
}
=
this
.
props
const
{
onChange
}
=
this
.
props
fileList
=
toArr
(
fileList
)
fileList
=
toArr
(
fileList
)
...
@@ -239,8 +273,7 @@ export const Upload = connect({
...
@@ -239,8 +273,7 @@ export const Upload = connect({
public
render
()
{
public
render
()
{
// eslint-disable-next-line @typescript-eslint/no-unused-vars
// eslint-disable-next-line @typescript-eslint/no-unused-vars
const
{
listType
,
locale
,
onChange
,
value
,
...
others
}
=
this
.
props
const
{
listType
=
'text'
,
locale
,
onChange
,
value
=
[],
...
others
}
=
this
.
props
if
(
listType
.
indexOf
(
'card'
)
>
-
1
)
{
if
(
listType
.
indexOf
(
'card'
)
>
-
1
)
{
return
(
return
(
<
AntdUpload
<
AntdUpload
...
@@ -250,7 +283,9 @@ export const Upload = connect({
...
@@ -250,7 +283,9 @@ export const Upload = connect({
onRemove=
{
this
.
onRemoveHandler
}
onRemove=
{
this
.
onRemoveHandler
}
listType=
{
'picture-card'
}
listType=
{
'picture-card'
}
>
>
{
!
others
.
readOnly
?
(
<
UploadPlaceholder
/>
<
UploadPlaceholder
/>
)
:
null
}
</
AntdUpload
>
</
AntdUpload
>
)
)
}
}
...
@@ -271,20 +306,29 @@ export const Upload = connect({
...
@@ -271,20 +306,29 @@ export const Upload = connect({
</
UploadDragger
>
</
UploadDragger
>
)
)
}
}
return
(
return
(<
div
>
{
value
.
map
(
item
=>
(<
p
key=
{
item
.
uid
}
style=
{
{
width
:
424
,
display
:
'flex'
,
justifyContent
:
'space-between'
}
}
>
<
a
href=
{
item
.
url
}
target=
"_blank"
><
FileFilled
/>
{
item
.
name
}
</
a
>
{
!
others
.
readOnly
?
<
span
style=
{
{
cursor
:
'pointer'
}
}
onClick=
{
()
=>
this
.
removeItem
(
item
)
}
><
DeleteOutlined
/></
span
>
:
null
}
</
p
>))
}
<
AntdUpload
<
AntdUpload
{
...
others
}
{
...
others
}
fileList=
{
this
.
state
.
value
}
fileList=
{
this
.
state
.
value
}
onChange=
{
this
.
onChangeHandler
}
onChange=
{
this
.
onChangeHandler
}
onRemove=
{
this
.
onRemoveHandler
}
onRemove=
{
this
.
onRemoveHandler
}
listType=
{
listType
}
listType=
{
listType
}
itemRender=
{
()
=>
null
}
>
>
{
!
others
.
readOnly
?
(
<
Button
style=
{
{
margin
:
'0 0 10px'
}
}
>
<
Button
style=
{
{
margin
:
'0 0 10px'
}
}
>
<
UploadOutlined
/>
<
UploadOutlined
/>
{
(
locale
&&
locale
.
uploadText
)
||
'上传文件'
}
{
(
locale
&&
locale
.
uploadText
)
||
'上传文件'
}
</
Button
>
</
Button
>
)
:
null
}
</
AntdUpload
>
</
AntdUpload
>
)
</
div
>
)
}
}
}
}
)
)
...
...
src/components/NiceForm/components/FixUpload.tsx
0 → 100644
View file @
73bdc9e6
/*
* @Author: XieZhiXiong
* @Date: 2021-06-01 17:32:51
* @LastEditors: XieZhiXiong
* @LastEditTime: 2021-06-01 17:44:27
* @Description: 默认带上 token 的 AntUpload
*/
import
React
from
'react'
;
import
{
getAuth
}
from
'@/utils/auth'
;
import
AntUpload
from
'./AntUpload'
;
const
FixUpload
=
(
props
)
=>
{
const
{
token
}
=
(
getAuth
()
||
{});
return
(
<
AntUpload
headers=
{
{
token
,
}
}
{
...
props
}
/>
);
};
FixUpload
.
isFieldComponent
=
true
;
export
default
FixUpload
;
src/components/NiceForm/index.tsx
View file @
73bdc9e6
...
@@ -26,7 +26,7 @@ import { Checkbox } from '@formily/antd-components';
...
@@ -26,7 +26,7 @@ import { Checkbox } from '@formily/antd-components';
import
DateSelect
from
'./components/DateSelect'
;
import
DateSelect
from
'./components/DateSelect'
;
import
DateRangePickerUnix
from
'./components/DateRangePickerUnix'
;
import
DateRangePickerUnix
from
'./components/DateRangePickerUnix'
;
import
SmilingFace
from
'./components/SmilingFace'
;
import
SmilingFace
from
'./components/SmilingFace'
;
import
AntUpload
from
'./components/Ant
Upload'
;
import
FixUpload
from
'./components/Fix
Upload'
;
import
'./index.less'
import
'./index.less'
import
{
currentStateType
,
getCurrentState
}
from
'./utils/keepAlive'
;
import
{
currentStateType
,
getCurrentState
}
from
'./utils/keepAlive'
;
import
{
useRouteMatch
}
from
'umi'
;
import
{
useRouteMatch
}
from
'umi'
;
...
@@ -99,7 +99,7 @@ export const componentExport = {
...
@@ -99,7 +99,7 @@ export const componentExport = {
DateSelect
,
DateSelect
,
DateRangePickerUnix
,
DateRangePickerUnix
,
SmilingFace
,
SmilingFace
,
Ant
Upload
,
Fix
Upload
,
}
}
const
NiceForm
:
React
.
FC
<
NiceFormProps
>
=
props
=>
{
const
NiceForm
:
React
.
FC
<
NiceFormProps
>
=
props
=>
{
const
{
children
,
components
,
...
reset
}
=
props
;
const
{
children
,
components
,
...
reset
}
=
props
;
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment