336 lines
14 KiB
JavaScript
336 lines
14 KiB
JavaScript
/*
|
|
* 角色详情设置弹窗
|
|
*
|
|
* @Author: 黎永顺
|
|
* @Date: 2024/8/5
|
|
* @Wechat:
|
|
* @Email: 971387674@qq.com
|
|
* @description:
|
|
*/
|
|
import React, { Component } from "react";
|
|
import {
|
|
WeaBrowser,
|
|
WeaDialog,
|
|
WeaFormItem,
|
|
WeaInput,
|
|
WeaLocaleProvider,
|
|
WeaScope,
|
|
WeaSelect,
|
|
WeaTab,
|
|
WeaTable,
|
|
WeaTextarea
|
|
} from "ecCom";
|
|
import { commonEnumList } from "../../../../apis/archive";
|
|
import EditRoleDialog from "./editRoleDialog";
|
|
import AuthTree from "./authTree";
|
|
import * as API from "../../../../apis/taxAgent";
|
|
import { Button, Col, message, Modal, Row } from "antd";
|
|
import "../index.less";
|
|
|
|
const getLabel = WeaLocaleProvider.getLabel;
|
|
const APIFOX = {
|
|
"auth.MemberTargetTypeEnum": API.authMemberList,
|
|
"save.auth.MemberTargetTypeEnum": API.saveAuthMember,
|
|
"delete.auth.MemberTargetTypeEnum": API.deleteAuthMember,
|
|
"sync.auth.MemberTargetTypeEnum": API.syncAuthMember,
|
|
"auth.DataTargetTypeEnum": API.authDataList,
|
|
"save.auth.DataTargetTypeEnum": API.saveAuthData,
|
|
"delete.auth.DataTargetTypeEnum": API.deleteAuthData,
|
|
"sync.auth.DataTargetTypeEnum": API.syncAuthData
|
|
};
|
|
|
|
class Index extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.state = {
|
|
selectedKey: "auth.MemberTargetTypeEnum", name: "", options: [], enumType: "", selectedRowKeys: [],
|
|
replaceDatas: [], loading: { set: false, query: false, async: false, delete: false },
|
|
columns: [], dataSource: [], pageInfo: { current: 1, pageSize: 10, total: 0 },
|
|
editOperatorDialog: { visible: false, linkOptions: [], record: {} }
|
|
};
|
|
}
|
|
|
|
componentWillReceiveProps(nextProps, nextContext) {
|
|
if (nextProps.visible !== this.props.visible && nextProps.visible) {
|
|
this.setState({ name: nextProps.name, selectedKey: "auth.MemberTargetTypeEnum" }, () => {
|
|
this.getEnumList();
|
|
this.getSettingRoler(nextProps.roleId);
|
|
});
|
|
} else {
|
|
this.setState({ selectedRowKeys: [], replaceDatas: [], pageInfo: { current: 1, pageSize: 10, total: 0 } });
|
|
}
|
|
}
|
|
|
|
getEnumList = () => {
|
|
const payload = { enumClass: `com.engine.salary.enums.${this.state.selectedKey}` };
|
|
commonEnumList(payload).then(({ status, data }) => {
|
|
if (status) this.setState({
|
|
options: _.map(data, o => ({ key: o.enum, showname: o.defaultLabel })),
|
|
enumType: _.head(data).enum || ""
|
|
});
|
|
if (!status) this.setState({ options: [], enumType: "" });
|
|
});
|
|
};
|
|
getSettingRoler = (roleId) => {
|
|
const { selectedKey, pageInfo } = this.state;
|
|
this.setState({ loading: { ...this.state.loading, query: true } });
|
|
APIFOX[selectedKey]({ roleId, ...pageInfo }).then(({ status, data }) => {
|
|
this.setState({ loading: { ...this.state.loading, query: false } });
|
|
if (status) {
|
|
const { columns, list: dataSource, pageNum: current, pageSize, total } = data;
|
|
this.setState({
|
|
dataSource, pageInfo: { ...pageInfo, current, pageSize, total },
|
|
columns: [
|
|
...columns, {
|
|
dataIndex: "opt", title: getLabel(111, "操作"), width: 120,
|
|
render: (__, record) => (<a href="javascript:void(0);"
|
|
onClick={() => this.handleEditOperator(record)}>{getLabel(111, "编辑")}</a>)
|
|
}
|
|
]
|
|
});
|
|
}
|
|
});
|
|
};
|
|
handleEditOperator = async (record) => {
|
|
let { selectedKey } = this.state, linkOptions = [];
|
|
if (selectedKey === "auth.DataTargetTypeEnum") {
|
|
const payload = { enumClass: `com.engine.salary.enums.auth.DataLinkEnum` };
|
|
const { data } = await commonEnumList(payload);
|
|
linkOptions = _.map(data, o => ({ key: o.enum, showname: o.defaultLabel }));
|
|
}
|
|
this.setState({ editOperatorDialog: { visible: true, record, linkOptions } });
|
|
};
|
|
addOperatorSettings = () => {
|
|
const { roleId } = this.props;
|
|
const { selectedKey, enumType: targetType, replaceDatas } = this.state;
|
|
if (_.isEmpty(replaceDatas)) {
|
|
Modal.warning({
|
|
title: getLabel(111, "系统提示"),
|
|
content: getLabel(111, "请先选择操作对象的值！")
|
|
});
|
|
return;
|
|
}
|
|
const payload = _.map(replaceDatas, o => ({
|
|
roleId, targetType: o.targetType || targetType, target: o.id || "", targetName: o.name || "",
|
|
link: o.link || "OR", sortedIndex: o.sortedIndex || 0, id: o.editId || ""
|
|
}));
|
|
this.setState({ loading: { ...this.state.loading, set: true } });
|
|
APIFOX[`save.${selectedKey}`](payload).then(({ status, errormsg }) => {
|
|
this.setState({ loading: { ...this.state.loading, set: false } });
|
|
if (status) {
|
|
message.success(getLabel(111, "操作成功！"));
|
|
this.setState({ replaceDatas: [] }, () => this.getSettingRoler(roleId));
|
|
} else {
|
|
message.error(errormsg);
|
|
}
|
|
});
|
|
};
|
|
deleteOperatorSettings = () => {
|
|
const { roleId } = this.props;
|
|
const { selectedKey, selectedRowKeys } = this.state;
|
|
if (_.isEmpty(selectedRowKeys)) {
|
|
Modal.warning({
|
|
title: getLabel(111, "信息确认"),
|
|
content: getLabel(111, "确定要删除所选批次吗？")
|
|
});
|
|
return;
|
|
}
|
|
this.setState({ loading: { ...this.state.loading, delete: true } });
|
|
APIFOX[`delete.${selectedKey}`](selectedRowKeys).then(({ status, errormsg }) => {
|
|
this.setState({ loading: { ...this.state.loading, delete: false } });
|
|
if (status) {
|
|
message.success(getLabel(111, "操作成功！"));
|
|
this.setState({ selectedRowKeys: [] }, () => this.getSettingRoler(roleId));
|
|
} else {
|
|
message.error(errormsg);
|
|
}
|
|
});
|
|
};
|
|
saveAuthOpt = () => {
|
|
const { roleId } = this.props;
|
|
const { state: { checkedKeys } } = this.authTreeRef;
|
|
const payload = {
|
|
roleId, opts: _.reduce(checkedKeys, (pre, cur) => {
|
|
if (cur.indexOf("query") !== -1 || cur.indexOf("admin") !== -1) {
|
|
const [page, opt] = cur.split("-");
|
|
return [...pre, { page, opt }];
|
|
}
|
|
return pre;
|
|
}, [])
|
|
};
|
|
this.setState({ loading: { ...this.state.loading, set: true } });
|
|
API.saveAuthOpt(payload).then(({ status, errormsg }) => {
|
|
this.setState({ loading: { ...this.state.loading, set: false } });
|
|
if (status) {
|
|
message.success(getLabel(111, "操作成功！"));
|
|
} else {
|
|
message.error(errormsg);
|
|
}
|
|
});
|
|
};
|
|
syncAuthData = () => {
|
|
const { roleId } = this.props, { selectedKey } = this.state;
|
|
this.setState({ async: true });
|
|
APIFOX[`sync.${selectedKey}`]({ roleId }).then(({ status, errormsg }) => {
|
|
this.setState({ async: false });
|
|
if (status) {
|
|
message.success(getLabel(111, "操作成功！"));
|
|
} else {
|
|
message.error(errormsg);
|
|
}
|
|
});
|
|
};
|
|
getOperatorSetting = () => {
|
|
const { roleId } = this.props;
|
|
const { selectedKey, enumType, replaceDatas } = this.state;
|
|
if (selectedKey !== "auth.AuthTargetTypeEnum") {
|
|
let browserType = {};
|
|
switch (enumType) {
|
|
case "EMP":
|
|
browserType = { ...browserType, type: 17, title: getLabel(82246, "人员选择") };
|
|
break;
|
|
case "DEPARTMENT":
|
|
browserType = { ...browserType, type: 57, title: getLabel(111, "部门选择") };
|
|
break;
|
|
case "JOB":
|
|
browserType = { ...browserType, type: 278, title: getLabel(111, "岗位选择") };
|
|
break;
|
|
case "SUB_COMPANY":
|
|
browserType = { ...browserType, type: 164, title: getLabel(111, "分部选择") };
|
|
break;
|
|
case "ROLE":
|
|
browserType = { ...browserType, type: 65, title: getLabel(111, "角色选择") };
|
|
break;
|
|
case "SQL":
|
|
return (<Row className="tax_role_browser_form_item">
|
|
<WeaTextarea style={{ width: "100%" }} minRows={3}
|
|
value={_.head(replaceDatas) ? _.head(replaceDatas).name : ""}
|
|
onChange={v => this.setState({ replaceDatas: [{ id: v, name: v }] })}/>
|
|
</Row>);
|
|
case "LEVEL":
|
|
return (<WeaFormItem label={getLabel(111, "安全级别")} labelCol={{ span: 2 }} wrapperCol={{ span: 5 }}
|
|
className="tax_role_browser_form_item">
|
|
<WeaScope isMobx value={_.reduce(replaceDatas, (pre, cur) => cur.id.split("-"), [])}
|
|
onChange={v => this.setState({ replaceDatas: [{ id: v.join("-"), name: v.join("-") }] })}/>
|
|
</WeaFormItem>);
|
|
default:
|
|
return (<Row className="tax_role_browser_form_item"></Row>);
|
|
}
|
|
return (<Row className="tax_role_browser_form_item">
|
|
<WeaBrowser {...browserType} isSingle={false} inputStyle={{ width: 150 }} replaceDatas={replaceDatas}
|
|
onChange={(__, ___, replaceDatas) => this.setState({ replaceDatas })}/>
|
|
</Row>);
|
|
} else {
|
|
return (<AuthTree roleId={roleId} ref={dom => this.authTreeRef = dom}/>);
|
|
}
|
|
};
|
|
|
|
render() {
|
|
const { roleId } = this.props;
|
|
const {
|
|
selectedKey, name, options, enumType, pageInfo, columns, dataSource, loading, selectedRowKeys, editOperatorDialog
|
|
} = this.state;
|
|
const tabs = [
|
|
{ title: getLabel(111, "成员"), viewcondition: "auth.MemberTargetTypeEnum" },
|
|
{ title: getLabel(111, "权限"), viewcondition: "auth.AuthTargetTypeEnum" },
|
|
{ title: getLabel(111, "数据"), viewcondition: "auth.DataTargetTypeEnum" }
|
|
];
|
|
const pagination = {
|
|
...pageInfo,
|
|
showTotal: total => `${getLabel(18609, "共")} ${total} ${getLabel(18256, "条")}`,
|
|
showQuickJumper: true,
|
|
showSizeChanger: true,
|
|
pageSizeOptions: ["10", "20", "50", "100"],
|
|
onShowSizeChange: (current, pageSize) => {
|
|
this.setState({
|
|
pageInfo: { ...pageInfo, current, pageSize }
|
|
}, () => this.getSettingRoler(roleId));
|
|
},
|
|
onChange: current => {
|
|
this.setState({
|
|
pageInfo: { ...pageInfo, current }
|
|
}, () => this.getSettingRoler(roleId));
|
|
}
|
|
};
|
|
const rowSelection = {
|
|
selectedRowKeys, onChange: (selectedRowKeys) => this.setState({ selectedRowKeys })
|
|
};
|
|
const buttons = [
|
|
<Button type="primary" onClick={this.syncAuthData} loading={loading.async}>{getLabel(111, "同步")}</Button>,
|
|
<Button type="ghost" loading={loading.set} onClick={this.saveAuthOpt}>{getLabel(111, "保存")}</Button>
|
|
];
|
|
selectedKey === "auth.AuthTargetTypeEnum" && buttons.shift();
|
|
selectedKey !== "auth.AuthTargetTypeEnum" && buttons.pop();
|
|
return (
|
|
<WeaDialog
|
|
{...this.props} hasScroll className="tax_role_set_dialog" initLoadCss title={getLabel(111, "编辑角色")}
|
|
buttons={buttons} style={{
|
|
width: 960, height: 606.6, minHeight: 200, minWidth: 380,
|
|
maxHeight: "90%", maxWidth: "90%", overflow: "hidden", transform: "translate(0px, 0px)"
|
|
}}
|
|
>
|
|
<div className="tax_role_set_container">
|
|
<Row className="tax_role_row_groupname">
|
|
<Col span={18}>
|
|
<WeaFormItem
|
|
label={getLabel(111, "角色名称")} labelCol={{ span: 4 }} wrapperCol={{ span: 8 }}
|
|
error={name === "" ? getLabel(111, "角色名称不能为空") : ""} tipPosition="bottom">
|
|
<WeaInput viewAttr={3} value={name} onChange={val => this.setState({ name: val })}/>
|
|
</WeaFormItem>
|
|
</Col>
|
|
</Row>
|
|
<Row>
|
|
<div className="tax_role_form_item">
|
|
<WeaTab datas={tabs} keyParam="viewcondition" selectedKey={selectedKey}
|
|
onChange={v => this.setState({
|
|
selectedKey: v, name: !name ? null : name, replaceDatas: [], selectedRowKeys: []
|
|
}, () => {
|
|
this.state.selectedKey !== "auth.AuthTargetTypeEnum" && this.getEnumList();
|
|
this.state.selectedKey !== "auth.AuthTargetTypeEnum" && this.getSettingRoler(roleId);
|
|
})}/>
|
|
{
|
|
this.state.selectedKey !== "auth.AuthTargetTypeEnum" &&
|
|
<WeaSelect options={options} detailtype={3} value={enumType}
|
|
onChange={v => this.setState({ enumType: v, replaceDatas: [] })}/>
|
|
}
|
|
{this.getOperatorSetting()}
|
|
{
|
|
this.state.selectedKey !== "auth.AuthTargetTypeEnum" &&
|
|
<Row className="tax_role_operator_setting">
|
|
<Col span={8} offset={16}>
|
|
<Button type="primary" loading={loading.set}
|
|
onClick={this.addOperatorSettings}>{getLabel(111, "添加操作者设置")}</Button>
|
|
</Col>
|
|
</Row>
|
|
}
|
|
</div>
|
|
</Row>
|
|
{/*表格*/}
|
|
{
|
|
this.state.selectedKey !== "auth.AuthTargetTypeEnum" &&
|
|
<Row className="tax_role_operator_setting_table">
|
|
<Col span={24} className="setting_table_title">
|
|
<div className="wea-f12 text-elli operator">
|
|
<span>{getLabel(111, "已设操作者")}</span>
|
|
<Button type="ghost" disabled={_.isEmpty(selectedRowKeys)} loading={loading.delete}
|
|
onClick={this.deleteOperatorSettings}>{getLabel(111, "批量删除")}</Button>
|
|
</div>
|
|
<WeaTable rowKey="id" columns={columns} dataSource={dataSource} bordered loading={loading.query}
|
|
pagination={pagination} rowSelection={rowSelection}/>
|
|
{/* 编辑操作者*/}
|
|
<EditRoleDialog {...editOperatorDialog} loading={loading.set}
|
|
onChange={replaceDatas => this.setState({ replaceDatas }, () => this.addOperatorSettings())}
|
|
onCancel={callback => this.setState({
|
|
editOperatorDialog: { ...editOperatorDialog, visible: false, record: {} }
|
|
}, () => callback && callback())}/>
|
|
</Col>
|
|
</Row>
|
|
}
|
|
</div>
|
|
</WeaDialog>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default Index;
|