@vtx/modals2 2.5.0

package/lib/vtx-df-modal/components/BaseInfo/index.css

@@ -0,0 +1,306 @@
+.left-width {
+  width: 370px;
+}
+.df-baseContent {
+  padding: 10px;
+  height: 100%;
+}
+.df-baseContent .base-top-desc {
+  color: var(--info-danger);
+  height: 44px;
+}
+.df-baseContent .base-top-img {
+  padding: 10px 12px;
+  height: 288px;
+  background-color: var(--bg-color2);
+}
+.df-baseContent .base-top-img img {
+  width: 100%;
+}
+.df-baseContent .base-top--base {
+  height: 288px;
+  padding: 10px 12px;
+  background-color: var(--bg-color2);
+}
+.df-baseContent .base-top--jcqsfx {
+  height: 288px;
+  padding: 10px 12px;
+  background-color: var(--bg-color2);
+}
+.df-baseContent .base-top--jcqsfx-head {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+      -ms-flex-pack: justify;
+          justify-content: space-between;
+}
+.df-baseContent .base-top--chart {
+  height: 260px;
+  width: 100%;
+}
+.df-baseContent .base-bottom {
+  margin-top: 10px;
+}
+.df-baseContent .base-bottom--left {
+  padding: 10px 12px;
+  background-color: var(--bg-color2);
+}
+.df-baseContent .base-bottom--right {
+  height: 362px;
+  padding: 10px 12px;
+  background-color: var(--bg-color2);
+}
+.df-baseContent .base-bottom--right-desc {
+  color: var(--title-color);
+  height: 50px;
+  text-align: center;
+}
+.df-baseContent .base-bottom--right-desc span {
+  color: var(--info-danger);
+}
+.df-baseContent .base-bottom--right-content {
+  width: 100%;
+  height: 300px;
+  text-align: center;
+  overflow-y: auto;
+}
+.df-baseContent .df-situation {
+  height: 306px;
+  overflow-y: auto;
+  --img-text-color: #fff;
+}
+.df-baseContent .df-situation.light {
+  --img-text-color: #1890ff;
+}
+.df-baseContent .df-situation .df-situation-item {
+  width: 316px;
+  height: 65px;
+  margin-bottom: 9px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+      -ms-flex-pack: justify;
+          justify-content: space-between;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  padding-right: 14px;
+}
+.df-baseContent .df-situation .df-situation-item-name {
+  line-height: 65px;
+  margin-left: 71px;
+  color: var(--img-text-color);
+}
+.df-baseContent .df-situation .df-situation-item-value {
+  font-size: 14px;
+  color: var(--img-text-color);
+}
+.df-baseContent .df-situation .df-situation-item-value span {
+  font-size: 20px;
+  font-family: D-DINExp-Bold, D-DINExp;
+  font-weight: bold;
+}
+.df-baseContent .df-situation-item1 {
+  width: 316px;
+  height: 65px;
+  margin-bottom: 9px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+      -ms-flex-pack: justify;
+          justify-content: space-between;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  padding-right: 14px;
+  background-image: url('../../imgs/jcl.png');
+}
+.df-baseContent .df-situation-item1-name {
+  line-height: 65px;
+  margin-left: 71px;
+  color: var(--img-text-color);
+}
+.df-baseContent .df-situation-item1-value {
+  font-size: 14px;
+  color: var(--img-text-color);
+}
+.df-baseContent .df-situation-item1-value span {
+  font-size: 20px;
+  font-family: D-DINExp-Bold, D-DINExp;
+  font-weight: bold;
+}
+.df-baseContent .df-situation-item1.light {
+  background-image: url('../../imgs/jcl_light.png');
+}
+.df-baseContent .df-situation-item2 {
+  width: 316px;
+  height: 65px;
+  margin-bottom: 9px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+      -ms-flex-pack: justify;
+          justify-content: space-between;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  padding-right: 14px;
+  background-image: url('../../imgs/jccc.png');
+}
+.df-baseContent .df-situation-item2-name {
+  line-height: 65px;
+  margin-left: 71px;
+  color: var(--img-text-color);
+}
+.df-baseContent .df-situation-item2-value {
+  font-size: 14px;
+  color: var(--img-text-color);
+}
+.df-baseContent .df-situation-item2-value span {
+  font-size: 20px;
+  font-family: D-DINExp-Bold, D-DINExp;
+  font-weight: bold;
+}
+.df-baseContent .df-situation-item2.light {
+  background-image: url('../../imgs/jccc_light.png');
+}
+.df-baseContent .df-situation-item3 {
+  width: 316px;
+  height: 65px;
+  margin-bottom: 9px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+      -ms-flex-pack: justify;
+          justify-content: space-between;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  padding-right: 14px;
+  background-image: url('../../imgs/jcbj.png');
+}
+.df-baseContent .df-situation-item3-name {
+  line-height: 65px;
+  margin-left: 71px;
+  color: var(--img-text-color);
+}
+.df-baseContent .df-situation-item3-value {
+  font-size: 14px;
+  color: var(--img-text-color);
+}
+.df-baseContent .df-situation-item3-value span {
+  font-size: 20px;
+  font-family: D-DINExp-Bold, D-DINExp;
+  font-weight: bold;
+}
+.df-baseContent .df-situation-item3.light {
+  background-image: url('../../imgs/jcbj_light.png');
+}
+.df-baseContent .df-situation-item4 {
+  width: 316px;
+  height: 65px;
+  margin-bottom: 9px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: justify;
+      -ms-flex-pack: justify;
+          justify-content: space-between;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  background-repeat: no-repeat;
+  background-size: 100% 100%;
+  padding-right: 14px;
+  background-image: url('../../imgs/zbbj.png');
+}
+.df-baseContent .df-situation-item4-name {
+  line-height: 65px;
+  margin-left: 71px;
+  color: var(--img-text-color);
+}
+.df-baseContent .df-situation-item4-value {
+  font-size: 14px;
+  color: var(--img-text-color);
+}
+.df-baseContent .df-situation-item4-value span {
+  font-size: 20px;
+  font-family: D-DINExp-Bold, D-DINExp;
+  font-weight: bold;
+}
+.df-baseContent .df-situation-item4.light {
+  background-image: url('../../imgs/zbbj_light.png');
+}
+.df-baseContent .df-monitor-head {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -ms-flex-pack: distribute;
+      justify-content: space-around;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+}
+.df-baseContent .df-monitor-head-item {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: start;
+      -ms-flex-pack: start;
+          justify-content: start;
+  -webkit-box-align: start;
+      -ms-flex-align: start;
+          align-items: start;
+  cursor: pointer;
+}
+.df-baseContent .df-monitor-head-item.active {
+  padding: 8px 12px;
+  background-color: var(--block-bg-color);
+}
+.df-baseContent .df-monitor-head-item img {
+  width: 40px;
+  height: 40px;
+  margin-right: 15px;
+  display: inline-block;
+}
+.df-baseContent .df-monitor-head-item-right-name {
+  color: var(--title-color);
+  font-size: 12px;
+}
+.df-baseContent .df-monitor-head-item-right-valueNormal {
+  color: var(--info-active);
+  line-height: 22px;
+}
+.df-baseContent .df-monitor-head-item-right-valueNormal span {
+  font-size: 20px;
+}
+.df-baseContent .df-monitor-head-item-right-valueAlarm {
+  color: var(--info-danger);
+  line-height: 22px;
+}
+.df-baseContent .df-monitor-head-item-right-valueAlarm_active {
+  color: var(--button-checked-color);
+  line-height: 22px;
+}
+.df-baseContent .df-monitor-head-item-right-valueAlarm_active span {
+  font-size: 20px;
+}
+.df-baseContent .df-monitor-head-item-right-valueAlarm span {
+  font-size: 20px;
+}
+.df-baseContent .df-monitor-table {
+  margin-top: 18px;
+}

