import { M as n, c as e } from "./index-YqpN0yec.js";
import { _ as r, a as i } from "./record-WJfBn7Fn.js";
import { _ as t } from "./stop-DrpmwvZH.js";
import { _ as o } from "./mount_head-c1OIlkSj.js";
import { n as a, c as d } from "./index-BcLRpF0n.js";
import "vue";
import "vue-clipboard2";
import "interactjs";
import "prismjs";
import "prismjs/themes/prism-okaidia.css";
import "@liveqing/liveplayer";
import "jquery";
import "mqtt/dist/mqtt";
import "vuex";
import "axios";
import "element-ui";
import "vue-router";
import "moment";
import "terraformer-wkt-parser";
import "dayjs";
import "file-saver";
import "nanoid";
import "jspack";
import "recorder-core";
import "recorder-core/src/engine/mp3";
import "recorder-core/src/engine/mp3-engine";
import "recorder-core/src/engine/pcm";
import "js-base64";
import "element-ui/lib/theme-chalk/index.css";
var l = {
  props: {
    containerStyle: {
      type: Object,
      "default": function _default() {
        return {};
      }
    },
    position: {
      type: Object,
      "default": function _default() {
        return {};
      }
    },
    payload: {
      type: Array,
      "default": function _default() {
        return [];
      }
    },
    device: {
      type: Object,
      "default": function _default() {
        return {};
      }
    },
    moveType: {
      type: String,
      "default": function _default() {
        return "";
      }
    },
    selected_mount: {
      type: Object,
      "default": function _default() {
        return {};
      }
    }
  },
  data: function data() {
    return {
      routePath: "",
      holderModelDomV2: 1,
      controlist: [{
        id: 4,
        type: "一键向下"
      }, {
        id: 3,
        type: "航向回中"
      }, {
        id: 5,
        type: "俯仰水平"
      }, {
        id: 2,
        type: "回中"
      }],
      control_change: 2,
      radio: 1,
      zdid: 1,
      value: 25,
      value2: 25,
      control_speed: 3,
      click_mode: 0,
      ptz_mode: 1,
      wid_mode: 0,
      stable_mode: 1,
      vis_mode: 0,
      noise_mode: 1,
      ele_mode: 0,
      video_mode: 0,
      night_mode: 0,
      white_mode: 0,
      control_mode: 0,
      zoom: 1,
      pitch: 0,
      yaw: 0,
      fog_mode: 0,
      record: !1,
      dj_mode: 0,
      regList: [{
        val: "复位",
        num: 0
      }, {
        val: "30",
        num: 30
      }, {
        val: "60",
        num: 60
      }, {
        val: "90",
        num: 90
      }],
      drd: {
        dj_mode: [{
          id: 0,
          label: "关闭"
        }, {
          id: 1,
          label: "打开"
        }],
        click_mode: [{
          id: 0,
          label: "移动"
        }, {
          id: 1,
          label: "聚焦"
        }, {
          id: 2,
          label: "曝光"
        }],
        ptz_mode: [{
          id: 0,
          label: "锁定"
        }, {
          id: 1,
          label: "跟随"
        }, {
          id: 2,
          label: "回中"
        }],
        wid_mode: [{
          id: 0,
          label: "关闭"
        }, {
          id: 1,
          label: "打开"
        }],
        stable_mode: [{
          id: 0,
          label: "关闭"
        }, {
          id: 1,
          label: "超级"
        }, {
          id: 2,
          label: "超级+"
        }],
        control_mode: [{
          id: 0,
          label: "关"
        }, {
          id: 1,
          label: "开"
        }],
        vis_mode: [{
          id: 0,
          label: "关闭"
        }, {
          id: 1,
          label: "打开"
        }],
        noise_mode: [{
          id: 0,
          label: "关闭"
        }, {
          id: 1,
          label: "打开"
        }],
        ele_mode: [{
          id: 0,
          label: "关闭"
        }, {
          id: 1,
          label: "打开"
        }],
        video_mode: [{
          id: 0,
          label: "1080p60"
        }, {
          id: 1,
          label: "1080p30"
        }, {
          id: 2,
          label: "720p60"
        }],
        night_mode: [{
          id: 0,
          label: "关闭"
        }, {
          id: 1,
          label: "黑白"
        }, {
          id: 2,
          label: "彩色"
        }],
        white_mode: [{
          id: 0,
          label: "自动"
        }, {
          id: 1,
          label: "室内"
        }, {
          id: 2,
          label: "室外"
        }],
        fog_mode: [{
          id: 0,
          label: "关闭"
        }, {
          id: 1,
          label: "打开"
        }]
      },
      timer: null
    };
  },
  computed: {
    stream: function stream() {
      return this.$store.state.fckernel.stream;
    }
  },
  watch: {
    payload: {
      handler: function handler(n) {
        this.resolve_payload(n);
      },
      deep: !0
    }
  },
  mounted: function mounted() {
    var _this = this;
    this.$nextTick(function () {
      _this.init_rocker();
    }), "fckernel" == this.$route.path.replace("/", "") && (this.routePath = !0);
  },
  methods: {
    close: function close() {
      this.record ? this.$message.info("请结束录像后再关闭！") : this.$emit("close");
    },
    handle_change_dj_mode: function handle_change_dj_mode(n) {
      console.log(this.device, "device");
    },
    handle_change_zd: function handle_change_zd(n) {
      console.log(n), console.log(this.device, "device");
    },
    onChangezoom: function onChangezoom(e) {
      if (e < 25) this.handle_zoom(-1);else if (e > 25) this.handle_zoom(1);else {
        var _e = n.zoom(this.zoom = 1);
        this.commit_directive(_e);
      }
    },
    mousedownFn: function mousedownFn() {},
    stopChange: function stopChange() {
      this.value = 25, this.value2 = 25;
      var e = n.zoom(this.zoom = 1);
      this.commit_directive(e);
    },
    resolve_payload: function resolve_payload(n) {
      var r = new Uint8Array(n);
      if (165 === r[0] && e(r) === r[r.length - 1]) switch (r[1]) {
        case 1:
          this.msg_key_status1(r);
          break;
        case 248:
          this.gcs_button_ctrl(r);
      }
    },
    gcs_button_ctrl: function gcs_button_ctrl(n) {
      var e = n[3],
        r = n[4];
      if (4 === e) this.gimbal_mode_ctrl(r);
    },
    msg_key_status1: function msg_key_status1(n) {
      this.gimbal_mode_ctrl(3 & n[7]);
    },
    gimbal_mode_ctrl: function gimbal_mode_ctrl(n) {
      this.ptz_mode = n;
    },
    handle_change_click_mode: function handle_change_click_mode(e) {
      var r = n.give_directions_ctrl(e);
      this.commit_directive(r);
    },
    handle_change_ptz_mode: function handle_change_ptz_mode(e) {
      this.holderModelDomV2 = e;
      var r = n.gimbal_mode_ctrl(e);
      this.commit_directive(r);
    },
    handle_change_wid_mode: function handle_change_wid_mode(e) {
      var r = n.camera_WD_ctrl(e);
      console.log(r, "budd"), this.commit_directive(r);
    },
    handle_change_stable_mode: function handle_change_stable_mode(e) {
      var r = n.stabilizer_mode_ctrl(e);
      this.commit_directive(r);
    },
    handle_change_control_mode: function handle_change_control_mode(e) {
      var r = n.control_mode_ctrl(e);
      this.commit_directive(r);
    },
    handle_change_vis_mode: function handle_change_vis_mode(e) {
      var r = n.VE_mode_ctrl(e);
      this.commit_directive(r);
    },
    handle_change_noise_mode: function handle_change_noise_mode(e) {
      var r = n.NR_mode_ctrl(e);
      this.commit_directive(r);
    },
    handle_change_ele_mode: function handle_change_ele_mode(e) {
      var r = n.DZOOM_mode_ctrl(e);
      this.commit_directive(r);
    },
    handle_change_video_mode: function handle_change_video_mode(e) {
      var r = n.videooutput_mode_ctrl(e);
      this.commit_directive(r), r = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 25, 3, 255, 151, 254], this.commit_directive(r);
    },
    handle_change_night_mode: function handle_change_night_mode(e) {
      var r = n.ICR_mode_ctrl(e);
      this.commit_directive(r);
    },
    handle_change_white_mode: function handle_change_white_mode(e) {
      var r = n.WB_mode_ctrl(e);
      this.commit_directive(r);
    },
    handle_saturated: function handle_saturated(e) {
      var r = n.saturated(this.zoom + e);
      this.commit_directive(r);
    },
    handle_zoom: function handle_zoom(e) {
      var r = n.zoom(this.zoom + e);
      this.commit_directive(r);
    },
    handle_change_pitch: function handle_change_pitch(e) {
      this.pitch = e;
      var r = n.change_pitch_angle(this.pitch);
      this.commit_directive(r);
    },
    handle_change_yaw: function handle_change_yaw() {
      var e = n.change_yaw_angle(this.yaw);
      this.commit_directive(e);
    },
    handle_change_camera_mode: function handle_change_camera_mode(e) {
      var r = n.camera_mode_ctrl(e);
      this.commit_directive(r);
    },
    handle_change_fog_mode: function handle_change_fog_mode(e) {
      var r = n.camera_Defog_ctrl(e);
      this.commit_directive(r);
    },
    handle_take_photo: function handle_take_photo() {
      var n = {
        data: {
          data: {
            videoID: 1
          }
        },
        type: 528
      };
      "QingLiu" == this.stream ? n.data.messageID = 1016 : n.data.messageID = 1007, this.$emit("take_photo", n);
    },
    handle_record: function handle_record() {
      this.record = !this.record;
      var n = {
        data: {
          data: {
            videoID: 1
          }
        },
        type: 528
      };
      "QingLiu" == this.stream ? (n.data.messageID = 1017, n.data.data.status = this.record) : (n.data.messageID = 1006, n.data.data.recordControl = this.record), this.$emit("record", n);
    },
    commit_directive: function commit_directive(n) {
      this.$emit("directive", n);
    },
    onChangeType: function onChangeType(e) {
      var r = n.gimbal_mode_ctrl(e);
      this.commit_directive(r);
    },
    fangxiang: function fangxiang(e) {
      var r = null;
      switch (e) {
        case "up":
          console.log(this.control_speed), r = n.gimbal_pitch_ctrl(1), this.commit_directive(r);
          break;
        case "right":
          r = n.gimbal_yaw_ctrl(1), this.commit_directive(r);
          break;
        case "left":
          r = n.gimbal_yaw_ctrl(-1), this.commit_directive(r);
          break;
        case "down":
          r = n.gimbal_pitch_ctrl(-1), this.commit_directive(r);
      }
    },
    stopfxFn: function stopfxFn() {
      var e = null;
      e = n.gimbal_pitch_ctrl(0, this.control_speed), this.commit_directive(e), e = n.gimbal_yaw_ctrl(0, this.control_speed), this.commit_directive(e);
    },
    init_rocker: function init_rocker() {
      var _this2 = this;
      var e = null;
      joystick({
        onstart: function onstart(r) {
          switch (r) {
            case "up":
              console.log(_this2.control_speed), e = n.gimbal_pitch_ctrl(1, _this2.control_speed), _this2.commit_directive(e);
              break;
            case "right":
              e = n.gimbal_yaw_ctrl(1, _this2.control_speed), _this2.commit_directive(e);
              break;
            case "left":
              e = n.gimbal_yaw_ctrl(-1, _this2.control_speed), _this2.commit_directive(e);
              break;
            case "down":
              e = n.gimbal_pitch_ctrl(-1, _this2.control_speed), _this2.commit_directive(e);
          }
        },
        onend: function onend() {
          e = n.gimbal_pitch_ctrl(0, _this2.control_speed), _this2.commit_directive(e), e = n.gimbal_yaw_ctrl(0, _this2.control_speed), _this2.commit_directive(e);
        }
      });
    }
  }
};
var s = function s() {
    var n = this,
      e = n.$createElement,
      o = n._self._c || e;
    return o("div", {
      staticClass: "cpt-MMC_Gimbal_Z30Pro",
      "class": {
        heightOne: 1 == n.routePath
      },
      style: n.containerStyle
    }, [o("div", {
      directives: [{
        name: "interact",
        rawName: "v-interact"
      }],
      staticClass: "hd"
    }, [n._m(0), n._v(" "), o("div", {
      staticClass: "close",
      on: {
        click: n.close
      }
    }, [n._v("关闭")])]), n._v(" "), o("div", {
      staticClass: "bd",
      "class": {
        heightTwo: 1 == n.routePath
      }
    }, [o("div", {
      staticClass: "form-wrap"
    }, [o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("控制速度")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("div", {
      staticClass: "speedC"
    }, n._l(new Array(5).fill(1), function (e, r) {
      return o("div", {
        key: r,
        staticClass: "speed",
        style: n.control_speed == r + 1 ? "background: #FFFFFF;color: #333333;" : "",
        on: {
          click: function click(e) {
            n.control_speed = r + 1;
          }
        }
      }, [n._v("\n                " + n._s(r + 1) + "\n              ")]);
    }), 0)])]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("云台模式")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("div", {
      staticClass: "mono"
    }, [o("div", {
      staticClass: "mono-long"
    }, [o("div", {
      staticClass: "mono-left mono_box",
      "class": {
        active: 0 == n.holderModelDomV2
      },
      on: {
        click: function click(e) {
          return n.handle_change_ptz_mode(0);
        }
      }
    }), n._v(" "), o("div", {
      staticClass: "mono-middle mono_box",
      "class": {
        active: 1 == n.holderModelDomV2
      },
      on: {
        click: function click(e) {
          return n.handle_change_ptz_mode(1);
        }
      }
    }), n._v(" "), o("div", {
      staticClass: "mono-right mono_box",
      "class": {
        active: 2 == n.holderModelDomV2
      },
      on: {
        click: function click(e) {
          return n.handle_change_ptz_mode(2);
        }
      }
    })]), n._v(" "), n._m(1)])])]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("视频指点:")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("el-radio-group", {
      on: {
        change: n.handle_change_dj_mode
      },
      model: {
        value: n.dj_mode,
        callback: function callback(e) {
          n.dj_mode = e;
        },
        expression: "dj_mode"
      }
    }, n._l(n.drd.dj_mode, function (e) {
      return o("el-radio", {
        key: e.id,
        attrs: {
          size: "mini",
          label: e.id
        }
      }, [n._v(n._s(e.label) + "\n              ")]);
    }), 1)], 1)]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("变       焦")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("div", {
      staticClass: "mr10 cp",
      on: {
        mousedown: function mousedown(e) {
          return n.handle_zoom(-1);
        },
        mouseup: n.stopChange,
        mouseleave: n.stopChange
      }
    }, [o("span", {
      staticClass: "iconfont icon-shanchu3"
    })]), n._v(" "), o("el-slider", {
      staticStyle: {
        width: "10px"
      },
      attrs: {
        max: 50,
        min: 0,
        "show-tooltip": !1
      },
      on: {
        input: n.onChangezoom,
        mouseout: function mouseout(e) {
          n.value = 25;
        },
        mouseleave: function mouseleave(e) {
          n.value = 25;
        }
      },
      model: {
        value: n.value,
        callback: function callback(e) {
          n.value = e;
        },
        expression: "value"
      }
    }), n._v(" "), o("div", {
      staticClass: "ml10 cp",
      on: {
        mousedown: function mousedown(e) {
          return n.handle_zoom(1);
        },
        mouseup: n.stopChange,
        mouseleave: n.stopChange
      }
    }, [o("span", {
      staticClass: "iconfont icon-tianjia1"
    })])], 1)]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("俯       仰")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("div", {
      staticClass: "speedC"
    }, n._l(n.regList, function (e, r) {
      return o("div", {
        key: r,
        staticClass: "pitch",
        style: n.pitch == e.num ? "background: #FFFFFF;color: #333333;" : "",
        on: {
          click: function click(r) {
            return n.handle_change_pitch(e.num);
          }
        }
      }, [n._v("\n                " + n._s(e.val) + "\n              ")]);
    }), 0)])]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("点       击")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("el-radio-group", {
      on: {
        change: n.handle_change_click_mode
      },
      model: {
        value: n.click_mode,
        callback: function callback(e) {
          n.click_mode = e;
        },
        expression: "click_mode"
      }
    }, n._l(n.drd.click_mode, function (e) {
      return o("el-radio", {
        key: e.id,
        attrs: {
          size: "mini",
          label: e.id
        }
      }, [n._v(n._s(e.label) + "\n              ")]);
    }), 1)], 1)]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("宽  动  态")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("el-radio-group", {
      on: {
        change: n.handle_change_wid_mode
      },
      model: {
        value: n.wid_mode,
        callback: function callback(e) {
          n.wid_mode = e;
        },
        expression: "wid_mode"
      }
    }, n._l(n.drd.wid_mode, function (e) {
      return o("el-radio", {
        key: e.id,
        attrs: {
          size: "mini",
          label: e.id
        }
      }, [n._v(n._s(e.label) + "\n              ")]);
    }), 1)], 1)]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("透       雾")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("el-radio-group", {
      on: {
        change: n.handle_change_fog_mode
      },
      model: {
        value: n.fog_mode,
        callback: function callback(e) {
          n.fog_mode = e;
        },
        expression: "fog_mode"
      }
    }, n._l(n.drd.fog_mode, function (e) {
      return o("el-radio", {
        key: e.id,
        attrs: {
          size: "mini",
          label: e.id
        }
      }, [n._v(n._s(e.label) + "\n              ")]);
    }), 1)], 1)]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("联控模式")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("el-radio-group", {
      on: {
        change: n.handle_change_control_mode
      },
      model: {
        value: n.control_mode,
        callback: function callback(e) {
          n.control_mode = e;
        },
        expression: "control_mode"
      }
    }, n._l(n.drd.control_mode, function (e) {
      return o("el-radio", {
        key: e.id,
        attrs: {
          size: "mini",
          label: e.id
        }
      }, [n._v(n._s(e.label) + "\n              ")]);
    }), 1)], 1)]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("电子增稳")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("el-radio-group", {
      on: {
        change: n.handle_change_stable_mode
      },
      model: {
        value: n.stable_mode,
        callback: function callback(e) {
          n.stable_mode = e;
        },
        expression: "stable_mode"
      }
    }, n._l(n.drd.stable_mode, function (e) {
      return o("el-radio", {
        key: e.id,
        attrs: {
          size: "mini",
          label: e.id
        }
      }, [n._v(n._s(e.label) + "\n              ")]);
    }), 1)], 1)]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("可见度增强")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("el-radio-group", {
      on: {
        change: n.handle_change_vis_mode
      },
      model: {
        value: n.vis_mode,
        callback: function callback(e) {
          n.vis_mode = e;
        },
        expression: "vis_mode"
      }
    }, n._l(n.drd.vis_mode, function (e) {
      return o("el-radio", {
        key: e.id,
        attrs: {
          size: "mini",
          label: e.id
        }
      }, [n._v(n._s(e.label) + "\n              ")]);
    }), 1)], 1)]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("降       噪")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("el-radio-group", {
      on: {
        change: n.handle_change_noise_mode
      },
      model: {
        value: n.noise_mode,
        callback: function callback(e) {
          n.noise_mode = e;
        },
        expression: "noise_mode"
      }
    }, n._l(n.drd.noise_mode, function (e) {
      return o("el-radio", {
        key: e.id,
        attrs: {
          size: "mini",
          label: e.id
        }
      }, [n._v(n._s(e.label) + "\n              ")]);
    }), 1)], 1)]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("电子变倍")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("el-radio-group", {
      on: {
        change: n.handle_change_ele_mode
      },
      model: {
        value: n.ele_mode,
        callback: function callback(e) {
          n.ele_mode = e;
        },
        expression: "ele_mode"
      }
    }, n._l(n.drd.ele_mode, function (e) {
      return o("el-radio", {
        key: e.id,
        attrs: {
          size: "mini",
          label: e.id
        }
      }, [n._v(n._s(e.label) + "\n              ")]);
    }), 1)], 1)]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("视频输出")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("el-radio-group", {
      on: {
        change: n.handle_change_video_mode
      },
      model: {
        value: n.video_mode,
        callback: function callback(e) {
          n.video_mode = e;
        },
        expression: "video_mode"
      }
    }, n._l(n.drd.video_mode, function (e) {
      return o("el-radio", {
        key: e.id,
        attrs: {
          size: "mini",
          label: e.id
        }
      }, [n._v(n._s(e.label) + "\n              ")]);
    }), 1)], 1)]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("夜间模式")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("el-radio-group", {
      on: {
        change: n.handle_change_night_mode
      },
      model: {
        value: n.night_mode,
        callback: function callback(e) {
          n.night_mode = e;
        },
        expression: "night_mode"
      }
    }, n._l(n.drd.night_mode, function (e) {
      return o("el-radio", {
        key: e.id,
        attrs: {
          size: "mini",
          label: e.id
        }
      }, [n._v(n._s(e.label) + "\n              ")]);
    }), 1)], 1)]), n._v(" "), o("div", {
      staticClass: "form-item"
    }, [o("div", {
      staticClass: "label-box"
    }, [n._v("白  平  衡")]), n._v(" "), o("div", {
      staticClass: "input-box"
    }, [o("el-radio-group", {
      on: {
        change: n.handle_change_white_mode
      },
      model: {
        value: n.white_mode,
        callback: function callback(e) {
          n.white_mode = e;
        },
        expression: "white_mode"
      }
    }, n._l(n.drd.white_mode, function (e) {
      return o("el-radio", {
        key: e.id,
        attrs: {
          size: "mini",
          label: e.id
        }
      }, [n._v(n._s(e.label) + "\n              ")]);
    }), 1)], 1)])]), n._v(" "), o("div", {
      staticClass: "rocker-wrap"
    }, [o("div", {
      staticClass: "item-group"
    }, [o("div", {
      staticClass: "item-box",
      on: {
        click: n.handle_take_photo
      }
    }, [o("el-tooltip", {
      staticClass: "item",
      attrs: {
        effect: "dark",
        content: "拍照",
        placement: "top"
      }
    }, [o("div", {
      staticClass: "icon-box"
    }, [o("img", {
      attrs: {
        src: r,
        alt: ""
      }
    })])])], 1), n._v(" "), o("div", {
      staticClass: "item-box",
      on: {
        click: n.handle_record
      }
    }, [o("el-tooltip", {
      staticClass: "item",
      attrs: {
        effect: "dark",
        content: "录像",
        placement: "top"
      }
    }, [o("div", {
      staticClass: "icon-box"
    }, [n.record ? o("img", {
      attrs: {
        src: t,
        alt: ""
      }
    }) : o("img", {
      attrs: {
        src: i,
        alt: ""
      }
    })])])], 1)]), n._v(" "), o("div", {
      ref: "rocker",
      staticClass: "rocker"
    }, [o("div", {
      staticClass: "shangUp",
      on: {
        mousedown: function mousedown(e) {
          return n.fangxiang("up");
        },
        mouseup: n.stopfxFn,
        mouseout: n.stopfxFn
      }
    }), n._v(" "), o("div", {
      staticClass: "xaiUp",
      on: {
        mousedown: function mousedown(e) {
          return n.fangxiang("down");
        },
        mouseup: n.stopfxFn,
        mouseout: n.stopfxFn
      }
    }), n._v(" "), o("div", {
      staticClass: "zuoUp",
      on: {
        mousedown: function mousedown(e) {
          return n.fangxiang("left");
        },
        mouseup: n.stopfxFn,
        mouseout: n.stopfxFn
      }
    }), n._v(" "), o("div", {
      staticClass: "youUp",
      on: {
        mousedown: function mousedown(e) {
          return n.fangxiang("right");
        },
        mouseup: n.stopfxFn,
        mouseout: n.stopfxFn
      }
    })])])])]);
  },
  c = [function () {
    var n = this,
      e = n.$createElement,
      r = n._self._c || e;
    return r("div", {
      staticClass: "left ml8"
    }, [r("img", {
      attrs: {
        src: o
      }
    }), n._v(" "), r("div", {
      staticClass: "title"
    }, [n._v("高清变焦相机")])]);
  }, function () {
    var n = this,
      e = n.$createElement,
      r = n._self._c || e;
    return r("div", {
      staticClass: "text"
    }, [r("div", {
      staticClass: "text-left"
    }, [n._v("锁定")]), n._v(" "), r("div", {
      staticClass: "text-right"
    }, [n._v("跟随")]), n._v(" "), r("div", {
      staticClass: "text-right"
    }, [n._v("回中")])]);
  }];
