inl-ui 0.1.50 → 0.1.52

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (34) hide show
  1. package/README.md +49 -49
  2. package/dist/components/index.cjs +13 -24
  3. package/dist/components/index.d.ts +3 -3
  4. package/dist/components/index.js +13 -24
  5. package/dist/components/style.css +1 -1
  6. package/dist/iconfont.js +1 -1
  7. package/dist/index.cjs +14 -25
  8. package/dist/index.d.ts +4 -4
  9. package/dist/index.js +14 -25
  10. package/dist/style.css +2 -2
  11. package/dist/theme/index.js +70 -70
  12. package/dist/theme/scripts/dark-vars.js +21 -21
  13. package/dist/theme/scripts/default-vars.js +25 -25
  14. package/dist/theme/scripts/light-vars.js +22 -22
  15. package/dist/theme/style/color/bezierEasing.less +110 -110
  16. package/dist/theme/style/color/colorPalette.less +81 -81
  17. package/dist/theme/style/color/colors.less +162 -162
  18. package/dist/theme/style/color/tinyColor.less +1184 -1184
  19. package/dist/theme/style/compact.less +4 -4
  20. package/dist/theme/style/dark.less +4 -4
  21. package/dist/theme/style/default.less +4 -4
  22. package/dist/theme/style/index.less +2 -2
  23. package/dist/theme/style/index.tsx +2 -2
  24. package/dist/theme/style/themes/compact.less +295 -295
  25. package/dist/theme/style/themes/dark.less +790 -790
  26. package/dist/theme/style/themes/default.less +1067 -1067
  27. package/dist/theme/style/themes/index.less +7 -7
  28. package/dist/theme/style/themes/var-dark.less +343 -343
  29. package/dist/theme/style/themes/var-default.less +184 -184
  30. package/dist/theme/style/themes/variable.less +1122 -1122
  31. package/dist/theme/style/variable.less +4 -4
  32. package/dist/video/style.css +1 -1
  33. package/dist/videoMobile/style.css +1 -1
  34. package/package.json +1 -1
package/README.md CHANGED
@@ -1,49 +1,49 @@
1
- # 工业PC ui库
2
-
3
- 前端通用库,包括组件、hooks、utils等。
4
-
5
- ### 运行
6
-
7
- + 开发模式 yarn dev
8
- + 生产打包 yarn build
9
- + 生成文档 yarn build:docs
10
- + 打包图扑工具 yarn buildtp
11
-
12
- ### 使用方法
13
-
14
- ```javascript
15
- import inl from 'inl-ui';
16
- import 'inl-ui/dist/style.css';
17
-
18
- vue.use(inl)
19
- ```
20
-
21
-
22
-
23
- ### 激活主题
24
-
25
- **vite.config.ts**
26
-
27
- ```javascript
28
- const additionalData = require("inl-ui/dist/theme").default;
29
-
30
- ...
31
-
32
- css: {
33
- preprocessorOptions: {
34
- less: {
35
- javascriptEnabled: true,
36
- additionalData,
37
- },
38
- },
39
- },
40
- ```
41
-
42
- ### 文档链接
43
-
44
- ##### [组件文档](./src/components/README.md)
45
-
46
- ##### [hooks文档](./src/hooks/README.md)
47
-
48
- ##### [Utils文档](./src/utils/README.md)
49
-
1
+ # 工业PC ui库
2
+
3
+ 前端通用库,包括组件、hooks、utils等。
4
+
5
+ ### 运行
6
+
7
+ + 开发模式 yarn dev
8
+ + 生产打包 yarn build
9
+ + 生成文档 yarn build:docs
10
+ + 打包图扑工具 yarn buildtp
11
+
12
+ ### 使用方法
13
+
14
+ ```javascript
15
+ import inl from 'inl-ui';
16
+ import 'inl-ui/dist/style.css';
17
+
18
+ vue.use(inl)
19
+ ```
20
+
21
+
22
+
23
+ ### 激活主题
24
+
25
+ **vite.config.ts**
26
+
27
+ ```javascript
28
+ const additionalData = require("inl-ui/dist/theme").default;
29
+
30
+ ...
31
+
32
+ css: {
33
+ preprocessorOptions: {
34
+ less: {
35
+ javascriptEnabled: true,
36
+ additionalData,
37
+ },
38
+ },
39
+ },
40
+ ```
41
+
42
+ ### 文档链接
43
+
44
+ ##### [组件文档](./src/components/README.md)
45
+
46
+ ##### [hooks文档](./src/hooks/README.md)
47
+
48
+ ##### [Utils文档](./src/utils/README.md)
49
+
@@ -6461,20 +6461,15 @@ function useMicroApp(appList) {
6461
6461
  entry: microAppDefine.entry,
6462
6462
  container: `#${domId}`
6463
6463
  });
