fastlion-amis/lib/renderers/Table/commonSelect.js

一种MIS页面生成工具

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.RadioWrapper = exports.DataArea = exports.SelectContent = exports.SelectWrapperGroup = void 0;
var tslib_1 = require("tslib");
var react_1 = tslib_1.__importDefault(require("react"));
var antd_1 = require("antd");
var icons_1 = require("../../components/icons");
var CheckboxGroup = antd_1.Checkbox.Group;
//selectCheckbox
function SelectWrapperGroup(props) {
    var label = props.label, data = props.data, onChange = props.onChange, defaultValue = props.defaultValue, _a = props.type, type = _a === void 0 ? "multiple" : _a, isCombine = props.isCombine, barValue = props.barValue, lineValue = props.lineValue, setBarValue = props.setBarValue, setLineValue = props.setLineValue, hideToolbar = props.hideToolbar;
    var handleChange = function (checkedValue) {
        if (type === 'multiple') {
            onChange(checkedValue);
        }
        else {
            var singleValue = checkedValue.slice(-1);
            onChange(singleValue);
        }
    };
    var handleSelectAll = function () {
        var _a, _b;
        onChange((_b = (_a = data === null || data === void 0 ? void 0 : data.filter(function (item) { return !item.disabled; })) === null || _a === void 0 ? void 0 : _a.map(function (item) { return item.value; })) !== null && _b !== void 0 ? _b : []);
        if (isCombine && lineValue && barValue) {
            var newBarValue_1 = [];
            data.forEach(function (item) {
                if (!(defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.includes(item.value)) && !item.disabled) {
                    newBarValue_1.push(item.value);
                }
            });
            setBarValue === null || setBarValue === void 0 ? void 0 : setBarValue(tslib_1.__spreadArray(tslib_1.__spreadArray([], barValue, true), newBarValue_1, true));
        }
    };
    var handleSelectReverse = function () {
        var _a;
        var allValues = (_a = data === null || data === void 0 ? void 0 : data.filter(function (item) { return !item.disabled; })) === null || _a === void 0 ? void 0 : _a.map(function (item) { return item.value; });
        var newValues = allValues.filter(function (v) { return (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.indexOf(v)) == -1; });
        onChange(newValues);
        if (isCombine && lineValue && barValue) {
            setLineValue === null || setLineValue === void 0 ? void 0 : setLineValue([]);
            setBarValue === null || setBarValue === void 0 ? void 0 : setBarValue(newValues);
        }
    };
    var handleSelectClear = function () {
        onChange([]);
        if (isCombine) {
            setBarValue === null || setBarValue === void 0 ? void 0 : setBarValue([]);
            setLineValue === null || setLineValue === void 0 ? void 0 : setLineValue([]);
        }
    };
    //业务逻辑，组合图默认得有一个图的类型
    var handleClick = function (value) {
        if (isCombine && barValue && lineValue) {
            if (defaultValue === null || defaultValue === void 0 ? void 0 : defaultValue.includes(value)) {
                barValue.includes(value) ? setBarValue === null || setBarValue === void 0 ? void 0 : setBarValue(barValue.filter(function (item) { return item !== value; })) :
                    setLineValue === null || setLineValue === void 0 ? void 0 : setLineValue(lineValue.filter(function (item) { return item !== value; }));
            }
            else {
                setBarValue === null || setBarValue === void 0 ? void 0 : setBarValue(tslib_1.__spreadArray(tslib_1.__spreadArray([], barValue, true), [value], false));
            }
        }
    };
    var handleChangeChart = function (e, value) {
        e.stopPropagation();
        if (isCombine && barValue && lineValue) {
            if (barValue.includes(value)) {
                setBarValue === null || setBarValue === void 0 ? void 0 : setBarValue(barValue.filter(function (item) { return item !== value; }));
                setLineValue === null || setLineValue === void 0 ? void 0 : setLineValue(tslib_1.__spreadArray(tslib_1.__spreadArray([], lineValue, true), [value], false));
            }
            else {
                setLineValue === null || setLineValue === void 0 ? void 0 : setLineValue(lineValue.filter(function (item) { return item !== value; }));
                setBarValue === null || setBarValue === void 0 ? void 0 : setBarValue(tslib_1.__spreadArray(tslib_1.__spreadArray([], barValue, true), [value], false));
            }
        }
    };
    return (react_1.default.createElement("div", { className: "common-select-container" },
        react_1.default.createElement("div", { className: "sel-top" },
            react_1.default.createElement("span", null, label),
            hideToolbar ? null : type === 'multiple' &&
                react_1.default.createElement("div", { className: "sel-btn-group" },
                    react_1.default.createElement("span", { className: "btn", onClick: handleSelectAll }, "\u5168\u9009"),
                    react_1.default.createElement("span", { className: "btn", onClick: handleSelectReverse }, "\u53CD\u9009"),
                    react_1.default.createElement("span", { className: "btn", onClick: handleSelectClear }, "\u4E0D\u9009"))),
        react_1.default.createElement("div", { className: "sel-body" },
            react_1.default.createElement(CheckboxGroup, { onChange: handleChange, value: defaultValue }, data === null || data === void 0 ? void 0 : data.map(function (item) { return (react_1.default.createElement("div", { title: item.title, onClick: function () { return handleClick(item.value); }, key: item.value, className: "checkbox-container ".concat(isCombine ? 'combine-chart-select' : '') },
                react_1.default.createElement(antd_1.Checkbox, { onClick: function (e) { return e.stopPropagation(); }, disabled: item.disabled, value: item.value }, item.title),
                isCombine && (barValue === null || barValue === void 0 ? void 0 : barValue.includes(item.value)) && !item.disabled && react_1.default.createElement("div", { onClick: function (e) { return handleChangeChart(e, item.value); }, className: 'combine-chart-item' }, "\u67F1\u56FE"),
                isCombine && (lineValue === null || lineValue === void 0 ? void 0 : lineValue.includes(item.value)) && !item.disabled && react_1.default.createElement("div", { onClick: function (e) { return handleChangeChart(e, item.value); }, className: 'combine-chart-item' }, "\u6298\u7EBF"))); })))));
}
exports.SelectWrapperGroup = SelectWrapperGroup;
//统计内容
function SelectContent(props) {
    var label = props.label, data = props.data, onChange = props.onChange, defaultValue = props.defaultValue;
    var handleChange = function (checkedValue) {
        onChange(checkedValue);
    };
    return (react_1.default.createElement("div", { className: "select-content-container" },
        react_1.default.createElement("div", { className: "sel-content-top" }, label),
        react_1.default.createElement("div", { className: "sel-content-body" },
            react_1.default.createElement(CheckboxGroup, { onChange: handleChange, value: defaultValue }, data === null || data === void 0 ? void 0 : data.map(function (item) { return (react_1.default.createElement(antd_1.Checkbox, { disabled: item.disabled, key: item.value, value: item.value },
                react_1.default.createElement("div", { className: "sel-content-item-container" },
                    react_1.default.createElement("div", { className: "icon-container" },
                        react_1.default.createElement(icons_1.Icon, { icon: item.icon, className: "icon" })),
                    react_1.default.createElement("span", { className: "sel-title" }, item.title)))); })))));
}
exports.SelectContent = SelectContent;
function DataArea(props) {
    var value = props.value, onChange = props.onChange, className = props.className, radioList = props.radioList;
    var classNm = className ? 'tools-area ' + className : 'tools-area';
    return (react_1.default.createElement(antd_1.Row, { className: classNm },
        react_1.default.createElement(antd_1.Col, { span: 4, className: 'tools-label' },
            react_1.default.createElement("span", null, "\u6570\u636E\u8303\u56F4")),
        react_1.default.createElement(antd_1.Col, { span: 20 },
            react_1.default.createElement(antd_1.Radio.Group, { onChange: onChange, value: value }, (radioList === null || radioList === void 0 ? void 0 : radioList.length) ?
                radioList.map(function (radio) { return react_1.default.createElement(antd_1.Radio, { key: radio.value, value: radio.value }, radio.title); })
                :
                    [
                        react_1.default.createElement(antd_1.Radio, { key: 'present', value: 'present' }, "\u5F53\u524D\u9875\u6570\u636E"),
                        react_1.default.createElement(antd_1.Radio, { key: 'some', value: 'some' }, "\u9009\u4E2D\u6570\u636E"),
                        react_1.default.createElement(antd_1.Radio, { key: 'all', value: 'all' }, "\u5168\u90E8\u6570\u636E")
                    ]))));
}
exports.DataArea = DataArea;
function RadioWrapper(props) {
    var title = props.title, value = props.value, onChange = props.onChange, data = props.data, className = props.className;
    var classNm = className ? 'tools-area ' + className : 'tools-area';
    return (react_1.default.createElement(antd_1.Row, { className: classNm },
        react_1.default.createElement(antd_1.Col, { span: 4, className: 'tools-label' },
            react_1.default.createElement("span", null, title)),
        react_1.default.createElement(antd_1.Col, { span: 20 },
            react_1.default.createElement(antd_1.Radio.Group, { onChange: onChange, value: value }, data.map(function (item) { return react_1.default.createElement(antd_1.Radio, { key: item.value, value: item.value }, item.title); })))));
}
exports.RadioWrapper = RadioWrapper;
//# sourceMappingURL=./renderers/Table/commonSelect.js.map