package/lib/vtx-df-modal/components/BaseInfo/index.js

@@ -0,0 +1,139 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _ahooks = require("ahooks");
+var _moment = _interopRequireDefault(require("moment"));
+var _components = require("@vtx/components");
+var _antd = require("antd");
+var _vmInfoCollection = _interopRequireDefault(require("../../../vm-info-collection"));
+var _vmNodata = _interopRequireDefault(require("../../../vm-nodata"));
+var _vmSubTitle = _interopRequireDefault(require("../../../vm-sub-title"));
+var _Jcqsfx = _interopRequireDefault(require("./Jcqsfx"));
+var _Situation = _interopRequireDefault(require("./Situation"));
+var _AlarmDetail = _interopRequireDefault(require("./AlarmDetail"));
+var _api = require("../../api");
+var _RealtimeMonitor = _interopRequireDefault(require("./RealtimeMonitor"));
+require("./index.less");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+var BaseInfo = function BaseInfo(props) {
+  var baseInfo = props.baseInfo,
+    photos = props.photos,
+    code = props.code;
+  var nowDate = (0, _moment["default"])().format('YYYY-MM-DD');
+  var _useSetState = (0, _ahooks.useSetState)({
+      startDate: (0, _moment["default"])().startOf('M').format('YYYY-MM-DD'),
+      endDate: nowDate
+    }),
+    _useSetState2 = _slicedToArray(_useSetState, 2),
+    state = _useSetState2[0],
+    setState = _useSetState2[1];
+  var startDate = state.startDate,
+    endDate = state.endDate;
+  var _BaseService$useSitua = _api.BaseService.useSituationAlarm(code, nowDate, nowDate),
+    situationAlarmRes = _BaseService$useSitua.situationAlarmRes;
+  var _BaseService$useMonit = _api.BaseService.useMonitorCarExeception(code, nowDate, situationAlarmRes),
+    execeptionCar = _BaseService$useMonit.execeptionCar;
+  var _BaseService$useMonit2 = _api.BaseService.useMonitorPointExeception(code, situationAlarmRes),
+    execeptionPoint = _BaseService$useMonit2.execeptionPoint;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "df-baseContent"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "base-top"
+  }, /*#__PURE__*/_react["default"].createElement(_antd.Row, {
+    gutter: [10, 10]
+  }, /*#__PURE__*/_react["default"].createElement(_antd.Col, {
+    xxl: 7,
+    xl: 7,
+    lg: 12,
+    md: 12
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "base-top-img"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "base-top-desc"
+  }, execeptionPoint || execeptionCar || ''), photos.length ? /*#__PURE__*/_react["default"].createElement(_components.VtxImage.PreviewGroup, null, /*#__PURE__*/_react["default"].createElement(_antd.Carousel, {
+    style: {
+      width: '315px',
+      height: '200px',
+      overflow: 'hidden'
+    }
+  }, photos.map(function (item) {
+    return /*#__PURE__*/_react["default"].createElement(_components.VtxImage, {
+      key: item.id,
+      src: "/cloudFile/common/downloadFile?id=".concat(item.id),
+      alt: item.name,
+      isDark: true,
+      style: {
+        maxHeight: '200px',
+        overflow: 'hidden'
+      }
+    });
+  }))) : /*#__PURE__*/_react["default"].createElement(_vmNodata["default"], {
+    style: {
+      height: '80%'
+    }
+  }))), /*#__PURE__*/_react["default"].createElement(_antd.Col, {
+    xxl: 7,
+    xl: 7,
+    lg: 12,
+    md: 12
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "base-top--base"
+  }, /*#__PURE__*/_react["default"].createElement(_vmSubTitle["default"], {
+    title: "\u57FA\u672C\u4FE1\u606F"
+  }), /*#__PURE__*/_react["default"].createElement(_vmInfoCollection["default"], {
+    data: baseInfo
+  }))), /*#__PURE__*/_react["default"].createElement(_antd.Col, {
+    xxl: 10,
+    xl: 10,
+    lg: 24,
+    md: 24
+  }, /*#__PURE__*/_react["default"].createElement(_Jcqsfx["default"], {
+    code: code,
+    setDate: function setDate(start, end) {
+      setState({
+        startDate: start,
+        endDate: end
+      });
+    }
+  })))), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "base-bottom"
+  }, /*#__PURE__*/_react["default"].createElement(_antd.Row, {
+    gutter: [10, 10]
+  }, /*#__PURE__*/_react["default"].createElement(_antd.Col, {
+    xxl: 7,
+    xl: 7,
+    lg: 12,
+    md: 12
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "base-bottom--left"
+  }, /*#__PURE__*/_react["default"].createElement(_vmSubTitle["default"], {
+    title: "\u5B9E\u65F6\u8FD0\u884C\u60C5\u51B5"
+  }), /*#__PURE__*/_react["default"].createElement(_Situation["default"], {
+    code: code,
+    alarm: situationAlarmRes
+  }))), /*#__PURE__*/_react["default"].createElement(_antd.Col, {
+    xxl: 17,
+    xl: 17,
+    lg: 12,
+    md: 12
+  }, situationAlarmRes >= 0 ? /*#__PURE__*/_react["default"].createElement(_RealtimeMonitor["default"], {
+    code: code
+  }) : /*#__PURE__*/_react["default"].createElement(_AlarmDetail["default"], {
+    code: code,
+    startDate: startDate,
+    endDate: endDate
+  })))));
+};
+var _default = BaseInfo;
+exports["default"] = _default;
+//# sourceMappingURL=index.js.map

