import { _ as _extends } from '../_rollupPluginBabelHelpers-736b301a.js';
import React__default, { useState, useEffect, useMemo, useLayoutEffect, Component, useCallback, useRef } from 'react';
import { Button, Modal, Row, Col, Popover, Checkbox, message } from 'antd';
import 'moment';
import { Service as Service$1, Dict, BaseStore } from '@zenview/micro-basic-library';
import IconFont from '../IconFont/index.js';
import Picture from '../Picture/index.js';
import ___default, { flattenDeep } from 'lodash';
import HightLevel from '../HightLevel/index.js';
import ReactDOM from 'react-dom';
import QueueAnim from 'rc-queue-anim';
import { cache, treeHelper, uuid as uuid$1 } from '@zenview/micro-utils';
import Compressor from 'compressorjs';
import '../MoveContent/index.js';
import 'add-dom-event-listener';
import '../FullScreen/index.js';

class ModalFooter extends React__default.Component {
  constructor(...args) {
    super(...args);
    this.state = {
      loading: false
    };
    this.onSubmit = () => {
      this.setState({
        loading: true
      });
      const onOk = this.props.onOk();
      const judgeType = Object.prototype.toString.apply(onOk) === `[object Promise]`;
      if (judgeType) {
        onOk.then(() => {
          this.setState({
            loading: false
          });
        }).catch(() => {
          this.setState({
            loading: false
          });
        });
      } else {
        this.timer = setTimeout(() => {
          this.setState({
            loading: false
          });
        }, 200);
      }
    };
  }
  componentWillUnmount() {
    clearTimeout(this.timer);
    this.timer = null;
  }
  render() {
    const {
      className = '',
      onCancel,
      disabled,
      okText = '确认',
      cancelText = '取消'
    } = this.props;
    return /*#__PURE__*/React__default.createElement("div", {
      className: `modal-footer ${className}`
    }, /*#__PURE__*/React__default.createElement(Button, {
      onClick: () => onCancel()
    }, cancelText), /*#__PURE__*/React__default.createElement(Button, {
      onClick: this.onSubmit,
      htmlType: "submit",
      type: "primary",
      loading: this.state.loading,
      disabled: disabled
    }, okText));
  }
}

class ModalView extends React__default.Component {
  render() {
    const {
      className,
      onOk,
      disabled,
      onCancel,
      onFootCancel,
      hasFooter = true,
      otherModalFooter = null,
      children = null,
      okText = '确认',
      cancelText = '取消',
      ...props
    } = this.props;
    return /*#__PURE__*/React__default.createElement(Modal, _extends({
      className: `modal-component ${className}`
    }, props, {
      onCancel: onCancel,
      footer: null
    }), /*#__PURE__*/React__default.createElement("div", {
      className: "modal-content"
    }, children), otherModalFooter ? otherModalFooter : hasFooter && /*#__PURE__*/React__default.createElement(ModalFooter, {
      okText: okText,
      cancelText: cancelText,
      onCancel: onFootCancel || onCancel,
      disabled: disabled,
      onOk: onOk
    }));
  }
}

const mapLabelType = [{
  value: ["119903"],
  label: "基本属性",
  color: "#B9B5FF",
  name: 'basicAttributes'
}, {
  value: ["119904"],
  label: "身份",
  color: "#FF837D",
  name: 'identity'
}, {
  value: ["119905", "119922", "119923", "119924", "119925", "119926", "119927", "120131"],
  label: "外观规律",
  color: "#50E9B2",
  name: 'appearanceRule'
}, {
  value: ["119906", "119920"],
  label: "时空规律",
  color: "#54BEFF",
  name: 'spatioTemporalLaw'
}, {
  value: ["119907"],
  label: "行为规律",
  color: " #FFBB22",
  name: 'behaviorRule'
}];
const vehicleType = [{
  value: ["119929"],
  label: "身份",
  color: "#FF837D",
  name: 'identity'
}, {
  value: ["119928"],
  label: "时空规律",
  color: "#54BEFF",
  name: 'spatioTemporalLaw'
}];
const mapGeneration = [{
  "id": "1007053",
  "code": "100801",
  "name": "小孩",
  "typeCode": "100800",
  "icon": "icon-S_AID_AID_AgeBaby",
  "value": "100801",
  "label": "小孩",
  "typeName": "generation"
}, {
  "id": "1007052",
  "code": "100802",
  "name": "青年",
  "typeCode": "100800",
  "icon": "icon-S_AID_AID_AgeYoung",
  "value": "100802",
  "label": "青年",
  "typeName": "generation"
}, {
  "id": "1007111",
  "code": "100803",
  "name": "中年",
  "typeCode": "100800",
  "icon": "icon-S_AID_AID_AgeMen",
  "value": "100803",
  "label": "中年",
  "typeName": "generation"
}, {
  "id": "1007051",
  "code": "100804",
  "name": "老人",
  "typeCode": "100800",
  "icon": "icon-S_AID_AID_AgeOld",
  "value": "100804",
  "label": "老人",
  "typeName": "generation"
}];
function formartTagCodes$1(list = [], isNoTree) {
  list.forEach(item => {
    item.value = item.code = item.dicCode;
    item.typeCode = item.superTag;
    item.label = item.tagName;
    const group = mapLabelType.find(v => v.value.indexOf(item.tagGroup) > -1);
    if (group) {
      item.tagColor = group.color;
    }
  });
  if (isNoTree) {
    return list;
  }
  return computTreeList(list, "code", "typeCode");
}
function computTreeList(list, id = 'id', pid = 'parentId', isNoDeep) {
  let treeData;
  if (!isNoDeep) {
    treeData = window._.cloneDeep(list);
  } else {
    treeData = list;
  }
  let treeMap = {};
  treeData.forEach(v => {
    treeMap[v[id]] = v;
  });
  let arr = [];
  for (let i = 0, l = treeData.length; i < l; i++) {
    const item = treeData[i];
    let hasParent = false;
    if (item[pid] && treeMap[item[pid]]) {
      hasParent = true;
      const item2 = treeMap[item[pid]];
      !Array.isArray(item2.children) && (item2.children = []);
      item2.children.push(item);
    }
    !hasParent && arr.push(i);
  }
  treeMap = null;
  return treeData.filter((_, index) => arr.includes(index));
}

/**
 * 生成UUID
 */
function uuid() {
  let s = [];
  let hexDigits = '0123456789abcdef';
  for (let i = 0; i < 36; i++) {
    s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1);
  }
  s[14] = '4';
  s[19] = hexDigits.substr(s[19] & 0x3 | 0x8, 1);
  s[8] = s[13] = s[18] = s[23] = '-';
  let uuidStr = s.join('');
  return uuidStr;
}
const simpleGrid = {
  xxl: 4,
  xl: 6,
  lg: 6,
  md: 7,
  sm: 24,
  xs: 24
};
function computedCuurentGrid() {
  const width = document.body.clientWidth;
  if (width >= 1600) {
    return "xxl";
  }
  if (width >= 1200 && width < 1600) {
    return "xl";
  }
  if (width >= 992 && width < 1200) {
    return "lg";
  }
  if (width >= 768 && width < 992) {
    return "md";
  }
  if (width >= 576 && width < 768) {
    return "sm";
  }
  if (width < 576) {
    return "xs";
  }
}

/**
 * 带删除的盒子
 * @param props
 * @constructor
 */
const BoxDel = props => {
  const [show, setShow] = useState(false);
  const {
    style = {},
    className = '',
    ...params
  } = props;
  const styles = {
    position: 'absolute',
    width: '100%',
    height: '100%',
    backgroundColor: 'rgba(0,0,0,.2)',
    display: show ? 'flex' : 'none'
  };
  const iconBoxStyle = {
    style: {
      position: 'absolute',
      top: 'calc(100% / 2 /2)',
      left: 'calc(100% / 2 / 2)',
      overflow: 'hidden',
      width: 'calc(100% /2)',
      height: 'calc(100% /2)',
      borderRadius: '50%',
      backgroundColor: 'rgb(255, 255, 255)'
    }
  };
  const iconStyle = {
    style: {
      marginTop: 'calc(100% /2 /2)'
    }
  };
  const toggleShow = () => setShow(!show);
  return /*#__PURE__*/React__default.createElement("div", _extends({
    className: `lm-c-normol-box ${className}`,
    style: {
      ...style,
      position: 'relative'
    }
  }, params, {
    onMouseOver: () => toggleShow(),
    onMouseOut: () => toggleShow()
  }), /*#__PURE__*/React__default.createElement("div", {
    style: {
      ...style,
      ...styles
    }
  }, /*#__PURE__*/React__default.createElement("div", iconBoxStyle, /*#__PURE__*/React__default.createElement(IconFont, _extends({
    type: "icon-XL_Box_Delete"
  }, iconStyle, {
    onClick: () => props.delImgHandel && props.delImgHandel()
  })))), props.children);
};

/**
 * @普通继承父级宽高的盒子
 * @param {*} props
 */
const Box = props => {
  const {
    className = '',
    style = {},
    children,
    ...params
  } = props;
  return /*#__PURE__*/React__default.createElement("div", _extends({
    className: `lm-c-normol-box ${className}`
  }, params, {
    style: style
  }), children);
};

/**
 * @带小标题和操作icon的盒子
 * @param {*} props
 */
const BoxDesc = props => {
  const {
    className = '',
    title,
    icon,
    operationExt,
    iconTest,
    wrapStyle,
    children,
    ...params
  } = props;
  return /*#__PURE__*/React__default.createElement(Row, {
    className: `lm-c-box-desc ${className}`
  }, /*#__PURE__*/React__default.createElement(Row, {
    className: "lm-c-boxdesc-title",
    type: "flex",
    align: "middle"
  }, /*#__PURE__*/React__default.createElement(Col, {
    className: "desc-title",
    span: 12
  }, title), /*#__PURE__*/React__default.createElement(Col, {
    className: "desc-info",
    span: 12
  }, operationExt, icon && /*#__PURE__*/React__default.createElement(IconFont, {
    type: icon
  }), iconTest)), /*#__PURE__*/React__default.createElement(Col, _extends({
    className: "lm-c-boxdesc-content",
    span: 24,
    style: wrapStyle
  }, params), children));
};

