inl-ui 0.1.51 → 0.1.52

package/README.md

@@ -1,49 +1,49 @@
-# 工业PC ui库
-
-前端通用库，包括组件、hooks、utils等。
-
-### 运行
-
-+ 开发模式 yarn dev
-+ 生产打包 yarn build
-+ 生成文档 yarn build:docs
-+ 打包图扑工具 yarn buildtp
-
-### 使用方法
-
-```javascript
-import inl from 'inl-ui';
-import 'inl-ui/dist/style.css';
-
-vue.use(inl)
-```
-
-
-
-### 激活主题
-
-**vite.config.ts**
-
-```javascript
-const additionalData = require("inl-ui/dist/theme").default;
-
-...
-
-css: {
-  preprocessorOptions: {
-    less: {
-      javascriptEnabled: true,
-      additionalData,
-    },
-  },
-},
-```
-
-### 文档链接
-
-##### [组件文档](./src/components/README.md)
-
-##### [hooks文档](./src/hooks/README.md)
-
-##### [Utils文档](./src/utils/README.md)
-
+# 工业PC ui库
+
+前端通用库，包括组件、hooks、utils等。
+
+### 运行
+
++ 开发模式 yarn dev
++ 生产打包 yarn build
++ 生成文档 yarn build:docs
++ 打包图扑工具 yarn buildtp
+
+### 使用方法
+
+```javascript
+import inl from 'inl-ui';
+import 'inl-ui/dist/style.css';
+
+vue.use(inl)
+```
+
+
+
+### 激活主题
+
+**vite.config.ts**
+
+```javascript
+const additionalData = require("inl-ui/dist/theme").default;
+
+...
+
+css: {
+  preprocessorOptions: {
+    less: {
+      javascriptEnabled: true,
+      additionalData,
+    },
+  },
+},
+```
+
+### 文档链接
+
+##### [组件文档](./src/components/README.md)
+
+##### [hooks文档](./src/hooks/README.md)
+
+##### [Utils文档](./src/utils/README.md)
+

package/dist/components/index.cjs

@@ -6461,20 +6461,15 @@ function useMicroApp(appList) {
         entry: microAppDefine.entry,
         container: `#${domId}`
       });
-      const microApp = vue.ref({
+      const microApp = {
         name: microAppName,
         domId,
         app,
-        mounted: true,
-        loading: true
-      });
-      loadAppList.value.push(microApp.value);
-      loadedApp.set(microAppName, microApp.value);
-      try {
-        await app.mountPromise;
-      } finally {
-        microApp.value.loading = false;
-      }
+        mounted: true
+      };
+      loadAppList.value.push(microApp);
+      loadedApp.set(microAppName, microApp);
+      await app.mountPromise;
     }, 10);
   }, 100);
   vue.watch(route, handleRouteChange, {
@@ -7175,16 +7170,10 @@ const PageContent = vue.defineComponent({
         fullscreen: isFullscreen.value
       }],
       "ref": props.pageContainerRef
-    }, [appDomList.value.map(item => {
-      const microApp = loadAppList.value.find(a => a.domId === item.id);
-      return vue.withDirectives(vue.createVNode("div", {
-        "key": item.id,
-        "id": item.id,
-        "class": {
-          loading: microApp && microApp.loading
-        }
-      }, null), [[vue.vShow, item.name === activeAppName.value]]);
-    }), iframeList.value.map(item => {
+    }, [appDomList.value.map(item => vue.withDirectives(vue.createVNode("div", {
+      "key": item.id,
+      "id": item.id
+    }, null), [[vue.vShow, item.name === activeAppName.value]])), iframeList.value.map(item => {
       const show = item.id === activeKey.value;
       if (item.reqCode === 200 || item.reqCode === void 0) {
         return vue.createVNode("iframe", {

package/dist/components/index.js

@@ -6450,20 +6450,15 @@ function useMicroApp(appList) {
         entry: microAppDefine.entry,
         container: `#${domId}`
       });
-      const microApp = ref({
+      const microApp = {
         name: microAppName,
         domId,
         app,
-        mounted: true,
-        loading: true
-      });
-      loadAppList.value.push(microApp.value);
-      loadedApp.set(microAppName, microApp.value);
-      try {
-        await app.mountPromise;
-      } finally {
-        microApp.value.loading = false;
-      }
+        mounted: true
+      };
+      loadAppList.value.push(microApp);
+      loadedApp.set(microAppName, microApp);
+      await app.mountPromise;
     }, 10);
   }, 100);
   watch(route, handleRouteChange, {
@@ -7164,16 +7159,10 @@ const PageContent = defineComponent({
         fullscreen: isFullscreen.value
       }],
       "ref": props.pageContainerRef
-    }, [appDomList.value.map(item => {
-      const microApp = loadAppList.value.find(a => a.domId === item.id);
-      return withDirectives(createVNode("div", {
-        "key": item.id,
-        "id": item.id,
-        "class": {
-          loading: microApp && microApp.loading
-        }
-      }, null), [[vShow, item.name === activeAppName.value]]);
-    }), iframeList.value.map(item => {
+    }, [appDomList.value.map(item => withDirectives(createVNode("div", {
+      "key": item.id,
+      "id": item.id
+    }, null), [[vShow, item.name === activeAppName.value]])), iframeList.value.map(item => {
       const show = item.id === activeKey.value;
       if (item.reqCode === 200 || item.reqCode === void 0) {
         return createVNode("iframe", {

package/dist/components/style.css

@@ -1,3 +1,3 @@
-.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}
+.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}
 .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}
 .cloudVideo{height:100%;width:100%}.cloudVideo.noControl .mobile-ez-ptz-container{display:none!important}