@uni-sw/u-design 2.0.4

package/es/components/UVideo/VideoComponent/PtzControl/PtzControlPanel.js

@@ -0,0 +1,2537 @@
+function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _regenerator() { /*! regenerator-runtime -- Copyright (c) 2014-present, Facebook, Inc. -- license (MIT): https://github.com/babel/babel/blob/main/packages/babel-helpers/LICENSE */ var e, t, r = "function" == typeof Symbol ? Symbol : {}, n = r.iterator || "@@iterator", o = r.toStringTag || "@@toStringTag"; function i(r, n, o, i) { var c = n && n.prototype instanceof Generator ? n : Generator, u = Object.create(c.prototype); return _regeneratorDefine2(u, "_invoke", function (r, n, o) { var i, c, u, f = 0, p = o || [], y = !1, G = { p: 0, n: 0, v: e, a: d, f: d.bind(e, 4), d: function d(t, r) { return i = t, c = 0, u = e, G.n = r, a; } }; function d(r, n) { for (c = r, u = n, t = 0; !y && f && !o && t < p.length; t++) { var o, i = p[t], d = G.p, l = i[2]; r > 3 ? (o = l === n) && (u = i[(c = i[4]) ? 5 : (c = 3, 3)], i[4] = i[5] = e) : i[0] <= d && ((o = r < 2 && d < i[1]) ? (c = 0, G.v = n, G.n = i[1]) : d < l && (o = r < 3 || i[0] > n || n > l) && (i[4] = r, i[5] = n, G.n = l, c = 0)); } if (o || r > 1) return a; throw y = !0, n; } return function (o, p, l) { if (f > 1) throw TypeError("Generator is already running"); for (y && 1 === p && d(p, l), c = p, u = l; (t = c < 2 ? e : u) || !y;) { i || (c ? c < 3 ? (c > 1 && (G.n = -1), d(c, u)) : G.n = u : G.v = u); try { if (f = 2, i) { if (c || (o = "next"), t = i[o]) { if (!(t = t.call(i, u))) throw TypeError("iterator result is not an object"); if (!t.done) return t; u = t.value, c < 2 && (c = 0); } else 1 === c && (t = i.return) && t.call(i), c < 2 && (u = TypeError("The iterator does not provide a '" + o + "' method"), c = 1); i = e; } else if ((t = (y = G.n < 0) ? u : r.call(n, G)) !== a) break; } catch (t) { i = e, c = 1, u = t; } finally { f = 1; } } return { value: t, done: y }; }; }(r, o, i), !0), u; } var a = {}; function Generator() {} function GeneratorFunction() {} function GeneratorFunctionPrototype() {} t = Object.getPrototypeOf; var c = [][n] ? t(t([][n]())) : (_regeneratorDefine2(t = {}, n, function () { return this; }), t), u = GeneratorFunctionPrototype.prototype = Generator.prototype = Object.create(c); function f(e) { return Object.setPrototypeOf ? Object.setPrototypeOf(e, GeneratorFunctionPrototype) : (e.__proto__ = GeneratorFunctionPrototype, _regeneratorDefine2(e, o, "GeneratorFunction")), e.prototype = Object.create(u), e; } return GeneratorFunction.prototype = GeneratorFunctionPrototype, _regeneratorDefine2(u, "constructor", GeneratorFunctionPrototype), _regeneratorDefine2(GeneratorFunctionPrototype, "constructor", GeneratorFunction), GeneratorFunction.displayName = "GeneratorFunction", _regeneratorDefine2(GeneratorFunctionPrototype, o, "GeneratorFunction"), _regeneratorDefine2(u), _regeneratorDefine2(u, o, "Generator"), _regeneratorDefine2(u, n, function () { return this; }), _regeneratorDefine2(u, "toString", function () { return "[object Generator]"; }), (_regenerator = function _regenerator() { return { w: i, m: f }; })(); }
+function _regeneratorDefine2(e, r, n, t) { var i = Object.defineProperty; try { i({}, "", {}); } catch (e) { i = 0; } _regeneratorDefine2 = function _regeneratorDefine(e, r, n, t) { function o(r, n) { _regeneratorDefine2(e, r, function (e) { return this._invoke(r, n, e); }); } r ? i ? i(e, r, { value: n, enumerable: !t, configurable: !t, writable: !t }) : e[r] = n : (o("next", 0), o("throw", 1), o("return", 2)); }, _regeneratorDefine2(e, r, n, t); }
+function asyncGeneratorStep(n, t, e, r, o, a, c) { try { var i = n[a](c), u = i.value; } catch (n) { return void e(n); } i.done ? t(u) : Promise.resolve(u).then(r, o); }
+function _asyncToGenerator(n) { return function () { var t = this, e = arguments; return new Promise(function (r, o) { var a = n.apply(t, e); function _next(n) { asyncGeneratorStep(a, r, o, _next, _throw, "next", n); } function _throw(n) { asyncGeneratorStep(a, r, o, _next, _throw, "throw", n); } _next(void 0); }); }; }
+function _classCallCheck(a, n) { if (!(a instanceof n)) throw new TypeError("Cannot call a class as a function"); }
+function _defineProperties(e, r) { for (var t = 0; t < r.length; t++) { var o = r[t]; o.enumerable = o.enumerable || !1, o.configurable = !0, "value" in o && (o.writable = !0), Object.defineProperty(e, _toPropertyKey(o.key), o); } }
+function _createClass(e, r, t) { return r && _defineProperties(e.prototype, r), t && _defineProperties(e, t), Object.defineProperty(e, "prototype", { writable: !1 }), e; }
+function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == _typeof(i) ? i : i + ""; }
+function _toPrimitive(t, r) { if ("object" != _typeof(t) || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != _typeof(i)) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
+function _callSuper(t, o, e) { return o = _getPrototypeOf(o), _possibleConstructorReturn(t, _isNativeReflectConstruct() ? Reflect.construct(o, e || [], _getPrototypeOf(t).constructor) : o.apply(t, e)); }
+function _possibleConstructorReturn(t, e) { if (e && ("object" == _typeof(e) || "function" == typeof e)) return e; if (void 0 !== e) throw new TypeError("Derived constructors may only return object or undefined"); return _assertThisInitialized(t); }
+function _assertThisInitialized(e) { if (void 0 === e) throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); return e; }
+function _isNativeReflectConstruct() { try { var t = !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (t) {} return (_isNativeReflectConstruct = function _isNativeReflectConstruct() { return !!t; })(); }
+function _getPrototypeOf(t) { return _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf.bind() : function (t) { return t.__proto__ || Object.getPrototypeOf(t); }, _getPrototypeOf(t); }
+function _inherits(t, e) { if ("function" != typeof e && null !== e) throw new TypeError("Super expression must either be null or a function"); t.prototype = Object.create(e && e.prototype, { constructor: { value: t, writable: !0, configurable: !0 } }), Object.defineProperty(t, "prototype", { writable: !1 }), e && _setPrototypeOf(t, e); }
+function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
+import React, { Component } from 'react';
+import UModal from "../../../UModal";
+import UButton from "../../../UButton";
+import message from "../../../UMessageBox/message";
+import UTable from "../../../UTable";
+import Select from "../../../USelect/select";
+import Slider from "../../../USlider/slider";
+import UInputNumber from "../../../UInputNumber";
+import Radio from "../../../URadioGroup/radio/radio";
+import Tabs from "../../../UTabs/tabs";
+import "./PtzControlPanel.less";
+import moment from 'moment';
+import * as Restful from "./HttpRequest";
+import { PtzCmd } from "./PtzCmd";
+import PtzPresetAddCtr from "./PtzPresetAddCtr";
+import PtzSetGuardCtr from "./PtzSetGuardCtr";
+import PtzAddCruisePathCtr from "./PtzAddCruisePathCtr";
+import ConfigCruisePathPlan from "./ConfigCruisePathPlan";
+import { CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME } from "../../HideDiv";
+var TabPane = Tabs.TabPane;
+var Option = Select.Option;
+
+/**
+ *云台控制面板
+ */
+var PtzControlPanel = /*#__PURE__*/function (_Component) {
+  function PtzControlPanel(props) {
+    var _this;
+    _classCallCheck(this, PtzControlPanel);
+    _this = _callSuper(this, PtzControlPanel, [props]);
+    //获取节点的位置信息，left、top、width、height
+    _this._getDomPosi = function (dom, type) {
+      if (dom instanceof Element) {
+        var rect = dom.getBoundingClientRect();
+        if (type === undefined) {
+          return rect;
+        } else {
+          return rect[type];
+        }
+      }
+    };
+    //#endregion
+    //tabs切换事件,查询预置位信息
+    _this._onclickChange = function (key) {
+      if (key === '1') {
+        _this._queryPresetList();
+      }
+    };
+    //#region 鼠标拖动
+    _this._onMouseDown = function (e) {
+      e.stopPropagation();
+      _this.isMoving = true;
+    };
+    _this._onMouseUp = function (e) {
+      _this.isMoving = false;
+      _this.lastX = null;
+      _this.lastY = null;
+    };
+    _this._onMouseMove = function (e) {
+      if (!_this.isMoving) {
+        return;
+      }
+      if (_this.lastX && _this.lastY) {
+        var dx = e.clientX - _this.lastX;
+        var dy = e.clientY - _this.lastY;
+        //this.setState({ pnlPosX: this.state.pnlPosX + dx, pnlPosY: this.state.pnlPosY + dy });
+        _this.props.movePtzPnl(dx, dy);
+      }
+      _this.lastX = e.clientX;
+      _this.lastY = e.clientY;
+      _this.ptzDirPnlPosi = _this._getDomPosi(_this.ptzDirPnlContainer);
+    };
+    //#endregion 鼠标拖动
+    /**
+     *窗体操作关闭
+     */
+    _this.onCloseClick = function () {
+      _this.props.onPtzPnlCloseClick(_this.state.pnlPosX, _this.state.pnlPosY);
+    };
+    //#region 云台锁定、解锁、释放,
+    /**
+     *锁定云台
+     */
+    _this._onLockPtz = function () {
+      message.destroy();
+      var textLocale = _this.props.textLocale;
+      if (_this.curVideoCam !== null) {
+        Restful.LockPtz(_this.curVideoCam.CameraCode, function (ret) {
+          if (ret != null) {
+            if (ret.data.ErrCode === 0) {
+              console.log('锁定云台成功');
+              _this.setState({
+                isLock: true
+              });
+            } else {
+              message.error(textLocale.failedLockHeadErrorMes + ret.data.ErrMsg, 1);
+            }
+          } else {
+            message.error(textLocale.failedLockHeadResultEmpty, 1);
+          }
+        });
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    /**
+     * 解锁云台
+     */
+    _this._onUnLockPtz = function () {
+      message.destroy();
+      var textLocale = _this.props.textLocale;
+      if (_this.curVideoCam !== null) {
+        Restful.UnLockPtz(_this.curVideoCam.CameraCode, function (ret) {
+          if (ret != null) {
+            if (ret.data.ErrCode === 0) {
+              console.log('解锁云台成功', 1);
+              _this.setState({
+                isLock: false
+              });
+            } else {
+              message.error(textLocale.failedUnLockHeadErrorMes + ret.data.ErrMsg, 1);
+            }
+          } else {
+            message.error(textLocale.failedUnLockHeadResultEmpty, 1);
+          }
+        });
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    /**
+     * 释放云台
+     */
+    _this._onReleasePtz = function () {
+      message.destroy();
+      var textLocale = _this.props.textLocale;
+      if (_this.curVideoCam !== null) {
+        Restful.ReleasePtz(_this.curVideoCam.CameraCode, function (ret) {
+          if (ret != null) {
+            if (ret.data.ErrCode === 0) {
+              console.log('释放云台成功', 1);
+              _this.setState({
+                isLock: false
+              });
+            } else {
+              message.error(textLocale.failedReleaseHeadErrorMes + ret.data.ErrMsg, 1);
+            }
+          } else {
+            message.error(textLocale.failedReleaseHeadResultEmpty, 1);
+          }
+        });
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    /**
+     * 启动云台操作-聚焦、倍速、光圈、方向盘、光照、雨刷、红外、加热、除雪。。。。。
+     *@param {*} operateType 操作类型
+     *@param {*} ptzCmdID 操作命令ID
+     *@param {*} operateDes 操作描述
+     */
+    _this.OnOperationPtzDown = function (operateType, ptzCmdID, operateDes) {
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode !== null) {
+        var condition = _this.GetOperateCondition(operateType, ptzCmdID);
+        _this._operatePtz(operateType, condition, operateDes);
+      }
+    };
+    /**
+     * 停止云台操作-聚焦、倍速、光圈、方向盘、光照、雨刷、红外、加热、除雪。。。。。
+     *@param {*} operateType 操作类型
+     *@param {*} ptzCmdID 操作命令ID
+     *@param {*} operateDes 操作描述
+     */
+    _this._onOperationPtzUp = function (operateType, ptzCmdID, operateDes) {
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode !== null) {
+        var condition = _this.GetOperateCondition(operateType, ptzCmdID);
+        _this._operatePtz(operateType, condition, operateDes);
+      }
+    };
+    /**
+     *设置扩展面板功能使能:光照、雨刷、红外、加热、除雪。。。。。
+     */
+    _this.SetMorePnlEnable = function (operateType) {
+      switch (operateType) {
+        case 'light':
+          //光照
+          _this.setState({
+            isLightOn: !_this.state.isLightOn
+          });
+          break;
+        case 'wiper':
+          //雨刷
+          _this.setState({
+            isWipertOn: !_this.state.isWipertOn
+          });
+          break;
+        case 'infrare':
+          //红外
+          _this.setState({
+            isInfrareOn: !_this.state.isInfrareOn
+          });
+          break;
+        case 'heat':
+          //加热
+          _this.setState({
+            isHeatOn: !_this.state.isHeatOn
+          });
+          break;
+        default:
+          break;
+      }
+    };
+    //获取操作命令参数-聚焦、倍速、光圈、方向盘、光照、雨刷、红外、加热、除雪。。。。。
+    _this.GetOperateCondition = function (operateType, ptzCmdID) {
+      var condition = {};
+      //部分case可以合并。因为接口说明文档里面没有明确后面三个字段究竟是啥数据，所以分开写，赋值按照老客户端里面的逻辑进行赋值
+      switch (operateType) {
+        case 'forcus':
+          //聚焦参数
+          condition = {
+            PTZCmdID: ptzCmdID,
+            PTZCmdPara1: 6,
+            //老代码里面该字段是写死的...
+            PTZCmdPara2: 6,
+            //老代码里面该字段是写死的...
+            PTZCmdPara3: 6 //预留字段
+          };
+          break;
+        case 'zoom':
+          //变倍
+          condition = {
+            PTZCmdID: ptzCmdID,
+            PTZCmdPara1: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara2: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara3: 0 //预留字段
+          };
+          break;
+        case 'iris':
+          //光圈
+          condition = {
+            PTZCmdID: ptzCmdID,
+            PTZCmdPara1: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara2: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara3: 0 //预留字段
+          };
+          break;
+        case 'direction':
+          //方向
+          condition = {
+            PTZCmdID: ptzCmdID,
+            PTZCmdPara1: _this.ptzSpeed,
+            //---云台转速...
+            PTZCmdPara2: _this.ptzSpeed,
+            //---云台转速...
+            PTZCmdPara3: 0 //预留字段
+          };
+          break;
+        case 'light':
+          //光照
+          condition = {
+            PTZCmdID: ptzCmdID,
+            PTZCmdPara1: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara2: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara3: 0 //预留字段
+          };
+          break;
+        case 'wiper':
+          //雨刷
+          condition = {
+            PTZCmdID: ptzCmdID,
+            PTZCmdPara1: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara2: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara3: 0 //预留字段
+          };
+          break;
+        case 'infrare':
+          //红外
+          condition = {
+            PTZCmdID: ptzCmdID,
+            PTZCmdPara1: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara2: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara3: 0 //预留字段
+          };
+          break;
+        case 'heat':
+          //加热
+          condition = {
+            PTZCmdID: ptzCmdID,
+            PTZCmdPara1: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara2: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara3: 0 //预留字段
+          };
+          break;
+        case 'snow':
+          //除雪
+          condition = {
+            PTZCmdID: ptzCmdID,
+            PTZCmdPara1: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara2: 0,
+            //老代码里面该字段是写死的...
+            PTZCmdPara3: 0 //预留字段
+          };
+          break;
+        default:
+          condition = {};
+          break;
+      }
+      return condition;
+    };
+    //云台操作
+    _this._operatePtz = function (operateType, condition, operateDes) {
+      message.destroy();
+      var textLocale = _this.props.textLocale;
+      Restful.StartPtz(_this.curVideoCam.CameraCode, function (startRet) {
+        if (startRet != null && startRet.data != null) {
+          if (startRet.data.ErrCode === 0) {
+            Restful.OperationPtz(_this.curVideoCam.CameraCode, JSON.stringify(condition), function (optRet) {
+              if (optRet != null && optRet.data != null) {
+                if (optRet.data.ErrCode === 0) {
+                  console.log(operateDes + '操作成功');
+                  if (operateType === 'light' || operateType === 'wiper' || operateType === 'infrare' || operateType === 'heat') {
+                    _this.SetMorePnlEnable(operateType);
+                  }
+                } else {
+                  message.error(operateDes + textLocale.operationFailure + optRet.data.ErrMsg, 1);
+                  return false;
+                }
+              } else {
+                message.error(operateDes + textLocale.operationFailureResultEmpty, 1);
+                return false;
+              }
+            });
+          } else {
+            message.error(textLocale.failedControlHead + startRet.data.ErrMsg, 1);
+            return false;
+          }
+        } else {
+          message.error(textLocale.failedControlHeadResultEmpty, 1);
+          return false;
+        }
+      });
+    };
+    //查询云台状态
+    _this._queryPtzStatus = function () {
+      message.destroy();
+      var textLocale = _this.props.textLocale;
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode !== null) {
+        Restful.QueryPtzStatue(_this.curVideoCam.CameraCode, function (queryRet) {
+          if (queryRet != null && queryRet.data != null) {
+            if (queryRet.data.ErrCode === 0) {
+              console.log('查询云台状态成功');
+              //根据查询结果的赋值锁定图标
+              _this.setState({
+                isLock: queryRet.data.Result.Status === 2 ? true : false
+              });
+            } else {
+              message.error(textLocale.failedQueryHead + queryRet.data.ErrMsg, 1);
+            }
+          } else {
+            message.error(textLocale.failedQueryHeadResultEmpty, 1);
+          }
+        });
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    //#endregion
+    //#region ptzPnl中方向盘事件
+    /**
+     * 方向盘中鼠标移动
+     */
+    _this._onptzDirPnlMove = function (e) {
+      var CenterPosi = {
+        X: _this.ptzDirPnlPosi.width / 2 + _this.ptzDirPnlPosi.left,
+        Y: _this.ptzDirPnlPosi.height / 2 + _this.ptzDirPnlPosi.top
+      };
+      var distance = _this._getDistance(e.clientX, e.clientY, CenterPosi.X, CenterPosi.Y);
+      //判断mousePosi在方向盘的哪个位置，然后进行判断显示
+      var angle = _this._getAngle(e.clientX, e.clientY, CenterPosi.X, CenterPosi.Y, distance);
+      if (distance > 50) {
+        //外圆半径-在方向盘外，需要将标志位都置为false
+        _this.setState({
+          dirIndex: 10
+        });
+      } else if (distance < 23) {
+        //内圆半径-在方向盘中间区域
+        _this.setState({
+          dirIndex: 9
+        });
+      } else {
+        //在方向盘方向区域，根据计算的倾斜角度判断属于哪个区域
+        if (e.clientX > CenterPosi.X) {
+          //右半边：-90度~90度
+          if (angle < -67.5) {
+            //T
+            _this.setState({
+              dirIndex: 1
+            });
+          } else if (angle > -67.5 && angle < -22.5) {
+            //RT
+            _this.setState({
+              dirIndex: 2
+            });
+          } else if (angle > -22.5 && angle < 22.5) {
+            //R
+            _this.setState({
+              dirIndex: 3
+            });
+          } else if (angle > 22.5 && angle < 67.5) {
+            //RB
+            _this.setState({
+              dirIndex: 4
+            });
+          } else if (angle > 67.5) {
+            //B
+            _this.setState({
+              dirIndex: 5
+            });
+          }
+        } else {
+          //左半边：-90度~90度
+          if (angle < -67.5) {
+            //T
+            _this.setState({
+              dirIndex: 1
+            });
+          } else if (angle > -67.5 && angle < -22.5) {
+            //LT
+            _this.setState({
+              dirIndex: 8
+            });
+          } else if (angle > -22.5 && angle < 22.5) {
+            //L
+            _this.setState({
+              dirIndex: 7
+            });
+          } else if (angle > 22.5 && angle < 67.5) {
+            //LB
+            _this.setState({
+              dirIndex: 6
+            });
+          } else if (angle > 67.5) {
+            //B
+            _this.setState({
+              dirIndex: 5
+            });
+          }
+        }
+      }
+    };
+    //计算两点之间的直线距离
+    _this._getDistance = function (x1, y1, x2, y2) {
+      var distance = 0;
+      var x = Math.abs(x1 - x2);
+      var y = Math.abs(y1 - y2);
+      distance = Math.sqrt(x * x + y * y);
+      return distance;
+    };
+    //计算角度
+    _this._getAngle = function (x1, y1, x2, y2, distance) {
+      var angle;
+      var y = y1 - y2;
+      angle = Math.asin(y / distance) * (180 / Math.PI);
+      return angle;
+    };
+    /**
+     * 方向面板鼠标放下
+     */
+    _this._onPtzDirPnlDown = function (cmdID, poerateDes) {
+      //调用操作命令接口
+      _this.OnOperationPtzDown('direction', cmdID, poerateDes);
+    };
+    /**
+     * 方向面板鼠标松开
+     */
+    _this._onPtzDirPnlUp = function (cmdID, poerateDes) {
+      _this._onOperationPtzUp('direction', cmdID, poerateDes);
+    };
+    _this._onPtzDirMidPnlClick = function () {
+      _this._stopCruisePath();
+    };
+    //#endregion
+    //#region 预置位操作
+    /**
+     * 增加预置位鼠标点击
+     */
+    _this._onSetPresetClick = function (e) {
+      _this.setState({
+        isShowPresetAddForm: true
+      });
+    };
+    /**
+     * 增加预置位取消点击
+     */
+    _this._onSetPresetCancel = function (e) {
+      _this.setState({
+        isShowPresetAddForm: false
+      });
+    };
+    /**
+     * 选择预置位
+     */
+    _this._onPresetSelectedChange = function (value, option) {
+      var selectedPreset = {
+        PresetValue: Number(option.key),
+        PresetDes: value
+      };
+      _this.setState({
+        curSelectedPreset: selectedPreset
+      }, function () {
+        // 选择预置位后自动转到对应位置
+        _this._usePreset();
+      });
+    };
+    /**
+     * 预置位查询
+     */
+    _this._queryPresetList = function (callback) {
+      var textLocale = _this.props.textLocale;
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode != null) {
+        Restful.QueryPreset(_this.curVideoCam.CameraCode, 0, function (queryRet) {
+          if (queryRet != null && queryRet.data != null) {
+            if (queryRet.data.ErrCode === 0) {
+              //查询成功，赋值查询结果，默认显示第一条预置位信息
+              var queryPresetInfo = [];
+              if (queryRet.data.Result.InfoList.length > 0) {
+                queryRet.data.Result.InfoList.map(function (item) {
+                  queryPresetInfo.push({
+                    PresetValue: item.PresetValue,
+                    PresetDes: item.PresetDesc
+                  });
+                });
+                //总数超过200条了，需要再查一轮
+                if (queryRet.data.Result.RspPageInfo.TotalRowNum > 200) {
+                  Restful.QueryPreset(_this.curVideoCam.CameraCode, 200, function (queryRet) {
+                    if (queryRet != null && queryRet.data != null) {
+                      if (queryRet.data.ErrCode === 0) {
+                        if (queryRet.data.Result.InfoList.length > 0) {
+                          queryRet.data.Result.InfoList.map(function (item) {
+                            queryPresetInfo.push({
+                              PresetValue: item.PresetValue,
+                              PresetDes: item.PresetDesc
+                            });
+                          });
+                        }
+                      }
+                    }
+                  });
+                }
+              } else {
+                console.log('查询预置位成功,预置位数量为0');
+              }
+              _this.setState({
+                presetListOptions: queryPresetInfo,
+                curSelectedPreset: queryPresetInfo.length > 0 ? queryPresetInfo[0] : null
+              });
+              if (callback && typeof callback === 'function') {
+                callback(true);
+              }
+            } else {
+              message.error('查询预置位失败:' + queryRet.data.ErrMsg, 1);
+            }
+          } else {
+            message.error('预置位失败，返回结果为空', 1);
+          }
+        });
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    /**
+     * 添加预置位点击
+     */
+    _this._addPresetClick = function () {
+      var addPresetCode = _this.presetAddCtrDom.state.curSelPresetCode;
+      var textLocale = _this.props.textLocale;
+      message.destroy();
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode != null) {
+        if (!_this.presetAddCtrDom.codeRef.checkTextLegal()) {
+          _this.presetAddCtrDom.refs.code.focus();
+          return;
+        }
+        if (!_this.presetAddCtrDom.nameRef.checkTextLegal()) {
+          _this.presetAddCtrDom.refs.name.focus();
+          return;
+        }
+        var isContains = false;
+        _this.state.presetListOptions.map(function (item) {
+          if (item.PresetValue === addPresetCode) {
+            isContains = true;
+          }
+        });
+        if (isContains) {
+          _this.setState({
+            isShowModifyPromptForm: true
+          });
+        } else {
+          _this._addPreset();
+        }
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    /**
+     * 预置位修改提示
+     */
+    _this._presetAddPromptCancel = function () {
+      _this.setState({
+        isShowModifyPromptForm: false
+      });
+    };
+    /**
+     * 添加预置位确定
+     */
+    _this._presetAddPromptOK = function () {
+      _this._addPreset();
+    };
+    //添加/设置预置位
+    _this._addPreset = function () {
+      message.destroy();
+      var addPresetCode = _this.presetAddCtrDom.state.curSelPresetCode;
+      var addPresetName = _this.presetAddCtrDom.nameRef.getInputText();
+      var condition = {
+        PresetValue: addPresetCode,
+        PresetDesc: addPresetName
+      };
+      console.log('===condition' + JSON.stringify(condition));
+      _this.setState({
+        isShowModifyPromptForm: false
+      }, function () {
+        Restful.AddPreset(_this.curVideoCam.CameraCode, JSON.stringify(condition), function (ret) {
+          if (ret != null && ret.data != null) {
+            if (ret.data.ErrCode === 0) {
+              console.log('添加预置位成功');
+              _this._queryPresetList(function (queryRet) {
+                _this.setState({
+                  isShowPresetAddForm: false,
+                  curSelectedPreset: {
+                    PresetValue: addPresetCode,
+                    PresetDes: addPresetName
+                  }
+                });
+              });
+              //添加完成之后关闭添加窗体
+            } else {
+              message.error('添加预置位失败:' + ret.data.ErrMsg, 1);
+            }
+          } else {
+            message.error('添加预置位失败，返回结果为空', 1);
+          }
+        });
+      });
+    };
+    /**
+     * 使用预置位/跳转到预置位
+     */
+    _this._usePreset = function (e) {
+      message.destroy();
+      var textLocale = _this.props.textLocale;
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode != null) {
+        if (_this.state.curSelectedPreset == null) {
+          message.warn('请先选择预置位', 1);
+          return;
+        }
+        Restful.UsePreset(_this.curVideoCam.CameraCode, _this.state.curSelectedPreset.PresetValue, function (useRet) {
+          if (useRet != null && useRet.data != null) {
+            if (useRet.data.ErrCode === 0) {
+              console.log('使用预置位成功');
+            } else {
+              message.error('使用预置位失败:' + useRet.data.ErrMsg, 1);
+            }
+          } else {
+            message.error('使用预置位失败，返回结果为空', 1);
+          }
+        });
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    /**
+     * 删除预置位点击
+     */
+    _this._onDelPresetHandleClick = function () {
+      var presetListOptions = _this.state.presetListOptions;
+      var textLocale = _this.props.textLocale;
+      if (0 === presetListOptions.length) {
+        message.info(textLocale.noPresetDelete);
+        return;
+      }
+      _this.setState({
+        isShowDelPromptForm: true,
+        deletingPreset: []
+      });
+    };
+    /**
+     * 删除预置位取消
+     */
+    _this._onDelPresetHandleCancle = function () {
+      _this.setState({
+        isShowDelPromptForm: false
+      });
+    };
+    /**
+     * 删除预置位确定
+     */
+    _this._delPreset = function () {
+      var deletingPreset = _this.state.deletingPreset;
+      var textLocale = _this.props.textLocale;
+      message.destroy();
+      if (0 === deletingPreset.length) {
+        message.info(textLocale.pleaseSelectDeletePreset, 1);
+        return;
+      }
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode != null) {
+        var successNum = 0;
+        var deletedNum = 0;
+        var allNum = deletingPreset.length;
+        deletingPreset.forEach(function (item) {
+          var CameraCode = _this.curVideoCam.CameraCode;
+          Restful.DelPreset(CameraCode, item.PresetValue, function (result, errMsg) {
+            if (1 === allNum) {
+              if (result) {
+                message.success('删除预置位成功', 1);
+                _this.setState({
+                  isShowDelPromptForm: false
+                });
+                _this._queryPresetList();
+                return;
+              }
+              message.error('删除预置位失败:' + errMsg, 1);
+              return;
+            }
+            ++deletedNum;
+            if (result) {
+              successNum++;
+            }
+            if (deletedNum === allNum) {
+              if (successNum) {
+                message.success("\u5220\u9664\u9884\u7F6E\u4F4D\u5171".concat(allNum, "\u4E2A\uFF0C\u6210\u529F").concat(successNum, "\u4E2A\uFF0C\u5931\u8D25").concat(allNum - successNum, "\u4E2A"), 1);
+                _this.setState({
+                  isShowDelPromptForm: false
+                });
+                _this._queryPresetList();
+                return;
+              }
+              message.error("\u5220\u9664\u9884\u7F6E\u4F4D\u5171".concat(allNum, "\u4E2A\uFF0C\u6210\u529F").concat(successNum, "\u4E2A\uFF0C\u5931\u8D25").concat(allNum - successNum, "\u4E2A"), 1);
+            }
+          });
+        });
+      } else {
+        message.error('相机为空信息', 1);
+      }
+    };
+    /**
+     * 同步前端预置位数据
+     */
+    _this._synchrodataPreset = function (callback) {
+      message.destroy();
+      var textLocale = _this.props.textLocale;
+      _this.synchrodataRef.className = 'ptzctr-preset-synchrodata1Icon';
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode != null) {
+        Restful.QueryPresetV2(_this.curVideoCam.CameraCode, function (queryRet) {
+          if (queryRet != null && queryRet.data != null) {
+            //调用完接口之后就停掉,但是正常情况下接口相应速度很快，基本看不到图片更换过程，视觉上设置这个动效意义并不大...
+            _this.synchrodataRef.className = 'ptzctr-preset-synchrodataIcon';
+            if (queryRet.data.ErrCode === 0) {
+              console.log('同步预置位数据成功');
+              //查询成功，赋值查询结果，默认显示第一条预置位信息
+              var queryPresetInfo = [];
+              if (queryRet.data.PresetList.length > 0) {
+                queryRet.data.PresetList.map(function (item) {
+                  queryPresetInfo.push({
+                    PresetValue: item.PresetValue,
+                    PresetDes: item.PresetDesc
+                  });
+                });
+                message.success('同步预置位数据成功', 1);
+              } else {
+                message.info('查询预置位成功,预置位数量为0', 1);
+              }
+              _this.setState({
+                presetListOptions: queryPresetInfo,
+                curSelectedPreset: queryPresetInfo.length > 0 ? queryPresetInfo[0] : null
+              });
+              if (callback && typeof callback === 'function') {
+                callback(true);
+              }
+            } else {
+              message.error('同步预置位数据失败:' + queryRet.data.ErrMsg, 1);
+            }
+          } else {
+            _this.synchrodataRef.className = 'ptzctr-preset-synchrodataIcon';
+            message.error('同步预置位数据失败，返回结果为空', 1);
+          }
+        });
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    /**
+     * 切换图标
+     */
+    _this._changeIcon = function (index) {
+      var imgStyleList = ['ptzctr-preset-synchrodata1Icon', 'ptzctr-preset-synchrodata2Icon', 'ptzctr-preset-synchrodata3Icon', 'ptzctr-preset-synchrodata4Icon', 'ptzctr-preset-synchrodata5Icon', 'ptzctr-preset-synchrodata6Icon'];
+      _this.synchrodataRef.className = imgStyleList[index];
+      index++;
+      if (index >= imgStyleList.length) {
+        index = 0; //循环显示
+      }
+      if (_this.isStopChangeIcon === true) {
+        _this.synchrodataRef.className = 'ptzctr-preset-synchrodataIcon';
+        return;
+      }
+      setTimeout(function () {
+        _this._changeIcon(index);
+      }, 500);
+    };
+    //#endregion 预置位操作
+    //#region 看守位操作
+    /**
+     * 设置看守位点击
+     */
+    _this._onGuardTimeHandleClick = function () {
+      message.destroy();
+      if (_this.state.curSelectedPreset === null) {
+        message.warn('请先选择预置位', 1);
+        return;
+      }
+      _this.setState({
+        isShowAutoGuardTimeForm: true
+      });
+    };
+    /**
+     * 设置看守位取消
+     */
+    _this._onGuardTimeHandleCancel = function () {
+      _this.setState({
+        isShowAutoGuardTimeForm: false
+      });
+    };
+    /**
+     * 自动看守时间变更
+     */
+    _this._onGuardTimeHandleChange = function (e) {
+      if (_this._numChecked(e) && e !== null) {
+        _this.setState({
+          autoGuardTime: e
+        });
+      }
+    };
+    /**
+     * 变更时间校验
+     */
+    _this._numChecked = function (num) {
+      var reg = /^[0-9]*$/;
+      if (reg.test(num)) {
+        return true;
+      }
+      return false;
+    };
+    /**
+     * 设置单个看守位
+     */
+    _this._onGuardTimeHandleOK = function () {
+      message.destroy();
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode != null) {
+        if (_this.state.curSelectedPreset == null) {
+          message.warn('请先选择预置位', 1);
+          return;
+        }
+        Restful.SetGuardPosition(_this.curVideoCam.CameraCode, _this.state.curSelectedPreset.PresetValue, _this.state.autoGuardTime, function (setRet) {
+          if (setRet != null && setRet.data != null) {
+            if (setRet.data.ErrCode === 0) {
+              _this.setState({
+                isShowAutoGuardTimeForm: false,
+                guardPlanStatus: 1
+              });
+              console.log('设置为看守位成功');
+            } else {
+              message.error('设置为看守位失败:' + setRet.data.ErrMsg, 1);
+            }
+          } else {
+            message.error('设置为看守位失败，返回结果为空', 1);
+          }
+        });
+      }
+    };
+    //删除看守位
+    _this._deleteGuardPositionPlan = function () {
+      message.destroy();
+      var guardPositionPlanList = _this.state.guardPositionPlanList;
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode != null) {
+        Restful.DeleteGuardPositionPlan(_this.curVideoCam.CameraCode, function (ret) {
+          if (ret != null && ret.data != null) {
+            if (ret.data.ErrCode === 0) {
+              console.log('删除看守位成功');
+            } else {
+              message.error('删除看守位失败:' + ret.data.ErrMsg, 1);
+            }
+          } else {
+            message.error('删除看守位失败，返回结果为空', 1);
+          }
+        });
+      } else {
+        message.error('看守位计划信息为空', 1);
+      }
+    };
+    /**
+     * 是否启动看守位变更
+     */
+    _this._onGuardEnableChange = function (e) {
+      var guardEnable = false;
+      var guardPlanStatus = 0;
+      if (e !== null) {
+        e.target.value === 0 ? guardEnable = false : guardEnable = true;
+        e.target.value === 0 ? guardPlanStatus = 0 : guardPlanStatus = 1;
+      }
+      _this.setState({
+        guardEnable: guardEnable,
+        guardPlanStatus: guardPlanStatus
+      });
+      var guardPositionPlanList = _this.state.guardPositionPlanList;
+      if (guardEnable === false) {
+        _this._deleteGuardPositionPlan();
+        _this._queryGuardPositionPlanList(function (ret) {
+          if (guardPositionPlanList !== null && guardPositionPlanList.length !== 0) {
+            if (guardPositionPlanList[0].PlanStatus === 1 && Number(guardPositionPlanList[0].GuardPositionPlanCode) !== 0) {
+              Restful.ProcessGuardPositionPlan(0, guardPositionPlanList[0].GuardPositionPlanCode, function (ret) {
+                console.log('停止看守位：' + JSON.stringify(ret.data));
+              });
+            }
+          }
+        });
+      }
+    };
+    /**
+     * 设置看守位点击
+     */
+    _this._onSetGuarClick = function () {
+      _this._queryGuardPositionPlanList(function (ret) {
+        _this.setState({
+          isShowSetGuardForm: true
+        });
+      });
+    };
+    /**
+     * 看守位设置取消
+     */
+    _this._onSetGuardHandleCancel = function () {
+      _this.setState({
+        isShowSetGuardForm: false
+      });
+    };
+    /**
+     * 看守位设置确定
+     */
+    _this._onSetGuardHandleOK = function () {
+      message.destroy();
+      var isCreat = true;
+      var textLocale = _this.props.textLocale;
+      if (_this.state.guardPositionPlanList !== null) {
+        if (_this.state.guardPositionPlanList.length !== 0) {
+          if (Number(_this.state.guardPositionPlanList[0].GuardPositionPlanCode) !== 0) {
+            isCreat = false;
+          }
+        }
+      }
+      _this.ptzSetGuardCtrDom.state.guardPositionPlanDetailInfo;
+      var guardPositionPlanList = _this.state.guardPositionPlanList;
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode != null) {
+        if (_this.ptzSetGuardCtrDom.state.guardPositionPlanDetailInfo === null) {
+          message.error('预置位信息不能为空', 1);
+          return;
+        }
+        if (_this.state.guardPositionPlanList.length === 0) {
+          message.error('看守位信息不能为空', 1);
+          return;
+        }
+        var selPresetList = _this.ptzSetGuardCtrDom.state.guardPositionPlanDetailInfo;
+        var isOk = _this._chenckPositionPlanData(selPresetList);
+        if (!isOk) {
+          return;
+        }
+
+        /** 看守计划基本信息 */
+        var date = new Date();
+        var guardPositionBaseInfo = {
+          GuardPositionPlanName: '' /** 计划名称 */,
+          CreatorName: '' /** 计划创建者名称 */,
+          CreatTime: moment(date).format('YYYY-MM-DD HH:mm:ss') /** 计划创建日期 */,
+          CamCode: _this.curVideoCam.CameraCode /** 摄像机编码 */,
+          CamName: _this.curVideoCam.CameraName /** 摄像机名称 */,
+          OrgCode: ' iccsid' /** 看守计划所属组织编码，可不填 */,
+          PlanType: 0 /** 计划类型, 取值为#PLAN_TYPE_E */,
+          PlanDesc: '' /** 计划描述, 可不填 */,
+          Reserve: '' /** 保留字段 */
+        };
+
+        /** 看守计划时间信息 */
+        //周时间计划
+        var timeInfo = [];
+        for (var index = 0; index < selPresetList.length; index++) {
+          var element = selPresetList[index];
+          var resName = element.ResName;
+          var timeInfoTemp = {
+            ResCode: element.ResCode + '',
+            ResName: element.GuardTime + '',
+            TimeSlice: {
+              BeginTime: element.BeginTime,
+              EndTime: element.EndTime
+            }
+          };
+          timeInfo.push(timeInfoTemp);
+        }
+        var planTime = [];
+        for (var _index = 0; _index < 7; _index++) {
+          var planTimeTemp = {
+            WeekDay: _index,
+            TimeSliceNum: timeInfo.length,
+            TimeInfo: timeInfo
+          };
+          planTime.push(planTimeTemp);
+        }
+        var timeInfoEx = [];
+        var timeExInfoTemp = {
+          ResCode: '',
+          ResName: '',
+          TimeSlice: {
+            BeginTime: '',
+            EndTime: ''
+          }
+        };
+        timeInfoEx.push(timeExInfoTemp);
+        var planExtTime = [];
+        var planExTimeTemp = {
+          ExtDate: '',
+          TimeSliceNum: 0,
+          TimeInfo: timeInfoEx
+        };
+        planExtTime.push(planExTimeTemp);
+        var guardPositionTimeInfo = {
+          PlanTime: planTime,
+          //时间计划数组
+          PlanExtTimeNum: 0,
+          PlanExtTime: planExtTime //例外时间计划数组
+        };
+        var guardPositionPlanInfo = {
+          /** 看守计划基本信息 */
+          GuardPositionBaseInfo: guardPositionBaseInfo,
+          /** 看守计划时间信息 */
+          GuardPositionTimeInfo: guardPositionTimeInfo
+        };
+        var condition = {
+          GuardPositionPlanCode: guardPositionPlanList[0].GuardPositionPlanCode,
+          GuardPositionPlanInfo: guardPositionPlanInfo
+        };
+        if (isCreat) {
+          Restful.AddGuardPositionPlan(JSON.stringify(guardPositionPlanInfo), function (ret) {
+            if (ret.data.ErrCode === 0) {
+              console.log('添加看守位成功');
+              Restful.ProcessGuardPositionPlan(1, ret.data.GuardPositionPlanCode, function (ret) {
+                console.log(JSON.stringify(ret));
+              });
+              _this._queryGuardPositionPlanList(function (ret) {
+                _this.setState({
+                  guardPlanStatus: ret && ret.length > 0 ? ret[0].PlanStatus === 1 ? 1 : 0 : 0
+                });
+              });
+              //添加成功，关闭添加界面
+              _this.setState({
+                isShowSetGuardForm: false
+              });
+            } else {
+              message.error('添加看守位失败:' + ret.data.ErrMsg, 1);
+            }
+          });
+        } else {
+          Restful.ModifyGuardPositionPlan(JSON.stringify(condition), function (ret) {
+            if (ret.data.ErrCode === 0) {
+              console.log('修改看守位成功');
+              //添加成功，关闭添加界面
+              Restful.ProcessGuardPositionPlan(1, guardPositionPlanList[0].GuardPositionPlanCode, function (ret) {
+                console.log('看守位启动：' + JSON.stringify(ret.data));
+              });
+              _this._queryGuardPositionPlanList(function (ret) {
+                _this.setState({
+                  guardPlanStatus: ret && ret.length > 0 ? ret[0].PlanStatus === 1 ? 1 : 0 : 0
+                });
+              });
+              _this.setState({
+                isShowSetGuardForm: false
+              });
+            } else {
+              message.error('修改看守位失败:' + ret.data.ErrMsg, 1);
+            }
+          });
+        }
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    /**
+     * 看守位添加参数校验
+     */
+    _this._chenckPositionPlanData = function (selPresetList) {
+      message.destroy();
+      var isOK = true;
+      if (selPresetList !== null && selPresetList.length !== 0) {
+        for (var index = 0; index < selPresetList.length; index++) {
+          var timeInfo = selPresetList[index];
+          var bTime = timeInfo.BeginTime;
+          var eTime = timeInfo.EndTime;
+          if (timeInfo.ResCode === '') {
+            message.warn(timeInfo.ResName + '预置位不能为空', 1);
+            isOK = false;
+            break;
+          }
+          if (bTime > eTime) {
+            message.warn(timeInfo.ResName + '开始时间不能大于结束时间', 1);
+            isOK = false;
+            break;
+          }
+          if (bTime === eTime) {
+            message.warn(timeInfo.ResName + '开始时间不能等于结束时间', 1);
+            isOK = false;
+            break;
+          }
+
+          //对剩余的每个时间段进行判断
+          var timeInfo2 = selPresetList;
+          for (var index2 = 0; index2 < timeInfo2.length; index2++) {
+            if (index !== index2) {
+              var item = timeInfo2[index2];
+              var b2Time = item.BeginTime;
+              var e2Time = item.EndTime;
+              //开始时间
+              if (bTime > b2Time && bTime < e2Time) {
+                message.warn('每个时间段的时间不能存在交叉', 1);
+                isOK = false;
+                return isOK;
+              }
+              //结束时间
+              if (eTime > b2Time && eTime < e2Time) {
+                message.warn('每个时间段的时间不能不能存在交叉', 1);
+                isOK = false;
+                return isOK;
+              }
+            }
+          }
+        }
+      } else {
+        message.warn('预置位选择不能为空', 1);
+      }
+      return isOK;
+    };
+    /**
+     * 查询看守位计划列表
+     */
+    _this._queryGuardPositionPlanList = function (callback) {
+      message.destroy();
+      var textLocale = _this.props.textLocale;
+      //查询看守位计划列表
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode != null) {
+        Restful.QueryGuardPositionPlanList(_this.curVideoCam.CameraCode, function (queryRet) {
+          if (queryRet != null && queryRet.data != null) {
+            if (queryRet.data.ErrCode === 0) {
+              console.log('查询看守位计划列表成功');
+              _this.setState({
+                guardPositionPlanList: queryRet.data.GuardPositionPlanInfo
+              });
+              if (callback && typeof callback === 'function') {
+                callback(queryRet.data.GuardPositionPlanInfo);
+              }
+            } else {
+              message.error('查询看守位计划列表失败:' + queryRet.data.ErrMsg, 1);
+            }
+          } else {
+            message.error('查询看守位计划列表失败，返回结果为空', 1);
+          }
+        });
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    //#endregion 看守位操作
+    //#region 巡航线操作
+    /**
+     * 巡航线选择变更
+     */
+    _this._onCruisePathSelectedChange = function (value, option) {
+      _this.setState({
+        curCruisePathInfo: {
+          cruisePathCode: option.key,
+          cruisePathName: value
+        }
+      });
+    };
+    /**
+     * 查询巡航线列表
+     */
+    _this._queryCruisePathList = function (callback) {
+      message.destroy();
+      var textLocale = _this.props.textLocale;
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode != null) {
+        Restful.QueryCruisePathList(_this.curVideoCam.CameraCode, function (queryRet) {
+          if (queryRet != null && queryRet.data != null) {
+            if (queryRet.data.ErrCode === 0) {
+              console.log('查询巡航线成功');
+              //查询成功，赋值查询结果，默认显示第一条巡航线信息
+              var queryCruisePath = [];
+              if (queryRet.data.ResCruisePathQueryItem.length > 0) {
+                queryRet.data.ResCruisePathQueryItem.map(function (item) {
+                  queryCruisePath.push({
+                    cruisePathCode: item.CruisePathCode,
+                    cruisePathName: item.CruisePathName
+                  });
+                });
+              } else {
+                console.log('查询巡航线成功,数量为0');
+              }
+              _this.setState({
+                cruisePathList: queryCruisePath,
+                curCruisePathInfo: queryCruisePath.length > 0 ? queryCruisePath[0] : null
+              });
+              if (callback && typeof callback === 'function') {
+                callback(true);
+              }
+            } else {
+              message.error('查询巡航线失败:' + queryRet.data.ErrMsg, 1);
+            }
+          } else {
+            message.error('查询巡航线失败，返回结果为空', 1);
+          }
+        });
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    /**
+     * 添加巡航线点击
+     */
+    _this._onAddCruisrHandleClick = function () {
+      _this.setState({
+        isShosAddCruisrForm: true
+      });
+    };
+    /**
+     * 添加巡航线取消
+     */
+    _this._onAddCruisrHandleCancle = function () {
+      _this.setState({
+        isShosAddCruisrForm: false
+      });
+    };
+    /**
+     * 添加巡航线
+     */
+    _this._createCruisePath = function () {
+      message.destroy();
+      var textLocale = _this.props.textLocale;
+      var preserList = _this.CruisePathAddCtrDom.state.curSelectedPresetList;
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode != null) {
+        if (!_this.CruisePathAddCtrDom.textRef.checkTextLegal()) {
+          _this.CruisePathAddCtrDom.textRef.setErrorNotice();
+          return;
+        }
+        if (preserList !== null && preserList.length !== 0) {
+          var cruisePathItemList = [];
+          for (var index = 0; index < preserList.length; index++) {
+            var element = preserList[index];
+            var presetValue = element.PresetValue;
+            var presetDesc = element.PresetDesc;
+            var preSetStopTime = element.PreSetStopTime;
+            if (element.Operate === 'presetLocation') {
+              //预置位巡航
+              presetValue = element.PresetValue;
+              presetDesc = element.PresetDesc;
+              preSetStopTime = element.PreSetStopTime;
+            } else {
+              //轨迹巡航
+              if (element.Operate === 'top') {
+                presetValue = 900 + element.Speed;
+              } else if (element.Operate === 'bottom') {
+                presetValue = 910 + element.Speed;
+              } else if (element.Operate === 'left') {
+                presetValue = 920 + element.Speed;
+              } else if (element.Operate === 'right') {
+                presetValue = 930 + element.Speed;
+              }
+              presetDesc = '';
+              preSetStopTime = element.Rotation === 'true' ? 0 : element.Duration; //轨迹巡航显示的是：持续时间，一直转动则为0
+            }
+            var cruisePathItem = {
+              SeqID: element.SeqID,
+              PresetValue: presetValue,
+              PresetDesc: presetDesc,
+              PreSetStopTime: preSetStopTime
+            };
+            cruisePathItemList.push(cruisePathItem);
+          }
+          var condition = {
+            CamName: _this.curVideoCam.CameraName,
+            CamCode: _this.curVideoCam.CameraCode,
+            CruisePathName: _this.CruisePathAddCtrDom.state.cruisePathName,
+            CruisePathItemNum: cruisePathItemList.length,
+            CruisePathItemList: cruisePathItemList,
+            Reserve: ''
+          };
+          Restful.CreateCruisePath(JSON.stringify(condition), function (ret) {
+            if (ret.data.ErrCode === 0) {
+              console.log('添加巡航线成功');
+              //添加成功，关闭添加界面
+              _this.setState({
+                isShosAddCruisrForm: false
+              });
+              _this._queryCruisePathList(function (queryret) {
+                _this.setState({
+                  curCruisePathInfo: {
+                    cruisePathCode: ret.data.CruisePathCode,
+                    cruisePathName: _this.CruisePathAddCtrDom.state.cruisePathName
+                  }
+                });
+              });
+            } else {
+              message.error('添加巡航线失败:' + ret.data.ErrMsg, 1);
+            }
+          });
+        } else {
+          message.error('预置位信息不能为空', 1);
+        }
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    /**
+     * 编辑巡航线点击
+     */
+    _this._onModCruisrHandleClick = function () {
+      message.destroy();
+      if (_this.state.curCruisePathInfo === null) {
+        message.warn('请先选择巡航线', 1);
+        return;
+      }
+      _this.setState({
+        isShowModifyCruisrForm: true
+      });
+    };
+    /**
+     * 编辑巡航线取消
+     */
+    _this._onModCruisrHandleCancle = function () {
+      _this.setState({
+        isShowModifyCruisrForm: false
+      });
+    };
+    /**
+     * 编辑巡航线
+     */
+    _this._modifyCruisePath = function () {
+      message.destroy();
+      var textLocale = _this.props.textLocale;
+      // Restful.ModifyCruisePath();
+      if (_this.state.curCruisePathInfo === null) {
+        message.warn('请先选择巡航线', 1);
+        return;
+      }
+      var preserList = _this.CruisePathAddCtrDom.state.curSelectedPresetList;
+      var cruisePathCode = _this.CruisePathAddCtrDom.state.curCruisePathInfo.cruisePathCode;
+      var cruisePathName = _this.CruisePathAddCtrDom.state.cruisePathName;
+      if (_this.curVideoCam !== null && _this.curVideoCam.CameraCode != null) {
+        if (!_this.CruisePathAddCtrDom.textRef.checkTextLegal()) {
+          _this.CruisePathAddCtrDom.textRef.setErrorNotice();
+          return;
+        }
+        if (preserList !== null && preserList.length !== 0) {
+          var cruisePathItemList = [];
+          for (var index = 0; index < preserList.length; index++) {
+            var element = preserList[index];
+            var presetValue = element.PresetValue;
+            var presetDesc = element.PresetDesc;
+            var preSetStopTime = element.PreSetStopTime;
+            if (element.Operate === 'presetLocation') {
+              //预置位巡航
+              presetValue = element.PresetValue;
+              presetDesc = element.PresetDesc;
+              preSetStopTime = element.PreSetStopTime;
+            } else {
+              //轨迹巡航
+              if (element.Operate === 'top') {
+                presetValue = 900 + element.Speed;
+              } else if (element.Operate === 'bottom') {
+                presetValue = 910 + element.Speed;
+              } else if (element.Operate === 'left') {
+                presetValue = 920 + element.Speed;
+              } else if (element.Operate === 'right') {
+                presetValue = 930 + element.Speed;
+              }
+              presetDesc = '';
+              preSetStopTime = element.Rotation === 'true' ? 0 : element.Duration; //轨迹巡航显示的是：持续时间，一直转动则为0
+            }
+            var cruisePathItem = {
+              SeqID: element.SeqID,
+              PresetValue: presetValue,
+              PresetDesc: presetDesc,
+              PreSetStopTime: preSetStopTime
+            };
+            cruisePathItemList.push(cruisePathItem);
+          }
+          var CruisePathInfo = {
+            CamName: _this.curVideoCam.CameraName,
+            CamCode: _this.curVideoCam.CameraCode,
+            CruisePathName: _this.CruisePathAddCtrDom.state.cruisePathName,
+            CruisePathItemNum: cruisePathItemList.length,
+            CruisePathItemList: cruisePathItemList,
+            Reserve: ''
+          };
+          var condition = {
+            CruisePathCode: cruisePathCode,
+            CruisePathInfo: CruisePathInfo
+          };
+          Restful.ModifyCruisePath(JSON.stringify(condition), function (ret) {
+            if (ret.data.ErrCode === 0) {
+              console.log('修改巡航线成功');
+              //添加成功，关闭添加界面
+              _this.setState({
+                isShosAddCruisrForm: false
+              });
+              _this._queryCruisePathList(function (queryret) {
+                _this.setState({
+                  isShowModifyCruisrForm: false,
+                  curCruisePathInfo: {
+                    cruisePathCode: cruisePathCode,
+                    cruisePathName: cruisePathName
+                  }
+                });
+              });
+            } else {
+              message.error('修改巡航线失败:' + ret.data.ErrMsg, 1);
+            }
+          });
+        } else {
+          message.error('预置位信息不能为空', 1);
+        }
+      } else {
+        message.error(textLocale.cameraInfoEmpty, 1);
+      }
+    };
+    /**
+     * 删除巡航线点击
+     */
+    _this._onDelCruisrHandleClick = function () {
+      message.destroy();
+      if (_this.state.curCruisePathInfo === null) {
+        message.warn('巡航线信息为空');
+        return;
+      }
+      _this.setState({
+        isShowDelCruisrForm: true
+      });
+    };
+    /**
+     * 删除巡航线取消
+     */
+    _this._onDelCruisrHandleCancle = function () {
+      _this.setState({
+        isShowDelCruisrForm: false
+      });
+    };
+    /**
+     * 删除巡航线
+     */
+    _this._delCruisePath = function () {
+      message.destroy();
+      if (_this.state.curCruisePathInfo !== null) {
+        Restful.DelCruisePath(_this.state.curCruisePathInfo.cruisePathCode, function (ret) {
+          if (ret != null && ret.data != null) {
+            if (ret.data.ErrCode === 0) {
+              message.info('删除巡航线成功', 1);
+              _this.setState({
+                isShowDelCruisrForm: false
+              });
+              _this._queryCruisePathList();
+            } else {
+              message.error('删除巡航线失败:' + ret.data.ErrMsg, 1);
+            }
+          } else {
+            message.error('删除巡航线失败，返回结果为空', 1);
+          }
+        });
+      } else {
+        message.error('巡航线信息为空', 1);
+      }
+    };
+    /**
+     * 手动启动巡航线
+     */
+    _this._startCruisePath = function () {
+      message.destroy();
+      if (_this.state.curCruisePathInfo !== null) {
+        Restful.StartCruisePath(_this.state.curCruisePathInfo.cruisePathCode, function (queryRet) {
+          if (queryRet != null && queryRet.data != null) {
+            if (queryRet.data.ErrCode === 0) {
+              console.log('启动巡航线成功');
+            } else {
+              message.error('启动巡航线失败:' + queryRet.data.ErrMsg, 1);
+            }
+          } else {
+            message.error('启动巡航线失败，返回结果为空', 1);
+          }
+        });
+      } else {
+        message.error('巡航线信息为空', 1);
+      }
+    };
+    /**
+     * 手动停止巡航线
+     */
+    _this._stopCruisePath = function () {
+      message.destroy();
+      //Restful.StopCruisePath();
+      if (_this.state.curCruisePathInfo !== null) {
+        Restful.StopCruisePath(_this.state.curCruisePathInfo.cruisePathCode, function (queryRet) {
+          if (queryRet != null && queryRet.data != null) {
+            if (queryRet.data.ErrCode === 0) {
+              console.log('停止巡航线成功');
+            } else {
+              message.error('停止巡航线失败:' + queryRet.data.ErrMsg, 1);
+            }
+          } else {
+            message.error('停止巡航线失败，返回结果为空', 1);
+          }
+        });
+      } else {
+        message.error('巡航线信息为空', 1);
+      }
+    };
+    /**
+     * 打开巡航计划配置
+     */
+    _this._onConfigCruisrHandleClick = function () {
+      _this.setState({
+        isShowConfigCruisrForm: true
+      });
+    };
+    /**
+     *关闭巡航计划配置
+     */
+    _this._onCancelCruisrHandleClick = function () {
+      _this.setState({
+        isShowConfigCruisrForm: false
+      }, function () {
+        _this._queryCruisePlanCode(_this.curVideoCam.CameraCode);
+      });
+    };
+    //查询摄像机的巡航计划
+    _this._queryCruisePlanCode = function () {
+      _this.QueryCruisePlanList({
+        code: _this.curVideoCam.CameraCode
+      }).then(function (_ref) {
+        var data = _ref.data;
+        if (data.ErrCode === 0) {
+          if (data.Result.InfoList && Array.isArray(data.Result.InfoList) && data.Result.InfoList.length > 0) {
+            _this.setState({
+              modifyPlanInfo: data.Result.InfoList[0]
+            });
+          }
+        }
+      }).catch(function (err) {});
+    };
+    //查询相机的巡航计划列表
+    _this.QueryCruisePlanList = /*#__PURE__*/function () {
+      var _ref2 = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee(code) {
+        var userInfo, params;
+        return _regenerator().w(function (_context) {
+          while (1) switch (_context.n) {
+            case 0:
+              _context.n = 1;
+              return Restful.queryUserAndOrg('isUserOrg');
+            case 1:
+              userInfo = _context.v;
+              params = {};
+              params.condition = {
+                ItemNum: 1,
+                Condition: [{
+                  QueryType: 0,
+                  LogicFlag: 0,
+                  QueryData: code.code
+                }],
+                QueryCount: 0,
+                PageFirstRowNumber: 0,
+                PageRowNum: 20
+              };
+              return _context.a(2, VIIDRestful.fetch({
+                url: "/VIID/hadesadapter/cruise/plan/list?code=".concat(userInfo.Code),
+                method: 'GET',
+                params: params
+              }));
+          }
+        }, _callee);
+      }));
+      return function (_x) {
+        return _ref2.apply(this, arguments);
+      };
+    }();
+    //#endregion 巡航线操作
+    //#region 云台面板扩展界面
+    /**
+     * 显示云台扩展面板
+     */
+    _this._onShowMorePnl = function () {
+      _this.setState({
+        isShowPtzMore: !_this.state.isShowPtzMore
+      });
+    };
+    /**
+     * 调整转速
+     */
+    _this._onPtzSpeedChange = function (value) {
+      _this.props.onPtzSpeedChange(value);
+      _this.ptzSpeed = value;
+    };
+    _this.state = {
+      pnlPosX: 0,
+      pnlPosY: 0,
+      ptzUserCtr: 0,
+      //当前用户是不是控制云台，1-控制，0-不在控制
+      isLock: false,
+      //当前云台是否已锁定,0-空闲状态，1-连接状态，2-链接锁定，3-状态最大值，0xFFFFFFFF-无效值
+      dirIndex: 10,
+      //方向盘9个方位下标1-9，默认为10
+
+      //控制面板---扩展面板功能信息
+      isShowPtzMore: false,
+      //ptzPnl中扩展面板是否显示
+      isLightOn: false,
+      //是否开启光照
+      isWipertOn: false,
+      //是否开启雨刷
+      isInfrareOn: false,
+      //是否开启红外
+      isHeatOn: false,
+      //是否开启加热
+      isSnowOn: false,
+      //是否开启除雪---暂时未使用
+
+      //控制面板---预置位信息
+      presetListOptions: [],
+      //预置位信息集合
+      curSelectedPreset: null,
+      //当前选择的预置位
+      deletingPreset: [],
+      //待删除的预置位
+
+      isShowPresetAddForm: false,
+      //是否显示预置位添加窗体
+      isShowModifyPromptForm: false,
+      //是否显示预置位修改提示窗体
+      isShowDelPromptForm: false,
+      //是否显示预置位删除提示窗体
+
+      isShowAutoGuardTimeForm: false,
+      //是否显示设置自动看守时间窗体
+      autoGuardTime: 300,
+      //自动看守时间,单位为秒，最大不超过3600秒，0表示不看守
+
+      //控制面板---看守位信息
+      guardEnable: false,
+      //是否启用看守位,默认???
+      guardPositionPlanList: null,
+      //看守位计划信息集合
+      isShowSetGuardForm: false,
+      //是否显示看守位设置界面
+
+      //控制面板---巡航线信息
+      cruisePathList: [],
+      //巡航线信息集合
+      curCruisePathInfo: null,
+      //当前选择的巡航线信息
+      isShowDelCruisrForm: false,
+      //是否显示删除巡航线窗体
+      isShowModifyCruisrForm: false,
+      //是否显示修改巡航线窗体
+      isShosAddCruisrForm: false,
+      //是佛显示添加巡航线窗体
+      guardPlanStatus: 0,
+      //看守位状态
+
+      isShowConfigCruisrForm: false,
+      //是否显示配置巡航计划
+      modifyPlanInfo: {},
+      //巡航计划信息
+      CameraOrgCode: '' //摄像机组织编码
+    };
+    _this.isMoveWithForm = false; //窗体是否进行固定
+    _this.isMoving = false; //窗体是否正在移动，MouseMove时判断。
+
+    _this.lastX = null; //窗体移动位置，计算窗体移动时的偏移
+    _this.lastY = null; //窗体移动位置，计算窗体移动时的偏移
+
+    //this.curVideoDom = this.props.curVideoDom;  //整个DOM节点，*****当前调试使用，记得删除
+    _this.curVideoCam = _this.props.videoCamInfo(); //当前video的相机信息-CameraCode CameraName ECIPAddr
+    _this.ptzPnlPosi = {}; //ptzPnl的坐标位置信息
+
+    //PtzPnl中方向盘相关位置信息
+    _this.ptzDirPnlPosi = {}; //ptzPnl中左侧方向盘位置信息
+    _this.relativeDirPnlPosiX = 0; //ptzPnl中鼠标在方向盘中的相对坐标位置
+    _this.relativeDirPnlPosiY = 0; //ptzPnl中鼠标在方向盘中的相对坐标位置
+
+    // //鼠标在title中进行拖拽移动---鼠标左键
+    // window.onmousemove = (e) => this._onMouseMove(e);
+    // window.onmouseup = (e) => this._onMouseUp(e);
+    //window.addEventListener('resize', this._reCalcPnlPos);
+
+    _this.isStopChangeIcon = false; //预置位同步时图标更新标志位
+    _this.ptzSpeed = _this.props.initialPtzSpeed === undefined ? 5 : _this.props.initialPtzSpeed(); //云台转速---默认为6,范围1-9
+    //转速值
+    _this.speedMarks = {
+      1: '1',
+      2: '2',
+      3: '3',
+      4: '4',
+      5: '5',
+      6: '6',
+      7: '7',
+      8: '8',
+      9: '9'
+    };
+    //预置位删除操作
+    _this.deleteRowSelection = {
+      onChange: function onChange(selectedRowKeys, selectedRows) {
+        _this.setState({
+          deletingPreset: selectedRows
+        });
+      }
+    };
+    //预置位删除表头
+    _this.presetColumns = [{
+      title: _this.props.textLocale.presetID,
+      dataIndex: 'PresetValue',
+      width: '150px',
+      key: 'PresetValue'
+    }, {
+      title: _this.props.textLocale.presetName,
+      dataIndex: 'PresetDes',
+      key: 'PresetDes'
+    }];
+    return _this;
+  }
+
+  //#region 生命周期
+  _inherits(PtzControlPanel, _Component);
+  return _createClass(PtzControlPanel, [{
+    key: "componentDidMount",
+    value: function () {
+      var _componentDidMount = _asyncToGenerator(/*#__PURE__*/_regenerator().m(function _callee2() {
+        var _this2 = this;
+        var _t;
+        return _regenerator().w(function (_context2) {
+          while (1) switch (_context2.n) {
+            case 0:
+              _context2.n = 1;
+              return this.props.videoCamInfo();
+            case 1:
+              this.curVideoCam = _context2.v;
+              if (!(this.props.initialPtzSpeed === undefined)) {
+                _context2.n = 2;
+                break;
+              }
+              _t = 5;
+              _context2.n = 4;
+              break;
+            case 2:
+              _context2.n = 3;
+              return this.props.initialPtzSpeed();
+            case 3:
+              _t = _context2.v;
+            case 4:
+              this.ptzSpeed = _t;
+              console.log('cam:' + this.curVideoCam.CameraName + '云台面板');
+              this.ptzDirPnlPosi = this._getDomPosi(this.ptzDirPnlContainer);
+              this._queryPtzStatus(); //查询云台状态
+              this._queryPresetList(); //查询预置位信息
+              this._queryCruisePathList(); //获取巡航线信息
+              this._queryGuardPositionPlanList(function (ret) {
+                _this2.setState({
+                  guardEnable: ret && ret.length > 0 ? ret[0].PlanStatus === 1 ? true : false : false,
+                  guardPlanStatus: ret && ret.length > 0 ? ret[0].PlanStatus === 1 ? 1 : 0 : 0
+                });
+              }); //查询看守位列信息
+              this._queryCruisePlanCode(this.curVideoCam.CameraCode);
+            case 5:
+              return _context2.a(2);
+          }
+        }, _callee2, this);
+      }));
+      function componentDidMount() {
+        return _componentDidMount.apply(this, arguments);
+      }
+      return componentDidMount;
+    }()
+  }, {
+    key: "render",
+    value:
+    //#endregion 云台面板扩展界面
+
+    function render() {
+      var _this3 = this;
+      var _this$state = this.state,
+        pnlPosX = _this$state.pnlPosX,
+        pnlPosY = _this$state.pnlPosY,
+        isShowPtzMore = _this$state.isShowPtzMore,
+        dirIndex = _this$state.dirIndex,
+        isLightOn = _this$state.isLightOn,
+        isWipertOn = _this$state.isWipertOn,
+        isInfrareOn = _this$state.isInfrareOn,
+        isHeatOn = _this$state.isHeatOn,
+        guardPlanStatus = _this$state.guardPlanStatus,
+        presetListOptions = _this$state.presetListOptions,
+        curSelectedPreset = _this$state.curSelectedPreset,
+        isShowPresetAddForm = _this$state.isShowPresetAddForm,
+        isShowDelPromptForm = _this$state.isShowDelPromptForm,
+        isShowModifyPromptForm = _this$state.isShowModifyPromptForm,
+        isShowAutoGuardTimeForm = _this$state.isShowAutoGuardTimeForm,
+        autoGuardTime = _this$state.autoGuardTime,
+        guardEnable = _this$state.guardEnable,
+        isShowSetGuardForm = _this$state.isShowSetGuardForm,
+        guardPositionPlanList = _this$state.guardPositionPlanList,
+        cruisePathList = _this$state.cruisePathList,
+        curCruisePathInfo = _this$state.curCruisePathInfo,
+        isShowDelCruisrForm = _this$state.isShowDelCruisrForm,
+        isShowModifyCruisrForm = _this$state.isShowModifyCruisrForm,
+        isShosAddCruisrForm = _this$state.isShosAddCruisrForm,
+        isShowConfigCruisrForm = _this$state.isShowConfigCruisrForm,
+        modifyPlanInfo = _this$state.modifyPlanInfo,
+        CameraOrgCode = _this$state.CameraOrgCode;
+      // let guardPlanStatus = guardPositionPlanList && guardPositionPlanList.length > 0 ? guardPositionPlanList[0].PlanStatus : 0;
+      var _this$props = this.props,
+        textLocale = _this$props.textLocale,
+        theme = _this$props.theme,
+        VMSdkType = _this$props.VMSdkType;
+      return /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-panel ".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME),
+        ref: function ref(el) {
+          return _this3.ptzPnlContainer = el;
+        },
+        style: {
+          position: 'absolute',
+          left: pnlPosX,
+          top: pnlPosY
+        }
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-panel-title",
+        ref: function ref(el) {
+          return _this3.ptzPnlTitleContainer = el;
+        }
+        // onMouseDown={(e) => this._onMouseDown(e)}
+      }, /*#__PURE__*/React.createElement("span", {
+        className: "ptzctr-panel-title-span1"
+      }, textLocale.holder), /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-panel-title-camname"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-panel-title-span2"
+      }, "\uFF08"), /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-panel-title-span3"
+      }, this.curVideoCam.CameraName), /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-panel-title-span4"
+      }, "\uFF09")), /*#__PURE__*/React.createElement("span", {
+        className: "ptzctr-panel-title-lockdesc"
+      }, this.state.isLock ? textLocale.locked : textLocale.unlocked), /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-title-ptzicon"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: this.state.isLock ? 'icon-lock' : 'icon-unlock',
+        onClick: this.state.isLock ? this._onUnLockPtz : this._onLockPtz,
+        title: this.state.isLock ? textLocale.unlockHead : textLocale.lockingHead
+      }), /*#__PURE__*/React.createElement("div", {
+        className: "icon-release",
+        onClick: this._onReleasePtz,
+        title: textLocale.releaseHead
+      })), /*#__PURE__*/React.createElement("span", {
+        className: "ptzctr-panel-title-split"
+      }), /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-title-formicon"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "icon-close",
+        onClick: this.onCloseClick,
+        title: textLocale.close
+      }))), /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-panel-body"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-body-left",
+        onClick: this.OnPtzDirPnlClick,
+        onMouseMove: this._onptzDirPnlMove
+      }, /*#__PURE__*/React.createElement("div", {
+        ref: function ref(el) {
+          return _this3.ptzDirPnlContainer = el;
+        },
+        className: "ptz-operateIcon-ptzpnlcon",
+        onClick: this.OnPtzDirPnlClick
+      }), dirIndex === 9 && /*#__PURE__*/React.createElement("div", {
+        className: "ptz-operateIcon-MiddleOnIcon",
+        onClick: this._onPtzDirMidPnlClick
+      }), dirIndex === 1 && /*#__PURE__*/React.createElement("div", {
+        className: "ptz-operateIcon-TopOnIcon",
+        onMouseDown: function onMouseDown() {
+          return _this3._onPtzDirPnlDown(PtzCmd.MW_PTZ_TILTUP, textLocale.upward);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onPtzDirPnlUp(PtzCmd.MW_PTZ_TILTUPSTOP, textLocale.upwardStop);
+        }
+      }), dirIndex === 2 && /*#__PURE__*/React.createElement("div", {
+        className: "ptz-operateIcon-TopRightOnIcon",
+        onMouseDown: function onMouseDown() {
+          return _this3._onPtzDirPnlDown(PtzCmd.MW_PTZ_RIGHTUP, textLocale.upperRight);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onPtzDirPnlUp(PtzCmd.MW_PTZ_RIGHTUPSTOP, textLocale.upperRightStop);
+        }
+      }), dirIndex === 3 && /*#__PURE__*/React.createElement("div", {
+        className: "ptz-operateIcon-RightOnIcon",
+        onMouseDown: function onMouseDown() {
+          return _this3._onPtzDirPnlDown(PtzCmd.MW_PTZ_PANRIGHT, textLocale.toRight);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onPtzDirPnlUp(PtzCmd.MW_PTZ_PANRIGHTSTOP, textLocale.toRightStop);
+        }
+      }), dirIndex === 4 && /*#__PURE__*/React.createElement("div", {
+        className: "ptz-operateIcon-BottomRightOnIcon",
+        onMouseDown: function onMouseDown() {
+          return _this3._onPtzDirPnlDown(PtzCmd.MW_PTZ_RIGHTDOWN, textLocale.lowerRight);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onPtzDirPnlUp(PtzCmd.MW_PTZ_RIGHTDOWNSTOP, textLocale.lowerRightStop);
+        }
+      }), dirIndex === 5 && /*#__PURE__*/React.createElement("div", {
+        className: "ptz-operateIcon-BottomOnIcon",
+        onMouseDown: function onMouseDown() {
+          return _this3._onPtzDirPnlDown(PtzCmd.MW_PTZ_TILTDOWN, textLocale.down);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onPtzDirPnlUp(PtzCmd.MW_PTZ_TILTDOWNSTOP, textLocale.downStop);
+        }
+      }), dirIndex === 6 && /*#__PURE__*/React.createElement("div", {
+        className: "ptz-operateIcon-LeftBottomOnIcon",
+        onMouseDown: function onMouseDown() {
+          return _this3._onPtzDirPnlDown(PtzCmd.MW_PTZ_LEFTDOWN, textLocale.lowerLeft);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onPtzDirPnlUp(PtzCmd.MW_PTZ_LEFTDOWNSTOP, textLocale.lowerLeftStop);
+        }
+      }), dirIndex === 7 && /*#__PURE__*/React.createElement("div", {
+        className: "ptz-operateIcon-LeftOnIcon",
+        onMouseDown: function onMouseDown() {
+          return _this3._onPtzDirPnlDown(PtzCmd.MW_PTZ_PANLEFT, textLocale.toLeft);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onPtzDirPnlUp(PtzCmd.MW_PTZ_PANLEFTSTOP, textLocale.toLeftStop);
+        }
+      }), dirIndex === 8 && /*#__PURE__*/React.createElement("div", {
+        className: "ptz-operateIcon-TopLeftOnIcon",
+        onMouseDown: function onMouseDown() {
+          return _this3._onPtzDirPnlDown(PtzCmd.MW_PTZ_LEFTUP, textLocale.upwardLeft);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onPtzDirPnlUp(PtzCmd.MW_PTZ_LEFTUPSTOP, textLocale.upwardLeftStop);
+        }
+      })), /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-body-middle"
+      }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+        className: "pzt-operateIcon-ptzZoomSubtractIcon",
+        title: textLocale.shrink,
+        onMouseDown: function onMouseDown() {
+          return _this3.OnOperationPtzDown('zoom', PtzCmd.MW_PTZ_ZOOMWIDE, textLocale.shrink);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onOperationPtzUp('zoom', PtzCmd.MW_PTZ_ZOOMWIDESTOP, textLocale.narrowingStop);
+        }
+      }), /*#__PURE__*/React.createElement("div", {
+        className: "pzt-operateIcon-ptzZoom"
+      }, /*#__PURE__*/React.createElement("span", {
+        className: "pzt-operateIcon-ptzZoom-span1"
+      }), /*#__PURE__*/React.createElement("span", {
+        className: "pzt-operateIcon-ptzZoom-span2"
+      }, textLocale.multiplicity), /*#__PURE__*/React.createElement("span", {
+        className: "pzt-operateIcon-ptzZoom-span3"
+      })), /*#__PURE__*/React.createElement("div", {
+        className: "pzt-operateIcon-ptzZoomAddIcon",
+        title: textLocale.enlarge,
+        onMouseDown: function onMouseDown() {
+          return _this3.OnOperationPtzDown('zoom', PtzCmd.MW_PTZ_ZOOMTELE, textLocale.enlarge);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onOperationPtzUp('zoom', PtzCmd.MW_PTZ_ZOOMTELESTOP, textLocale.amplificationStop);
+        }
+      })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+        className: "pzt-operateIcon-ptzForcusSubtractIcon",
+        title: textLocale.reducedFocus,
+        onMouseDown: function onMouseDown() {
+          return _this3.OnOperationPtzDown('forcus', PtzCmd.MW_PTZ_FOCUSNEAR, textLocale.reducedFocus);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onOperationPtzUp('forcus', PtzCmd.MW_PTZ_FOCUSNEARSTOP, textLocale.reducedFocusStop);
+        }
+      }), /*#__PURE__*/React.createElement("div", {
+        className: "pzt-operateIcon-ptzForcus"
+      }, /*#__PURE__*/React.createElement("span", {
+        className: "pzt-operateIcon-ptzForcus-span1"
+      }), /*#__PURE__*/React.createElement("span", {
+        className: "pzt-operateIcon-ptzForcus-span2"
+      }, textLocale.focus), /*#__PURE__*/React.createElement("span", {
+        className: "pzt-operateIcon-ptzForcus-span3"
+      })), /*#__PURE__*/React.createElement("div", {
+        className: "pzt-operateIcon-ptzForcusAddIcon",
+        title: textLocale.increaseFocus,
+        onMouseDown: function onMouseDown() {
+          return _this3.OnOperationPtzDown('forcus', PtzCmd.MW_PTZ_FOCUSFAR, textLocale.increaseFocus);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onOperationPtzUp('forcus', PtzCmd.MW_PTZ_FOCUSFARSTOP, textLocale.increasedFocusStop);
+        }
+      })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+        className: "pzt-operateIcon-ptzIrisSubtractIcon",
+        title: textLocale.reduceAperture,
+        onMouseDown: function onMouseDown() {
+          return _this3.OnOperationPtzDown('iris', PtzCmd.MW_PTZ_IRISCLOSE, textLocale.reduceAperture);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onOperationPtzUp('iris', PtzCmd.MW_PTZ_IRISCLOSESTOP, textLocale.reduceAertureStop);
+        }
+      }), /*#__PURE__*/React.createElement("div", {
+        className: "pzt-operateIcon-ptzIris"
+      }, /*#__PURE__*/React.createElement("span", {
+        className: "pzt-operateIcon-ptzIris-span1"
+      }), /*#__PURE__*/React.createElement("span", {
+        className: "pzt-operateIcon-ptzIris-span2"
+      }, textLocale.aperture), /*#__PURE__*/React.createElement("span", {
+        className: "pzt-operateIcon-ptzIris-span3"
+      })), /*#__PURE__*/React.createElement("div", {
+        className: "pzt-operateIcon-ptzIrisAddIcon",
+        title: textLocale.increaseAperture,
+        onMouseDown: function onMouseDown() {
+          return _this3.OnOperationPtzDown('iris', PtzCmd.MW_PTZ_IRISOPEN, textLocale.increaseAperture);
+        },
+        onMouseUp: function onMouseUp() {
+          return _this3._onOperationPtzUp('iris', PtzCmd.MW_PTZ_IRISOPENSTOP, textLocale.increaseApertureStop);
+        }
+      }))), /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-body-right"
+      }, /*#__PURE__*/React.createElement(Tabs, {
+        className: "ptzctr-body-right-tab",
+        size: "small",
+        onChange: this._onclickChange
+      }, /*#__PURE__*/React.createElement(TabPane, {
+        tab: textLocale.preset,
+        key: "1"
+      }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Select, {
+        className: "ant-select",
+        placeholder: textLocale.pleaseChoosePreset,
+        style: {
+          width: '168px',
+          height: '25px'
+        },
+        dropdownStyle: {
+          backgroundColor: ' #222222',
+          color: 'white',
+          borderRadius: '0px'
+        },
+        dropdownMatchSelectWidth: true,
+        key: curSelectedPreset == null ? '' : curSelectedPreset.PresetValue,
+        value: curSelectedPreset == null ? '' : curSelectedPreset.PresetDes,
+        onChange: this._onPresetSelectedChange,
+        popupClassName: "".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME, " select-popup-class-name")
+      }, presetListOptions.map(function (option) {
+        return /*#__PURE__*/React.createElement(Option, {
+          className: "ant-select-option",
+          style: {
+            fontsize: '12px',
+            color: '#c3c3c3'
+          },
+          key: option.PresetValue,
+          value: option.PresetDes
+        }, option.PresetDes + '[' + option.PresetValue + ']');
+      })), /*#__PURE__*/React.createElement("div", {
+        //title="转到预置位"
+        title: textLocale.transferToPreset,
+        className: "ptzctr-preset-jumptoIcon",
+        onClick: this._usePreset
+      }), /*#__PURE__*/React.createElement("div", {
+        title: textLocale.increasePreset,
+        className: "ptzctr-preset-addIcon",
+        onMouseUp: this._onSetPresetClick
+      }, /*#__PURE__*/React.createElement(UModal //预置位添加窗体
+      , {
+        title: textLocale.addPreset,
+        theme: theme,
+        className: "ptzctr-modal ".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME),
+        visible: isShowPresetAddForm,
+        onCancel: this._onSetPresetCancel,
+        onOk: this._addPresetClick,
+        maskClosable: false,
+        destroyOnClose: true,
+        width: "467px",
+        height: "260px",
+        footer: [/*#__PURE__*/React.createElement(UButton, {
+          key: "confirm",
+          btnType: "primary",
+          theme: theme,
+          onClick: this._addPresetClick
+        }, textLocale.okText), /*#__PURE__*/React.createElement(UButton, {
+          key: "cancel",
+          theme: theme,
+          onClick: this._onSetPresetCancel
+        }, textLocale.cancelText)]
+      }, /*#__PURE__*/React.createElement(PtzPresetAddCtr, {
+        ref: function ref(_ref3) {
+          return _this3.presetAddCtrDom = _ref3;
+        },
+        presetListOptions: presetListOptions,
+        textLocale: textLocale,
+        theme: theme
+      })), /*#__PURE__*/React.createElement(UModal //预置位预置位修改提示窗体：如果在预置位添加窗体中选择是已有的预置位，则会显示是否进行覆盖的提示
+      , {
+        className: "ptzctr-modal-prompt ".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME),
+        theme: theme,
+        title: textLocale.reminder,
+        width: "320px",
+        visible: isShowModifyPromptForm,
+        onCancel: this._presetAddPromptCancel,
+        onOk: this._presetAddPromptOK,
+        maskClosable: false,
+        destroyOnClose: true,
+        footer: [/*#__PURE__*/React.createElement(UButton, {
+          key: "confirm",
+          type: "primary",
+          theme: theme,
+          onClick: this._presetAddPromptOK
+        }, textLocale.okText), /*#__PURE__*/React.createElement(UButton, {
+          key: "cancel",
+          theme: theme,
+          onClick: this._presetAddPromptCancel
+        }, textLocale.cancelText)]
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "ptz-delprompt-main"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "prompt-img"
+      }), /*#__PURE__*/React.createElement("span", {
+        className: "prompt-span"
+      }, textLocale.coverPresetTip)))), /*#__PURE__*/React.createElement("div", {
+        title: textLocale.syncPreset,
+        ref: function ref(el) {
+          return _this3.synchrodataRef = el;
+        },
+        className: "ptzctr-preset-synchrodataIcon",
+        onMouseUp: this._synchrodataPreset
+      }), /*#__PURE__*/React.createElement("div", {
+        title: textLocale.deletePreset,
+        className: "ptzctr-preset-delIcon",
+        onClick: this._onDelPresetHandleClick
+      }), /*#__PURE__*/React.createElement(UModal, {
+        title: textLocale.deletePreset,
+        theme: theme,
+        className: "ptzctr-preset-delete ".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME),
+        visible: isShowDelPromptForm,
+        width: "600px",
+        destroyOnClose: true,
+        maskClosable: false,
+        onCancel: this._onDelPresetHandleCancle,
+        footer: [/*#__PURE__*/React.createElement(UButton, {
+          key: "confirm",
+          btnType: "primary",
+          theme: theme,
+          onClick: this._delPreset
+        }, textLocale.okText), /*#__PURE__*/React.createElement(UButton, {
+          key: "cancel",
+          theme: theme,
+          onClick: this._onDelPresetHandleCancle
+        }, textLocale.cancelText)]
+      }, /*#__PURE__*/React.createElement(UTable, {
+        className: "ptzctr-preset-delete-table ".concat(0 === presetListOptions.length ? 'ptzctr-preset-table-no-source' : ''),
+        columns: this.presetColumns,
+        theme: theme,
+        pagination: false,
+        rowKey: "PresetValue",
+        scroll: {
+          y: true
+        },
+        dataSource: presetListOptions,
+        rowSelection: this.deleteRowSelection
+      })), /*#__PURE__*/React.createElement("div", {
+        title: textLocale.seGuardPosition,
+        className: "ptzctr-preset-setguardIcon",
+        onMouseUp: this._onGuardTimeHandleClick
+      }, /*#__PURE__*/React.createElement(UModal, {
+        title: textLocale.setGuard,
+        theme: theme,
+        className: "ptzctr-modal ".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME),
+        visible: isShowAutoGuardTimeForm,
+        width: "450px",
+        height: "200px",
+        destroyOnClose: true,
+        maskClosable: false,
+        onCancel: this._onGuardTimeHandleCancel,
+        onOk: this._onGuardTimeHandleOK,
+        footer: [/*#__PURE__*/React.createElement(UButton, {
+          key: "confirm",
+          btnType: "primary",
+          theme: theme,
+          onClick: this._onGuardTimeHandleOK
+        }, textLocale.okText), /*#__PURE__*/React.createElement(UButton, {
+          key: "cancel",
+          theme: theme,
+          onClick: this._onGuardTimeHandleCancel
+        }, textLocale.cancelText)]
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-setguardtime-main"
+      }, /*#__PURE__*/React.createElement("span", {
+        className: "setguardtime-span1"
+      }, textLocale.automaticGuardTime), /*#__PURE__*/React.createElement(UInputNumber, {
+        placeholder: textLocale.enterNumberBetween,
+        theme: theme,
+        className: "setguardtime-input",
+        onChange: this._onGuardTimeHandleChange,
+        min: 10,
+        max: 3600,
+        defaultValue: 300,
+        maxLength: 4,
+        value: autoGuardTime
+      }), /*#__PURE__*/React.createElement("p", {
+        className: "setguardtime-span2"
+      }, textLocale.second)))))), /*#__PURE__*/React.createElement(TabPane, {
+        tab: textLocale.cruise,
+        key: "2"
+      }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Select, {
+        placeholder: textLocale.pleaseSelecCruiseLine,
+        style: {
+          width: '168px',
+          height: '25px'
+        },
+        className: "ant-select",
+        dropdownStyle: {
+          backgroundColor: ' #222222',
+          color: 'white',
+          borderRadius: '0px'
+        },
+        dropdownMatchSelectWidth: true,
+        key: curCruisePathInfo === null ? '' : curCruisePathInfo.cruisePathCode,
+        value: curCruisePathInfo === null ? '' : curCruisePathInfo.cruisePathName,
+        onChange: this._onCruisePathSelectedChange,
+        popupClassName: "".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME, " select-popup-class-name")
+      }, cruisePathList.map(function (option) {
+        return /*#__PURE__*/React.createElement(Option, {
+          className: "ant-select-option",
+          style: {
+            fontsize: '12px',
+            color: '#c3c3c3'
+          },
+          key: option.cruisePathCode,
+          value: option.cruisePathName
+        }, option.cruisePathName);
+      })), /*#__PURE__*/React.createElement("div", {
+        title: textLocale.startingCruise,
+        className: "ptzctr-cruisr-startIcon",
+        onClick: this._startCruisePath
+      }), /*#__PURE__*/React.createElement("div", {
+        title: textLocale.stopCruising,
+        className: "ptzctr-cruisr-stopIcon",
+        onClick: this._stopCruisePath
+      }), /*#__PURE__*/React.createElement("div", {
+        title: textLocale.addCruiseLine,
+        className: "ptzctr-cruisr-addIcon",
+        onMouseUp: this._onAddCruisrHandleClick
+      }, /*#__PURE__*/React.createElement(UModal //巡航线添加窗体
+      , {
+        title: textLocale.addCruiseLine,
+        theme: theme,
+        className: "ptzctr-cruisr-modal ".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME),
+        visible: isShosAddCruisrForm,
+        width: "1200px",
+        height: "600px",
+        destroyOnClose: true,
+        maskClosable: false,
+        onCancel: this._onAddCruisrHandleCancle,
+        onOk: this._createCruisePath,
+        style: {
+          top: '8%'
+        },
+        footer: [/*#__PURE__*/React.createElement(UButton, {
+          key: "confirm",
+          btnType: "primary",
+          theme: theme,
+          onClick: this._createCruisePath
+        }, textLocale.okText), /*#__PURE__*/React.createElement(UButton, {
+          key: "cancel",
+          theme: theme,
+          onClick: this._onAddCruisrHandleCancle
+        }, textLocale.cancelText)]
+      }, /*#__PURE__*/React.createElement(PtzAddCruisePathCtr, {
+        ref: function ref(_ref4) {
+          return _this3.CruisePathAddCtrDom = _ref4;
+        },
+        isCreat: true,
+        cameraInfo: this.curVideoCam,
+        presetListOptions: presetListOptions,
+        curCruisePathInfo: curCruisePathInfo,
+        textLocale: textLocale,
+        theme: theme,
+        VMSdkType: VMSdkType
+      }))), /*#__PURE__*/React.createElement("div", {
+        title: textLocale.deletionCruises,
+        className: "ptzctr-cruisr-delIcon",
+        onMouseUp: this._onDelCruisrHandleClick
+      }, /*#__PURE__*/React.createElement(UModal //巡航线删除提示窗体
+      , {
+        title: textLocale.reminder,
+        theme: theme,
+        className: "ptzctr-modal-prompt ".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME),
+        visible: isShowDelCruisrForm,
+        width: "320px",
+        destroyOnClose: true,
+        maskClosable: false,
+        onCancel: this._onDelCruisrHandleCancle,
+        onOk: this._delCruisePath,
+        footer: [/*#__PURE__*/React.createElement(UButton, {
+          key: "confirm",
+          btnType: "primary",
+          theme: theme,
+          onClick: this._delCruisePath
+        }, textLocale.okText), /*#__PURE__*/React.createElement(UButton, {
+          key: "cancel",
+          theme: theme,
+          onClick: this._onDelCruisrHandleCancle
+        }, textLocale.cancelText)]
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "ptz-delprompt-main"
+      }, /*#__PURE__*/React.createElement("div", {
+        className: "prompt-img"
+      }), /*#__PURE__*/React.createElement("p", {
+        className: "prompt-span"
+      }, textLocale.recoverableSurDeleteCruiseLine)))), /*#__PURE__*/React.createElement("div", {
+        title: textLocale.editRoute,
+        className: "ptzctr-cruisr-editIcon",
+        onMouseUp: this._onModCruisrHandleClick
+      }, /*#__PURE__*/React.createElement(UModal //巡航线添加窗体
+      , {
+        title: textLocale.editRoute,
+        theme: theme,
+        className: "ptzctr-cruisr-modal ".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME),
+        visible: isShowModifyCruisrForm,
+        width: "1200px",
+        height: "600px",
+        destroyOnClose: true,
+        maskClosable: false,
+        onCancel: this._onModCruisrHandleCancle,
+        onOk: this._modifyCruisePath,
+        style: {
+          top: '8%'
+        },
+        footer: [/*#__PURE__*/React.createElement(UButton, {
+          key: "confirm",
+          btnType: "primary",
+          theme: theme,
+          onClick: this._modifyCruisePath
+        }, textLocale.okText), /*#__PURE__*/React.createElement(UButton, {
+          key: "cancel",
+          theme: theme,
+          onClick: this._onModCruisrHandleCancle
+        }, textLocale.cancelText)]
+      }, /*#__PURE__*/React.createElement(PtzAddCruisePathCtr, {
+        ref: function ref(_ref5) {
+          return _this3.CruisePathAddCtrDom = _ref5;
+        },
+        isCreat: false,
+        cameraInfo: this.curVideoCam,
+        presetListOptions: presetListOptions,
+        curCruisePathInfo: curCruisePathInfo,
+        textLocale: textLocale,
+        theme: theme,
+        VMSdkType: VMSdkType
+      }))), /*#__PURE__*/React.createElement("div", {
+        title: textLocale.configuredCruisePlan,
+        className: "ptzctr-cruisr-editPlanIcon",
+        onMouseUp: this._onConfigCruisrHandleClick
+      }, isShowConfigCruisrForm && /*#__PURE__*/React.createElement(ConfigCruisePathPlan, {
+        modifyPlanInfo: modifyPlanInfo,
+        CameraOrgCode: CameraOrgCode,
+        isShowConfigCruisrForm: isShowConfigCruisrForm,
+        onCancelCruisrHandleClick: this._onCancelCruisrHandleClick,
+        cameraInfo: this.curVideoCam,
+        textLocale: textLocale,
+        theme: theme
+      })))), /*#__PURE__*/React.createElement(TabPane, {
+        tab: textLocale.guardPosition,
+        key: "3"
+      }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+        className: "ptz-guard"
+      }, /*#__PURE__*/React.createElement("span", {
+        className: "ptz-guard-span1"
+      }, textLocale.enableNot), /*#__PURE__*/React.createElement(Radio.Group, {
+        value: guardPlanStatus,
+        className: "ant-radio",
+        onChange: this._onGuardEnableChange
+      }, /*#__PURE__*/React.createElement(Radio, {
+        value: 0,
+        style: {
+          color: '#bdbdbd'
+        }
+      }, " ", textLocale.no), /*#__PURE__*/React.createElement(Radio, {
+        value: 1,
+        style: {
+          color: '#bdbdbd'
+        }
+      }, " ", textLocale.yes)), /*#__PURE__*/React.createElement("div", {
+        className: "ptz-guard-set"
+      }, /*#__PURE__*/React.createElement("a", {
+        style: guardEnable ? {
+          color: '#3366CC',
+          textDecoration: 'underline'
+        } : {
+          color: '#3F3F3F'
+        },
+        onClick: guardEnable ? this._onSetGuarClick : this.on
+      }, guardPositionPlanList && guardPositionPlanList.length > 0 && Number(guardPositionPlanList[0].GuardPositionPlanCode) !== 0 ? textLocale.view + '>' : textLocale.set + '>'))), /*#__PURE__*/React.createElement(UModal, {
+        title: textLocale.guardPositionSetting,
+        theme: theme,
+        className: "ptzctr-cruisr-modal ".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME),
+        visible: isShowSetGuardForm,
+        width: "640px",
+        height: "550px",
+        destroyOnClose: true,
+        maskClosable: false,
+        onCancel: this._onSetGuardHandleCancel,
+        onOk: this._onSetGuardHandleOK,
+        style: {
+          top: '8%'
+        },
+        footer: [/*#__PURE__*/React.createElement(UButton, {
+          key: "confirm",
+          btnType: "primary",
+          theme: theme,
+          onClick: this._onSetGuardHandleOK
+        }, textLocale.okText), /*#__PURE__*/React.createElement(UButton, {
+          key: "cancel",
+          theme: theme,
+          onClick: this._onSetGuardHandleCancel
+        }, textLocale.cancelText)]
+      }, /*#__PURE__*/React.createElement(PtzSetGuardCtr, {
+        ref: function ref(_ref6) {
+          return _this3.ptzSetGuardCtrDom = _ref6;
+        },
+        cameraInfo: this.curVideoCam,
+        presetListOptions: presetListOptions,
+        guardPositionPlanList: guardPositionPlanList,
+        textLocale: textLocale,
+        theme: theme
+      }))))))), isShowPtzMore && /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-panel-morefunction ".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME)
+      }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+        className: "morefunction-span"
+      }, ' ', textLocale.presetSpeed + '：'), /*#__PURE__*/React.createElement(Slider, {
+        className: "ptzctr-more-speed",
+        marks: this.speedMarks,
+        step: null,
+        defaultValue: this.ptzSpeed,
+        min: 1,
+        max: 9,
+        onChange: this._onPtzSpeedChange
+      })), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", {
+        className: isLightOn ? 'pztctr-more-lightOnIcon' : 'pztctr-more-lightIcon',
+        title: textLocale.illumination,
+        onClick: isLightOn ? function () {
+          return _this3.OnOperationPtzDown('light', PtzCmd.MW_PTZ_LIGHTOFF, textLocale.turnOffLighting);
+        } : function () {
+          return _this3.OnOperationPtzDown('light', PtzCmd.MW_PTZ_LIGHTON, textLocale.turnLight);
+        }
+      }), /*#__PURE__*/React.createElement("div", {
+        className: isWipertOn ? 'pztctr-more-wiperOnIcon' : 'pztctr-more-wiperIcon',
+        title: textLocale.windshieldWiper,
+        onClick: isWipertOn ? function () {
+          return _this3.OnOperationPtzDown('wiper', PtzCmd.MW_PTZ_BRUSHOFF, textLocale.turnOffWindshieldWipers);
+        } : function () {
+          return _this3.OnOperationPtzDown('wiper', PtzCmd.MW_PTZ_BRUSHON, textLocale.turnOnWiper);
+        }
+      }), /*#__PURE__*/React.createElement("div", {
+        className: isInfrareOn ? 'pztctr-more-infraredOnIcon' : 'pztctr-more-infraredIcon',
+        title: textLocale.infrared,
+        onClick: isWipertOn ? function () {
+          return _this3.OnOperationPtzDown('infrare', PtzCmd.MW_PTZ_INFRAREDOFF, textLocale.turnOffInfrared);
+        } : function () {
+          return _this3.OnOperationPtzDown('infrare', PtzCmd.MW_PTZ_INFRAREDON, textLocale.turnOnInfrared);
+        }
+      }), /*#__PURE__*/React.createElement("div", {
+        className: isHeatOn ? 'pztctr-more-heatOnIcon' : 'pztctr-more-heatIcon',
+        title: textLocale.heating,
+        onClick: isWipertOn ? function () {
+          return _this3.OnOperationPtzDown('heat', PtzCmd.MW_PTZ_HEATOFF, textLocale.offHeating);
+        } : function () {
+          return _this3.OnOperationPtzDown('heat', PtzCmd.MW_PTZ_HEATON, textLocale.openHeating);
+        }
+      }))), /*#__PURE__*/React.createElement("div", {
+        className: "ptzctr-panel-bottom ".concat(CONSTANT_IMOS_PLAYER_CAST_VIDEO_CLASSNAME),
+        onClick: this._onShowMorePnl
+      }, /*#__PURE__*/React.createElement("div", {
+        className: isShowPtzMore ? 'ptzctr-bottom-retractIcon' : 'ptzctr-bottom-spreadIcon'
+      })));
+    }
+  }]);
+}(Component);
+export { PtzControlPanel as default };