Browse Source

优化小屏显示

handy 1 tháng trước cách đây
mục cha
commit
a1d993f822
1 tập tin đã thay đổi với 16 bổ sung23 xóa
  1. 16 23
      src/components/WarehouseMap.vue

+ 16 - 23
src/components/WarehouseMap.vue

@@ -385,13 +385,10 @@ const gridStyle = computed(() => {
   const compactSize = Math.min(baseCellWidth, baseCellHeight)
 
   const showGroup = compactSize > 58 ? 'block' : 'none'
-  const textFontSize = Math.max(compactSize <= 56 ? 8 : 9, 8)
-  const idFontSize = Math.max(
-    compactSize <= 34 ? 8 : compactSize <= 42 ? 9 : compactSize <= 56 ? 9 : 10,
-    9
-  )
-  const contentGap = compactSize <= 42 ? 1 : 3
-  const contentPadding = Math.max(compactSize <= 42 ? 1 : 3, 1)
+  const textFontSize = Math.max(Math.floor(compactSize / 6), 6)
+  const idFontSize = Math.max(Math.floor(compactSize / 4.2), 6)
+  const contentGap = compactSize <= 36 ? 0 : compactSize <= 48 ? 1 : 3
+  const contentPadding = Math.max(compactSize <= 36 ? 1 : compactSize <= 48 ? 2 : 3, 1)
   const groupBorderWidth = compactSize <= 34 ? 1 : 2
 
   return {
@@ -1220,11 +1217,9 @@ onBeforeUnmount(() => {
   font-size: var(--cell-group-font-size, 10px);
   color: var(--cell-group);
   text-align: center;
-  line-height: 1.2;
+  line-height: 1.15;
   word-break: break-all;
-  -webkit-box-orient: vertical;
-  -webkit-line-clamp: 2;
-  overflow: hidden;
+  white-space: normal;
 }
 
 .location-id {
@@ -1233,10 +1228,10 @@ onBeforeUnmount(() => {
   font-weight: bold;
   color: var(--cell-id);
   text-align: center;
-  line-height: 1.1;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
+  line-height: 1.05;
+  white-space: normal;
+  word-break: break-all;
+  padding: 0 1px;
 }
 
 .location-id.location-id-mismatch {
@@ -1252,10 +1247,9 @@ onBeforeUnmount(() => {
   font-size: calc(var(--cell-id-font-size, 11px) - 2px);
   color: var(--cell-alert);
   text-align: center;
-  line-height: 1.1;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
+  line-height: 1.05;
+  white-space: normal;
+  word-break: break-all;
 }
 
 .container-code {
@@ -1263,10 +1257,9 @@ onBeforeUnmount(() => {
   font-size: calc(var(--cell-id-font-size, 11px) - 2px);
   color: var(--cell-container);
   text-align: center;
-  line-height: 1.1;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
+  line-height: 1.05;
+  white-space: normal;
+  word-break: break-all;
 }
 
 .special-cell-label {