仓库、总库存、库存明细适配手机端

src/views/Home/Index.vue

@@ -256,4 +256,52 @@ getAllApi()
   text-overflow: ellipsis;
   white-space: nowrap;
 }
+
+
+/* 功能网格 */
+.mobile-home__grid {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  gap: 12px 6px;  // 网格间距变小
+  min-height: 100px;
+}
+
+.mobile-home__grid-item {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  gap: 4px;       // 图标和文字间距变小
+  cursor: pointer;
+  -webkit-tap-highlight-color: transparent;
+
+  &:active {
+    opacity: 0.7;
+  }
+}
+
+.mobile-home__grid-icon {
+  width: 65px;     // 图标变大
+  height: 65px;
+  border-radius: 14px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 26px; // 图标字体大小变大
+  transition: transform 0.2s;
+
+  &:active {
+    transform: scale(0.92);
+  }
+}
+
+.mobile-home__grid-label {
+  font-size: 12px; // 文字略大，可根据需求微调
+  color: #303133;
+  text-align: center;
+  line-height: 1.2;
+  max-width: 64px;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
 </style>