Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
C
CivManage
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
ReactWeb5
CivManage
Commits
83c120ad
Commit
83c120ad
authored
2 years ago
by
皮倩雯
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
fix: '修改路径'
parent
ca5b1db4
Pipeline
#54741
passed with stages
Changes
5
Pipelines
1
Hide whitespace changes
Inline
Side-by-side
Showing
5 changed files
with
0 additions
and
1197 deletions
+0
-1197
AddModal.jsx
src/pages/integratedLogin/AddModal.jsx
+0
-331
Integrate.jsx
src/pages/integratedLogin/Integrate.jsx
+0
-347
Master.jsx
src/pages/integratedLogin/Master.jsx
+0
-283
PreviewModal.jsx
src/pages/integratedLogin/PreviewModal.jsx
+0
-159
integrate.less
src/pages/integratedLogin/integrate.less
+0
-77
No files found.
src/pages/integratedLogin/AddModal.jsx
deleted
100644 → 0
View file @
ca5b1db4
/* eslint-disable prefer-template */
/* eslint-disable react/jsx-boolean-value */
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
{
Form
,
Modal
,
Input
,
notification
,
Radio
,
Button
,
message
,
Upload
,
Row
,
Col
}
from
'antd'
;
import
{
AddIntegratedLogin
,
EditIntegratedLogin
}
from
'@/services/integratedLogin/api'
;
import
{
PlusOutlined
,
LoadingOutlined
}
from
'@ant-design/icons'
;
import
{
get
,
PUBLISH_SERVICE
}
from
'@/services'
;
import
PreviewModal
from
'./PreviewModal'
;
const
{
Item
}
=
Form
;
const
AddModal
=
props
=>
{
const
{
callBackSubmit
=
()
=>
{},
type
,
pickItem
,
visible
,
onCancel
}
=
props
;
const
[
loading
,
setLoading
]
=
useState
(
false
);
const
[
radio
,
setRadio
]
=
useState
(
''
);
const
[
radio2
,
setRadio2
]
=
useState
(
''
);
const
[
flag
,
setFlag
]
=
useState
(
1
);
const
[
form
]
=
Form
.
useForm
();
const
[
imageUrl
,
setImageUrl
]
=
useState
();
const
[
im
,
setIm
]
=
useState
();
const
[
previewModal
,
setPreviewModal
]
=
useState
(
false
);
const
[
keepImgeUrl
,
setKeepImgeUrl
]
=
useState
(
''
);
useEffect
(()
=>
{
if
(
visible
)
{
if
(
type
===
'edit'
)
{
console
.
log
(
pickItem
);
form
.
setFieldsValue
({
accountParam
:
pickItem
.
AccountParam
,
internetAddress
:
pickItem
.
InternetAddress
,
systemClient
:
pickItem
.
SystemClient
,
systemName
:
pickItem
.
SystemName
,
iconUrl
:
pickItem
.
iconUrl
,
subtitle
:
pickItem
.
Subtitle
,
});
if
(
pickItem
.
iconUrl
)
{
// if (
// pickItem.iconUrl.startsWith('CityTemp') ||
// pickItem.iconUrl.startsWith('civ_integratedlogin')
// ) {
// setImageUrl(`http://192.168.12.116:8017/${pickItem.iconUrl}`);
// } else {
setImageUrl
(
window
.
location
.
origin
+
`/
${
pickItem
.
iconUrl
}
`
);
setIm
(
pickItem
.
iconUrl
);
// }
}
else
{
form
.
setFieldsValue
({
iconUrl
:
''
});
setImageUrl
(
''
);
setIm
(
''
);
}
}
else
{
// form.setFieldsValue({ method: 'Get' });
}
}
else
{
setImageUrl
(
''
);
setIm
(
''
);
setKeepImgeUrl
(
''
);
form
.
resetFields
();
}
},
[
visible
]);
// 提交
const
onSubmit
=
()
=>
{
form
.
validateFields
().
then
(
validate
=>
{
if
(
validate
)
{
setLoading
(
true
);
let
obj
=
form
.
getFieldsValue
();
if
(
obj
.
iconUrl
.
file
)
{
obj
.
iconUrl
=
obj
.
iconUrl
.
file
.
response
.
data
;
}
if
(
type
===
'add'
)
{
AddIntegratedLogin
({
...
obj
,
accountType
:
'Panda'
,
})
.
then
(
res
=>
{
if
(
res
.
code
===
0
)
{
onCancel
();
setLoading
(
false
);
callBackSubmit
();
notification
.
success
({
message
:
'提示'
,
duration
:
3
,
description
:
res
.
msg
||
'新增成功'
,
});
}
else
{
setLoading
(
false
);
notification
.
error
({
message
:
'提示'
,
duration
:
3
,
description
:
res
.
msg
||
'新增失败'
,
});
}
})
.
catch
(
err
=>
{
setLoading
(
false
);
});
}
else
{
EditIntegratedLogin
({
...
obj
,
accountType
:
'Panda'
,
id
:
pickItem
.
ID
,
})
.
then
(
res
=>
{
if
(
res
.
code
===
0
)
{
onCancel
();
setLoading
(
false
);
callBackSubmit
();
notification
.
success
({
message
:
'提示'
,
duration
:
3
,
description
:
res
.
msg
||
'编辑成功'
,
});
}
else
{
setLoading
(
false
);
notification
.
error
({
message
:
'提示'
,
duration
:
3
,
description
:
res
.
msg
||
'编辑失败'
,
});
}
})
.
catch
(
err
=>
{
setLoading
(
false
);
});
}
}
});
};
const
layout
=
{
layout
:
'horizontal'
,
labelCol
:
{
span
:
4
},
wrapperCol
:
{
span
:
18
},
};
const
onChange2
=
e
=>
{
setRadio2
(
e
.
target
.
value
);
};
const
onChange
=
e
=>
{
setRadio
(
e
.
target
.
value
);
};
const
beforeUpload
=
file
=>
{
const
isJpgOrPng
=
file
.
type
===
'image/jpeg'
||
file
.
type
===
'image/png'
||
file
.
type
===
'image/jpg'
||
file
.
type
===
'image/gif'
;
if
(
!
isJpgOrPng
)
{
message
.
error
(
'只能上传格式为jpeg/png/gif的图片!'
);
}
const
isLt2M
=
file
.
size
/
1024
/
1024
<
2
;
if
(
!
isLt2M
)
{
message
.
error
(
'图片必须小于2MB!'
);
}
return
isJpgOrPng
&&
isLt2M
;
};
const
handleChange
=
info
=>
{
setKeepImgeUrl
(
''
);
setIm
(
''
);
if
(
info
.
file
.
status
===
'uploading'
)
{
setLoading
(
true
);
return
;
}
if
(
info
.
file
.
status
===
'done'
)
{
getBase64
(
info
.
file
.
originFileObj
,
url
=>
{
setLoading
(
false
);
setImageUrl
(
url
);
});
}
};
const
getBase64
=
(
img
,
callback
)
=>
{
const
reader
=
new
FileReader
();
reader
.
addEventListener
(
'load'
,
()
=>
callback
(
reader
.
result
));
reader
.
readAsDataURL
(
img
);
};
const
uploadButton
=
(
<
div
>
{
loading
?
<
LoadingOutlined
/>
:
<
PlusOutlined
/>
}
<
div
style=
{
{
marginTop
:
8
,
}
}
>
上传
</
div
>
</
div
>
);
const
pictruePreview
=
()
=>
{
setPreviewModal
(
true
);
};
const
onOk
=
props
=>
{
if
(
props
)
{
console
.
log
(
props
.
path
);
console
.
log
(
process
.
env
.
PROXY
);
setImageUrl
(
window
.
location
.
origin
+
`/
${
props
.
path
}
`
);
setIm
(
props
.
path
);
setKeepImgeUrl
(
props
.
path
);
form
.
setFieldsValue
({
iconUrl
:
`
${
props
.
path
}
`
});
}
};
return
(
<
Modal
title=
{
type
===
'add'
?
'新增集成网站'
:
'编辑集成网站'
}
style=
{
{
top
:
'150px'
}
}
width=
"700px"
destroyOnClose
maskClosable=
{
false
}
cancelText=
"取消"
okText=
"确认"
{
...
props
}
onOk=
{
()
=>
onSubmit
()
}
confirmLoading=
{
loading
}
forceRender=
{
true
}
getContainer=
{
false
}
>
<
Form
form=
{
form
}
{
...
layout
}
>
<
Item
label=
"名称"
name=
"systemName"
rules=
{
[{
required
:
true
,
message
:
'请输入名称'
}]
}
>
<
Input
allowClear
style=
{
{
width
:
'100%'
}
}
placeholder=
"请输入名称"
/>
</
Item
>
<
Item
label=
"标识"
name=
"systemClient"
rules=
{
[{
required
:
true
,
message
:
'请输入标识'
}]
}
>
<
Input
allowClear
placeholder=
"请输入标识"
/>
</
Item
>
<
Item
label=
"副标题"
name=
"subtitle"
rules=
{
[{
required
:
true
,
message
:
'请输入副标题'
}]
}
>
<
Input
allowClear
placeholder=
"建议使用英文"
/>
</
Item
>
{
/* <Item
label="内网地址"
name="intranetAddress"
rules={[{ required: true, message: '请输入内网地址' }]}
>
<Input allowClear />
</Item> */
}
<
Item
label=
"访问地址"
name=
"internetAddress"
rules=
{
[{
required
:
true
,
message
:
'请输入外网地址'
}]
}
>
<
Input
allowClear
placeholder=
"示例:http://192.168.12.116:8500/civbase/user/noscret?client=city"
/>
</
Item
>
{
/* <Item label="请求方式" name="method">
<Radio.Group onChange={onChange2} value={radio2}>
<Radio value="Get">Get</Radio>
<Radio value="Post">Post</Radio>
</Radio.Group>
</Item> */
}
<
Item
label=
"账号参数"
name=
"accountParam"
rules=
{
[{
required
:
true
,
message
:
'请输入参数'
}]
}
>
<
Input
allowClear
/>
{
/* <Radio.Group onChange={onChange} value={radio}>
<Radio value={0}>使用熊猫身份</Radio>
<Radio value={1}>使用令牌</Radio>
</Radio.Group> */
}
</
Item
>
<
Row
>
<
Col
span=
{
10
}
>
<
Item
label=
"图标"
name=
"iconUrl"
style=
{
{
height
:
'112px'
}
}
labelCol=
{
{
span
:
10
}
}
rules=
{
[
{
required
:
true
,
message
:
'请选择图标'
,
},
]
}
>
<
Upload
name=
"singleFile"
listType=
"picture-card"
showUploadList=
{
false
}
beforeUpload=
{
beforeUpload
}
action=
{
`${window.location.origin}${PUBLISH_SERVICE}/UploadSingleFile`
}
onChange=
{
handleChange
}
>
{
imageUrl
?
(
<
img
src=
{
imageUrl
}
alt=
"singleFile"
style=
{
{
width
:
'90%'
,
}
}
/>
)
:
(
uploadButton
)
}
</
Upload
>
</
Item
>
</
Col
>
<
Col
span=
{
12
}
>
<
Item
>
<
Button
type=
"primary"
onClick=
{
pictruePreview
}
style=
{
{
marginTop
:
'33px'
}
}
>
从图片库中选择
</
Button
>
</
Item
>
</
Col
>
</
Row
>
{
/* <Item
label="单点登陆地址"
name="loginUrl"
rules={[{ required: true, message: '请输入单点登录地址' }]}
>
<Input allowClear />
</Item> */
}
</
Form
>
<
PreviewModal
visible=
{
previewModal
}
onCancel=
{
()
=>
{
setPreviewModal
(
false
);
}
}
imageUrl=
{
im
}
keepImgeUrl=
{
keepImgeUrl
}
callBackSubmit=
{
onOk
}
/>
</
Modal
>
);
};
export
default
AddModal
;
This diff is collapsed.
Click to expand it.
src/pages/integratedLogin/Integrate.jsx
deleted
100644 → 0
View file @
ca5b1db4
/* eslint-disable prefer-template */
/* eslint-disable no-undef */
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
{
Tooltip
,
Spin
,
Modal
,
Input
,
Space
,
Button
,
Popconfirm
,
Table
,
notification
,
Image
,
}
from
'antd'
;
import
{
GetIntegratedLogin
,
DelIntegratedLogin
}
from
'@/services/integratedLogin/api'
;
import
{
EditTwoTone
,
DeleteOutlined
,
PlusOutlined
,
SyncOutlined
}
from
'@ant-design/icons'
;
import
styles
from
'./integrate.less'
;
import
AddModal
from
'./AddModal'
;
import
Master
from
'./Master'
;
const
Integrate
=
()
=>
{
const
[
loading
,
setLoading
]
=
useState
(
false
);
const
[
tableData
,
setTableData
]
=
useState
([]);
const
[
showSearchStyle
,
setShowSearchStyle
]
=
useState
(
false
);
// 是否显示模糊查询样式
const
[
searchWord
,
setSearchWord
]
=
useState
(
''
);
// 关键字
const
[
flag
,
setFlag
]
=
useState
(
0
);
const
[
addVisible
,
setAddVisible
]
=
useState
(
false
);
const
[
pickItem
,
setPickItem
]
=
useState
(
''
);
const
[
type
,
setType
]
=
useState
(
''
);
const
[
masterVisible
,
setMasterVisible
]
=
useState
(
false
);
const
{
Search
}
=
Input
;
useEffect
(()
=>
{
getData
();
},
[
flag
]);
const
columns
=
[
{
title
:
'序号'
,
key
:
'id '
,
dataIndex
:
'id'
,
render
:
(
text
,
record
,
index
)
=>
(
<
Space
>
<
span
>
{
index
+
1
}
</
span
>
</
Space
>
),
width
:
60
,
align
:
'center'
,
},
{
title
:
'名称'
,
dataIndex
:
'SystemName'
,
key
:
'SystemName'
,
align
:
'center'
,
ellipsis
:
true
,
render
:
(
text
,
record
)
=>
(
<
span
>
<
Tooltip
placement=
"top"
title=
{
text
}
>
{
searchStyle
(
text
)
}
</
Tooltip
>
</
span
>
),
},
{
title
:
'标识'
,
dataIndex
:
'SystemClient'
,
key
:
'SystemClient'
,
align
:
'center'
,
ellipsis
:
true
,
render
:
(
text
,
record
)
=>
(
<
span
>
<
Tooltip
placement=
"top"
title=
{
text
}
>
{
searchStyle
(
text
)
}
</
Tooltip
>
</
span
>
),
},
// {
// title: '内网地址',
// dataIndex: 'IntranetAddress',
// key: 'IntranetAddress',
// align: 'center',
// width: 400,
// ellipsis: true,
// render: (text, record) => (
// <span>
// <Tooltip placement="top" title={text}>
// {text}
// </Tooltip>
// </span>
// ),
// },
{
title
:
'外网地址'
,
dataIndex
:
'InternetAddress'
,
key
:
'InternetAddress'
,
ellipsis
:
true
,
align
:
'center'
,
maxWidth
:
600
,
onCell
:
()
=>
({
style
:
{
maxWidth
:
600
,
overflow
:
'hidden'
,
whiteSpace
:
'nowrap'
,
textOverflow
:
'ellipsis'
,
cursor
:
'pointer'
,
},
}),
render
:
(
text
,
record
)
=>
(
<
span
>
<
Tooltip
placement=
"top"
title=
{
text
}
>
{
text
}
</
Tooltip
>
</
span
>
),
},
{
title
:
'图标'
,
dataIndex
:
'iconUrl'
,
key
:
'iconUrl'
,
align
:
'center'
,
width
:
200
,
render
:
(
text
,
record
)
=>
{
console
.
log
(
text
);
if
(
text
)
{
// if (text.startsWith('CityTemp') || text.startsWith('civ_integratedlogin')) {
// return <Image src={`http://192.168.12.116:8017/${text}`} height="50px" />;
// } else {
return
<
Image
src=
{
window
.
location
.
origin
+
`/${text}`
}
height=
"50px"
/>;
// }
}
},
},
{
title
:
'参数'
,
dataIndex
:
'AccountParam'
,
key
:
'AccountParam'
,
align
:
'center'
,
width
:
200
,
},
{
title
:
'操作'
,
key
:
'action'
,
width
:
100
,
align
:
'center'
,
render
:
record
=>
(
<
Space
size=
"middle"
>
<
Tooltip
title=
"编辑"
>
<
EditTwoTone
onClick=
{
()
=>
edit
(
record
)
}
style=
{
{
fontSize
:
'16px'
}
}
/>
</
Tooltip
>
<
Tooltip
title=
"删除"
>
<
Popconfirm
placement=
"bottomRight"
title=
{
<
p
>
即将删除
<
span
>
{
record
.
loginName
}
</
span
>
,是否确认删除?
</
p
>
}
okText=
"确认"
cancelText=
"取消"
onConfirm=
{
()
=>
dele
(
record
)
}
>
<
DeleteOutlined
style=
{
{
fontSize
:
'16px'
,
color
:
'#e86060'
}
}
/>
</
Popconfirm
>
</
Tooltip
>
</
Space
>
),
},
];
// 模糊查询匹配的样式
const
searchStyle
=
val
=>
{
let
n
;
if
(
showSearchStyle
)
{
n
=
val
.
replace
(
new
RegExp
(
searchWord
,
'g'
),
`<span style='color:red'>
${
searchWord
}
</span>`
);
}
else
{
n
=
val
;
}
return
<
div
dangerouslySetInnerHTML=
{
{
__html
:
n
}
}
/>;
};
const
getData
=
()
=>
{
setLoading
(
true
);
GetIntegratedLogin
().
then
(
resnew
=>
{
if
(
resnew
.
code
===
0
)
{
setTableData
(
resnew
.
data
);
}
else
{
notification
.
error
({
message
:
'获取失败'
,
description
:
resnew
.
msg
,
});
}
setLoading
(
false
);
});
};
const
add
=
()
=>
{
setType
(
'add'
);
setAddVisible
(
true
);
};
const
edit
=
e
=>
{
setType
(
'edit'
);
setPickItem
(
e
);
setAddVisible
(
true
);
};
const
dele
=
e
=>
{
setPickItem
(
e
);
setLoading
(
true
);
DelIntegratedLogin
({
ID
:
e
.
ID
,
}).
then
(
res
=>
{
if
(
res
.
code
===
0
)
{
setFlag
(
flag
+
1
);
notification
.
success
({
message
:
'删除成功'
,
description
:
res
.
msg
,
});
}
else
{
notification
.
error
({
message
:
'删除失败'
,
description
:
res
.
msg
,
});
}
setLoading
(
false
);
});
};
const
submitSearch
=
()
=>
{
setLoading
(
true
);
GetIntegratedLogin
({
searchKey
:
searchWord
}).
then
(
resnew
=>
{
if
(
resnew
.
code
===
0
)
{
setTableData
(
resnew
.
data
);
setShowSearchStyle
(
true
);
}
else
{
notification
.
error
({
message
:
'获取失败'
,
description
:
resnew
.
msg
,
});
}
setLoading
(
false
);
});
};
const
handleReset
=
()
=>
{
setSearchWord
(
''
);
setShowSearchStyle
(
false
);
setLoading
(
true
);
GetIntegratedLogin
({
searchKey
:
''
}).
then
(
resnew
=>
{
if
(
resnew
.
code
===
0
)
{
setTableData
(
resnew
.
data
);
}
else
{
notification
.
error
({
message
:
'获取失败'
,
description
:
resnew
.
msg
,
});
}
setLoading
(
false
);
});
};
const
handleSearch
=
e
=>
{
setSearchWord
(
e
.
target
.
value
);
};
const
onSubmit
=
()
=>
{
setFlag
(
flag
+
1
);
};
const
masterStation
=
()
=>
{
setMasterVisible
(
true
);
};
return
(
<
div
className=
{
styles
.
Integrate
}
>
<
div
className=
{
styles
.
head
}
>
<
div
className=
{
styles
.
head1
}
>
<
span
>
快速搜索:
</
span
>
<
Search
style=
{
{
width
:
260
}
}
placeholder=
"请输入名称,标识"
onSearch=
{
submitSearch
}
onChange=
{
e
=>
handleSearch
(
e
)
}
enterButton
value=
{
searchWord
}
/>
<
Button
icon=
{
<
SyncOutlined
/>
}
onClick=
{
handleReset
}
style=
{
{
marginLeft
:
'20px'
}
}
>
重置
</
Button
>
<
Button
icon=
{
<
PlusOutlined
className=
{
styles
.
icon
}
/>
}
onClick=
{
add
}
style=
{
{
verticalAlign
:
'middle'
,
marginLeft
:
'40px'
,
}
}
>
新增
</
Button
>
</
div
>
<
Button
type=
"primary"
onClick=
{
masterStation
}
style=
{
{
float
:
'right'
,
verticalAlign
:
'middle'
,
}
}
>
集成登录网站配置
</
Button
>
</
div
>
<
Spin
spinning=
{
loading
}
tip=
"loading"
>
<
div
className=
{
styles
.
table
}
>
<
Table
size=
"small"
bordered
rowKey=
{
record
=>
record
.
Id
}
columns=
{
columns
}
dataSource=
{
tableData
}
scroll=
{
{
y
:
'calc(100vh - 200px)'
,
x
:
'max-content'
}
}
onRow=
{
record
=>
({
onDoubleClick
:
event
=>
{
event
.
stopPropagation
();
edit
(
record
);
},
// 双击
})
}
pagination=
{
false
}
/>
</
div
>
</
Spin
>
<
AddModal
visible=
{
addVisible
}
pickItem=
{
pickItem
}
onCancel=
{
()
=>
setAddVisible
(
false
)
}
type=
{
type
}
callBackSubmit=
{
onSubmit
}
/>
<
Master
visible=
{
masterVisible
}
onCancel=
{
()
=>
setMasterVisible
(
false
)
}
/>
</
div
>
);
};
export
default
Integrate
;
This diff is collapsed.
Click to expand it.
src/pages/integratedLogin/Master.jsx
deleted
100644 → 0
View file @
ca5b1db4
/* eslint-disable prefer-template */
/* eslint-disable react/jsx-boolean-value */
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
{
Form
,
Modal
,
Input
,
notification
,
Button
,
message
,
Upload
,
Select
,
Col
,
Row
}
from
'antd'
;
import
{
AddIntegratedloginSetting
,
GetIntegratedloginSetting
,
}
from
'@/services/integratedLogin/api'
;
import
{
PlusOutlined
,
LoadingOutlined
}
from
'@ant-design/icons'
;
import
{
get
,
PUBLISH_SERVICE
}
from
'@/services'
;
import
PreviewModal
from
'./PreviewModal'
;
const
{
Item
}
=
Form
;
const
{
Option
}
=
Select
;
const
colorList
=
[
{
key
:
'科技蓝'
,
color
:
'#0087F7'
,
headerColor
:
'linear-gradient(0deg, #0066D6 0%, #39A9FF 100%)'
,
},
{
key
:
'环保绿'
,
color
:
'#009C73'
,
headerColor
:
'linear-gradient(0deg, #00845D 0%, #02BF87 100%)'
,
},
// {
// key: '清澈蓝',
// color: '#1890FF',
// headerColor: '#1890FF',
// },
];
const
Master
=
props
=>
{
const
{
callBackSubmit
=
()
=>
{},
visible
,
onCancel
}
=
props
;
const
[
loading
,
setLoading
]
=
useState
(
false
);
const
[
form
]
=
Form
.
useForm
();
const
[
imgBed
,
setImgBed
]
=
useState
();
const
[
imageUrl
,
setImageUrl
]
=
useState
();
const
[
im
,
setIm
]
=
useState
();
const
[
previewModal
,
setPreviewModal
]
=
useState
(
false
);
const
[
keepImgeUrl
,
setKeepImgeUrl
]
=
useState
(
''
);
useEffect
(()
=>
{
if
(
visible
)
{
GetIntegratedloginSetting
().
then
(
res
=>
{
if
(
res
.
code
===
0
)
{
console
.
log
(
res
.
data
);
form
.
setFieldsValue
(
res
.
data
);
setImageUrl
(
window
.
location
.
origin
+
`/
${
res
.
data
.
logo
}
`
);
setIm
(
res
.
data
.
logo
);
}
else
{
form
.
setFieldsValue
({
primaryColor
:
'#0087F7'
,
});
}
});
}
else
{
setImageUrl
(
''
);
setIm
(
''
);
setKeepImgeUrl
(
''
);
form
.
resetFields
();
}
},
[
visible
]);
// 提交
const
onSubmit
=
()
=>
{
let
obj
=
form
.
getFieldsValue
();
console
.
log
(
obj
);
form
.
validateFields
().
then
(
validate
=>
{
if
(
validate
)
{
AddIntegratedloginSetting
({
...
obj
,
})
.
then
(
res
=>
{
if
(
res
.
code
===
0
)
{
onCancel
();
callBackSubmit
();
notification
.
success
({
message
:
'提示'
,
duration
:
3
,
description
:
res
.
msg
||
'操作成功'
,
});
}
else
{
notification
.
error
({
message
:
'提示'
,
duration
:
3
,
description
:
res
.
msg
||
'操作失败'
,
});
}
})
.
catch
(
err
=>
{
console
.
log
(
err
);
});
}
});
};
const
layout
=
{
layout
:
'horizontal'
,
labelCol
:
{
span
:
4
},
wrapperCol
:
{
span
:
18
},
};
const
beforeUpload
=
file
=>
{
const
isJpgOrPng
=
file
.
type
===
'image/jpeg'
||
file
.
type
===
'image/png'
||
file
.
type
===
'image/jpg'
||
file
.
type
===
'image/gif'
;
if
(
!
isJpgOrPng
)
{
message
.
error
(
'只能上传格式为jpeg/png/gif的图片!'
);
}
const
isLt2M
=
file
.
size
/
1024
/
1024
<
2
;
if
(
!
isLt2M
)
{
message
.
error
(
'图片必须小于2MB!'
);
}
return
isJpgOrPng
&&
isLt2M
;
};
const
handleChange
=
info
=>
{
setKeepImgeUrl
(
''
);
setIm
(
''
);
if
(
info
.
file
.
status
===
'uploading'
)
{
setLoading
(
true
);
return
;
}
if
(
info
.
file
.
status
===
'done'
)
{
getBase64
(
info
.
file
.
originFileObj
,
url
=>
{
setLoading
(
false
);
setImageUrl
(
url
);
});
}
};
const
getBase64
=
(
img
,
callback
)
=>
{
const
reader
=
new
FileReader
();
reader
.
addEventListener
(
'load'
,
()
=>
callback
(
reader
.
result
));
reader
.
readAsDataURL
(
img
);
};
const
uploadButton
=
(
<
div
>
{
loading
?
<
LoadingOutlined
/>
:
<
PlusOutlined
/>
}
<
div
style=
{
{
marginTop
:
8
,
}
}
>
上传
</
div
>
</
div
>
);
const
pictruePreview
=
()
=>
{
setPreviewModal
(
true
);
};
const
onOk
=
props
=>
{
if
(
props
)
{
setImageUrl
(
window
.
location
.
origin
+
`/
${
props
.
path
}
`
);
setIm
(
props
.
path
);
setKeepImgeUrl
(
props
.
path
);
form
.
setFieldsValue
({
logo
:
`
${
props
.
path
}
`
});
}
};
return
(
<
Modal
title=
"集成登录网站配置"
style=
{
{
top
:
'150px'
}
}
width=
"700px"
destroyOnClose
maskClosable=
{
false
}
cancelText=
"取消"
okText=
"确认"
{
...
props
}
onOk=
{
()
=>
onSubmit
()
}
forceRender=
{
true
}
getContainer=
{
false
}
>
<
Form
form=
{
form
}
{
...
layout
}
>
<
Item
label=
"标题"
name=
"title"
rules=
{
[
{
required
:
true
,
message
:
'标题为必填项'
,
},
]
}
>
<
Input
placeholder=
"请输入标题"
autoComplete=
"off"
/>
</
Item
>
<
Item
label=
"副标题"
name=
"subtitle"
rules=
{
[
{
required
:
true
,
message
:
'标题为必填项'
,
},
]
}
>
<
Input
placeholder=
"请输入副标题"
autoComplete=
"off"
/>
</
Item
>
<
Row
>
<
Col
span=
{
10
}
>
<
Item
label=
"登录Logo"
name=
"logo"
style=
{
{
height
:
'112px'
}
}
labelCol=
{
{
span
:
10
}
}
rules=
{
[
{
required
:
true
,
message
:
'请选择图标icon'
,
},
]
}
>
<
Upload
name=
"singleFile"
listType=
"picture-card"
className=
"avatar-uploader"
showUploadList=
{
false
}
beforeUpload=
{
beforeUpload
}
action=
{
`${window.location.origin}${PUBLISH_SERVICE}/UploadSingleFile`
}
onChange=
{
handleChange
}
>
{
imageUrl
?
(
<
img
src=
{
imageUrl
}
alt=
"singleFile"
style=
{
{
width
:
'90%'
,
}
}
/>
)
:
(
uploadButton
)
}
</
Upload
>
</
Item
>
</
Col
>
<
Col
span=
{
12
}
>
<
Item
>
<
Button
type=
"primary"
onClick=
{
pictruePreview
}
style=
{
{
marginTop
:
'33px'
}
}
>
从图片库中选择
</
Button
>
</
Item
>
</
Col
>
</
Row
>
<
Item
name=
"primaryColor"
label=
"主题色"
>
<
Select
placeholder=
"请选择颜色"
>
{
colorList
.
map
(
item
=>
(
<
Option
value=
{
item
.
color
}
key=
{
item
.
color
}
>
<
div
style=
{
{
display
:
'flex'
,
alignItems
:
'center'
}
}
>
<
div
style=
{
{
height
:
'10px'
,
width
:
'10px'
,
background
:
item
.
color
,
marginRight
:
'5px'
,
}
}
/>
{
`${item.key}(${item.color})`
}
</
div
>
</
Option
>
))
}
</
Select
>
</
Item
>
</
Form
>
<
PreviewModal
visible=
{
previewModal
}
onCancel=
{
()
=>
{
setPreviewModal
(
false
);
}
}
imageUrl=
{
im
}
keepImgeUrl=
{
keepImgeUrl
}
callBackSubmit=
{
onOk
}
/>
</
Modal
>
);
};
export
default
Master
;
This diff is collapsed.
Click to expand it.
src/pages/integratedLogin/PreviewModal.jsx
deleted
100644 → 0
View file @
ca5b1db4
/* eslint-disable no-lonely-if */
/* eslint-disable no-unused-expressions */
/* eslint-disable prefer-template */
/* eslint-disable react/jsx-boolean-value */
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
{
Modal
,
Collapse
,
notification
}
from
'antd'
;
import
{
GetIntegratedloginIcon
}
from
'@/services/integratedLogin/api'
;
import
{
CheckCircleTwoTone
}
from
'@ant-design/icons'
;
import
styles
from
'./integrate.less'
;
import
classnames
from
'classnames'
;
const
{
Panel
}
=
Collapse
;
import
{
isDev
}
from
'@/utils/tools'
;
const
PreviewModal
=
props
=>
{
const
{
callBackSubmit
=
()
=>
{},
visible
,
onCancel
,
imageUrl
,
keepImgeUrl
}
=
props
;
const
[
imgData
,
setImgData
]
=
useState
([]);
const
[
pickItem
,
setPickItem
]
=
useState
(
''
);
const
[
keepItem
,
setKeepItem
]
=
useState
(
''
);
const
[
keepGroupName
,
setKeepGroupName
]
=
useState
([]);
useEffect
(()
=>
{
console
.
log
(
process
.
env
,
'process.env.PROXY'
);
setPickItem
(
''
);
setKeepItem
(
''
);
update
();
if
(
!
visible
)
{
setPickItem
(
''
);
setKeepItem
(
''
);
}
},
[
visible
]);
const
update
=
()
=>
{
GetIntegratedloginIcon
()
.
then
(
res
=>
{
if
(
res
.
code
===
0
)
{
let
bb
=
[];
let
aa
=
[];
res
.
data
.
map
((
i
,
a
)
=>
{
if
(
i
.
files
.
length
>
0
)
{
bb
.
push
(
i
);
aa
.
push
(
i
.
groupName
);
}
});
setKeepGroupName
(
aa
);
setImgData
(
bb
);
res
.
data
.
map
(
i
=>
{
i
.
files
.
map
((
j
,
index
)
=>
{
if
(
keepImgeUrl
)
{
if
(
j
.
path
==
keepImgeUrl
)
{
setKeepItem
(
i
.
groupName
);
setPickItem
(
index
);
}
}
else
{
if
(
j
.
path
==
imageUrl
)
{
setKeepItem
(
i
.
groupName
);
setPickItem
(
index
);
}
}
});
});
}
else
{
notification
.
error
({
message
:
'获取失败'
,
description
:
res
.
msg
,
});
}
})
.
catch
(
err
=>
{
console
.
error
(
err
);
});
};
// 提交
const
onSubmit
=
()
=>
{
if
(
keepItem
)
{
let
aa
=
imgData
.
find
(
i
=>
i
.
groupName
===
keepItem
);
callBackSubmit
(
aa
.
files
[
pickItem
]);
}
onCancel
();
};
const
handleCollapseChange
=
key
=>
{
setKeepGroupName
(
key
);
};
return
(
<
Modal
title=
"图片库"
style=
{
{
top
:
'100px'
}
}
width=
"1000px"
destroyOnClose
maskClosable=
{
false
}
cancelText=
"取消"
okText=
"确认"
{
...
props
}
onOk=
{
()
=>
onSubmit
()
}
forceRender=
{
true
}
getContainer=
{
false
}
>
<
Collapse
style=
{
{
height
:
'600px'
,
overflow
:
'scroll'
}
}
bordered=
{
false
}
activeKey=
{
keepGroupName
}
onChange=
{
handleCollapseChange
}
>
{
imgData
.
map
((
i
,
j
)
=>
{
return
(
<
Panel
header=
{
i
.
groupName
}
key=
{
i
.
groupName
}
style=
{
{
marginBottom
:
'24px'
,
overflow
:
'hidden'
,
border
:
'0px'
,
background
:
'#f7f7f7'
,
borderRadius
:
'2px'
,
}
}
>
{
i
.
files
.
map
((
k
,
index
)
=>
{
return
(
// <Image
// src=
{
`${isDev ? process.env.PROXY : window.location.origin}${k}`
}
// height="100px"
// />
<
div
className=
{
styles
.
divItem
}
key=
{
index
}
>
<
CheckCircleTwoTone
className=
{
classnames
({
[
styles
.
iconHidden
]:
index
!==
pickItem
||
i
.
groupName
!==
keepItem
,
[
styles
.
iconItem
]:
index
===
pickItem
&&
i
.
groupName
===
keepItem
,
})
}
/>
<
img
src=
{
window
.
location
.
origin
+
`/${k.path}`
}
className=
{
classnames
({
[
styles
.
imgHidden
]:
index
!==
pickItem
||
i
.
groupName
!==
keepItem
,
[
styles
.
imgItem
]:
index
===
pickItem
&&
i
.
groupName
===
keepItem
,
})
}
height=
"80px"
width=
"80px"
alt=
"集成登录默认"
onClick=
{
e
=>
{
setPickItem
(
index
);
setKeepItem
(
i
.
groupName
);
}
}
/>
<
div
style=
{
{
textAlign
:
'center'
}
}
>
<
p
>
{
k
.
name
}
</
p
>
</
div
>
</
div
>
);
})
}
</
Panel
>
);
})
}
</
Collapse
>
</
Modal
>
);
};
export
default
PreviewModal
;
This diff is collapsed.
Click to expand it.
src/pages/integratedLogin/integrate.less
deleted
100644 → 0
View file @
ca5b1db4
.Integrate {
.ant-table-pagination.ant-pagination {
margin: 2px 0;
}
.head {
padding: 10px;
background: white;
margin-bottom: 2px;
width: 100%;
display: flex;
justify-content: space-between;
.head1 {
display: flex;
align-items: center;
}
}
.divItem {
display: inline-block;
margin-left: 30px;
margin-bottom: 30px;
}
.imgItem {
border: 3px solid rgb(24, 144, 255);
box-sizing: border-box;
border-radius: 5px;
display: inline-block;
}
.imgHidden {
border: none;
display: inline-block;
}
.imgHidden:hover {
border: 3px solid rgb(24, 144, 255);
box-sizing: border-box;
border-radius: 5px;
display: inline-block;
}
.iconItem {
position: absolute;
margin-left: 70px;
margin-top: -3px;
font-size: 17px;
}
.iconHidden {
display: none;
}
.iconHidden:hover {
position: absolute;
margin-left: 70px;
margin-top: -3px;
font-size: 17px;
}
.table {
background-color: white;
height: calc(100vh - 130px);
margin-top: 10px;
overflow-y: scroll;
}
.ant-card-body {
padding: 0px 24px 24px 17px;
}
.sel {
width: 200px;
}
.icon {
margin-top: -5px !important;
vertical-align: text-bottom;
}
.redText {
color: red;
}
}
.ant-popover-message > .anticon {
margin-top: 6px;
}
This diff is collapsed.
Click to expand it.
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