import { v as i18n$1, w as appContext, n as iconsUtil, z as useStaticCallback, i as __read, bm as getDesText, s as __assign, I as Icon, bq as TextShave, bc as getIcon, G as GEO_TYPES, B as GeometryType, bn as BY_COUNT } from './MapEditView-24782753.js';
import * as React from 'react';
import { observer } from 'mobx-react';
import classNames from 'classnames';
import { find, some, size, map, forEach } from 'lodash';
import { M as MapVisualListItem, S as SimpleEye } from './MapVisualListItem-42be2121.js';
import { M as MapVisualGeoIcon } from './MapVisualGeoIcon-fdf6d163.js';
import { N as NumberColorSegmentation, T as TextColorSegmentation } from './TextColorSegmentation-321ebe99.js';
import { useMount, useCreation } from 'ahooks';
import { g as getCardIconInfo, a as getCurrentVisualConfig } from './getCardIconInfo-774d5089.js';
import 'maptalks';
import 'uuid';
import 'mobx';
import 'lz-string';
import 'dayjs';
import 'react-dom';
import 'react-is';
import '@loadable/component';
import 'js-beautify';
import 'axios';
import 'superstruct';
import '@tanem/react-nprogress';
import 'jquery';
import 'chroma-js';
import 'js-cookie';
import 'is-email';
import 'is-uuid';
import 'is-url';
import 'anymatch';
import 'perf-request';
import '@syncpoint/wkx';
import 'buffer';
import '@turf/turf';
import '@mapbox/polylabel';
import 'turf-multipolygon';
import 'turf-polygon';
import 'gcoord';
import 'eventemitter2';
import 'geobuf';
import 'localforage';
import 'rc-menu';
import 'perfect-scrollbar';
import 'jszip';
import 'file-saver';
import 'screenfull';
import 'sql-formatter-fork';
import 'array-move';
import 'turf-multilinestring';
import 'copy-to-clipboard';
import 'maptalks.three';
import 'ajv';
import 'spark-md5';
import 'react-draggable';
import 'react-virtualized';
import 'turf-point';
import 'decamelize';
import 'rbush';
import 'qs';
import 'maptalks.snap';
import 'react-use';
import 'react-rnd';
import 'react-beautiful-dnd';
import './index-ae07a940.js';
import './MapColorPicker-41ec1c5c.js';
import './index-f58067b3.js';
import './index-3fbe476f.js';
import './useDataValue-8bdb351c.js';

