import { HistoryPlayer } from '@vtx/player';
import { forwardRef, useRef } from 'react';
import VmEmpty from "../vm-empty";
import "./index.less";
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
var GridItem = /*#__PURE__*/forwardRef(function (props, ref) {
  var _channel$list;
  var channel = props.channel,
    onClose = props.onClose;
  var name = "".concat(channel === null || channel === void 0 ? void 0 : channel.deviceName, "-").concat(channel === null || channel === void 0 ? void 0 : channel.channelName);
  var url = (channel === null || channel === void 0 ? void 0 : channel.totalTimeUrl) || (channel === null || channel === void 0 || (_channel$list = channel.list) === null || _channel$list === void 0 || (_channel$list = _channel$list[0]) === null || _channel$list === void 0 ? void 0 : _channel$list.playbackUrl);
  var gridItemRef = useRef(null);
  return /*#__PURE__*/_jsx("div", {
    className: "vm-video-content-container",
    ref: gridItemRef,
    children: url ? /*#__PURE__*/_jsxs(_Fragment, {
      children: [/*#__PURE__*/_jsxs("div", {
        className: "vm-video-content-container-header",
        children: [/*#__PURE__*/_jsx("span", {
          className: "title",
          title: name,
          children: name
        }), /*#__PURE__*/_jsx("div", {
          className: "close",
          onClick: onClose,
          children: "x"
        })]
      }), /*#__PURE__*/_jsx("div", {
        className: "content",
        children: /*#__PURE__*/_jsx(HistoryPlayer, {
          ref: ref,
          beenHasVideo: channel.beenHasVideo // 对讲
          ,
          url: url,
          type: channel === null || channel === void 0 ? void 0 : channel.player,
          deviceIp: channel.deviceIp,
          devicePort: channel.devicePort,
          captureName: name,
          deviceId: channel.deviceId,
          channelId: channel.channelId,
          channelNum: channel.channelNum,
          enableAgent: channel.enableAgent,
          deviceCode: channel.deviceCode,
          streamType: channel.streamType,
          info: channel.info,
          onClose: onClose
        })
      })]
    }) : /*#__PURE__*/_jsx(VmEmpty, {
      type: "NO_VIDEO"
    })
  });
});
export default GridItem;