ccic-web/packages/component.detail/lib/selected.service.user/selectedServiceUser.js

var __rest = (this && this.__rest) || function (s, e) {
    var t = {};
    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
        t[p] = s[p];
    if (s != null && typeof Object.getOwnPropertySymbols === "function")
        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
                t[p[i]] = s[p[i]];
        }
    return t;
};
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
import { Modal, Button, Form } from 'antd';
import { EditableProTable, ProForm, ProTable, } from '@ant-design/pro-components';
import { useState } from 'react';
import { isEmpty, map, initial, find, omit, pick } from 'lodash';
const column = [
    {
        title: '姓名',
        dataIndex: 'userName',
        readonly: true,
        formItemProps: {
            label: '关键字',
            name: 'keyword',
        },
    },
    {
        title: '用户工号',
        dataIndex: 'userNo',
        readonly: true,
        search: false,
    },
    {
        title: '所在机构',
        dataIndex: 'organName',
        readonly: true,
        search: false,
    },
    {
        title: '操作',
        valueType: 'option',
    },
];
export default function SelectedPolicy(_a) {
    var { selectionType = 'radio', title, label, name, required, service, params, columns = column, search = false, ruleMessage, filterName } = _a, props = __rest(_a, ["selectionType", "title", "label", "name", "required", "service", "params", "columns", "search", "ruleMessage", "filterName"]);
    const form = Form.useFormInstance();
    const filterUser = Form.useWatch(filterName, form);
    const [visible, setVisible] = useState(false);
    const [selectedRowOptions, setSelectedRowOptions] = useState([]);
    const rowSelection = {
        onChange: (selectedRowKeys, selectedRowOptions) => {
            setSelectedRowOptions(selectedRowOptions);
        },
        selectedRowKeys: map(selectedRowOptions, 'userId'),
    };
    function onCancel(form) {
        setSelectedRowOptions(form.getFieldValue(name));
        setVisible(false);
    }
    function onOk(form) {
        form.setFieldsValue({
            [name]: selectedRowOptions,
        });
        setVisible(false);
    }
    return (_jsx(ProForm.Item, Object.assign({ label: label, shouldUpdate: true, required: required }, props, { children: (form) => {
            return (_jsxs(_Fragment, { children: [_jsx(Button, Object.assign({ type: "primary", onClick: () => setVisible(true) }, { children: title })), _jsx(Modal, Object.assign({ onCancel: () => onCancel(form), onOk: () => onOk(form), width: "60%", title: title, open: visible, destroyOnClose: true }, { children: _jsx(ProTable, { rowKey: "userId", options: false, search: search, pagination: {
                                pageSize: 5,
                                showSizeChanger: false,
                            }, columns: map(initial(columns), (item) => omit(item, ['readonly'])), params: params, request: filterUser
                                ? (params) => {
                                    return service(params).then((result) => {
                                        return Object.assign(Object.assign({}, result), { data: result.data.filter((item) => !find(filterUser, (sub) => sub.userId === item.userId)) });
                                    });
                                }
                                : service, rowSelection: Object.assign({ type: selectionType }, rowSelection) }) })), _jsx(ProForm.Item, Object.assign({ hidden: isEmpty(selectedRowOptions), noStyle: isEmpty(selectedRowOptions), name: name, trigger: "onValuesChange", rules: [{ required: required, message: ruleMessage }] }, { children: _jsx(EditableProTable, { style: {
                                marginTop: 20,
                            }, size: "small", rowKey: "userId", toolBarRender: false, columns: columns.map((item) => pick(item, ['title', 'dataIndex', 'readonly', 'valueType'])), recordCreatorProps: {
                                style: {
                                    display: 'none',
                                },
                            }, editable: {
                                type: 'multiple',
                                editableKeys: map(selectedRowOptions, 'userId'),
                                actionRender: (row, config, defaultDoms) => {
                                    return [defaultDoms.delete];
                                },
                                onChange: (editableKeys, editableOptions) => {
                                    form.setFieldsValue({
                                        serviceObject: editableOptions,
                                    });
                                    setSelectedRowOptions(editableOptions);
                                },
                            } }) }))] }));
        } })));
}