package/lib/vtx-df-modal/components/BaseInfo/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_ahooks","_moment","_components","_antd","_vmInfoCollection","_vmNodata","_vmSubTitle","_Jcqsfx","_Situation","_AlarmDetail","_api","_RealtimeMonitor","obj","__esModule","_slicedToArray","arr","i","_arrayWithHoles","_iterableToArrayLimit","_unsupportedIterableToArray","_nonIterableRest","TypeError","o","minLen","_arrayLikeToArray","n","Object","prototype","toString","call","slice","constructor","name","Array","from","test","len","length","arr2","_i","Symbol","iterator","_s","_e","_x","_r","_arr","_n","_d","next","done","push","value","err","isArray","BaseInfo","props","baseInfo","photos","code","nowDate","moment","format","_useSetState","useSetState","startDate","startOf","endDate","_useSetState2","state","setState","_BaseService$useSitua","BaseService","useSituationAlarm","situationAlarmRes","_BaseService$useMonit","useMonitorCarExeception","execeptionCar","_BaseService$useMonit2","useMonitorPointExeception","execeptionPoint","React","createElement","className","Row","gutter","Col","xxl","xl","lg","md","VtxImage","PreviewGroup","Carousel","style","width","height","overflow","map","item","key","id","src","concat","alt","isDark","maxHeight","NoData","SubTitle","title","Base","data","Jcqsfx","setDate","start","end","Situation","alarm","RealtimeMonitor","AlarmDetail","_default","exports"],"sources":["vtx-df-modal/components/BaseInfo/index.js"],"sourcesContent":["import React from 'react';\nimport { useSetState } from 'ahooks';\nimport moment from 'moment';\nimport { VtxImage } from '@vtx/components';\nimport { Carousel, Row, Col } from 'antd';\nimport Base from '../../../vm-info-collection';\nimport NoData from '../../../vm-nodata';\nimport SubTitle from '../../../vm-sub-title';\nimport Jcqsfx from './Jcqsfx';\nimport Situation from './Situation';\nimport AlarmDetail from './AlarmDetail';\nimport { BaseService } from '../../api';\nimport RealtimeMonitor from './RealtimeMonitor';\nimport './index.less';\nconst BaseInfo = (props) => {\n    const { baseInfo, photos, code } = props;\n    const nowDate = moment().format('YYYY-MM-DD');\n    const [state, setState] = useSetState({\n        startDate: moment()\n            .startOf('M')\n            .format('YYYY-MM-DD'),\n        endDate: nowDate,\n    });\n    const { startDate, endDate } = state;\n    const { situationAlarmRes } = BaseService.useSituationAlarm(code, nowDate, nowDate);\n    const { execeptionCar } = BaseService.useMonitorCarExeception(code, nowDate, situationAlarmRes);\n    const { execeptionPoint } = BaseService.useMonitorPointExeception(code, situationAlarmRes);\n    return (React.createElement(\"div\", { className: \"df-baseContent\" },\n        React.createElement(\"div\", { className: \"base-top\" },\n            React.createElement(Row, { gutter: [10, 10] },\n                React.createElement(Col, { xxl: 7, xl: 7, lg: 12, md: 12 },\n                    React.createElement(\"div\", { className: \"base-top-img\" },\n                        React.createElement(\"div\", { className: \"base-top-desc\" }, execeptionPoint || execeptionCar || ''),\n                        photos.length ? (React.createElement(VtxImage.PreviewGroup, null,\n                            React.createElement(Carousel, { style: {\n                                    width: '315px',\n                                    height: '200px',\n                                    overflow: 'hidden',\n                                } }, photos.map((item) => {\n                                return (React.createElement(VtxImage, { key: item.id, src: `/cloudFile/common/downloadFile?id=${item.id}`, alt: item.name, isDark: true, style: { maxHeight: '200px', overflow: 'hidden' } }));\n                            })))) : (React.createElement(NoData, { style: { height: '80%' } })))),\n                React.createElement(Col, { xxl: 7, xl: 7, lg: 12, md: 12 },\n                    React.createElement(\"div\", { className: \"base-top--base\" },\n                        React.createElement(SubTitle, { title: \"\\u57FA\\u672C\\u4FE1\\u606F\" }),\n                        React.createElement(Base, { data: baseInfo }))),\n                React.createElement(Col, { xxl: 10, xl: 10, lg: 24, md: 24 },\n                    React.createElement(Jcqsfx, { code: code, setDate: (start, end) => {\n                            setState({\n                                startDate: start,\n                                endDate: end,\n                            });\n                        } })))),\n        React.createElement(\"div\", { className: \"base-bottom\" },\n            React.createElement(Row, { gutter: [10, 10] },\n                React.createElement(Col, { xxl: 7, xl: 7, lg: 12, md: 12 },\n                    React.createElement(\"div\", { className: \"base-bottom--left\" },\n                        React.createElement(SubTitle, { title: \"\\u5B9E\\u65F6\\u8FD0\\u884C\\u60C5\\u51B5\" }),\n                        React.createElement(Situation, { code: code, alarm: situationAlarmRes }))),\n                React.createElement(Col, { xxl: 17, xl: 17, lg: 12, md: 12 }, situationAlarmRes >= 0 ? (React.createElement(RealtimeMonitor, { code: code })) : (React.createElement(AlarmDetail, { code: code, startDate: startDate, endDate: endDate })))))));\n};\nexport default BaseInfo;\n"],"mappings":"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"}

package/lib/vtx-df-modal/components/BaseInfo/index.less

@@ -0,0 +1,191 @@
+.left-width {
+    width: 370px;
+}
+
+.df-baseContent {
+    padding: 10px;
+    height: 100%;
+
+    .base-top {
+        &-desc {
+            color: var(--info-danger);
+            height: 44px;
+        }
+
+        &-img {
+            padding: 10px 12px;
+            height: 288px;
+            background-color: var(--bg-color2);
+            img {
+                width: 100%;
+            }
+        }
+
+        &--base {
+            height: 288px;
+            padding: 10px 12px;
+            background-color: var(--bg-color2);
+        }
+        &--jcqsfx {
+            height: 288px;
+            padding: 10px 12px;
+            background-color: var(--bg-color2);
+            &-head {
+                display: flex;
+                justify-content: space-between;
+            }
+        }
+        &--chart {
+            height: 260px;
+            width: 100%;
+        }
+    }
+
+    .base-bottom {
+        margin-top: 10px;
+
+        &--left {
+            padding: 10px 12px;
+            background-color: var(--bg-color2);
+        }
+        &--right {
+            height: 362px;
+            padding: 10px 12px;
+            background-color: var(--bg-color2);
+
+            &-desc {
+                color: var(--title-color);
+                height: 50px;
+                text-align: center;
+                span {
+                    color: var(--info-danger);
+                }
+            }
+
+            &-content {
+                width: 100%;
+                height: 300px;
+                text-align: center;
+                overflow-y: auto;
+            }
+        }
+    }
+
+    .df-situation {
+        height: 306px;
+        overflow-y: auto;
+        --img-text-color: #fff;
+        &.light {
+            --img-text-color: #1890ff;
+        }
+        .df-situation-item {
+            width: 316px;
+            height: 65px;
+            margin-bottom: 9px;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            background-repeat: no-repeat;
+            background-size: 100% 100%;
+            padding-right: 14px;
+            &-name {
+                line-height: 65px;
+                margin-left: 71px;
+                color: var(--img-text-color);
+            }
+            &-value {
+                font-size: 14px;
+                color: var(--img-text-color);
+
+                span {
+                    font-size: 20px;
+                    font-family: D-DINExp-Bold, D-DINExp;
+                    font-weight: bold;
+                }
+            }
+        }
+        &-item1 {
+            .df-situation-item();
+            background-image: url('../../imgs/jcl.png');
+            &.light {
+                background-image: url('../../imgs/jcl_light.png');
+            }
+        }
+        &-item2 {
+            .df-situation-item();
+            background-image: url('../../imgs/jccc.png');
+            &.light {
+                background-image: url('../../imgs/jccc_light.png');
+            }
+        }
+        &-item3 {
+            .df-situation-item();
+            background-image: url('../../imgs/jcbj.png');
+            &.light {
+                background-image: url('../../imgs/jcbj_light.png');
+            }
+        }
+        &-item4 {
+            .df-situation-item();
+            background-image: url('../../imgs/zbbj.png');
+            &.light {
+                background-image: url('../../imgs/zbbj_light.png');
+            }
+        }
+    }
+    .df-monitor {
+        &-head {
+            display: flex;
+            justify-content: space-around;
+            align-items: center;
+
+            &-item {
+                display: flex;
+                justify-content: start;
+                align-items: start;
+                cursor: pointer;
+                &.active {
+                    padding: 8px 12px;
+                    background-color: var(--block-bg-color);
+                }
+                img {
+                    width: 40px;
+                    height: 40px;
+                    margin-right: 15px;
+                    display: inline-block;
+                }
+                &-right {
+                    &-name {
+                        color: var(--title-color);
+                        font-size: 12px;
+                    }
+                    &-valueNormal {
+                        color: var(--info-active);
+                        line-height: 22px;
+                        span {
+                            font-size: 20px;
+                        }
+                    }
+
+                    &-valueAlarm {
+                        &_active {
+                            color: var(--button-checked-color);
+                            line-height: 22px;
+                            span {
+                                font-size: 20px;
+                            }
+                        }
+                        color: var(--info-danger);
+                        line-height: 22px;
+                        span {
+                            font-size: 20px;
+                        }
+                    }
+                }
+            }
+        }
+        &-table {
+            margin-top: 18px;
+        }
+    }
+}