@vtx/modals2 2.16.3 → 2.16.4

package/lib/vtx-jzlj-car-modal/components/BaseInfo/index.css

@@ -0,0 +1,408 @@
+.vtx-business-modal-wrap {
+  --modal-content-bg: #f7f9fb;
+  --modal-border-color: #fff;
+  --head-bg: #fff;
+  --bg-color2: #fff;
+  --label-color: rgba(0, 0, 0, 0.65);
+  --base-label-color: #8C8C8C;
+  --table-head-bg: rgba(24, 144, 255, 0.1);
+  --title-color: #222;
+  --title-color2: #1677ff;
+  --tag-bg: rgba(22, 119, 255, 0.1);
+  --block-bg-color: rgba(0, 0, 0, 0.1);
+  --block-bg-color2: #1890ff;
+  --calendar-border: #ececec;
+  --calendar-thead-bg: #fff;
+  --calendar-bg: #fff;
+  --calendar-content-sigle-bg: #f3f5f8;
+  --info-danger: #fd3a15;
+  --info-warnning: #f7d93d;
+  --info-active: #222;
+  --info-active2: #52c41a;
+  --info-active3: #fff;
+  --bg-color: white;
+  --sub-bg-color: #f3f3f380;
+  --title-bg-color: white;
+  --title-border: 1px solid #dbdbdbff;
+  --title-border-color: rgba(187, 187, 187, 0.2);
+  --sub-title-color: #222;
+  --info-color: #222;
+  --border-color: '#DADADAFF';
+  --scroll-bar-bg: #c0c0c0;
+  --scroll-bar-hover-bg: #adadad;
+  --scroll-bar-track-bg: #fafafa;
+  --button-checked-color: #1890ff;
+  --button-color: #222;
+  --list-cell-active1: #222;
+  --list-cell-active2: #222;
+  --list-cell-active3: #222;
+  --calendar-date-today-bg-color: #73ffbf;
+  --calendar-date-today-hover-bg-color: linear-gradient(0deg, rgba(77, 255, 186, 0.3), transparent);
+}
+*::-webkit-scrollbar {
+  width: 0px;
+  height: 0px;
+}
+*::-webkit-scrollbar-track {
+  background: transparent;
+  border-radius: 5px;
+}
+*::-webkit-scrollbar-thumb {
+  background: transparent;
+  border-radius: 5px;
+}
+*::-webkit-scrollbar-corner {
+  background-color: transparent;
+}
+.vtx-business-modal-wrap.dark {
+  --modal-content-bg: #0b1315;
+  --modal-border-color: #69958a;
+  --head-bg: #122a2c;
+  --bg-color: linear-gradient(0deg, #081e21cc, #000c);
+  --bg-color2: #162123;
+  --sub-bg-color: #ffffff0d;
+  --title-bg-color: #1a292bff;
+  --title-border: 1px solid transparent;
+  --title-border-color: transparent;
+  --title-color: white;
+  --title-color2: #a9d5d3;
+  --sub-title-color: #00f0ff;
+  --label-color: #cafdffff;
+  --base-label-color: #cafdffff;
+  --info-color: #ffffffff;
+  --border-color: '#3C7073FF';
+  --scroll-bar-bg: #39cbc3aa;
+  --scroll-bar-hover-bg: #219fff3d;
+  --scroll-bar-track-bg: transparent;
+  --button-text-color--defalut: #c9e6e8;
+  --button-text-color--active: #ffffff;
+  --button-background-color--default: #1a5561;
+  --button-background-color--active: linear-gradient(0deg, #3195aa, #0f5160);
+  --button-checked-color: #1890ff;
+  --arrow-icon-color: #355e5f;
+  --block-bg-color: rgba(255, 255, 255, 0.1);
+  --block-bg-color2: rgba(48, 118, 114, 0.2);
+  --calendar-content-sigle-bg: rgba(243, 245, 248, 0.053);
+  --info-active: #40ffd3;
+  --info-active2: #52c41a;
+  --info-active3: #40ffd3;
+  --info-danger: #fd3a15;
+  --info-warnning: #f7d93d;
+  --table-head-bg: rgba(0, 173, 177, 0.1);
+  --timeline-active: #24f2ff;
+  --calendar-border: #35444c;
+  --calendar-thead-bg: #29373e;
+  --calendar-bg: rgba(255, 255, 255, 0.1);
+  --list-cell-active1: #fff845;
+  --list-cell-active2: #45d1ff;
+  --list-cell-active3: #20feff;
+  --calendar-date-today-bg-color: #73ffbf;
+  --calendar-date-today-hover-bg-color: linear-gradient(0deg, rgba(77, 255, 186, 0.3), transparent);
+}
+.vtx-business-modal-wrap.blue {
+  --modal-content-bg: linear-gradient(0deg, rgba(28, 94, 149, 0.8), rgba(20, 37, 57, 0.8));
+  --modal-border-color: #7295bc;
+  --head-bg: linear-gradient(90deg, #124067, #051a29);
+  --head-bg-border-color2: #3a87cb;
+  --bg-color2: rgba(0, 103, 156, 0.1);
+  --bg-border-color2: rgba(32, 102, 167, 0.5);
+  --sub-bg-color: #ffffff0d;
+  --title-border: 1px solid transparent;
+  --title-border-color: transparent;
+  --title-color: white;
+  --title-color2: #fff;
+  --sub-title-color: #64bcff;
+  --label-color: #fff;
+  --base-label-color: #fff;
+  --info-color: #74bbf4;
+  --calendar-content-sigle-bg: #1464a62e;
+  --border-color: #1464a6;
+  --scroll-bar-bg: #39cbc3aa;
+  --scroll-bar-hover-bg: #219fff3d;
+  --scroll-bar-track-bg: transparent;
+  --button-text-color--defalut: #c9e6e8;
+  --button-text-color--active: #ffffff;
+  --button-background-color--default: #1a5561;
+  --button-background-color--active: linear-gradient(0deg, #3195aa, #0f5160);
+  --button-checked-color: #1890ff;
+  --arrow-icon-color: #355e5f;
+  --block-bg-color: rgba(255, 255, 255, 0.1);
+  --block-bg-color2: #74bbf4;
+  --info-active: #40ffd3;
+  --info-active2: #52c41a;
+  --info-active3: #75ffc2;
+  --info-danger: #fd3a15;
+  --info-warnning: #f7d93d;
+  --table-head-bg: rgba(0, 173, 177, 0.1);
+  --timeline-active: #24f2ff;
+  --calendar-border: rgba(32, 102, 167, 0.5);
+  --calendar-thead-bg: rgba(255, 255, 255, 0.1);
+  --calendar-content-bg: linear-gradient(0deg, #2a55e9, #0dbafe);
+  --calendar-bg: rgba(255, 255, 255, 0.1);
+  --image-value-color: #07d4ff;
+  --image-text-color: #ffffff;
+  --list-cell-active1: #fff845;
+  --list-cell-active2: #45d1ff;
+  --list-cell-active3: #20feff;
+  --calendar-date-today-bg-color: #0090ff;
+  --calendar-date-today-hover-bg-color: linear-gradient(0deg, rgba(0, 144, 255, 0.8) 0%, rgba(0, 144, 255, 0) 100%);
+}
+.vtx-business-modal-wrap.light {
+  --title-color2: #1677ff;
+}
+.jzlj-car-subtitle {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+}
+.jzlj-car-subtitle .jzlj-car-type {
+  display: -webkit-inline-box;
+  display: -ms-inline-flexbox;
+  display: inline-flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  padding: 0 8px;
+  height: 24px;
+  line-height: 24px;
+  background: rgba(22, 119, 255, 0.05);
+  border-radius: 4px;
+  border: 1px solid #1677ff;
+  font-size: 12px;
+  color: #1677ff;
+  font-weight: normal;
+  margin-left: 8px;
+}
+.jzlj-car-subtitle .jzlj-car-type img {
+  width: 16px;
+  height: 16px;
+  margin-right: 4px;
+}
+.jzlj-car-subtitle .jzlj-car-status {
+  display: inline-block;
+  padding: 0 8px;
+  height: 24px;
+  line-height: 24px;
+  background: rgba(82, 196, 26, 0.05);
+  border-radius: 4px 4px 4px 4px;
+  border: 1px solid #52c41a;
+  font-weight: normal;
+  font-size: 12px;
+  color: #52c41a;
+  margin-left: 8px;
+}
+.jzlj-card {
+  background-color: var(--bg-color2);
+  border: 1px solid var(--title-border-color);
+  border-radius: 8px;
+}
+.jzlj-card-title {
+  height: 56px;
+  line-height: 56px;
+  padding: 0 16px;
+  border-bottom: 1px solid var(--title-border-color);
+  position: relative;
+}
+.jzlj-card-title-text {
+  font-size: 16px;
+  color: var(--title-color);
+  font-weight: 500;
+}
+.jzlj-card-title-right {
+  position: absolute;
+  right: 16px;
+  top: 50%;
+  -webkit-transform: translateY(-50%);
+      -ms-transform: translateY(-50%);
+          transform: translateY(-50%);
+}
+.jzlj-card-content {
+  padding: 16px;
+  position: relative;
+  height: calc(100% - 56px);
+  overflow-y: auto;
+}
+.vtx-ellipsis-text {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+.jzlj-car-base {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  height: 100%;
+  padding: 6px 16px 16px 16px;
+  gap: 16px;
+}
+.jzlj-car-base-left {
+  height: 700px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  gap: 16px;
+  width: 35%;
+}
+.jzlj-car-base-left-top {
+  height: 50%;
+}
+.jzlj-car-base-left-top .label {
+  color: var(--base-label-color);
+}
+.jzlj-car-base-left-top .value {
+  color: var(--info-color);
+}
+.jzlj-car-base-left-top .qrCode {
+  position: absolute;
+  right: 16px;
+  top: 16px;
+}
+.jzlj-car-base-left-bottom {
+  height: 50%;
+}
+.jzlj-car-base-left-bottom .ssxx-top {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -ms-flex-pack: distribute;
+      justify-content: space-around;
+}
+.jzlj-car-base-left-bottom .ssxx-map {
+  height: calc(100% - 74px);
+  margin-top: 16px;
+}
+.jzlj-car-base-left-bottom .ssxx-map .ol-map-container {
+  border-radius: 8px !important;
+}
+.jzlj-car-base-left-bottom .ssxx-map .ol-viewport {
+  border-radius: 8px !important;
+}
+.jzlj-car-base .num {
+  font-size: 18px;
+  color: #1677ff;
+  font-weight: 500;
+}
+.jzlj-car-base .num .unit {
+  font-size: 12px;
+  font-weight: normal;
+  margin-left: 4px;
+}
+.jzlj-car-base .name {
+  font-size: 14px;
+  color: var(--info-color);
+}
+.jzlj-car-base-right {
+  height: 700px;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  gap: 16px;
+  width: 65%;
+}
+.jzlj-car-base-right-top {
+  height: 35%;
+}
+.jzlj-car-base-right-top .yxxx {
+  height: 100%;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -ms-flex-pack: distribute;
+      justify-content: space-around;
+}
+.jzlj-car-base-right-top .yxxx .yxxx-item {
+  height: 100%;
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -ms-flex-pack: distribute;
+      justify-content: space-around;
+}
+.jzlj-car-base-right-bottom {
+  height: 75%;
+}
+.jzlj-car-base-right-bottom .yxfx-top {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -ms-flex-pack: distribute;
+      justify-content: space-around;
+  padding-bottom: 24px;
+}
+.jzlj-car-base-right-bottom .yxfx-top .pjryl {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -ms-flex-pack: distribute;
+      justify-content: space-around;
+  width: 200px;
+  height: 58px;
+  background: -webkit-gradient(linear, left top, right top, from(rgba(22, 119, 255, 0)), color-stop(50%, rgba(22, 119, 255, 0.2)), to(rgba(22, 119, 255, 0)));
+  background: linear-gradient(90deg, rgba(22, 119, 255, 0) 0%, rgba(22, 119, 255, 0.2) 50%, rgba(22, 119, 255, 0) 100%);
+}
+.jzlj-car-base-right-bottom .yxfx-top .pjrcc {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -ms-flex-pack: distribute;
+      justify-content: space-around;
+  width: 200px;
+  height: 58px;
+  background: -webkit-gradient(linear, left top, right top, from(rgba(32, 187, 112, 0)), color-stop(50%, rgba(32, 187, 112, 0.2)), to(rgba(32, 187, 112, 0)));
+  background: linear-gradient(90deg, rgba(32, 187, 112, 0) 0%, rgba(32, 187, 112, 0.2) 50%, rgba(32, 187, 112, 0) 100%);
+}
+.flex-column {
+  display: -webkit-box;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-orient: vertical;
+  -webkit-box-direction: normal;
+      -ms-flex-direction: column;
+          flex-direction: column;
+  -webkit-box-align: center;
+      -ms-flex-align: center;
+          align-items: center;
+  -ms-flex-pack: distribute;
+      justify-content: space-around;
+}

package/lib/vtx-jzlj-car-modal/components/BaseInfo/index.js

@@ -0,0 +1,58 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _useSettings2 = _interopRequireDefault(require("../../../vm-hooks/useSettings"));
+var _api = require("../../api");
+var _moment = _interopRequireDefault(require("moment"));
+require("./index.less");
+var _JBXX = _interopRequireDefault(require("./JBXX"));
+var _YXXX = _interopRequireDefault(require("./YXXX"));
+var _SSXX = _interopRequireDefault(require("./SSXX"));
+var _YXFX = _interopRequireDefault(require("./YXFX"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var BaseInfo = function BaseInfo(props) {
+  var id = props.id,
+    baseInfo = props.baseInfo,
+    _props$info = props.info,
+    info = _props$info === void 0 ? {} : _props$info;
+  var _useSettings = (0, _useSettings2["default"])(),
+    _useSettings$theme = _useSettings.theme,
+    theme = _useSettings$theme === void 0 ? 'light' : _useSettings$theme;
+  var _BaseService$useZlOth = _api.BaseService.useZlOtherInfo(id, (0, _moment["default"])().format('YYYY-MM-DD'), (0, _moment["default"])().format('YYYY-MM-DD'), window.location.origin),
+    zlOtherInfoData = _BaseService$useZlOth.zlOtherInfoData;
+  var _ref = zlOtherInfoData || {},
+    qrCode = _ref.qrCode,
+    sxzczzCount = _ref.sxzczzCount;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "jzlj-car-base ".concat(theme)
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "jzlj-car-base-left"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "jzlj-car-base-left-top jzlj-card"
+  }, /*#__PURE__*/_react["default"].createElement(_JBXX["default"], {
+    baseInfo: baseInfo,
+    qrCode: qrCode
+  })), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "jzlj-car-base-left-bottom jzlj-card"
+  }, /*#__PURE__*/_react["default"].createElement(_SSXX["default"], {
+    info: info,
+    sxzczzCount: sxzczzCount
+  }))), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "jzlj-car-base-right"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "jzlj-car-base-right-top jzlj-card"
+  }, /*#__PURE__*/_react["default"].createElement(_YXXX["default"], {
+    id: id
+  })), /*#__PURE__*/_react["default"].createElement("div", {
+    className: "jzlj-car-base-right-bottom jzlj-card"
+  }, /*#__PURE__*/_react["default"].createElement(_YXFX["default"], {
+    theme: theme,
+    id: id
+  }))));
+};
+var _default = exports["default"] = BaseInfo;
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_useSettings2","_api","_moment","_JBXX","_YXXX","_SSXX","_YXFX","e","__esModule","BaseInfo","props","id","baseInfo","_props$info","info","_useSettings","useSettings","_useSettings$theme","theme","_BaseService$useZlOth","BaseService","useZlOtherInfo","moment","format","window","location","origin","zlOtherInfoData","_ref","qrCode","sxzczzCount","React","createElement","className","concat","JBXX","SSXX","YXXX","YXFX","_default","exports"],"sources":["vtx-jzlj-car-modal/components/BaseInfo/index.js"],"sourcesContent":["import React from 'react';\nimport useSettings from '../../../vm-hooks/useSettings';\nimport { BaseService } from '../../api';\nimport moment from 'moment';\nimport './index.less';\nimport JBXX from './JBXX';\nimport YXXX from './YXXX';\nimport SSXX from './SSXX';\nimport YXFX from './YXFX';\nconst BaseInfo = (props) => {\n    const { id, baseInfo, info = {} } = props;\n    const { theme = 'light' } = useSettings();\n    const { zlOtherInfoData } = BaseService.useZlOtherInfo(id, moment().format('YYYY-MM-DD'), moment().format('YYYY-MM-DD'), window.location.origin);\n    const { qrCode, sxzczzCount } = zlOtherInfoData || {};\n    return (React.createElement(\"div\", { className: `jzlj-car-base ${theme}` },\n        React.createElement(\"div\", { className: `jzlj-car-base-left` },\n            React.createElement(\"div\", { className: \"jzlj-car-base-left-top jzlj-card\" },\n                React.createElement(JBXX, { baseInfo: baseInfo, qrCode: qrCode })),\n            React.createElement(\"div\", { className: \"jzlj-car-base-left-bottom jzlj-card\" },\n                React.createElement(SSXX, { info: info, sxzczzCount: sxzczzCount }))),\n        React.createElement(\"div\", { className: `jzlj-car-base-right` },\n            React.createElement(\"div\", { className: \"jzlj-car-base-right-top jzlj-card\" },\n                React.createElement(YXXX, { id: id })),\n            React.createElement(\"div\", { className: \"jzlj-car-base-right-bottom jzlj-card\" },\n                React.createElement(YXFX, { theme: theme, id: id })))));\n};\nexport default BaseInfo;\n"],"mappings":"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","ignoreList":[]}

package/lib/vtx-jzlj-car-modal/components/BaseInfo/index.less

@@ -0,0 +1,142 @@
+@import '../../style/index.less';
+
+.jzlj-car-base {
+    display: flex;
+    height: 100%;
+    padding: 6px 16px 16px 16px;
+    gap: 16px;
+
+    &-left {
+        height: 700px;
+        display: flex;
+        flex-direction: column;
+        gap: 16px;
+        width: 35%;
+
+        &-top {
+            height: 50%;
+
+            .label {
+                color: var(--base-label-color);
+            }
+
+            .value {
+                color: var(--info-color);
+            }
+
+            .qrCode {
+                position: absolute;
+                right: 16px;
+                top: 16px;
+            }
+        }
+
+        &-bottom {
+            height: 50%;
+
+            .ssxx-top {
+                display: flex;
+                align-items: center;
+                justify-content: space-around;
+            }
+
+            .ssxx-map {
+                height: calc(100% - 74px);
+                margin-top: 16px;
+
+                .ol-map-container {
+                    border-radius: 8px !important;
+                }
+                .ol-viewport {
+                    border-radius: 8px !important;
+                }
+            }
+        }
+    }
+
+    .num {
+        font-size: 18px;
+        color: #1677ff;
+        font-weight: 500;
+
+        .unit {
+            font-size: 12px;
+            font-weight: normal;
+            margin-left: 4px;
+        }
+    }
+
+    .name {
+        font-size: 14px;
+        color: var(--info-color);
+    }
+
+    &-right {
+        height: 700px;
+        display: flex;
+        flex-direction: column;
+        gap: 16px;
+        width: 65%;
+
+        &-top {
+            height: 35%;
+
+            .yxxx {
+                height: 100%;
+                display: flex;
+                align-items: center;
+                justify-content: space-around;
+
+                .yxxx-item {
+                    height: 100%;
+                    display: flex;
+                    flex-direction: column;
+                    align-items: center;
+                    justify-content: space-around;
+                }
+            }
+        }
+
+        &-bottom {
+            height: 75%;
+
+            .yxfx-top {
+                display: flex;
+                align-items: center;
+                justify-content: space-around;
+                padding-bottom: 24px;
+
+                .pjryl {
+                    .flex-column;
+                    width: 200px;
+                    height: 58px;
+                    background: linear-gradient(
+                        90deg,
+                        rgba(22, 119, 255, 0) 0%,
+                        rgba(22, 119, 255, 0.2) 50%,
+                        rgba(22, 119, 255, 0) 100%
+                    );
+                }
+
+                .pjrcc {
+                    .flex-column;
+                    width: 200px;
+                    height: 58px;
+                    background: linear-gradient(
+                        90deg,
+                        rgba(32, 187, 112, 0) 0%,
+                        rgba(32, 187, 112, 0.2) 50%,
+                        rgba(32, 187, 112, 0) 100%
+                    );
+                }
+            }
+        }
+    }
+}
+
+.flex-column {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: space-around;
+}