import React__default, { useState, useMemo } from 'react';
import { inject, observer } from 'mobx-react';
import { Row, Col, Button } from 'antd';
import { treeHelper } from '@zenview/micro-utils';
import { Dict } from '@zenview/micro-basic-library';
import MapSeelct from '../DrawerMapSelect/index.js';
import ListSelectDevices from '../DrawerListSelect/index.js';
import IconFont from '../IconFont/index.js';
import Title from '../Title/index.js';
import { D as DeviceIcon } from '../index-33416316.js';
import '../VList/index.js';
import { L as ListView } from '../index-f41abfce.js';
import '../_rollupPluginBabelHelpers-736b301a.js';
import '../Drawer/index.js';
import '../LMap/index.js';
import 'leaflet';
import '../SearchInput/index.js';
import 'lodash';
import '../LabelValue/index.js';
import 'geometric';
import 'turf';
import '@src/libs/echarts-leaflet';
import 'leaflet/dist/leaflet.css';
import 'mapbox-gl-leaflet';
import 'react-dom';
import '../DeviceList/index.js';
import '../index-6ef7005c.js';
import '../CBox/index.js';
import '../TreeTitle/index.js';
import '../HightLevel/index.js';
import 'react-virtualized';
import '../ImageView/index.js';
import 'leaflet.zv.markercluster';
import 'leaflet.zv.markercluster/dist/MarkerCluster.Default.css';
import 'leaflet.zv.markercluster/dist/MarkerCluster.css';
import '../PlaceTree/index.js';
import '../Tree/index.js';
import '../index-71189681.js';
import '../_commonjsHelpers-e7b0df42.js';
import 'react-is';
import '../DeviceAndPlace/index.js';
import '../index-fcf1ad06.js';
import '../IconSpan/index.js';
import '../SelectDevices/index.js';
import '../OrgTreeWithSystem/index.js';
import '../OrgTree/index.js';
import 'ahooks';
import '../BetweenBox/index.js';

