Skip to content

C
CivManage
Commit 03d16e7a authored by 张烨's avatar 张烨
Browse files
Options

Merge branch 'master' of https://g.civnet.cn:8443/test/maintenance

parents 6b83c760 bacac5ec
Show whitespace changes
Inline Side-by-side
Showing with 884 additions and 228 deletions
src/components/CheckGroup/ItemCard.jsx
View file @ 03d16e7a
...@@ -8,10 +8,12 @@ const ListCardItem = props => { ...@@ -8,10 +8,12 @@ const ListCardItem = props => {
const { const {
getValueCallback, getValueCallback,
itemid, itemid,
userList, // userList,
Child,
OUName, OUName,
searchWord, searchWord,
Child, children,
text,
} = props; } = props;
const [indeterminate, setIndeterminate] = useState(false); const [indeterminate, setIndeterminate] = useState(false);
const [childValues, setChildValues] = useState({}); const [childValues, setChildValues] = useState({});
...@@ -23,20 +25,18 @@ const ListCardItem = props => { ...@@ -23,20 +25,18 @@ const ListCardItem = props => {
useEffect(() => { useEffect(() => {
let arr = []; let arr = [];
userList.map((item, index) => { children.map((item, index) => {
let obj = { ...item }; let obj = { ...item };
obj.label = ( obj.label = (
<span <span
className={ className={
searchWord && obj.userName.includes(searchWord) searchWord && obj.text.includes(searchWord) ? styles.isSearch : ''
? styles.isSearch
: ''
} }
> >
{obj.userName || obj.roleName || obj.stationName} {obj.text}
</span> </span>
); );
obj.value = obj.userID || obj.roleID || obj.stationID; obj.value = obj.userID || obj.roleID || obj.stationID || obj.id;
arr.push(obj); arr.push(obj);
}); });
setDefaultList(arr); setDefaultList(arr);
...@@ -44,19 +44,19 @@ const ListCardItem = props => { ...@@ -44,19 +44,19 @@ const ListCardItem = props => {
useEffect(() => { useEffect(() => {
let arr2 = []; let arr2 = [];
userList.map((item, index) => { children.map((item, index) => {
if (item.isChecked) { if (item.isChecked) {
arr2.push(item.userID || item.roleID || item.stationID); arr2.push(item.userID || item.roleID || item.stationID || item.id);
} }
}); });
// eslint-disable-next-line no-unused-expressions // eslint-disable-next-line no-unused-expressions
getValueCallback && getValueCallback(arr2, itemid); getValueCallback && getValueCallback(arr2, itemid);
const all = userList.every(u => u.isChecked); const all = children.every(u => u.isChecked);
setIndeterminate(!all && userList.some(u => u.isChecked)); setIndeterminate(!all && children.some(u => u.isChecked));
setAllChecked(all); setAllChecked(all);
setCheckList(arr2); setCheckList(arr2);
}, [userList]); }, [children]);
const handleAllChecked = e => { const handleAllChecked = e => {
const { checked } = e.target; const { checked } = e.target;
...@@ -82,9 +82,6 @@ const ListCardItem = props => { ...@@ -82,9 +82,6 @@ const ListCardItem = props => {
getValueCallback(e, itemid); getValueCallback(e, itemid);
} }
}; };
if (defaultList.length === 0) {
return null;
}
const handleChildValueCallback = (arr, childIndex) => { const handleChildValueCallback = (arr, childIndex) => {
childValues[childIndex] = arr; childValues[childIndex] = arr;
...@@ -105,6 +102,9 @@ const ListCardItem = props => { ...@@ -105,6 +102,9 @@ const ListCardItem = props => {
/> />
)); ));
if (defaultList.length === 0) {
return null;
}
return ( return (
<> <>
<div className={`${styles.divBox}`}> <div className={`${styles.divBox}`}>
...@@ -116,7 +116,7 @@ const ListCardItem = props => { ...@@ -116,7 +116,7 @@ const ListCardItem = props => {
handleAllChecked(e); handleAllChecked(e);
}} }}
> >
{OUName} {text}
</Checkbox> </Checkbox>
</div> </div>
<div style={{ width: '100%' }} className={styles.checkdiv}> <div style={{ width: '100%' }} className={styles.checkdiv}>
......
src/components/CheckGroup/index.jsx
View file @ 03d16e7a
...@@ -24,10 +24,15 @@ const ListCard = props => { ...@@ -24,10 +24,15 @@ const ListCard = props => {
title: '默认组', title: '默认组',
id: '', id: '',
}; };
// /Cityinterface/rest/services/OMS.svc/P_GetUserByStation
//
// /Cityinterface/rest/services/OMS.svc/U_GetUserListForBatchOper // /Cityinterface/rest/services/OMS.svc/U_GetUserListForBatchOper
get('/Cityinterface/rest/services/OMS.svc/P_GetUserByStation', { get('/Cityinterface/rest/services/OMS.svc/W4_GetMenuByRoleWithLevel', {
// OUID:ouid||'', // OUID:ouid||'',
stationID: ouid || '', // stationID: ouid || '',
roleID: ouid,
subSystemValue: 'city',
subSystemName: 'city',
_version: 9999, _version: 9999,
_dc: new Date().getTime(), _dc: new Date().getTime(),
}) })
...@@ -35,8 +40,8 @@ const ListCard = props => { ...@@ -35,8 +40,8 @@ const ListCard = props => {
setLoading(false); setLoading(false);
const list = []; const list = [];
// eslint-disable-next-line no-unused-expressions // eslint-disable-next-line no-unused-expressions
res && res.success &&
res.forEach(item => { res.root.forEach(item => {
list.push({ ...defaultConfig, ...item }); list.push({ ...defaultConfig, ...item });
}); });
setdataList(list); setdataList(list);
......
src/pages/appConfig/AppMenu.js
View file @ 03d16e7a
...@@ -22,6 +22,7 @@ import { ...@@ -22,6 +22,7 @@ import {
getTree, getTree,
addMenuApi, addMenuApi,
addMenuGroupApi, addMenuGroupApi,
submitMenuInfo,
getRoleList, getRoleList,
getMenuInfo, getMenuInfo,
deleteMenuApi, deleteMenuApi,
...@@ -34,6 +35,8 @@ const SevenParams = () => { ...@@ -34,6 +35,8 @@ const SevenParams = () => {
const [treeLoading, setTreeLoading] = useState(true); const [treeLoading, setTreeLoading] = useState(true);
const [treeData, setTreeData] = useState([]); // 菜单树 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 [rolelist, setRolelist] = useState([]);
const [roleValueList, setRoleValueList] = useState({}); const [roleValueList, setRoleValueList] = useState({});
...@@ -44,9 +47,10 @@ const SevenParams = () => { ...@@ -44,9 +47,10 @@ const SevenParams = () => {
const [addMenuVisible, setAddMenuVisible] = useState(false); const [addMenuVisible, setAddMenuVisible] = useState(false);
const [addMenuGroupVisible, setAddMenuGroupVisible] = useState(false); const [addMenuGroupVisible, setAddMenuGroupVisible] = useState(false);
const [tipVisible, setTipVisible] = useState(false); const [tipVisible, setTipVisible] = useState(false);
// const [editMenuVisible, setEditMenuVisible] = useState(false);
const [deleteMenuVisible, setDeleteMenuVisible] = useState(false); const [deleteMenuVisible, setDeleteMenuVisible] = useState(false);
const [addMenuForm] = Form.useForm(); const [addMenuForm] = Form.useForm();
const [editMenuForm] = Form.useForm();
const [addMenuGroupForm] = Form.useForm(); const [addMenuGroupForm] = Form.useForm();
const getRoleValueCallback = useCallback((value, index) => { const getRoleValueCallback = useCallback((value, index) => {
...@@ -65,8 +69,14 @@ const SevenParams = () => { ...@@ -65,8 +69,14 @@ const SevenParams = () => {
.then(res => { .then(res => {
if (res.length > 0) { if (res.length > 0) {
setTreeLoading(false); setTreeLoading(false);
setTreeData(res[0].children[0].children[2].children); const result = res[0].children[0].children[2].children;
console.log(res[0].children[0].children[2].children); setTreeData(result);
console.log(result);
// 第一次加载，默认选择第一个组织
if (treeState) {
onSelect([result[0].menuID], false);
setTreeState(false);
}
} }
}) })
.catch(err => { .catch(err => {
...@@ -109,11 +119,11 @@ const SevenParams = () => { ...@@ -109,11 +119,11 @@ const SevenParams = () => {
onClick={() => addMenuGroup(menu, '分组图标')} onClick={() => addMenuGroup(menu, '分组图标')}
/> />
</Tooltip> </Tooltip>
<Tooltip title="添加菜单组"> {/* <Tooltip title="添加菜单组">
<EditTwoTone <EditTwoTone
onClick={() => editMenuGroup(menu, '在线图标')} onClick={() => editMenuGroup(menu, '在线图标')}
/> />
</Tooltip> </Tooltip> */}
</> </>
)} )}
{menu.menuType === 'MiniAppMenuGroupTwo' && ( {menu.menuType === 'MiniAppMenuGroupTwo' && (
...@@ -121,20 +131,20 @@ const SevenParams = () => { ...@@ -121,20 +131,20 @@ const SevenParams = () => {
<Tooltip title="添加菜单"> <Tooltip title="添加菜单">
<FileAddTwoTone onClick={() => addMenu(menu)} /> <FileAddTwoTone onClick={() => addMenu(menu)} />
</Tooltip> </Tooltip>
<Tooltip title="编辑菜单组"> {/* <Tooltip title="编辑菜单组">
<EditTwoTone <EditTwoTone
onClick={() => editMenuGroup(menu, '分组图标')} onClick={() => editMenuGroup(menu, '分组图标')}
/> />
</Tooltip> </Tooltip> */}
</> </>
)} )}
{menu.menuType === 'MiniAppMenuThree' && ( {/* {menu.menuType === 'MiniAppMenuThree' && (
<> <>
<Tooltip title="编辑菜单"> <Tooltip title="编辑菜单">
<EditTwoTone onClick={() => editMenu(menu)} /> <EditTwoTone onClick={() => editMenu(menu)} />
</Tooltip> </Tooltip>
</> </>
)} )} */}
<Tooltip title="删除菜单"> <Tooltip title="删除菜单">
<DeleteTwoTone onClick={() => deleteMenu(menu)} /> <DeleteTwoTone onClick={() => deleteMenu(menu)} />
</Tooltip> </Tooltip>
...@@ -148,6 +158,38 @@ const SevenParams = () => { ...@@ -148,6 +158,38 @@ const SevenParams = () => {
}; };
}; };
// 获取当前菜单详细
const onSelect = (props, e) => {
// e.node.pos节点类型，根据这个渲染不同的编辑表单item,0-x一级菜单，0-0-x二级，0-0-0-x三级
if (e) {
if (e.node.pos.lastIndexOf('-') === 1) {
setNodeType(1);
} else if (e.node.pos.lastIndexOf('-') === 3) {
setNodeType(2);
} else {
setNodeType(3);
}
}
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 => { const addMenu = menu => {
setAddMenuVisible(true); setAddMenuVisible(true);
...@@ -199,34 +241,35 @@ const SevenParams = () => { ...@@ -199,34 +241,35 @@ const SevenParams = () => {
message.error(err); message.error(err);
}); });
}; };
const editMenuGroup = (menu, label) => {
setAddMenuGroupVisible(true); // const editMenuGroup = (menu, label) => {
setMenuTitle(`编辑${menu.text}`); // setAddMenuGroupVisible(true);
setMenuID(menu.menuID); // setMenuTitle(`编辑${menu.text}`);
setMenuLabel(label); // setMenuID(menu.menuID);
getMenuInfo(menu.menuID) // setMenuLabel(label);
.then(res => { // getMenuInfo(menu.menuID)
if (res.success) { // .then(res => {
addMenuGroupForm.setFieldsValue({ // if (res.success) {
menuName: res.menuName, // addMenuGroupForm.setFieldsValue({
shortName: res.menuShortName, // menuName: res.menuName,
imageUrl: res.imageUrl, // shortName: res.menuShortName,
pageUrl: res.pageUrl, // imageUrl: res.imageUrl,
offlineImgUrl: res.offlineImgUrl, // pageUrl: res.pageUrl,
funParam: res.funParam, // offlineImgUrl: res.offlineImgUrl,
relatedRoleList: res.relatedRoleList || [], // funParam: res.funParam,
}); // relatedRoleList: res.relatedRoleList || [],
} else { // });
notification.error({ // } else {
message: '获取失败', // notification.error({
description: res.message, // message: '获取失败',
}); // description: res.message,
} // });
}) // }
.catch(err => { // })
message.error(err); // .catch(err => {
}); // message.error(err);
}; // });
// };
const deleteMenu = menu => { const deleteMenu = menu => {
setDeleteMenuVisible(true); setDeleteMenuVisible(true);
setMenuTitle(`删除菜单${menu.text}`); setMenuTitle(`删除菜单${menu.text}`);
...@@ -300,6 +343,65 @@ const SevenParams = () => { ...@@ -300,6 +343,65 @@ const SevenParams = () => {
setTipVisible(true); 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 => {
submitMenuInfo(params)
.then(res => {
if (res.success) {
notification.success({
message: '提交成功',
});
} else {
notification.error({
message: '获取失败',
description: res.message,
});
}
})
.catch(err => {
message.error(err);
});
};
// 提交删除菜单 // 提交删除菜单
const submitDeleteMenu = () => { const submitDeleteMenu = () => {
deleteMenuApi(menuID) deleteMenuApi(menuID)
...@@ -359,45 +461,18 @@ const SevenParams = () => { ...@@ -359,45 +461,18 @@ const SevenParams = () => {
showLine={{ showLeafIcon: false }} showLine={{ showLeafIcon: false }}
defaultExpandAll="true" defaultExpandAll="true"
// selectedKeys={[currentSelectMenu]} // selectedKeys={[currentSelectMenu]}
// onSelect={onSelect} onSelect={onSelect}
treeData={treeData.map(t => mapTree(t))} treeData={treeData.map(t => mapTree(t))}
/> />
</Spin> </Spin>
)} )}
</div> </div>
<div className={styles.previewContainer}>123</div> <div className={styles.editContainer}>
{/* 必填项提示 */} <Form
<Modal form={editMenuForm}
title="提示" labelCol={{ span: 4 }}
visible={tipVisible} wrapperCol={{ span: 19 }}
onCancel={() => setTipVisible(false)}
width="300px"
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 <Form.Item
name="menuName" name="menuName"
label="菜单名称" label="菜单名称"
...@@ -419,93 +494,46 @@ const SevenParams = () => { ...@@ -419,93 +494,46 @@ const SevenParams = () => {
> >
<Input placeholder="请输入菜单图标" /> <Input placeholder="请输入菜单图标" />
</Form.Item> </Form.Item>
<Form.Item
name="imageUrl"
label="菜单图标"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入菜单图标" />
</Form.Item>
<Form.Item label="图标预览"> <Form.Item label="图标预览">
<PicturesWall maxLen={3} /> <PicturesWall maxLen={3} />
</Form.Item> </Form.Item>
<Form.Item name="funParam" label="功能参数"> {nodeType === 1 && (
<Input placeholder="请输入功能参数" /> <>
</Form.Item>
</Form>
<ListCardItem
itemid="1"
key="1"
userList={rolelist}
OUName="关联角色"
getValueCallback={getRoleValueCallback}
/>
</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 <Form.Item
name="imageUrl" name="offlineImgUrl"
label={menuLabel} label="离线图标"
rules={[{ required: true, message: '不能为空' }]} rules={[{ required: true, message: '不能为空' }]}
> >
<Input placeholder="请输入菜单图标" /> <Input placeholder="请输入离线图标" />
</Form.Item> </Form.Item>
<Form.Item label="图标预览"> <Form.Item label="图标预览">
<PicturesWall maxLen={3} /> <PicturesWall maxLen={3} />
</Form.Item> </Form.Item>
{/* 添加菜单组，label名称为在线图标才有离线图标 */} </>
{menuLabel === '在线图标' && ( )}
{nodeType === 3 && (
<>
<Form.Item <Form.Item
name="offlineImgUrl" name="pageUrl"
label="离线图标" label="功能路径"
rules={[{ required: true, message: '不能为空' }]} rules={[{ required: true, message: '不能为空' }]}
> >
<Input placeholder="请输入离线图标" /> <Input placeholder="请输入功能路径" />
</Form.Item> </Form.Item>
</>
)} )}
<Form.Item label="图标预览">
<PicturesWall maxLen={3} />
</Form.Item>
<Form.Item name="funParam" label="功能参数"> <Form.Item name="funParam" label="功能参数">
<Input placeholder="请输入功能参数" /> <Input placeholder="请输入功能参数" />
</Form.Item> </Form.Item>
<Form.Item wrapperCol={{ offset: 12 }}>
<Button key="back" type="primary" onClick={() => submitEditMenu()}>
提交
</Button>
</Form.Item>
</Form> </Form>
</Modal> </div>
{/* 删除菜单 */} <div className={styles.previewContainer}>界面预览</div>
<Modal {/* 必填项提示 */}
title={menuTitle}
visible={deleteMenuVisible}
onOk={submitDeleteMenu}
onCancel={() => setDeleteMenuVisible(false)}
okText="确认"
cancelText="取消"
centered
>
<span>确定删除？</span>
</Modal>
</div> </div>
); );
}; };
......
src/pages/appConfig/AppMenu.less
View file @ 03d16e7a
.contentContainer{ .contentContainer{
// min-height: calc(100vh - 194px); // min-height: calc(100vh - 194px);
overflow-x: auto;
display: flex; display: flex;
.menuContainer{ .menuContainer{
min-width: 300px; min-width: 300px;
border:1px solid #abaeb1; border:1px solid #abaeb1;
min-height:calc(100vh - 300px); // min-height:calc(100vh - 300px);
overflow-y:auto; overflow-y:auto;
.ant-tree-list{ .ant-tree-list{
padding: 10px; padding: 10px;
height:calc(100vh - 300px); height:calc(100vh - 330px);
.ant-tree-switcher{ .ant-tree-switcher{
line-height: 1; line-height: 1;
color:#1890FF; color:#1890FF;
...@@ -19,11 +20,23 @@ ...@@ -19,11 +20,23 @@
} }
} }
} }
.previewContainer{ .editContainer{
margin-left: 12px; margin-left: 12px;
flex: 1; flex: 1;
padding: 16px;
float: left; float: left;
// background: white; min-width: 500px;
border:1px solid #abaeb1;
.ant-table-pagination-right{
padding-right: 12px;
}
}
.previewContainer{
margin-left: 12px;
// flex: 1;
float: left;
min-width: 400px;
border:1px solid #abaeb1;
.ant-table-pagination-right{ .ant-table-pagination-right{
padding-right: 12px; padding-right: 12px;
} }
...@@ -54,15 +67,3 @@ ...@@ -54,15 +67,3 @@
color: red; color: red;
cursor: pointer; cursor: pointer;
} }
\ No newline at end of file
// .ant-modal-root{
// .ant-tree-switcher{
// line-height: 1;
// color:#1890FF;
// }
// }
// .menuContainer{
// width: 300px;
// padding: 10px;
// background: #1890FF;
// }
\ No newline at end of file
src/pages/appConfig/SevenParams.js
View file @ 03d16e7a
...@@ -206,9 +206,9 @@ const SevenParams = () => { ...@@ -206,9 +206,9 @@ const SevenParams = () => {
return ( return (
<Form <Form
form={sevenForm} form={sevenForm}
labelCol={{ span: 4, offset: 4 }} labelCol={{ span: 2, offset: 2 }}
wrapperCol={{ span: 16, offset: 1 }} wrapperCol={{ span: 16, offset: 1 }}
style={{ width: '900px' }} style={{ height: 'calc(100vh - 300px)' }}
onFinish={submitSevenParams} onFinish={submitSevenParams}
initialValues={{ ellipseType: '1', transType: '1' }} initialValues={{ ellipseType: '1', transType: '1' }}
> >
...@@ -324,14 +324,7 @@ const SevenParams = () => { ...@@ -324,14 +324,7 @@ const SevenParams = () => {
</Form.Item> </Form.Item>
</> </>
)} )}
<Form.Item <Form.Item wrapperCol={{ offset: 12 }}>
wrapperCol={{
sm: {
span: 16,
offset: 16,
},
}}
>
<Button type="primary" htmlType="submit"> <Button type="primary" htmlType="submit">
提交 提交
</Button> </Button>
......
src/pages/mobileConfig/SiteConfig.jsx
View file @ 03d16e7a
...@@ -101,7 +101,7 @@ const SiteConfig = props => { ...@@ -101,7 +101,7 @@ const SiteConfig = props => {
</Item> </Item>
<Item label="系统图标预览："> <Item label="系统图标预览：">
<PicturesWall maxLen={3} /> <PicturesWall />
</Item> </Item>
<Item <Item
label="登陆页面：" label="登陆页面："
......
src/pages/mobileConfig/menuconfig/LeftPart.jsx 0 → 100644
View file @ 03d16e7a
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,
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 LeftPart = () => {
const [treeLoading, setTreeLoading] = useState(true);
const [treeData, setTreeData] = useState([]); // 菜单树
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 [editMenuVisible, setEditMenuVisible] = useState(false);
const [deleteMenuVisible, setDeleteMenuVisible] = useState(false);
const [addMenuForm] = Form.useForm();
const [addMenuGroupForm] = Form.useForm();
const getRoleValueCallback = useCallback((value, index) => {
roleValueList[index] = value;
setRoleValueList({ ...roleValueList });
}, []);
// 获取菜单树
useEffect(() => {
updateTrees();
}, []);
const updateTrees = () => {
setTreeLoading(true);
getTree()
.then(res => {
if (res.length > 0) {
setTreeLoading(false);
setTreeData(res[0].children[0].children[2].children);
console.log(res[0].children[0].children[2].children);
}
})
.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>
<Tooltip title="添加菜单组">
<EditTwoTone
onClick={() => editMenuGroup(menu, '在线图标')}
/>
</Tooltip>
</>
)}
{menu.menuType === 'MiniAppMenuGroupTwo' && (
<>
<Tooltip title="添加菜单">
<FileAddTwoTone onClick={() => addMenu(menu)} />
</Tooltip>
<Tooltip title="编辑菜单组">
<EditTwoTone
onClick={() => editMenuGroup(menu, '分组图标')}
/>
</Tooltip>
</>
)}
{menu.menuType === 'MiniAppMenuThree' && (
<>
<Tooltip title="编辑菜单">
<EditTwoTone onClick={() => editMenu(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 addMenu = menu => {
setAddMenuVisible(true);
setMenuTitle(`在${menu.text}下添加菜单`);
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 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={[currentSelectMenu]}
// onSelect={onSelect}
treeData={treeData.map(t => mapTree(t))}
/>
</Spin>
)}
</div>
{/* 必填项提示 */}
<Modal
title="提示"
visible={tipVisible}
onCancel={() => setTipVisible(false)}
width="300px"
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="imageUrl"
label="菜单图标"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入菜单图标" />
</Form.Item>
<Form.Item label="图标预览">
<PicturesWall maxLen={3} />
</Form.Item>
<Form.Item name="funParam" label="功能参数">
<Input placeholder="请输入功能参数" />
</Form.Item>
</Form>
<ListCardItem
itemid="1"
key="1"
userList={rolelist}
OUName="关联角色"
getValueCallback={getRoleValueCallback}
/>
</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={3} />
</Form.Item>
{/* 添加菜单组，label名称为在线图标才有离线图标 */}
{menuLabel === '在线图标' && (
<Form.Item
name="offlineImgUrl"
label="离线图标"
rules={[{ required: true, message: '不能为空' }]}
>
<Input placeholder="请输入离线图标" />
</Form.Item>
)}
<Form.Item label="图标预览">
<PicturesWall maxLen={3} />
</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 LeftPart;
src/pages/mobileConfig/menuconfig/LeftPart.less 0 → 100644
View file @ 03d16e7a
.contentContainer{
// min-height: calc(100vh - 194px);
display: flex;
.menuContainer{
min-width: 300px;
border:1px solid #abaeb1;
min-height:calc(100vh - 300px);
overflow-y:auto;
.ant-tree-list{
padding: 10px;
height:calc(100vh - 300px);
.ant-tree-switcher{
line-height: 1;
color:#1890FF;
}
.ant-tree-iconEle{
line-height: 1.2;
color:#1890FF;
}
}
}
.previewContainer{
margin-left: 12px;
flex: 1;
float: left;
// background: white;
.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;
}
// .ant-modal-root{
// .ant-tree-switcher{
// line-height: 1;
// color:#1890FF;
// }
// }
// .menuContainer{
// width: 300px;
// padding: 10px;
// background: #1890FF;
// }
\ No newline at end of file
src/pages/mobileConfig/menuconfig/MenuConfig.jsx
View file @ 03d16e7a
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import ProCard from '@ant-design/pro-card'; import ProCard from '@ant-design/pro-card';
import AddForm from './AddForm'; import AddForm from './AddForm';
import LeftPart from './LeftPart';
const MenuConfig = props => { const MenuConfig = props => {
const [flag, setFlag] = useState(1); const [flag, setFlag] = useState(1);
return ( return (
<ProCard split="vertical"> <ProCard split="vertical">
<ProCard colSpan="400px"> <ProCard colSpan="400px">
<div style={{ height: '60px', backgroundColor: 'red' }}> a</div> <LeftPart />
</ProCard> </ProCard>
<ProCard> <ProCard>
<AddForm /> <AddForm />
......
src/pages/userCenter/UserManage.js
View file @ 03d16e7a
...@@ -58,7 +58,7 @@ const UserManage = () => { ...@@ -58,7 +58,7 @@ const UserManage = () => {
const [loading, setLoading] = useState(true); const [loading, setLoading] = useState(true);
const [treeData, setTreeData] = useState([]); // 用户机构树 const [treeData, setTreeData] = useState([]); // 用户机构树
const [treeData1, setTreeData1] = useState([]); const [treeData1, setTreeData1] = useState([]); // 用户机构树-备份，供更改机构使用
const [treeData2, setTreeData2] = useState([]); const [treeData2, setTreeData2] = useState([]);
const [tableData, setTableData] = useState([]); // 用户表 const [tableData, setTableData] = useState([]); // 用户表
const [searchData, setSearchData] = useState([]); const [searchData, setSearchData] = useState([]);
......
src/pages/userCenter/roleManage/RoleManage.jsx
View file @ 03d16e7a
...@@ -5,11 +5,13 @@ import { PageContainer, GridContent } from '@ant-design/pro-layout'; ...@@ -5,11 +5,13 @@ import { PageContainer, GridContent } from '@ant-design/pro-layout';
import { import {
getWebModuleTree, getWebModuleTree,
chooseUserToStation, chooseUserToStation,
getUserRelationList,
setMenuToRole,
} from '@/services/userCenter/roleManage/api'; } from '@/services/userCenter/roleManage/api';
import ListCard from '@/pages/orgnazation/ListCard'; import ListCard from '@/components/CheckGroup';
// import ListCard from '@/pages/orgnazation/ListCard';
import qs from 'qs'; import qs from 'qs';
import styles from '@/pages/userCenter/roleManage/RoleManage.less'; import styles from '@/pages/userCenter/roleManage/RoleManage.less';
import { version } from 'less';
import AddModal from './AddModal'; import AddModal from './AddModal';
import DelModal from './DelModal'; import DelModal from './DelModal';
import EditModal from './EditModal'; import EditModal from './EditModal';
...@@ -39,31 +41,43 @@ const SiteManage = () => { ...@@ -39,31 +41,43 @@ const SiteManage = () => {
setOuid(saveTreeId); setOuid(saveTreeId);
} }
}; };
// useEffect(() => {
// setSpinLoading(true);
// getWebModuleTree({
// userMode: 'super',
// select: '',
// _version: 9999,
// _dc: Date.now(),
// node: -2,
// })
// .then(res => {
// setSpinLoading(false);
// let arr = [];
// if (res) {
// arr.push(res.find(item => item.id === 'Web4StationRoot'));
// console.log(arr, 'arr');
// }
// let arr2 = transTree(arr);
// setTreeData(arr2);
// })
// .catch(err => {
// setSpinLoading(false);
// console.error(err);
// });
// }, [flag]);
useEffect(() => { useEffect(() => {
setSpinLoading(true); getUserRelationList({
getWebModuleTree({ userID: 82,
userMode: 'super',
select: '',
_version: 9999, _version: 9999,
_dc: Date.now(), _dc: Date.now(),
node: -2, }).then(res => {
}) let arr = res.roleList;
.then(res => { let arr2 = transTree2(arr);
setSpinLoading(false); console.log(arr2, 'arr2');
let arr = [];
if (res) {
arr.push(res.find(item => item.id === 'Web4StationRoot'));
console.log(arr, 'arr');
}
let arr2 = transTree(arr);
setTreeData(arr2); setTreeData(arr2);
})
.catch(err => {
setSpinLoading(false);
console.error(err);
}); });
}, [flag]); }, []);
const Title = props => { const Title = props => {
const { text } = props; const { text } = props;
console.log(props); console.log(props);
...@@ -111,25 +125,46 @@ const SiteManage = () => { ...@@ -111,25 +125,46 @@ const SiteManage = () => {
setEditVisible(true); setEditVisible(true);
}; };
// 树形数据转换 // 树形数据转换
const transTree = val => { // const transTree = val => {
console.log(val); // console.log(val);
// let arr = val;
// return arr.map((item, index) => {
// item.title = Title(item) || item.text;
// item.key = item.stationID || '';
// let obj = {};
// if (Array.isArray(item.children) && item.children.length > 0) {
// transTree(item.children);
// obj = item;
// return obj;
// }
// return item;
// });
// };
const transTree2 = val => {
let arr = val; let arr = val;
return arr.map((item, index) => { console.log(arr, 'arr');
item.title = Title(item) || item.text; let arr2 = arr.map((item, index) => {
item.key = item.stationID || ''; item.title = item.visibleTitle;
let obj = {}; item.key = item.visibleValue;
if (Array.isArray(item.children) && item.children.length > 0) { if (item.roleList && item.roleList.length > 0) {
transTree(item.children); item.roleList.map(child => {
obj = item; child.title = child.roleName;
return obj; child.key = child.roleID;
});
} }
item.children = item.roleList;
return item; return item;
}); });
return arr2;
}; };
// 获取搜索框的值 // 获取搜索框的值
const handleSearch = value => { const handleSearch = value => {
setSearchWord(value); setSearchWord(value);
}; };
const handleChange = e => {
const { value } = e.target;
setSearchWord(value);
};
const confirmModal = e => { const confirmModal = e => {
setModalVisible(false); setModalVisible(false);
setFlag(flag + 1); setFlag(flag + 1);
...@@ -147,10 +182,10 @@ const SiteManage = () => { ...@@ -147,10 +182,10 @@ const SiteManage = () => {
}; };
const handleCommit = value => { const handleCommit = value => {
let arr = Object.values(subList); let arr = Object.values(subList);
chooseUserToStation( setMenuToRole(
qs.stringify({ qs.stringify({
userList: String(arr.flat()), roleID: ouid,
stationID: ouid, menuNameList: String(arr.flat()),
}), }),
{ {
headers: { headers: {
...@@ -193,6 +228,7 @@ const SiteManage = () => { ...@@ -193,6 +228,7 @@ const SiteManage = () => {
showIcon showIcon
onSelect={e => handleTreeSelect(e)} onSelect={e => handleTreeSelect(e)}
treeData={treeData} treeData={treeData}
blockNode
/> />
</Spin> </Spin>
<AddModal <AddModal
...@@ -223,6 +259,7 @@ const SiteManage = () => { ...@@ -223,6 +259,7 @@ const SiteManage = () => {
allowClear allowClear
placeholder={placeholder} placeholder={placeholder}
onSearch={handleSearch} onSearch={handleSearch}
onChange={handleChange}
enterButton enterButton
/> />
</Col> </Col>
......
src/services/appConfig/api.js
View file @ 03d16e7a
...@@ -76,7 +76,6 @@ export const addMenuGroupApi = ( ...@@ -76,7 +76,6 @@ export const addMenuGroupApi = (
subSystemValue: 'miniapp', subSystemValue: 'miniapp',
relatedRoleList: '', relatedRoleList: '',
}); });
// 获取角色列表 // 获取角色列表
export const getRoleList = () => export const getRoleList = () =>
get(`/Cityinterface/rest/services/OMS.svc/P_GetRoleListPlain`, { get(`/Cityinterface/rest/services/OMS.svc/P_GetRoleListPlain`, {
...@@ -84,14 +83,17 @@ export const getRoleList = () => ...@@ -84,14 +83,17 @@ export const getRoleList = () =>
_dc: new Date().getTime(), _dc: new Date().getTime(),
subSystemValue: 'miniapp', subSystemValue: 'miniapp',
}); });
// 获取菜单 // 编辑-获取菜单
export const getMenuInfo = id => export const getMenuInfo = id =>
get(`/Cityinterface/rest/services/OMS.svc/Mini_GetMenuInfo`, { get(`/Cityinterface/rest/services/OMS.svc/Mini_GetMenuInfo`, {
_version: 9999, _version: 9999,
_dc: new Date().getTime(), _dc: new Date().getTime(),
menuID: id, menuID: id,
}); });
// 获取菜单 // 编辑-提交菜单
export const submitMenuInfo = params =>
get(`/Cityinterface/rest/services/OMS.svc/MiniApp_EditMenu`, params);
// 删除菜单
export const deleteMenuApi = id => export const deleteMenuApi = id =>
get(`/Cityinterface/rest/services/OMS.svc/MiniApp_DeleteMenu`, { get(`/Cityinterface/rest/services/OMS.svc/MiniApp_DeleteMenu`, {
_version: 9999, _version: 9999,
......
src/services/userCenter/RoleManage/api.js
View file @ 03d16e7a
...@@ -24,4 +24,12 @@ export const chooseUserToStation = (params, options) => ...@@ -24,4 +24,12 @@ export const chooseUserToStation = (params, options) =>
// 获取所有角色信息 // 获取所有角色信息
export const getUserRelationList = params => export const getUserRelationList = params =>
get('Cityinterface/rest/services/OMS.svc/W4_GetUserRelationList', params); get('/Cityinterface/rest/services/OMS.svc/W4_GetUserRelationList', params);
// 角色管理保存选择
export const setMenuToRole = (params, options) =>
post(
'/Cityinterface/rest/services/OMS.svc/P_SetMenuToRole?_version: 9999',
params,
options,
);
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment