@vtx/modals2 2.15.54 → 2.15.55

package/lib/vm-table/style/index.less

@@ -0,0 +1,315 @@
+.vm-table {
+    --table-bg: white;
+    --table-header-bg-color: #ecf6ff;
+    --table-color: #222;
+    --table-head-color: #222;
+    --table-row-border: 1px solid #f0f0f0;
+    --table-row-bg-color: #fafafa;
+    --scroll-bar-hover-bg: #adadad;
+
+    &.blue {
+        --table-bg: transparent;
+        --table-header-bg-color: rgba(14, 156, 255, 0.1);
+        --table-color: white;
+        --table-head-color: #fff;
+        --table-row-border: 1px solid transparent;
+        --table-row-bg-color: rgba(106, 228, 255, 0.01);
+        --scroll-bar-hover-bg: #219fff3d;
+        --page-a-color: #fff;
+        --page-a-active-color: #0dbafe;
+        --page-a-bg: linear-gradient(0deg, #2a55e9, #0dbafe);
+        --page-border-color: #d9d9d9;
+        --page-border-active-color: #0dbafe;
+        .ant-pagination {
+            color: white;
+            .ant-pagination-item {
+                background-color: transparent;
+                border-color: rgba(255, 255, 255, 0.6);
+                > a {
+                    color: white;
+                }
+
+                &.ant-pagination-item-active,
+                &:hover {
+                    border-color: #018aff;
+                    > a {
+                        color: #018aff;
+                    }
+                }
+            }
+            .ant-select-arrow {
+                color: white;
+            }
+            .ant-pagination-total-text {
+                color: #fff;
+            }
+            .ant-pagination-item-link {
+                color: white;
+                background-color: transparent;
+                border-color: rgba(255, 255, 255, 0.4);
+                &:hover :not(:disabled) {
+                    color: #95fff9;
+                    border-color: #95fff9;
+                }
+            }
+            .ant-select-dropdown {
+                background: #0d1a1b;
+                .ant-select-item {
+                    color: white;
+                }
+                .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
+                    background-color: #2d575a;
+                }
+                .ant-select-item-option-active:not(.ant-select-item-option-disabled) {
+                    background-color: #1c3436;
+                }
+            }
+            .ant-pagination-jump-next .ant-pagination-item-container .ant-pagination-item-ellipsis {
+                color: #ffffff40;
+            }
+            .ant-pagination-options-quick-jumper input {
+                color: white;
+                background: transparent;
+                border: 1px solid #3c7073;
+                &:hover {
+                    border: 1px solid #6cc9ce;
+                }
+            }
+            .ant-select:not(.ant-select-customize-input) .ant-select-selector {
+                background-color: transparent;
+                border: 1px solid #1464a6;
+            }
+            .ant-select:not(.ant-select-disabled):hover .ant-select-selector {
+                border: 1px solid #6cc9ce;
+            }
+            .ant-select {
+                color: white;
+            }
+        }
+    }
+    &.dark {
+        --table-bg: transparent;
+        --table-header-bg-color: #00adb11a;
+        --table-color: white;
+        --table-head-color: #d3fff9ff;
+        --table-row-border: 1px solid transparent;
+        --table-row-bg-color: #ffffff0d;
+        --scroll-bar-hover-bg: #39cbc3ff;
+
+        .ant-pagination {
+            color: white;
+            .ant-pagination-item {
+                background-color: transparent;
+                border-color: #454847;
+                > a {
+                    color: white;
+                }
+
+                &.ant-pagination-item-active,
+                &:hover {
+                    border-color: #95fff9;
+                    > a {
+                        color: #95fff9;
+                    }
+                }
+            }
+            .ant-select-arrow {
+                color: white;
+            }
+            .ant-pagination-item-link {
+                color: white;
+                background-color: transparent;
+                border-color: #454847;
+                &:hover :not(:disabled) {
+                    color: #95fff9;
+                    border-color: #95fff9;
+                }
+            }
+            .ant-select-dropdown {
+                background: #0d1a1b;
+                .ant-select-item {
+                    color: white;
+                }
+                .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
+                    background-color: #2d575a;
+                }
+                .ant-select-item-option-active:not(.ant-select-item-option-disabled) {
+                    background-color: #1c3436;
+                }
+            }
+            .ant-pagination-jump-next .ant-pagination-item-container .ant-pagination-item-ellipsis {
+                color: #ffffff40;
+            }
+            .ant-pagination-options-quick-jumper input {
+                color: white;
+                background: transparent;
+                border: 1px solid #3c7073;
+                &:hover {
+                    border: 1px solid #6cc9ce;
+                }
+            }
+            .ant-select:not(.ant-select-customize-input) .ant-select-selector {
+                background-color: transparent;
+                border: 1px solid #3c7073;
+            }
+            .ant-select:not(.ant-select-disabled):hover .ant-select-selector {
+                border: 1px solid #6cc9ce;
+            }
+            .ant-select {
+                color: white;
+            }
+        }
+    }
+
+    .ant-table-body {
+        // ScrollBar
+        &::-webkit-scrollbar {
+            width: 0px;
+            height: 4px;
+        }
+
+        // &::-webkit-scrollbar-track {
+        //     background: var(--scroll-bar-hover-bg);
+        //     border-radius: 5px;
+        // }
+
+        &::-webkit-scrollbar-thumb {
+            background: var(--scroll-bar-hover-bg);
+            border-radius: 5px;
+        }
+
+        // &::-webkit-scrollbar-corner {
+        //     background: var(--scroll-bar-hover-bg);
+        // }
+
+        // &::-webkit-scrollbar-thumb:hover {
+        //     background: var(--scroll-bar-hover-bg);
+        // }
+    }
+
+    .ant-table {
+        background: var(--table-bg);
+        .vm-table-row {
+            background: #2d575a;
+        }
+
+        .ant-table-container {
+            &::before {
+                display: none;
+            }
+
+            &::after {
+                display: none;
+            }
+
+            .ant-table-content {
+                padding-bottom: 10px;
+            }
+            table {
+                border-collapse: collapse;
+
+                thead {
+                    th {
+                        padding: 8px 12px;
+                        color: var(--table-head-color);
+                        white-space: no-wrap;
+                        background-color: var(--table-header-bg-color);
+                        border: none;
+
+                        &::before {
+                            display: none;
+                        }
+                    }
+                }
+
+                tbody {
+                    tr {
+                        td {
+                            padding: 8px 12px;
+                            color: var(--table-color);
+                            white-space: nowrap;
+                            background-color: transparent;
+                            border: none;
+                        }
+
+                        &:nth-child(odd) {
+                            td {
+                                background-color: var(--table-row-bg-color);
+                                border-top: var(--table-row-border);
+                                border-bottom: var(--table-row-border);
+
+                                &:first-child {
+                                    border-left: var(--table-row-border);
+                                }
+
+                                &:last-child {
+                                    border-right: var(--table-row-border);
+                                }
+                            }
+                        }
+                    }
+
+                    .ant-table-placeholder {
+                        .ant-empty-description {
+                            color: var(--title-color);
+                        }
+                    }
+                }
+            }
+        }
+    }
+}
+
+.vtx-export-btn {
+    &.dark {
+        background: #2bd8cf;
+        border-color: #2bd8cf;
+        > span {
+            color: black;
+        }
+    }
+}
+.vtx-export-dropdown {
+    &.dark {
+        .ant-dropdown-menu {
+            background-color: #0d1a1b;
+            .ant-dropdown-menu-item {
+                color: white;
+                &:hover {
+                    background-color: #1c3436;
+                }
+            }
+        }
+    }
+    &.blue {
+        .ant-dropdown-menu {
+            background-color: #1a3e69;
+            .ant-dropdown-menu-item {
+                color: white;
+                &:hover {
+                    background-color: RGBA(30, 92, 147, 0.5);
+                }
+            }
+        }
+    }
+}
+.vtx-table-tabs {
+    &.dark {
+        .ant-tabs-nav {
+            &::before {
+                border-bottom: 1px solid #ffffff1a;
+            }
+        }
+        .ant-tabs-tab-btn {
+            color: #c5c5c5ff;
+        }
+        .ant-tabs-ink-bar {
+            background-color: #95fff9;
+        }
+        .ant-tabs-tab-active {
+            .ant-tabs-tab-btn {
+                color: #95fff9 !important;
+            }
+        }
+    }
+}

package/lib/vm-time-line/index.js

@@ -0,0 +1,25 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = _default;
+var _react = _interopRequireDefault(require("react"));
+var _antd = require("antd");
+var _vmEmpty = _interopRequireDefault(require("../vm-empty"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+function _default(props) {
+  var _props$timeLineList = props.timeLineList,
+    timeLineList = _props$timeLineList === void 0 ? [] : _props$timeLineList;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      height: '100%'
+    }
+  }, timeLineList.length ? (/*#__PURE__*/_react["default"].createElement(_antd.Timeline, null, timeLineList.map(function (item, index) {
+    return /*#__PURE__*/_react["default"].createElement(_antd.Timeline.Item, {
+      key: index,
+      color: item.color || 'gray'
+    }, item.content);
+  }))) : (/*#__PURE__*/_react["default"].createElement(_vmEmpty["default"], null)));
+}
+//# sourceMappingURL=index.js.map

package/lib/vm-time-line/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_antd","_vmEmpty","e","__esModule","_default","props","_props$timeLineList","timeLineList","React","createElement","style","height","length","Timeline","map","item","index","Item","key","color","content","MyEmpty"],"sources":["vm-time-line/index.js"],"sourcesContent":["import React from 'react';\nimport { Timeline } from 'antd';\nimport MyEmpty from '../vm-empty';\nexport default function (props) {\n    const { timeLineList = [] } = props;\n    return (React.createElement(\"div\", { style: { height: '100%' } }, timeLineList.length ? (React.createElement(Timeline, null, timeLineList.map((item, index) => (React.createElement(Timeline.Item, { key: index, color: item.color || 'gray' }, item.content))))) : (React.createElement(MyEmpty, null))));\n}\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,KAAA,GAAAD,OAAA;AACA,IAAAE,QAAA,GAAAH,sBAAA,CAAAC,OAAA;AAAkC,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,gBAAAA,CAAA;AACnB,SAAAE,SAAUC,KAAK,EAAE;EAC5B,IAAAC,mBAAA,GAA8BD,KAAK,CAA3BE,YAAY;IAAZA,YAAY,GAAAD,mBAAA,cAAG,EAAE,GAAAA,mBAAA;EACzB,oBAAQE,iBAAK,CAACC,aAAa,CAAC,KAAK,EAAE;IAAEC,KAAK,EAAE;MAAEC,MAAM,EAAE;IAAO;EAAE,CAAC,EAAEJ,YAAY,CAACK,MAAM,iBAAIJ,iBAAK,CAACC,aAAa,CAACI,cAAQ,EAAE,IAAI,EAAEN,YAAY,CAACO,GAAG,CAAC,UAACC,IAAI,EAAEC,KAAK;IAAA,oBAAMR,iBAAK,CAACC,aAAa,CAACI,cAAQ,CAACI,IAAI,EAAE;MAAEC,GAAG,EAAEF,KAAK;MAAEG,KAAK,EAAEJ,IAAI,CAACI,KAAK,IAAI;IAAO,CAAC,EAAEJ,IAAI,CAACK,OAAO,CAAC;EAAA,CAAC,CAAC,CAAC,kBAAKZ,iBAAK,CAACC,aAAa,CAACY,mBAAO,EAAE,IAAI,CAAC,CAAC,CAAC;AAC7S","ignoreList":[]}

package/lib/vm-time-line/style/css.js

@@ -0,0 +1,4 @@
+"use strict";
+
+require("./index.css");
+//# sourceMappingURL=css.js.map

package/lib/vm-time-line/style/css.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"css.js","names":["require"],"sources":["vm-time-line/style/index.js"],"sourcesContent":["import './index.less';\n"],"mappings":";;AAAAA,OAAA","ignoreList":[]}

package/lib/vm-time-line/style/index.js

@@ -0,0 +1,4 @@
+"use strict";
+
+require("./index.less");
+//# sourceMappingURL=index.js.map

package/lib/vm-time-line/style/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["require"],"sources":["vm-time-line/style/index.js"],"sourcesContent":["import './index.less';\n"],"mappings":";;AAAAA,OAAA","ignoreList":[]}

package/lib/vm-video/api.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _utils = require("@vtx/utils");
+var _ahooks = require("ahooks");
+var VideoService = {
+  getChannels: function getChannels(billId, ready) {
+    var _useRequest = (0, _ahooks.useRequest)(function () {
+        return _utils.request.get('/cloud/vis/base/np/videoDevice/loadVideoChannelByBillId.smvc', {
+          data: {
+            billId: billId
+          }
+        });
+      }, {
+        ready: ready,
+        refreshDeps: [billId]
+      }),
+      channelRes = _useRequest.data;
+    var channels = (channelRes === null || channelRes === void 0 ? void 0 : channelRes.data) ? JSON.parse(channelRes.data) : [];
+    return {
+      channels: channels
+    };
+  }
+};
+var _default = exports["default"] = VideoService;
+//# sourceMappingURL=api.js.map

package/lib/vm-video/api.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"api.js","names":["_utils","require","_ahooks","VideoService","getChannels","billId","ready","_useRequest","useRequest","request","get","data","refreshDeps","channelRes","channels","JSON","parse","_default","exports"],"sources":["vm-video/api.js"],"sourcesContent":["import { request } from '@vtx/utils';\nimport { useRequest } from 'ahooks';\nconst VideoService = {\n    getChannels: (billId, ready) => {\n        const { data: channelRes } = useRequest(() => request.get('/cloud/vis/base/np/videoDevice/loadVideoChannelByBillId.smvc', {\n            data: { billId },\n        }), { ready, refreshDeps: [billId] });\n        const channels = (channelRes === null || channelRes === void 0 ? void 0 : channelRes.data) ? JSON.parse(channelRes.data) : [];\n        return {\n            channels,\n        };\n    },\n};\nexport default VideoService;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAME,YAAY,GAAG;EACjBC,WAAW,EAAE,SAAbA,WAAWA,CAAGC,MAAM,EAAEC,KAAK,EAAK;IAC5B,IAAAC,WAAA,GAA6B,IAAAC,kBAAU,EAAC;QAAA,OAAMC,cAAO,CAACC,GAAG,CAAC,8DAA8D,EAAE;UACtHC,IAAI,EAAE;YAAEN,MAAM,EAANA;UAAO;QACnB,CAAC,CAAC;MAAA,GAAE;QAAEC,KAAK,EAALA,KAAK;QAAEM,WAAW,EAAE,CAACP,MAAM;MAAE,CAAC,CAAC;MAFvBQ,UAAU,GAAAN,WAAA,CAAhBI,IAAI;IAGZ,IAAMG,QAAQ,GAAG,CAACD,UAAU,KAAK,IAAI,IAAIA,UAAU,KAAK,KAAK,CAAC,GAAG,KAAK,CAAC,GAAGA,UAAU,CAACF,IAAI,IAAII,IAAI,CAACC,KAAK,CAACH,UAAU,CAACF,IAAI,CAAC,GAAG,EAAE;IAC7H,OAAO;MACHG,QAAQ,EAARA;IACJ,CAAC;EACL;AACJ,CAAC;AAAC,IAAAG,QAAA,GAAAC,OAAA,cACaf,YAAY","ignoreList":[]}

package/lib/vm-video/index.css

@@ -0,0 +1,184 @@
+.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: #35444c;
+  --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;
+}
+.vm-video {
+  height: 640px;
+  padding: 0 20px;
+  background: var(--modal-content-bg);
+}
+.vm-video .ant-tabs-tabpane {
+  height: 100%;
+}
+.vm-video.blue .ant-tabs-tab {
+  color: #fff;
+}
+.vm-video.blue .control-container,
+.vm-video.blue .ant-form-item-no-colon,
+.vm-video.blue .ant-radio-wrapper {
+  color: #fff;
+}
+.vm-video.blue .vtx-live-control .player-grid-container .grid-item-container.active {
+  -webkit-box-shadow: 0 0 0 1px #1464a6;
+          box-shadow: 0 0 0 1px #1464a6;
+}
+.vm-video.blue .vtx-bill-player .player-panel .control-container {
+  border: 1px solid var(--border-color);
+}
+.vm-video.blue .vtx-bill-player .player-panel .control-container .header {
+  border-bottom: 1px solid var(--border-color);
+}
+.vm-video.blue .ant-tabs-top > .ant-tabs-nav::before,
+.vm-video.blue .ant-tabs-bottom > .ant-tabs-nav::before,
+.vm-video.blue .ant-tabs-top > div > .ant-tabs-nav::before,
+.vm-video.blue .ant-tabs-bottom > div > .ant-tabs-nav::before {
+  border-bottom: 1px solid #219fff5d;
+}

package/lib/vm-video/index.js

@@ -0,0 +1,37 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+var _react = _interopRequireDefault(require("react"));
+var _player = require("@vtx/player");
+var _useSettings2 = _interopRequireDefault(require("../vm-hooks/useSettings"));
+require("./index.less");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
+var VmVideo = function VmVideo(_ref) {
+  var _ref$videoPlaceCode = _ref.videoPlaceCode,
+    videoPlaceCode = _ref$videoPlaceCode === void 0 ? '' : _ref$videoPlaceCode;
+  var _useSettings = (0, _useSettings2["default"])(),
+    isDark = _useSettings.isDark,
+    theme = _useSettings.theme;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "vm-video ".concat(theme)
+  }, videoPlaceCode ? (/*#__PURE__*/_react["default"].createElement(_player.BillPlayer, {
+    height: 640,
+    isDark: isDark || theme === 'blue',
+    params: {
+      billId: videoPlaceCode
+    }
+  })) : (/*#__PURE__*/_react["default"].createElement("div", {
+    style: {
+      display: 'flex',
+      height: '100%',
+      justifyContent: 'center',
+      alignItems: 'center',
+      color: '#fff'
+    }
+  }, "\u6682\u65E0\u89C6\u9891")));
+};
+var _default = exports["default"] = VmVideo;
+//# sourceMappingURL=index.js.map

