@dt-frames/ui 2.0.12 → 2.0.14

package/es/theme/index.less

@@ -36,6 +36,18 @@
 // table相关
 @table-action-icon-color: #999;
 
+// 小尺寸
+@small-font-size: 13px;
+@small-height: 30px;
+
+// 中尺寸
+@middle-font-size: 14px;
+@middle-height: 32px;
+
+// 大尺寸
+@large-font-size: 14px;
+@large-height: 34px;
+
 /* 滚动条美化 */
 ::-webkit-scrollbar {
     width: 7px;
@@ -59,8 +71,8 @@
 
 .ant-btn.ant-btn-sm,
 .ant-input-search-small .ant-btn.ant-btn-sm{
-	font-size: 13px;
-	height: 30px;
+	font-size: @small-font-size;
+	height: @small-height;
 	display: flex;
 	align-items: center;
 	justify-content: center;
@@ -68,8 +80,8 @@
 
 .dt-theme{
     .ant-input-sm:not(textarea){
-        height: 30px;
-		font-size: 12px;
+        height: @small-height;
+		font-size: @small-font-size;
     }
 
     .dt-theme-main {
@@ -83,8 +95,8 @@
     }
 
     .ant-btn-lg{
-        font-size: 14px;
-        height: 34px;
+        font-size: @large-font-size;
+        height: @large-height;
         display: flex;
         align-items: center;
     }
@@ -118,6 +130,12 @@
 		}
     }
 
+    .ant-avatar-string{
+        width: 100%;
+        height: 100%;
+        transform: scale(1) translateX(-50%) !important;
+    }
+
     .dt-sideBar{
         background: @menu-bg-color;
 
@@ -290,18 +308,23 @@
         }
     }
 
