"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.VehicleSpeed = exports.VehicleRing = exports.VehicleDrive = exports.TimeInfo = exports.StatusInfo = exports.LocationInfo = void 0;

var _react = _interopRequireDefault(require("react"));

var _propTypes = _interopRequireDefault(require("prop-types"));

var _useSettings8 = _interopRequireDefault(require("../vm-hooks/useSettings"));

var _antd = require("antd");

var _vehicleTime = _interopRequireDefault(require("../../image/vehicle-time.png"));

var _vehicleTimeDark = _interopRequireDefault(require("../../image/vehicle-time-dark.png"));

var _vehicleLoc = _interopRequireDefault(require("../../image/vehicle-loc.png"));

var _vehicleLocDark = _interopRequireDefault(require("../../image/vehicle-loc-dark.png"));

var _vehicleStatus = _interopRequireDefault(require("../../image/vehicle-status.png"));

var _vehicleStatusDark = _interopRequireDefault(require("../../image/vehicle-status-dark.png"));

var _vehicleRingDark = _interopRequireDefault(require("../../image/vehicle-ring-dark.png"));

var _vehicleRing = _interopRequireDefault(require("../../image/vehicle-ring.png"));

var _vehicle = _interopRequireDefault(require("../../image/vehicle.gif"));

var _vehicleSpeed = _interopRequireDefault(require("../../image/vehicle-speed.png"));

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }

// import VMChart from '../vm-chart';
var TimeInfo = function TimeInfo(props) {
  var _useSettings = (0, _useSettings8["default"])(),
      isDark = _useSettings.isDark,
      theme = _useSettings.theme;

  var value = props.value;
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "real-time-info ".concat(theme)
  }, /*#__PURE__*/_react["default"].createElement("img", {
    src: isDark ? _vehicleTimeDark["default"] : _vehicleTime["default"],
    alt: ""
  }), /*#__PURE__*/_react["default"].createElement("span", null, value));
};

exports.TimeInfo = TimeInfo;
TimeInfo.propTypes = {
  value: _propTypes["default"].string
};

var LocationInfo = function LocationInfo(props) {
  var _useSettings2 = (0, _useSettings8["default"])(),
      isDark = _useSettings2.isDark,
      theme = _useSettings2.theme;

  var value = props.value;
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "real-time-info ".concat(theme)
  }, /*#__PURE__*/_react["default"].createElement("img", {
    src: isDark ? _vehicleLocDark["default"] : _vehicleLoc["default"],
    alt: ""
  }), /*#__PURE__*/_react["default"].createElement("span", null, value));
};

exports.LocationInfo = LocationInfo;
LocationInfo.propTypes = {
  value: _propTypes["default"].string
};

var StatusInfo = function StatusInfo(props) {
  var _useSettings3 = (0, _useSettings8["default"])(),
      isDark = _useSettings3.isDark,
      theme = _useSettings3.theme;

  var value = props.value;
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "real-time-status ".concat(theme)
  }, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("img", {
    src: isDark ? _vehicleStatusDark["default"] : _vehicleStatus["default"],
    alt: ""
  }), /*#__PURE__*/_react["default"].createElement("span", null, value)));
};

exports.StatusInfo = StatusInfo;

var VehicleRing = function VehicleRing() {
  var _useSettings4 = (0, _useSettings8["default"])(),
      isDark = _useSettings4.isDark,
      theme = _useSettings4.theme;

  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "real-time-vehicle ".concat(theme)
  }, /*#__PURE__*/_react["default"].createElement("img", {
    className: "vehicle",
    src: _vehicle["default"],
    alt: ""
  }), /*#__PURE__*/_react["default"].createElement("img", {
    className: "ring",
    src: isDark ? _vehicleRingDark["default"] : _vehicleRing["default"],
    alt: ""
  }));
};

exports.VehicleRing = VehicleRing;
StatusInfo.propTypes = {
  value: _propTypes["default"].string
};

var VehicleDrive = function VehicleDrive(props) {
  var _useSettings5 = (0, _useSettings8["default"])(),
      theme = _useSettings5.theme;

  var work = props.work,
      percent = props.percent,
      drive = props.drive,
      showWork = props.showWork;
  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "real-drive"
  }, /*#__PURE__*/_react["default"].createElement(_antd.Progress, {
    type: "circle",
    percent: percent || 0,
    width: 64,
    strokeWidth: 10,
    strokeColor: {
      from: '#2fe7ee',
      to: '#1fffa4'
    },
    className: "real-time-progress ".concat(theme)
  }), /*#__PURE__*/_react["default"].createElement(InfoItem, {
    label: "\u4ECA\u65E5\u884C\u9A76",
    value: drive,
    unit: "km"
  }), showWork && /*#__PURE__*/_react["default"].createElement(InfoItem, {
    label: "\u4ECA\u65E5\u4F5C\u4E1A",
    value: work || 0,
    unit: "km"
  }));
};

