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
17ef2560
Commit
17ef2560
authored
Nov 25, 2020
by
Maofei94
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
feat: 小程序配置
parent
95eacae1
Hide whitespace changes
Inline
Side-by-side
Showing
17 changed files
with
1024 additions
and
900 deletions
+1024
-900
InitDataBase.jsx
src/pages/database/InitDataBase.jsx
+1
-1
InitDataBase.less
src/pages/database/InitDataBase.less
+2
-1
SiteConfig.jsx
src/pages/mobileConfig/SiteConfig.jsx
+7
-7
index.js
src/pages/mobileConfig/index.js
+5
-5
AddForm.jsx
src/pages/mobileConfig/menuconfig/AddForm.jsx
+94
-20
LeftPart.jsx
src/pages/mobileConfig/menuconfig/LeftPart.jsx
+0
-681
LeftPart.less
src/pages/mobileConfig/menuconfig/LeftPart.less
+0
-70
MenuConfig.jsx
src/pages/mobileConfig/menuconfig/MenuConfig.jsx
+2
-4
addForm.less
src/pages/mobileConfig/menuconfig/addForm.less
+4
-0
editForm.jsx
src/pages/mobileConfig/menuconfig/editForm.jsx
+130
-0
miniMenu.jsx
src/pages/mobileConfig/menuconfig/miniMenu.jsx
+425
-0
miniMenu.less
src/pages/mobileConfig/menuconfig/miniMenu.less
+73
-0
RoleManage.jsx
src/pages/userCenter/roleManage/RoleManage.jsx
+98
-56
RoleManage.less
src/pages/userCenter/roleManage/RoleManage.less
+37
-10
SiteManage.jsx
src/pages/userCenter/siteManage/SiteManage.jsx
+73
-41
SiteManage.less
src/pages/userCenter/siteManage/SiteManage.less
+35
-4
api.js
src/services/mobileConfig/api.js
+38
-0
No files found.
src/pages/database/InitDataBase.jsx
View file @
17ef2560
...
...
@@ -501,7 +501,7 @@ const InitDataBase = props => {
))
}
</
Select
>
</
Form
.
Item
>
<
Form
.
Item
>
<
Form
.
Item
wrapperCol=
{
{
offset
:
3
}
}
>
<
div
className=
{
styles
.
tCenter
}
>
<
Space
size=
"large"
className=
{
styles
.
btnBox
}
>
<
Space
>
...
...
src/pages/database/InitDataBase.less
View file @
17ef2560
...
...
@@ -13,5 +13,5 @@
}
.btnBox {
display: flex !important;
justify-content: space-
around
;
justify-content: space-
between
;
}
\ No newline at end of file
src/pages/mobileConfig/SiteConfig.jsx
View file @
17ef2560
...
...
@@ -22,7 +22,7 @@ const SiteConfig = props => {
const
layout
=
{
layout
:
'horizontal'
,
labelCol
:
{
span
:
7
},
wrapperCol
:
{
span
:
6
},
wrapperCol
:
{
span
:
8
},
};
useEffect
(()
=>
{
console
.
log
(
miniTitle
,
'miniTitle'
);
...
...
@@ -37,8 +37,9 @@ const SiteConfig = props => {
})
.
then
(
res
=>
{
setLoading
(
false
);
let
obj
=
{
...
form
.
getFieldsValue
()
};
let
arr
=
Object
.
keys
({
...
form
.
getFieldsValue
()
});
console
.
log
(
res
.
shortcutIcon
);
let
obj
=
{};
let
arr
=
Object
.
keys
(
form
.
getFieldsValue
());
arr
.
map
(
k
=>
{
obj
[
k
]
=
res
[
k
];
});
...
...
@@ -88,7 +89,7 @@ const SiteConfig = props => {
};
return
(
<
Spin
spinning=
{
loading
}
tip=
"loading..."
>
<
div
style=
{
{
minHeight
:
'calc(100vh - 1
7
2px)'
,
marginTop
:
'20px'
}
}
>
<
div
style=
{
{
minHeight
:
'calc(100vh - 1
9
2px)'
,
marginTop
:
'20px'
}
}
>
<
Form
form=
{
form
}
{
...
layout
}
>
<
Item
label=
"应用名称:"
...
...
@@ -102,7 +103,6 @@ const SiteConfig = props => {
>
<
Input
placeholder=
"请输入应用名称"
allowClear
/>
</
Item
>
<
Item
label=
"系统图标:"
name=
"shortcutIcon"
...
...
@@ -115,10 +115,10 @@ const SiteConfig = props => {
>
<
Input
placeholder=
"请输入系统图标名称"
allowClear
/>
</
Item
>
<
Item
label=
"系统图标预览:"
>
<
Item
label=
"系统图标预览:"
name=
"shortcutIcon"
>
<
PicturesWall
/>
</
Item
>
<
Item
label=
"登陆页面:"
name=
"loginTemplate"
...
...
src/pages/mobileConfig/index.js
View file @
17ef2560
...
...
@@ -29,11 +29,11 @@ const MobileConfigPage = props => {
});
},
[
flag
]);
useEffect
(()
=>
{
getMiniAppModuleTree
({
userMode
:
'super'
,
}).
then
(
res
=>
{
console
.
log
(
res
);
});
//
getMiniAppModuleTree({
//
userMode: 'super',
//
}).then(res => {
//
console.log(res);
//
});
},
[]);
// 修改选中的tab
const
handleChange
=
key
=>
{
...
...
src/pages/mobileConfig/menuconfig/AddForm.jsx
View file @
17ef2560
import
React
,
{
useState
}
from
'react'
;
import
{
Form
,
Input
}
from
'antd'
;
import
{
Form
,
Input
,
Button
,
Row
,
Col
}
from
'antd'
;
import
styles
from
'./addForm.less'
;
import
PicturesWall
from
'@/components/Upload/index'
;
const
{
Item
}
=
Form
;
const
AddForm
=
props
=>
{
const
{}
=
props
;
const
{
submitCallback
,
nodeType
,
nodeObj
,
addType
}
=
props
;
// const [type, setType] = useState(2);
const
[
form
]
=
Form
.
useForm
();
const
[
otherForm
]
=
Form
.
useForm
();
const
layout
=
{
layout
:
''
,
layout
:
'horizontal'
,
labelCol
:
{
span
:
4
,
offset
:
1
},
wrapperCol
:
{
span
:
16
},
};
const
submit
=
()
=>
{
if
(
addType
===
1
||
addType
===
2
)
{
let
obj
=
form
.
getFieldsValue
();
submitCallback
(
obj
,
nodeObj
);
}
if
(
addType
===
3
||
addType
===
4
)
{
let
obj
=
otherForm
.
getFieldsValue
();
submitCallback
(
obj
,
nodeObj
);
}
};
return
(
<
Form
form=
{
form
}
{
...
layout
}
>
<
Item
label=
"分组名称"
>
<
Input
/>
</
Item
>
<
Item
label=
"分组别名"
>
<
Input
/>
</
Item
>
<
Item
label=
"在线图标"
>
<
Input
/>
</
Item
>
<
Item
label=
"离线图标"
>
<
Input
/>
</
Item
>
<
Item
label=
"功能参数"
>
<
Input
/>
</
Item
>
</
Form
>
<
div
>
{
(
addType
===
1
||
addType
===
2
)
&&
(
<
Form
form=
{
form
}
{
...
layout
}
className=
{
styles
.
formStyle
}
>
<
Item
label=
"分组名称"
name=
"menuName"
>
<
Input
/>
</
Item
>
<
Item
label=
"分组别名"
name=
"shortName"
>
<
Input
/>
</
Item
>
{
addType
===
1
&&
(
<
Item
label=
"在线图标"
name=
"imageUrl"
>
<
PicturesWall
/>
</
Item
>
)
}
{
addType
===
1
&&
(
<
Item
label=
"离线图标"
name=
"offlineImgUrl"
>
<
PicturesWall
/>
</
Item
>
)
}
{
addType
===
2
&&
(
<
Item
label=
"分组图标"
name=
"imageUrl"
>
<
PicturesWall
/>
</
Item
>
)
}
<
Item
label=
"功能参数"
name=
"funParam"
>
<
Input
/>
</
Item
>
<
Item
wrapperCol=
{
{
offset
:
5
}
}
style=
{
{
marginTop
:
'40px'
}
}
>
<
Button
type=
"primary"
onClick=
{
()
=>
submit
()
}
>
提交
</
Button
>
</
Item
>
</
Form
>
)
}
{
(
addType
===
3
||
addType
===
4
)
&&
(
<
Form
form=
{
otherForm
}
{
...
layout
}
className=
{
styles
.
formStyle
}
>
<
Item
label=
"菜单名称"
name=
"menuName"
>
<
Input
/>
</
Item
>
<
Item
label=
"菜单别名"
name=
"shortName"
>
<
Input
/>
</
Item
>
{
addType
===
3
&&
(
<
Item
label=
"在线图标"
name=
"imageUrl"
>
<
PicturesWall
/>
</
Item
>
)
}
{
addType
===
3
&&
(
<
Item
label=
"离线图标"
name=
"offlineImgUrl"
>
{
/* {otherForm.getFieldsValue().offlineImgUrl && <PicturesWall />} */
}
<
PicturesWall
/>
</
Item
>
)
}
{
addType
===
4
&&
(
<
Item
label=
"菜单图标"
name=
"imageUrl"
>
<
PicturesWall
/>
</
Item
>
)
}
<
Item
label=
"功能路径"
name=
"pageUrl"
>
<
Input
/>
</
Item
>
<
Item
label=
"功能参数"
name=
"funParam"
>
<
Input
/>
</
Item
>
<
Item
wrapperCol=
{
{
offset
:
5
}
}
style=
{
{
marginTop
:
'40px'
}
}
>
<
Button
type=
"primary"
onClick=
{
()
=>
submit
()
}
>
提交
</
Button
>
</
Item
>
</
Form
>
)
}
</
div
>
);
};
export
default
AddForm
;
src/pages/mobileConfig/menuconfig/LeftPart.jsx
deleted
100644 → 0
View file @
95eacae1
import
React
,
{
useState
,
useEffect
,
useCallback
}
from
'react'
;
import
{
message
,
notification
,
Form
,
Spin
,
Tree
,
Tooltip
,
Modal
,
Input
,
Button
,
}
from
'antd'
;
import
{
FileAddTwoTone
,
FolderAddTwoTone
,
EditTwoTone
,
DeleteTwoTone
,
FolderOpenOutlined
,
FileOutlined
,
}
from
'@ant-design/icons'
;
import
{
getTree
,
addMenuApi
,
addMenuGroupApi
,
submitMenuInfo
,
getRoleList
,
getMenuInfo
,
deleteMenuApi
,
}
from
'@/services/appConfig/api'
;
import
ListCardItem
from
'@/pages/orgnazation/listCardItem'
;
import
styles
from
'./LeftPart.less'
;
import
PicturesWall
from
'@/components/Upload/index'
;
const
AppMenu
=
()
=>
{
const
[
treeLoading
,
setTreeLoading
]
=
useState
(
true
);
const
[
treeData
,
setTreeData
]
=
useState
([]);
// 菜单树
const
[
treeState
,
setTreeState
]
=
useState
(
true
);
const
[
nodeType
,
setNodeType
]
=
useState
(
1
);
// 根据节点类型渲染不同的编辑表单item,0-0一级菜单,0-0-0二级,0-0-0-0三级
const
[
rolelist
,
setRolelist
]
=
useState
([]);
const
[
roleValueList
,
setRoleValueList
]
=
useState
({});
const
[
menuID
,
setMenuID
]
=
useState
(
''
);
const
[
menuTitle
,
setMenuTitle
]
=
useState
(
'菜单管理'
);
const
[
menuLabel
,
setMenuLabel
]
=
useState
(
'在线图标'
);
const
[
addMenuVisible
,
setAddMenuVisible
]
=
useState
(
false
);
const
[
addMenuGroupVisible
,
setAddMenuGroupVisible
]
=
useState
(
false
);
const
[
tipVisible
,
setTipVisible
]
=
useState
(
false
);
const
[
deleteMenuVisible
,
setDeleteMenuVisible
]
=
useState
(
false
);
const
[
addMenuForm
]
=
Form
.
useForm
();
const
[
editMenuForm
]
=
Form
.
useForm
();
const
[
addMenuGroupForm
]
=
Form
.
useForm
();
const
getRoleValueCallback
=
useCallback
((
value
,
index
)
=>
{
roleValueList
[
index
]
=
value
;
setRoleValueList
({
...
roleValueList
});
},
[]);
const
[
flag
,
setFlag
]
=
useState
(
1
);
// 刷新标记
const
[
saveid
,
setSaveid
]
=
useState
(
''
);
// 保存选择的ID
const
[
submitLoading
,
setSubmitLoading
]
=
useState
(
false
);
// 获取菜单树
useEffect
(()
=>
{
updateTrees
();
},
[
flag
]);
const
updateTrees
=
()
=>
{
setTreeLoading
(
true
);
getTree
()
.
then
(
res
=>
{
if
(
res
.
length
>
0
)
{
setTreeLoading
(
false
);
const
result
=
res
[
0
].
children
[
0
].
children
[
2
].
children
;
setTreeData
(
result
);
console
.
log
(
result
);
// 第一次加载,默认选择第一个组织
if
(
treeState
)
{
onSelect
([
result
[
0
].
menuID
],
false
);
setTreeState
(
false
);
}
}
})
.
catch
(
err
=>
{
setTreeLoading
(
false
);
message
.
error
(
err
);
});
};
// 获取角色列表
useEffect
(()
=>
{
getRoleList
()
.
then
(
res
=>
{
if
(
res
&&
res
.
list
)
{
setRolelist
(
res
.
list
);
}
else
{
notification
.
error
({
message
:
'获取失败'
,
description
:
res
.
message
,
});
}
})
.
catch
(
err
=>
{
message
.
error
(
err
);
});
},
[]);
// 渲染菜单树
const
mapTree
=
menu
=>
{
const
haveChildren
=
Array
.
isArray
(
menu
.
children
)
&&
menu
.
children
.
length
>
0
;
return
{
title
:
(
<>
<
span
>
{
menu
.
text
}
</
span
>
<
div
className=
{
styles
.
iconWraper1
}
>
{
menu
.
menuType
===
'MiniAppMenuGroup'
&&
(
<>
<
Tooltip
title=
"添加菜单组"
>
<
FolderAddTwoTone
onClick=
{
()
=>
addMenuGroup
(
menu
,
'分组图标'
)
}
/>
</
Tooltip
>
</>
)
}
{
menu
.
menuType
===
'MiniAppMenuGroupTwo'
&&
(
<>
<
Tooltip
title=
"添加菜单"
>
<
FileAddTwoTone
onClick=
{
()
=>
addMenu
(
menu
)
}
/>
</
Tooltip
>
</>
)
}
<
Tooltip
title=
"删除菜单"
>
<
DeleteTwoTone
onClick=
{
()
=>
deleteMenu
(
menu
)
}
/>
</
Tooltip
>
</
div
>
</>
),
key
:
menu
.
menuID
,
// icon: menu.leaf ? <FileOutlined /> : <FolderOpenOutlined />,
// 判断它是否存在子集,若果存在就进行再次进行遍历操作,知道不存在子集便对其他的元素进行操作
children
:
haveChildren
?
menu
.
children
.
map
(
i
=>
mapTree
(
i
))
:
[],
};
};
// 获取当前菜单详细
const
onSelect
=
(
props
,
e
)
=>
{
// e.node.pos节点类型,根据这个渲染不同的编辑表单item,0-x一级菜单,0-0-x二级,0-0-0-x三级
console
.
log
(
props
,
e
);
if
(
e
)
{
if
(
e
.
node
.
pos
.
lastIndexOf
(
'-'
)
===
1
)
{
setNodeType
(
1
);
}
else
if
(
e
.
node
.
pos
.
lastIndexOf
(
'-'
)
===
3
)
{
setNodeType
(
2
);
}
else
{
setNodeType
(
3
);
}
}
if
(
props
[
0
])
{
setMenuID
(
props
[
0
]);
setSaveid
(
props
[
0
]);
}
else
{
setMenuID
(
saveid
);
}
// setMenuID(props[0]);
getMenuInfo
(
props
[
0
])
.
then
(
res
=>
{
if
(
res
.
success
)
{
editMenuForm
.
setFieldsValue
({
menuName
:
res
.
menuName
,
shortName
:
res
.
menuShortName
,
imageUrl
:
res
.
imageUrl
,
pageUrl
:
res
.
pageUrl
,
offlineImgUrl
:
res
.
offlineImgUrl
,
funParam
:
res
.
funParam
,
relatedRoleList
:
res
.
relatedRoleList
||
''
,
});
}
})
.
catch
(
err
=>
{
message
.
error
(
err
);
});
};
// 左侧目录树相关操作
const
addMenu
=
menu
=>
{
setAddMenuVisible
(
true
);
setMenuTitle
(
`在
${
menu
.
text
}
下添加功能菜单`
);
console
.
log
(
menu
,
'enu'
);
setMenuID
(
menu
.
menuID
);
addMenuForm
.
setFieldsValue
({
menuName
:
''
,
shortName
:
''
,
imageUrl
:
''
,
pageUrl
:
''
,
funParam
:
''
,
});
};
const
addMenuGroup
=
(
menu
,
label
)
=>
{
setAddMenuGroupVisible
(
true
);
setMenuTitle
(
`在
${
menu
.
text
}
下添加菜单组`
);
setMenuLabel
(
label
);
addMenuGroupForm
.
setFieldsValue
({
menuName
:
''
,
shortName
:
''
,
imageUrl
:
''
,
offlineImgUrl
:
''
,
funParam
:
''
,
});
};
const
editMenu
=
menu
=>
{
setAddMenuVisible
(
true
);
setMenuTitle
(
`编辑
${
menu
.
text
}
`
);
setMenuID
(
menu
.
menuID
);
getMenuInfo
(
menu
.
menuID
)
.
then
(
res
=>
{
if
(
res
.
success
)
{
addMenuForm
.
setFieldsValue
({
menuName
:
res
.
menuName
,
shortName
:
res
.
menuShortName
,
imageUrl
:
res
.
imageUrl
,
pageUrl
:
res
.
pageUrl
,
funParam
:
res
.
funParam
,
relatedRoleList
:
res
.
relatedRoleList
||
[],
});
}
else
{
notification
.
error
({
message
:
'获取失败'
,
description
:
res
.
message
,
});
}
})
.
catch
(
err
=>
{
message
.
error
(
err
);
});
};
// const editMenuGroup = (menu, label) => {
// setAddMenuGroupVisible(true);
// setMenuTitle(`编辑${menu.text}`);
// setMenuID(menu.menuID);
// setMenuLabel(label);
// getMenuInfo(menu.menuID)
// .then(res => {
// if (res.success) {
// addMenuGroupForm.setFieldsValue({
// menuName: res.menuName,
// shortName: res.menuShortName,
// imageUrl: res.imageUrl,
// pageUrl: res.pageUrl,
// offlineImgUrl: res.offlineImgUrl,
// funParam: res.funParam,
// relatedRoleList: res.relatedRoleList || [],
// });
// } else {
// notification.error({
// message: '获取失败',
// description: res.message,
// });
// }
// })
// .catch(err => {
// message.error(err);
// });
// };
const
deleteMenu
=
menu
=>
{
setDeleteMenuVisible
(
true
);
setMenuTitle
(
`删除菜单
${
menu
.
text
}
`
);
setMenuID
(
menu
.
menuID
);
};
// 提交添加菜单
const
submitAddMenu
=
()
=>
{
console
.
log
(
menuID
);
let
menuName
=
addMenuForm
.
getFieldValue
(
'menuName'
);
let
shortName
=
addMenuForm
.
getFieldValue
(
'shortName'
);
let
imageUrl
=
addMenuForm
.
getFieldValue
(
'imageUrl'
);
let
pageUrl
=
addMenuForm
.
getFieldValue
(
'pageUrl'
);
let
funParam
=
addMenuForm
.
getFieldValue
(
'funParam'
);
if
(
menuName
&&
shortName
&&
imageUrl
&&
pageUrl
)
{
addMenuApi
(
menuID
,
menuName
,
shortName
,
imageUrl
,
pageUrl
,
funParam
)
.
then
(
res
=>
{
if
(
res
.
success
)
{
setAddMenuVisible
(
false
);
notification
.
success
({
message
:
'提交成功'
,
});
updateTrees
();
}
else
{
notification
.
error
({
message
:
'提交失败'
,
description
:
res
.
message
,
});
}
})
.
catch
(
err
=>
{
message
.
error
(
err
);
});
}
else
{
setTipVisible
(
true
);
}
};
// 提交添加菜单组
const
submitAddMenuGroup
=
()
=>
{
let
menuName
=
addMenuGroupForm
.
getFieldValue
(
'menuName'
);
let
shortName
=
addMenuGroupForm
.
getFieldValue
(
'shortName'
);
let
imageUrl
=
addMenuGroupForm
.
getFieldValue
(
'imageUrl'
);
let
offlineImgUrl
=
addMenuGroupForm
.
getFieldValue
(
'offlineImgUrl'
);
let
funParam
=
addMenuGroupForm
.
getFieldValue
(
'funParam'
);
if
(
menuName
&&
shortName
&&
imageUrl
&&
offlineImgUrl
)
{
addMenuGroupApi
(
menuID
,
menuName
,
shortName
,
imageUrl
,
offlineImgUrl
,
funParam
,
)
.
then
(
res
=>
{
if
(
res
.
success
)
{
setAddMenuGroupVisible
(
false
);
notification
.
success
({
message
:
'提交成功'
,
});
updateTrees
();
}
else
{
notification
.
error
({
message
:
'提交失败'
,
description
:
res
.
message
,
});
}
})
.
catch
(
err
=>
{
message
.
error
(
err
);
});
}
else
{
setTipVisible
(
true
);
}
};
// 提交-编辑菜单
const
submitEditMenu
=
()
=>
{
let
menuName
=
editMenuForm
.
getFieldValue
(
'menuName'
);
let
shortName
=
editMenuForm
.
getFieldValue
(
'shortName'
);
let
imageUrl
=
editMenuForm
.
getFieldValue
(
'imageUrl'
);
let
offlineImgUrl
=
editMenuForm
.
getFieldValue
(
'offlineImgUrl'
)
||
''
;
let
pageUrl
=
editMenuForm
.
getFieldValue
(
'pageUrl'
)
||
''
;
let
funParam
=
editMenuForm
.
getFieldValue
(
'funParam'
)
||
''
;
let
relatedRoleList
=
editMenuForm
.
getFieldValue
(
'funParam'
)
||
''
;
const
params
=
{
menuID
,
menuName
,
shortName
,
imageUrl
,
offlineImgUrl
,
pageUrl
,
funParam
,
relatedRoleList
,
};
// 根据节点类型,加一层判断,必填项全部不为空时才能提交
if
(
nodeType
===
1
)
{
if
(
menuName
&&
shortName
&&
imageUrl
&&
offlineImgUrl
)
{
submitMenu
(
params
);
}
else
{
setTipVisible
(
true
);
}
}
else
if
(
nodeType
===
2
)
{
if
(
menuName
&&
shortName
&&
imageUrl
)
{
submitMenu
(
params
);
}
else
{
setTipVisible
(
true
);
}
}
else
if
(
nodeType
===
3
)
{
if
(
menuName
&&
shortName
&&
imageUrl
&&
pageUrl
)
{
submitMenu
(
params
);
}
else
{
setTipVisible
(
true
);
}
}
};
const
submitMenu
=
params
=>
{
setSubmitLoading
(
true
);
submitMenuInfo
(
params
)
.
then
(
res
=>
{
setSubmitLoading
(
false
);
if
(
res
.
success
)
{
setFlag
(
flag
+
1
);
notification
.
success
({
message
:
'提交成功'
,
});
}
else
{
notification
.
error
({
message
:
'获取失败'
,
description
:
res
.
message
,
});
}
})
.
catch
(
err
=>
{
setSubmitLoading
(
false
);
message
.
error
(
err
);
});
};
// 提交删除菜单
const
submitDeleteMenu
=
()
=>
{
deleteMenuApi
(
menuID
)
.
then
(
res
=>
{
if
(
res
.
success
)
{
setDeleteMenuVisible
(
false
);
notification
.
success
({
message
:
'删除成功'
,
});
updateTrees
();
}
else
{
notification
.
error
({
message
:
'删除失败'
,
description
:
res
.
message
,
});
}
})
.
catch
(
err
=>
{
setTreeLoading
(
false
);
message
.
error
(
err
);
});
};
return
(
<
div
className=
{
styles
.
contentContainer
}
>
<
div
className=
{
styles
.
menuContainer
}
>
<
div
style=
{
{
padding
:
'10px 10px 0 16px'
}
}
>
菜单列表
<
Tooltip
title=
"添加功能菜单"
>
<
FileAddTwoTone
style=
{
{
fontSize
:
'18px'
,
float
:
'right'
,
margin
:
'4px 4px 0px 12px'
,
color
:
'#1890FF'
,
}
}
onClick=
{
()
=>
addMenu
({
text
:
'根目录'
,
menuID
:
-
1
})
}
/>
</
Tooltip
>
<
Tooltip
title=
"添加菜单组"
>
<
FolderAddTwoTone
style=
{
{
fontSize
:
'18px'
,
float
:
'right'
,
marginTop
:
'4px'
,
}
}
onClick=
{
()
=>
addMenuGroup
({
text
:
'根目录'
,
menuID
:
-
1
},
'在线图标'
)
}
/>
</
Tooltip
>
</
div
>
{
treeData
.
length
>
0
&&
(
<
Spin
spinning=
{
treeLoading
}
tip=
"loading..."
>
<
Tree
showIcon=
"true"
showLine=
{
{
showLeafIcon
:
false
}
}
defaultExpandAll=
"true"
selectedKeys=
{
[
menuID
]
}
onSelect=
{
onSelect
}
autoExpandParent
expandedKeys=
{
[
menuID
]
}
treeData=
{
treeData
.
map
(
t
=>
mapTree
(
t
))
}
/>
</
Spin
>
)
}
</
div
>
<
div
className=
{
styles
.
editContainer
}
>
<
Form
form=
{
editMenuForm
}
labelCol=
{
{
span
:
4
}
}
wrapperCol=
{
{
span
:
19
}
}
>
<
Form
.
Item
name=
"menuName"
label=
"菜单名称"
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入菜单名称"
/>
</
Form
.
Item
>
<
Form
.
Item
name=
"shortName"
label=
"菜单别名"
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入菜单别名"
/>
</
Form
.
Item
>
<
Form
.
Item
name=
"imageUrl"
label=
"菜单图标"
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入菜单图标"
/>
</
Form
.
Item
>
<
Form
.
Item
label=
"图标预览"
>
<
PicturesWall
maxLen=
{
1
}
/>
</
Form
.
Item
>
{
nodeType
===
1
&&
(
<>
<
Form
.
Item
name=
"offlineImgUrl"
label=
"离线图标"
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入离线图标"
/>
</
Form
.
Item
>
<
Form
.
Item
label=
"图标预览"
>
<
PicturesWall
maxLen=
{
1
}
/>
</
Form
.
Item
>
</>
)
}
{
nodeType
===
3
&&
(
<>
<
Form
.
Item
name=
"pageUrl"
label=
"功能路径"
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入功能路径"
/>
</
Form
.
Item
>
</>
)
}
<
Form
.
Item
name=
"funParam"
label=
"功能参数"
>
<
Input
placeholder=
"请输入功能参数"
/>
</
Form
.
Item
>
<
Form
.
Item
wrapperCol=
{
{
offset
:
12
}
}
>
<
Button
key=
"back"
type=
"primary"
onClick=
{
()
=>
submitEditMenu
()
}
loading=
{
submitLoading
}
>
提交
</
Button
>
</
Form
.
Item
>
</
Form
>
</
div
>
<
div
className=
{
styles
.
previewContainer
}
>
关联角色
</
div
>
{
/* 必填项提示 */
}
<
Modal
title=
"提示"
visible=
{
tipVisible
}
onCancel=
{
()
=>
setTipVisible
(
false
)
}
width=
"300px"
styles=
{
{
zIndex
:
999999
}
}
centered
footer=
{
[
<
Button
key=
"back"
type=
"primary"
onClick=
{
()
=>
setTipVisible
(
false
)
}
>
关闭
</
Button
>,
]
}
>
<
p
>
标记
<
span
className=
{
styles
.
redText
}
>
*
</
span
>
的为必填项
</
p
>
</
Modal
>
{
/* 添加菜单 */
}
<
Modal
title=
{
menuTitle
}
visible=
{
addMenuVisible
}
onOk=
{
submitAddMenu
}
onCancel=
{
()
=>
setAddMenuVisible
(
false
)
}
okText=
"确认"
cancelText=
"取消"
centered
>
<
Form
form=
{
addMenuForm
}
labelCol=
{
{
span
:
4
}
}
>
<
Form
.
Item
name=
"menuName"
label=
"菜单名称"
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入菜单名称"
/>
</
Form
.
Item
>
<
Form
.
Item
name=
"shortName"
label=
"菜单别名"
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入菜单别名"
/>
</
Form
.
Item
>
<
Form
.
Item
name=
"imageUrl"
label=
"菜单图标"
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入菜单图标"
/>
</
Form
.
Item
>
<
Form
.
Item
name=
"pageUrl"
label=
"功能路径"
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入菜单图标"
/>
</
Form
.
Item
>
<
Form
.
Item
label=
"图标预览"
>
<
PicturesWall
maxLen=
{
1
}
/>
</
Form
.
Item
>
<
Form
.
Item
name=
"funParam"
label=
"功能参数"
>
<
Input
placeholder=
"请输入功能参数"
/>
</
Form
.
Item
>
</
Form
>
</
Modal
>
{
/* 添加菜单组 */
}
<
Modal
title=
{
menuTitle
}
visible=
{
addMenuGroupVisible
}
onOk=
{
submitAddMenuGroup
}
onCancel=
{
()
=>
setAddMenuGroupVisible
(
false
)
}
okText=
"确认"
cancelText=
"取消"
centered
>
<
Form
form=
{
addMenuGroupForm
}
labelCol=
{
{
span
:
4
}
}
>
<
Form
.
Item
name=
"menuName"
label=
"分组名称"
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入分组名称"
/>
</
Form
.
Item
>
<
Form
.
Item
name=
"shortName"
label=
"分组别名"
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入分组别名"
/>
</
Form
.
Item
>
<
Form
.
Item
name=
"imageUrl"
label=
{
menuLabel
}
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入菜单图标"
/>
</
Form
.
Item
>
<
Form
.
Item
label=
"图标预览"
>
<
PicturesWall
maxLen=
{
1
}
/>
</
Form
.
Item
>
{
/* 添加菜单组,label名称为在线图标才有离线图标 */
}
{
menuLabel
===
'在线图标'
&&
(
<
Form
.
Item
name=
"offlineImgUrl"
label=
"离线图标"
rules=
{
[{
required
:
true
,
message
:
'不能为空'
}]
}
>
<
Input
placeholder=
"请输入离线图标"
/>
</
Form
.
Item
>
)
}
<
Form
.
Item
label=
"图标预览"
>
<
PicturesWall
maxLen=
{
1
}
/>
</
Form
.
Item
>
<
Form
.
Item
name=
"funParam"
label=
"功能参数"
>
<
Input
placeholder=
"请输入功能参数"
/>
</
Form
.
Item
>
</
Form
>
</
Modal
>
{
/* 删除菜单 */
}
<
Modal
title=
{
menuTitle
}
visible=
{
deleteMenuVisible
}
onOk=
{
submitDeleteMenu
}
onCancel=
{
()
=>
setDeleteMenuVisible
(
false
)
}
okText=
"确认"
cancelText=
"取消"
centered
>
<
span
>
确定删除?
</
span
>
</
Modal
>
</
div
>
);
};
export
default
AppMenu
;
src/pages/mobileConfig/menuconfig/LeftPart.less
deleted
100644 → 0
View file @
95eacae1
.contentContainer{
// min-height: calc(100vh - 48px);
overflow-x: auto;
display: flex;
.menuContainer{
min-width: 300px;
border:2px solid #eee;
min-height:calc(100vh - 172px);
overflow-y:auto;
.ant-tree-list{
padding: 10px;
height:calc(100vh - 330px);
.ant-tree-switcher{
line-height: 1;
color:#1890FF;
}
.ant-tree-iconEle{
line-height: 1.2;
color:#1890FF;
}
}
}
.editContainer{
margin-left: 12px;
flex: 1;
padding: 16px;
float: left;
min-width: 500px;
border:2px solid #eee;
.ant-table-pagination-right{
padding-right: 12px;
}
}
.previewContainer{
margin-left: 12px;
// flex: 1;
float: left;
min-width: 700px;
border:2px solid #eee;
.ant-table-pagination-right{
padding-right: 12px;
}
}
.ant-tree-treenode{
width: 100% !important;
.ant-tree-node-content-wrapper{
display: inline-block;
width: 100%;
}
.iconWraper1{
float: right;
span{
display: none;
}
}
}
.ant-tree-treenode:hover{
.iconWraper1>span{
margin-left: 12px;
font-size: 18px;
display: inline-block;
}
}
}
.redText{
color: red;
cursor: pointer;
}
\ No newline at end of file
src/pages/mobileConfig/menuconfig/MenuConfig.jsx
View file @
17ef2560
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
ProCard
from
'@ant-design/pro-card'
;
import
AddForm
from
'./AddForm'
;
import
LeftPart
from
'./LeftPart'
;
import
MiniMenu
from
'./miniMenu'
;
const
MenuConfig
=
props
=>
{
const
[
flag
,
setFlag
]
=
useState
(
1
);
return
(
<
div
split=
"vertical"
>
<
LeftPart
/>
{
/* <ProCard><AddForm /></ProCard> */
}
<
MiniMenu
/>
</
div
>
);
};
...
...
src/pages/mobileConfig/menuconfig/addForm.less
0 → 100644
View file @
17ef2560
.formStyle{
margin-bottom: 40px;
}
\ No newline at end of file
src/pages/mobileConfig/menuconfig/editForm.jsx
0 → 100644
View file @
17ef2560
import
React
,
{
useState
,
useEffect
}
from
'react'
;
import
{
Form
,
Input
,
Button
,
Row
,
Col
}
from
'antd'
;
import
styles
from
'./addForm.less'
;
import
PicturesWall
from
'@/components/Upload/index'
;
const
{
Item
}
=
Form
;
const
EditForm
=
props
=>
{
const
{
submitCallback
,
nodeType
,
info
}
=
props
;
const
[
form
]
=
Form
.
useForm
();
const
[
otherForm
]
=
Form
.
useForm
();
console
.
log
(
info
);
const
layout
=
{
layout
:
'horizontal'
,
labelCol
:
{
span
:
4
,
offset
:
1
},
wrapperCol
:
{
span
:
16
},
};
// 回显表单
useEffect
(()
=>
{
form
.
resetFields
();
otherForm
.
resetFields
();
},
[
info
]);
useEffect
(()
=>
{
if
(
nodeType
===
1
||
nodeType
===
2
)
{
let
arr
=
Object
.
keys
(
form
.
getFieldsValue
());
let
obj
=
{};
arr
.
map
(
i
=>
{
obj
[
i
]
=
info
[
i
];
});
form
.
setFieldsValue
({
...
obj
,
shortName
:
info
.
menuShortName
});
}
if
(
nodeType
===
3
||
nodeType
===
4
)
{
let
arr
=
Object
.
keys
(
otherForm
.
getFieldsValue
());
let
obj
=
{};
arr
.
map
(
i
=>
{
obj
[
i
]
=
info
[
i
];
});
otherForm
.
setFieldsValue
({
...
obj
,
shortName
:
info
.
menuShortName
});
}
},
[
info
]);
const
submit
=
()
=>
{
if
(
nodeType
===
1
||
nodeType
===
2
)
{
let
obj
=
form
.
getFieldsValue
();
console
.
log
(
obj
,
'1,2'
);
submitCallback
(
obj
);
}
if
(
nodeType
===
3
||
nodeType
===
4
)
{
let
obj
=
otherForm
.
getFieldsValue
();
console
.
log
(
obj
,
'3,4'
);
submitCallback
(
obj
);
}
};
return
(
<
div
>
{
(
nodeType
===
1
||
nodeType
===
2
)
&&
(
<
Form
form=
{
form
}
{
...
layout
}
className=
{
styles
.
formStyle
}
>
<
Item
label=
"分组名称"
name=
"menuName"
>
<
Input
/>
</
Item
>
<
Item
label=
"分组别名"
name=
"shortName"
>
<
Input
/>
</
Item
>
{
nodeType
===
1
&&
(
<
Item
label=
"在线图标"
name=
"imageUrl"
>
<
PicturesWall
/>
</
Item
>
)
}
{
nodeType
===
1
&&
(
<
Item
label=
"离线图标"
name=
"offlineImgUrl"
>
<
PicturesWall
/>
</
Item
>
)
}
{
nodeType
===
2
&&
(
<
Item
label=
"分组图标"
name=
"imageUrl"
>
<
PicturesWall
/>
</
Item
>
)
}
<
Item
label=
"功能参数"
name=
"funParam"
>
<
Input
/>
</
Item
>
<
Item
wrapperCol=
{
{
offset
:
5
}
}
style=
{
{
marginTop
:
'40px'
}
}
>
<
Button
type=
"primary"
onClick=
{
()
=>
submit
()
}
>
提交
</
Button
>
</
Item
>
</
Form
>
)
}
{
(
nodeType
===
3
||
nodeType
===
4
)
&&
(
<
Form
form=
{
otherForm
}
{
...
layout
}
className=
{
styles
.
formStyle
}
>
<
Item
label=
"菜单名称"
name=
"menuName"
>
<
Input
/>
</
Item
>
<
Item
label=
"菜单别名"
name=
"shortName"
>
<
Input
/>
</
Item
>
{
nodeType
===
3
&&
(
<
Item
label=
"在线图标"
name=
"imageUrl"
>
<
PicturesWall
/>
</
Item
>
)
}
{
nodeType
===
3
&&
(
<
Item
label=
"离线图标"
name=
"offlineImgUrl"
>
{
/* {otherForm.getFieldsValue().offlineImgUrl && <PicturesWall />} */
}
<
PicturesWall
/>
</
Item
>
)
}
{
nodeType
===
4
&&
(
<
Item
label=
"菜单图标"
name=
"imageUrl"
>
<
PicturesWall
/>
</
Item
>
)
}
<
Item
label=
"功能路径"
name=
"pageUrl"
>
<
Input
/>
</
Item
>
<
Item
label=
"功能参数"
name=
"funParam"
>
<
Input
/>
</
Item
>
<
Item
wrapperCol=
{
{
offset
:
5
}
}
style=
{
{
marginTop
:
'40px'
}
}
>
<
Button
type=
"primary"
onClick=
{
()
=>
submit
()
}
>
提交
</
Button
>
</
Item
>
</
Form
>
)
}
</
div
>
);
};
export
default
EditForm
;
src/pages/mobileConfig/menuconfig/miniMenu.jsx
0 → 100644
View file @
17ef2560
import
React
,
{
useEffect
,
useState
}
from
'react'
;
import
{
message
,
notification
,
Popconfirm
,
Form
,
Tree
,
Tooltip
,
Modal
,
Input
,
Button
,
Spin
,
}
from
'antd'
;
import
{
FileAddTwoTone
,
FolderAddTwoTone
,
FolderFilled
,
FileOutlined
,
DeleteTwoTone
,
}
from
'@ant-design/icons'
;
import
PicturesWall
from
'@/components/Upload/index'
;
import
classnames
from
'classnames'
;
import
{
miniAppSiteTree
,
getMiniAppModuleTree
,
addMenu
,
getMenuInfo
,
deleteMenu
,
editMenu
,
}
from
'@/services/mobileConfig/api'
;
import
styles
from
'./miniMenu.less'
;
import
AddForm
from
'./AddForm'
;
import
EditForm
from
'./editForm'
;
const
MiniMenu
=
props
=>
{
const
[
flag
,
setFlag
]
=
useState
(
1
);
// 刷新标志
const
[
treeFlage
,
setTreeFlag
]
=
useState
(
true
);
const
[
treeData
,
setTreeData
]
=
useState
([]);
// 树的数据
const
[
loading
,
setLoading
]
=
useState
(
false
);
// 加载
const
[
menuID
,
setMenuID
]
=
useState
(
''
);
// 选中的树ID
const
[
saveID
,
setSaveID
]
=
useState
(
''
);
// 保存选择的树id
const
[
nodeType
,
setNodeType
]
=
useState
(
''
);
// 选中的节点类型
const
[
info
,
setInfo
]
=
useState
({});
const
[
addVisible
,
setAddVisible
]
=
useState
(
false
);
// 新增弹窗
const
[
addTwoVisible
,
setAddTwoVisible
]
=
useState
(
false
);
// 编辑弹窗
const
[
addFlag
,
setAddFlag
]
=
useState
(
'root'
);
// 设置新增标志
const
[
nodeObj
,
setNodeObj
]
=
useState
({});
const
[
addType
,
setAddType
]
=
useState
(
''
);
// 添加下级类型
// 获取菜单树
useEffect
(()
=>
{
updateTrees
();
},
[
flag
]);
// 获取菜单信息
useEffect
(()
=>
{
getInfo
();
},
[
menuID
]);
// 更新树
const
updateTrees
=
()
=>
{
setLoading
(
true
);
miniAppSiteTree
({
_version
:
9999
,
_dc
:
new
Date
().
getTime
(),
node
:
-
2
,
userMode
:
'super'
,
select
:
''
,
})
.
then
(
res
=>
{
if
(
res
.
length
>
0
)
{
setLoading
(
false
);
const
result
=
res
[
0
].
children
[
0
].
children
[
2
].
children
;
setTreeData
(
result
);
console
.
log
(
result
);
// 第一次加载,默认选择第一个组织
if
(
treeFlage
)
{
handleSelect
([
result
[
0
].
menuID
],
false
);
setTreeFlag
(
false
);
}
}
})
.
catch
(
err
=>
{
setLoading
(
false
);
message
.
error
(
err
);
});
};
// 处理数据
const
mapTree
=
val
=>
{
const
obj
=
{
...
val
};
const
hasChild
=
obj
.
children
.
length
>
0
;
return
{
title
:
(
<
div
className=
{
styles
.
title
}
>
<
div
>
{
obj
.
text
}
</
div
>
<
div
className=
{
styles
.
tip
}
>
{
obj
.
menuType
===
'MiniAppMenuGroup'
&&
(
<
Tooltip
title=
"新增菜单组"
className=
{
styles
.
fs
}
>
<
FolderAddTwoTone
onClick=
{
()
=>
addMenuGroupTip
(
obj
)
}
/>
</
Tooltip
>
)
}
{
obj
.
menuType
===
'MiniAppMenuGroupTwo'
&&
(
<
Tooltip
title=
"新增功能菜单"
className=
{
styles
.
fs
}
>
<
FileAddTwoTone
onClick=
{
()
=>
addMenuTip
(
obj
)
}
/>
</
Tooltip
>
)
}
<
Popconfirm
cancelText=
"取消"
okText=
"确定"
title=
{
`确定删除${obj.text}?`
}
onConfirm=
{
()
=>
deleteMenuTip
(
obj
)
}
placement=
"right"
>
<
Tooltip
title=
"删除菜单"
className=
{
styles
.
fs
}
>
<
DeleteTwoTone
/>
</
Tooltip
>
</
Popconfirm
>
</
div
>
</
div
>
),
key
:
obj
.
menuID
,
icon
:
obj
.
menuType
!==
'MiniAppMenuThree'
&&
obj
.
menuType
!==
'MiniAppMenu'
?
(
<
FolderFilled
/>
)
:
(
<
FileOutlined
/>
),
menuType
:
obj
.
menuType
,
children
:
hasChild
?
obj
.
children
.
map
(
i
=>
mapTree
(
i
))
:
[],
};
};
// 树的点击事件
const
handleSelect
=
(
prop
,
treeNode
)
=>
{
console
.
log
(
prop
,
treeNode
);
if
(
treeNode
)
{
const
{
node
,
node
:
{
menuType
},
}
=
treeNode
;
console
.
log
(
menuType
);
switch
(
menuType
)
{
case
'MiniAppMenuGroup'
:
setNodeType
(
1
);
setAddType
(
2
);
break
;
case
'MiniAppMenuGroupTwo'
:
setNodeType
(
2
);
setAddType
(
4
);
break
;
case
'MiniAppMenu'
:
setNodeType
(
3
);
setAddType
(
3
);
break
;
case
'MiniAppMenuThree'
:
setNodeType
(
4
);
setAddType
(
4
);
break
;
default
:
break
;
}
}
if
(
prop
[
0
])
{
setMenuID
(
prop
[
0
]);
setSaveID
(
prop
[
0
]);
}
else
{
setMenuID
(
saveID
);
}
};
const
getInfo
=
id
=>
{
if
(
!
menuID
)
{
return
;
}
setLoading
(
true
);
getMenuInfo
({
menuID
,
_version
:
9999
,
_dc
:
Date
.
now
(),
})
.
then
(
res
=>
{
setLoading
(
false
);
if
(
res
.
success
)
{
setInfo
({
...
res
});
}
else
{
notification
.
error
({
message
:
'提示'
,
duration
:
10
,
description
:
res
.
message
||
'获取失败'
,
});
}
console
.
log
(
res
,
'resss'
);
})
.
catch
(
err
=>
{
setLoading
(
false
);
console
.
error
(
err
);
});
};
// 删除的回调
const
deleteMenuTip
=
val
=>
{
console
.
log
(
val
,
'val'
);
deleteMenu
({
menuID
:
val
.
menuID
,
_dc
:
Date
.
now
(),
_version
:
9999
,
}).
then
(
res
=>
{
if
(
res
.
success
)
{
setFlag
(
flag
+
1
);
notification
.
success
({
message
:
'提示'
,
duration
:
3
,
description
:
'删除成功'
,
});
}
else
{
notification
.
error
({
message
:
'提示'
,
duration
:
10
,
description
:
res
.
message
||
'删除成功'
,
});
}
});
};
// 新增菜单组
const
addMenuGroupTip
=
val
=>
{
console
.
log
(
val
,
'addgroup'
);
setNodeObj
(
val
);
setAddVisible
(
true
);
};
const
rootAddGroup
=
()
=>
{
setNodeObj
(
''
);
setNodeType
(
1
);
setAddType
(
1
);
setAddVisible
(
true
);
};
// 新增功能菜单
const
addMenuTip
=
val
=>
{
console
.
log
(
val
,
'add'
);
setNodeObj
(
val
);
setAddTwoVisible
(
true
);
};
const
rootAdd
=
()
=>
{
setNodeObj
(
''
);
setNodeType
(
3
);
setAddType
(
3
);
setAddTwoVisible
(
true
);
};
// 提交的回调
const
submitCallback
=
(
prop
,
item
)
=>
{
console
.
log
(
prop
,
item
);
let
obj
=
{
...
prop
};
const
parentID
=
item
.
menuID
?
item
.
menuID
:
-
1
;
addMenu
({
_dc
:
Date
.
now
(),
parentID
,
subSystemValue
:
'miniapp'
,
_version
:
9999
,
...
obj
,
})
.
then
(
res
=>
{
if
(
res
.
success
)
{
setAddVisible
(
false
);
setAddTwoVisible
(
false
);
setFlag
(
flag
+
1
);
notification
.
success
({
message
:
'提示'
,
description
:
'新增成功'
,
duration
:
3
,
});
}
else
{
notification
.
error
({
message
:
'提示'
,
description
:
res
.
message
||
'新增失败'
,
duration
:
10
,
});
}
console
.
log
(
res
,
'resadd'
);
})
.
catch
(
err
=>
{
console
.
error
(
err
);
});
};
// 编辑的回调
const
editSubmitCallback
=
prop
=>
{
setLoading
(
true
);
console
.
log
(
prop
);
let
obj
=
{
...
prop
};
editMenu
({
_dc
:
Date
.
now
(),
menuID
,
subSystemValue
:
'miniapp'
,
_version
:
9999
,
...
obj
,
})
.
then
(
res
=>
{
setLoading
(
false
);
if
(
res
.
success
)
{
setFlag
(
flag
+
1
);
notification
.
success
({
message
:
'提示'
,
duration
:
3
,
description
:
'编辑成功'
,
});
}
else
{
notification
.
error
({
message
:
'提示'
,
duration
:
3
,
description
:
res
.
message
||
'编辑失败'
,
});
}
console
.
log
(
res
,
'resres'
);
})
.
catch
(
err
=>
{
console
.
error
(
err
);
setLoading
(
false
);
});
};
return
(
<
Spin
spinning=
{
loading
}
tip=
"loading..."
>
<
div
className=
{
classnames
({
[
styles
.
box
]:
true
,
})
}
>
<
div
className=
{
classnames
({
[
styles
.
left
]:
true
,
})
}
>
<
div
className=
{
classnames
({
[
styles
.
leftTop
]:
true
,
})
}
>
菜单列表
<
div
className=
{
classnames
({
[
styles
.
tRight
]:
true
,
})
}
>
<
Tooltip
title=
"新增菜单组"
>
<
FolderAddTwoTone
className=
{
`${styles.icon1} ${styles.icon}`
}
onClick=
{
()
=>
rootAddGroup
()
}
/>
</
Tooltip
>
<
Tooltip
title=
"新增功能菜单"
>
<
FileAddTwoTone
onClick=
{
()
=>
rootAdd
()
}
className=
{
`${styles.icon2} ${styles.icon}`
}
/>
</
Tooltip
>
</
div
>
</
div
>
{
treeData
.
length
>
0
&&
(
<
Tree
showIcon
onSelect=
{
handleSelect
}
treeData=
{
treeData
.
map
(
item
=>
mapTree
(
item
))
}
blockNode
autoExpandParent
selectedKeys=
{
[
menuID
]
}
expandedKeys=
{
[
menuID
]
}
/>
)
}
</
div
>
<
Modal
visible=
{
addVisible
}
title=
"新增菜单组"
bodyStyle=
{
{
width
:
'100%'
,
minHeight
:
'100px'
}
}
style=
{
{
top
:
20
}
}
width=
"600px"
destroyOnClose
footer=
{
null
}
cancelText=
"取消"
okText=
"确认"
onCancel=
{
()
=>
setAddVisible
(
false
)
}
onConfirm=
{
()
=>
{
submitCallback
();
}
}
>
<
AddForm
nodeType=
{
nodeType
}
nodeObj=
{
nodeObj
}
addType=
{
addType
}
submitCallback=
{
submitCallback
}
/>
</
Modal
>
<
Modal
visible=
{
addTwoVisible
}
title=
"新增功能菜单"
bodyStyle=
{
{
width
:
'100%'
,
minHeight
:
'100px'
}
}
style=
{
{
top
:
20
}
}
width=
"600px"
destroyOnClose
footer=
{
null
}
cancelText=
"取消"
okText=
"确认"
onCancel=
{
()
=>
setAddTwoVisible
(
false
)
}
>
<
AddForm
nodeType=
{
nodeType
}
nodeObj=
{
nodeObj
}
addType=
{
addType
}
submitCallback=
{
submitCallback
}
/>
</
Modal
>
<
div
className=
{
classnames
({
[
styles
.
middle
]:
true
,
})
}
>
{
nodeType
&&
(
<
EditForm
nodeType=
{
nodeType
}
info=
{
info
}
submitCallback=
{
editSubmitCallback
}
/>
)
}
</
div
>
</
div
>
</
Spin
>
);
};
export
default
MiniMenu
;
src/pages/mobileConfig/menuconfig/miniMenu.less
0 → 100644
View file @
17ef2560
.box{
min-height: calc( 100vh - 172px);
display: flex;
}
.left{
min-width: 300px;
width: 300px;
min-height: 100%;
border: 1px solid #eee;
padding: 10px;
.ant-tree-node-content-wrapper{
display: flex;
align-items: center;
.ant-tree-iconEle{
display: flex;
align-items: center;
}
.ant-tree-title{
width: 100%;
}
}
.leftTop{
display: flex;
align-items: center;
margin-bottom: 10px;
justify-content: space-between;
.tRight{
display: flex;
align-items: center;
.icon1{
font-size: 20px;
margin-right: 10px;
}
.icon2{
font-size: 18px;
margin-right: 5px;
}
.icon:hover{
cursor: pointer;
}
}
}
}
.middle{
min-width: 500px;
width: 500px;
min-height: 100%;
border: 1px solid #eee;
padding: 10px;
margin: 0 10px;
}
.title{
display: flex;
align-items: center;
width: 100%;
}
.tip{
display: none;
}
.title:hover{
.tip{
display: flex;
align-items: center;
justify-content: flex-end;
width: 100%;
}
}
.fs{
font-size: 18px;
margin-left: 10px;
}
\ No newline at end of file
src/pages/userCenter/roleManage/RoleManage.jsx
View file @
17ef2560
...
...
@@ -29,6 +29,7 @@ import ListCard, {
}
from
'@/components/CheckGroup'
;
// import ListCard from '@/pages/orgnazation/ListCard';
import
qs
from
'qs'
;
import
classnames
from
'classnames'
;
import
styles
from
'@/pages/userCenter/roleManage/RoleManage.less'
;
import
AddModal
from
'./AddModal'
;
import
DelModal
from
'./DelModal'
;
...
...
@@ -38,6 +39,7 @@ import userStyles from '../UserManage.less';
const
{
Search
}
=
Input
;
const
placeholder
=
'请输入功能名称'
;
const
SiteManage
=
()
=>
{
const
[
treeData
,
setTreeData
]
=
useState
([]);
const
[
searchWord
,
setSearchWord
]
=
useState
(
''
);
...
...
@@ -313,63 +315,85 @@ const SiteManage = () => {
};
return
(
<
PageContainer
>
<
Row
gutter=
{
0
}
>
<
Col
span=
{
mulu
?
4
:
0
}
>
<
Card
className=
{
styles
.
cardBox
}
>
<
Spin
tip=
"loading...."
spinning=
{
spinLoading
}
style=
{
{
margin
:
'20px auto '
,
display
:
'block'
}
}
>
<
div
className=
{
userStyles
.
siteTitle
}
>
<
span
>
选择角色:
</
span
>
</
div
>
{
treeData
&&
treeData
.
length
>
0
&&
(
<
Tree
// showLine=
{{
showLeafIcon
:
false
}}
showIcon
onSelect=
{
handleTreeSelect
}
autoExpandParent
expandedKeys=
{
currentSelectId
}
treeData=
{
treeData
}
selectedKeys=
{
currentSelectId
}
blockNode
/>
)
}
</
Spin
>
<
AddModal
visible=
{
modalVisible
}
onCancel=
{
()
=>
setModalVisible
(
false
)
}
itemObj=
{
itemObj
}
confirmModal=
{
confirmModal
}
/>
<
DelModal
visible=
{
delVisible
}
itemObj=
{
itemObj
}
onCancel=
{
()
=>
setDelVisible
(
false
)
}
confirmModal=
{
delModal
}
/>
<
EditModal
visible=
{
editVisible
}
itemObj=
{
itemObj
}
onCancel=
{
()
=>
setEditVisible
(
false
)
}
confirmModal=
{
editModal
}
/>
<
EditGroup
visible=
{
groupVisible
}
itemObj=
{
itemObj
}
onCancel=
{
()
=>
setGroupVisible
(
false
)
}
confirmModal=
{
groupModal
}
/>
</
Card
>
{
/* <div>
{
/* <Row gutter={0}>
<Col span={mulu ? 4 : 0}> */
}
<
div
className=
{
classnames
({
[
styles
.
content
]:
true
,
})
}
>
<
Card
className=
{
classnames
({
[
styles
.
cardBox
]:
true
,
[
styles
.
hideBox
]:
!
mulu
,
})
}
>
<
Spin
tip=
"loading...."
spinning=
{
spinLoading
}
style=
{
{
margin
:
'20px auto '
,
display
:
'block'
}
}
>
<
div
className=
{
userStyles
.
siteTitle
}
>
<
span
>
选择角色:
</
span
>
</
div
>
{
treeData
&&
treeData
.
length
>
0
&&
(
<
Tree
// showLine=
{{
showLeafIcon
:
false
}}
showIcon
onSelect=
{
handleTreeSelect
}
autoExpandParent
expandedKeys=
{
currentSelectId
}
treeData=
{
treeData
}
selectedKeys=
{
currentSelectId
}
blockNode
/>
)
}
</
Spin
>
<
AddModal
visible=
{
modalVisible
}
onCancel=
{
()
=>
setModalVisible
(
false
)
}
itemObj=
{
itemObj
}
confirmModal=
{
confirmModal
}
/>
<
DelModal
visible=
{
delVisible
}
itemObj=
{
itemObj
}
onCancel=
{
()
=>
setDelVisible
(
false
)
}
confirmModal=
{
delModal
}
/>
<
EditModal
visible=
{
editVisible
}
itemObj=
{
itemObj
}
onCancel=
{
()
=>
setEditVisible
(
false
)
}
confirmModal=
{
editModal
}
/>
<
EditGroup
visible=
{
groupVisible
}
itemObj=
{
itemObj
}
onCancel=
{
()
=>
setGroupVisible
(
false
)
}
confirmModal=
{
groupModal
}
/>
<
div
>
{
mulu
&&
(
<
Tooltip
title=
"隐藏角色栏"
className=
{
styles
.
hide
}
>
<
DoubleLeftOutlined
onClick=
{
()
=>
handleHide
()
}
/>
</
Tooltip
>
)
}
{
!
mulu
&&
(
<
Tooltip
title=
"显示角色栏"
className=
{
styles
.
hide
}
>
<
DoubleRightOutlined
onClick=
{
()
=>
handleHide
()
}
/>
</
Tooltip
>
)
}
</
div
>
</
Card
>
{
/* <div>
{mulu && (
<Tooltip title="隐藏角色栏" className={styles.hide}>
<DoubleLeftOutlined onClick={() => handleHide()} />
</Tooltip>
)}
</div> */
}
</
Col
>
{
/* </Col> */
}
{
/* <Col span={mulu ? 0 : 1}>
{mulu && (
<Tooltip title="隐藏角色栏" className={styles.hide}>
...
...
@@ -382,8 +406,19 @@ const SiteManage = () => {
</Tooltip>
)}
</Col> */
}
<
Col
span=
{
mulu
?
20
:
23
}
>
<
Card
style=
{
{
marginBottom
:
'10px'
,
minWidth
:
'870px'
}
}
>
{
/* <Col span={mulu ? 20 : 23}> */
}
<
div
className=
{
classnames
({
[
styles
.
boxR
]:
true
,
[
styles
.
boxH
]:
mulu
,
})
}
>
<
Card
className=
{
classnames
({
[
styles
.
cardBoxTop
]:
true
,
[
styles
.
boxH
]:
mulu
,
})
}
>
<
Row
align=
"middle"
>
<
Col
span=
{
1
}
>
搜索
</
Col
>
<
Col
span=
{
8
}
>
...
...
@@ -438,7 +473,12 @@ const SiteManage = () => {
</
Col
>
</
Row
>
</
Card
>
<
Card
className=
{
styles
.
cardBoxR
}
>
<
Card
className=
{
classnames
({
[
styles
.
boxH
]:
mulu
,
[
styles
.
cardBoxR
]:
true
,
})
}
>
{
roleID
&&
(
<
ListCard
loading=
{
loading
}
...
...
@@ -451,8 +491,10 @@ const SiteManage = () => {
/>
)
}
</
Card
>
</
Col
>
</
Row
>
</
div
>
{
/* </Col>
</Row> */
}
</
div
>
</
PageContainer
>
);
};
...
...
src/pages/userCenter/roleManage/RoleManage.less
View file @
17ef2560
.cardBox{
min-height: calc(100vh - 74px);
max-height: calc(100vh - 74px);
overflow-y: scroll;
margin-right: 20px;
// overflow-y: scroll;
overflow: auto;
width: 260px;
left: 0;
top: 0;
margin-right: 10px;
position: relative;
// transition: left,width 10s;
transition-property:width,left;
transition-duration: 0.5s;
white-space: nowrap;
.ant-tree-node-content-wrapper{
display: flex;
align-items: center;
...
...
@@ -12,6 +21,15 @@
}
}
}
.hideBox{
left: 0px;
top: 0;
width: 20px;
}
.hideH{
width: 100%;
}
.ant-tree-node-content-wrapper-open{
display: flex;
align-items: center;
...
...
@@ -35,16 +53,16 @@
align-items: center;
}
.cardBoxR{
min-width: 870px;
min-height: calc(100vh - 158px);
max-height: calc(100vh - 158px);
min-width: 870px;
overflow-y: scroll;
}
:global{
.ant-tree-switcher{
display: flex;
align-items: center;
color:#1890FF;
//
color:#1890FF;
.ant-tree-switcher-line-icon{
margin-left: 5px;
}
...
...
@@ -62,10 +80,18 @@
z-index: 2;
}
.anticon-unordered-list{
vertical-align: 0.125em;
color:#1890FF;
}
.ant-card-body {
padding: 20px 10px;
.boxR{
width: 100%;
position: relative;
transition: width 2s;
}
// .anticon-unordered-list{
// vertical-align: 0.125em;
// color:#1890FF;
// }
.content{
width: 100%;
display: flex;
position: relative;
}
\ No newline at end of file
src/pages/userCenter/siteManage/SiteManage.jsx
View file @
17ef2560
...
...
@@ -236,42 +236,56 @@ const SiteManage = () => {
return
(
<
PageContainer
>
<
Row
>
<
Col
span=
{
mulu
?
4
:
0
}
>
<
Card
className=
{
classnames
({
[
styles
.
cardBox
]:
true
,
})
}
{
/* <Row>
<Col span={mulu ? 4 : 0}> */
}
<
div
className=
{
styles
.
content
}
>
<
Card
className=
{
classnames
({
[
styles
.
cardBox
]:
true
,
[
styles
.
hideBox
]:
!
mulu
,
})
}
>
<
Spin
tip=
"loading...."
spinning=
{
spinLoading
}
style=
{
{
marginTop
:
'20px'
}
}
>
<
Spin
tip=
"loading...."
spinning=
{
spinLoading
}
style=
{
{
marginTop
:
'20px'
}
}
>
<
div
className=
{
userStyles
.
siteTitle
}
>
<
span
>
选择站点:
</
span
>
</
div
>
<
List
>
{
renderListItem
(
treeData
)
}
</
List
>
</
Spin
>
<
AddModal
visible=
{
modalVisible
}
onCancel=
{
()
=>
setModalVisible
(
false
)
}
confirmModal=
{
confirmModal
}
/>
<
DelModal
visible=
{
delVisible
}
stationId=
{
currentStation
.
stationID
}
onCancel=
{
()
=>
setDelVisible
(
false
)
}
confirmModal=
{
delModal
}
/>
<
EditModal
visible=
{
editVisible
}
stationObj=
{
currentStation
}
onCancel=
{
()
=>
setEditVisible
(
false
)
}
confirmModal=
{
editModal
}
/>
</
Card
>
{
/* <div>
<
div
className=
{
userStyles
.
siteTitle
}
>
<
span
>
选择站点:
</
span
>
</
div
>
<
List
>
{
renderListItem
(
treeData
)
}
</
List
>
</
Spin
>
<
AddModal
visible=
{
modalVisible
}
onCancel=
{
()
=>
setModalVisible
(
false
)
}
confirmModal=
{
confirmModal
}
/>
<
DelModal
visible=
{
delVisible
}
stationId=
{
currentStation
.
stationID
}
onCancel=
{
()
=>
setDelVisible
(
false
)
}
confirmModal=
{
delModal
}
/>
<
EditModal
visible=
{
editVisible
}
stationObj=
{
currentStation
}
onCancel=
{
()
=>
setEditVisible
(
false
)
}
confirmModal=
{
editModal
}
/>
<
div
>
{
mulu
&&
(
<
Tooltip
title=
"隐藏站点"
className=
{
styles
.
hide
}
>
<
DoubleLeftOutlined
onClick=
{
()
=>
handleHide
()
}
/>
</
Tooltip
>
)
}
{
!
mulu
&&
(
<
Tooltip
title=
"显示站点"
className=
{
styles
.
hide
}
>
<
DoubleRightOutlined
onClick=
{
()
=>
handleHide
()
}
/>
</
Tooltip
>
)
}
</
div
>
</
Card
>
{
/* <div>
{mulu && (
<Tooltip title="隐藏站点" className={styles.hide}>
<DoubleLeftOutlined onClick={() => handleHide()} />
...
...
@@ -283,7 +297,7 @@ const SiteManage = () => {
</Tooltip>
)}
</div> */
}
</
Col
>
{
/* </Col> */
}
{
/* <Col span={mulu ? 0 : 1}>
{mulu && (
<Tooltip title="隐藏站点" className={styles.hide}>
...
...
@@ -296,8 +310,19 @@ const SiteManage = () => {
</Tooltip>
)}
</Col> */
}
<
Col
span=
{
mulu
?
20
:
23
}
>
<
Card
style=
{
{
marginBottom
:
'10px'
,
minWidth
:
'600px'
}
}
>
{
/* <Col span={mulu ? 20 : 23}> */
}
<
div
className=
{
classnames
({
[
styles
.
boxR
]:
true
,
[
styles
.
boxH
]:
mulu
,
})
}
>
<
Card
className=
{
classnames
({
[
styles
.
cardBoxTop
]:
true
,
[
styles
.
boxH
]:
mulu
,
})
}
>
<
Row
align=
"middle"
>
<
Col
span=
{
1
}
>
搜索
</
Col
>
<
Col
span=
{
8
}
>
...
...
@@ -343,7 +368,12 @@ const SiteManage = () => {
</
Col
>
</
Row
>
</
Card
>
<
Card
className=
{
styles
.
cardBoxR
}
>
<
Card
className=
{
classnames
({
[
styles
.
boxH
]:
mulu
,
[
styles
.
cardBoxR
]:
true
,
})
}
>
{
currentStation
.
stationID
&&
(
<
ListCard
loading=
{
loading
}
...
...
@@ -355,8 +385,10 @@ const SiteManage = () => {
/>
)
}
</
Card
>
</
Col
>
</
Row
>
</
div
>
</
div
>
{
/* </Col>
</Row> */
}
</
PageContainer
>
);
};
...
...
src/pages/userCenter/siteManage/SiteManage.less
View file @
17ef2560
.cardBox{
min-height: calc(100vh - 7
4
px);
max-height: calc(100vh - 7
4
px);
min-height: calc(100vh - 7
5
px);
max-height: calc(100vh - 7
5
px);
overflow: auto;
width: 260px;
left: 0;
top: 0;
margin-right: 10px;
position: relative;
// transition: left,width 10s;
transition-property:width,left;
transition-duration: 0.5s;
white-space: nowrap
}
.hideBox{
left: 0px;
top: 0;
width: 20px;
}
.hideH{
width: 100%;
}
.siteTitle{
font-size: 16px;
...
...
@@ -17,6 +33,11 @@
min-width: 600px;
overflow-y: scroll;
}
.cardBoxTop{
// max-width: calc( 100% - 450px);
// margin-bottom: 10px;
}
.ant-tree-node-content-wrapper-open{
display: flex;
align-items: center;
...
...
@@ -64,4 +85,14 @@
}
// .hide{
// left: 0;
// }
\ No newline at end of file
// }
.content{
width: 100%;
display: flex;
position: relative;
}
.boxR{
width: 100%;
position: relative;
transition: width 2s;
}
\ No newline at end of file
src/services/mobileConfig/api.js
View file @
17ef2560
...
...
@@ -46,3 +46,41 @@ export const editWebsite = (params, options) => {
*/
export
const
getMiniAppModuleTree
=
params
=>
get
(
`
${
PUBLISH_SERVICE
}
/PlatformCenter/MiniAppModuleTree`
,
params
);
/**
*
* @新增功能菜单组
* @请求参数 {*}{
* version: 9999
_dc: 1606203896370
parentID: -1
subSystemValue: miniapp
menuName: 分组名称
imageUrl: assets/images/appMenu/小程序tab/enterprise_select.png
offlineImgUrl: assets/images/appMenu/小程序tab/enterprise_unselect.png
shortName: 分组别名
pageUrl: //功能路径
funParam: 测试功能参数
relatedRoleList: //角色数组
}
*/
export
const
addMenu
=
params
=>
get
(
'/Cityinterface/rest/services/OMS.svc/MiniApp_AddMenu'
,
params
);
// 获取菜单详情
/**
* {
* menuID:''
* }
*/
export
const
getMenuInfo
=
params
=>
get
(
'/Cityinterface/rest/services/OMS.svc/Mini_GetMenuInfo'
,
params
);
// 编辑菜单
export
const
editMenu
=
params
=>
get
(
'/Cityinterface/rest/services/OMS.svc/MiniApp_EditMenu'
,
params
);
// 删除菜单
export
const
deleteMenu
=
params
=>
get
(
'/Cityinterface/rest/services/OMS.svc/MiniApp_DeleteMenu'
,
params
);
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