"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    var desc = Object.getOwnPropertyDescriptor(m, k);
    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
      desc = { enumerable: true, get: function() { return m[k]; } };
    }
    Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
    Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
    o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
    __setModuleDefault(result, mod);
    return result;
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importStar(require("react"));
const react_redux_1 = require("react-redux");
const antd_1 = require("antd");
const ACTIONS = __importStar(require("@/actions/applications/detail/resources/groups"));
const index_1 = require("@/components/index");
const file_1 = require("@/constants/file");
const system_1 = require("@/pages/system");
const empty_check_1 = require("@/utils/empty-check");
const formItemLayout = {
    labelCol: { span: 7 },
    wrapperCol: { span: 17 },
};
const mapStateToProps = (store) => ({
    applicationId: store.applications.detail.settings.app.applicationId,
    drawerOpen: store.applications.detail.resources.groups.drawerOpen,
    editGroup: store.applications.detail.resources.groups.editGroup,
    resourceUrl: store.applications.detail.resources.groups.resourceUrl,
});
const mapDispatchToProps = {
    saveGroup: ACTIONS.saveResourcesGroup,
    fetchResourcesGroupTypes: ACTIONS.fetchResourcesGroupTypes,
    fetchResourceRemoteUrl: ACTIONS.fetchResourcesRemoteUrl,
    resetDrawer: ACTIONS.resetResourcesEditDrawerState,
};
const Drawer = (props) => {
    const { applicationId, drawerOpen, editGroup, resourceUrl, saveGroup, fetchResourcesGroupTypes, fetchResourceRemoteUrl, resetDrawer, } = props;
    const [resourceType, setResourceType] = (0, react_1.useState)([]);
    // i18n
    const { locale } = (0, react_1.useContext)(system_1.GlobalContext);
    const { global, resource } = locale.business;
    const [form] = antd_1.Form.useForm();
    const getResourceType = (resourceId) => {
        return resourceType.find((item) => item.id === resourceId) || resourceType[0];
    };
    (0, react_1.useEffect)(() => {
        if (applicationId) {
            fetchResourcesGroupTypes({ applicationId }, (groupTypeList) => setResourceType(groupTypeList));
        }
    }, [applicationId]);
    (0, react_1.useEffect)(() => {
        var _a, _b;
        if (!(0, empty_check_1.objectEmptyCheck)(editGroup)) {
            const resourceScope = (_a = editGroup.tags.find((item) => item.type === file_1.ResourceTagEnum.ResourceConfig)) === null || _a === void 0 ? void 0 : _a.resourceScope;
            const resourceId = (_b = editGroup.tags.find((item) => item.resourceId)) === null || _b === void 0 ? void 0 : _b.resourceId;
            if (resourceScope) {
                fetchResourceRemoteUrl({
                    applicationId,
                    resourceType: getResourceType(resourceId).name,
                    resourceScope,
                });
            }
            form.setFieldsValue({
                name: editGroup.name,
                intro: editGroup.intro,
                resourceScope,
                resourceId,
            });
        }
        else {
            form.setFieldsValue({
                name: undefined,
                intro: undefined,
                resourceScope: undefined,
                resourceId: undefined,
            });
        }
    }, [editGroup]);
    const handleScopeChange = (value) => {
        var _a;
        const resourceId = (_a = editGroup === null || editGroup === void 0 ? void 0 : editGroup.tags.find((item) => item.resourceId)) === null || _a === void 0 ? void 0 : _a.resourceId;
        fetchResourceRemoteUrl({
            applicationId,
            resourceType: getResourceType(resourceId).name,
            resourceScope: value,
        });
    };
    const handleSave = () => {
        form
            .validateFields()
            .then((values) => {
            const { name, intro = '', resourceId, resourceScope } = values;
            const params = {
                id: editGroup === null || editGroup === void 0 ? void 0 : editGroup.id,
                applicationId,
                name,
                intro,
                resourceId,
                resourceType: getResourceType(resourceId).type,
                config: {
                    resourceScope,
                },
            };
            saveGroup(params, {
                onSuccess: () => {
                    resetDrawer();
                    form.resetFields();
                },
            });
        })
            .catch((info) => {
            console.log('Validate Failed:', info);
        });
    };
    return (react_1.default.createElement(index_1.OperationDrawer, { open: drawerOpen, title: (editGroup === null || editGroup === void 0 ? void 0 : editGroup.id) ? resource.editGroup : resource.addGroup, onClose: resetDrawer, width: 480, actions: react_1.default.createElement(antd_1.Button, { type: "primary", onClick: handleSave }, global.apply) },
        react_1.default.createElement(index_1.Group, null,
            react_1.default.createElement(antd_1.Form, Object.assign({}, formItemLayout, { form: form, name: "control-hooks" }),
                react_1.default.createElement(antd_1.Form.Item, { name: "name", label: resource.groupName, rules: [{ required: true }] },
                    react_1.default.createElement(antd_1.Input, null)),
                react_1.default.createElement(antd_1.Form.Item, { name: "resourceId", label: resource.groupType, rules: [{ required: true, message: 'resourceType is required' }] },
                    react_1.default.createElement(antd_1.Radio.Group, { disabled: editGroup === null || editGroup === void 0 ? void 0 : editGroup.id }, resourceType &&
                        resourceType.map((item) => (react_1.default.createElement(antd_1.Radio, { value: item.id, key: item.id },
                            react_1.default.createElement(react_1.default.Fragment, null, item.name)))))),
                react_1.default.createElement(antd_1.Form.Item, { name: "intro", label: resource.groupInfo },
                    react_1.default.createElement(antd_1.Input, null)),
                react_1.default.createElement(antd_1.Form.Item, { name: "resourceScope", label: resource.resourceScope },
                    react_1.default.createElement(antd_1.Input, { onChange: (e) => handleScopeChange(e.target.value) })),
                react_1.default.createElement(antd_1.Form.Item, { name: "resourceScopeTips", label: resource.resourceScopeAddress },
                    react_1.default.createElement("a", { href: resourceUrl, target: "_blank" }, resourceUrl))))));
};
exports.default = (0, react_redux_1.connect)(mapStateToProps, mapDispatchToProps)(Drawer);