const PointsSelect = props => {
  const {
    device,
    place,
    org,
    value,
    dataType,
    onChange
  } = props;
  const [isShowDrawer, setIsShowDrawer] = useState({
    isShowListDrawer: false,
    isShowMapDrawer: false
  });
  const filterCamera = v => {
    const qj = {
      value: '100602',
      label: '球机'
    };
    const znxj = {
      value: '100604',
      label: '智能枪机'
    };
    const db = {
      value: '100605',
      label: '单兵'
    };
    const qt = {
      value: '100601',
      label: '其他摄像机'
    };
    const dz = {
      value: '100607',
      label: '道闸'
    };
    return v.deviceType === qj.value || v.deviceType === znxj.value || v.deviceType === db.value || v.deviceType === qt.value || v.deviceType === dz.value;
  };
  const faceFilterCamera = v => {
    const qj = {
      value: '100602',
      label: '球机'
    };
    const znxj = {
      value: '100604',
      label: '智能枪机'
    };
    const db = {
      value: '100605',
      label: '单兵'
    };
    const qt = {
      value: '100601',
      label: '其他摄像机'
    };
    const mj = {
      value: '103501,103502',
      label: '门禁'
    };
    return v.deviceType === qj.value || v.deviceType === znxj.value || v.deviceType === db.value || v.deviceType === qt.value || mj.value.indexOf(v.deviceType) > -1;
  };

  // 设备数据源
  const deviceListResource = useMemo(() => {
    window.abc = device.deviceList;
    if (dataType === "accessControl") {
      return device.deviceList.filter(v => Dict.device.mj.value.indexOf(v.deviceType) > -1);
    }
    if (dataType === "doorMagnetism") {
      return device.deviceList.filter(v => Dict.device.menci.value.indexOf(v.deviceType) > -1);
    }
    if (dataType === "cameraControl") {
      return device.deviceList.filter(filterCamera);
    }
    if (dataType === "faceCameraControl") {
      return device.deviceList.filter(faceFilterCamera);
    }
    // return device.cameraList;
    return device.deviceList;
  }, [dataType, device.deviceList]);

  // 组织数据源
  const orgTreeData = useMemo(() => {
    if (dataType !== 'accessControl' || dataType !== "doorMagnetism") {
      return;
    }
    let orgData = org.getOrgListCount(org.orgList, deviceListResource);
    return treeHelper.computTreeList(orgData);
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [deviceListResource, org.orgList, dataType]);

  // 场所数据源
  const placeTreeData = useMemo(() => {
    if (dataType !== 'accessControl' || dataType !== "doorMagnetism") {
      return;
    }
    let placeData = [];
    if (dataType === 'accessControl') {
      placeData = place.getPlaceListDeviceCount(place.placeList, deviceListResource, 'mj');
    } else if (dataType === 'doorMagnetism') {
      placeData = place.getPlaceListDeviceCount(place.placeList, deviceListResource, 'menci');
    }
    let placeListHandle = placeData.map(v => {
      return {
        ...v,
        placeId: v.id,
        id: v.areaCode,
        name: v.areaName,
        parentId: v.parentCode,
        deviceCount: {
          onlineCount: v.deviceCount ? v.deviceCount.onlineCount : 0,
          count: v.deviceCount ? v.deviceCount.count : 0
        },
        cameraCount: {
          onlineCount: v.cameraCount ? v.cameraCount.onlineCount : 0,
          count: v.cameraCount ? v.cameraCount.count : 0
        }
      };
    });
    return treeHelper.computTreeList(placeListHandle);
    // eslint-disable-next-line react-hooks/exhaustive-deps
  }, [deviceListResource, place.placeList, dataType]);

  // 选中的数据列表
  const selectDevicesList = useMemo(() => device.getDeviceByIds(value || []), [device, value]);

  // 显示弹框
  const showDrawer = type => {
    let drawerType = type === "list" ? "isShowListDrawer" : "isShowMapDrawer";
    setIsShowDrawer({
      ...isShowDrawer,
      [drawerType]: true
    });
  };

  // 关闭弹框
  const onClose = () => {
    setIsShowDrawer({
      isShowListDrawer: false,
      isShowMapDrawer: false
    });
  };

  // 修改选中的设备
  const setSelectedDevices = selectDevices => {
    onChange && onChange(selectDevices);
  };

  // 选中的设备
  const rowRender = ({
    key,
    index,
    style
  }) => {
    let v = selectDevicesList[index];
    return /*#__PURE__*/React__default.createElement("div", {
      style: style,
      key: v.id,
      title: v.deviceName,
      className: "li"
    }, /*#__PURE__*/React__default.createElement(DeviceIcon, {
      type: v.deviceType,
      status: v.deviceStatus
    }), v.deviceName);
  };
  const {
    isShowMapDrawer,
    isShowListDrawer
  } = isShowDrawer;
  return /*#__PURE__*/React__default.createElement("div", {
    className: "resource-library-chose-device"
  }, /*#__PURE__*/React__default.createElement(Title, {
    title: "\u70B9\u4F4D",
    icon: "icon-S_Bar_Add"
  }), /*#__PURE__*/React__default.createElement(Row, null, /*#__PURE__*/React__default.createElement(Col, {
    className: "chose-device-btn",
    span: 11
  }, /*#__PURE__*/React__default.createElement(Button, {
    size: "small",
    onClick: () => showDrawer("list")
  }, /*#__PURE__*/React__default.createElement(IconFont, {
    type: "icon-S_Photo_ListTree"
  }), "\u5217\u8868\u6A21\u5F0F")), /*#__PURE__*/React__default.createElement(Col, {
    className: "chose-device-btn",
    span: 11,
    offset: 2
  }, /*#__PURE__*/React__default.createElement(Button, {
    size: "small",
    onClick: () => showDrawer("map")
  }, /*#__PURE__*/React__default.createElement(IconFont, {
    type: "icon-S_Photo_Map"
  }), "\u5730\u56FE\u6A21\u5F0F"))), !!selectDevicesList.length && /*#__PURE__*/React__default.createElement("div", {
    className: "grap-point-content"
  }, /*#__PURE__*/React__default.createElement("div", {
    className: "camera-selected"
  }, /*#__PURE__*/React__default.createElement(ListView, {
    data: selectDevicesList,
    rowHeight: 24,
    rowRenderer: rowRender
  })), /*#__PURE__*/React__default.createElement("div", {
    className: "clear",
    onClick: () => setSelectedDevices([])
  }, /*#__PURE__*/React__default.createElement(IconFont, {
    type: "icon-S_Edit_Deleted",
    className: "data-repository-icon"
  }), "\u6E05\u7A7A\u6444\u50CF\u673A")), /*#__PURE__*/React__default.createElement(ListSelectDevices, {
    destroyOnClose: true,
    width: 1000,
    title: "\u5217\u8868\u6A21\u5F0F",
    visible: isShowListDrawer,
    onClose: onClose,
    selectDevices: value,
    onChange: setSelectedDevices,
    orgTreeData: orgTreeData,
    placeTreeData: placeTreeData,
    deviceList: deviceListResource
  }), /*#__PURE__*/React__default.createElement(MapSeelct, {
    destroyOnClose: true,
    width: 1000,
    title: "\u5730\u56FE\u6A21\u5F0F",
    visible: isShowMapDrawer,
    onClose: onClose,
    value: value,
    points: deviceListResource,
    onChange: setSelectedDevices
  }));
};
var index = inject("device", "place", "org")(observer(PointsSelect));

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