/**
 * @带小标题和操作icon的盒子
 * @param {*} props
 * @param {node} iconOperation 右侧拓展
 */
const BoxOperational = props => {
  const {
    iconOperation,
    ...params
  } = props;
  return /*#__PURE__*/React__default.createElement(BoxDesc, _extends({
    operationExt: iconOperation
  }, params));
};

/**
 * @带padding
 * @param {*} props
 */
const PaddingBox$1 = function (props) {
  const {
    className = '',
    ...params
  } = props;
  return /*#__PURE__*/React__default.cloneElement(/*#__PURE__*/React__default.createElement(Box, params), {
    className: `lm-c-padding-box ${className}`
  });
};
const LabelBoxDesc = function (props) {
  const {
    className = '',
    ...params
  } = props;
  return /*#__PURE__*/React__default.cloneElement(/*#__PURE__*/React__default.createElement(BoxDesc, params), {
    className: `lm-c-padding-label-box-desc ${className}`,
    style: {
      padding: '20px 40px '
    }
  });
};

/**
 * 场所、设备档案模块的box
 * @param {*} props
 * @param {node} iconOperation header右侧按钮拓展
 */
const CustomHeaderBox = function (props) {
  const {
    className = '',
    iconOperation,
    ...params
  } = props;
  return /*#__PURE__*/React__default.cloneElement(/*#__PURE__*/React__default.createElement(BoxDesc, _extends({
    operationExt: iconOperation
  }, params)), {
    className: `lm-c-padding-label-box-desc ${className}`,
    style: {
      padding: '0'
    }
  });
};

/**
 * @盒子两端对齐
 * @param {*} props
 */
const BetweenBox = function (props) {
  const {
    children,
    className = '',
    ...params
  } = props;
  return /*#__PURE__*/React__default.createElement("div", _extends({
    className: `lm-c-between-box ${className}`
  }, params), children);
};

/**
 * @系统设置下table使用
 * @param {*} props
 */
const TableBox = function (props) {
  const {
    className = '',
    style,
    ...params
  } = props;
  return /*#__PURE__*/React__default.cloneElement(/*#__PURE__*/React__default.createElement(BoxDesc, params), {
    className: `lm-c-table-box-desc ${className}`,
    style: {
      padding: 'unset',
      border: 'unset',
      ...style
    }
  });
};
const customStyle = {
  fullScreen: {
    xxl: {
      span: 14,
      offset: 5
    },
    xl: {
      span: 20,
      offset: 2
    },
    lg: {
      span: 24
    },
    md: {
      span: 24
    },
    sm: {
      span: 24
    },
    xs: {
      span: 24
    }
  },
  rightScreen: {
    xxl: {
      span: 16,
      offset: 4
    },
    xl: {
      span: 20,
      offset: 2
    },
    lg: {
      span: 20,
      offset: 2
    },
    md: {
      span: 24
    },
    sm: {
      span: 24
    },
    xs: {
      span: 24
    }
  },
  listScreen: {
    xxl: {
      span: 20,
      offset: 2
    },
    xl: {
      span: 20,
      offset: 2
    },
    lg: {
      span: 22,
      offset: 1
    },
    md: {
      span: 22,
      offset: 1
    },
    sm: {
      span: 22,
      offset: 1
    },
    xs: {
      span: 22,
      offset: 1
    }
  }
};
/**
 * @详情居中的盒子
 * @param {*} props
 */
const InfoBox = props => {
  const {
    className = '',
    children,
    grid
  } = props;
  let gridStyle = grid ? customStyle[grid] : customStyle.fullScreen;
  return /*#__PURE__*/React__default.createElement(Row, {
    className: `lm-c-center-info-box ${className}`
  }, /*#__PURE__*/React__default.createElement(Col, gridStyle, children));
};

/**
 * @列表剧中盒子
 * @param {*} props
 */
const ListBox = props => {
  const {
    className = '',
    children,
    style = {},
    offsetOptions = {
      xxl: 2,
      xl: 1
    }
  } = props;
  const offsetGrad = computedCuurentGrid();
  const [offset, setOffset] = useState(offsetOptions[offsetGrad] ? offsetOptions[offsetGrad] : 0);
  useEffect(() => {
    window.addEventListener('resize', resize);
    return () => {
      window.removeEventListener('resize', resize);
    };
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);
  function resize() {
    const offsetGrad = computedCuurentGrid();
    setOffset(offsetOptions[offsetGrad] ? offsetOptions[offsetGrad] : 0);
  }
  const paddingRow = useMemo(() => `${offset === 0 ? '20px' : 100 / 24 * offset + '%'}`, [offset]);
  return /*#__PURE__*/React__default.createElement(PaddingBox$1, {
    style: {
      padding: '20px 0',
      ...style
    },
    className: className
  }, /*#__PURE__*/React__default.cloneElement(children, {
    paddingRow
  }));
};
const MaskBox = props => {
  const {
    open = false,
    style = {},
    ...params
  } = props;
  return /*#__PURE__*/React__default.createElement(Box, _extends({
    style: {
      ...style,
      position: 'relative'
    }
  }, params), params.children, open && /*#__PURE__*/React__default.createElement(Box, {
    style: {
      position: 'absolute',
      left: 0,
      top: 0,
      zIndex: 99
    }
  }));
};
var Box$1 = {
  Box,
  BoxDesc,
  PaddingBox: PaddingBox$1,
  LabelBoxDesc,
  BetweenBox,
  TableBox,
  InfoBox,
  ListBox,
  BoxOperational,
  MaskBox,
  CustomHeaderBox,
  BoxDel
};

const typeArr$1 = [{
  label: '人员档案',
  type: 'person',
  title: "总人数"
}, {
  label: '设备档案',
  type: 'device',
  title: "设备总数"
}, {
  label: '场所档案',
  type: 'place',
  title: "场所总数"
}, {
  label: '房屋档案',
  type: 'house',
  title: "房屋总数"
}, {
  label: '车辆档案',
  type: 'vehicle',
  title: "总车数"
}];
class Header extends React__default.Component {
  constructor(props) {
    super(props);
    this.state = {};
  }
  render() {
    let {
      nums,
      type,
      countLoading
    } = this.props;
    let lable = "";
    let title = "";
    typeArr$1.forEach(v => {
      if (v.type === type) {
        return lable = v.label, title = v.title;
      }
    });
    return /*#__PURE__*/React__default.createElement("div", {
      className: "personnel-header"
    }, /*#__PURE__*/React__default.createElement("p", {
      className: "header-title"
    }, lable), !countLoading ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("p", {
      className: "sub-header-title"
    }, title), /*#__PURE__*/React__default.createElement(Row, {
      className: "header-title-nums font-resource-normal"
    }, nums.map((v, k) => isNaN(v * 1) ? /*#__PURE__*/React__default.createElement(Col, {
      className: "header-title-comma animate-num",
      key: k
    }, "\uFF0C") : /*#__PURE__*/React__default.createElement(Col, {
      className: "header-title-num animate-num",
      key: k
    }, v)))) : /*#__PURE__*/React__default.createElement("div", {
      className: "header-title-loading"
    }));
  }
}

class ModalSelectRectImage extends React__default.Component {
  constructor(...args) {
    super(...args);
    // 框选搜图结果
    this.getSelectResult = async selectResultCb => {
      const imagePath = await selectResultCb();
      const {
        onClickSelectRect
      } = this.props;
      onClickSelectRect && onClickSelectRect(imagePath);
    };
  }
  render() {
    const {
      className,
      lazyLoad,
      url,
      rects,
      onClickDefaultRect,
      hasFooter = true,
      ...rest
    } = this.props;
    return /*#__PURE__*/React__default.createElement(ModalView, _extends({
      className: `picture-rect-modal ${!hasFooter ? "picture-rect-modal-no-footer" : ""} ${className}`,
      destroyOnClose: true,
      hasFooter: false
    }, rest), /*#__PURE__*/React__default.createElement(Picture, {
      lazyLoad: lazyLoad,
      imagePath: url,
      size: {
        width: 960,
        height: 540
      },
      key: url,
      showDefaultRect: false,
      showRect: true,
      rects: rects,
      onClickRect: item => onClickDefaultRect(item),
      disabledDrag: true,
      hasTool: false
    }, ({
      getSelectResult,
      changeSelectStatus,
      isOpenSelect,
      isOverSelect
    }) => hasFooter ? /*#__PURE__*/React__default.createElement("div", {
      className: "picture-rect-footer"
    }, /*#__PURE__*/React__default.createElement("div", {
      className: "footer-button",
      onClick: () => changeSelectStatus(!isOpenSelect)
    }, /*#__PURE__*/React__default.createElement(IconFont, {
      type: "icon-S_View_SearchBox"
    }), isOpenSelect ? "取消" : "手动", "\u6846\u9009"), isOpenSelect && isOverSelect && /*#__PURE__*/React__default.createElement("div", {
      className: "footer-button",
      onClick: () => this.getSelectResult(getSelectResult)
    }, /*#__PURE__*/React__default.createElement(IconFont, {
      type: "icon-S_Edit_ImgSearch"
    }), "\u641C\u7D22\u622A\u56FE")) : null));
  }
}