package/lib/vm-video/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["_react","_interopRequireDefault","require","_player","_useSettings2","e","__esModule","VmVideo","_ref","_ref$videoPlaceCode","videoPlaceCode","_useSettings","useSettings","isDark","theme","React","createElement","className","concat","BillPlayer","height","params","billId","style","display","justifyContent","alignItems","color","_default","exports"],"sources":["vm-video/index.js"],"sourcesContent":["import React from 'react';\nimport { BillPlayer } from '@vtx/player';\nimport useSettings from '../vm-hooks/useSettings';\nimport './index.less';\nconst VmVideo = ({ videoPlaceCode = '' }) => {\n    const { isDark, theme } = useSettings();\n    return (React.createElement(\"div\", { className: `vm-video ${theme}` }, videoPlaceCode ? (React.createElement(BillPlayer, { height: 640, isDark: isDark || theme === 'blue', params: { billId: videoPlaceCode } })) : (React.createElement(\"div\", { style: {\n            display: 'flex',\n            height: '100%',\n            justifyContent: 'center',\n            alignItems: 'center',\n            color: '#fff',\n        } }, \"\\u6682\\u65E0\\u89C6\\u9891\"))));\n};\nexport default VmVideo;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,OAAA,GAAAD,OAAA;AACA,IAAAE,aAAA,GAAAH,sBAAA,CAAAC,OAAA;AACAA,OAAA;AAAsB,SAAAD,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,gBAAAA,CAAA;AACtB,IAAME,OAAO,GAAG,SAAVA,OAAOA,CAAAC,IAAA,EAAgC;EAAA,IAAAC,mBAAA,GAAAD,IAAA,CAA1BE,cAAc;IAAdA,cAAc,GAAAD,mBAAA,cAAG,EAAE,GAAAA,mBAAA;EAClC,IAAAE,YAAA,GAA0B,IAAAC,wBAAW,EAAC,CAAC;IAA/BC,MAAM,GAAAF,YAAA,CAANE,MAAM;IAAEC,KAAK,GAAAH,YAAA,CAALG,KAAK;EACrB,oBAAQC,iBAAK,CAACC,aAAa,CAAC,KAAK,EAAE;IAAEC,SAAS,cAAAC,MAAA,CAAcJ,KAAK;EAAG,CAAC,EAAEJ,cAAc,iBAAIK,iBAAK,CAACC,aAAa,CAACG,kBAAU,EAAE;IAAEC,MAAM,EAAE,GAAG;IAAEP,MAAM,EAAEA,MAAM,IAAIC,KAAK,KAAK,MAAM;IAAEO,MAAM,EAAE;MAAEC,MAAM,EAAEZ;IAAe;EAAE,CAAC,CAAC,kBAAKK,iBAAK,CAACC,aAAa,CAAC,KAAK,EAAE;IAAEO,KAAK,EAAE;MAClPC,OAAO,EAAE,MAAM;MACfJ,MAAM,EAAE,MAAM;MACdK,cAAc,EAAE,QAAQ;MACxBC,UAAU,EAAE,QAAQ;MACpBC,KAAK,EAAE;IACX;EAAE,CAAC,EAAE,0BAA0B,CAAC,CAAC,CAAC;AAC1C,CAAC;AAAC,IAAAC,QAAA,GAAAC,OAAA,cACatB,OAAO","ignoreList":[]}

package/lib/vm-video/index.less

@@ -0,0 +1,36 @@
+@import '../style/index';
+
+.vm-video {
+    height: 640px;
+    padding: 0 20px;
+    background: var(--modal-content-bg);
+    .ant-tabs-tabpane {
+        height: 100%;
+    }
+    &.blue {
+        .ant-tabs-tab {
+            color: #fff;
+        }
+        .control-container,
+        .ant-form-item-no-colon,
+        .ant-radio-wrapper {
+            color: #fff;
+        }
+        .vtx-live-control .player-grid-container .grid-item-container.active {
+            box-shadow: 0 0 0 1px #1464a6;
+        }
+
+        .vtx-bill-player .player-panel .control-container {
+            border: 1px solid var(--border-color);
+        }
+        .vtx-bill-player .player-panel .control-container .header {
+            border-bottom: 1px solid var(--border-color);
+        }
+        .ant-tabs-top > .ant-tabs-nav::before,
+        .ant-tabs-bottom > .ant-tabs-nav::before,
+        .ant-tabs-top > div > .ant-tabs-nav::before,
+        .ant-tabs-bottom > div > .ant-tabs-nav::before {
+            border-bottom: 1px solid #219fff5d;
+        }
+    }
+}