6464
- const microApp = vue.ref({
6464
+ const microApp = {
6465
6465
  name: microAppName,
6466
6466
  domId,
6467
6467
  app,
6468
- mounted: true,
6469
- loading: true
6470
- });
6471
- loadAppList.value.push(microApp.value);
6472
- loadedApp.set(microAppName, microApp.value);
6473
- try {
6474
- await app.mountPromise;
6475
- } finally {
6476
- microApp.value.loading = false;
6477
- }
6468
+ mounted: true
6469
+ };
6470
+ loadAppList.value.push(microApp);
6471
+ loadedApp.set(microAppName, microApp);
6472
+ await app.mountPromise;
6478
6473
  }, 10);
6479
6474
  }, 100);
6480
6475
  vue.watch(route, handleRouteChange, {
@@ -7175,16 +7170,10 @@ const PageContent = vue.defineComponent({
7175
7170
  fullscreen: isFullscreen.value
7176
7171
  }],
7177
7172
  "ref": props.pageContainerRef
7178
- }, [appDomList.value.map(item => {
7179
- const microApp = loadAppList.value.find(a => a.domId === item.id);
7180
- return vue.withDirectives(vue.createVNode("div", {
7181
- "key": item.id,
7182
- "id": item.id,
7183
- "class": {
7184
- loading: microApp && microApp.loading
7185
- }
7186
- }, null), [[vue.vShow, item.name === activeAppName.value]]);
7187
- }), iframeList.value.map(item => {
7173
+ }, [appDomList.value.map(item => vue.withDirectives(vue.createVNode("div", {
7174
+ "key": item.id,
7175
+ "id": item.id
7176
+ }, null), [[vue.vShow, item.name === activeAppName.value]])), iframeList.value.map(item => {
7188
7177
  const show = item.id === activeKey.value;
7189
7178
  if (item.reqCode === 200 || item.reqCode === void 0) {
7190
7179
  return vue.createVNode("iframe", {
@@ -8317,7 +8306,6 @@ const ChildHeader = vue.defineComponent({
8317
8306
  });
8318
8307
 
8319
8308
  const isIndependentApp = query => !!query.token && !!query.onlyPage;
8320
- const isDev = undefined.DEV;
8321
8309
  const loginFun = new Login$1();
8322
8310
  const requestLogo = async () => {
8323
8311
  const res = await fetch("/api/common/v1/sysconfig/searchImage?imgType=4&editImg=1&clientType=web");
@@ -8383,7 +8371,7 @@ const DefaultLayout = vue.defineComponent({
8383
8371
  default: () => []
8384
8372
  },
8385
8373
  // 打包成调试版本
8386
- noProduction: {
8374
+ devMode: {
8387
8375
  type: Boolean,
8388
8376
  default: false
8389
8377
  }
@@ -8391,6 +8379,7 @@ const DefaultLayout = vue.defineComponent({
8391
8379
  setup(props) {
8392
8380
  const route = vueRouter.useRoute();
8393
8381
  const router = vueRouter.useRouter();
8382
+ const isDev = undefined.DEV || props.devMode;
8394
8383
  const [isFold, toggleFold] = core.useToggle(false);
8395
8384
  const userInfo = core.useSessionStorage("userinfo", {});
8396
8385
  const logo = vue.ref();
@@ -8481,7 +8470,7 @@ const DefaultLayout = vue.defineComponent({
8481
8470
  }
8482
8471
  });
8483
8472
  }
8484
- if (isIndependent && !props.noProduction) {
8473
+ if (isIndependent) {
8485
8474
  return vue.createVNode("div", {
8486
8475
  "class": "independent-container"
8487
8476
  }, [vue.createVNode(vue.resolveComponent("router-view"), null, null)]);
@@ -209,7 +209,7 @@ declare const _default$f: vue.DefineComponent<{
209
209
  type: PropType<string[]>;
210
210
  default: () => never[];
211
211
  };
212
- noProduction: {
212
+ devMode: {
213
213
  type: BooleanConstructor;
214
214
  default: boolean;
215
215
  };
@@ -222,14 +222,14 @@ declare const _default$f: vue.DefineComponent<{
222
222
  type: PropType<string[]>;
223
223
  default: () => never[];
224
224
  };
225
- noProduction: {
225
+ devMode: {
226
226
  type: BooleanConstructor;
227
227
  default: boolean;
228
228
  };
229
229
  }>>, {
230
230
  withHeader: boolean;
231
231
  noCacheNames: string[];
232
- noProduction: boolean;
232
+ devMode: boolean;
233
233
  }, {}>;
234
234
 
235
235
  /**
@@ -6450,20 +6450,15 @@ function useMicroApp(appList) {
6450
6450
  entry: microAppDefine.entry,
6451
6451
  container: `#${domId}`
6452
6452
  });
6453
- const microApp = ref({
6453
+ const microApp = {
6454
6454
  name: microAppName,
6455
6455
  domId,
6456
6456
  app,
6457
- mounted: true,
6458
- loading: true
6459
- });
6460
- loadAppList.value.push(microApp.value);
6461
- loadedApp.set(microAppName, microApp.value);
6462
- try {
6463
- await app.mountPromise;
6464
- } finally {
6465
- microApp.value.loading = false;
6466
- }
6457
+ mounted: true
6458
+ };
6459
+ loadAppList.value.push(microApp);
6460
+ loadedApp.set(microAppName, microApp);
6461
+ await app.mountPromise;
6467
6462
  }, 10);
6468
6463
  }, 100);
6469
6464
  watch(route, handleRouteChange, {
@@ -7164,16 +7159,10 @@ const PageContent = defineComponent({
7164
7159
  fullscreen: isFullscreen.value
7165
7160
  }],
7166
7161
  "ref": props.pageContainerRef
7167
- }, [appDomList.value.map(item => {
7168
- const microApp = loadAppList.value.find(a => a.domId === item.id);
7169
- return withDirectives(createVNode("div", {
7170
- "key": item.id,
7171
- "id": item.id,
7172
- "class": {
7173
- loading: microApp && microApp.loading
7174
- }
7175
- }, null), [[vShow, item.name === activeAppName.value]]);
7176
- }), iframeList.value.map(item => {
7162
+ }, [appDomList.value.map(item => withDirectives(createVNode("div", {
7163
+ "key": item.id,
7164
+ "id": item.id
7165
+ }, null), [[vShow, item.name === activeAppName.value]])), iframeList.value.map(item => {
7177
7166
  const show = item.id === activeKey.value;
7178
7167
  if (item.reqCode === 200 || item.reqCode === void 0) {
7179
7168
  return createVNode("iframe", {
@@ -8306,7 +8295,6 @@ const ChildHeader = defineComponent({
8306
8295
  });
8307
8296
 
8308
8297
  const isIndependentApp = query => !!query.token && !!query.onlyPage;
8309
- const isDev = import.meta.env.DEV;
8310
8298
  const loginFun = new Login$1();
8311
8299
  const requestLogo = async () => {
8312
8300
  const res = await fetch("/api/common/v1/sysconfig/searchImage?imgType=4&editImg=1&clientType=web");
@@ -8372,7 +8360,7 @@ const DefaultLayout = defineComponent({
8372
8360
  default: () => []
8373
8361
  },
8374
8362
  // 打包成调试版本
8375
- noProduction: {
8363
+ devMode: {
8376
8364
  type: Boolean,
8377
8365
  default: false
8378
8366
  }
@@ -8380,6 +8368,7 @@ const DefaultLayout = defineComponent({
8380
8368
  setup(props) {
8381
8369
  const route = useRoute();
8382
8370
  const router = useRouter();
8371
+ const isDev = import.meta.env.DEV || props.devMode;
8383
8372
  const [isFold, toggleFold] = useToggle(false);
8384
8373
  const userInfo = useSessionStorage("userinfo", {});
8385
8374
  const logo = ref();
@@ -8470,7 +8459,7 @@ const DefaultLayout = defineComponent({
8470
8459
  }
8471
8460
  });
8472
8461
  }
8473
- if (isIndependent && !props.noProduction) {
8462
+ if (isIndependent) {
8474
8463
  return createVNode("div", {
8475
8464
  "class": "independent-container"
8476
8465
  }, [createVNode(resolveComponent("router-view"), null, null)]);
@@ -1,3 +1,3 @@
1
- .playVideos{display:flex;flex-direction:column;height:100%;padding-left:20px}.playVideos .operate{display:flex;justify-content:space-between;margin:5px 0}.playVideos .operate .button{cursor:pointer}.playVideos .grid{display:grid;flex:1;overflow:hidden}.playVideos .grid .video{background:#000;border:1px solid hsla(216,7%,59%,.3);height:100%;object-fit:fill;overflow:hidden;width:100%}.playVideos .grid.full{height:100%;left:0;position:fixed;top:0;width:100%;z-index:10}.playVideos .type1{grid-template-columns:1fr;grid-template-rows:1fr}.playVideos .type4{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}.playVideos .type8{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}.playVideos .type8 .video:first-child{grid-column:1/4;grid-row:1/4}.playVideos .type9{grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr}.playVideos .type13{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}.playVideos .type13 .video:first-child{grid-column:1/3;grid-row:1/3}.playVideos .type16{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}@keyframes moveBottom{0%{bottom:0}to{bottom:-66px}}.videoComponent{background:#000;height:100%;left:0;position:relative;top:0;width:100%}.videoComponent.fill{object-fit:fill}.videoComponent.contain{object-fit:contain}.videoBox{height:100%;overflow:hidden;position:relative}.videoBox .videoStatic{height:100%;object-fit:fill;width:100%}.videoBox .thumbnail{background:#000;height:30%;left:70%;position:absolute;top:70%;width:30%}.videoBox .thumbnail .chooseField{border:1px solid red;height:100%;left:100%;position:absolute;top:100%;width:100%}.videoBox #tempDiv{border:2px solid red;position:absolute}.videoBox.alarm:before{border:2px solid #ea5858;box-shadow:inset 0 0 10px 8px rgba(234,88,88,.5);content:"";height:100%;pointer-events:none;position:absolute;top:0;width:100%;z-index:7}.videoBox:hover .selectFields{animation-duration:1s;animation-fill-mode:both;animation-name:moveBottom}.videoBox:hover .footer-min{display:flex}.videoBox:hover .footer-min .name-min span{display:block}.videoBox:hover .footer-min .tool{display:flex}.videoBox .selectFields{background:rgba(0,0,0,.3);bottom:0;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr;height:66px;position:absolute;width:100%}.videoBox .selectFields .info{border:0;color:#fff;line-height:33px;overflow:hidden;padding:0 5px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.videoBox .selectFields .info .value{font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.videoBox .footer-min{align-items:center;backdrop-filter:blur(10px);background:hsla(0,0%,100%,.04);border-radius:4px 4px 0 0;bottom:0;display:none;height:44px;justify-content:space-between;position:absolute;width:100%}.videoBox .footer-min .name-min{align-items:center;display:flex;padding-left:15px}.videoBox .footer-min .name-min span{color:#fff;display:none;font-size:16px;font-weight:600}.videoBox .footer-min .tool{display:none}.videoBox .footer-min .tool img{cursor:pointer;height:20px;margin:3px 8px;width:20px}.videoBox .footer-min .tool .imgOut{align-items:center;border-radius:20%;cursor:pointer;display:flex;height:28px;justify-content:center;margin:0 3px;width:28px}.videoBox .footer-min .tool .active{background-color:hsla(0,0%,100%,.3)}.videoControls{align-items:center;display:flex;flex-direction:column;width:100%}.videoControls .videoControl{height:126px;position:relative;width:126px}.videoControls .videoControl .bg{height:100%;position:relative;width:100%}.videoControls .videoControl img{cursor:pointer;position:absolute}.videoControls .videoControl .up{left:52px;top:14px}.videoControls .videoControl .lup{left:26px;top:26px;transform:rotate(-45deg)}.videoControls .videoControl .rup{left:78px;top:27px;transform:rotate(45deg)}.videoControls .videoControl .left{left:14px;top:52px;transform:rotate(-90deg)}.videoControls .videoControl .right{left:90px;top:52px;transform:rotate(90deg)}.videoControls .videoControl .ldown{left:26px;top:78px;transform:rotate(215deg)}.videoControls .videoControl .down{left:52px;top:90px;transform:rotate(180deg)}.videoControls .videoControl .rdown{left:78px;top:78px;transform:rotate(135deg)}.videoControls .btns{background:#e0e7f2;border-radius:19px;height:28px;margin:8px 8px 0;padding:3px;width:56px}.videoControls .btns img{cursor:pointer;margin-right:1px}.changeCameraDialog{height:600px}
1
+ .playVideos{display:flex;flex-direction:column;height:100%;padding-left:20px}.playVideos .operate{display:flex;justify-content:space-between;margin:5px 0}.playVideos .operate .button{cursor:pointer}.playVideos .grid{display:grid;flex:1;overflow:hidden}.playVideos .grid .video{background:#000;border:1px solid hsla(216,7%,59%,.3);height:100%;object-fit:fill;overflow:hidden;width:100%}.playVideos .grid.full{height:100%;left:0;position:fixed;top:0;width:100%;z-index:10}.playVideos .type1{grid-template-columns:1fr;grid-template-rows:1fr}.playVideos .type4{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}.playVideos .type8{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}.playVideos .type8 .video:first-child{grid-column:1/4;grid-row:1/4}.playVideos .type9{grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr}.playVideos .type13{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}.playVideos .type13 .video:first-child{grid-column:1/3;grid-row:1/3}.playVideos .type16{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}@keyframes moveBottom{0%{bottom:0}to{bottom:-66px}}.videoComponent{background:#000;height:100%;left:0;position:relative;top:0;width:100%}.videoComponent.fill{object-fit:fill}.videoComponent.contain{object-fit:contain}.videoBox{height:100%;overflow:hidden;position:relative}.videoBox .videoStatic{height:100%;object-fit:fill;width:100%}.videoBox .thumbnail{background:#000;height:30%;left:70%;position:absolute;top:70%;width:30%}.videoBox .thumbnail .chooseField{border:1px solid red;height:100%;left:100%;position:absolute;top:100%;width:100%}.videoBox #tempDiv{border:2px solid red;position:absolute}.videoBox.alarm:before{border:2px solid #ea5858;box-shadow:inset 0 0 10px 8px rgba(234,88,88,.5);content:"";height:100%;pointer-events:none;position:absolute;top:0;width:100%;z-index:7}.videoBox:hover .selectFields{animation-duration:1s;animation-fill-mode:both;animation-name:moveBottom}.videoBox:hover .footer-min{display:flex}.videoBox:hover .footer-min .name-min span{display:block}.videoBox:hover .footer-min .tool{display:flex}.videoBox .selectFields{background:rgba(0,0,0,.3);bottom:0;display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr;height:66px;position:absolute;width:100%}.videoBox .selectFields .info{border:0;color:#fff;line-height:33px;overflow:hidden;padding:0 5px;text-align:center;text-overflow:ellipsis;white-space:nowrap}.videoBox .selectFields .info .value{font-size:15px;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.videoBox .footer-min{align-items:center;backdrop-filter:blur(10px);background:hsla(0,0%,100%,.04);border-radius:4px 4px 0 0;bottom:0;display:none;height:44px;justify-content:space-between;position:absolute;width:100%}.videoBox .footer-min .name-min{align-items:center;display:flex;padding-left:15px}.videoBox .footer-min .name-min span{color:#fff;display:none;font-size:16px;font-weight:600}.videoBox .footer-min .tool{display:none}.videoBox .footer-min .tool img{cursor:pointer;height:20px;margin:3px 8px;width:20px}.videoBox .footer-min .tool .imgOut{align-items:center;border-radius:20%;cursor:pointer;display:flex;height:28px;justify-content:center;margin:0 3px;width:28px}.videoBox .footer-min .tool .active{background-color:hsla(0,0%,100%,.3)}.videoControls{align-items:center;display:flex;flex-direction:column;width:100%}.videoControls .videoControl{height:126px;position:relative;width:126px}.videoControls .videoControl .bg{height:100%;position:relative;width:100%}.videoControls .videoControl img{cursor:pointer;position:absolute}.videoControls .videoControl .up{left:52px;top:14px}.videoControls .videoControl .lup{left:26px;top:26px;transform:rotate(-45deg)}.videoControls .videoControl .rup{left:78px;top:27px;transform:rotate(45deg)}.videoControls .videoControl .left{left:14px;top:52px;transform:rotate(-90deg)}.videoControls .videoControl .right{left:90px;top:52px;transform:rotate(90deg)}.videoControls .videoControl .ldown{left:26px;top:78px;transform:rotate(215deg)}.videoControls .videoControl .down{left:52px;top:90px;transform:rotate(180deg)}.videoControls .videoControl .rdown{left:78px;top:78px;transform:rotate(135deg)}.videoControls .btns{background:#e0e7f2;border-radius:19px;height:28px;margin:8px 8px 0;padding:3px;width:56px}.videoControls .btns img{cursor:pointer;margin-right:1px}.changeCameraDialog{height:600px;overflow:auto}
2
2
  .videoAlarmDia.dark{background:linear-gradient(90deg,#3e7eff,#1e4e75 30%,#1e4e75 70%,#3e7eff);padding:1px}.videoAlarmDia.dark .ant-modal-close{color:#fff}.videoAlarmDia.dark .ant-modal-header{background-color:#22396f;border-bottom-color:transparent;padding-left:20px}.videoAlarmDia.dark .ant-modal-header .ant-modal-title{align-items:center;background-image:linear-gradient(90deg,#2852a8 0,rgba(40,82,168,0) 50%);color:#fff;display:flex;height:42px;padding-left:10px}.videoAlarmDia.dark .ant-modal-content{background-color:#22396f}.videoAlarmDia.dark .ant-modal-content .body,.videoAlarmDia.dark .ant-modal-content .body .alarmList .alarm .name,.videoAlarmDia.dark .ant-modal-content .body .alarmList .title,.videoAlarmDia.dark .ant-modal-content .body .themeImg{color:#fff}.videoAlarmDia.dark .ant-modal-content .body .tabs .tabContainer .allTab .tab{background:#ffffff1a;color:#fff}.videoAlarmDia.dark .ant-modal-content .body .tabs .tabContainer .allTab .tab.active{background:#3e7eff;color:#fff}.videoAlarmDia .ant-modal-body{padding-top:18px}.videoAlarmDia .body{display:flex;flex-direction:column;height:660px}.videoAlarmDia .body .title{color:#000;font-size:18px}.videoAlarmDia .body .themeImg{height:18px;margin-right:5px;width:18px}.videoAlarmDia .body .current{align-self:center;display:flex;height:400px;justify-content:center;margin:10px 0 25px;width:750px}.videoAlarmDia .body .current .grid{grid-gap:3px;background-color:transparent;display:grid;height:100%;overflow:hidden;width:100%}.videoAlarmDia .body .current .grid .videoBox{background-color:#000}.videoAlarmDia .body .alarmList{display:flex;flex-wrap:wrap;justify-content:flex-start;max-height:80px;overflow:auto}.videoAlarmDia .body .alarmList .title{font-size:14px;font-weight:600;margin-bottom:10px}.videoAlarmDia .body .alarmList .alarm{align-items:center;border-radius:5px;color:#000;cursor:pointer;height:24px;margin-bottom:10px;margin-right:10px;padding:5px}.videoAlarmDia .body .alarmList .alarm img{height:16px;margin-right:5px;width:16px}.videoAlarmDia .body .alarmList .alarm .name{font-size:14px;white-space:nowrap}.videoAlarmDia .body .alarmList .alarm1{background:rgba(234,88,88,.1);color:#354052}.videoAlarmDia .body .alarmList .alarm2{background:rgba(255,146,20,.1);color:#354052}.videoAlarmDia .body .alarmList .alarm3{background:rgba(255,196,20,.1);color:#354052}.videoAlarmDia .body .alarmList .alarm4{background:rgba(62,126,255,.1);color:#354052}.videoAlarmDia .body .tip{align-items:center;display:flex;margin:0}.videoAlarmDia .body .tip .sumNum{margin-right:16px}.videoAlarmDia .body .tip .timeNum{color:#3e7eff;font-weight:600;margin-right:5px}.videoAlarmDia .body .tabs{align-items:center;display:flex;margin:10px 0 5px}.videoAlarmDia .body .tabs .themeImg{cursor:pointer;overflow:visible}.videoAlarmDia .body .tabs .endIcon{margin-left:10px}.videoAlarmDia .body .tabs .tabContainer{display:flex;overflow:hidden}.videoAlarmDia .body .tabs .tabContainer .allTab{display:flex;height:40px;left:0;position:relative}.videoAlarmDia .body .tabs .tabContainer .allTab .tab{background:#f2f3f8;border-radius:4px;cursor:pointer;font-size:14px;height:32px;line-height:32px;margin-right:10px;padding:0 10px;position:relative;text-align:center;white-space:nowrap}.videoAlarmDia .body .tabs .tabContainer .allTab .tab.active{background:#1d33a2;color:#fff}.videoAlarmDia .body .tabs .tabContainer .allTab .tab.active:after{border:10px solid transparent;border-top-color:#1d33a2;content:"";height:0;left:50%;position:absolute;top:30px;width:0}.videoAlarmDia .body .numLine{align-items:center;display:flex}.videoAlarmDia .body .numLine .cameraNum{color:#3e7eff;font-weight:600}.videoAlarmDia .body .numLine .tipImg{height:18px;margin:0 5px 0 25px;width:18px}.videoAlarmDia .body .numLine .alarmNum{color:#fa4141;font-weight:600}.videoAlarmDia .body .otherAlarm{align-items:center;display:flex}.videoAlarmDia .body .otherAlarm .ant-tag{cursor:pointer;font-size:14px}.videoAlarmDia .body .otherAlarm .tipImg{height:18px;margin-right:5px;width:18px}.videoAlarmDia .body .otherAlarm .annotation{height:12px;margin:2px;width:12px}.videoAlarmDia .body .type1{grid-template-columns:1fr;grid-template-rows:1fr}.videoAlarmDia .body .type4{grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr}.videoAlarmDia .body .type8{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}.videoAlarmDia .body .type8 .videoBox:first-child{grid-column:1/4;grid-row:1/4}.videoAlarmDia .body .type9{grid-template-columns:1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr}.videoAlarmDia .body .type13{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}.videoAlarmDia .body .type13 .videoBox:first-child{grid-column:1/3;grid-row:1/3}.videoAlarmDia .body .type16{grid-template-columns:1fr 1fr 1fr 1fr;grid-template-rows:1fr 1fr 1fr 1fr}
3
3
  .cloudVideo{height:100%;width:100%}.cloudVideo.noControl .mobile-ez-ptz-container{display:none!important}