import { __assign, __read, __spreadArray } from "tslib";
import * as React from 'react';
import * as PropTypes from 'prop-types';
import { TcbImage } from '../form/uploader/uploaderPc';
import classNames from '../../utils/classnames';
import './index.css';
var CLASS_PREFIX = 'g-uploader-view';
/**
 * 图片上传-展示组件
 */
export default function UploaderView(_a) {
    var _b;
    var srcList = _a.srcList, // 兼容 cloud:和https: 协议，兼容 字符串和字符串数组
    _c = _a.alt, // 兼容 cloud:和https: 协议，兼容 字符串和字符串数组
    alt = _c === void 0 ? '[加载失败]' : _c, _d = _a.gutter, gutter = _d === void 0 ? 8 : _d, _e = _a.height, height = _e === void 0 ? 100 : _e, _f = _a.width, width = _f === void 0 ? 100 : _f, _g = _a.events, events = _g === void 0 ? {} : _g, _h = _a.isZoom, isZoom = _h === void 0 ? true : _h, _j = _a.isEmptyPlace, isEmptyPlace = _j === void 0 ? true : _j, className = _a.className, id = _a.id, style = _a.style;
    var cls = classNames((_b = {},
        _b[CLASS_PREFIX] = true,
        _b[className] = className,
        _b));
    // 成功事件，返回加载成功的链接
    var _k = __read(React.useState([]), 2), successList = _k[0], setSuccessList = _k[1];
    // 失败事件，返回加载失败的链接
    var _l = __read(React.useState([]), 2), errorList = _l[0], setErrorList = _l[1];
    React.useEffect(function () {
        events.load && events.load({ success: successList, error: errorList });
    }, [successList, errorList]);
    var boxStyle = {
        marginRight: gutter,
        marginBottom: gutter,
        height: height,
        width: width,
    };
    var values = []
        .concat(srcList)
        .filter(function (d) { return typeof d === 'string' && d !== ''; });
    return (React.createElement("div", { className: cls, id: id, style: style },
        React.createElement("div", { className: CLASS_PREFIX + "__image-list" },
            values.map(function (d, i) {
                var imgProps = {
                    fileID: d,
                    className: CLASS_PREFIX + "__image",
                    alt: alt,
                    isZoom: isZoom,
                    onLoad: function () { return setSuccessList(function (list) { return __spreadArray(__spreadArray([], __read(list), false), [d], false); }); },
                    onError: function () { return setErrorList(function (list) { return __spreadArray(__spreadArray([], __read(list), false), [d], false); }); },
                };
                return (React.createElement("div", { className: CLASS_PREFIX + "__image-box", key: d + "-" + i, style: boxStyle, title: d },
                    React.createElement(TcbImage, __assign({}, imgProps))));
            }),
            values.length === 0 && isEmptyPlace && (React.createElement("div", { className: CLASS_PREFIX + "__image-box", style: boxStyle },
                React.createElement("img", { className: CLASS_PREFIX + "__image", alt: "\u6682\u65E0\u56FE\u7247" }))))));
}
UploaderView.propTypes = {
    srcList: PropTypes.oneOfType([PropTypes.array, PropTypes.string]),
    alt: PropTypes.string,
    isZoom: PropTypes.bool,
    gutter: PropTypes.number,
    height: PropTypes.number,
    width: PropTypes.number,
    isEmptyPlace: PropTypes.bool,
    events: PropTypes.objectOf(PropTypes.func),
    className: PropTypes.string,
    id: PropTypes.string,
    style: PropTypes.object
};
//# sourceMappingURL=index.js.map