var i18n = i18n$1.mapEdit.cards;
var useRef = React.useRef;
var prefixCls = 'dm-map-visual-simple-card';
var MapVisualSimpleCard = observer(function (props) {
    var _a, _b;
    var ref = useRef(null);
    var routeStore = React.useContext(appContext.getContext()).routeStore;
    var CardsStore = routeStore.CardsStore, defaultIcon = routeStore.defaultIcon, customIconPrefInfo = routeStore.customIconPrefInfo, getPopupContainer = routeStore.getPopupContainer;
    var getIconUrl = iconsUtil.getIconUrl, getIconColorPref = iconsUtil.getIconColorPref, iconCache = iconsUtil.iconCache;
    var get3DPolygonConfig = CardsStore.get3DPolygonConfig, getCardsHeight = CardsStore.getCardsHeight;
    // const [popupVisible, setPopupVisible] = useState(false);
    var card = props.card, getSuppPackage = props.getSuppPackage, provided = props.provided;
    var _c = card, inRange = _c.inRange, isStatic = _c.isStatic, hidden = _c.hidden, 
    // isFence,
    uuid = _c.uuid, 
    // cardId,
    visualList = _c.visualList, 
    // count,
    defaultStyle = _c.defaultStyle, changeCurrentVisual = _c.changeCurrentVisual, 
    // deleteVisual,
    // addNumberVisualList,
    // addTypeVisual,
    // addHeatVisual,
    // addGridHeatVisual,
    // updateTextVisual,
    // openTextVisualSetting,
    // updateDefaultStyle,
    changeVisualIgnore = _c.changeVisualIgnore, sizeVisual = _c.sizeVisual, changeCardHidden = _c.changeCardHidden;
    useMount(function () { return getCardsHeight(); });
    var iconInfo = useCreation(function () {
        return getCardIconInfo({
            getIconColorPref: getIconColorPref,
            getIconUrl: getIconUrl,
            iconCache: iconCache,
            customIconPrefInfo: customIconPrefInfo,
            defaultIcon: defaultIcon,
        });
    }, [
        getIconColorPref,
        getIconUrl,
        defaultIcon,
        customIconPrefInfo,
        iconCache.customIconList,
        iconCache.defaultIconList,
    ]);
    // const iconInfo = React.useMemo(
    //   () => ({
    //     defaultIcon,
    //     iconList: [
    //       ...iconCache.customIconList.map((i) => ({
    //         // label: getIconLabel(i),
    //         name: i,
    //         url: getIconUrl(i),
    //         originalColor: getIconColorPref(i),
    //       })),
    //       ...iconCache.defaultIconList.map((i) => ({
    //         // label: getIconLabel(i),
    //         name: i,
    //         url: getIconUrl(i),
    //         originalColor: getIconColorPref(i),
    //       })),
    //     ],
    //     customIconPrefInfo,
    //   }),
    //   [
    //     customIconPrefInfo,
    //     defaultIcon,
    //     getIconColorPref,
    //     getIconUrl,
    //     iconCache.customIconList,
    //     iconCache.defaultIconList,
    //   ],
    // );
    // const { color, icon } = defaultStyle;
    var packageInfo = getSuppPackage(uuid);
    var objectType = packageInfo.objectType, geometryType = packageInfo.geometryType, source = packageInfo.source, packageUuid = packageInfo.packageUuid, getCol = packageInfo.getCol, 
    // getColUuid,
    getColumnValueById = packageInfo.getColumnValueById;
    // console.log(packageInfo, 'packageInfo');
    // const {} =
    var _currentVisual = find(visualList, { isCurrent: true });
    var _changeHidden = useStaticCallback(function () {
        changeCardHidden(!hidden);
    });
    // const _currentVisualConfig = () => {
    //   const { id, fieldId } = _currentVisual || {};
    //   let field = getCol({ uuid, fieldId });
    //   const visual = card[id as string];
    //   const current = find(visual, { fieldId });
    //   if (fieldId === BY_COUNT) {
    //     field = i18n.point;
    //   }
    //   const isHeat = id === HEAT_VISUAL || id === GRID_HEAT_VISUAL;
    //   const isCurrentHeatVisual = id === HEAT_VISUAL;
    //   const isCurrentGridHeatVisual = id === GRID_HEAT_VISUAL;
    //   const isCurrentTypeVisual = id === TYPE_VISUAL;
    //   const isCurrentNumberVisual = id === NUMBER_VISUAL;
    //   const isFlow = id === FLOW_VISUAL;
    //   const isPolygon3DVisual = id?.startsWith(PTD_VISUAL);
    //   const isPointToPoint = geometryType === GEO_TYPES[GeometryType.pointToPoint];
    //   const isPoint = geometryType === GEO_TYPES[GeometryType.point];
    //   const isPolygon = geometryType === GEO_TYPES[GeometryType.polygon];
    //   const isLine = geometryType === GEO_TYPES[GeometryType.line];
    //   const type = {
    //     isHeat,
    //     isCurrentHeatVisual,
    //     isCurrentGridHeatVisual,
    //     isCurrentTypeVisual,
    //     isCurrentNumberVisual,
    //     isFlow,
    //     isPolygon3DVisual,
    //     isPointToPoint,
    //     isPoint,
    //     isPolygon,
    //     isLine,
    //   };
    //   return [current, id, field, fieldId, type];
    // };
    var _d = __read(getCurrentVisualConfig({
        currentVisual: _currentVisual,
        card: card,
        packageInfo: packageInfo,
    }), 5), currentVisualDetail = _d[0], currentVisualType = _d[1], currentVisualField = _d[2], currentVisualFieldId = _d[3], currentVisualOpinion = _d[4];
    var isHeat = currentVisualOpinion.isHeat, 
    // isCurrentHeatVisual,
    // isCurrentGridHeatVisual,
    isCurrentTypeVisual = currentVisualOpinion.isCurrentTypeVisual, isCurrentNumberVisual = currentVisualOpinion.isCurrentNumberVisual, isFlow = currentVisualOpinion.isFlow, isPolygon3DVisual = currentVisualOpinion.isPolygon3DVisual, isPointToPoint = currentVisualOpinion.isPointToPoint, isPoint = currentVisualOpinion.isPoint, isPolygon = currentVisualOpinion.isPolygon, isLine = currentVisualOpinion.isLine;
    console.log(currentVisualDetail, 'currentVisualDetail');
    // const isPointToPoint = geometryType === GEO_TYPES[GeometryType.pointToPoint];
    // const isMarket = source === 'market';
    // const isHeat = currentVisualType === 'heatVisual' || currentVisualType === 'gridHeatVisual';
    // const isFlow = currentVisualType === FLOW_VISUAL;
    var currentDesText = getDesText(currentVisualType);
    // const isCurrentTypeVisual = currentVisualType === 'typeVisual';
    // 获取三维面 config
    var polygon3DConfig = get3DPolygonConfig({
        card: card,
        visual: _currentVisual,
        objectType: objectType,
        source: source,
        getCol: getCol,
        packageUuid: packageUuid,
        getColumnValueById: getColumnValueById,
    });
    // const
    var _getCurrentBreaks = function () {
        var currentBreaks = [];
        if (isCurrentTypeVisual) {
            forEach(currentVisualDetail.breaks, function (b) {
                var data = getColumnValueById({ uuid: uuid, col: currentVisualField, id: b });
                currentBreaks.push(data === null || data === void 0 ? void 0 : data.value);
            });
        }
        if (isFlow) {
            var field_1 = getCol({ uuid: uuid, fieldId: currentVisualDetail.colorFieldId });
            forEach(currentVisualDetail.breaks, function (b) {
                var data = getColumnValueById({ uuid: uuid, col: field_1, id: b });
                currentBreaks.push(data === null || data === void 0 ? void 0 : data.value);
            });
        }
        return currentBreaks;
    };
    var hasVisualList = some(visualList, { isCurrent: false });
    var _textClick = useStaticCallback(function (node) {
        changeVisualIgnore({
            type: currentVisualType,
            fieldId: currentVisualFieldId,
            index: Number(node),
        });
    });
    // console.log(currentVisualField, 'currentVisualField');
    /**
     * 无可视化 使用objectType/card.name
     * 有可视化 使用可视化名称
     *
     **/
    var getShowTitle = function () {
        if (isPolygon3DVisual) {
            return (_currentVisual === null || _currentVisual === void 0 ? void 0 : _currentVisual.name) || card.name;
        }
        if (isPoint || isPolygon || isLine) {
            if (currentVisualField) {
                return (_currentVisual === null || _currentVisual === void 0 ? void 0 : _currentVisual.name) || card.name;
            }
            else {
                return card.name;
            }
        }
        if (isPointToPoint) {
            return (_currentVisual === null || _currentVisual === void 0 ? void 0 : _currentVisual.name) || card.name;
        }
    };
    // 三维面polygon3Dconfig来展示相关内容
    var polygon3DVisual = function () {
        if (polygon3DConfig && isPolygon3DVisual) {
            console.log(polygon3DConfig, 'polygon3DConfig');
            console.log(_currentVisual, '_currentVisual');
            console.log(isPolygon3DVisual, 'isPolygon3DVisual');
            var colors = polygon3DConfig.colors, breaks = polygon3DConfig.breaks, colorType = polygon3DConfig.colorType;
            var _colors = colors;
            var isNumberColorType = colorType === 'numeric';
            var isTextColorType = colorType === 'text';
            if (isNumberColorType) {
                var dom = (React.createElement("div", { className: "".concat(prefixCls, "-content") },
                    React.createElement("div", { className: "".concat(prefixCls, "-content-title") },
                        React.createElement("div", { className: "".concat(prefixCls, "-text") },
                            React.createElement(TextShave, null, getShowTitle()))),
                    React.createElement("div", { style: { paddingLeft: 8 } },
                        React.createElement(NumberColorSegmentation, { direction: "column", breaks: breaks, icons: [getIcon(geometryType, defaultStyle)], colors: _colors, textClick: _textClick, ignore: polygon3DConfig.ignore, iconInfo: iconInfo, getPopupContainer: getPopupContainer }))));
                return dom;
            }
            if (isTextColorType) {
                var dom = (React.createElement("div", { className: "".concat(prefixCls, "-content") },
                    React.createElement("div", { className: "".concat(prefixCls, "-content-title") },
                        React.createElement("div", { className: "".concat(prefixCls, "-text") },
                            React.createElement(TextShave, null, getShowTitle()))),
                    React.createElement("div", { style: { paddingLeft: 8 } },
                        React.createElement(TextColorSegmentation, { column: 1, icons: [getIcon(geometryType, defaultStyle)], breaks: breaks, colors: _colors, textClick: _textClick, ignore: polygon3DConfig.ignore, iconInfo: iconInfo }))));
                return dom;
            }
        }
    };
    /**
     * todo 双地理 非流向图
     * 无可视化
     * 有可视化
     **/
    // const pointToPointVisual = () => {
    //   if (isPointToPoint && !isFlow) {
    //     console.log(currentVisualDetail, 'currentVisualDetail');
    //     console.log(isCurrentNumberVisual, 'isCurrentNumberVisual');
    //     const dom = (
    //       <div className={`${prefixCls}-content-normal`}>
    //         <MapVisualGeoIcon
    //           isFlow={isFlow}
    //           className={`${prefixCls}-icon`}
    //           type={geometryType}
    //           style={defaultStyle}
    //         />
    //         <div className={`${prefixCls}-title`}>
    //           <div className={`${prefixCls}-text`}>
    //             <TextShave>{getShowTitle()}</TextShave>
    //           </div>
    //         </div>
    //
    //         {isCurrentNumberVisual && (
    //           <div style={{ paddingLeft: 8 }}>
    //             <NumberColorSegmentation
    //               direction="column"
    //               icons={
    //                 geometryType === GEO_TYPES[GeometryType.point] ? currentVisualDetail.icons : []
    //               }
    //               breaks={currentVisualDetail.breaks}
    //               colors={currentVisualDetail.colors}
    //               textClick={_textClick}
    //               ignore={currentVisualDetail.ignore}
    //             />
    //           </div>
    //         )}
    //         {isCurrentTypeVisual && (
    //           <div style={{ paddingLeft: 8 }}>
    //             <TextColorSegmentation
    //               column={1}
    //               icons={
    //                 geometryType === GEO_TYPES[GeometryType.point]
    //                   ? currentVisualDetail.icons
    //                   : [getIcon(geometryType, defaultStyle)]
    //               }
    //               breaks={_getCurrentBreaks()}
    //               colors={currentVisualDetail.colors}
    //               textClick={_textClick}
    //               ignore={currentVisualDetail.ignore}
    //             />
    //           </div>
    //         )}
    //       </div>
    //     );
    //     return dom;
    //   }
    // };
    // 流向图部分
    var flowVisual = function () {
        if (isFlow) {
            if (currentVisualDetail.colorFieldId) {
                return (React.createElement("div", { className: "".concat(prefixCls, "-content") },
                    React.createElement("div", { className: "".concat(prefixCls, "-content-title") },
                        React.createElement("div", { className: "".concat(prefixCls, "-text") },
                            React.createElement(TextShave, null, getShowTitle()))),
                    currentVisualDetail.colorType === 'number' && (React.createElement("div", { style: { paddingLeft: 8 } },
                        React.createElement(NumberColorSegmentation, { direction: "column", icons: [getIcon('flow', defaultStyle)], breaks: currentVisualDetail.breaks, colors: currentVisualDetail.colors, textClick: _textClick, ignore: currentVisualDetail.ignore, iconInfo: iconInfo, getPopupContainer: getPopupContainer }))),
                    currentVisualDetail.colorType === 'type' && (React.createElement("div", { style: { paddingLeft: 8 } },
                        React.createElement(TextColorSegmentation, { column: 1, icons: [getIcon('flow', {})], breaks: _getCurrentBreaks(), colors: currentVisualDetail.colors, textClick: _textClick, ignore: currentVisualDetail.ignore, iconInfo: iconInfo })))));
            }
            if (!currentVisualDetail.colorFieldId) {
                return (React.createElement("div", { className: "".concat(prefixCls, "-content") },
                    React.createElement("div", { className: "".concat(prefixCls, "-content-title") },
                        React.createElement("div", { className: "".concat(prefixCls, "-text") },
                            React.createElement(TextShave, null, getShowTitle()))),
                    currentVisualDetail.colorType === 'number' && (React.createElement("div", { style: { paddingLeft: 8 } },
                        React.createElement(NumberColorSegmentation, { direction: "column", icons: [], breaks: currentVisualDetail.breaks, colors: currentVisualDetail.colors, textClick: _textClick, ignore: currentVisualDetail.ignore, iconInfo: iconInfo, getPopupContainer: getPopupContainer }))),
                    currentVisualDetail.colorType === 'type' && (React.createElement("div", { style: { paddingLeft: 8 } },
                        React.createElement(TextColorSegmentation, { column: 1, icons: [getIcon('flow', {})], breaks: _getCurrentBreaks(), colors: currentVisualDetail.colors, textClick: _textClick, ignore: currentVisualDetail.ignore, iconInfo: iconInfo })))));
            }
        }
    };
    return (React.createElement("div", { className: classNames(prefixCls, (_a = {},
            _a["".concat(prefixCls, "-hidden")] = hidden || !inRange,
            _a)), ref: ref },
        isStatic && (React.createElement("div", { className: "".concat(prefixCls, "-handle") },
            React.createElement("div", __assign({ className: "".concat(prefixCls, "-static") }, provided === null || provided === void 0 ? void 0 : provided.dragHandleProps),
                React.createElement(Icon, { icon: "drag-handle-cornor", size: 123 })))),
        !isStatic && (React.createElement("div", { className: "".concat(prefixCls, "-handle") },
            React.createElement("div", __assign({ className: "".concat(prefixCls, "-drag-handle") }, provided === null || provided === void 0 ? void 0 : provided.dragHandleProps),
                React.createElement(Icon, { icon: "drag-handle-cornor", size: 12 })))),
        currentVisualField && !hidden && (React.createElement("div", { className: classNames("".concat(prefixCls, "-content"), (_b = {},
                _b["".concat(prefixCls, "-content-pb0")] = hasVisualList,
                _b)) },
            React.createElement("div", { className: "".concat(prefixCls, "-content-title") },
                React.createElement(TextShave, null, getShowTitle())),
            isCurrentNumberVisual && (React.createElement("div", { style: { paddingLeft: 8 } },
                React.createElement(NumberColorSegmentation, { direction: "column", icons: isPoint || isPointToPoint
                        ? currentVisualDetail.icons
                        : [getIcon(geometryType, defaultStyle)], breaks: currentVisualDetail.breaks, colors: currentVisualDetail.colors, textClick: _textClick, ignore: currentVisualDetail.ignore, iconInfo: iconInfo, getPopupContainer: getPopupContainer }))),
            isCurrentTypeVisual && (React.createElement("div", { style: { paddingLeft: 8 } },
                React.createElement(TextColorSegmentation, { column: 1, icons: isPoint || isPointToPoint
                        ? currentVisualDetail.icons
                        : [getIcon(geometryType, defaultStyle)], breaks: _getCurrentBreaks(), colors: currentVisualDetail.colors, textClick: _textClick, ignore: currentVisualDetail.ignore, iconInfo: iconInfo }))),
            isHeat && (React.createElement("div", { className: "".concat(prefixCls, "-heat") },
                React.createElement(MapVisualGeoIcon, { isHeat: true, className: "".concat(prefixCls, "-icon"), type: geometryType === GEO_TYPES[GeometryType.pointToPoint]
                        ? GEO_TYPES[GeometryType.point]
                        : geometryType, style: isFlow || isHeat ? currentVisualDetail : defaultStyle }),
                React.createElement("div", { className: "".concat(prefixCls, "-visual-name") }, (currentVisualDetail === null || currentVisualDetail === void 0 ? void 0 : currentVisualDetail.name)
                    ? currentVisualDetail === null || currentVisualDetail === void 0 ? void 0 : currentVisualDetail.name
                    : "".concat(i18n.by, "\u201C").concat(currentVisualField, "\u201D").concat(currentDesText)))),
            size(sizeVisual) > 0 && (React.createElement("div", { className: "".concat(prefixCls, "-size-visual") },
                React.createElement("div", { className: "".concat(prefixCls, "-size-visual-icon") },
                    React.createElement(Icon, { icon: "location-size", size: 16 })),
                getCol({ uuid: uuid, fieldId: sizeVisual === null || sizeVisual === void 0 ? void 0 : sizeVisual.fieldId }))),
            hasVisualList && (React.createElement("div", { style: { padding: '0 2px', marginTop: 8 } }, map(visualList, function (v) {
                var _a = v || {}, id = _a.id, fieldId = _a.fieldId, isCurrent = _a.isCurrent, name = _a.name;
                if (isCurrent)
                    return null;
                var visualText = getDesText(id);
                var field = getCol({ uuid: uuid, fieldId: fieldId });
                if (fieldId === BY_COUNT) {
                    field = i18n.point;
                }
                var text = name ? name : "".concat(i18n.by, "\u201C ").concat(field, " \u201D").concat(visualText);
                var _onSelect = function () {
                    changeCurrentVisual({ id: id, fieldId: fieldId });
                };
                return (React.createElement(MapVisualListItem, { isSimpleCardsMode: true, key: id + fieldId, text: text, onSelect: _onSelect }));
            }))))),
        (!currentVisualField || hidden) && !isPolygon3DVisual && !isFlow && (React.createElement("div", { className: "".concat(prefixCls, "-content-normal") },
            React.createElement(MapVisualGeoIcon, { isHeat: isHeat, className: "".concat(prefixCls, "-icon"), type: geometryType, style: defaultStyle }),
            React.createElement("div", { className: "".concat(prefixCls, "-title") },
                React.createElement("div", { className: "".concat(prefixCls, "-text") },
                    React.createElement(TextShave, null, card.name))))),
        isPolygon3DVisual && polygon3DVisual(),
        isFlow && flowVisual(),
        React.createElement("div", { className: "".concat(prefixCls, "-action") },
            React.createElement(SimpleEye, { visible: !hidden, onClick: _changeHidden }))));
});
MapVisualSimpleCard.whyDidYouRender = true;
MapVisualSimpleCard.displayName = 'MapVisualSimpleCard';
var MapVisualSimpleCard$1 = MapVisualSimpleCard;

export { MapVisualSimpleCard$1 as default };