function SingleTag(props) {
  let {
    onSelect,
    className = '',
    style,
    isGroup,
    suffix,
    isActive = false,
    selectKeys = [],
    disabled,
    item,
    ...params
  } = props;
  // prettier-ignore
  // eslint-disable-next-line react-hooks/exhaustive-deps
  const flag = useMemo(() => item.children ? ___default.intersection(selectKeys, item.children.map(v => v.code)).length > 0 : selectKeys.indexOf(item.code) > -1, [item, selectKeys.toString()]);
  const codeStr = useMemo(() => item.code && item.code.indexOf && item.code.indexOf(',') > -1 ? item.code.split(',').join('-') : item.code, [item.code]);
  const classNameForCode = useMemo(() => `lm-tag-item-${codeStr}`, [codeStr]);
  const isSelectedClass = useMemo(() => flag || isActive ? `lm-tag-item-selected-${codeStr}` : '', [codeStr, flag, isActive]);
  return /*#__PURE__*/React__default.createElement("div", _extends({
    className: `lm-tag-item ${disabled ? 'lm-tag-item-disabled' : ''} ${className} ${classNameForCode} ${isSelectedClass}`,
    style: style,
    onClick: () => !disabled && !isGroup && onSelect && onSelect(item)
  }, params), /*#__PURE__*/React__default.createElement("p", null), item.label, suffix, /*#__PURE__*/React__default.createElement("style", {
    jsx: "true"
  }, `
          .${classNameForCode} {
            border-color: var(--bg-lv2);
            color: var(--text-light);
          }
          .${classNameForCode} p {
            border-top-color: var(--bg-lv2);
            border-left-color: var(--bg-lv2);
          }
          .${classNameForCode}:not(.lm-tag-item-disabled):hover${isSelectedClass ? ` ,.${isSelectedClass}` : ''} {
            border-color: ${item.tagColor ? item.tagColor : 'var(--primary)'} !important;
            color: ${item.tagColor ? item.tagColor : 'var(--primary)'} !important;
          }
          .${classNameForCode}:not(.lm-tag-item-disabled):hover p${isSelectedClass ? ` ,.${isSelectedClass} p` : ''} {
            border-top-color: ${item.tagColor ? item.tagColor : 'var(--primary)'} !important;
            border-left-color: ${item.tagColor ? item.tagColor : 'var(--primary)'} !important;
          }
        `));
}
function MutipleTag(props) {
  let {
    onSelect,
    item,
    style,
    selectKeys,
    isActive,
    isMultiple = true,
    disabled
  } = props;
  const RenderComponent = useMemo(() => isMultiple ? MutipleGroupTagContent : SingleGroupTagContent, [isMultiple]);
  const [visible, setVisible] = useState(false);
  function visibleChange(flag) {
    setVisible(flag);
  }
  return /*#__PURE__*/React__default.createElement(Popover, {
    placement: "bottom",
    trigger: "click",
    overlayClassName: "mutiple-tag-popover-box",
    onVisibleChange: visibleChange,
    content: /*#__PURE__*/React__default.createElement(RenderComponent, {
      onSelect: onSelect,
      group: item.children,
      selectKeys: selectKeys,
      disabled: disabled
    })
  }, /*#__PURE__*/React__default.createElement(SingleTag, {
    item: item,
    style: style,
    isActive: isActive,
    disabled: disabled,
    isGroup: true,
    selectKeys: selectKeys,
    suffix: /*#__PURE__*/React__default.createElement(IconFont, {
      className: `tag-popup-allow ${visible ? 'tag-popup-allow-open' : ''}`,
      type: "icon-S_Arrow_SmallDown"
    })
  }));
}
function SingleGroupTagContent({
  group = [],
  onSelect,
  disabled,
  selectKeys = []
}) {
  return /*#__PURE__*/React__default.createElement("ul", {
    className: "mutiple-tag-group"
  }, group.map(v => /*#__PURE__*/React__default.createElement("li", {
    key: v.code,
    className: `${disabled ? 'lm-tag-item-disabled' : ''} ${selectKeys.indexOf(v.code) > -1 ? 'tag-group-item-active' : ''}`,
    onClick: e => {
      e.preventDefault();
      e.stopPropagation();
      !disabled && onSelect(v, group);
    }
  }, /*#__PURE__*/React__default.createElement("span", {
    className: "lm-c-tag-label"
  }, v.label))));
}
function MutipleGroupTagContent({
  group = [],
  onSelect,
  disabled,
  selectKeys = []
}) {
  return /*#__PURE__*/React__default.createElement("ul", {
    className: "mutiple-tag-group mutiple-check-tag-group"
  }, group.map(v => {
    const isActive = selectKeys.indexOf(v.code) > -1;
    return /*#__PURE__*/React__default.createElement("li", {
      key: v.code,
      className: `${disabled ? 'lm-tag-item-disabled' : ''} ${isActive ? 'tag-group-item-active' : ''}`,
      onClick: e => {
        e.preventDefault();
        e.stopPropagation();
        !disabled && onSelect(v);
      }
    }, /*#__PURE__*/React__default.createElement(Checkbox, {
      disabled: disabled,
      checked: isActive
    }), /*#__PURE__*/React__default.createElement("span", {
      className: "lm-c-tag-label"
    }, v.label));
  }));
}

class TagInput extends React__default.Component {
  constructor(props) {
    super(props);
    this.onFocusInput = () => {
      this.isFocus = true;
      document.addEventListener('keydown', this.debouncePress, false);
      this.props.openTagSelect();
    };
    this.onBlurInput = () => {
      this.isFocus = false;
      document.removeEventListener('keydown', this.debouncePress, false);
    };
    this.onCompositionStart = () => {
      this.isOnComposition = true;
    };
    this.onCompositionEnd = e => {
      this.isOnComposition = false;
      this.props.onInputChange(e.target.value);
    };
    this.handleChange = e => {
      if (!this.isOnComposition) {
        this.props.onInputChange(e.target.value);
      }
      this.setState({
        value: e.target.value
      });
    };
    this.debouncePress = async e => {
      if (e.code === 'Backspace') {
        this.isOnComposition = false;
        this.debounced && this.debounced.cancel();
        this.debounced = ___default.debounce(() => this.deleteForPress(e), 200);
        this.debounced();
      }
      if (e.code === 'Enter') {
        await this.props.onInputChange(this.state.value, false);
        this.props.onSearch();
      }
    };
    this.deleteForPress = e => {
      const {
        pictureUrl,
        selectList
      } = this.props;
      if (!this.props.keywords && e.code === 'Backspace' && (selectList.length > 0 || !!pictureUrl)) {
        if (selectList.length > 0) {
          return this.props.deleteTag(selectList[selectList.length - 1]);
        }
        this.props.deleteImg();
      }
    };
    this.computedVisible = e => {
      const classList = ['search-image-input-view', 'tag-box-popup', 'mutiple-tag-popover-box', 'modal-select-face'];
      const path = e.path || [];
      let current = path.find(v => {
        let flag = false;
        if (!v.classList) {
          return flag;
        }
        const classNames = Array.from(v.classList);
        for (let i = 0; i < classList.length; i++) {
          if (classNames.indexOf(classList[i]) > -1) {
            flag = true;
            break;
          }
        }
        return flag;
      });
      if (!current) {
        this.props.closePortal && this.props.closePortal();
      }
    };
    this.state = {
      value: props.keywords || ''
    };
    this.isFocus = false;
    this.isOnComposition = false;
    this.inputRef = /*#__PURE__*/React__default.createRef();
  }
  static getDerivedStateFromProps(props, state) {
    if (props.keywords && state.value === '') {
      return {
        value: props.keywords
      };
    }
    return null;
  }
  componentDidMount() {
    document.body.addEventListener('click', this.computedVisible, false);
  }
  componentWillUnmount() {
    this.inputRef = null;
    document.body.removeEventListener('click', this.computedVisible, false);
    document.removeEventListener('keydown', this.debouncePress, false);
  }
  autoFocusInput() {
    this.inputRef.current.focus();
  }
  clearInput() {
    this.setState({
      value: ''
    });
  }
  render() {
    let {
      pictureUrl,
      selectList,
      type,
      placeholder,
      disabled
    } = this.props;
    return /*#__PURE__*/React__default.createElement("div", {
      className: "search-image-input-view"
    }, !disabled && /*#__PURE__*/React__default.createElement("div", {
      className: "object-search-btn"
    }, /*#__PURE__*/React__default.createElement(IconFont, {
      onClick: async () => {
        await this.props.onInputChange(this.state.value, false);
        this.props.onSearch();
      },
      type: "icon-M_Bar_Search"
    })), /*#__PURE__*/React__default.createElement("div", {
      className: "input-image-box"
    }, /*#__PURE__*/React__default.createElement(ImagePrev, {
      disabled: disabled,
      imgUrl: pictureUrl,
      onDeleteImg: this.props.deleteImg
    }), /*#__PURE__*/React__default.createElement(SelectedTags, {
      disabled: disabled,
      list: selectList,
      onDeleteTag: this.props.deleteTag
    }), /*#__PURE__*/React__default.createElement("input", {
      disabled: disabled,
      ref: this.inputRef,
      onChange: this.handleChange,
      type: "text",
      onFocus: this.onFocusInput,
      onBlur: this.onBlurInput,
      value: this.state.value,
      onCompositionEnd: this.onCompositionEnd,
      onCompositionStart: this.onCompositionStart,
      className: "search-image-input",
      placeholder: disabled ? '' : placeholder
    })), type === 'person' && !disabled && /*#__PURE__*/React__default.createElement("div", {
      className: "object-search-btn"
    }, /*#__PURE__*/React__default.createElement(IconFont, {
      onClick: this.props.openImgUpload,
      type: "icon-L_Bar_AddImg"
    })), type === 'vehicle' && !disabled && /*#__PURE__*/React__default.createElement("div", {
      className: "object-search-btn"
    }, /*#__PURE__*/React__default.createElement(IconFont, {
      onClick: this.props.openImgUpload,
      type: "icon-L_Bar_AddImg"
    })));
  }
}
function SelectedTags({
  list = [],
  onDeleteTag,
  disabled
}) {
  if (list.length === 0) {
    return null;
  }
  return list.map(v => {
    return /*#__PURE__*/React__default.createElement(SingleTag, {
      key: v.code,
      item: v,
      isActive: true,
      suffix: disabled ? null : /*#__PURE__*/React__default.createElement("span", {
        onClick: () => onDeleteTag(v),
        className: `label-item-suffix-view `
      }, /*#__PURE__*/React__default.createElement(IconFont, {
        type: "icon-S_Edit_LineClose"
      }))
    });
  });
}
function ImagePrev({
  imgUrl,
  onDeleteImg,
  disabled
}) {
  if (!imgUrl) {
    return null;
  }
  return /*#__PURE__*/React__default.createElement(Popover, {
    placement: "bottom",
    overlayClassName: "input-image-overlay",
    content: /*#__PURE__*/React__default.createElement("div", {
      className: "picture-box"
    }, /*#__PURE__*/React__default.createElement("img", {
      className: "picture-img",
      src: imgUrl,
      alt: ""
    }))
  }, /*#__PURE__*/React__default.createElement("div", {
    className: "select-img-box"
  }, /*#__PURE__*/React__default.createElement("img", {
    src: imgUrl,
    className: "header-img",
    alt: ""
  }), !disabled && /*#__PURE__*/React__default.createElement(IconFont, {
    type: "icon-S_Edit_LineClose",
    className: "header-img-close",
    theme: "outlined",
    onClick: onDeleteImg
  }), /*#__PURE__*/React__default.createElement("div", {
    className: "modal-img"
  })));
}