+    &-small{
+        font-size: @small-font-size;
+    }
+
     &-middle{
+        font-size: @middle-font-size;
         .dt-header-action {
             i {
                 font-size: 20px;
             }
             span{
-                font-size: 13px;
+                font-size: @middle-font-size;
             }
         }
 
         .dt-reuse-tabs .ant-tabs-card > .ant-tabs-nav .ant-tabs-tab span {
-            font-size: 13px;
+            font-size: @small-font-size;
         }
 
         .dt-reuse-tabs .ant-tabs-extra-content i{
@@ -309,20 +332,21 @@
         }  
         
         .ant-btn{
-            font-size: 13px;
+            font-size: @middle-font-size;
         }
     }
 
     &-large{
+        font-size: @large-font-size;
         .dt-sideBar .ant-menu .ant-menu-item, .dt-sideBar .ant-menu .ant-menu-submenu-title {
             height: 48px !important;
         }
         .dt-menu-item span{
-            font-size: 14px !important;
+            font-size: @large-font-size !important;
         }
 
         .dt-reuse-tabs .ant-tabs-card > .ant-tabs-nav .ant-tabs-tab span {
-            font-size: 13px;
+            font-size: @small-font-size;
         }
 
         .dt-reuse-tabs .ant-tabs-extra-content i{
@@ -804,6 +828,117 @@
     font-size: 13px;
 }
 
+.dt-lock-page{
+    bottom: 20vh;
+    left: 50vw;
+    height: 500px;
+    width: 300px;
+    transform: translateX(-50%);
+    &>div:first-of-type{
+        top: 20%;
+        width: 300px;
+    }
+
+    &>div:nth-of-type(2) {
+        width: 300px;
+        height: 400px;
+        filter: contrast(15) hue-rotate(0);
+        animation: hueRotate 10s infinite linear;
+    }
+
+    .circle{
+        width: 300px;
+        height: 300px;
+        filter: blur(8px);
+
+        &::after {
+            position: absolute;
+            top: 40%;
+            left: 50%;
+            width: 200px;
+            height: 200px;
+            background-color: #00ff6f;
+            border-radius: 42% 38% 62% 49% / 45%;
+            content: '';
+            transform: translate(-50%, -50%) rotate(0);
+            animation: circleRotate 10s infinite linear;
+        }
+  
+        &::before {
+            position: absolute;
+            top: 40%;
+            left: 50%;
+            z-index: 10;
+            width: 176px;
+            height: 176px;
+            background-color: #000;
+            border-radius: 50%;
+            content: '';
+            transform: translate(-50%, -50%);
+        }
+    }
+
+    .bubbles{
+        width: 100px;
+        height: 40px;
+        background-color: #00ff6f;
+        border-radius: 100px 100px 0 0;
+        filter: blur(5px);
+        transform: translate(-50%, 0);
+
+        li {
+            position: absolute;
+            background: #00ff6f;
+            border-radius: 50%;
+        }
+    }
+
+    .charging{
+        font-size: 20px;
+        text-align: center;
+    }
+}
+
+.lockscreen{
+    font-size: 34px;
+
+    .local-time{
+        bottom: 60px;
+        left: 60px;
+        font-family: helvetica;
+
+        .time {
+            font-size: 70px;
+        }
+    
+        .date {
+            font-size: 40px;
+        }
+    }
+
+    .computer-status{
+        bottom: 60px;
+        right: 60px;
+        font-size: 24px;
+
+        .network {
+            position: relative;
+    
+            &.offline::before {
+                content: '';
+                position: absolute;
+                left: 50%;
+                top: 50%;
+                width: 2px;
+                height: 28px;
+                transform: translate(-50%, -50%) rotate(45deg);
+                background-color: red;
+                z-index: 10;
+            }
+        }
+    }
+}
+
 @keyframes slideLeft {
     from {
         transform: translateX(-100%);
@@ -811,4 +946,20 @@
     to{
         transform: translateX(0);
     }
+}
+
+@keyframes circleRotate {
+    50% {
+        border-radius: 45% / 42% 38% 58% 49%;
+    }
+
+    100% {
+        transform: translate(-50%, -50%) rotate(720deg);
+    }
+}
+
+@keyframes hueRotate {
+    100% {
+        filter: contrast(15) hue-rotate(360deg);
+    }
 }

package/es/theme/src/components/header/components/lock/Lockscreen.d.ts

@@ -0,0 +1,54 @@
+declare const _sfc_main: import("vue").DefineComponent<{}, {
+    state: {
+        showLogin: boolean;
+        loginLoading: boolean;
+        isLoginError: boolean;
+        errorMsg: string;
+        loginParams: {
+            username: string;
+            password: string;
+        };
+    };
+    onLockLogin: (value: boolean) => boolean;
+    battery: import("vue").Ref<{
+        charging: boolean;
+        chargingTime: number;
+        dischargingTime: number;
+        level: number;
+    }>;
+    batteryStatus: import("vue").ComputedRef<"已充满" | "充电中" | "已断开电源">;
+    calcDischargingTime: import("vue").ComputedRef<string>;
+    calcChargingTime: import("vue").ComputedRef<string>;
+    Recharge: import("vue").DefineComponent<{
+        battery: {
+            type: ObjectConstructor;
+        };
+        calcDischargingTime: {
+            type: StringConstructor;
+        };
+        calcChargingTime: {
+            type: StringConstructor;
+        };
+        batteryStatus: {
+            type: StringConstructor;
+            validator: (val: string) => boolean;
+        };
+    }, {
+        props: any;
+    }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+        battery: {
+            type: ObjectConstructor;
+        };
+        calcDischargingTime: {
+            type: StringConstructor;
+        };
+        calcChargingTime: {
+            type: StringConstructor;
+        };
+        batteryStatus: {
+            type: StringConstructor;
+            validator: (val: string) => boolean;
+        };
+    }>>, {}>;
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{}>>, {}>;
+export default _sfc_main;

package/es/theme/src/components/header/components/lock/Recharge.d.ts

@@ -0,0 +1,32 @@
+declare const _sfc_main: import("vue").DefineComponent<{
+    battery: {
+        type: ObjectConstructor;
+    };
+    calcDischargingTime: {
+        type: StringConstructor;
+    };
+    calcChargingTime: {
+        type: StringConstructor;
+    };
+    batteryStatus: {
+        type: StringConstructor;
+        validator: (val: string) => boolean;
+    };
+}, {
+    props: any;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    battery: {
+        type: ObjectConstructor;
+    };
+    calcDischargingTime: {
+        type: StringConstructor;
+    };
+    calcChargingTime: {
+        type: StringConstructor;
+    };
+    batteryStatus: {
+        type: StringConstructor;
+        validator: (val: string) => boolean;
+    };
+}>>, {}>;
+export default _sfc_main;

package/es/theme/src/components/header/components/lock/index.d.ts

@@ -0,0 +1,3 @@
+import { default as Recharge } from "./Recharge";
+import { default as LockScreen } from "./Lockscreen";
+export { Recharge, LockScreen };

package/es/theme/src/components/header/components/lock/useBattery.d.ts

@@ -0,0 +1,11 @@
+export declare function useBattery(): {
+    batteryStatus: import("vue").ComputedRef<"已充满" | "充电中" | "已断开电源">;
+    calcDischargingTime: import("vue").ComputedRef<string>;
+    calcChargingTime: import("vue").ComputedRef<string>;
+    battery: import("vue").Ref<{
+        charging: boolean;
+        chargingTime: number;
+        dischargingTime: number;
+        level: number;
+    }>;
+};

package/es/theme/src/components/header/components/logo.d.ts

@@ -16,9 +16,7 @@ declare const _sfc_main: import("vue").DefineComponent<{
         (key: string, list: unknown[]): string;
         (key: string, named: Record<string, unknown>): string;
     };
-    slots: {
-        [name: string]: import("vue").Slot;
-    };
+    slots: import("vue").Ref<any>;
     title: string;
     getLogoWidth: import("vue").ComputedRef<string | number>;
     props: any;

package/es/theme/src/components/header/components/notify.d.ts

@@ -1,7 +1,5 @@
 declare const _sfc_main: import("vue").DefineComponent<{}, {
-    slots: {
-        [name: string]: import("vue").Slot;
-    };
+    slots: import("vue").Ref<any>;
     readonly DtSlotContainer: import("../../../../../utils/withInstall").SFCWithInstall<import("vue").DefineComponent<{
         template: {
             type: FunctionConstructor;

package/es/theme/src/components/header/components/user-info.d.ts

@@ -9,12 +9,12 @@ declare const _sfc_main: import("vue").DefineComponent<{}, {
     };
     go: (path: string, isReplace?: boolean) => void;
     getShowLoginOut: import("vue").ComputedRef<boolean>;
+    getLockscreen: import("vue").ComputedRef<boolean>;
     loginOutClick: () => {};
-    slots: {
-        [name: string]: import("vue").Slot;
-    };
+    slots: import("vue").Ref<any>;
     getUserInfo: any;
     signOut: () => void;
+    lockScreen: () => void;
     readonly DtSlotContainer: import("../../../../../utils/withInstall").SFCWithInstall<import("vue").DefineComponent<{
         template: {
             type: FunctionConstructor;