import { Connect } from "@cqsjjb/jjb-dva-runtime";
import { message } from "antd";
import { useEffect, useState } from "react";
import FormBuilder from "zy-react-library/components/FormBuilder";
import Page from "zy-react-library/components/Page";
import { FORM_ITEM_RENDER_ENUM } from "zy-react-library/enum/formItemRender";
import { NS_ROLE } from "~/enumerate/namespace";

function Role(props) {
  const [roles, setRoles] = useState([]);
  const [form] = FormBuilder.useForm();

  const getRoles = async () => {
    const { data } = await props.getRoles({ pageIndex: 1, pageSize: 1000 });
    setRoles(data);
  };
  const getRoleUnits = async () => {
    const { data } = await props.getRoleUnits();
    form.setFieldValue("roleId", data.map(item => item.roleId));
  };

  useEffect(() => {
    getRoles();
    getRoleUnits();
  }, []);

  const onSubmit = async (values) => {
    const { success } = await props.updateRole({
      roles: roles.filter(item => values.roleId.includes(item.id)).map(item => ({
        roleId: item.id,
        roleName: item.roleName,
      })),
    });
    if (success) {
      message.success("保存成功");
      getRoleUnits();
    }
  };

  return (
    <Page isShowAllAction={false}>
      <FormBuilder
        span={24}
        options={[
          {
            label: "角色名称",
            name: "roleId",
            render: FORM_ITEM_RENDER_ENUM.CHECKBOX,
            items: roles,
            itemsField: { labelKey: "roleName", valueKey: "id" },
            checkboxCol: 3,
          },
        ]}
        form={form}
        onFinish={onSubmit}
      />
    </Page>
  );
}

export default Connect([NS_ROLE], true)(Role);