/*
 * @Author: your name
 * @Date: 2020-03-02 09:55:44
 * @LastEditTime: 2020-03-17 18:12:14
 * @LastEditors: your name
 * @Description: In User Settings Edit
 * @FilePath: \lingmou-frame\src\businessComponents\Tags\TabHeader\index.js
 */
const typeArr = [{
  label: '找人',
  placeholder: '请输入人员各标签属性、经过的摄像机或场所查询',
  type: 'person'
}, {
  label: '找摄像机',
  placeholder: '请输入摄像机关键字查询，如摄像机名称',
  type: 'device'
}, {
  label: '找场所',
  placeholder: '请输入场所关键字查询，如场所名称',
  type: 'place'
}, {
  label: '找房屋',
  placeholder: '请输入场所关键字查询，如场所名称',
  type: 'house'
}, {
  label: '找车',
  placeholder: '请输入车牌号、经过场所和摄像机查询',
  type: 'vehicle'
}];
function TabHeader({
  objectTypes = [],
  onTypeChange
}) {
  const [type, setType] = useState(objectTypes[0]);
  const types = useMemo(() => typeArr.filter(v => objectTypes.indexOf(v.type) > -1), [objectTypes]);
  const tabClick = function (t) {
    if (t !== type) {
      setType(t);
      onTypeChange(t);
    }
  };
  return /*#__PURE__*/React__default.createElement("div", {
    className: "tab-header-view"
  }, types.map(v => {
    return /*#__PURE__*/React__default.createElement("div", {
      key: v.type,
      onClick: () => tabClick(v.type),
      className: `tab-header-view-item ${v.type === type ? 'tab-header-view-item-active' : ''}`
    }, v.label);
  }));
}
var TabHeader$1 = /*#__PURE__*/React__default.memo(TabHeader);

/*
 * @Author: your name
 * @Date: 2020-03-02 09:55:44
 * @LastEditTime: 2020-03-18 14:08:47
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \lingmou-frame\src\businessComponents\Tags\TagPortal\KeywordsList.js
 */
function KeywordsList({
  list = [],
  keywords,
  onClick,
  selectKeys
}) {
  if (list.length === 0) {
    return null;
  }
  return /*#__PURE__*/React__default.createElement("div", {
    className: "tag-keywords-list"
  }, list.map((v, k) => {
    return /*#__PURE__*/React__default.createElement("div", {
      key: k,
      className: `tag-keywords-item ${selectKeys.indexOf(v.id) > -1 ? "tag-keywords-item-active" : ""}`,
      onClick: () => onClick(v, "keyword")
    }, /*#__PURE__*/React__default.createElement(IconFont, {
      type: "icon-S_Edit_Search",
      theme: "outlined"
    }), /*#__PURE__*/React__default.createElement(HightLevel, {
      keyword: keywords,
      name: v.description
    }), /*#__PURE__*/React__default.createElement("span", {
      style: {
        marginLeft: '12px'
      }
    }, v.plateOwnerName && /*#__PURE__*/React__default.createElement(HightLevel, {
      keyword: keywords,
      name: v.plateOwnerName
    })));
  }));
}