exports.VehicleDrive = VehicleDrive;
VehicleDrive.propTypes = {
  work: _propTypes["default"].number,
  showWork: _propTypes["default"].bool,
  percent: _propTypes["default"].number,
  drive: _propTypes["default"].number
};

var VehicleSpeed = function VehicleSpeed(props) {
  var _useSettings6 = (0, _useSettings8["default"])(),
      theme = _useSettings6.theme;

  var value = props.value; // const option = {
  //     series: [
  //         {
  //             type: 'gauge',
  //             startAngle: 180,
  //             endAngle: 0,
  //             min: 0,
  //             max: 240,
  //             splitNumber: 8,
  //             itemStyle: {
  //                 color: '#58D9F9',
  //                 shadowColor: 'rgba(0,138,255,0.45)',
  //                 shadowBlur: 4,
  //                 shadowOffsetX: 0,
  //                 shadowOffsetY: 0,
  //             },
  //             progress: {
  //                 show: true,
  //                 roundCap: true,
  //                 width: 4,
  //             },
  //             pointer: {
  //                 icon:
  //                     'path://M2090.36389,615.30999 L2090.36389,615.30999 C2091.48372,615.30999 2092.40383,616.194028 2092.44859,617.312956 L2096.90698,728.755929 C2097.05155,732.369577 2094.2393,735.416212 2090.62566,735.56078 C2090.53845,735.564269 2090.45117,735.566014 2090.36389,735.566014 L2090.36389,735.566014 C2086.74736,735.566014 2083.81557,732.63423 2083.81557,729.017692 C2083.81557,728.930412 2083.81732,728.84314 2083.82081,728.755929 L2088.2792,617.312956 C2088.32396,616.194028 2089.24407,615.30999 2090.36389,615.30999 Z',
  //                 length: '75%',
  //                 width: 4,
  //                 offsetCenter: [0, '5%'],
  //             },
  //             axisLine: {
  //                 roundCap: true,
  //                 lineStyle: {
  //                     width: 4,
  //                 },
  //             },
  //             axisTick: {
  //                 splitNumber: 2,
  //                 lineStyle: {
  //                     width: 1,
  //                     color: '#999',
  //                 },
  //             },
  //             splitLine: {
  //                 length: 8,
  //                 lineStyle: {
  //                     width: 2,
  //                     color: '#999',
  //                 },
  //             },
  //             axisLabel: {
  //                 show: false,
  //             },
  //             detail: {
  //                 show: false,
  //             },
  //             data: [
  //                 {
  //                     value: 100,
  //                 },
  //             ],
  //         },
  //     ],
  // };

  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "real-speed ".concat(theme)
  }, /*#__PURE__*/_react["default"].createElement("img", {
    className: "img",
    src: _vehicleSpeed["default"],
    alt: ""
  }), /*#__PURE__*/_react["default"].createElement(InfoItem, {
    label: "\u5F53\u524D\u901F\u5EA6",
    value: value,
    unit: "km/h"
  }));
};

exports.VehicleSpeed = VehicleSpeed;
VehicleSpeed.propTypes = {
  value: _propTypes["default"].number
};

var InfoItem = function InfoItem(props) {
  var value = props.value,
      label = props.label,
      unit = props.unit;

  var _useSettings7 = (0, _useSettings8["default"])(),
      theme = _useSettings7.theme;

  return /*#__PURE__*/_react["default"].createElement("div", {
    className: "real-info-item ".concat(theme)
  }, /*#__PURE__*/_react["default"].createElement("span", {
    className: "label"
  }, label), /*#__PURE__*/_react["default"].createElement("span", {
    className: "value"
  }, /*#__PURE__*/_react["default"].createElement("span", {
    className: "number"
  }, value || 0), /*#__PURE__*/_react["default"].createElement("span", {
    className: "unit"
  }, unit)));
};

InfoItem.propTypes = {
  value: _propTypes["default"].number,
  label: _propTypes["default"].string,
  unit: _propTypes["default"].string
};
//# sourceMappingURL=element.js.map
