wargerm 0.4.17 → 0.4.20

package/dist/components/Modal/index.d.ts

@@ -27,11 +27,13 @@ declare class Modal extends React.PureComponent<Props> {
         destory(): void;
     } | undefined;
     static hidden: () => void;
+    static destory: () => void;
     renderFooter: () => JSX.Element | null;
     containerRef: React.RefObject<any>;
     titleRef: React.RefObject<any>;
     renderTop: () => JSX.Element;
     componentDidMount(): void;
+    componentWillUnmount(): void;
     renderContent: () => {} | null;
     render(): JSX.Element;
 }

package/dist/index.css

@@ -1170,8 +1170,8 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
   border-image-slice: 57 166 62 166;
   border-image-width: 57px 166px 62px 166px;
   border-image-repeat: stretch stretch;
-  min-height: 500px;
-  min-width: 600px;
+  min-height: 300px;
+  min-width: 200px;
 }
 [data-prefers-color='dark'] .model_container .model_wrap {
   position: absolute;
@@ -1182,6 +1182,33 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
   transform: translate(-166px, -60px);
   padding: 12px 6px;
 }
+[data-prefers-color='dark'] .model_container .model_wrap .resizer {
+  width: 10px;
+  height: 100%;
+  position: absolute;
+  right: 0;
+  top: 0;
+  cursor: e-resize;
+  z-index: 100;
+}
+[data-prefers-color='dark'] .model_container .model_wrap .resizeb {
+  width: 100%;
+  height: 10px;
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  cursor: n-resize;
+  z-index: 100;
+}
+[data-prefers-color='dark'] .model_container .model_wrap .resizerb {
+  width: 20px;
+  height: 20px;
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  cursor: se-resize;
+  z-index: 101;
+}
 [data-prefers-color='dark'] .model_container .model_wrap .model-header .model-title {
   position: absolute;
   z-index: 99;
@@ -1190,6 +1217,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
   transform: translate(-50%, -50%);
   background: url('data:image/png;base64,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') no-repeat center center;
   width: 630px;
+  width: 60%;
   height: 75px;
   font-size: 18px;
   font-family: Microsoft YaHei Regular, Microsoft YaHei Regular-Regular;
@@ -1200,6 +1228,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
   display: flex;
   justify-content: center;
   align-items: center;
+  background-size: contain;
 }
 [data-prefers-color='dark'] .model_container .model_wrap .model-header .model-title span {
   font-size: 18px;
@@ -1210,6 +1239,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
 }
 [data-prefers-color='dark'] .model_container .model_wrap .model-header .model-title.move {
   cursor: move;
+  z-index: 100;
 }
 [data-prefers-color='dark'] .model_container .model_wrap .model-header .model-closeIcon {
   font-size: 26px;
@@ -1411,6 +1441,15 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
   background: #0f6ab7;
 }
 [data-prefers-color='dark'] .videoContainer {
+  min-width: 400px;
+  min-height: 400px;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+[data-prefers-color='dark'] .videoContainer .videoContainer-grid {
+  flex: 1;
   width: 100%;
   height: 100%;
   display: grid;
@@ -2826,6 +2865,15 @@ button[data-prefers-color='light'] .swiper-pagination-bullet {
   background: #0f6ab7;
 }
 [data-prefers-color='light'] .videoContainer {
+  min-width: 400px;
+  min-height: 400px;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+[data-prefers-color='light'] .videoContainer .videoContainer-grid {
+  flex: 1;
   width: 100%;
   height: 100%;
   display: grid;

package/dist/index.esm.css

@@ -1170,8 +1170,8 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
   border-image-slice: 57 166 62 166;
   border-image-width: 57px 166px 62px 166px;
   border-image-repeat: stretch stretch;
-  min-height: 500px;
-  min-width: 600px;
+  min-height: 300px;
+  min-width: 200px;
 }
 [data-prefers-color='dark'] .model_container .model_wrap {
   position: absolute;
@@ -1182,6 +1182,33 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
   transform: translate(-166px, -60px);
   padding: 12px 6px;
 }
+[data-prefers-color='dark'] .model_container .model_wrap .resizer {
+  width: 10px;
+  height: 100%;
+  position: absolute;
+  right: 0;
+  top: 0;
+  cursor: e-resize;
+  z-index: 100;
+}
+[data-prefers-color='dark'] .model_container .model_wrap .resizeb {
+  width: 100%;
+  height: 10px;
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  cursor: n-resize;
+  z-index: 100;
+}
+[data-prefers-color='dark'] .model_container .model_wrap .resizerb {
+  width: 20px;
+  height: 20px;
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  cursor: se-resize;
+  z-index: 101;
+}
 [data-prefers-color='dark'] .model_container .model_wrap .model-header .model-title {
   position: absolute;
   z-index: 99;
@@ -1190,6 +1217,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
   transform: translate(-50%, -50%);
   background: url('data:image/png;base64,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') no-repeat center center;
   width: 630px;
+  width: 60%;
   height: 75px;
   font-size: 18px;
   font-family: Microsoft YaHei Regular, Microsoft YaHei Regular-Regular;
@@ -1200,6 +1228,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
   display: flex;
   justify-content: center;
   align-items: center;
+  background-size: contain;
 }
 [data-prefers-color='dark'] .model_container .model_wrap .model-header .model-title span {
   font-size: 18px;
@@ -1210,6 +1239,7 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
 }
 [data-prefers-color='dark'] .model_container .model_wrap .model-header .model-title.move {
   cursor: move;
+  z-index: 100;
 }
 [data-prefers-color='dark'] .model_container .model_wrap .model-header .model-closeIcon {
   font-size: 26px;
@@ -1411,6 +1441,15 @@ button[data-prefers-color='dark'] .swiper-pagination-bullet {
   background: #0f6ab7;
 }
 [data-prefers-color='dark'] .videoContainer {
+  min-width: 400px;
+  min-height: 400px;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+[data-prefers-color='dark'] .videoContainer .videoContainer-grid {
+  flex: 1;
   width: 100%;
   height: 100%;
   display: grid;
@@ -2826,6 +2865,15 @@ button[data-prefers-color='light'] .swiper-pagination-bullet {
   background: #0f6ab7;
 }
 [data-prefers-color='light'] .videoContainer {
+  min-width: 400px;
+  min-height: 400px;
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+}
+[data-prefers-color='light'] .videoContainer .videoContainer-grid {
+  flex: 1;
   width: 100%;
   height: 100%;
   display: grid;

package/dist/index.esm.js

@@ -9639,8 +9639,7 @@ var controlShow = function controlShow(f1, f2, value, timer) {
 };
 
 function DialogModel(props, ref) {
-  var _props$width = props.width,
-      width = _props$width === void 0 ? 600 : _props$width,
+  var width = props.width,
       visible = props.visible,
       destroyOnClose = props.destroyOnClose,
       closeCb = props.closeCb,
@@ -9702,8 +9701,7 @@ function DialogModel(props, ref) {
       className: classnames((_classNames = {}, _defineProperty(_classNames, className, true), _defineProperty(_classNames, 'model_container', true), _defineProperty(_classNames, "animate__animated", true), _defineProperty(_classNames, flag ? 'animate__bounceInDown' : 'animate__fadeOutRightBig', true), _classNames)),
       style: _objectSpread2({
         opacity: modelShowAync ? 1 : 0,
-        width: typeof width == 'number' ? width + 'px' : width,
-        left: "calc(50% - ".concat(typeof width == 'number' ? width / 2 : width / 2, "px)")
+        width: typeof width == 'number' ? width + 'px' : width
       }, style)
     }, /*#__PURE__*/React.createElement("div", {
       className: 'model_wrap'
@@ -9732,6 +9730,13 @@ function DialogModel(props, ref) {
       }
     })), document.body);
   }, [modelShowAync, modelShow, props, isDesChild]);
+  useEffect(function () {
+    var containerEl = containerRef.current;
+    var containerElWidth = containerEl.offsetWidth;
+    var containerElHeight = containerEl.offsetHeight;
+    containerEl.style.left = "calc(50% - ".concat(containerElWidth / 2, "px)");
+    containerEl.style.top = "calc(50% - ".concat(containerElHeight / 2, "px)");
+  }, [modelShow]);
   useEffect(function () {
     var containerEl = containerRef.current;
     var rEl = rRef.current;
@@ -9933,6 +9938,11 @@ var Modal = /*#__PURE__*/function (_React$PureComponent) {
         document.onmousemove = null;
       };
     }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      Modal.destory();
+    }
   }, {
     key: "render",
     value: function render() {
@@ -9966,18 +9976,19 @@ var Modal = /*#__PURE__*/function (_React$PureComponent) {
 
 Modal.show = void 0;
 Modal.hidden = void 0;
+Modal.destory = void 0;
+var Modals = {};
 
 Modal.show = function (config) {
-  var ModalContainer = null;
-  var modelSysbol = Symbol('$$__model__Container_hidden');
-  if (ModalContainer) return;
+  var modelSysbol = Math.random().toString(36).slice(2, 36);
+  if (Modals[modelSysbol]) return;
 
   var props = _objectSpread2(_objectSpread2({}, config), {}, {
     visible: true
   });
 
-  var container = ModalContainer = document.createElement('div');
-  var manager = container[modelSysbol] = {
+  var container = document.createElement('div');
+  var manager = container[modelSysbol] = Modals[modelSysbol] = {
     setShow: null,
     mounted: false,
     hidden: function hidden() {
@@ -9986,8 +9997,12 @@ Modal.show = function (config) {
     },
     destory: function destory() {
       ReactDOM.unmountComponentAtNode(container);
-      document.body.removeChild(container);
-      ModalContainer = null;
+
+      if (document.body.contains(container)) {
+        document.body.removeChild(container);
+      }
+
+      delete Modals[modelSysbol];
     }
   };
 
@@ -10019,8 +10034,20 @@ Modal.show = function (config) {
   return manager;
 };
 
-Modal.hidden = function () {// if (!ModalContainer) return;
-  // ModalContainer[modelSysbol] && ModalContainer[modelSysbol].hidden();
+Modal.hidden = function () {
+  if (Object.keys(Modals).length == 0) return;
+
+  for (var key in Modals) {
+    Modals[key].hidden();
+  }
+};
+
+Modal.destory = function () {
+  if (Object.keys(Modals).length == 0) return;
+
+  for (var key in Modals) {
+    Modals[key].destory();
+  }
 };
 
 var controlShow$1 = function controlShow(f1, f2, value, timer) {
@@ -11108,15 +11135,9 @@ function Xgplay(_ref, fRef) {
       setRef = _ref.setRef;
   var ref = useRef(null);
   var playerRef = useRef(null);
-
-  var _useState = useState(null),
-      _useState2 = _slicedToArray(_useState, 2),
-      player = _useState2[0],
-      setPlayer = _useState2[1];
-
   useEffect(function () {
     if (ref.current) {
-      if (type.indexOf('hls') !== -1) {
+      if ((type === null || type === void 0 ? void 0 : type.indexOf('hls')) !== -1) {
         playerRef.current = new HlsJsPlayer(_objectSpread2({
           el: ref.current,
           width: '100%',
@@ -11125,7 +11146,7 @@ function Xgplay(_ref, fRef) {
           isLive: true,
           autoplayMuted: true
         }, config));
-      } else if (type.indexOf('flv') !== -1) {
+      } else if ((type === null || type === void 0 ? void 0 : type.indexOf('flv')) !== -1) {
         playerRef.current = new FlvPlayer(_objectSpread2({
           el: ref.current,
           width: '100%',
@@ -11134,7 +11155,7 @@ function Xgplay(_ref, fRef) {
           isLive: true,
           autoplayMuted: true
         }, config));
-      } else if (type.indexOf('mp4') !== -1) {
+      } else if ((type === null || type === void 0 ? void 0 : type.indexOf('mp4')) !== -1) {
         playerRef.current = new Player(_objectSpread2({
           el: ref.current,
           width: '100%',
@@ -11199,11 +11220,7 @@ var IconFont = createFromIconfontCN({
 function VideoPlayer(_ref, ref) {
   var _ref$footer = _ref.footer,
       footer = _ref$footer === void 0 ? true : _ref$footer,
-      _ref$style = _ref.style,
-      style = _ref$style === void 0 ? {
-    width: 400,
-    height: 400
-  } : _ref$style,
+      style = _ref.style,
       _ref$config = _ref.config,
       config = _ref$config === void 0 ? {} : _ref$config,
       layoutIndex = _ref.layoutIndex,
@@ -11247,20 +11264,25 @@ function VideoPlayer(_ref, ref) {
       currentLayoutIndex = _useState2[0],
       setCurrentLayoutIndex = _useState2[1];
 
+  var _useState3 = useState(url),
+      _useState4 = _slicedToArray(_useState3, 2),
+      urls = _useState4[0],
+      setUrls = _useState4[1];
+
   var initPlayerIndex = layouts[layoutIndex || 0].span >= url.length ? url.length - 1 >= 0 ? url.length - 1 : 0 : layouts[layoutIndex || 0].span - 1;
 
-  var _useState3 = useState(initPlayerIndex),
-      _useState4 = _slicedToArray(_useState3, 2),
-      currentPlayerIndex = _useState4[0],
-      setCurrentPlayerIndex = _useState4[1];
+  var _useState5 = useState(initPlayerIndex),
+      _useState6 = _slicedToArray(_useState5, 2),
+      currentPlayerIndex = _useState6[0],
+      setCurrentPlayerIndex = _useState6[1];
 
   var domRef = useRef(null);
   var playerRef = useRef({});
 
-  var _useState5 = useState([]),
-      _useState6 = _slicedToArray(_useState5, 2),
-      players = _useState6[0],
-      setPlayers = _useState6[1];
+  var _useState7 = useState([]),
+      _useState8 = _slicedToArray(_useState7, 2),
+      players = _useState8[0],
+      setPlayers = _useState8[1];
 
   var renderDom = useMemo(function () {
     var arr = new Array(layouts[currentLayoutIndex].span).fill(0);
@@ -11271,16 +11293,16 @@ function VideoPlayer(_ref, ref) {
         onClickCapture: function onClickCapture() {
           setCurrentPlayerIndex(index);
         }
-      }, url[index] ? /*#__PURE__*/React.createElement(Xgplay$1, {
+      }, urls[index] ? /*#__PURE__*/React.createElement(Xgplay$1, {
         setRef: function setRef(ref) {
           return setPlayers(function (players) {
             players[index] = ref;
             return players;
           });
         },
-        type: url[index],
+        type: urls[index],
         config: _objectSpread2({
-          url: url[index],
+          url: urls[index],
           fluid: true
         }, config)
       }) : /*#__PURE__*/React.createElement("div", {
@@ -11293,7 +11315,7 @@ function VideoPlayer(_ref, ref) {
         }
       }));
     });
-  }, [currentLayoutIndex, currentPlayerIndex, playerRef, url]);
+  }, [currentLayoutIndex, currentPlayerIndex, playerRef, urls]);
 
   function exitFullscreen() {
     if (document.exitFullscreen) {
@@ -11320,10 +11342,13 @@ function VideoPlayer(_ref, ref) {
     var currentPlayer = players[currentPlayerIndex];
 
     if (currentPlayer) {
-      console.log(currentPlayer, 'currentPlayer');
-      currentPlayer.src = url; // debugger
-      // currentPlayer.start(url)
+      currentPlayer.src = url;
     }
+
+    setUrls(function (urls) {
+      urls[currentPlayerIndex] = url;
+      return _toConsumableArray(urls);
+    });
   };
 
   useImperativeHandle(ref, function () {
@@ -11331,14 +11356,16 @@ function VideoPlayer(_ref, ref) {
       players: players,
       currentLayoutIndex: currentLayoutIndex,
       currentPlayerIndex: currentPlayerIndex,
+      urls: urls,
       loadCamera: loadCamera
     };
   });
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "videoContainer",
     style: style
   }, /*#__PURE__*/React.createElement("div", {
     ref: domRef,
-    className: "videoContainer",
+    className: "videoContainer-grid",
     style: layouts[currentLayoutIndex].style
   }, renderDom), footer ? /*#__PURE__*/React.createElement("div", {
     className: "tools"

package/dist/index.js

@@ -9677,8 +9677,7 @@ var controlShow = function controlShow(f1, f2, value, timer) {
 };
 
 function DialogModel(props, ref) {
-  var _props$width = props.width,
-      width = _props$width === void 0 ? 600 : _props$width,
+  var width = props.width,
       visible = props.visible,
       destroyOnClose = props.destroyOnClose,
       closeCb = props.closeCb,
@@ -9740,8 +9739,7 @@ function DialogModel(props, ref) {
       className: classnames__default['default']((_classNames = {}, _defineProperty(_classNames, className, true), _defineProperty(_classNames, 'model_container', true), _defineProperty(_classNames, "animate__animated", true), _defineProperty(_classNames, flag ? 'animate__bounceInDown' : 'animate__fadeOutRightBig', true), _classNames)),
       style: _objectSpread2({
         opacity: modelShowAync ? 1 : 0,
-        width: typeof width == 'number' ? width + 'px' : width,
-        left: "calc(50% - ".concat(typeof width == 'number' ? width / 2 : width / 2, "px)")
+        width: typeof width == 'number' ? width + 'px' : width
       }, style)
     }, /*#__PURE__*/React__default['default'].createElement("div", {
       className: 'model_wrap'
@@ -9770,6 +9768,13 @@ function DialogModel(props, ref) {
       }
     })), document.body);
   }, [modelShowAync, modelShow, props, isDesChild]);
+  React.useEffect(function () {
+    var containerEl = containerRef.current;
+    var containerElWidth = containerEl.offsetWidth;
+    var containerElHeight = containerEl.offsetHeight;
+    containerEl.style.left = "calc(50% - ".concat(containerElWidth / 2, "px)");
+    containerEl.style.top = "calc(50% - ".concat(containerElHeight / 2, "px)");
+  }, [modelShow]);
   React.useEffect(function () {
     var containerEl = containerRef.current;
     var rEl = rRef.current;
@@ -9971,6 +9976,11 @@ var Modal = /*#__PURE__*/function (_React$PureComponent) {
         document.onmousemove = null;
       };
     }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      Modal.destory();
+    }
   }, {
     key: "render",
     value: function render() {
@@ -10004,18 +10014,19 @@ var Modal = /*#__PURE__*/function (_React$PureComponent) {
 
 Modal.show = void 0;
 Modal.hidden = void 0;
+Modal.destory = void 0;
+var Modals = {};
 
 Modal.show = function (config) {
-  var ModalContainer = null;
-  var modelSysbol = Symbol('$$__model__Container_hidden');
-  if (ModalContainer) return;
+  var modelSysbol = Math.random().toString(36).slice(2, 36);
+  if (Modals[modelSysbol]) return;
 
   var props = _objectSpread2(_objectSpread2({}, config), {}, {
     visible: true
   });
 
-  var container = ModalContainer = document.createElement('div');
-  var manager = container[modelSysbol] = {
+  var container = document.createElement('div');
+  var manager = container[modelSysbol] = Modals[modelSysbol] = {
     setShow: null,
     mounted: false,
     hidden: function hidden() {
@@ -10024,8 +10035,12 @@ Modal.show = function (config) {
     },
     destory: function destory() {
       ReactDOM__default['default'].unmountComponentAtNode(container);
-      document.body.removeChild(container);
-      ModalContainer = null;
+
+      if (document.body.contains(container)) {
+        document.body.removeChild(container);
+      }
+
+      delete Modals[modelSysbol];
     }
   };
 
@@ -10057,8 +10072,20 @@ Modal.show = function (config) {
   return manager;
 };
 
-Modal.hidden = function () {// if (!ModalContainer) return;
-  // ModalContainer[modelSysbol] && ModalContainer[modelSysbol].hidden();
+Modal.hidden = function () {
+  if (Object.keys(Modals).length == 0) return;
+
+  for (var key in Modals) {
+    Modals[key].hidden();
+  }
+};
+
+Modal.destory = function () {
+  if (Object.keys(Modals).length == 0) return;
+
+  for (var key in Modals) {
+    Modals[key].destory();
+  }
 };
 
 var controlShow$1 = function controlShow(f1, f2, value, timer) {
@@ -11146,15 +11173,9 @@ function Xgplay(_ref, fRef) {
       setRef = _ref.setRef;
   var ref = React.useRef(null);
   var playerRef = React.useRef(null);
-
-  var _useState = React.useState(null),
-      _useState2 = _slicedToArray(_useState, 2),
-      player = _useState2[0],
-      setPlayer = _useState2[1];
-
   React.useEffect(function () {
     if (ref.current) {
-      if (type.indexOf('hls') !== -1) {
+      if ((type === null || type === void 0 ? void 0 : type.indexOf('hls')) !== -1) {
         playerRef.current = new HlsJsPlayer__default['default'](_objectSpread2({
           el: ref.current,
           width: '100%',
@@ -11163,7 +11184,7 @@ function Xgplay(_ref, fRef) {
           isLive: true,
           autoplayMuted: true
         }, config));
-      } else if (type.indexOf('flv') !== -1) {
+      } else if ((type === null || type === void 0 ? void 0 : type.indexOf('flv')) !== -1) {
         playerRef.current = new FlvPlayer__default['default'](_objectSpread2({
           el: ref.current,
           width: '100%',
@@ -11172,7 +11193,7 @@ function Xgplay(_ref, fRef) {
           isLive: true,
           autoplayMuted: true
         }, config));
-      } else if (type.indexOf('mp4') !== -1) {
+      } else if ((type === null || type === void 0 ? void 0 : type.indexOf('mp4')) !== -1) {
         playerRef.current = new Player__default['default'](_objectSpread2({
           el: ref.current,
           width: '100%',
@@ -11237,11 +11258,7 @@ var IconFont = icons.createFromIconfontCN({
 function VideoPlayer(_ref, ref) {
   var _ref$footer = _ref.footer,
       footer = _ref$footer === void 0 ? true : _ref$footer,
-      _ref$style = _ref.style,
-      style = _ref$style === void 0 ? {
-    width: 400,
-    height: 400
-  } : _ref$style,
+      style = _ref.style,
       _ref$config = _ref.config,
       config = _ref$config === void 0 ? {} : _ref$config,
       layoutIndex = _ref.layoutIndex,
@@ -11285,20 +11302,25 @@ function VideoPlayer(_ref, ref) {
       currentLayoutIndex = _useState2[0],
       setCurrentLayoutIndex = _useState2[1];
 
+  var _useState3 = React.useState(url),
+      _useState4 = _slicedToArray(_useState3, 2),
+      urls = _useState4[0],
+      setUrls = _useState4[1];
+
   var initPlayerIndex = layouts[layoutIndex || 0].span >= url.length ? url.length - 1 >= 0 ? url.length - 1 : 0 : layouts[layoutIndex || 0].span - 1;
 
-  var _useState3 = React.useState(initPlayerIndex),
-      _useState4 = _slicedToArray(_useState3, 2),
-      currentPlayerIndex = _useState4[0],
-      setCurrentPlayerIndex = _useState4[1];
+  var _useState5 = React.useState(initPlayerIndex),
+      _useState6 = _slicedToArray(_useState5, 2),
+      currentPlayerIndex = _useState6[0],
+      setCurrentPlayerIndex = _useState6[1];
 
   var domRef = React.useRef(null);
   var playerRef = React.useRef({});
 
-  var _useState5 = React.useState([]),
-      _useState6 = _slicedToArray(_useState5, 2),
-      players = _useState6[0],
-      setPlayers = _useState6[1];
+  var _useState7 = React.useState([]),
+      _useState8 = _slicedToArray(_useState7, 2),
+      players = _useState8[0],
+      setPlayers = _useState8[1];
 
   var renderDom = React.useMemo(function () {
     var arr = new Array(layouts[currentLayoutIndex].span).fill(0);
@@ -11309,16 +11331,16 @@ function VideoPlayer(_ref, ref) {
         onClickCapture: function onClickCapture() {
           setCurrentPlayerIndex(index);
         }
-      }, url[index] ? /*#__PURE__*/React__default['default'].createElement(Xgplay$1, {
+      }, urls[index] ? /*#__PURE__*/React__default['default'].createElement(Xgplay$1, {
         setRef: function setRef(ref) {
           return setPlayers(function (players) {
             players[index] = ref;
             return players;
           });
         },
-        type: url[index],
+        type: urls[index],
         config: _objectSpread2({
-          url: url[index],
+          url: urls[index],
           fluid: true
         }, config)
       }) : /*#__PURE__*/React__default['default'].createElement("div", {
@@ -11331,7 +11353,7 @@ function VideoPlayer(_ref, ref) {
         }
       }));
     });
-  }, [currentLayoutIndex, currentPlayerIndex, playerRef, url]);
+  }, [currentLayoutIndex, currentPlayerIndex, playerRef, urls]);
 
   function exitFullscreen() {
     if (document.exitFullscreen) {
@@ -11358,10 +11380,13 @@ function VideoPlayer(_ref, ref) {
     var currentPlayer = players[currentPlayerIndex];
 
     if (currentPlayer) {
-      console.log(currentPlayer, 'currentPlayer');
-      currentPlayer.src = url; // debugger
-      // currentPlayer.start(url)
+      currentPlayer.src = url;
     }
+
+    setUrls(function (urls) {
+      urls[currentPlayerIndex] = url;
+      return _toConsumableArray(urls);
+    });
   };
 
   React.useImperativeHandle(ref, function () {
@@ -11369,14 +11394,16 @@ function VideoPlayer(_ref, ref) {
       players: players,
       currentLayoutIndex: currentLayoutIndex,
       currentPlayerIndex: currentPlayerIndex,
+      urls: urls,
       loadCamera: loadCamera
     };
   });
   return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement("div", {
+    className: "videoContainer",
     style: style
   }, /*#__PURE__*/React__default['default'].createElement("div", {
     ref: domRef,
-    className: "videoContainer",
+    className: "videoContainer-grid",
     style: layouts[currentLayoutIndex].style
   }, renderDom), footer ? /*#__PURE__*/React__default['default'].createElement("div", {
     className: "tools"

package/package.json

@@ -1,7 +1,7 @@
 {
   "private": false,
   "name": "wargerm",
-  "version": "0.4.17",
+  "version": "0.4.20",
   "scripts": {
     "dev": "dumi dev",
     "docs:build": "dumi build",