function Portal({
  className,
  content,
  visible,
  focusRender,
  children,
  getContainer,
  ...props
}) {
  const ele = useMemo(() => {
    const div = document.createElement('div');
    div.className = className;
    return div;
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, []);
  const renderContent = useMemo(() => {
    if (visible || focusRender) {
      return content || children;
    } else {
      return null;
    }
  }, [visible, content, children, focusRender]);
  // eslint-disable-next-line react-hooks/exhaustive-deps
  const container = useMemo(() => getContainer(), [getContainer()]);
  useLayoutEffect(() => {
    container && container.appendChild(ele);
    return () => ele.remove();
  }, [ele, container]);
  useLayoutEffect(() => {
    if (focusRender) {
      ele.style.display = visible ? 'block' : 'none';
    }
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [visible, focusRender]);
  return /*#__PURE__*/ReactDOM.createPortal(renderContent, ele);
}
Portal.defaultProps = {
  className: '',
  focusRender: false,
  visible: true,
  getContainer: () => document.body
};
var Portal$1 = /*#__PURE__*/React__default.memo(Portal);

var config = {
  api: '/api/',
  communityApi: '/communityApi/',
  version: 'v1',
  version2: 'v2'
};

const {
  api,
  communityApi,
  version,
  version2
} = config;
var URL = {
  //根据关键字全⽂检索查询标签既推荐列表
  plateRecommend: {
    value: `${api}vehicle/archive/v2/plateRecommend`,
    label: '根据关键字全⽂检索查询标签）',
    requestId: 'plateRecommend'
  },
  //查人的推荐列表
  personRecommend: {
    value: `${api}person/v2/graph/personRecommend`,
    label: ' 查询人的推荐列表',
    requestId: 'personRecommend'
  },
  //查设备的推荐列表
  personRecommendPage: {
    value: `${api}person/v2/graph/personRecommendPage`,
    label: ' 查询设备的推荐列表',
    requestId: 'personRecommendPage'
  },
  getTagsByCondition: {
    value: `${api}tag/${version}/getTagsByCondition`,
    label: "获取用户键值对信息",
    requestId: "getTagsByCondition"
  },
  uploadPersonPicture: {
    value: `${api}person/${version}/upload/uploadPersonPicture`,
    label: '人员档案上传图片搜索',
    requestId: 'uploadPersonPicture'
  },
  getFaceFeature: {
    value: `${api}disa/${version}/face/getFeature`,
    label: 'Url人脸特征值提取',
    requestId: 'getFeature'
  },
  getVehicleFeature: {
    value: `${api}vehicle/${version}/getFeatures`,
    label: 'Url车辆特征值提取',
    requestId: 'getFeature'
  },
  uploadPersonPicture: {
    value: `${api}person/${version}/upload/uploadPersonPicture`,
    label: '人员档案上传图片搜索',
    requestId: 'uploadPersonPicture'
  },
  queryUserDevicesNew: {
    value: `${api}device/${version}/queryDevices4User`,
    requestId: 'queryUserDevicesNew',
    label: '查询设备' // 用户总设备列表
  },
  queryUserDevicesStatusNew: {
    value: `${api}device/${version}/queryDeviceStatus4User`,
    requestId: 'queryUserDevicesStatusNew',
    label: '查询设备状态' // 用户总设备列表
  },
  getKvStoreByKey: {
    value: `${api}user/userKvStore/${version}/getKvStoreByKey`,
    label: "获取用户键值对信息",
    requestId: "getKvStoreByKey"
  }
};

const getHeaders = () => {
  return {
    Authorization: cache.getCache('token', 'session')
  };
};
class Player {
  plateRecommend(data) {
    return Service$1.$http({
      headers: getHeaders(),
      url: URL.plateRecommend.value,
      data: data,
      method: 'POST',
      requestId: URL.plateRecommend.requestId
    });
  }
  //新的查询接口
  personRecommend(option) {
    return Service$1.$http({
      headers: getHeaders(),
      url: URL.personRecommend.value,
      method: 'post',
      data: option,
      requestId: URL.personRecommend.requestId
    });
  }
  //根据分组查询标签
  getTagsByCondition(data) {
    return Service$1.$http({
      headers: getHeaders(),
      url: URL.getTagsByCondition.value,
      method: "post",
      data,
      requestId: URL.getTagsByCondition.requestId
    });
  }
  /**
   * @desc Url人脸特征值提取
   * @param {Object} data
   */
  getFaceFeature(data) {
    return Service$1.$http({
      headers: getHeaders(),
      url: URL.getFaceFeature.value,
      method: "post",
      data,
      requestId: URL.getFaceFeature.requestId
    });
  }
  /**
   * @desc Url人脸特征值提取
   * @param {Object} data
   */
  getVehicleFeature(data) {
    return Service$1.$http({
      headers: getHeaders(),
      url: URL.getVehicleFeature.value,
      method: "post",
      data,
      requestId: URL.getVehicleFeature.requestId
    });
  }
  /**
   * @desc 人员档案上传图片搜索
   * @param {Object} data
   */
  uploadPersonPicture(data) {
    return Service$1.$httpMultiPartInstance({
      headers: getHeaders(),
      url: URL.uploadPersonPicture.value,
      data: data,
      method: 'POST',
      requestId: URL.uploadPersonPicture.requestId
    });
  }
  //设备推荐的查询接口
  personRecommendPage(option) {
    return Service$1.$http({
      headers: getHeaders(),
      url: URL.personRecommendPage.value,
      method: 'post',
      data: option,
      requestId: URL.personRecommendPage.requestId
    });
  }
  /**
   * @desc 获取用户的所有设备 全局用 NEW
   * @param {*} data
   */
  queryUserDevicesNew(data) {
    return Service$1.$http({
      headers: getHeaders(),
      url: URL.queryUserDevicesNew.value,
      method: 'post',
      data,
      requestId: URL.queryUserDevicesNew.requestId
    });
  }
  queryUserDevicesStatusNew(data) {
    return Service$1.$http({
      headers: getHeaders(),
      url: URL.queryUserDevicesStatusNew.value,
      method: 'post',
      data,
      requestId: URL.queryUserDevicesStatusNew.requestId
    });
  }
  getKvStoreByKey(option) {
    return Service$1.$http({
      headers: getHeaders(),
      url: URL.getKvStoreByKey.value,
      method: "post",
      data: option,
      requestId: URL.getKvStoreByKey.requestId
    });
  }
}
var Service = new Player();

const formartTagCodes = (list, labelType, isNoTree) => {
  list.forEach(item => {
    item.value = item.code = item.dicCode;
    item.typeCode = item.superTag;
    item.label = item.tagName;
    const group = labelType.find(v => v.value.indexOf(item.tagGroup) > -1);
    if (group) {
      item.tagColor = group.color;
    }
  });
  if (isNoTree) {
    return list;
  }
  return treeHelper.computTreeList(list, "code", "typeCode");
};
const getVehicleTagList = async (isNoTree = true) => {
  let tagGroups = flattenDeep(vehicleType.map(v => v.value));
  let res = await Service.getTagsByCondition({
    tagGroups
  });
  return formartTagCodes(res.data, [], isNoTree);
};

/*
 * @Author: your name
 * @Date: 2020-03-02 10:05:41
 * @LastEditTime: 2020-03-26 00:14:48
 * @LastEditors: Please set LastEditors
 * @Description: In User Settings Edit
 * @FilePath: \lingmou-frame\src\businessComponents\Tags\TagPortal\index.js
 */
const {
  PaddingBox
} = Box$1;
const labelType = ___default.cloneDeep(mapLabelType);
const generation = ___default.cloneDeep(mapGeneration);
//const vehicleTags = _.cloneDeep(Dict.map.behaviorAttr)

function TagBox({
  title,
  children
}) {
  return /*#__PURE__*/React__default.createElement("div", {
    className: "tag-search-label-item"
  }, /*#__PURE__*/React__default.createElement("div", {
    className: "tag-box-desc"
  }, title, "\uFF1A"), /*#__PURE__*/React__default.createElement("div", {
    className: "tag-item-box"
  }, children));
}
class TagPortal extends React__default.Component {
  constructor(props) {
    super(props);
    this.state = {
      personTags: [],
      placeTags: props.dictMap['119100'],
      deviceTags: props.dictMap['119100'],
      houseTags: window.dictMap['164110'],
      vehicle: []
    };
  }
  componentDidMount() {
    this.getPersonTags();
    this.getVehicleTags();
  }
  async getPersonTags() {
    let tagGroups = ___default.flattenDeep(labelType.map(v => v.value));
    const res = await Service.getTagsByCondition({
      tagGroups
    });
    this.setState({
      personTags: formartTagCodes$1(res.data)
    });
  }
  async getVehicleTags() {
    const tags = await getVehicleTagList(); //await Shared.getVehicleTagList(true);
    this.setState({
      vehicle: tags || []
    });
  }
  render() {
    const {
      keywordsList = [],
      getContainer,
      visible,
      keywords,
      onSelect,
      selectTags,
      type
    } = this.props;
    const selectKeys = selectTags.map(v => v.code);
    const tags = this.state[`${type}Tags`] || [];
    const {
      vehicle
    } = this.state;
    const houseTag = window.dictMap["114100"];

    // console.log(selectTags, 'uuuuuuuuu')
    return /*#__PURE__*/React__default.createElement(Portal$1, {
      getContainer: getContainer,
      visible: visible
    }, /*#__PURE__*/React__default.createElement(QueueAnim, {
      type: "top",
      leaveReverse: true
    }, /*#__PURE__*/React__default.createElement(PaddingBox, {
      className: "tag-portal-box",
      style: {
        padding: 20
      },
      key: "tag-select"
    }, /*#__PURE__*/React__default.createElement(KeywordsList, {
      list: keywordsList,
      keywords: keywords,
      onClick: onSelect,
      selectKeys: selectKeys
    }), tags.length ? /*#__PURE__*/React__default.createElement(TagBox, {
      className: "tag-search-label-item",
      title: "\u8BD5\u8BD5\u6807\u7B7E\u5FEB\u901F\u67E5"
    }, tags.map(item => item.children ? /*#__PURE__*/React__default.createElement(MutipleTag, {
      selectKeys: selectKeys,
      key: item.code,
      item: item,
      isMultiple: item.tagGroup !== '119905',
      onSelect: item => {
        console.log(item);
        onSelect(item);
      }
    }) : /*#__PURE__*/React__default.createElement(SingleTag, {
      selectKeys: selectKeys,
      key: item.code,
      item: item,
      onSelect: item => {
        console.log(item);
        onSelect(item);
      }
    }))) : null, type === 'person' && /*#__PURE__*/React__default.createElement(TagBox, {
      className: "tag-search-label-item",
      title: "\u5E74\u9F84\u6BB5"
    }, generation.map(item => /*#__PURE__*/React__default.createElement(SingleTag, {
      key: item.code,
      selectKeys: selectKeys,
      item: item,
      onSelect: () => {
        item.tagName = item.name;
        onSelect(item);
      }
    }))), type === 'vehicle' && /*#__PURE__*/React__default.createElement(TagBox, {
      className: "tag-search-label-item",
      title: "\u8F66\u8F86\u6807\u7B7E"
    }, vehicle.map(item => /*#__PURE__*/React__default.createElement(SingleTag, {
      key: item.code,
      selectKeys: selectKeys,
      item: item,
      onSelect: onSelect
    }))), type === 'house' && /*#__PURE__*/React__default.createElement(TagBox, {
      className: "tag-search-label-item",
      title: "\u623F\u5C4B\u7528\u9014"
    }, houseTag.map(item => /*#__PURE__*/React__default.createElement(SingleTag, {
      key: item.code,
      selectKeys: selectKeys,
      item: item,
      onSelect: onSelect
    }))))));
  }
}

function imageCompress(file, options = {
  quality: 0.8
}) {
  return new Promise((resolve, reject) => {
    new Compressor(file, {
      ...options,
      success(result) {
        resolve(result);
      },
      error(err) {
        reject(err);
      }
    });
  });
}

/**
 * file文件转base64
 * @param {file} input-file
 * @param {function} callback
 */
function fileToBase64(file) {
  return new Promise(resove => {
    const reader = new FileReader();
    reader.addEventListener("load", () => resove(reader.result));
    reader.readAsDataURL(file);
  });
}
/**
 * 图片base64转换为blob
 * @param {string} base64Url
 */
function base64ToBlob(base64Url) {
  var bytes = window.atob(base64Url.split(",")[1]); // 去掉url的头，并转换为byte
  //处理异常,将ascii码小于0的转换为大于0
  var ab = new ArrayBuffer(bytes.length);
  var ia = new Uint8Array(ab);
  for (var i = 0; i < bytes.length; i++) {
    ia[i] = bytes.charCodeAt(i);
  }
  return new Blob([ab], {
    type: "image/png"
  });
}

/*
 * @Author: welson
 * @Date: 2019-08-16 15:39:11
 * @Last Modified by: Mr.Welson
 * @Last Modified time: 2019-09-06 19:28:50
 */
class OriginUpload extends Component {
  constructor(props) {
    super(props);
    // 本地上传
    this.localUpload = async fileList => {
      const result = await Promise.all(fileList.map(v => fileToBase64(v)));
      fileList.forEach((v, index) => {
        v.url = result[index];
        v.uploadType = 'local';
      });
      this.uploadDone(fileList);
    };
    // 远程上传
    this.remoteUpload = fileList => {
      this.uploadDone(fileList);
    };
    // 上传完成后的回调
    this.uploadDone = fileList => {
      const {
        customUpload
      } = this.props;
      customUpload && customUpload(fileList);
    };
    //上传方法
    this.customRequest = fileList => {
      this.props.uploadType === 'remote' ? this.remoteUpload(fileList) : this.localUpload(fileList);
    };
    //上传之前
    this.beforeUpload = async files => {
      this.fileList = [];
      const {
        maxSize = 2,
        maxLength = 100,
        currentLength = 0,
        beforeUpload
      } = this.props;
      let fileList = files;
      let is_fileLeng = true;
      fileList = Array.prototype.slice.apply(fileList);
      if (currentLength + fileList.length > maxLength) {
        message.error(`最多选择${maxLength}张图片, 已选${currentLength}张`);
        is_fileLeng = false;
      }
      beforeUpload && beforeUpload();
      for (let i = 0; i < fileList.length; i++) {
        let file = fileList[i];
        const isJPG = file.type === 'image/jpeg' || file.type === 'image/png' || file.type === 'image/jpg';
        if (!isJPG) {
          message.error(`${file.name}:图片格式必须为JPG或者PNG!`);
        }
        const limitSize = file.size / 1024 / 1024 < maxSize;
        if (!limitSize) {
          message.error(`${file.name}:图片大小不能超过${maxSize}M!`);
        }
        const fileSize = file.size;
        if (!fileSize) {
          message.error(`${file.name}:图片文件错误!`);
        }
        let newFile = file;
        if (file.type !== 'image/svg+xml') {
          newFile = await imageCompress(file);
        }
        if (isJPG && limitSize && fileSize && is_fileLeng) {
          newFile.uid = uuid$1();
          this.fileList.push(newFile);
        }
      }
      this.customRequest(this.fileList);
      this.setState({
        inputKey: Math.random()
      });
    };
    this.onClick = () => {
      this.inputRef.current.click();
    };
    this.onDrop = e => {
      this.onDragPrevent(e);
      let files = e.dataTransfer.files;
      this.beforeUpload(files);
    };
    this.onDragPrevent = e => {
      e.stopPropagation();
      e.preventDefault();
    };
    this.onChange = e => {
      this.beforeUpload(e.target.files);
    };
    this.state = {
      inputKey: Math.random()
    };
    this.fileList = [];
    this.inputRef = /*#__PURE__*/React__default.createRef();
  }
  render() {
    const {
      className = '',
      multiple,
      disabled,
      children
    } = this.props;
    return /*#__PURE__*/React__default.createElement("div", {
      className: `origin-input-upload-wrapper ${className} ${disabled ? 'disabled' : ''}`,
      onClick: this.onClick,
      style: {
        position: 'relative'
      },
      onDrop: this.onDrop,
      onDragOver: this.onDragPrevent,
      onDragLeave: this.onDragPrevent
    }, /*#__PURE__*/React__default.createElement("input", {
      ref: this.inputRef,
      accept: "image/png, image/jpeg, image/jpg",
      style: {
        opacity: 0,
        position: 'absolute',
        left: 0,
        top: 0,
        width: '100%',
        height: '100%',
        display: 'none'
      },
      type: "file",
      key: this.state.inputKey,
      disabled: disabled,
      multiple: multiple,
      onChange: this.onChange
    }), children);
  }
}

class UploadPortal extends React__default.Component {
  constructor(props) {
    super(props);
    this.customUpload = async files => {
      const blob = base64ToBlob(files[0].url);
      let type = this.props.type;
      const formData = new FormData();
      let urlRes;
      formData.append('file', blob);
      try {
        urlRes = await Service.uploadPersonPicture(formData);
      } catch (e) {
        message.warn('上传失败！');
      }
      if (!urlRes) {
        return;
      }
      if (type === "person") {
        try {
          const result = await Service.getFaceFeature({
            url: urlRes.data.url
          });
          const cloneResult = ___default.cloneDeep(result.data.list);
          if (cloneResult.length > 1) {
            const r = ___default.cloneDeep(result.data.list).map(item => {
              item.value = `${item.rect.left},${item.rect.top},${item.rect.width},${item.rect.height}`;
              item.type = 'face';
              item.needExpand = 'true';
              // item.isDefault = 'false'
              item.rect = [item.rect.left, item.rect.top, item.rect.width, item.rect.height];
              return item;
            });
            const options = this.state.options;
            options.url = urlRes.data.url;
            this.setState({
              rects: r,
              visible: true,
              options
            });
            return;
          }
          if (result.data.list.length === 1) {
            return this.onClickDefaultRect(urlRes.data.url, true, result.data.list[0]);
          }
          return message.warn('未获取到特征值！');
        } catch (e) {
          message.warn(e.data ? e.data.message : '未获取到特征值！');
        }
      } else {
        try {
          const result = await Service.getVehicleFeature({
            url: urlRes.data.url
          });
          const cloneResult = ___default.cloneDeep(result.data.vehicles);
          if (cloneResult.length > 1) {
            const r = cloneResult.map(item => {
              // item.value = `${item.rect.left},${item.rect.top},${item.rect.width},${item.rect.height}`
              item.type = 'vehicle';
              item.needExpand = 'false';
              item.isDefault = 'false';
              item.rect = [item.rect.left, item.rect.top, item.rect.width, item.rect.height];
              return item;
            });
            const options = this.state.options;
            options.url = urlRes.data.url;
            this.setState({
              rects: r,
              visible: true,
              options
            });
            return;
          } else {
            const options = this.state.options;
            options.url = urlRes.data.url;
            this.setState({
              options
            });
            return this.onClickDefaultRect(urlRes.data.url, true, result.data.vehicles[0]);
          }
        } catch (e) {
          message.warn(e.data ? e.data.message : '未获取到特征值！');
        }
      }
    };
    this.onClickDefaultRect = async (url, isNobase64 = false, item) => {
      const {
        options
      } = this.state;
      let type = this.props.type;
      let pictureUrl = url;
      if (!isNobase64) {
        const blob = base64ToBlob(url);
        const formData = new FormData();
        formData.append('file', blob);
        const urlRes = await Service.uploadPersonPicture(formData);
        pictureUrl = urlRes.data.url;
      }
      options.pictureUrl = pictureUrl;
      if (type === "person") {
        options.feature = item.feature;
      } else {
        options.plateNo4ImgSearch = item.plateNo;
        options.plateColor4ImgSearch = parseInt(item.plateColor);
      }
      this.setState({
        options,
        visible: false
      });
      return this.props.onChange && this.props.onChange(options);
    };
    this.onClickDefaultRects = async (item = {}, url) => {
      // console.log(item, 'iiiiiiiiiiiiiiii')
      const blob = base64ToBlob(item.base64);
      const formData = new FormData();
      formData.append('file', blob);
      const urlRes = await Service.uploadPersonPicture(formData);
      const pictureUrl = urlRes.data.url;
      const {
        options
      } = this.state;
      let type = this.props.type;
      if (type === 'person') {
        options.pictureUrl = pictureUrl;
        options.feature = item.feature;
      } else {
        options.plateNo4ImgSearch = item.plateNo;
        options.plateColor4ImgSearch = parseInt(item.plateColor);
      }
      console.log(options);
      this.setState({
        options,
        visible: false
      });
      return this.props.onChange && this.props.onChange(options);
    };
    this.state = {
      visible: false,
      rects: [],
      options: {
        url: null,
        pictureUrl: null,
        feature: null,
        type: 'image',
        code: 'static-image'
      }
    };
  }
  render() {
    const {
      getContainer,
      visible,
      type
    } = this.props;
    return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(Portal$1, {
      getContainer: getContainer,
      visible: visible
    }, /*#__PURE__*/React__default.createElement(QueueAnim, {
      type: "top",
      leaveReverse: true
    }, /*#__PURE__*/React__default.createElement(OriginUpload, {
      className: "drop-upload-view",
      uploadType: "local",
      customUpload: this.customUpload,
      key: "imgUpload"
    }, /*#__PURE__*/React__default.createElement("div", {
      className: "content-image-box"
    }, /*#__PURE__*/React__default.createElement("label", {
      className: "image-upload"
    }, /*#__PURE__*/React__default.createElement(IconFont, {
      type: 'icon-L_Bar_AddImg',
      theme: "outlined"
    })), /*#__PURE__*/React__default.createElement("div", {
      className: "box-text"
    }, "\u70B9\u51FB\u201C+\u201D\u4E0A\u4F20\u56FE\u7247\uFF0C\u6216\u62D6\u62FD\u56FE\u7247\u5230\u8FD9\u91CC\u641C\u56FE"))))), /*#__PURE__*/React__default.createElement(ModalSelectRectImage, {
      className: "modal-select-face",
      width: "960px",
      title: type === "person" ? "请选择人脸" : "请选择车辆",
      url: this.state.options.url,
      rects: this.state.rects,
      hasFooter: false,
      visible: this.state.visible,
      onCancel: () => this.setState({
        visible: false
      }),
      onClickDefaultRect: this.onClickDefaultRects
    }));
  }
}

// const { Service /* Dict, Shared, Utils */ } = window;
//const vehicleTags = _.cloneDeep(Dict.map.behaviorAttr)
const placeholderTypes = {
  person: '请输入人员姓名、身份证号、经过的设备或场所查询',
  vehicle: '请输入车牌号、车主姓名、身份证号查询',
  device: '请输入设备名称查询',
  place: '请输入场所名称查询',
  house: '请选择房屋标签、属性查询'
};
const TagPortalComponent = Dict.withDict(['119100'])(TagPortal);
class ObjectMapTagSelect extends React__default.Component {
  constructor(props) {
    super(props);
    /**
     * @选择tag或取消tag
     */
    this.onSelect = (item, localType) => {
      let tags = this.state.selectTags;
      const index = tags.findIndex(v => v.code === item.code);
      if (index > -1) {
        tags.splice(index, 1);
      } else {
        //TODO 单选的分组
        if (item.tagGroup === '119905') {
          tags = tags.filter(v => v.typeCode !== item.typeCode);
        }
        if (tags.length >= 10) {
          return message.warn('选择的标签数量不能超过10个');
        }
        tags.push(item);
      }
      const options = {
        selectTags: tags
      };
      if (localType === 'keyword') {
        const {
          type
        } = this.state;
        if (type === 'person' && item.type.includes('PERSONID') || type === 'vehicle' && item.type.includes('PLATEID') || type === 'device' && +item.type === 2 || type === 'place' && +item.type === 6) {
          return this.setState({
            selectTags: [],
            keywords: '',
            keywordsList: []
          }, () => {
            this.tagInputRef.current.autoFocusInput();
            this.tagInputRef.current.clearInput();
            this.props.onSearch({
              tags: [item]
            });
          });
        }
        options.keywords = null;
        options.keywordsList = [];
        this.tagInputRef.current.clearInput();
      }
      this.setState(options);
      this.tagInputRef && this.tagInputRef.current.autoFocusInput();
    };
    this.imageUpload = item => {
      // this.setState({ uploadInfo: item });
      this.setState({
        selectTags: [],
        keywordsList: [],
        keywords: ''
      }, () => {
        this.props.onSearch({
          uploadInfo: item
        });
      });
      this.tagInputRef && this.tagInputRef.current.autoFocusInput();
    };
    this.onTypeChange = type => {
      this.setState({
        type,
        selectTags: [],
        keywords: null,
        keywordsList: [],
        uploadInfo: undefined
      });
      this.props.onTypeChange && this.props.onTypeChange(type);
      this.tagInputRef.current.clearInput();
    };
    this.openTagSelect = () => {
      if (!this.state.visibleTag) {
        this.setState({
          visibleTag: true,
          visibleUpload: false
        });
      }
    };
    this.openImgUpload = () => {
      if (!this.state.visibleUpload) {
        this.setState({
          visibleUpload: true,
          visibleTag: false
        });
      }
    };
    this.onTagChange = tags => {
      console.log(tags);
      this.setState({
        selectTags: tags
      });
    };
    this.closePortal = () => {
      const {
        visibleTag,
        visibleUpload
      } = this.state;
      if (visibleTag || visibleUpload) {
        this.setState({
          visibleTag: false,
          visibleUpload: false
        });
      }
    };
    /**
     * @查询关键字转换成字典格式
     * 屏蔽缓存
     */
    this.onInputChange = (value, shouldQueryRecommend = true) => {
      const {
        type
      } = this.state;
      clearTimeout(this.timer);
      if (!value) {
        return this.setState({
          keywordsList: [],
          keywords: value
        });
      }
      this.setState({
        keywords: value
      });
      if (!shouldQueryRecommend) {
        return;
      }
      if (type === 'vehicle') {
        this.timer = setTimeout(() => this.queryRecommendVehicle(value), 500);
      } else if (type === 'device') {
        this.timer = setTimeout(() => this.queryRecommendDevice(value), 500);
      } else if (type === 'place') {
        this.timer = setTimeout(() => this.queryRecommendPlace(value), 500);
      } else {
        this.timer = setTimeout(() => this.queryRecommend(value), 500);
      }
    };
    /**
     * @查询推荐列表plateRecommend
     */
    this.queryRecommendVehicle = async value => {
      const result = await Service.plateRecommend({
        keywords: value
      });
      let list = result.data || [];
      list = list.filter(v => v.type[0] === 'TID' || v.type[0] === 'PLATEID');
      list.forEach(item => {
        let name = item.plateNo || item.dicName || value;
        item.description = name;
        item.label = name;
        item.localType = 'keyword';
        item.code = item.xid;
      });
      this.setState({
        keywordsList: list
      });
    };
    this.queryRecommend = async value => {
      const result = await Service.personRecommend({
        keywords: value
      });
      let list = result.data || [];
      list = list.filter(v => v.type[0] === 'TID' || v.type[0] === 'PERSONID' || v.type[0] === 'CID' || v.type[0] === 'PID');
      list.forEach(item => {
        let name = item.placeName || item.dicName || item.device_name || item.personName;
        item.description = name;
        item.label = name;
        item.code = item.xid;
        item.localType = 'keyword';
      });
      this.setState({
        keywordsList: list
      });
    };
    this.queryRecommendDevice = async value => {
      const result = await Service.personRecommendPage({
        keywords: value
      });
      let list = result.data.list || [];
      list = list.filter(v => v.type === '2' || v.type === '7');
      list.forEach(item => {
        item.label = item.description;
        item.localType = 'keyword';
        item.code = item.id;
      });
      this.setState({
        keywordsList: list
      });
    };
    this.queryRecommendPlace = async value => {
      const result = await Service.personRecommendPage({
        keywords: value
      });
      let list = result.data.list || [];
      list = list.filter(v => v.type === '6');
      list.forEach(item => {
        item.label = item.description;
        item.localType = 'keyword';
        item.code = item.id;
      });
      this.setState({
        keywordsList: list
      });
    };
    this.onSearch = () => {
      const {
        selectTags,
        uploadInfo,
        keywords
      } = this.state;

      // console.log(selectTags)
      this.props.onSearch({
        tags: selectTags,
        keywords,
        uploadInfo
      });
    };
    const {
      defaultTags,
      type: _type = 'person',
      keywords: _keywords,
      uploadInfo: _uploadInfo,
      hasSingleType
    } = this.props;
    const objectTypes = this.queryObjectAuth();
    this.tagBoxRef = /*#__PURE__*/React__default.createRef();
    this.tagInputRef = /*#__PURE__*/React__default.createRef();
    this.timer = null;
    this.state = {
      type: objectTypes.indexOf(_type) > -1 ? _type : objectTypes[0],
      visibleTag: false,
      visibleUpload: false,
      uploadInfo: _uploadInfo ? ___default.cloneDeep(_uploadInfo) : undefined,
      isSetDefault: Array.isArray(defaultTags) && defaultTags.length > 0,
      selectTags: defaultTags ? ___default.cloneDeep(defaultTags) : [],
      keywords: _keywords || undefined,
      keywordsList: [],
      objectTypes: hasSingleType ? [] : objectTypes
    };
  }
  static getDerivedStateFromProps(props, state) {
    const options = {};
    if (!state.isSetDefault && Array.isArray(props.defaultTags) && props.defaultTags.length > 0 && state.selectTags.length === 0) {
      options.selectTags = ___default.cloneDeep(props.defaultTags);
      options.isSetDefault = true;
    }
    if (props.keywords && state.keywords === undefined) {
      options.keywords = props.keywords;
    }
    if (props.uploadInfo && !state.uploadInfo) {
      options.uploadInfo = ___default.cloneDeep(props.uploadInfo);
    }
    if (Object.keys(options).length > 0) {
      return options;
    }
    return null;
  }
  componentWillUnmount() {
    clearTimeout(this.timer);
    this.tagBoxRef = null;
    this.tagInputRef = null;
    this.timer = null;
  }
  queryObjectAuth() {
    const userAuthListAlias = BaseStore.auth.userAuthList.map(item => item.alias);
    let arr = []; //, 'device', 'house', 'place''device', 'house', 'place', 'vehicle'
    if (userAuthListAlias.includes('personArchivesView') || userAuthListAlias.includes('communityActualPerson')) {
      arr.push('person');
    }
    if (userAuthListAlias.includes('vehicleArchives') || userAuthListAlias.includes('communityActualVehicle')) {
      arr.push('vehicle');
    }
    if (userAuthListAlias.includes('houseArchivesView') || userAuthListAlias.includes('communityActualHouse')) {
      arr.push('house');
    }
    if (userAuthListAlias.includes('placeFile')) {
      arr.push('place');
    }
    if (userAuthListAlias.includes('deviceFile') || userAuthListAlias.includes('communityActualDevice')) {
      arr.push('device');
    }
    return arr;
  }
  render() {
    const {
      hasSingleType = true,
      disabled
    } = this.props;
    const {
      type,
      visibleTag,
      selectTags,
      keywords,
      keywordsList,
      visibleUpload,
      uploadInfo = {},
      objectTypes
    } = this.state;
    if (!hasSingleType && objectTypes.length === 0) {
      return null;
    }
    return /*#__PURE__*/React__default.createElement("div", {
      className: "tag-group-select-layout"
    }, hasSingleType && /*#__PURE__*/React__default.createElement(TabHeader$1, {
      objectTypes: objectTypes,
      onTypeChange: this.onTypeChange
    }), /*#__PURE__*/React__default.createElement(TagInput, {
      disabled: disabled,
      type: type,
      ref: this.tagInputRef,
      keywords: keywords,
      selectList: selectTags,
      onInputChange: this.onInputChange,
      openTagSelect: this.openTagSelect,
      openImgUpload: this.openImgUpload,
      closePortal: this.closePortal,
      deleteTag: this.onSelect,
      deleteImg: () => this.imageUpload({}),
      onSearch: this.onSearch,
      pictureUrl: uploadInfo.pictureUrl,
      placeholder: placeholderTypes[type]
    }), /*#__PURE__*/React__default.createElement("div", {
      className: "tag-box-popup",
      ref: this.tagBoxRef
    }), /*#__PURE__*/React__default.createElement(TagPortalComponent, {
      key: "tag-select",
      keywordsList: keywordsList,
      visible: visibleTag,
      selectTags: selectTags,
      getContainer: () => this.tagBoxRef.current,
      onSelect: this.onSelect,
      keywords: keywords,
      type: type
    }), /*#__PURE__*/React__default.createElement(UploadPortal, {
      key: "imageSelect",
      type: type,
      getContainer: () => this.tagBoxRef.current,
      visible: visibleUpload,
      onChange: this.imageUpload
    }));
  }
}

//light or dark
function Title(props) {
  const {
    title,
    children,
    theme = "light"
  } = props;
  return /*#__PURE__*/React__default.createElement("div", {
    className: `lm-c-layout-title title-theme-${theme}`
  }, title || children);
}

function TwoRowLayout({
  onTabChange,
  activeKey,
  className,
  defaultKey,
  tabList,
  isRightHead,
  titleGrid,
  extGrid,
  ...props
}) {
  const [renderKeys, setRenderKey] = useState(activeKey || defaultKey ? [activeKey || defaultKey] : [tabList[0].name]);
  const {
    customCenterExtContent,
    rightExtContent,
    hasRightExt
  } = props;
  const headerLayoutLetfId = useMemo(() => `header-left-ext-layout-${uuid()}`, []);
  const headerLayoutRightId = useMemo(() => `header-right-ext-layout-${uuid()}`, []);
  const index = useMemo(() => tabList.findIndex(v => v.name === activeKey), [activeKey, tabList]);
  // eslint-disable-next-line react-hooks/exhaustive-deps
  useEffect(() => setRenderKey(keys => {
    if (!keys.includes(activeKey)) {
      keys.push(activeKey);
    }
    return [...keys];
  }), [activeKey]);

  /**
   * 切换当前key值
   * @param {*} item
   * @param {*} index
   */
  const onTabClick = useCallback((item, index) => {
    if (activeKey !== item.name) {
      setRenderKey(keys => {
        if (!keys.includes(item.name)) {
          keys.push(item.name);
        }
        return [...keys];
      });
      onTabChange && onTabChange(item, index);
    }
  }, [onTabChange]);
  return /*#__PURE__*/React__default.createElement(Row, {
    className: `lm-c-two-row-layout ${className} ${isRightHead ? 'lm-c-two-row-layout-right-header' : ''}`
  }, /*#__PURE__*/React__default.createElement(HeaderLayout, {
    tabList: tabList,
    headerLayoutLetfId: headerLayoutLetfId,
    headerLayoutRightId: headerLayoutRightId,
    onTabClick: onTabClick,
    activeKey: activeKey,
    index: index,
    customCenterExtContent: customCenterExtContent,
    titleGrid: titleGrid,
    extGrid: extGrid,
    rightExtContent: rightExtContent,
    hasRightExt: hasRightExt
  }), /*#__PURE__*/React__default.createElement("div", {
    className: "lm-c-two-row-col-content"
  }, /*#__PURE__*/React__default.createElement("div", {
    style: {
      width: `${tabList.length * 100}%`,
      marginLeft: `-${index * 100}%`
    },
    className: "lm-c-two-row-content-box"
  }, tabList.map((item, i) => /*#__PURE__*/React__default.createElement("div", {
    key: item.name,
    className: "lm-c-two-row-content"
  }, renderKeys.indexOf(item.name) > -1 && /*#__PURE__*/React__default.cloneElement(item.content, {
    ...props,
    activeKey,
    getHeaderLeftExtContent: () => document.querySelector(`.${headerLayoutLetfId}-${i}`),
    getHeaderRightExtContent: () => document.querySelector(`.${headerLayoutRightId}-${i}`),
    tabItem: item
  }))))));
}
function HeaderLayout({
  title,
  titleGrid,
  extGrid,
  onTabClick,
  hasRightExt,
  ...props
}) {
  const tabWidht = useMemo(() => 100, []);
  const [renderSize, setRenderSize] = useState(2);
  const {
    tabList,
    index,
    customCenterExtContent,
    activeKey,
    rightExtContent,
    headerLayoutLetfId,
    headerLayoutRightId
  } = props;
  const boxRef = useRef(null);
  useLayoutEffect(() => {
    const computeSize = () => {
      const {
        width
      } = boxRef.current.getBoundingClientRect();
      setRenderSize(Math.floor(width / tabWidht));
    };
    computeSize();
    window.addEventListener('resize', computeSize, false);
    return () => window.removeEventListener('resize', computeSize, false);
  }, [tabWidht]);
  const [tabList1, tabList2] = useMemo(() => [tabList.slice(0, renderSize), tabList.slice(renderSize)], [renderSize]);
  return /*#__PURE__*/React__default.createElement("div", {
    className: "two-row-layout-header"
  }, /*#__PURE__*/React__default.createElement(Row, {
    className: "two-row-layout-header",
    type: "flex",
    align: "middle"
  }, /*#__PURE__*/React__default.createElement(Col, _extends({
    className: `two-row-layout-header-title `
  }, titleGrid), /*#__PURE__*/React__default.createElement("div", {
    className: "header-title-layout"
  }, title && /*#__PURE__*/React__default.createElement(Title, {
    title: title
  }), tabList.map((_, i) => /*#__PURE__*/React__default.createElement("div", {
    key: `${headerLayoutLetfId}-${i}`,
    className: `${headerLayoutLetfId}-${i}`,
    style: {
      width: '100%',
      height: '100%',
      display: i === index ? 'block' : 'none'
    }
  })))), /*#__PURE__*/React__default.createElement("div", {
    className: "two-row-layout-header-tab",
    style: {
      overflow: customCenterExtContent ? 'unset' : 'hidden'
    },
    ref: boxRef
  }, customCenterExtContent ? /*#__PURE__*/React__default.createElement(Row, {
    className: "two-row-layout-header two-row-layout-header-ext-center",
    type: "flex",
    justify: "center",
    align: "middle"
  }, /*#__PURE__*/React__default.createElement("div", null, customCenterExtContent)) : /*#__PURE__*/React__default.createElement(Tabs, {
    activeKey: activeKey,
    tabList: tabList1,
    tabIndex: index,
    onTabClick: onTabClick,
    extContent: tabList2.length > 0 && /*#__PURE__*/React__default.createElement(Popover, {
      placement: "bottom",
      overlayClassName: "tab-ext-popover",
      content: /*#__PURE__*/React__default.createElement(TabsRow, {
        tabList: tabList2,
        activeKey: activeKey,
        onTabClick: onTabClick
      })
    }, /*#__PURE__*/React__default.createElement(IconFont, {
      type: "icon-S_Edit_Menu",
      className: `tab-hidden-ext ${tabList2.findIndex(item => item.name === activeKey) > -1 ? 'tab-hidden-ext-active' : ''}`
    }))
  })), hasRightExt && /*#__PURE__*/React__default.createElement(Col, _extends({
    className: `two-row-layout-header-ext ${headerLayoutRightId}`
  }, extGrid), rightExtContent, tabList.map((_, i) => /*#__PURE__*/React__default.createElement("div", {
    key: `${headerLayoutRightId}-${i}`,
    className: `${headerLayoutRightId}-${i}`,
    style: {
      width: '100%',
      height: '100%',
      display: i === index ? 'block' : 'none'
    }
  })))));
}
function Tabs({
  tabList,
  activeKey,
  onTabClick,
  extContent
}) {
  const [movex, setMovex] = useState(0);
  const tabRef = useRef(null);
  useLayoutEffect(() => {
    function computedX() {
      const layerRect = tabRef.current.getBoundingClientRect();
      const acticeDom = tabRef.current.querySelector('.lm-tab-item-active');
      if (!acticeDom) {
        return;
      }
      const activeRect = acticeDom.getBoundingClientRect();
      const activeX = activeRect.x - layerRect.x;
      const x = activeX + activeRect.width / 2 - 12;
      x !== movex && setMovex(x);
    }
    setTimeout(() => computedX(), 100);
    window.addEventListener('resize', computedX, false);
    return () => window.removeEventListener('resize', computedX, false);
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [activeKey]);
  function onTabItemClick(e, item, index) {
    e && e.stopPropagation && e.stopPropagation();
    onTabClick(item, index);
  }
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
    className: "lm-two-row-tab-layout",
    ref: tabRef
  }, tabList.map((item, index) => /*#__PURE__*/React__default.createElement("div", {
    key: item.name,
    onClick: e => onTabItemClick(e, item, index),
    title: item.title,
    className: `lm-two-row-tab-item ${activeKey === item.name ? 'lm-tab-item-active' : ''}`
  }, item.icon && /*#__PURE__*/React__default.createElement(IconFont, {
    type: item.icon
  }), item.title)), extContent), /*#__PURE__*/React__default.createElement("div", {
    className: "lm-tab-select-border"
  }, /*#__PURE__*/React__default.createElement("div", {
    style: {
      transform: `translate3d(${movex}px,0,0)`
    },
    className: "lm-two-row-tab-border"
  })));
}
function TabsRow({
  tabList,
  activeKey,
  onTabClick
}) {
  return /*#__PURE__*/React__default.createElement("div", {
    className: "lm-tab-row-style-layout"
  }, tabList.map((item, index) => /*#__PURE__*/React__default.createElement("div", {
    key: item.name,
    onClick: () => onTabClick(item, index),
    title: item.title,
    className: `lm-two-row-tab-item ${activeKey === item.name ? 'lm-tab-item-active' : ''}`
  }, item.icon && /*#__PURE__*/React__default.createElement(IconFont, {
    type: item.icon
  }), item.title)));
}
TwoRowLayout.defaultProps = {
  className: '',
  tabList: [],
  titleGrid: simpleGrid,
  extGrid: simpleGrid,
  hasRightExt: true,
  isRightHead: false
};
var TwoRowLayout$1 = /*#__PURE__*/React__default.memo(TwoRowLayout);

