Skip to content

W
WebPublic
提交 2166b56d authored 作者: 钟是志's avatar 钟是志
浏览文件
操作

一站式应用授权 树形 列表

上级 32701bfc
隐藏空白字符变更
内嵌 并排
正在显示 包含 630 行增加 和 101 行删除
Services.js
浏览文件 @ 2166b56d
...@@ -116,6 +116,13 @@ export const getAppTypeList = () => { ...@@ -116,6 +116,13 @@ export const getAppTypeList = () => {
}); });
}; };
/**
*
* 用于一站式 应用树形列表 tree
*/
export const getListByTreeList = (params = {}) => {
return uaaRequest('/UnifiedAppApi/getListByTree', params);
};
export function getOnestopKey(key = '', formKey = 'key_list', formValue = 'value_list') { export function getOnestopKey(key = '', formKey = 'key_list', formValue = 'value_list') {
return fetchTableData({ return fetchTableData({
......
zyd_private/OneStopAppManage/AppTypeTree.js
浏览文件 @ 2166b56d
...@@ -7,9 +7,10 @@ ...@@ -7,9 +7,10 @@
import { Tree } from 'antd'; import { Tree } from 'antd';
import React, { Component, Fragment } from 'react'; import React, { Component, Fragment } from 'react';
import Shell from '@/baseComponent/Shell'; import Shell from '@/baseComponent/Shell';
import { getAppTypeList } from '@/webPublic/Services'; import { getAppTypeList, getListByTreeList } from '@/webPublic/Services';
import { getPermInfo } from '@/highOrderComponent/Service'; import { getPermInfo } from '@/highOrderComponent/Service';
import { connect } from 'dva'; import { connect } from 'dva';
import { deepCopy } from '@/webPublic/zyd_public/utils/utils';
const { TreeNode } = Tree; const { TreeNode } = Tree;
...@@ -19,20 +20,66 @@ const { TreeNode } = Tree; ...@@ -19,20 +20,66 @@ const { TreeNode } = Tree;
export default class AppTypeTree extends Component { export default class AppTypeTree extends Component {
constructor() { constructor() {
super(); super();
this.state = { this.state = {
treeListData: [], treeListData: [],
initYear: 0, initYear: 0,
}; };
} }
handleChange = (newSearch) => { handleChange = (newSearch) => {
this.props.changeSearch(newSearch); this.props.changeSearch(newSearch);
}; };
pushChildrenData = (treeListData, data, parentId) => {
for (let item of treeListData) {
if (item.id === parentId) {
item.children = data;
this.setState({
treeListData: deepCopy(treeListData),
});
break;
} else if (item.children && item.children.length) {
this.pushChildrenData(item.children, data, parentId);
}
}
};
getLeafData = (parentId) => {
const { groupId } = this.props;
if (!groupId) {
return null;
}
getListByTreeList(
{
parentId,
groupId,
cacheKey: Math.random(),
},
).then((res) => {
for (let item of res) {
if (!item.isLeaf) {
this.getLeafData(item.id);
}
}
if (res.length) {
this.pushChildrenData(this.state.treeListData, res, parentId);
}
});
};
getList = () => { getList = () => {
getPermInfo({ const { groupId } = this.props;
sysCode: this.props.sysCode, const { parentId } = this.state;
},'/PermApi/getRoleList').then((treeListData) => { if (!groupId) {
return null;
}
getListByTreeList(
{
parentId,
groupId,
cacheKey: Math.random(),
},
).then((treeListData) => {
if (!treeListData || !treeListData.length) { if (!treeListData || !treeListData.length) {
this.setState({ this.setState({
treeListData: [], treeListData: [],
...@@ -42,6 +89,11 @@ export default class AppTypeTree extends Component { ...@@ -42,6 +89,11 @@ export default class AppTypeTree extends Component {
selectKey: '', selectKey: '',
}); });
} else { } else {
for (let item of treeListData) {
if (!item.isLeaf) {
this.getLeafData(item.id);
}
}
this.handleChange({ this.handleChange({
selectKey: treeListData[0].id + '', selectKey: treeListData[0].id + '',
}); });
...@@ -54,35 +106,44 @@ export default class AppTypeTree extends Component { ...@@ -54,35 +106,44 @@ export default class AppTypeTree extends Component {
}); });
} }
}); });
}; setTimeout(() => {
if (document.getElementById('list-table-dom')) {
let tableDom = document.getElementById('list-table-dom');
this.setState({
heightSet:
document.body.clientHeight - 150 > tableDom.offsetHeight + 164
? document.body.clientHeight - 150
: tableDom.offsetHeight + 164,
});
}
}, 1000);
};
componentDidMount() { componentDidMount() {
this.getList(); this.getList();
setTimeout(() => {
if (document.getElementById('list-table-dom')) {
let tableDom = document.getElementById('list-table-dom');
this.setState({
heightSet:
document.body.clientHeight - 150 > tableDom.offsetHeight + 164
? document.body.clientHeight - 150
: tableDom.offsetHeight + 164,
});
}
}, 1000);
}
onSelect = (selectedKeys, info) => { }
this.handleChange({
year: this.props.year, componentDidUpdate(prevProps, prevState) {
selectKey: selectedKeys[0], if (prevProps.groupId !== this.props.groupId) {
}); this.getList();
}; }
}
onSelect = (selectedKeys, info) => {
this.handleChange({
year: this.props.year,
selectKey: selectedKeys[0],
});
};
treeNodeList = (data) => { treeNodeList = (data) => {
let dom = data.map((item) => { let dom = data.map((item) => {
return ( return (
<TreeNode title={item.title} <TreeNode title={item.title}
isLeaf={item.isLeaf}
key={item.id}> key={item.id}>
{item.children && this.treeNodeList(item.children)}
</TreeNode> </TreeNode>
); );
}); });
......
zyd_private/OneStopAppManage/index.js
浏览文件 @ 2166b56d
...@@ -20,32 +20,42 @@ const Index = (WrappedComponent) => ...@@ -20,32 +20,42 @@ const Index = (WrappedComponent) =>
constructor(props) { constructor(props) {
super(props); super(props);
this.state = { this.state = {
search: { search: {
selectKey: '', selectKey: '',
}, },
typeList: [], formValues: {
authorizedApp: [], selectType: 'getAllRole',
}; sysCode: 'xg',
} },
typeList: [],
authorizedApp: [],
};
}
getAuthorizedApp = () => { changeFormValues = (formValues) => {
const { selectKey } = this.state.search; this.setState({
if (selectKey) { formValues,
getInfo( });
{ };
roleId: selectKey,
cacheKey: Math.random(), getAuthorizedApp = () => {
}, const { selectKey } = this.state.search;
'/CommonApi/queryRoleApply', if (selectKey) {
).then((x) => { getInfo(
if (x) { {
this.setState({ roleId: selectKey,
authorizedApp: x, cacheKey: Math.random(),
}); },
} '/CommonApi/queryRoleApply',
}); ).then((x) => {
this.instanceComponent.getPage(); if (x) {
} this.setState({
authorizedApp: x,
});
}
});
// this.instanceComponent.getPage();
}
}; };
changeSearch = (search) => { changeSearch = (search) => {
...@@ -54,47 +64,63 @@ const Index = (WrappedComponent) => ...@@ -54,47 +64,63 @@ const Index = (WrappedComponent) =>
search, search,
}, },
() => { () => {
this.getAuthorizedApp(); // this.getAuthorizedApp();
}, },
); );
}; };
componentDidMount() { componentDidMount() {
getAppTypeList().then((treeListData) => { const { formValues } = this.state;
if (!treeListData) { getAppTypeList().then((treeListData) => {
return false; if (!treeListData) {
} return false;
this.setState({ }
typeList: treeListData.map((x) => { const data = treeListData.filter((y) => {
return { return y.appNum > 0;
key: x.id, }).map((x) => {
name: x.name + `(${x.appNum})`, return {
}; key: x.id,
}), name: x.name + `(${x.appNum})`,
}); };
}); });
this.setState({
typeList: data,
}, () => {
this.setState({
formValues: {
...formValues,
groupId: this.state.typeList[0].key,
},
});
});
});
return true; return true;
} }
render() { render() {
const { search, typeList, authorizedApp } = this.state; const { search, typeList, authorizedApp, formValues } = this.state;
if (!typeList.length) { if (!typeList.length || !formValues.groupId) {
return null; return null;
} }
const pageS = pageSearch({ typeList, authorizedApp }); const pageS = pageSearch({
const pageB = pageButton({ typeList,
roleId: search.selectKey, authorizedApp,
authorizedApp, changeFormValues: this.changeFormValues,
getAuthorizedApp: this.getAuthorizedApp, });
}); const pageB = pageButton({
return ( roleId: search.selectKey,
<PageHeaderWrapper title=""> authorizedApp,
<Row> // getAuthorizedApp: this.getAuthorizedApp,
<Col xl={5} xxl={4}> });
<AppTypeTree return (
changeSearch={this.changeSearch} <PageHeaderWrapper title="">
selectKey={search.selectKey} <Row>
year={search.year} <Col xl={5} xxl={4}>
<AppTypeTree
changeSearch={this.changeSearch}
selectKey={search.selectKey}
year={search.year}
groupId={formValues.groupId}
/> />
</Col> </Col>
<Col xl={19} xxl={20}> <Col xl={19} xxl={20}>
......
zyd_private/OneStopAppManage/pageButton.js
浏览文件 @ 2166b56d
...@@ -41,7 +41,7 @@ const handleButton = (props) => { ...@@ -41,7 +41,7 @@ const handleButton = (props) => {
component: 'Normal', component: 'Normal',
handleClick: (selectRows, formValues, getPage, search) => { handleClick: (selectRows, formValues, getPage, search) => {
submitData(selectRows, props.roleId).then((x) => { submitData(selectRows, props.roleId).then((x) => {
props.getAuthorizedApp(); // props.getAuthorizedApp();
}); });
}, },
}, },
...@@ -64,7 +64,7 @@ const handleButton = (props) => { ...@@ -64,7 +64,7 @@ const handleButton = (props) => {
} }
} }
deleteData(deleteIds, props.roleId).then((x) => { deleteData(deleteIds, props.roleId).then((x) => {
props.getAuthorizedApp(); // props.getAuthorizedApp();
}); });
}, },
}, },
......
zyd_private/OneStopAppManage/pageSearch.js
浏览文件 @ 2166b56d
...@@ -4,6 +4,7 @@ import React, { Fragment } from 'react'; ...@@ -4,6 +4,7 @@ import React, { Fragment } from 'react';
import { getAppList } from '@/webPublic/Services'; import { getAppList } from '@/webPublic/Services';
import { redText } from '@/pages/zydxg/CheckManage/PiciSetting/publicFunc'; import { redText } from '@/pages/zydxg/CheckManage/PiciSetting/publicFunc';
const width = 110; const width = 110;
const handlePageSearch = (props) => { const handlePageSearch = (props) => {
const pageSearch = { const pageSearch = {
...@@ -14,27 +15,72 @@ const handlePageSearch = (props) => { ...@@ -14,27 +15,72 @@ const handlePageSearch = (props) => {
required: true, required: true,
defaultValue: props.typeList[0].key, defaultValue: props.typeList[0].key,
}, },
sysCode: {
required: true,
defaultValue: 'xg',
},
selectType: {
required: true,
defaultValue: 'getAllRole',
},
}, },
getInfo: (data, url) => { getInfo: (data, url) => {
return getAppList(data); return getAppList(data, props.formValues);
}, },
giveFieldsToFormValues: true, giveFieldsToFormValues: true,
afterFormValuesChange: (key, oldValue, getPage) => { afterFormValuesChange: (key, oldValue, getPage) => {
getPage(); props.changeFormValues(oldValue);
}, },
responseCallBack: (response) => { responseCallBack: (response) => {
return response; return response;
}, },
condition: [ condition: [
{
key: 'sysCode',
type: 'select',
required: true,
options: [
{ key: 'xg', name: '学工' },
{ key: 'sg', name: '宿管' },
{ key: 'jy', name: '就业' },
{ key: 'yx', name: '迎新' },
{ key: 'zs', name: '招生' },
{ key: 'xljk', name: '心理健康' },
{ key: 'uaa', name: '认证系统' },
{ key: 'lx', name: '离校' },
{ key: 'tw', name: '团委' },
{ key: 'szxf', name: '素质学分' },
],
name: '系统',
},
{ // /PermApi/getAllRole
key: 'selectType',
type: 'radioGroup',
required: true,
name: '权限分类',
options: [
{
key: 'getAllRole',
name: '角色',
},
{
key: 'getUserGroupList',
name: '分组',
},
],
},
{ {
key: 'groupId', key: 'groupId',
name: '类别', name: '类别',
type: 'radioGroup', type: 'select',
options: props.typeList, options: props.typeList,
required: true,
}, },
], ],
nameSpan: { big: 2, small: 4 }, nameSpan: { big: 6, small: 7 },
fileSpan: { big: 2, small: 2 }, fileSpan: { big: 4, small: 4 },
noNeedReset: true, // 不需要重置按钮
}, },
tableRowKey: 'id', tableRowKey: 'id',
columns: [ columns: [
......
zyd_private/OneStopAppManageOld/AppTypeTree.js 0 → 100644
浏览文件 @ 2166b56d
/**
* 钟是志
* 2019年3月29日
* 一个年份加上校区-学院-专业的树
* */
import { Tree } from 'antd';
import React, { Component, Fragment } from 'react';
import Shell from '@/baseComponent/Shell';
import { getAppTypeList } from '@/webPublic/Services';
import { getPermInfo } from '@/highOrderComponent/Service';
import { connect } from 'dva';
const { TreeNode } = Tree;
@connect(({ global }) => ({
sysCode: global.system.sysCode,
}))
export default class AppTypeTree extends Component {
constructor() {
super();
this.state = {
treeListData: [],
initYear: 0,
};
}
handleChange = (newSearch) => {
this.props.changeSearch(newSearch);
};
getList = () => {
getPermInfo({
sysCode: this.props.sysCode,
}, '/PermApi/getRoleList').then((treeListData) => {
if (!treeListData || !treeListData.length) {
this.setState({
treeListData: [],
loading: false,
});
this.handleChange({
selectKey: '',
});
} else {
this.handleChange({
selectKey: treeListData[0].id + '',
});
this.handleChange({
selectKey: treeListData[0].id + '',
});
this.setState({
treeListData,
loading: false,
});
}
});
};
componentDidMount() {
this.getList();
setTimeout(() => {
if (document.getElementById('list-table-dom')) {
let tableDom = document.getElementById('list-table-dom');
this.setState({
heightSet:
document.body.clientHeight - 150 > tableDom.offsetHeight + 164
? document.body.clientHeight - 150
: tableDom.offsetHeight + 164,
});
}
}, 1000);
}
onSelect = (selectedKeys, info) => {
this.handleChange({
year: this.props.year,
selectKey: selectedKeys[0],
});
};
treeNodeList = (data) => {
let dom = data.map((item) => {
return (
<TreeNode title={item.title}
key={item.id}>
</TreeNode>
);
});
return dom;
};
render() {
const { treeListData, loading, heightSet } = this.state;
const { selectKey } = this.props;
return (
<Fragment>
<Shell
styleShell={{
borderRight: '1px solid rgba(210,210,210,1)',
minHeight: heightSet || document.body.clientHeight - 150,
backgroundColor: '#fff',
overflowX: 'auto',
marginTop: 0,
}}>
<Tree
onSelect={this.onSelect}
selectedKeys={[selectKey]}
style={{ minHeight: '400px,' }}
disabled={loading}>
{this.treeNodeList(treeListData)}
</Tree>
</Shell>
</Fragment>
);
}
}
zyd_private/OneStopAppManageOld/index.js 0 → 100644
浏览文件 @ 2166b56d
/**
* 钟是志
* 2020年5月13日 17:38:51
* 一站式应用 学工角色授权
* */
import pageSetting from './pageSetting';
import pageSearch from './pageSearch';
import pageButton from './pageButton';
import PageHeaderWrapper from '@/components/PageHeaderWrapper';
import { Row, Col } from 'antd';
import React from 'react';
import List from '@/highOrderComponent/List';
import AppTypeTree from './AppTypeTree';
import { getAppTypeList } from '@/webPublic/Services';
import { getInfo } from '@/highOrderComponent/Service';
const Index = (WrappedComponent) =>
class extends WrappedComponent {
constructor(props) {
super(props);
this.state = {
search: {
selectKey: '',
},
typeList: [],
authorizedApp: [],
};
}
getAuthorizedApp = () => {
const { selectKey } = this.state.search;
if (selectKey) {
getInfo(
{
roleId: selectKey,
cacheKey: Math.random(),
},
'/CommonApi/queryRoleApply',
).then((x) => {
if (x) {
this.setState({
authorizedApp: x,
});
}
});
this.instanceComponent.getPage();
}
};
changeSearch = (search) => {
this.setState(
{
search,
},
() => {
this.getAuthorizedApp();
},
);
};
componentDidMount() {
getAppTypeList().then((treeListData) => {
if (!treeListData) {
return false;
}
this.setState({
typeList: treeListData.map((x) => {
return {
key: x.id,
name: x.name + `(${x.appNum})`,
};
}),
});
});
return true;
}
render() {
const { search, typeList, authorizedApp } = this.state;
if (!typeList.length) {
return null;
}
const pageS = pageSearch({ typeList, authorizedApp });
const pageB = pageButton({
roleId: search.selectKey,
authorizedApp,
getAuthorizedApp: this.getAuthorizedApp,
});
return (
<PageHeaderWrapper title="">
<Row>
<Col xl={5} xxl={4}>
<AppTypeTree
changeSearch={this.changeSearch}
selectKey={search.selectKey}
year={search.year}
/>
</Col>
<Col xl={19} xxl={20}>
<WrappedComponent
listConfig={pageSetting.listConfig}
pageButton={pageB}
ref={(instanceComponent) => (this.instanceComponent = instanceComponent)}
pageSearch={pageS}
/>
</Col>
</Row>
</PageHeaderWrapper>
);
}
};
export default Index(List); // 高阶组件
zyd_private/OneStopAppManageOld/pageButton.js 0 → 100644
浏览文件 @ 2166b56d
import React from 'react';
import { message } from 'antd';
import { getInfo } from '@/highOrderComponent/Service';
const submitData = (selectRows, roleId) => {
if (!selectRows.length) {
message.warning('请先选择一个应用');
return false;
} else {
let content = selectRows.map((x) => {
return {
appId: x.id,
roleId,
};
});
content = JSON.stringify(content);
const data = {
roleId,
op: 'add',
content,
};
return getInfo(data, '/CommonApi/configRoleApply');
}
};
const deleteData = (ids, roleId) => {
const data = {
ids,
roleId,
op: 'delete',
};
return getInfo(data, '/CommonApi/configRoleApply');
};
const handleButton = (props) => {
const buttonConfig = [
{
name: '批量授权',
type: 'Normal',
component: 'Normal',
handleClick: (selectRows, formValues, getPage, search) => {
submitData(selectRows, props.roleId).then((x) => {
props.getAuthorizedApp();
});
},
},
{
name: '批量取消授权',
type: 'Normal222',
component: 'Normal',
handleClick: (selectRows, formValues, getPage, search) => {
if (!selectRows.length) {
message.warning('请先选择一个应用');
return false;
}
const deleteIds = [];
for (let item of selectRows) {
for (let x of props.authorizedApp) {
if (x.appId === item.id) {
deleteIds.push(x.id);
}
}
}
deleteData(deleteIds, props.roleId).then((x) => {
props.getAuthorizedApp();
});
},
},
];
return buttonConfig;
};
export default handleButton;
zyd_private/OneStopAppManageOld/pageSearch.js 0 → 100644
浏览文件 @ 2166b56d
import moment from 'moment';
import { Link } from 'react-router-dom';
import React, { Fragment } from 'react';
import { getAppList } from '@/webPublic/Services';
import { redText } from '@/pages/zydxg/CheckManage/PiciSetting/publicFunc';
const width = 110;
const handlePageSearch = (props) => {
const pageSearch = {
search: {
url: '/asdasd/asdgggki',
field: {
groupId: { //
required: true,
defaultValue: props.typeList[0].key,
},
},
getInfo: (data, url) => {
return getAppList(data);
},
giveFieldsToFormValues: true,
afterFormValuesChange: (key, oldValue, getPage) => {
getPage();
},
responseCallBack: (response) => {
return response;
},
condition: [
{
key: 'groupId',
name: '类别',
type: 'radioGroup',
options: props.typeList,
},
],
nameSpan: { big: 2, small: 4 },
fileSpan: { big: 2, small: 2 },
},
tableRowKey: 'id',
columns: [
{
dataIndex: 'groupName',
title: '类别',
width,
},
{
dataIndex: 'name',
title: '应用名',
width: width + 150,
},
{
dataIndex: 'isAuthorized',
title: '是否已授权',
render: (text, record) => {
// return '未授权';
const includesIds = props.authorizedApp.map((x) => {
return x.appId;
});
if (record && record.id && includesIds.includes(record.id)) {
return redText('已授权');
} else {
return '未授权';
}
},
},
],
};
return pageSearch;
};
export default handlePageSearch;
zyd_private/OneStopAppManageOld/pageSetting.js 0 → 100644
浏览文件 @ 2166b56d
const pageSetting = {
type: 'list', // 页面类型 list列表 可能包含有其他类型的 比如 detail 详情 add 新增 update 更新 等等 ....
listConfig: {
selectRows: true, // 是否可以行选择,
paging: false, // 是否可以分页,
searchArea: true, // 是否拥有 搜索区dom,
buttonArea: true, // 是否拥有 按钮区,
},
};
export default pageSetting;
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论