diff --git a/src/api/appMenu/index.js b/src/api/appMenu/index.js index ab49f6d..1098343 100644 --- a/src/api/appMenu/index.js +++ b/src/api/appMenu/index.js @@ -21,6 +21,10 @@ export const appMenuInfo = declareRequest( `Get > /appmenu/appMenu/{id}`, ); export const appMenuPermsGroupsList = declareRequest( + "appMenuDistributionMenuLoading", + `Get > /appmenu/menuRoleRelational/list`, +); +export const systemPermsGroupsList = declareRequest( "appMenuDistributionMenuLoading", `Get > /system/operation/perms-groups`, ); @@ -32,3 +36,31 @@ export const appMenuGetAlreadyDistributionMenu = declareRequest( "appMenuDistributionMenuLoading", `Get > /appmenu/roleMenu/listAllByRoleIdByPc`, ); +export const appMenuGetAppTenant = declareRequest( + "appMenuDistributionMenuLoading", + `Get > /appmenu/tenantAppRelational/getAppTenant`, +); +export const systemTenantsList = declareRequest( + "appMenuDistributionMenuLoading", + `Get > /system/tenants`, +); +export const appMenuGetTenantAppByMenuAttribution = declareRequest( + "appMenuDistributionMenuLoading", + `Get > /appmenu/tenantAppRelational/getTenantAppByMenuAttribution/{menuAttribution}`, +); +export const appMenuTenantAppRelationalSave = declareRequest( + "appMenuDistributionMenuLoading", + `Post > @/appmenu/tenantAppRelational/tenantAppRelationalSave`, +); +export const appMenuGetMenuAppByTenantId = declareRequest( + "appMenuDistributionMenuLoading", + `Get > /appmenu/tenantAppRelational/getMenuAppByTenantId`, +); +export const appMenuGetMenuRoleByMenuAttribution = declareRequest( + "appMenuDistributionMenuLoading", + `Get > /appmenu/menuRoleRelational/getMenuRoleByMenuAttribution/{menuAttribution}`, +); +export const appMenuGetMenuRoleByMenuAttributionSave = declareRequest( + "appMenuDistributionMenuLoading", + `Post > @/appmenu/menuRoleRelational/menuRoleRelationalSave`, +); diff --git a/src/pages/Container/AppMenu/App/index.js b/src/pages/Container/AppMenu/App/index.js new file mode 100644 index 0000000..380ce71 --- /dev/null +++ b/src/pages/Container/AppMenu/App/index.js @@ -0,0 +1,142 @@ +import { Connect } from "@cqsjjb/jjb-dva-runtime"; +import { Button, message, Modal } from "antd"; +import { useEffect, useRef, useState } from "react"; +import Page from "zy-react-library/components/Page"; +import Table from "zy-react-library/components/Table"; +import useDictionary from "zy-react-library/hooks/useDictionary"; +import useTable from "zy-react-library/hooks/useTable"; +import { NS_APP_MENU } from "~/enumerate/namespace"; + +function App(props) { + const [list, setList] = useState([]); + const [configModalVisible, setConfigModalVisible] = useState(false); + const [currentInfo, setCurrentInfo] = useState({}); + + const { getDictionary } = useDictionary(); + + const getData = async () => { + const dictionary = await getDictionary({ dictValue: "APP_TYPE_ZC" }); + const { data } = await props["appMenuGetAppTenant"](); + + const corpMap = data.reduce((map, item) => { + map[item.menuAttribution] = item.corpList; + return map; + }, {}); + + const updatedDictionary = dictionary.map(item => ({ + ...item, + tenantName: corpMap[item.dictValue]?.map(item => item.corpName)?.join(",") || null, + })); + + setList(updatedDictionary); + }; + + useEffect(() => { + getData(); + }, []); + + return ( + + ( + + ), + }, + ]} + dataSource={list} + pagination={false} + /> + { + configModalVisible && ( + { + setConfigModalVisible(false); + setCurrentInfo({}); + }} + info={currentInfo} + getData={getData} + /> + ) + } + + ); +} + +const ConfigModalComponent = (props) => { + const [selectedRowKeys, setSelectedRowKeys] = useState([]); + + const selectedRowsRef = useRef([]); + + const { tableProps } = useTable(props["systemTenantsList"], { + useStorageQueryCriteria: false, + }); + + const getTenantAppByMenuAttribution = async () => { + const { data } = await props["appMenuGetTenantAppByMenuAttribution"]({ menuAttribution: props.info.dictValue }); + setSelectedRowKeys(data.map(item => item.corpId)); + selectedRowsRef.current = data.map(item => ({ id: item.corpId, tenantName: item.corpName })); + }; + + useEffect(() => { + getTenantAppByMenuAttribution(); + }, []); + + const onSubmit = async () => { + const { success } = await props["appMenuTenantAppRelationalSave"]({ + menuAttribution: props.info.dictValue, + menuAttributionName: props.info.dictLabel, + corpList: selectedRowsRef.current.map(item => ({ corpId: item.id, corpName: item.tenantName })), + }); + if (success) { + message.success("保存成功"); + props.onCancel(); + props.getData(); + } + }; + + return ( + +
注:取消勾选会清空租户下已有角色的APP使用权限,请谨慎操作!} + rowSelection={{ + selectedRowKeys, + onChange: (selectedRowKeys, selectedRows) => { + setSelectedRowKeys(selectedRowKeys); + selectedRowsRef.current = selectedRows; + }, + }} + options={false} + disabledResizer={true} + columns={[{ title: "租户名称", dataIndex: "tenantName" }]} + {...tableProps} + /> + + ); +}; + +const ConfigModal = Connect([NS_APP_MENU], true)(ConfigModalComponent); + +export default Connect([NS_APP_MENU], true)(App); diff --git a/src/pages/Container/AppMenu/DistributionMenu/index.js b/src/pages/Container/AppMenu/DistributionMenu/index.js index bb26637..57707b8 100644 --- a/src/pages/Container/AppMenu/DistributionMenu/index.js +++ b/src/pages/Container/AppMenu/DistributionMenu/index.js @@ -1,24 +1,36 @@ import { Connect } from "@cqsjjb/jjb-dva-runtime"; -import { Button, message, Modal, Space, Tree } from "antd"; +import { Button, Form, message, Modal, Space, Tree } from "antd"; import { useEffect, useRef, useState } from "react"; import Page from "zy-react-library/components/Page"; +import Search from "zy-react-library/components/Search"; import Table from "zy-react-library/components/Table"; import useTable from "zy-react-library/hooks/useTable"; import { NS_APP_MENU } from "~/enumerate/namespace"; function DistributionMenu(props) { - const [currentId, setCurrentId] = useState(""); + const [currentInfo, setCurrentInfo] = useState({}); const [distributionMenuModalVisible, setDistributionMenuModalVisible] = useState(false); - const { tableProps, getData } = useTable(props["appMenuPermsGroupsList"]); + const [form] = Form.useForm(); + + const { tableProps, getData } = useTable(props["appMenuPermsGroupsList"], { + form, + }); return ( +
{ - setCurrentId(record.id); + setCurrentInfo(record); setDistributionMenuModalVisible(true); }} > - 分配菜单 + 权限配置 ), @@ -43,10 +55,10 @@ function DistributionMenu(props) { { distributionMenuModalVisible && ( { setDistributionMenuModalVisible(false); - setCurrentId(""); + setCurrentInfo({}); }} getData={getData} /> @@ -65,10 +77,10 @@ const DistributionMenuModalComponent = (props) => { const halfCheckedKeys = useRef([]); const getData = async () => { - const { data: menuListTree } = await props["appMenuListTree"]({ eqMenuAttribution: "gwjapp" }); + const { data: menuListTree } = await props["appMenuListTree"]({ eqMenuAttribution: props.info.menuAttribution }); setMenuListTree(menuListTree); - const { data } = await props["appMenuGetAlreadyDistributionMenu"]({ roleId: props.id }); + const { data } = await props["appMenuGetAlreadyDistributionMenu"]({ roleId: props.info.roleId }); setCheckedKeys(data.map(item => item.menuId)); }; @@ -78,7 +90,7 @@ const DistributionMenuModalComponent = (props) => { const onSubmit = async () => { const { success } = await props["appMenuDistributionMenu"]({ - roleId: props.id, + roleId: props.info.roleId, menuIdList: checkedKeys, halfCheckMenuIdList: halfCheckedKeys.current, }); diff --git a/src/pages/Container/AppMenu/Menu/index.js b/src/pages/Container/AppMenu/Menu/index.js index 1527e4a..cf122de 100644 --- a/src/pages/Container/AppMenu/Menu/index.js +++ b/src/pages/Container/AppMenu/Menu/index.js @@ -1,7 +1,8 @@ import useUrlState from "@ahooksjs/use-url-state"; +import { ApiOutlined } from "@ant-design/icons"; import { Connect } from "@cqsjjb/jjb-dva-runtime"; import { Button, Form, message, Modal, Space, Tabs, Tag } from "antd"; -import { useEffect, useState } from "react"; +import { useEffect, useRef, useState } from "react"; import FormBuilder from "zy-react-library/components/FormBuilder"; import AddIcon from "zy-react-library/components/Icon/AddIcon"; import Page from "zy-react-library/components/Page"; @@ -15,27 +16,41 @@ const MENU_TYPE_ENUM = [ { bianma: 1, name: "菜单" }, { bianma: 2, name: "按钮" }, ]; -const MENU_ATTRIBUTION_ENUM = [ - { bianma: "gwjapp", name: "港务局app" }, -]; function Menu(props) { const [currentId, setCurrentId] = useState(""); const [currentSort, setCurrentSort] = useState(0); const [addModalVisible, setAddModalVisible] = useState(false); + const [roleBindingModalVisible, setRoleBindingModalVisible] = useState(false); const [parentId, setParentId] = useState(0); const [parentName, setParentName] = useState(""); + const [menuAttribution, setMenuAttribution] = useState([]); const [urlState, setUrlState] = useUrlState({ - menuAttribution: MENU_ATTRIBUTION_ENUM[0].bianma, + menuAttribution: "", + menuAttributionName: "", }, { navigateMode: "replace", }); const { tableProps, getData } = useTable(props["appMenuListTree"], { params: { eqMenuAttribution: urlState.menuAttribution }, usePagination: false, + manual: true, }); + const getMenuAppByTenantId = async () => { + const { data } = await props["appMenuGetMenuAppByTenantId"](); + setMenuAttribution(data); + const menuAttribution = data?.[0]?.menuAttribution; + const menuAttributionName = data?.[0]?.menuAttributionName; + setUrlState({ menuAttribution, menuAttributionName }); + menuAttribution && getData(); + }; + + useEffect(() => { + getMenuAppByTenantId(); + }, []); + const onDelete = (id) => { Modal.confirm({ title: "删除", @@ -58,26 +73,44 @@ function Menu(props) { showIndexColumn={false} toolBarRender={() => ( - + {urlState.menuAttribution + && ( + <> + + + + )} )} headerTitle={( ({ key: item.bianma, label: item.name }))} + items={menuAttribution.map(item => ({ key: item.menuAttribution, label: item.menuAttributionName }))} onChange={(event) => { - setUrlState({ menuAttribution: event }); + setUrlState({ + menuAttribution: event, + menuAttributionName: menuAttribution.find(item => item.menuAttribution === event)?.menuAttributionName, + }); getData(); }} /> @@ -105,7 +138,7 @@ function Menu(props) { setAddModalVisible(true); setParentId(record.id); setParentName(record.menuName); - setCurrentSort(record.children.length + 1); + setCurrentSort((record.children?.length || 0) + 1); }} > 新增子级 @@ -155,6 +188,17 @@ function Menu(props) { /> ) } + { + roleBindingModalVisible && ( + { + setRoleBindingModalVisible(false); + }} + menuAttribution={urlState.menuAttribution} + menuAttributionName={urlState.menuAttributionName} + /> + ) + } ); } @@ -219,18 +263,74 @@ const AddModalComponent = (props) => { { name: "menuUrl", label: "路径" }, { name: "menuPerms", label: "标识" }, { name: "menuType", label: "类型", render: FORM_ITEM_RENDER_ENUM.RADIO, items: MENU_TYPE_ENUM }, - { - name: "sort", - label: "排序", - render: FORM_ITEM_RENDER_ENUM.NUMBER, - rules: [{ pattern: /^\d*$/, message: "请输入整数" }], - }, + { name: "sort", label: "排序", onlyForLabel: true }, ]} /> ); }; +const RoleBindingModalComponent = (props) => { + const [selectedRowKeys, setSelectedRowKeys] = useState([]); + + const selectedRowsRef = useRef([]); + + const { tableProps } = useTable(props["systemPermsGroupsList"], { + useStorageQueryCriteria: false, + }); + + const getData = async () => { + const { data } = await props["appMenuGetMenuRoleByMenuAttribution"]({ menuAttribution: props.menuAttribution }); + setSelectedRowKeys(data.map(item => item.roleId)); + selectedRowsRef.current = data.map(item => ({ id: item.roleId, permsGroupName: item.roleName })); + }; + + useEffect(() => { + getData(); + }, []); + + const onSubmit = async () => { + const { success } = await props["appMenuGetMenuRoleByMenuAttributionSave"]({ + menuAttribution: props.menuAttribution, + menuAttributionName: props.menuAttributionName, + roleList: selectedRowsRef.current.map(item => ({ roleId: item.id, roleName: item.permsGroupName })), + }); + if (success) { + message.success("保存成功"); + props.onCancel(); + } + }; + + return ( + +
{ + setSelectedRowKeys(selectedRowKeys); + selectedRowsRef.current = selectedRows; + }, + }} + options={false} + disabledResizer={true} + columns={[ + { title: "角色名称(权限组)", dataIndex: "permsGroupName" }, + ]} + {...tableProps} + /> + + ); +}; + const AddModal = Connect([NS_APP_MENU], true)(AddModalComponent); +const RoleBindingModal = Connect([NS_APP_MENU], true)(RoleBindingModalComponent); export default Connect([NS_APP_MENU], true)(Menu);