s._withStripped = !0;
var m = a({
  render: s,
  staticRenderFns: c
}, function (n) {
  n && n("data-v-579bee40_0", {
    source: '.cpt-MMC_Gimbal_Z30Pro[data-v-579bee40] {\n  position: absolute;\n  right: 0;\n  background: rgba(0, 23, 79, 0.7);\n  box-shadow: 0 2px 4px 0 rgba(1, 162, 255, 0.35), inset 0 0 40px 0 rgba(0, 184, 255, 0.5);\n  border-radius: 10px;\n  width: 470px;\n  height: 290px;\n  box-sizing: border-box;\n}\n.cpt-MMC_Gimbal_Z30Pro .hd[data-v-579bee40] {\n  height: 32px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background: rgba(16, 65, 215, 0.2);\n  box-shadow: inset 0 0 15px 0 rgba(0, 182, 255, 0.6);\n  border-radius: 10px 10px 0 0;\n}\n.cpt-MMC_Gimbal_Z30Pro .hd .left[data-v-579bee40] {\n  display: flex;\n  align-items: center;\n}\n.cpt-MMC_Gimbal_Z30Pro .hd .left .title[data-v-579bee40] {\n  font-size: 20px;\n  font-family: YouSheBiaoTiHei;\n  color: #14faff;\n  line-height: 26px;\n  text-shadow: 0px 1px 1px rgba(2, 32, 56, 0.2);\n  background: linear-gradient(135deg, #e3aa77 0%, #f5cda9 38%, #f9ecd3 58%, #fcdbb1 79%, #edb07a 100%);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n}\n.cpt-MMC_Gimbal_Z30Pro .hd .close[data-v-579bee40] {\n  font-size: 14px;\n  font-family: MicrosoftYaHei;\n  color: #d2dfff;\n  margin-right: 8px;\n  cursor: pointer;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd[data-v-579bee40] {\n  padding: 10px 20px;\n  display: flex;\n  justify-content: space-between;\n  overflow-y: auto;\n  height: 230px;\n  overflow-x: hidden;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item[data-v-579bee40] {\n  display: flex;\n  align-items: center;\n  height: 40px;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .label-box[data-v-579bee40] {\n  text-align: right;\n  white-space: nowrap;\n  color: #cbd0eb;\n  width: 75px;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .btn-default[data-v-579bee40] {\n  padding: 0 10px !important;\n  background: #2aefed;\n  border-color: #2aefed;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .input-box[data-v-579bee40] {\n  margin-left: 15px;\n  display: flex;\n  align-items: center;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .input-box .mono[data-v-579bee40] {\n  display: flex;\n  flex-direction: column;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .input-box .mono .mono-long[data-v-579bee40] {\n  display: flex;\n  justify-content: space-between;\n  width: 168px;\n  height: 17px;\n  background: url("../assets/images/mount_long.png") no-repeat;\n  background-size: 100%;\n  margin-bottom: 5px;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .input-box .mono .mono-long .mono_box[data-v-579bee40] {\n  width: 28px;\n  height: 13px;\n  border-radius: 3px;\n  margin-top: 2px;\n  cursor: pointer;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .input-box .mono .mono-long .active[data-v-579bee40] {\n  background: url("../assets/images/mount/mount_control.png") no-repeat !important;\n  background-size: 100% 100%;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .input-box .mono .text[data-v-579bee40] {\n  font-size: 14px;\n  font-family: MicrosoftYaHei;\n  color: #ffffff;\n  display: flex;\n  justify-content: space-between;\n  font-size: 14px;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap[data-v-579bee40] {\n  position: absolute;\n  right: 30px;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .item-group[data-v-579bee40] {\n  display: flex;\n  justify-content: space-evenly;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .item-group .item-box .icon-box[data-v-579bee40] {\n  width: 32px;\n  height: 32px;\n  background: #004fff;\n  border-radius: 32px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .item-group .item-box .icon-box .iconfont[data-v-579bee40] {\n  font-size: 24px;\n  color: #dce9ff;\n  cursor: pointer;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .rocker[data-v-579bee40] {\n  width: 150px;\n  height: 150px;\n  position: relative;\n  margin: 0 auto;\n  background: center url("../assets/images/accident/caozuo.png") no-repeat;\n  background-size: 100% 100%;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .rocker .shangUp[data-v-579bee40] {\n  position: absolute;\n  left: 37%;\n  top: 4px;\n  border-radius: 50%;\n  width: 40px;\n  height: 40px;\n  border: 0px solid red;\n  cursor: pointer;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .rocker .xaiUp[data-v-579bee40] {\n  position: absolute;\n  left: 37%;\n  bottom: 4px;\n  border-radius: 50%;\n  width: 40px;\n  height: 40px;\n  border: 0px solid red;\n  cursor: pointer;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .rocker .zuoUp[data-v-579bee40] {\n  position: absolute;\n  left: 4px;\n  top: 37%;\n  border-radius: 50%;\n  width: 40px;\n  height: 40px;\n  border: 0px solid red;\n  cursor: pointer;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .rocker .youUp[data-v-579bee40] {\n  position: absolute;\n  right: 4px;\n  top: 37%;\n  border-radius: 50%;\n  width: 40px;\n  height: 40px;\n  border: 0px solid red;\n  cursor: pointer;\n}\n[data-v-579bee40] .el-select {\n  width: 165px;\n  margin-right: 5px;\n}\n[data-v-579bee40] .el-select .el-input .el-input__inner {\n  background: #000000;\n  border: 1px solid #004fff;\n  color: #dce9ff;\n}\n[data-v-579bee40] .el-input {\n  width: 165px;\n  margin-right: 5px;\n}\n[data-v-579bee40] .el-input .el-input__inner {\n  background: #000000;\n  border: 1px solid #004fff;\n  color: #dce9ff;\n}\n[data-v-579bee40] .el-radio-group {\n  white-space: nowrap;\n}\n[data-v-579bee40] .el-radio-group .el-radio .el-radio__input.is-checked .el-radio__inner {\n  border-color: #004fff;\n  background: #004fff;\n}\n[data-v-579bee40] .el-radio-group .el-radio .el-radio__label {\n  color: #cbd0eb;\n}\n[data-v-579bee40] .active {\n  background: url("../assets/images/mount/mount_control.png") no-repeat !important;\n  background-size: 100% 100%;\n}\n[data-v-579bee40] .butto {\n  width: 35px;\n  height: 25px;\n  font-size: 12px;\n  line-height: 25px;\n  text-align: center;\n  background: #004fff;\n  color: #000;\n  border-radius: 5px;\n}\n[data-v-579bee40] .el-button {\n  background: #2aefed;\n  color: #000;\n  border: none;\n}\n[data-v-579bee40] .el-slider__bar {\n  background: #fff;\n}\n.speedC[data-v-579bee40] {\n  width: 203px;\n  height: 24px;\n  display: flex;\n  background: rgba(13, 34, 79, 0.65);\n  border: 1px solid #004fff;\n  border-radius: 12px;\n}\n.speedC .speed[data-v-579bee40] {\n  width: 41px;\n  color: #ffffff;\n  border-radius: 12px;\n  text-align: center;\n  line-height: 24px;\n}\n.speedC .pitch[data-v-579bee40] {\n  font-size: 12px;\n  margin-left: 12px;\n  width: 34px;\n  height: 24px;\n  border-radius: 12px;\n  text-align: center;\n  line-height: 24px;\n  color: #fff;\n}\n.iconfont[data-v-579bee40] {\n  color: #004fff;\n}\n[data-v-579bee40] .el-slider__runway {\n  visibility: hidden;\n}\n.heightOne[data-v-579bee40] {\n  height: 298px !important;\n}\n.heightTwo[data-v-579bee40] {\n  height: 230px !important;\n}\n\n/*# sourceMappingURL=index.vue.map */',
    map: {
      version: 3,
      sources: ["E:\\work\\standardization\\mmc-stl-module\\src\\components\\MMCFlightControlCenter\\components\\mount\\MMC_Gimbal_Z30Pro\\index.vue", "index.vue"],
      names: [],
      mappings: "AAsyBA;EACA,kBAAA;EAEA,QAAA;EACA,gCAAA;EACA,wFAAA;EACA,mBAAA;EACA,YAAA;EACA,aAAA;EAEA,sBAAA;ACvyBA;ADyyBA;EACA,YAAA;EACA,aAAA;EACA,8BAAA;EACA,mBAAA;EACA,kCAAA;EACA,mDAAA;EACA,4BAAA;ACvyBA;ADyyBA;EACA,aAAA;EACA,mBAAA;ACvyBA;ADwyBA;EACA,eAAA;EACA,4BAAA;EACA,cAAA;EACA,iBAAA;EACA,6CAAA;EACA,oGAAA;EAQA,6BAAA;EACA,oCAAA;AC7yBA;ADizBA;EACA,eAAA;EACA,2BAAA;EACA,cAAA;EACA,iBAAA;EACA,eAAA;AC/yBA;ADmzBA;EACA,kBAAA;EACA,aAAA;EACA,8BAAA;EACA,gBAAA;EACA,aAAA;EACA,kBAAA;ACjzBA;ADszBA;EACA,aAAA;EACA,mBAAA;EACA,YAAA;ACpzBA;ADszBA;EACA,iBAAA;EACA,mBAAA;EACA,cAAA;EACA,WAAA;ACpzBA;ADuzBA;EACA,0BAAA;EACA,mBAAA;EACA,qBAAA;ACrzBA;ADwzBA;EACA,iBAAA;EACA,aAAA;EACA,mBAAA;ACtzBA;ADuzBA;EACA,aAAA;EACA,sBAAA;ACrzBA;ADszBA;EACA,aAAA;EACA,8BAAA;EACA,YAAA;EACA,YAAA;EACA,4DAAA;EACA,qBAAA;EACA,kBAAA;ACpzBA;ADqzBA;EACA,WAAA;EACA,YAAA;EACA,kBAAA;EACA,eAAA;EACA,eAAA;ACnzBA;ADqzBA;EACA,gFAAA;EACA,0BAAA;ACnzBA;ADszBA;EACA,eAAA;EACA,2BAAA;EACA,cAAA;EACA,aAAA;EACA,8BAAA;EACA,eAAA;ACpzBA;AD2zBA;EACA,kBAAA;EACA,WAAA;ACzzBA;AD4zBA;EACA,aAAA;EACA,6BAAA;AC1zBA;AD6zBA;EACA,WAAA;EACA,YAAA;EACA,mBAAA;EACA,mBAAA;EACA,aAAA;EACA,mBAAA;EACA,uBAAA;AC3zBA;AD6zBA;EACA,eAAA;EACA,cAAA;EACA,eAAA;AC3zBA;ADi0BA;EAEA,YAAA;EACA,aAAA;EACA,kBAAA;EACA,cAAA;EACA,wEAAA;EACA,0BAAA;ACh0BA;ADk0BA;EACA,kBAAA;EACA,SAAA;EACA,QAAA;EACA,kBAAA;EACA,WAAA;EACA,YAAA;EACA,qBAAA;EACA,eAAA;ACh0BA;ADm0BA;EACA,kBAAA;EACA,SAAA;EACA,WAAA;EACA,kBAAA;EACA,WAAA;EACA,YAAA;EACA,qBAAA;EACA,eAAA;ACj0BA;ADo0BA;EACA,kBAAA;EACA,SAAA;EACA,QAAA;EACA,kBAAA;EACA,WAAA;EACA,YAAA;EACA,qBAAA;EACA,eAAA;ACl0BA;ADq0BA;EACA,kBAAA;EACA,UAAA;EACA,QAAA;EACA,kBAAA;EACA,WAAA;EACA,YAAA;EACA,qBAAA;EACA,eAAA;ACn0BA;AD20BA;EACA,YAAA;EACA,iBAAA;ACx0BA;AD20BA;EACA,mBAAA;EACA,yBAAA;EACA,cAAA;ACz0BA;AD80BA;EACA,YAAA;EACA,iBAAA;AC50BA;AD80BA;EACA,mBAAA;EACA,yBAAA;EACA,cAAA;AC50BA;ADg1BA;EACA,mBAAA;AC90BA;ADk1BA;EACA,qBAAA;EACA,mBAAA;ACh1BA;ADq1BA;EACA,cAAA;ACn1BA;ADu1BA;EACA,gFAAA;EAEA,0BAAA;ACt1BA;ADw1BA;EACA,WAAA;EACA,YAAA;EACA,eAAA;EACA,iBAAA;EACA,kBAAA;EACA,mBAAA;EACA,WAAA;EACA,kBAAA;ACt1BA;ADw1BA;EACA,mBAAA;EACA,WAAA;EACA,YAAA;ACt1BA;AD01BA;EACA,gBAAA;ACv1BA;AD01BA;EACA,YAAA;EACA,YAAA;EACA,aAAA;EACA,kCAAA;EACA,yBAAA;EACA,mBAAA;ACv1BA;ADy1BA;EACA,WAAA;EAEA,cAAA;EACA,mBAAA;EACA,kBAAA;EACA,iBAAA;ACx1BA;AD01BA;EACA,eAAA;EACA,iBAAA;EACA,WAAA;EACA,YAAA;EACA,mBAAA;EACA,kBAAA;EACA,iBAAA;EACA,WAAA;ACx1BA;AD41BA;EACA,cAAA;ACz1BA;AD61BA;EACA,kBAAA;AC11BA;AD41BA;EACA,wBAAA;ACz1BA;AD21BA;EACA,wBAAA;ACx1BA;;AAEA,oCAAoC",
      file: "index.vue",
      sourcesContent: ['<template>\r\n  <div\r\n    class="cpt-MMC_Gimbal_Z30Pro"\r\n    :style="containerStyle"\r\n    :class="{ heightOne: routePath == true }"\r\n  >\r\n    <div v-interact class="hd">\r\n      <div class="left ml8">\r\n        <img src="../assets/images/mount/mount_head.png" />\r\n        <div class="title">高清变焦相机</div>\r\n      </div>\r\n      <div class="close" @click="close">关闭</div>\r\n    </div>\r\n    <div class="bd" :class="{ heightTwo: routePath == true }">\r\n      <div class="form-wrap">\r\n        <div class="form-item">\r\n          <div class="label-box">控制速度</div>\r\n          <div class="input-box">\r\n            <div class="speedC">\r\n              <div\r\n                v-for="(item, index) in new Array(5).fill(1)"\r\n                :key="index"\r\n                class="speed"\r\n                :style="control_speed == index + 1 ? \'background: #FFFFFF;color: #333333;\' : \'\'"\r\n                @click="control_speed = index + 1"\r\n              >\r\n                {{ index + 1 }}\r\n              </div>\r\n            </div>\r\n            \x3c!-- <el-select\r\n              v-model="control_change"\r\n              size="mini"\r\n              placeholder="请选择控制选项"\r\n              @change="onChangeType"\r\n            >\r\n              <el-option\r\n                v-for="(item, index) in controlist"\r\n                :key="index"\r\n                :label="item.type"\r\n                :value="item.id"\r\n              ></el-option>\r\n            </el-select> --\x3e\r\n          </div>\r\n        </div>\r\n        <div class="form-item">\r\n          <div class="label-box">云台模式</div>\r\n          <div class="input-box">\r\n            <div class="mono">\r\n              <div class="mono-long">\r\n                <div\r\n                  class="mono-left mono_box"\r\n                  :class="{ active: holderModelDomV2 == 0 }"\r\n                  @click="handle_change_ptz_mode(0)"\r\n                />\r\n                <div\r\n                  class="mono-middle mono_box"\r\n                  :class="{ active: holderModelDomV2 == 1 }"\r\n                  @click="handle_change_ptz_mode(1)"\r\n                />\r\n                <div\r\n                  class="mono-right mono_box"\r\n                  :class="{ active: holderModelDomV2 == 2 }"\r\n                  @click="handle_change_ptz_mode(2)"\r\n                />\r\n              </div>\r\n              <div class="text">\r\n                <div class="text-left">锁定</div>\r\n                <div class="text-right">跟随</div>\r\n                <div class="text-right">回中</div>\r\n              </div>\r\n            </div>\r\n            \x3c!-- <el-radio-group @change="handle_change_ptz_mode" v-model="ptz_mode">\r\n              <el-radio size="mini" v-for="item in drd.ptz_mode" :key="item.id" :label="item.id">{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group> --\x3e\r\n          </div>\r\n        </div>\r\n        <div class="form-item">\r\n          <div class="label-box">视频指点:</div>\r\n          <div class="input-box">\r\n            <el-radio-group v-model="dj_mode" @change="handle_change_dj_mode">\r\n              <el-radio\r\nv-for="item in drd.dj_mode"\r\n:key="item.id" size="mini" :label="item.id"\r\n                >{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group>\r\n          </div>\r\n        </div>\r\n        <div class="form-item">\r\n          <div class="label-box">变&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;焦</div>\r\n          <div class="input-box">\r\n            <div\r\n              class="mr10 cp"\r\n              @mousedown="handle_zoom(-1)"\r\n              @mouseup="stopChange"\r\n              @mouseleave="stopChange"\r\n            >\r\n              <span class="iconfont icon-shanchu3" />\r\n            </div>\r\n            \x3c!-- <el-button\r\n              @click="handle_zoom(-1)"\r\n              size="mini"\r\n              icon="el-icon-minus"\r\n              circle\r\n            ></el-button> --\x3e\r\n            <el-slider\r\n              v-model="value"\r\n              :max="50"\r\n              :min="0"\r\n              :show-tooltip="false"\r\n              style="width: 10px"\r\n              @input="onChangezoom"\r\n              @mouseout="value = 25"\r\n              @mouseleave="value = 25"\r\n            />\r\n\r\n            <div\r\n              class="ml10 cp"\r\n              @mousedown="handle_zoom(1)"\r\n              @mouseup="stopChange"\r\n              @mouseleave="stopChange"\r\n            >\r\n              <span class="iconfont icon-tianjia1" />\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class="form-item">\r\n          <div class="label-box">俯&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;仰</div>\r\n          <div class="input-box">\r\n            <div class="speedC">\r\n              <div\r\n                v-for="(item, index) in regList"\r\n                :key="index"\r\n                class="pitch"\r\n                :style="pitch == item.num ? \'background: #FFFFFF;color: #333333;\' : \'\'"\r\n                @click="handle_change_pitch(item.num)"\r\n              >\r\n                {{ item.val }}\r\n              </div>\r\n            </div>\r\n            \x3c!-- <el-input v-model.number="pitch" size="mini" placeholder="请输入俯仰" />\r\n            <span class="iconfont icon-shanchu3" @click="pitch--"></span>\r\n            <span class="iconfont icon-tianjia1 mr5 ml3" @click="pitch++"></span>\r\n            <div class="butto" @click="handle_change_pitch" size="mini" type="primary">设置</div> --\x3e\r\n          </div>\r\n        </div>\r\n        \x3c!--  --\x3e\r\n        <div class="form-item">\r\n          <div class="label-box">点&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;击</div>\r\n          <div class="input-box">\r\n            <el-radio-group v-model="click_mode" @change="handle_change_click_mode">\r\n              <el-radio\r\nv-for="item in drd.click_mode"\r\n:key="item.id" size="mini" :label="item.id"\r\n                >{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group>\r\n          </div>\r\n        </div>\r\n        <div class="form-item">\r\n          <div class="label-box">宽&nbsp;&nbsp;动&nbsp;&nbsp;态</div>\r\n          <div class="input-box">\r\n            <el-radio-group v-model="wid_mode" @change="handle_change_wid_mode">\r\n              <el-radio\r\nv-for="item in drd.wid_mode"\r\n:key="item.id" size="mini" :label="item.id"\r\n                >{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group>\r\n          </div>\r\n        </div>\r\n        \x3c!--  --\x3e\r\n        <div class="form-item">\r\n          <div class="label-box">透&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;雾</div>\r\n          <div class="input-box">\r\n            <el-radio-group v-model="fog_mode" @change="handle_change_fog_mode">\r\n              <el-radio\r\nv-for="item in drd.fog_mode"\r\n:key="item.id" size="mini" :label="item.id"\r\n                >{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group>\r\n          </div>\r\n        </div>\r\n        <div class="form-item">\r\n          <div class="label-box">联控模式</div>\r\n          <div class="input-box">\r\n            <el-radio-group v-model="control_mode" @change="handle_change_control_mode">\r\n              <el-radio\r\nv-for="item in drd.control_mode"\r\n:key="item.id" size="mini" :label="item.id"\r\n                >{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group>\r\n          </div>\r\n        </div>\r\n        \x3c!-- <div class="form-item">\r\n          <div class="label-box">\r\n            航&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;向\r\n          </div>\r\n          <div class="input-box">\r\n            <el-input v-model.number="yaw" size="mini" placeholder="请输入航向" />\r\n            <span class="iconfont icon-shanchu3" @click="yaw--"></span>\r\n            <span class="iconfont icon-tianjia1 mr5 ml3" @click="yaw++"></span>\r\n            <div class="butto" @click="handle_change_yaw" size="mini" type="primary">设置</div>\r\n          </div>\r\n        </div> --\x3e\r\n        <div class="form-item">\r\n          <div class="label-box">电子增稳</div>\r\n          <div class="input-box">\r\n            <el-radio-group v-model="stable_mode" @change="handle_change_stable_mode">\r\n              <el-radio\r\nv-for="item in drd.stable_mode"\r\n:key="item.id" size="mini" :label="item.id"\r\n                >{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group>\r\n          </div>\r\n        </div>\r\n        <div class="form-item">\r\n          <div class="label-box">可见度增强</div>\r\n          <div class="input-box">\r\n            <el-radio-group v-model="vis_mode" @change="handle_change_vis_mode">\r\n              <el-radio\r\nv-for="item in drd.vis_mode"\r\n:key="item.id" size="mini" :label="item.id"\r\n                >{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group>\r\n          </div>\r\n        </div>\r\n        <div class="form-item">\r\n          <div class="label-box">降&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;噪</div>\r\n          <div class="input-box">\r\n            <el-radio-group v-model="noise_mode" @change="handle_change_noise_mode">\r\n              <el-radio\r\nv-for="item in drd.noise_mode"\r\n:key="item.id" size="mini" :label="item.id"\r\n                >{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group>\r\n          </div>\r\n        </div>\r\n        <div class="form-item">\r\n          <div class="label-box">电子变倍</div>\r\n          <div class="input-box">\r\n            <el-radio-group v-model="ele_mode" @change="handle_change_ele_mode">\r\n              <el-radio\r\nv-for="item in drd.ele_mode"\r\n:key="item.id" size="mini" :label="item.id"\r\n                >{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group>\r\n          </div>\r\n        </div>\r\n        <div class="form-item">\r\n          <div class="label-box">视频输出</div>\r\n          <div class="input-box">\r\n            <el-radio-group v-model="video_mode" @change="handle_change_video_mode">\r\n              <el-radio\r\nv-for="item in drd.video_mode"\r\n:key="item.id" size="mini" :label="item.id"\r\n                >{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group>\r\n          </div>\r\n        </div>\r\n        <div class="form-item">\r\n          <div class="label-box">夜间模式</div>\r\n          <div class="input-box">\r\n            <el-radio-group v-model="night_mode" @change="handle_change_night_mode">\r\n              <el-radio\r\nv-for="item in drd.night_mode"\r\n:key="item.id" size="mini" :label="item.id"\r\n                >{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group>\r\n          </div>\r\n        </div>\r\n        <div class="form-item">\r\n          <div class="label-box">白&nbsp;&nbsp;平&nbsp;&nbsp;衡</div>\r\n          <div class="input-box">\r\n            <el-radio-group v-model="white_mode" @change="handle_change_white_mode">\r\n              <el-radio\r\nv-for="item in drd.white_mode"\r\n:key="item.id" size="mini" :label="item.id"\r\n                >{{ item.label }}\r\n              </el-radio>\r\n            </el-radio-group>\r\n          </div>\r\n        </div>\r\n        \x3c!-- <div class="form-item">\r\n          <div class="label-box">饱和度</div>\r\n          <div class="input-box">\r\n            <el-button @click="handle_saturated(1)" size="mini" icon="el-icon-plus" circle></el-button>\r\n            <el-button @click="handle_saturated(-1)" size="mini" icon="el-icon-minus" circle></el-button>\r\n          </div>\r\n        </div> --\x3e\r\n      </div>\r\n      <div class="rocker-wrap">\r\n        <div class="item-group">\r\n          <div class="item-box" @click="handle_take_photo">\r\n            <el-tooltip class="item" effect="dark" content="拍照" placement="top">\r\n              <div class="icon-box">\r\n                \x3c!-- <span class="iconfont icon-paizhao1"></span> --\x3e\r\n                <img src="../assets/images/mount/photo.png" alt="" />\r\n              </div>\r\n            </el-tooltip>\r\n          </div>\r\n          <div class="item-box" @click="handle_record">\r\n            <el-tooltip class="item" effect="dark" content="录像" placement="top">\r\n              <div class="icon-box">\r\n                \x3c!-- <span class="iconfont icon-dandianshipin"></span> --\x3e\r\n                <img v-if="!record" src="../assets/images/mount/record.png" alt="" />\r\n                <img v-else src="../assets/images/mount/stop.png" alt="" />\r\n              </div>\r\n            </el-tooltip>\r\n          </div>\r\n        </div>\r\n        <div ref="rocker" class="rocker">\r\n          <div\r\n            class="shangUp"\r\n            @mousedown="fangxiang(\'up\')"\r\n            @mouseup="stopfxFn"\r\n            @mouseout="stopfxFn"\r\n          />\r\n          <div\r\n            class="xaiUp"\r\n            @mousedown="fangxiang(\'down\')"\r\n            @mouseup="stopfxFn"\r\n            @mouseout="stopfxFn"\r\n          />\r\n          <div\r\n            class="zuoUp"\r\n            @mousedown="fangxiang(\'left\')"\r\n            @mouseup="stopfxFn"\r\n            @mouseout="stopfxFn"\r\n          />\r\n          <div\r\n            class="youUp"\r\n            @mousedown="fangxiang(\'right\')"\r\n            @mouseup="stopfxFn"\r\n            @mouseout="stopfxFn"\r\n          />\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</template>\r\n\r\n<script>\r\nimport { cal_crc_table, MMC_Gimbal_Z30Pro } from \'./js/index\';\r\nexport default {\r\n  props: {\r\n    containerStyle: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    /* taskId: {\r\n      type: Boolean,\r\n      default: ""\r\n    }, */\r\n    position: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    payload: {\r\n      type: Array,\r\n      default: () => []\r\n    },\r\n    device: {\r\n      type: Object,\r\n      default: () => ({})\r\n    },\r\n    moveType: {\r\n      type: String,\r\n      default: () => \'\'\r\n    },\r\n    selected_mount: {\r\n      type: Object,\r\n      default: () => ({})\r\n    }\r\n  },\r\n  data() {\r\n    return {\r\n      routePath: \'\', // 判断当前路径\r\n      holderModelDomV2: 1,\r\n      controlist: [\r\n        {\r\n          id: 4,\r\n          type: \'一键向下\'\r\n        },\r\n        {\r\n          id: 3,\r\n          type: \'航向回中\'\r\n        },\r\n        {\r\n          id: 5,\r\n          type: \'俯仰水平\'\r\n        },\r\n        {\r\n          id: 2,\r\n          type: \'回中\'\r\n        }\r\n      ],\r\n      control_change: 2,\r\n      radio: 1,\r\n      zdid: 1,\r\n      value: 25,\r\n      value2: 25,\r\n      control_speed: 3,\r\n      click_mode: 0,\r\n      ptz_mode: 1,\r\n      wid_mode: 0,\r\n      stable_mode: 1,\r\n      vis_mode: 0,\r\n      noise_mode: 1,\r\n      ele_mode: 0,\r\n      video_mode: 0,\r\n      night_mode: 0,\r\n      white_mode: 0,\r\n      control_mode: 0,\r\n      zoom: 1,\r\n      pitch: 0,\r\n      yaw: 0,\r\n      fog_mode: 0,\r\n      record: false,\r\n      dj_mode: 0,\r\n      regList: [\r\n        {\r\n          val: \'复位\',\r\n          num: 0\r\n        },\r\n        {\r\n          val: \'30\',\r\n          num: 30\r\n        },\r\n        {\r\n          val: \'60\',\r\n          num: 60\r\n        },\r\n        {\r\n          val: \'90\',\r\n          num: 90\r\n        }\r\n      ],\r\n      drd: {\r\n        dj_mode: [\r\n          { id: 0, label: \'关闭\' },\r\n          { id: 1, label: \'打开\' }\r\n        ],\r\n        click_mode: [\r\n          { id: 0, label: \'移动\' },\r\n          { id: 1, label: \'聚焦\' },\r\n          { id: 2, label: \'曝光\' }\r\n        ],\r\n        ptz_mode: [\r\n          { id: 0, label: \'锁定\' },\r\n          { id: 1, label: \'跟随\' },\r\n          { id: 2, label: \'回中\' }\r\n        ],\r\n        wid_mode: [\r\n          { id: 0, label: \'关闭\' },\r\n          { id: 1, label: \'打开\' }\r\n        ],\r\n        stable_mode: [\r\n          { id: 0, label: \'关闭\' },\r\n          { id: 1, label: \'超级\' },\r\n          { id: 2, label: \'超级+\' }\r\n        ],\r\n        control_mode: [\r\n          { id: 0, label: \'关\' },\r\n          { id: 1, label: \'开\' }\r\n        ],\r\n        vis_mode: [\r\n          { id: 0, label: \'关闭\' },\r\n          { id: 1, label: \'打开\' }\r\n        ],\r\n        noise_mode: [\r\n          { id: 0, label: \'关闭\' },\r\n          { id: 1, label: \'打开\' }\r\n        ],\r\n        ele_mode: [\r\n          { id: 0, label: \'关闭\' },\r\n          { id: 1, label: \'打开\' }\r\n        ],\r\n        video_mode: [\r\n          { id: 0, label: \'1080p60\' },\r\n          { id: 1, label: \'1080p30\' },\r\n          { id: 2, label: \'720p60\' }\r\n        ],\r\n        night_mode: [\r\n          { id: 0, label: \'关闭\' },\r\n          { id: 1, label: \'黑白\' },\r\n          { id: 2, label: \'彩色\' }\r\n        ],\r\n        white_mode: [\r\n          { id: 0, label: \'自动\' },\r\n          { id: 1, label: \'室内\' },\r\n          { id: 2, label: \'室外\' }\r\n        ],\r\n        fog_mode: [\r\n          { id: 0, label: \'关闭\' },\r\n          { id: 1, label: \'打开\' }\r\n        ]\r\n      },\r\n      timer: null\r\n    };\r\n  },\r\n  computed: {\r\n    stream() {\r\n      return this.$store.state.fckernel.stream;\r\n    }\r\n  },\r\n  watch: {\r\n    payload: {\r\n      handler(value) {\r\n        this.resolve_payload(value);\r\n      },\r\n      deep: true\r\n    }\r\n  },\r\n  mounted() {\r\n    this.$nextTick(() => {\r\n      this.init_rocker();\r\n    });\r\n    // console.log(\'1111111111111111111111111111----\');\r\n    if (this.$route.path.replace(\'/\', \'\') == \'fckernel\') {\r\n      this.routePath = true;\r\n    }\r\n    //  console.log(this.$route.path.replace(\'/\',\'\'),\'-----------111111111111111\');\r\n  },\r\n  methods: {\r\n    close() {\r\n      if (this.record) {\r\n        this.$message.info(\'请结束录像后再关闭！\');\r\n      } else {\r\n        this.$emit(\'close\');\r\n      }\r\n    },\r\n    handle_change_dj_mode(id) {\r\n      console.log(this.device, \'device\');\r\n      /* this.$store.commit("device/SET_MOVE_DATA", {\r\n        ...this.device,\r\n        mountStatus: id,\r\n        mountId: this.selected_mount.mountId,\r\n        moveType: this.moveType,\r\n        name: this.selected_mount.name,\r\n      }); */\r\n    },\r\n    handle_change_zd(id) {\r\n      console.log(id);\r\n      console.log(this.device, \'device\');\r\n    },\r\n    onChangezoom(e) {\r\n      if (e < 25) {\r\n        this.handle_zoom(-1);\r\n      } else if (e > 25) {\r\n        this.handle_zoom(1);\r\n      } else {\r\n        const buffer = MMC_Gimbal_Z30Pro.zoom((this.zoom = 1));\r\n        this.commit_directive(buffer);\r\n      }\r\n    },\r\n    mousedownFn() {\r\n      // console.log(mousedownFn, "mousedownFn");\r\n    },\r\n    stopChange() {\r\n      this.value = 25;\r\n      this.value2 = 25;\r\n      // this.handle_zoom(this)\r\n      const buffer = MMC_Gimbal_Z30Pro.zoom((this.zoom = 1));\r\n      this.commit_directive(buffer);\r\n    },\r\n    resolve_payload(buff) {\r\n      const dataArray = new Uint8Array(buff);\r\n      if (dataArray[0] === 0xa5 && cal_crc_table(dataArray) === dataArray[dataArray.length - 1]) {\r\n        switch (dataArray[1]) {\r\n          case 0x01:\r\n            this.msg_key_status1(dataArray);\r\n            break;\r\n          case 0xf8:\r\n            this.gcs_button_ctrl(dataArray);\r\n            break;\r\n        }\r\n      }\r\n    },\r\n    gcs_button_ctrl(data) {\r\n      const button = data[3];\r\n      const status = data[4];\r\n\r\n      switch (button) {\r\n        case 4:\r\n          this.gimbal_mode_ctrl(status);\r\n          break;\r\n        default:\r\n          break;\r\n      }\r\n    },\r\n    msg_key_status1(data) {\r\n      this.gimbal_mode_ctrl(data[7] & 0x3);\r\n    },\r\n    gimbal_mode_ctrl(mode) {\r\n      this.ptz_mode = mode;\r\n    },\r\n    handle_change_click_mode(value) {\r\n      const buffer = MMC_Gimbal_Z30Pro.give_directions_ctrl(value);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_ptz_mode(value) {\r\n      this.holderModelDomV2 = value;\r\n      const buffer = MMC_Gimbal_Z30Pro.gimbal_mode_ctrl(value);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_wid_mode(value) {\r\n      const buffer = MMC_Gimbal_Z30Pro.camera_WD_ctrl(value);\r\n      console.log(buffer, \'budd\');\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_stable_mode(value) {\r\n      const buffer = MMC_Gimbal_Z30Pro.stabilizer_mode_ctrl(value);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_control_mode(mode) {\r\n      const buffer = MMC_Gimbal_Z30Pro.control_mode_ctrl(mode);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_vis_mode(value) {\r\n      const buffer = MMC_Gimbal_Z30Pro.VE_mode_ctrl(value);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_noise_mode(value) {\r\n      const buffer = MMC_Gimbal_Z30Pro.NR_mode_ctrl(value);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_ele_mode(value) {\r\n      const buffer = MMC_Gimbal_Z30Pro.DZOOM_mode_ctrl(value);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_video_mode(value) {\r\n      let buffer = MMC_Gimbal_Z30Pro.videooutput_mode_ctrl(value);\r\n      this.commit_directive(buffer);\r\n      buffer = [165, 79, 14, 85, 170, 220, 9, 255, 129, 1, 4, 25, 3, 255, 151, 254];\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_night_mode(value) {\r\n      const buffer = MMC_Gimbal_Z30Pro.ICR_mode_ctrl(value);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_white_mode(value) {\r\n      const buffer = MMC_Gimbal_Z30Pro.WB_mode_ctrl(value);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_saturated(value) {\r\n      const buffer = MMC_Gimbal_Z30Pro.saturated(this.zoom + value);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_zoom(value) {\r\n      const buffer = MMC_Gimbal_Z30Pro.zoom(this.zoom + value);\r\n      this.commit_directive(buffer);\r\n      // buffer = MMC_Gimbal_Z30Pro.zoom((this.zoom = 1));\r\n      // this.commit_directive(buffer);\r\n    },\r\n    handle_change_pitch(num) {\r\n      this.pitch = num;\r\n      const buffer = MMC_Gimbal_Z30Pro.change_pitch_angle(this.pitch);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_yaw() {\r\n      const buffer = MMC_Gimbal_Z30Pro.change_yaw_angle(this.yaw);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_camera_mode(value) {\r\n      const buffer = MMC_Gimbal_Z30Pro.camera_mode_ctrl(value);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_change_fog_mode(mode) {\r\n      const buffer = MMC_Gimbal_Z30Pro.camera_Defog_ctrl(mode);\r\n      this.commit_directive(buffer);\r\n    },\r\n    handle_take_photo() {\r\n      // let { position } = this;\r\n      // let buffer = MMC_Gimbal_Z30Pro.take_photo(position || {});\r\n      const streamData = {\r\n        data: {\r\n          data: {\r\n            videoID: 1\r\n          }\r\n        },\r\n        type: 528\r\n      };\r\n      if (this.stream == \'QingLiu\') {\r\n        streamData.data.messageID = 1016;\r\n      } else {\r\n        streamData.data.messageID = 1007;\r\n      }\r\n      this.$emit(\'take_photo\', streamData);\r\n      // this.commit_directive(buffer);\r\n    },\r\n    handle_record() {\r\n      // if(!this.taskId  || this.taskId == "") return this.$message.error("暂无任务！")\r\n      this.record = !this.record;\r\n      const streamData = {\r\n        data: {\r\n          data: {\r\n            videoID: 1\r\n            // recordControl: this.record\r\n          }\r\n        },\r\n        type: 528\r\n      };\r\n      if (this.stream == \'QingLiu\') {\r\n        streamData.data.messageID = 1017;\r\n        streamData.data.data.status = this.record;\r\n      } else {\r\n        streamData.data.messageID = 1006;\r\n        streamData.data.data.recordControl = this.record;\r\n      }\r\n      this.$emit(\'record\', streamData);\r\n\r\n      // let buffer = MMC_Gimbal_Z30Pro.record(this.record);\r\n      // this.commit_directive(buffer);\r\n    },\r\n    commit_directive(buffer) {\r\n      this.$emit(\'directive\', buffer);\r\n    },\r\n    onChangeType(val) {\r\n      const buffer = MMC_Gimbal_Z30Pro.gimbal_mode_ctrl(val);\r\n      this.commit_directive(buffer);\r\n    },\r\n    fangxiang(type) {\r\n      let buffer = null;\r\n      switch (type) {\r\n        case \'up\':\r\n          console.log(this.control_speed);\r\n          buffer = MMC_Gimbal_Z30Pro.gimbal_pitch_ctrl(1);\r\n          this.commit_directive(buffer);\r\n          break;\r\n        case \'right\':\r\n          buffer = MMC_Gimbal_Z30Pro.gimbal_yaw_ctrl(1);\r\n          this.commit_directive(buffer);\r\n          break;\r\n        case \'left\':\r\n          buffer = MMC_Gimbal_Z30Pro.gimbal_yaw_ctrl(-1);\r\n          this.commit_directive(buffer);\r\n          break;\r\n        case \'down\':\r\n          buffer = MMC_Gimbal_Z30Pro.gimbal_pitch_ctrl(-1);\r\n          this.commit_directive(buffer);\r\n      }\r\n      // this.timer = setTimeout(() => {\r\n      //   clearTimeout(this.timer);\r\n      //   buffer = MMC_Gimbal_Z30Pro.gimbal_pitch_ctrl(0, this.control_speed);\r\n      //   this.commit_directive(buffer);\r\n      //   buffer = MMC_Gimbal_Z30Pro.gimbal_yaw_ctrl(0, this.control_speed);\r\n      //   this.commit_directive(buffer);\r\n      // }, 2000);\r\n    },\r\n    stopfxFn() {\r\n      let buffer = null;\r\n      buffer = MMC_Gimbal_Z30Pro.gimbal_pitch_ctrl(0, this.control_speed);\r\n      this.commit_directive(buffer);\r\n      buffer = MMC_Gimbal_Z30Pro.gimbal_yaw_ctrl(0, this.control_speed);\r\n      this.commit_directive(buffer);\r\n    },\r\n    init_rocker() {\r\n      let buffer = null;\r\n      joystick({\r\n        // zone: this.$refs["rocker"],\r\n        // mode: "static",\r\n        // position: { left: "50%", top: "50%" },\r\n        // color: "#9bacbe",\r\n        onstart: (type) => {\r\n          switch (type) {\r\n            case \'up\':\r\n              console.log(this.control_speed);\r\n              buffer = MMC_Gimbal_Z30Pro.gimbal_pitch_ctrl(1, this.control_speed);\r\n              this.commit_directive(buffer);\r\n              break;\r\n            case \'right\':\r\n              buffer = MMC_Gimbal_Z30Pro.gimbal_yaw_ctrl(1, this.control_speed);\r\n              this.commit_directive(buffer);\r\n              break;\r\n            case \'left\':\r\n              buffer = MMC_Gimbal_Z30Pro.gimbal_yaw_ctrl(-1, this.control_speed);\r\n              this.commit_directive(buffer);\r\n              break;\r\n            case \'down\':\r\n              buffer = MMC_Gimbal_Z30Pro.gimbal_pitch_ctrl(-1, this.control_speed);\r\n              this.commit_directive(buffer);\r\n          }\r\n        },\r\n        onend: () => {\r\n          buffer = MMC_Gimbal_Z30Pro.gimbal_pitch_ctrl(0, this.control_speed);\r\n          this.commit_directive(buffer);\r\n          buffer = MMC_Gimbal_Z30Pro.gimbal_yaw_ctrl(0, this.control_speed);\r\n          this.commit_directive(buffer);\r\n        }\r\n      });\r\n    }\r\n  }\r\n};\r\n<\/script>\r\n\r\n<style lang="scss" scoped>\r\n.cpt-MMC_Gimbal_Z30Pro {\r\n  position: absolute;\r\n  // top: -138px;\r\n  right: 0;\r\n  background: rgba(0, 23, 79, 0.7);\r\n  box-shadow: 0 2px 4px 0 rgba(1, 162, 255, 0.35), inset 0 0 40px 0 rgba(0, 184, 255, 0.5);\r\n  border-radius: 10px;\r\n  width: 470px;\r\n  height: 290px;\r\n\r\n  box-sizing: border-box;\r\n\r\n  .hd {\r\n    height: 32px;\r\n    display: flex;\r\n    justify-content: space-between;\r\n    align-items: center;\r\n    background: rgba(16, 65, 215, 0.2);\r\n    box-shadow: inset 0 0 15px 0 rgba(0, 182, 255, 0.6);\r\n    border-radius: 10px 10px 0 0;\r\n\r\n    .left {\r\n      display: flex;\r\n      align-items: center;\r\n      .title {\r\n        font-size: 20px;\r\n        font-family: YouSheBiaoTiHei;\r\n        color: #14faff;\r\n        line-height: 26px;\r\n        text-shadow: 0px 1px 1px rgba(2, 32, 56, 0.2);\r\n        background: linear-gradient(\r\n          135deg,\r\n          #e3aa77 0%,\r\n          #f5cda9 38%,\r\n          #f9ecd3 58%,\r\n          #fcdbb1 79%,\r\n          #edb07a 100%\r\n        );\r\n        -webkit-background-clip: text;\r\n        -webkit-text-fill-color: transparent;\r\n      }\r\n    }\r\n\r\n    .close {\r\n      font-size: 14px;\r\n      font-family: MicrosoftYaHei;\r\n      color: #d2dfff;\r\n      margin-right: 8px;\r\n      cursor: pointer;\r\n    }\r\n  }\r\n\r\n  .bd {\r\n    padding: 10px 20px;\r\n    display: flex;\r\n    justify-content: space-between;\r\n    overflow-y: auto;\r\n    height: 230px;\r\n    overflow-x: hidden;\r\n\r\n    .form-wrap {\r\n      // flex-shrink: 0;\r\n\r\n      .form-item {\r\n        display: flex;\r\n        align-items: center;\r\n        height: 40px;\r\n\r\n        .label-box {\r\n          text-align: right;\r\n          white-space: nowrap;\r\n          color: #cbd0eb;\r\n          width: 75px;\r\n        }\r\n\r\n        .btn-default {\r\n          padding: 0 10px !important;\r\n          background: #2aefed;\r\n          border-color: #2aefed;\r\n        }\r\n\r\n        .input-box {\r\n          margin-left: 15px;\r\n          display: flex;\r\n          align-items: center;\r\n          .mono {\r\n            display: flex;\r\n            flex-direction: column;\r\n            .mono-long {\r\n              display: flex;\r\n              justify-content: space-between;\r\n              width: 168px;\r\n              height: 17px;\r\n              background: url(\'../assets/images/mount_long.png\') no-repeat;\r\n              background-size: 100%;\r\n              margin-bottom: 5px;\r\n              .mono_box {\r\n                width: 28px;\r\n                height: 13px;\r\n                border-radius: 3px;\r\n                margin-top: 2px;\r\n                cursor: pointer;\r\n              }\r\n              .active {\r\n                background: url(\'../assets/images/mount/mount_control.png\') no-repeat !important;\r\n                background-size: 100% 100%;\r\n              }\r\n            }\r\n            .text {\r\n              font-size: 14px;\r\n              font-family: MicrosoftYaHei;\r\n              color: #ffffff;\r\n              display: flex;\r\n              justify-content: space-between;\r\n              font-size: 14px;\r\n            }\r\n          }\r\n        }\r\n      }\r\n    }\r\n\r\n    .rocker-wrap {\r\n      position: absolute;\r\n      right: 30px;\r\n      // flex: 1;\r\n\r\n      .item-group {\r\n        display: flex;\r\n        justify-content: space-evenly;\r\n\r\n        .item-box {\r\n          .icon-box {\r\n            width: 32px;\r\n            height: 32px;\r\n            background: #004fff;\r\n            border-radius: 32px;\r\n            display: flex;\r\n            align-items: center;\r\n            justify-content: center;\r\n\r\n            .iconfont {\r\n              font-size: 24px;\r\n              color: #dce9ff;\r\n              cursor: pointer;\r\n            }\r\n          }\r\n        }\r\n      }\r\n\r\n      .rocker {\r\n        // margin: 10px auto 0;\r\n        width: 150px;\r\n        height: 150px;\r\n        position: relative;\r\n        margin: 0 auto;\r\n        background: center url(\'../assets/images/accident/caozuo.png\') no-repeat;\r\n        background-size: 100% 100%;\r\n\r\n        .shangUp {\r\n          position: absolute;\r\n          left: 37%;\r\n          top: 4px;\r\n          border-radius: 50%;\r\n          width: 40px;\r\n          height: 40px;\r\n          border: 0px solid red;\r\n          cursor: pointer;\r\n        }\r\n\r\n        .xaiUp {\r\n          position: absolute;\r\n          left: 37%;\r\n          bottom: 4px;\r\n          border-radius: 50%;\r\n          width: 40px;\r\n          height: 40px;\r\n          border: 0px solid red;\r\n          cursor: pointer;\r\n        }\r\n\r\n        .zuoUp {\r\n          position: absolute;\r\n          left: 4px;\r\n          top: 37%;\r\n          border-radius: 50%;\r\n          width: 40px;\r\n          height: 40px;\r\n          border: 0px solid red;\r\n          cursor: pointer;\r\n        }\r\n\r\n        .youUp {\r\n          position: absolute;\r\n          right: 4px;\r\n          top: 37%;\r\n          border-radius: 50%;\r\n          width: 40px;\r\n          height: 40px;\r\n          border: 0px solid red;\r\n          cursor: pointer;\r\n        }\r\n      }\r\n    }\r\n  }\r\n}\r\n\r\n::v-deep {\r\n  .el-select {\r\n    width: 165px;\r\n    margin-right: 5px;\r\n\r\n    .el-input {\r\n      .el-input__inner {\r\n        background: #000000;\r\n        border: 1px solid #004fff;\r\n        color: #dce9ff;\r\n      }\r\n    }\r\n  }\r\n\r\n  .el-input {\r\n    width: 165px;\r\n    margin-right: 5px;\r\n\r\n    .el-input__inner {\r\n      background: #000000;\r\n      border: 1px solid #004fff;\r\n      color: #dce9ff;\r\n    }\r\n  }\r\n\r\n  .el-radio-group {\r\n    white-space: nowrap;\r\n    .el-radio {\r\n      .el-radio__input {\r\n        &.is-checked {\r\n          .el-radio__inner {\r\n            border-color: #004fff;\r\n            background: #004fff;\r\n          }\r\n        }\r\n      }\r\n\r\n      .el-radio__label {\r\n        color: #cbd0eb;\r\n      }\r\n    }\r\n  }\r\n  .active {\r\n    background: url(\'../assets/images/mount/mount_control.png\') no-repeat !important;\r\n    // background: url("../assets/images/accident/mono_box.svg") no-repeat !important;\r\n    background-size: 100% 100%;\r\n  }\r\n  .butto {\r\n    width: 35px;\r\n    height: 25px;\r\n    font-size: 12px;\r\n    line-height: 25px;\r\n    text-align: center;\r\n    background: #004fff;\r\n    color: #000;\r\n    border-radius: 5px;\r\n  }\r\n  .el-button {\r\n    background: #2aefed;\r\n    color: #000;\r\n    border: none;\r\n  }\r\n}\r\n\r\n::v-deep .el-slider__bar {\r\n  background: #fff;\r\n}\r\n\r\n.speedC {\r\n  width: 203px;\r\n  height: 24px;\r\n  display: flex;\r\n  background: rgba(13, 34, 79, 0.65);\r\n  border: 1px solid #004fff;\r\n  border-radius: 12px;\r\n\r\n  .speed {\r\n    width: 41px;\r\n    // background: #FFFFFF;\r\n    color: #ffffff;\r\n    border-radius: 12px;\r\n    text-align: center;\r\n    line-height: 24px;\r\n  }\r\n  .pitch {\r\n    font-size: 12px;\r\n    margin-left: 12px;\r\n    width: 34px;\r\n    height: 24px;\r\n    border-radius: 12px;\r\n    text-align: center;\r\n    line-height: 24px;\r\n    color: #fff;\r\n  }\r\n}\r\n\r\n.iconfont {\r\n  color: #004fff;\r\n}\r\n\r\n// 变焦功能\r\n::v-deep .el-slider__runway {\r\n  visibility: hidden;\r\n}\r\n.heightOne {\r\n  height: 298px !important;\r\n}\r\n.heightTwo {\r\n  height: 230px !important;\r\n}\r\n</style>\r\n', '.cpt-MMC_Gimbal_Z30Pro {\n  position: absolute;\n  right: 0;\n  background: rgba(0, 23, 79, 0.7);\n  box-shadow: 0 2px 4px 0 rgba(1, 162, 255, 0.35), inset 0 0 40px 0 rgba(0, 184, 255, 0.5);\n  border-radius: 10px;\n  width: 470px;\n  height: 290px;\n  box-sizing: border-box;\n}\n.cpt-MMC_Gimbal_Z30Pro .hd {\n  height: 32px;\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  background: rgba(16, 65, 215, 0.2);\n  box-shadow: inset 0 0 15px 0 rgba(0, 182, 255, 0.6);\n  border-radius: 10px 10px 0 0;\n}\n.cpt-MMC_Gimbal_Z30Pro .hd .left {\n  display: flex;\n  align-items: center;\n}\n.cpt-MMC_Gimbal_Z30Pro .hd .left .title {\n  font-size: 20px;\n  font-family: YouSheBiaoTiHei;\n  color: #14faff;\n  line-height: 26px;\n  text-shadow: 0px 1px 1px rgba(2, 32, 56, 0.2);\n  background: linear-gradient(135deg, #e3aa77 0%, #f5cda9 38%, #f9ecd3 58%, #fcdbb1 79%, #edb07a 100%);\n  -webkit-background-clip: text;\n  -webkit-text-fill-color: transparent;\n}\n.cpt-MMC_Gimbal_Z30Pro .hd .close {\n  font-size: 14px;\n  font-family: MicrosoftYaHei;\n  color: #d2dfff;\n  margin-right: 8px;\n  cursor: pointer;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd {\n  padding: 10px 20px;\n  display: flex;\n  justify-content: space-between;\n  overflow-y: auto;\n  height: 230px;\n  overflow-x: hidden;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item {\n  display: flex;\n  align-items: center;\n  height: 40px;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .label-box {\n  text-align: right;\n  white-space: nowrap;\n  color: #cbd0eb;\n  width: 75px;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .btn-default {\n  padding: 0 10px !important;\n  background: #2aefed;\n  border-color: #2aefed;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .input-box {\n  margin-left: 15px;\n  display: flex;\n  align-items: center;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .input-box .mono {\n  display: flex;\n  flex-direction: column;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .input-box .mono .mono-long {\n  display: flex;\n  justify-content: space-between;\n  width: 168px;\n  height: 17px;\n  background: url("../assets/images/mount_long.png") no-repeat;\n  background-size: 100%;\n  margin-bottom: 5px;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .input-box .mono .mono-long .mono_box {\n  width: 28px;\n  height: 13px;\n  border-radius: 3px;\n  margin-top: 2px;\n  cursor: pointer;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .input-box .mono .mono-long .active {\n  background: url("../assets/images/mount/mount_control.png") no-repeat !important;\n  background-size: 100% 100%;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .form-wrap .form-item .input-box .mono .text {\n  font-size: 14px;\n  font-family: MicrosoftYaHei;\n  color: #ffffff;\n  display: flex;\n  justify-content: space-between;\n  font-size: 14px;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap {\n  position: absolute;\n  right: 30px;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .item-group {\n  display: flex;\n  justify-content: space-evenly;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .item-group .item-box .icon-box {\n  width: 32px;\n  height: 32px;\n  background: #004fff;\n  border-radius: 32px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .item-group .item-box .icon-box .iconfont {\n  font-size: 24px;\n  color: #dce9ff;\n  cursor: pointer;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .rocker {\n  width: 150px;\n  height: 150px;\n  position: relative;\n  margin: 0 auto;\n  background: center url("../assets/images/accident/caozuo.png") no-repeat;\n  background-size: 100% 100%;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .rocker .shangUp {\n  position: absolute;\n  left: 37%;\n  top: 4px;\n  border-radius: 50%;\n  width: 40px;\n  height: 40px;\n  border: 0px solid red;\n  cursor: pointer;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .rocker .xaiUp {\n  position: absolute;\n  left: 37%;\n  bottom: 4px;\n  border-radius: 50%;\n  width: 40px;\n  height: 40px;\n  border: 0px solid red;\n  cursor: pointer;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .rocker .zuoUp {\n  position: absolute;\n  left: 4px;\n  top: 37%;\n  border-radius: 50%;\n  width: 40px;\n  height: 40px;\n  border: 0px solid red;\n  cursor: pointer;\n}\n.cpt-MMC_Gimbal_Z30Pro .bd .rocker-wrap .rocker .youUp {\n  position: absolute;\n  right: 4px;\n  top: 37%;\n  border-radius: 50%;\n  width: 40px;\n  height: 40px;\n  border: 0px solid red;\n  cursor: pointer;\n}\n\n::v-deep .el-select {\n  width: 165px;\n  margin-right: 5px;\n}\n::v-deep .el-select .el-input .el-input__inner {\n  background: #000000;\n  border: 1px solid #004fff;\n  color: #dce9ff;\n}\n::v-deep .el-input {\n  width: 165px;\n  margin-right: 5px;\n}\n::v-deep .el-input .el-input__inner {\n  background: #000000;\n  border: 1px solid #004fff;\n  color: #dce9ff;\n}\n::v-deep .el-radio-group {\n  white-space: nowrap;\n}\n::v-deep .el-radio-group .el-radio .el-radio__input.is-checked .el-radio__inner {\n  border-color: #004fff;\n  background: #004fff;\n}\n::v-deep .el-radio-group .el-radio .el-radio__label {\n  color: #cbd0eb;\n}\n::v-deep .active {\n  background: url("../assets/images/mount/mount_control.png") no-repeat !important;\n  background-size: 100% 100%;\n}\n::v-deep .butto {\n  width: 35px;\n  height: 25px;\n  font-size: 12px;\n  line-height: 25px;\n  text-align: center;\n  background: #004fff;\n  color: #000;\n  border-radius: 5px;\n}\n::v-deep .el-button {\n  background: #2aefed;\n  color: #000;\n  border: none;\n}\n\n::v-deep .el-slider__bar {\n  background: #fff;\n}\n\n.speedC {\n  width: 203px;\n  height: 24px;\n  display: flex;\n  background: rgba(13, 34, 79, 0.65);\n  border: 1px solid #004fff;\n  border-radius: 12px;\n}\n.speedC .speed {\n  width: 41px;\n  color: #ffffff;\n  border-radius: 12px;\n  text-align: center;\n  line-height: 24px;\n}\n.speedC .pitch {\n  font-size: 12px;\n  margin-left: 12px;\n  width: 34px;\n  height: 24px;\n  border-radius: 12px;\n  text-align: center;\n  line-height: 24px;\n  color: #fff;\n}\n\n.iconfont {\n  color: #004fff;\n}\n\n::v-deep .el-slider__runway {\n  visibility: hidden;\n}\n\n.heightOne {\n  height: 298px !important;\n}\n\n.heightTwo {\n  height: 230px !important;\n}\n\n/*# sourceMappingURL=index.vue.map */']
    },
    media: void 0
  });
}, l, "data-v-579bee40", false, undefined, !1, d);
export { m as default };