class TagResultLayout extends React__default.Component {
  render() {
    const {
      className = '',
      title,
      activeKey,
      keywords,
      tags,
      uploadInfo,
      extGrid,
      onSearch,
      rightExtContent,
      tabList,
      disabled,
      ...props
    } = this.props;
    return /*#__PURE__*/React__default.createElement(TwoRowLayout$1, _extends({}, props, {
      className: `tag-result-layout ${className}`,
      title: title,
      activeKey: activeKey,
      extGrid: extGrid,
      customCenterExtContent: /*#__PURE__*/React__default.createElement(ObjectMapTagSelect, {
        disabled: disabled,
        defaultTags: tags,
        uploadInfo: uploadInfo,
        keywords: keywords,
        onSearch: onSearch,
        hasSingleType: false,
        type: activeKey
      }),
      rightExtContent: rightExtContent,
      tabList: tabList
    }));
  }
}

function TagView({
  tags,
  onSelect
}) {
  return /*#__PURE__*/React__default.createElement("div", {
    className: "tag-label-view"
  }, tags.length > 0 ? tags.map(item => /*#__PURE__*/React__default.createElement(SingleTag, {
    key: item.code,
    item: item,
    isActive: true,
    onSelect: onSelect,
    style: {
      cursor: onSelect ? 'pointer' : 'unset',
      margin: '8px 8px 8px 0'
    }
  })) : /*#__PURE__*/React__default.createElement("div", {
    className: "no-label"
  }, "\u6682\u65E0\u6807\u7B7E"));
}

const ObjectQuery = {
  Base: ModalView,
  Box: Box$1,
  Header,
  ModalSelectRectImage,
  ObjectTagSelect: ObjectMapTagSelect,
  OriginUpload,
  Portal: Portal$1,
  QueueAnim,
  TabHeader: TabHeader$1,
  TagInput,
  TagPortal,
  TagResultLayout,
  TagView,
  UploadPortal
};

export { ObjectQuery as default };
//# sourceMappingURL=index.js.map
