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
e5f46dfa
Commit
e5f46dfa
authored
Jun 08, 2021
by
shaoan123
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
表字段里编辑模块攥写
parent
e1f61197
Pipeline
#29417
skipped with stages
Changes
9
Pipelines
1
Expand all
Hide whitespace changes
Inline
Side-by-side
Showing
9 changed files
with
583 additions
and
75 deletions
+583
-75
affiliateAdd.jsx
.../bsmanager/tablemanager/components/Field/affiliateAdd.jsx
+28
-21
changeAdd.jsx
...ter/bsmanager/tablemanager/components/Field/changeAdd.jsx
+116
-0
editor.jsx
...Center/bsmanager/tablemanager/components/Field/editor.jsx
+38
-11
fieldEditor.jsx
...r/bsmanager/tablemanager/components/Field/fieldEditor.jsx
+0
-0
fieldsConfig.jsx
.../bsmanager/tablemanager/components/Field/fieldsConfig.jsx
+269
-0
index.less
...Center/bsmanager/tablemanager/components/Field/index.less
+28
-3
index.jsx
src/pages/platformCenter/bsmanager/tablemanager/index.jsx
+65
-34
index.less
src/pages/platformCenter/bsmanager/tablemanager/index.less
+6
-3
bs.jsx
src/services/platform/bs.jsx
+33
-3
No files found.
src/pages/platformCenter/bsmanager/tablemanager/components/Field/affiliateAdd.jsx
View file @
e5f46dfa
...
...
@@ -2,14 +2,14 @@ import React, { useState, useEffect } from 'react';
import
{
Form
,
Modal
,
Input
,
Select
,
Checkbox
,
notification
,
Card
}
from
'antd'
;
import
{
loadTableFields
,
addTables
loadTableFields
,
addTables
,
addFields
}
from
'@/services/platform/bs'
import
styles
from
'./index.less'
const
CheckboxGroup
=
Checkbox
.
Group
;
import
qs
from
'qs'
;
const
{
Option
}
=
Select
;
const
AddModal
=
props
=>
{
const
{
callBackSubmit
=
()
=>
{
},
type
,
visible
,
tableList
}
=
props
;
const
{
callBackSubmit
=
()
=>
{
},
type
,
visible
,
tableList
,
formObj
}
=
props
;
const
[
loading
,
setLoading
]
=
useState
(
false
);
const
[
form
]
=
Form
.
useForm
();
const
{
Item
}
=
Form
;
...
...
@@ -39,17 +39,23 @@ const AddModal = props => {
form
.
validateFields
().
then
(
validate
=>
{
if
(
validate
)
{
setLoading
(
true
);
let
data
=
{},
url
=
JSON
.
stringify
(
formObj
)
==
'{}'
?
addTables
:
addFields
if
(
JSON
.
stringify
(
formObj
)
==
'{}'
)
{
data
=
{
tableName
:
obj
.
tableName
,
alias
:
obj
.
tableAlias
||
''
,
fieldNames
:
checkedList
.
join
(
','
)
}
}
else
{
data
=
{
tableName
:
formObj
.
tableName
,
fieldNames
:
checkedList
.
join
(
','
)
}
}
let
obj
=
form
.
getFieldsValue
();
addTables
({
tableName
:
obj
.
tableName
,
alias
:
obj
.
tableAlias
||
''
,
fieldNames
:
checkedList
.
join
(
','
)}
).
then
(
res
=>
{
url
(
data
).
then
(
res
=>
{
setLoading
(
false
);
if
(
res
.
msg
===
"Ok"
)
{
if
(
res
.
msg
===
"Ok"
||
res
.
msg
===
""
)
{
form
.
resetFields
();
callBackSubmit
();
notification
.
success
({
message
:
'提示'
,
duration
:
3
,
description
:
'
新增成功'
,
description
:
JSON
.
stringify
(
formObj
)
==
'{}'
?
'新增成功'
:
'表字段
新增成功'
,
});
}
else
{
...
...
@@ -74,14 +80,15 @@ const AddModal = props => {
};
const
onFinish
=
value
=>
{
};
useEffect
(()
=>
{
if
(
type
!=
''
)
{
if
(
type
!=
''
&&
JSON
.
stringify
(
formObj
)
==
'{}'
)
{
renderField
(
tableList
[
0
].
text
)
form
.
setFieldsValue
({
tableName
:
tableList
[
0
].
text
})
}
else
if
(
type
!=
''
&&
JSON
.
stringify
(
formObj
)
!=
'{}'
)
{
renderField
(
formObj
.
tableName
)
}
},
[
visible
]);
...
...
@@ -118,8 +125,8 @@ const AddModal = props => {
return
(
<
Modal
title=
'附加'
bodyStyle=
{
{
width
:
'100%'
,
minHeight
:
'
1
00px'
}
}
title=
{
JSON
.
stringify
(
formObj
)
==
'{}'
?
'附加表'
:
'附加字段'
}
bodyStyle=
{
{
width
:
'100%'
,
minHeight
:
'
2
00px'
}
}
style=
{
{
top
:
'150px'
}
}
width=
"700px"
destroyOnClose
...
...
@@ -133,22 +140,22 @@ const AddModal = props => {
getContainer=
{
false
}
>
{
visible
&&
(
<
Form
form=
{
form
}
{
...
layout
}
onFinish=
{
onFinish
}
>
<
Item
<
Form
form=
{
form
}
{
...
layout
}
>
{
JSON
.
stringify
(
formObj
)
==
'{}'
?
<>
<
Item
label=
"表名"
name=
"tableName"
rules=
{
[{
required
:
true
,
message
:
'请选择表名'
}]
}
>
<
Select
onChange=
{
handleChange
}
>
{
tableList
.
length
?
tableList
.
map
((
item
,
index
)
=>
{
return
<
Select
.
Option
key=
{
index
}
value=
{
item
.
text
}
>
{
item
.
text
}
</
Select
.
Option
>
})
:
''
}
<
Select
onChange=
{
handleChange
}
>
{
tableList
.
length
?
tableList
.
map
((
item
,
index
)
=>
{
return
<
Select
.
Option
key=
{
index
}
value=
{
item
.
text
}
>
{
item
.
text
}
</
Select
.
Option
>
;
})
:
''
}
</
Select
>
</
Item
>
<
Item
label=
"别名"
name=
"tableAlias"
>
<
Input
allowClear
/>
</
Item
>
<
Item
label=
"别名"
name=
"tableAlias"
>
<
Input
allowClear
/>
</
Item
></>
:
<
div
className=
{
styles
.
paneTitle
}
>
{
formObj
.
tableName
}
</
div
>
}
<
div
className=
{
styles
.
field
}
>
<
Card
title=
"字段名"
extra=
{
<
Checkbox
indeterminate=
{
indeterminate
}
onChange=
{
onCheckAllChange
}
checked=
{
checkAll
}
>
</
Checkbox
>
}
>
{
...
...
src/pages/platformCenter/bsmanager/tablemanager/components/Field/changeAdd.jsx
0 → 100644
View file @
e5f46dfa
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
{
Form
,
Modal
,
Space
,
Divider
,
Radio
,
notification
,
Checkbox
}
from
'antd'
;
import
{
LoadEventType
,
LoadEventFields
}
from
'@/services/platform/bs'
import
styles
from
'./index.less'
const
AddModal
=
props
=>
{
const
{
callBackSubmit
=
()
=>
{
},
type
,
formObj
,
visible
}
=
props
;
const
[
loading
,
setLoading
]
=
useState
(
false
);
const
[
value
,
setValue
]
=
useState
(
''
);
const
[
checkValue
,
setCheckValue
]
=
useState
([]);
const
[
form
]
=
Form
.
useForm
();
const
{
Item
}
=
Form
;
// 提交
const
onSubmit
=
()
=>
{
type
===
'rule'
?
callBackSubmit
(
`
${
value
===
'无'
||
value
===
''
?
''
:
value
+
','
}${
checkValue
.
join
(
','
)}
`
):
callBackSubmit
();
};
useEffect
(()
=>
{
if
(
type
!=
''
&&
type
===
'rule'
)
{
setValue
(
formObj
.
numerical
)
setCheckValue
(
formObj
.
rule
)
// getTableInfo({ tableName: formObj.tableName }).then(res => {
// res.data.root && res.data.root.length && form.setFieldsValue({ ...res.data.root[0]})
// setTableID(res.data.root[0].tableID)
// })
}
else
{
LoadEventType
().
then
(
res
=>
{
console
.
log
(
'res'
,
res
);
})
}
},
[
visible
]);
const
layout
=
{
layout
:
'horizontal'
,
labelCol
:
{
span
:
4
,
},
wrapperCol
:
{
span
:
16
,
},
};
const
handleChange
=
(
e
)
=>
{
setValue
(
e
.
target
.
value
)
if
(
e
.
target
.
value
===
'无'
)
{
setCheckValue
([])
}
}
const
onChange
=
(
e
)
=>
{
setCheckValue
(
e
)
if
(
e
.
length
&&
value
==
'无'
){
setValue
(
''
)
}
}
return
(
<
Modal
title=
{
type
===
'rule'
?
'选择验证规则'
:
'字段集选择'
}
bodyStyle=
{
{
width
:
'100%'
,
minHeight
:
'100px'
}
}
style=
{
{
top
:
'250px'
}
}
width=
"700px"
destroyOnClose
maskClosable=
{
false
}
cancelText=
"取消"
okText=
"确认"
{
...
props
}
onOk=
{
()
=>
onSubmit
()
}
confirmLoading=
{
loading
}
forceRender=
{
true
}
getContainer=
{
false
}
>
{
visible
&&
type
===
'rule'
&&
(
<>
<
Radio
.
Group
onChange=
{
handleChange
}
value=
{
value
}
>
<
Space
direction=
"vertical"
>
<
Radio
value=
'无'
>
无(清空选中)
</
Radio
>
<
Radio
value=
'number'
>
数值(number)
</
Radio
>
<
Radio
value=
'digits'
>
整数(digits)
</
Radio
>
<
Radio
value=
'email'
>
邮箱(email)
</
Radio
>
<
Radio
value=
'identity'
>
身份证号(identity)
</
Radio
>
<
Radio
value=
'mobile'
>
手机号(mobile)
</
Radio
>
<
Radio
value=
'bankAccount'
>
银行卡号(bankAccount)
</
Radio
>
<
Radio
value=
'timeControl'
>
时间控制(timeControl)
</
Radio
>
</
Space
>
</
Radio
.
Group
>
<
Checkbox
.
Group
style=
{
{
width
:
'100%'
,
marginTop
:
'1rem'
}
}
onChange=
{
onChange
}
value=
{
checkValue
}
>
<
Space
direction=
"vertical"
>
<
Checkbox
value=
"required"
>
必填(required)
</
Checkbox
>
<
Checkbox
value=
"emphasis"
>
强调(emphasis)
</
Checkbox
>
<
Checkbox
value=
"sensitive"
>
敏感(sensitive)
</
Checkbox
>
</
Space
>
</
Checkbox
.
Group
>
</>
)
}
{
visible
&&
type
===
'characteristics'
&&
(
<
div
className=
{
styles
.
listCard
}
>
<
div
className=
{
styles
.
cardItem
}
>
<
Divider
orientation=
"left"
>
待选字段列表
</
Divider
>
<
div
className=
{
styles
.
cardContent
}
></
div
>
</
div
>
<
div
className=
{
styles
.
cardItem
}
>
<
Divider
orientation=
"left"
>
已选字段列表
</
Divider
>
<
div
className=
{
styles
.
cardContent
}
></
div
>
</
div
>
</
div
>
)
}
</
Modal
>
);
};
export
default
AddModal
;
src/pages/platformCenter/bsmanager/tablemanager/components/Field/editor.jsx
View file @
e5f46dfa
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
{
Form
,
Modal
,
Input
,
Select
,
Radio
,
notification
}
from
'antd'
;
import
{
SetServiceConfig
}
from
'@/services/
webConfig/api'
;
getTableInfo
,
updateTable
}
from
'@/services/
platform/bs'
const
AddModal
=
props
=>
{
const
{
callBackSubmit
=
()
=>
{
},
type
,
formObj
,
visible
,
listData
}
=
props
;
const
{
callBackSubmit
=
()
=>
{
},
type
,
formObj
,
visible
}
=
props
;
const
[
loading
,
setLoading
]
=
useState
(
false
);
const
[
tableID
,
setTableID
]
=
useState
(
''
);
const
[
form
]
=
Form
.
useForm
();
const
{
Item
}
=
Form
;
// 提交
...
...
@@ -17,6 +17,32 @@ const AddModal = props => {
setLoading
(
true
);
let
obj
=
form
.
getFieldsValue
();
updateTable
({
interfaceName
:
obj
.
interfaceText
,
tableID
,
tableName
:
obj
.
tableName
,
tableStyle
:
obj
.
tableStyle
,
alias
:
obj
.
tableAlias
,
officeTmpl
:
obj
.
officeTmpl
}).
then
(
res
=>
{
setLoading
(
false
);
if
(
res
.
msg
===
"Ok"
||
res
.
msg
===
""
)
{
form
.
resetFields
();
callBackSubmit
();
notification
.
success
({
message
:
'提示'
,
duration
:
3
,
description
:
'修改成功'
,
});
}
else
{
notification
.
error
({
message
:
'提示'
,
duration
:
3
,
description
:
res
.
msg
,
});
}
})
}
});
...
...
@@ -25,7 +51,11 @@ const AddModal = props => {
useEffect
(()
=>
{
if
(
type
!=
''
)
{
form
.
setFieldsValue
({
...
formObj
});
getTableInfo
({
tableName
:
formObj
.
tableName
}).
then
(
res
=>
{
res
.
data
.
root
&&
res
.
data
.
root
.
length
&&
form
.
setFieldsValue
({
...
res
.
data
.
root
[
0
]})
setTableID
(
res
.
data
.
root
[
0
].
tableID
)
})
}
},
[
visible
]);
...
...
@@ -73,14 +103,13 @@ const AddModal = props => {
<
Item
label=
"别名"
name=
"tableAlias"
rules=
{
[{
required
:
true
,
message
:
'请输入别名'
}]
}
>
<
Input
placeholder=
"请输入别名"
allowClear
/>
</
Item
>
<
Item
label=
"样式"
name=
"tableStyle"
rules=
{
[{
required
:
true
,
message
:
'请
输入别名
'
}]
}
rules=
{
[{
required
:
true
,
message
:
'请
选择样式
'
}]
}
>
<
Radio
.
Group
>
<
Radio
value=
'大'
>
大(3)
</
Radio
>
...
...
@@ -92,16 +121,14 @@ const AddModal = props => {
<
Item
label=
"模板"
name=
"officeTmpl"
rules=
{
[{
required
:
true
,
message
:
'请输入别名'
}]
}
>
<
Input
placeholder=
"请输入
别名
"
allowClear
/>
<
Input
placeholder=
"请输入
模板
"
allowClear
/>
</
Item
>
<
Item
label=
"接口"
name=
"interfaceText"
rules=
{
[{
required
:
true
,
message
:
'请输入别名'
}]
}
>
<
Input
placeholder=
"请输入
别名
"
allowClear
/>
<
Input
placeholder=
"请输入
接口
"
allowClear
/>
</
Item
>
</
Form
>
)
}
...
...
src/pages/platformCenter/bsmanager/tablemanager/components/Field/fieldEditor.jsx
0 → 100644
View file @
e5f46dfa
This diff is collapsed.
Click to expand it.
src/pages/platformCenter/bsmanager/tablemanager/components/Field/fieldsConfig.jsx
0 → 100644
View file @
e5f46dfa
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
{
Form
,
Modal
,
Space
,
Table
,
Button
,
Popconfirm
,
Spin
,
notification
}
from
'antd'
;
import
{
reloadTableFields
,
removeFields
}
from
'@/services/platform/bs'
import
FieldEditor
from
'./fieldEditor'
const
AddModal
=
props
=>
{
const
[
tableData
,
setTableData
]
=
useState
([])
const
[
changeData
,
setChangeData
]
=
useState
([])
const
{
callBackSubmit
=
()
=>
{
},
type
,
formObj
,
visible
}
=
props
;
const
[
loading
,
setLoading
]
=
useState
(
false
);
const
[
treeLoading
,
setTreeLoading
]
=
useState
(
true
)
const
[
form
]
=
Form
.
useForm
();
const
[
flag
,
setFlag
]
=
useState
(
0
);
// 弹窗类型
const
[
isVisible
,
setIsVisible
]
=
useState
(
false
);
// 弹窗
const
[
isType
,
setIsType
]
=
useState
(
''
);
// 弹窗类型
const
[
itemData
,
setItemData
]
=
useState
({});
const
{
Item
}
=
Form
;
// 提交
const
onSubmit
=
()
=>
{
form
.
validateFields
().
then
(
validate
=>
{
if
(
validate
)
{
setLoading
(
true
);
let
obj
=
form
.
getFieldsValue
();
}
});
};
const
columns
=
[
{
title
:
'字段名'
,
dataIndex
:
'name'
,
key
:
'name'
,
render
:
text
=>
<
a
>
{
text
}
</
a
>,
},
{
title
:
'别名'
,
dataIndex
:
'alias'
,
key
:
'alias'
,
align
:
'center'
},
{
title
:
'字段类型'
,
dataIndex
:
'storeType'
,
key
:
'storeType'
,
align
:
'center'
},
{
title
:
'形态'
,
dataIndex
:
'shape'
,
key
:
'shape'
,
align
:
'center'
,
},
{
title
:
'单位'
,
dataIndex
:
'unit'
,
key
:
'unit'
,
align
:
'center'
},
{
title
:
'配置'
,
dataIndex
:
'config'
,
key
:
'config'
,
align
:
'center'
},
{
title
:
'预设值'
,
dataIndex
:
'preset'
,
key
:
'preset'
,
align
:
'center'
},
{
title
:
'高'
,
dataIndex
:
'rowSpan'
,
key
:
'rowSpan'
,
align
:
'center'
},
{
title
:
'宽'
,
dataIndex
:
'colSpan'
,
key
:
'colSpan'
,
align
:
'center'
},
{
title
:
'只读'
,
dataIndex
:
'readOnly'
,
key
:
'readOnly'
,
align
:
'center'
},
{
title
:
'验证规则'
,
dataIndex
:
'validationRule'
,
key
:
'validationRule'
,
align
:
'center'
},
{
title
:
'补正'
,
dataIndex
:
'editableLater'
,
key
:
'editableLater'
,
align
:
'center'
},
{
title
:
'同步'
,
dataIndex
:
'syncEvent'
,
key
:
'syncEvent'
,
align
:
'center'
},
{
title
:
'异常值'
,
dataIndex
:
'exceptionValue'
,
key
:
'exceptionValue'
,
align
:
'center'
},
{
title
:
'触发事件'
,
dataIndex
:
'exceptionEvent'
,
key
:
'exceptionEvent'
,
align
:
'center'
},
{
title
:
'事件字段'
,
dataIndex
:
'exceptionEventFields'
,
key
:
'exceptionEventFields'
,
align
:
'center'
},
{
title
:
'操作'
,
width
:
250
,
ellipsis
:
true
,
align
:
'center'
,
render
:
(
text
,
record
)
=>
(
<
Space
>
<
Button
type=
"primary"
size=
"small"
onClick=
{
()
=>
{
editor
(
record
);
}
}
>
编辑
</
Button
>
<
div
onClick=
{
e
=>
e
.
stopPropagation
()
}
>
<
Popconfirm
title=
"是否删除该字段?"
okText=
"确认"
cancelText=
"取消"
onConfirm=
{
()
=>
{
deleteChart
(
record
);
}
}
>
<
Button
size=
"small"
danger
>
删除
</
Button
>
</
Popconfirm
>
</
div
>
</
Space
>
),
},
];
const
editor
=
(
record
)
=>
{
setIsType
(
'edit'
);
setIsVisible
(
true
);
setItemData
(
record
);
}
const
Submit
=
prop
=>
{
setIsVisible
(
false
);
setFlag
(
flag
+
1
)
};
useEffect
(()
=>
{
if
(
type
!=
''
)
{
setTreeLoading
(
true
)
reloadTableFields
({
tableName
:
formObj
.
tableName
}).
then
(
res
=>
{
setTreeLoading
(
false
)
if
(
res
.
msg
===
'Ok'
)
{
setTableData
(
res
.
data
.
root
)
}
}
)
}
},
[
visible
,
flag
]);
const
layout
=
{
layout
:
'horizontal'
,
labelCol
:
{
span
:
4
,
},
wrapperCol
:
{
span
:
16
,
},
};
const
handleChange
=
(
value
)
=>
{
form
.
setFieldsValue
({
schemename
:
value
});
}
//删除表字段
const
deleteChart
=
(
record
)
=>
{
removeFields
({
fieldIDs
:
record
.
ID
}).
then
(
res
=>
{
if
(
res
.
msg
===
'Ok'
||
res
.
msg
===
''
)
{
notification
.
success
({
message
:
'提示'
,
duration
:
3
,
description
:
'删除成功'
,
});
setFlag
(
flag
+
1
)
}
else
{
notification
.
error
({
message
:
'提示'
,
duration
:
3
,
description
:
res
.
msg
,
});
}
})
}
return
(
<>
<
Modal
title=
'字段配置'
bodyStyle=
{
{
width
:
'100%'
,
minHeight
:
'100px'
}
}
style=
{
{
top
:
'50px'
,
left
:
'50px'
}
}
width=
'90%'
destroyOnClose
maskClosable=
{
false
}
cancelText=
"取消"
okText=
"确认"
{
...
props
}
onOk=
{
()
=>
onSubmit
()
}
confirmLoading=
{
loading
}
forceRender=
{
true
}
getContainer=
{
false
}
>
{
visible
&&
(
<
Spin
tip=
"loading..."
spinning=
{
treeLoading
}
>
<
Table
columns=
{
columns
}
dataSource=
{
tableData
}
//pagination=
{{
pageSize
:
10
}}
scroll=
{
{
x
:
'max-content'
,
y
:
'calc(100vh - 238px)'
}
}
size=
"small"
rowKey=
{
(
record
,
index
)
=>
`complete${record.tableID}${index}`
}
pagination=
{
{
showTotal
:
(
total
,
range
)
=>
`第${range[0]}-${range[1]} 条/共 ${total} 条`
,
pageSizeOptions
:
[
10
,
20
,
50
,
100
],
defaultPageSize
:
20
,
showQuickJumper
:
true
,
showSizeChanger
:
true
,
}
}
/>
</
Spin
>
)
}
</
Modal
>
<
FieldEditor
isVisible=
{
isVisible
}
isType=
{
isType
}
itemData=
{
itemData
}
formObj1=
{
formObj
}
onCancel=
{
()
=>
setIsVisible
(
false
)
}
callBackSubmit=
{
Submit
}
></
FieldEditor
>
</>
);
};
export
default
AddModal
;
src/pages/platformCenter/bsmanager/tablemanager/components/Field/index.less
View file @
e5f46dfa
...
...
@@ -3,7 +3,7 @@
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
max-height:
18
rem;
max-height:
20
rem;
overflow-y: scroll;
.ant-card{
width: 74%;
...
...
@@ -15,4 +15,30 @@
.ant-card-extra{
margin-left: 0.2rem;
}
}
\ No newline at end of file
}
.paneTitle{
font-weight: bold;
font-size: 18px;
margin: 0 0 0.5rem 4rem;
}
.listEvent{
display: flex;
}
.unit{
display: flex;
margin-left: 1.1rem;
align-items: center;
}
.listCard{
display: flex;
.cardItem{
width: 50%;
padding: 0.5rem;
}
.cardContent{
height: 18rem;
border: 1px solid #99bbe8;
}
}
src/pages/platformCenter/bsmanager/tablemanager/index.jsx
View file @
e5f46dfa
...
...
@@ -9,15 +9,17 @@ import {
Select
,
Popconfirm
,
notification
,
Spin
Spin
,
Tooltip
}
from
'antd'
;
import
{
PlusCircl
eOutlined
}
from
'@ant-design/icons'
;
import
{
EditOutlined
,
DeleteOutlined
,
FontColorsOutlined
,
PlusSquar
eOutlined
}
from
'@ant-design/icons'
;
import
PageContainer
from
'@/components/BasePageContainer'
;
import
{
CM_Table_LoadTable
,
removeTable
,
loadUnattachedTables
}
from
'@/services/platform/bs'
import
styles
from
'./index.less'
import
Editor
from
'./components/Field/editor'
import
AddTablelList
from
'./components/Field/addTable'
import
AffiliateAdd
from
'./components/Field/affiliateAdd'
import
FieldsConfig
from
'./components/Field/fieldsConfig'
const
{
Search
}
=
Input
;
const
{
Option
}
=
Select
;
const
placeholder
=
"请输入表名"
...
...
@@ -36,26 +38,30 @@ const TableManager = () => {
title
:
'名称'
,
dataIndex
:
'tableName'
,
key
:
'tableName'
,
width
:
200
,
render
:
text
=>
<
a
>
{
text
}
</
a
>,
width
:
'300px'
},
{
title
:
'别名'
,
dataIndex
:
'tableAlias'
,
key
:
'tableAlias'
,
align
:
'center'
align
:
'center'
,
width
:
200
,
},
{
title
:
'表格样式'
,
dataIndex
:
'tableStyle'
,
key
:
'tableStyle'
,
align
:
'center'
align
:
'center'
,
width
:
150
,
},
{
title
:
'模板'
,
dataIndex
:
'officeTmpl'
,
key
:
'officeTmpl'
,
align
:
'center'
,
width
:
50
,
render
:
text
=>
{
let
dom
=
ReactHtmlParser
(
text
)
return
(<
div
>
{
dom
}
</
div
>)
...
...
@@ -115,7 +121,8 @@ const TableManager = () => {
title
:
'接口'
,
dataIndex
:
'interfaceText'
,
key
:
'interfaceText'
,
align
:
'center'
align
:
'center'
,
width
:
250
,
},
{
title
:
'操作'
,
...
...
@@ -124,24 +131,24 @@ const TableManager = () => {
align
:
'center'
,
render
:
(
text
,
record
)
=>
(
<
Space
>
<
Button
type=
"primary"
size=
"small"
onClick=
{
()
=>
{
changeDesc
(
record
);
}
}
>
修改
</
Button
>
<
Button
type=
"primary"
size=
"small"
onClick=
{
()
=>
{
editor
(
record
);
}
}
>
编辑字段
</
Button
>
<
Tooltip
title=
"修改"
>
<
EditOutlined
onClick=
{
()
=>
changeDesc
(
record
)
}
style=
{
{
fontSize
:
'20px'
,
color
:
'#1890FF'
}
}
/>
</
Tooltip
>
<
Tooltip
title=
"字段配置"
>
<
FontColorsOutlined
onClick=
{
()
=>
fieldsConfig
(
record
)
}
style=
{
{
fontSize
:
'16px'
,
color
:
'#1890FF'
}
}
/>
</
Tooltip
>
<
Tooltip
title=
"附加"
>
<
PlusSquareOutlined
onClick=
{
()
=>
add
(
record
)
}
style=
{
{
fontSize
:
'16px'
,
color
:
'#1890FF'
}
}
/>
</
Tooltip
>
<
div
onClick=
{
e
=>
e
.
stopPropagation
()
}
>
<
Popconfirm
title=
"是否删除该表?"
...
...
@@ -151,9 +158,11 @@ const TableManager = () => {
deleteChart
(
record
);
}
}
>
<
Button
size=
"small"
danger
>
删除
</
Button
>
<
Tooltip
title=
"删除"
>
<
DeleteOutlined
style=
{
{
fontSize
:
'16px'
,
color
:
'#e86060'
}
}
/>
</
Tooltip
>
</
Popconfirm
>
</
div
>
</
Space
>
...
...
@@ -168,6 +177,12 @@ const TableManager = () => {
getField
()
},
[
flag
])
//附加
const
add
=
(
record
)
=>
{
setFormObj
(
record
);
setType
(
'affiliateAdd'
);
setVisible
(
true
);
}
//修改表名
const
changeDesc
=
(
record
)
=>
{
setType
(
'edit'
);
...
...
@@ -194,9 +209,7 @@ const TableManager = () => {
}
})
}
const
editor
=
(
record
)
=>
{
}
const
onSubmit
=
prop
=>
{
setVisible
(
false
);
setFlag
(
flag
+
1
)
...
...
@@ -209,6 +222,13 @@ const TableManager = () => {
//附加表
const
AffiliateAddTable
=
()
=>
{
setType
(
'affiliateAdd'
);
setFormObj
({});
setVisible
(
true
);
}
//字段配置
const
fieldsConfig
=
(
record
)
=>
{
setFormObj
(
record
);
setType
(
'config'
);
setVisible
(
true
);
}
//搜索框改变时存储输入的值
...
...
@@ -233,7 +253,7 @@ const TableManager = () => {
setTreeLoading
(
true
)
CM_Table_LoadTable
({
_version
:
9999
,
filter
:
keyword
filter
:
keyword
||
''
}).
then
(
res
=>
{
setTreeLoading
(
false
)
...
...
@@ -270,17 +290,18 @@ const TableManager = () => {
columns=
{
columns
}
dataSource=
{
tableData
}
//pagination={{ pageSize: 10 }}
scroll=
{
{
x
:
'max-content'
,
y
:
'calc(100vh - 2
3
8px)'
}
}
scroll=
{
{
x
:
'max-content'
,
y
:
'calc(100vh - 2
2
8px)'
}
}
size=
"small"
style=
{
{
height
:
'8rem'
}
}
rowKey=
{
(
record
,
index
)
=>
`complete${record.tableID}${index}`
}
pagination=
{
{
showTotal
:
(
total
,
range
)
=>
`第${range[0]}-${range[1]} 条/共 ${total} 条`
,
`第${range[0]}-${range[1]} 条/共 ${total} 条`
,
pageSizeOptions
:
[
10
,
20
,
50
,
100
],
defaultPageSize
:
20
,
showQuickJumper
:
true
,
showSizeChanger
:
true
,
}
}
}
}
/>
</
div
>
</
div
>
...
...
@@ -307,6 +328,16 @@ const TableManager = () => {
type=
{
type
}
onCancel=
{
()
=>
setVisible
(
false
)
}
callBackSubmit=
{
onSubmit
}
formObj=
{
formObj
}
/>
)
}
{
visible
&&
type
===
'config'
&&
(
<
FieldsConfig
visible=
{
visible
}
type=
{
type
}
formObj=
{
formObj
}
onCancel=
{
()
=>
setVisible
(
false
)
}
callBackSubmit=
{
onSubmit
}
/>
)
}
</
PageContainer
>
...
...
src/pages/platformCenter/bsmanager/tablemanager/index.less
View file @
e5f46dfa
...
...
@@ -23,7 +23,9 @@
}
}
}
.table_container{
}
}
.table_container{
width: 100%;
height: calc(100% - 100px);
}
\ No newline at end of file
src/services/platform/bs.jsx
View file @
e5f46dfa
...
...
@@ -25,8 +25,39 @@ export const loadUnattachedTables = () =>
//7.附加表
export
const
addTables
=
(
param
)
=>
get
(
`
${
PUBLISH_SERVICE
}
/CaseManage/AddTables`
,
param
);
get
(
`
${
PUBLISH_SERVICE
}
/CaseManage/AddTables`
,
param
);
//8.添加表字段
export
const
addFields
=
(
param
)
=>
get
(
`
${
PUBLISH_SERVICE
}
/CaseManage/AddFields`
,
param
);
\ No newline at end of file
get
(
`
${
PUBLISH_SERVICE
}
/CaseManage/AddFields`
,
param
);
//9.获取表信息
export
const
getTableInfo
=
(
param
)
=>
get
(
`
${
PUBLISH_SERVICE
}
/CaseManage/GetTableInfo`
,
param
);
//10.更新表信息
export
const
updateTable
=
(
param
)
=>
get
(
`
${
PUBLISH_SERVICE
}
/CaseManage/UpdateTable`
,
param
);
//11.加载表字段
export
const
reloadTableFields
=
(
param
)
=>
get
(
`
${
PUBLISH_SERVICE
}
/CaseManage/ReloadTableFields`
,
param
);
//12.根据字段ID查询字段信息
export
const
getField
=
(
param
)
=>
get
(
`
${
PUBLISH_SERVICE
}
/CaseManage/GetField`
,
param
);
//13.删除表字段
export
const
removeFields
=
(
param
)
=>
get
(
`
${
PUBLISH_SERVICE
}
/CaseManage/RemoveFields`
,
param
);
//14.加载事件类型
export
const
LoadEventType
=
(
param
)
=>
get
(
`
${
PUBLISH_SERVICE
}
/CaseManage/LoadEventType`
,
param
);
export
const
LoadEventFields
=
(
param
)
=>
get
(
`
${
PUBLISH_SERVICE
}
/CaseManage/LoadEventFields`
,
param
);
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