@vtx/modals2 2.15.48 → 2.15.49

package/lib/vtx-facility-modal/components/OverView/index.less

@@ -1,120 +1,120 @@
-@import '../../style/index';
-
-.@{prefix-cls}-overview {
-    display: flex;
-    gap: 10px;
-    height: 716px;
-    &-left {
-        position: relative;
-        height: 716px;
-        width: 470px;
-        padding: 10px;
-        &-map {
-            height: 690px;
-        }
-        &-legend {
-            position: absolute;
-            left: 10px;
-            bottom: 10px;
-            max-width: 120px;
-            min-height: 32px;
-            overflow-y: auto;
-            z-index: 99;
-            background: linear-gradient(0deg, #0a3a62, #03213f);
-            border: 1px solid #516176;
-            border-radius: 6px;
-            color: #fff;
-        }
-    }
-    &-legendItem {
-        width: 100%;
-        display: inline-flex;
-        align-items: center;
-        padding: 4px 8px;
-    }
-    &-icon {
-        width: 16px;
-        height: 16px;
-        display: flex;
-        align-items: center;
-    }
-    &-iconColor {
-        width: 100%;
-        height: 100%;
-    }
-    &-name {
-        margin-left: 4px;
-    }
-    &-right {
-        flex: 1;
-        overflow-y: auto;
-        &-base {
-            margin: 10px 10px 10px 0;
-            padding: 10px 0 10px 10px;
-            background: var(--bg-color2);
-            border: 1px solid var(--bg-border-color2);
-        }
-        &-basic {
-            height: 140px;
-            overflow-y: auto;
-            .info-line {
-                width: 45% !important;
-            }
-        }
-        &-work {
-            margin: 10px 10px 10px 0;
-            padding: 10px 0 10px 10px;
-            background: var(--bg-color2);
-            border: 1px solid var(--bg-border-color2);
-
-            .label {
-                color: var(--label-color);
-                white-space: nowrap;
-            }
-        }
-        &-item {
-            min-height: 36px;
-            overflow-y: auto;
-            .info-line {
-                width: 45% !important;
-            }
-        }
-
-        &-list {
-            display: flex;
-            flex-wrap: wrap;
-        }
-        &-listItem {
-            width: 100%;
-        }
-        &-bottom {
-            display: flex;
-            display: flex;
-            flex-wrap: wrap;
-            height: 30px;
-            line-height: 30px;
-        }
-        &-bottomItem {
-            width: 50%;
-            display: flex;
-        }
-        &-title {
-            color: var(--label-color);
-            white-space: nowrap;
-        }
-        &-num {
-            color: var(--info-color);
-            font-weight: 400;
-            min-width: 98px;
-        }
-        &-img {
-            width: 30px;
-        }
-        &-table {
-            margin: 10px 10px 10px 0;
-            padding: 10px 0 10px 10px;
-            background: var(--bg-color2);
-            border: 1px solid var(--bg-border-color2);
-        }
-    }
-}
+@import '../../style/index';
+
+.@{prefix-cls}-overview {
+    display: flex;
+    gap: 10px;
+    height: 716px;
+    &-left {
+        position: relative;
+        height: 716px;
+        width: 470px;
+        padding: 10px;
+        &-map {
+            height: 690px;
+        }
+        &-legend {
+            position: absolute;
+            left: 10px;
+            bottom: 10px;
+            max-width: 120px;
+            min-height: 32px;
+            overflow-y: auto;
+            z-index: 99;
+            background: linear-gradient(0deg, #0a3a62, #03213f);
+            border: 1px solid #516176;
+            border-radius: 6px;
+            color: #fff;
+        }
+    }
+    &-legendItem {
+        width: 100%;
+        display: inline-flex;
+        align-items: center;
+        padding: 4px 8px;
+    }
+    &-icon {
+        width: 16px;
+        height: 16px;
+        display: flex;
+        align-items: center;
+    }
+    &-iconColor {
+        width: 100%;
+        height: 100%;
+    }
+    &-name {
+        margin-left: 4px;
+    }
+    &-right {
+        flex: 1;
+        overflow-y: auto;
+        &-base {
+            margin: 10px 10px 10px 0;
+            padding: 10px 0 10px 10px;
+            background: var(--bg-color2);
+            border: 1px solid var(--bg-border-color2);
+        }
+        &-basic {
+            height: 140px;
+            overflow-y: auto;
+            .info-line {
+                width: 45% !important;
+            }
+        }
+        &-work {
+            margin: 10px 10px 10px 0;
+            padding: 10px 0 10px 10px;
+            background: var(--bg-color2);
+            border: 1px solid var(--bg-border-color2);
+
+            .label {
+                color: var(--label-color);
+                white-space: nowrap;
+            }
+        }
+        &-item {
+            min-height: 36px;
+            overflow-y: auto;
+            .info-line {
+                width: 45% !important;
+            }
+        }
+
+        &-list {
+            display: flex;
+            flex-wrap: wrap;
+        }
+        &-listItem {
+            width: 100%;
+        }
+        &-bottom {
+            display: flex;
+            display: flex;
+            flex-wrap: wrap;
+            height: 30px;
+            line-height: 30px;
+        }
+        &-bottomItem {
+            width: 50%;
+            display: flex;
+        }
+        &-title {
+            color: var(--label-color);
+            white-space: nowrap;
+        }
+        &-num {
+            color: var(--info-color);
+            font-weight: 400;
+            min-width: 98px;
+        }
+        &-img {
+            width: 30px;
+        }
+        &-table {
+            margin: 10px 10px 10px 0;
+            padding: 10px 0 10px 10px;
+            background: var(--bg-color2);
+            border: 1px solid var(--bg-border-color2);
+        }
+    }
+}

package/lib/vtx-facility-modal/config.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getColor = exports.OverViewTRFields = exports.OverViewLHDorHDFields = void 0;
+exports.getSpanColorByRate = exports.getColorByRate = exports.getColor = exports.OverViewTRFields = exports.OverViewLHDorHDFields = void 0;
 var OverViewLHDorHDFields = exports.OverViewLHDorHDFields = [
 // 绿化或河道的基本信息
 {
@@ -62,4 +62,34 @@ var getColor = exports.getColor = function getColor(bh) {
   if (bh.search('hp') !== -1) return colors[6];
   if (bh.search('lh') !== -1) return colors[7];
 };
+var getColorByRate = exports.getColorByRate = function getColorByRate(bh) {
+  var color = '';
+  if (!bh) {
+    color = 'rgba(228, 228, 228, 1)';
+  } else if (bh > 0 && bh <= 50) {
+    color = 'rgba(251, 109, 90, 1)';
+  } else if (bh > 50 && bh <= 80) {
+    color = 'rgba(255, 204, 0, 1)';
+  } else if (bh > 80 && bh < 100) {
+    color = 'rgba(91, 143, 249, 1)';
+  } else if (bh >= 100) {
+    color = 'rgba(90, 216, 166, 1)';
+  }
+  return color;
+};
+var getSpanColorByRate = exports.getSpanColorByRate = function getSpanColorByRate(bh) {
+  var color = '';
+  if (!bh) {
+    color = 'rgba(228, 228, 228, 1)';
+  } else if (bh > 0 && bh <= 50) {
+    color = 'rgba(251, 109, 90, 1)';
+  } else if (bh > 50 && bh <= 80) {
+    color = 'rgba(255, 204, 0, 1)';
+  } else if (bh > 80 && bh < 100) {
+    color = 'rgba(91, 143, 249, 1)';
+  } else if (bh >= 100) {
+    color = 'rgba(90, 216, 166, 1)';
+  }
+  return color;
+};
 //# sourceMappingURL=config.js.map

package/lib/vtx-facility-modal/config.js.map

@@ -1 +1 @@
-{"version":3,"file":"config.js","names":["OverViewLHDorHDFields","exports","key","label","OverViewTRFields","getColor","bh","colors","search"],"sources":["vtx-facility-modal/config.js"],"sourcesContent":["export const OverViewLHDorHDFields = [\n    // 绿化或河道的基本信息\n    {\n        key: 'tenderName',\n        label: '所属标段',\n    },\n    {\n        key: 'manageUnitName',\n        label: '作业单位',\n    },\n    {\n        key: 'typeName',\n        label: '作业类型',\n    },\n    {\n        key: 'facilityLength',\n        label: '长度（m）',\n    },\n    {\n        key: 'facilityWidth',\n        label: '宽度（m）',\n    },\n    {\n        key: 'facilityArea',\n        label: '面积（㎡）',\n    },\n];\nexport const OverViewTRFields = [\n    // 主要干道\n    {\n        key: 'facilityClassName',\n        label: '道路等级',\n    },\n    {\n        key: 'typeName',\n        label: '作业类型',\n    },\n    {\n        key: 'tenderName',\n        label: '所属标段',\n    },\n    {\n        key: 'manageUnitName',\n        label: '作业单位',\n    },\n    {\n        key: 'facilityLength',\n        label: '长度（m）',\n    },\n    {\n        key: 'facilityWidth',\n        label: '宽度（m）',\n    },\n    {\n        key: 'facilityArea',\n        label: '面积（㎡）',\n    },\n];\nexport const getColor = (bh) => {\n    if (!bh)\n        return;\n    // 不同设施类型颜色区分\n    const colors = [\n        '#FFDCB8',\n        '#E95439',\n        '#FFF700',\n        '#3D27F6',\n        '#1CD64E',\n        '#00CBFF',\n        '#BE9860',\n        'green',\n    ];\n    if (bh.search('tr') !== -1)\n        return colors[0];\n    if (bh.search('rxd') !== -1)\n        return colors[1];\n    if (bh.search('jdcd') !== -1)\n        return colors[2];\n    if (bh.search('fjdcd') !== -1)\n        return colors[3];\n    if (bh.search('glss') !== -1)\n        return colors[4];\n    if (bh.search('hd') !== -1)\n        return colors[5];\n    if (bh.search('hp') !== -1)\n        return colors[6];\n    if (bh.search('lh') !== -1)\n        return colors[7];\n};\n"],"mappings":";;;;;;AAAO,IAAMA,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAG;AACjC;AACA;EACIE,GAAG,EAAE,YAAY;EACjBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,gBAAgB;EACrBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,UAAU;EACfC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,gBAAgB;EACrBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,eAAe;EACpBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,cAAc;EACnBC,KAAK,EAAE;AACX,CAAC,CACJ;AACM,IAAMC,gBAAgB,GAAAH,OAAA,CAAAG,gBAAA,GAAG;AAC5B;AACA;EACIF,GAAG,EAAE,mBAAmB;EACxBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,UAAU;EACfC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,YAAY;EACjBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,gBAAgB;EACrBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,gBAAgB;EACrBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,eAAe;EACpBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,cAAc;EACnBC,KAAK,EAAE;AACX,CAAC,CACJ;AACM,IAAME,QAAQ,GAAAJ,OAAA,CAAAI,QAAA,GAAG,SAAXA,QAAQA,CAAIC,EAAE,EAAK;EAC5B,IAAI,CAACA,EAAE,EACH;EACJ;EACA,IAAMC,MAAM,GAAG,CACX,SAAS,EACT,SAAS,EACT,SAAS,EACT,SAAS,EACT,SAAS,EACT,SAAS,EACT,SAAS,EACT,OAAO,CACV;EACD,IAAID,EAAE,CAACE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EACtB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EACvB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EACxB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EACzB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EACxB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EACtB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EACtB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EACtB,OAAOD,MAAM,CAAC,CAAC,CAAC;AACxB,CAAC","ignoreList":[]}
+{"version":3,"file":"config.js","names":["OverViewLHDorHDFields","exports","key","label","OverViewTRFields","getColor","bh","colors","search","getColorByRate","color","getSpanColorByRate"],"sources":["vtx-facility-modal/config.js"],"sourcesContent":["export const OverViewLHDorHDFields = [\n    // 绿化或河道的基本信息\n    {\n        key: 'tenderName',\n        label: '所属标段',\n    },\n    {\n        key: 'manageUnitName',\n        label: '作业单位',\n    },\n    {\n        key: 'typeName',\n        label: '作业类型',\n    },\n    {\n        key: 'facilityLength',\n        label: '长度（m）',\n    },\n    {\n        key: 'facilityWidth',\n        label: '宽度（m）',\n    },\n    {\n        key: 'facilityArea',\n        label: '面积（㎡）',\n    },\n];\nexport const OverViewTRFields = [\n    // 主要干道\n    {\n        key: 'facilityClassName',\n        label: '道路等级',\n    },\n    {\n        key: 'typeName',\n        label: '作业类型',\n    },\n    {\n        key: 'tenderName',\n        label: '所属标段',\n    },\n    {\n        key: 'manageUnitName',\n        label: '作业单位',\n    },\n    {\n        key: 'facilityLength',\n        label: '长度（m）',\n    },\n    {\n        key: 'facilityWidth',\n        label: '宽度（m）',\n    },\n    {\n        key: 'facilityArea',\n        label: '面积（㎡）',\n    },\n];\nexport const getColor = (bh) => {\n    if (!bh)\n        return;\n    // 不同设施类型颜色区分\n    const colors = [\n        '#FFDCB8',\n        '#E95439',\n        '#FFF700',\n        '#3D27F6',\n        '#1CD64E',\n        '#00CBFF',\n        '#BE9860',\n        'green',\n    ];\n    if (bh.search('tr') !== -1)\n        return colors[0];\n    if (bh.search('rxd') !== -1)\n        return colors[1];\n    if (bh.search('jdcd') !== -1)\n        return colors[2];\n    if (bh.search('fjdcd') !== -1)\n        return colors[3];\n    if (bh.search('glss') !== -1)\n        return colors[4];\n    if (bh.search('hd') !== -1)\n        return colors[5];\n    if (bh.search('hp') !== -1)\n        return colors[6];\n    if (bh.search('lh') !== -1)\n        return colors[7];\n};\nexport const getColorByRate = (bh) => {\n    let color = '';\n    if (!bh) {\n        color = 'rgba(228, 228, 228, 1)';\n    }\n    else if (bh > 0 && bh <= 50) {\n        color = 'rgba(251, 109, 90, 1)';\n    }\n    else if (bh > 50 && bh <= 80) {\n        color = 'rgba(255, 204, 0, 1)';\n    }\n    else if (bh > 80 && bh < 100) {\n        color = 'rgba(91, 143, 249, 1)';\n    }\n    else if (bh >= 100) {\n        color = 'rgba(90, 216, 166, 1)';\n    }\n    return color;\n};\nexport const getSpanColorByRate = (bh) => {\n    let color = '';\n    if (!bh) {\n        color = 'rgba(228, 228, 228, 1)';\n    }\n    else if (bh > 0 && bh <= 50) {\n        color = 'rgba(251, 109, 90, 1)';\n    }\n    else if (bh > 50 && bh <= 80) {\n        color = 'rgba(255, 204, 0, 1)';\n    }\n    else if (bh > 80 && bh < 100) {\n        color = 'rgba(91, 143, 249, 1)';\n    }\n    else if (bh >= 100) {\n        color = 'rgba(90, 216, 166, 1)';\n    }\n    return color;\n};\n"],"mappings":";;;;;;AAAO,IAAMA,qBAAqB,GAAAC,OAAA,CAAAD,qBAAA,GAAG;AACjC;AACA;EACIE,GAAG,EAAE,YAAY;EACjBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,gBAAgB;EACrBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,UAAU;EACfC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,gBAAgB;EACrBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,eAAe;EACpBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,cAAc;EACnBC,KAAK,EAAE;AACX,CAAC,CACJ;AACM,IAAMC,gBAAgB,GAAAH,OAAA,CAAAG,gBAAA,GAAG;AAC5B;AACA;EACIF,GAAG,EAAE,mBAAmB;EACxBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,UAAU;EACfC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,YAAY;EACjBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,gBAAgB;EACrBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,gBAAgB;EACrBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,eAAe;EACpBC,KAAK,EAAE;AACX,CAAC,EACD;EACID,GAAG,EAAE,cAAc;EACnBC,KAAK,EAAE;AACX,CAAC,CACJ;AACM,IAAME,QAAQ,GAAAJ,OAAA,CAAAI,QAAA,GAAG,SAAXA,QAAQA,CAAIC,EAAE,EAAK;EAC5B,IAAI,CAACA,EAAE,EACH;EACJ;EACA,IAAMC,MAAM,GAAG,CACX,SAAS,EACT,SAAS,EACT,SAAS,EACT,SAAS,EACT,SAAS,EACT,SAAS,EACT,SAAS,EACT,OAAO,CACV;EACD,IAAID,EAAE,CAACE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EACtB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,KAAK,CAAC,KAAK,CAAC,CAAC,EACvB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EACxB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,CAAC,EACzB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,EACxB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EACtB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EACtB,OAAOD,MAAM,CAAC,CAAC,CAAC;EACpB,IAAID,EAAE,CAACE,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EACtB,OAAOD,MAAM,CAAC,CAAC,CAAC;AACxB,CAAC;AACM,IAAME,cAAc,GAAAR,OAAA,CAAAQ,cAAA,GAAG,SAAjBA,cAAcA,CAAIH,EAAE,EAAK;EAClC,IAAII,KAAK,GAAG,EAAE;EACd,IAAI,CAACJ,EAAE,EAAE;IACLI,KAAK,GAAG,wBAAwB;EACpC,CAAC,MACI,IAAIJ,EAAE,GAAG,CAAC,IAAIA,EAAE,IAAI,EAAE,EAAE;IACzBI,KAAK,GAAG,uBAAuB;EACnC,CAAC,MACI,IAAIJ,EAAE,GAAG,EAAE,IAAIA,EAAE,IAAI,EAAE,EAAE;IAC1BI,KAAK,GAAG,sBAAsB;EAClC,CAAC,MACI,IAAIJ,EAAE,GAAG,EAAE,IAAIA,EAAE,GAAG,GAAG,EAAE;IAC1BI,KAAK,GAAG,uBAAuB;EACnC,CAAC,MACI,IAAIJ,EAAE,IAAI,GAAG,EAAE;IAChBI,KAAK,GAAG,uBAAuB;EACnC;EACA,OAAOA,KAAK;AAChB,CAAC;AACM,IAAMC,kBAAkB,GAAAV,OAAA,CAAAU,kBAAA,GAAG,SAArBA,kBAAkBA,CAAIL,EAAE,EAAK;EACtC,IAAII,KAAK,GAAG,EAAE;EACd,IAAI,CAACJ,EAAE,EAAE;IACLI,KAAK,GAAG,wBAAwB;EACpC,CAAC,MACI,IAAIJ,EAAE,GAAG,CAAC,IAAIA,EAAE,IAAI,EAAE,EAAE;IACzBI,KAAK,GAAG,uBAAuB;EACnC,CAAC,MACI,IAAIJ,EAAE,GAAG,EAAE,IAAIA,EAAE,IAAI,EAAE,EAAE;IAC1BI,KAAK,GAAG,sBAAsB;EAClC,CAAC,MACI,IAAIJ,EAAE,GAAG,EAAE,IAAIA,EAAE,GAAG,GAAG,EAAE;IAC1BI,KAAK,GAAG,uBAAuB;EACnC,CAAC,MACI,IAAIJ,EAAE,IAAI,GAAG,EAAE;IAChBI,KAAK,GAAG,uBAAuB;EACnC;EACA,OAAOA,KAAK;AAChB,CAAC","ignoreList":[]}

package/lib/vtx-facility-modal/style/index.less

@@ -1 +1 @@
-@prefix-cls: facility;
+@prefix-cls: facility;

package/lib/vtx-housing-estate-modal/components/Alarm/index.less

@@ -1,66 +1,66 @@
-@import '../../style/index';
-
-.@{prefix-cls}-alarm {
-    height: 800px;
-    padding: 10px;
-    padding-top: 0;
-    &-ldb {
-        height: 768px;
-        display: grid;
-        grid-template-columns: 1fr 1fr;
-        grid-template-rows: 1fr 1fr;
-        gap: 10px;
-        &-item {
-            background: var(--bg-color2);
-            padding: 10px;
-            display: flex;
-            flex-direction: column;
-        }
-        &-item2 {
-            display: flex;
-            flex-direction: column;
-            gap: 10px;
-            & > div {
-                padding: 10px;
-                flex: 1;
-                background: var(--bg-color2);
-            }
-        }
-    }
-    .black-rank {
-        display: flex;
-        align-items: center;
-        gap: 10px;
-        padding-left: 50px;
-        padding-right: 20px;
-        color: var(--info-color);
-        background: url('../../imgs/rank-bg.png') no-repeat;
-        background-size: 100% 100%;
-        &-name {
-            font-size: 16px;
-        }
-        &-progress {
-            width: 200px;
-            height: 4px;
-            position: relative;
-            background-color: rgba(255, 255, 255, 0.2);
-            border-right: 2px;
-            &--active {
-                position: absolute;
-                top: 0;
-                left: 0;
-                bottom: 0;
-                background: linear-gradient(90deg, #1b89ff, #51f2ff);
-                border-radius: 2px;
-            }
-        }
-        &-rank {
-            font-size: 24px;
-            color: #4debff;
-            margin-right: 4px;
-        }
-        &-total {
-            margin-left: 4px;
-        }
-    }
-}
+@import '../../style/index';
+
+.@{prefix-cls}-alarm {
+    height: 800px;
+    padding: 10px;
+    padding-top: 0;
+    &-ldb {
+        height: 768px;
+        display: grid;
+        grid-template-columns: 1fr 1fr;
+        grid-template-rows: 1fr 1fr;
+        gap: 10px;
+        &-item {
+            background: var(--bg-color2);
+            padding: 10px;
+            display: flex;
+            flex-direction: column;
+        }
+        &-item2 {
+            display: flex;
+            flex-direction: column;
+            gap: 10px;
+            & > div {
+                padding: 10px;
+                flex: 1;
+                background: var(--bg-color2);
+            }
+        }
+    }
+    .black-rank {
+        display: flex;
+        align-items: center;
+        gap: 10px;
+        padding-left: 50px;
+        padding-right: 20px;
+        color: var(--info-color);
+        background: url('../../imgs/rank-bg.png') no-repeat;
+        background-size: 100% 100%;
+        &-name {
+            font-size: 16px;
+        }
+        &-progress {
+            width: 200px;
+            height: 4px;
+            position: relative;
+            background-color: rgba(255, 255, 255, 0.2);
+            border-right: 2px;
+            &--active {
+                position: absolute;
+                top: 0;
+                left: 0;
+                bottom: 0;
+                background: linear-gradient(90deg, #1b89ff, #51f2ff);
+                border-radius: 2px;
+            }
+        }
+        &-rank {
+            font-size: 24px;
+            color: #4debff;
+            margin-right: 4px;
+        }
+        &-total {
+            margin-left: 4px;
+        }
+    }
+}