bxztApp/packages/mobile/src/views/Home.vue

<template>
  <div class="home">
    <van-nav-bar title="愉快政" fixed left-arrow />

    <van-cell-group>
      <van-cell title="当前站点" value="李家坝仓库" />
    </van-cell-group>

    <div class="content">
      <van-grid :gutter="10" :column-num="3" class="grid">
        <van-grid-item icon="setting-o" text="设备管理" to="/EquipManage" />
        <van-grid-item
          icon="setting-o"
          text="物资管理"
          to="/MaterialManage"
        />
        <van-grid-item
          icon="setting-o"
          text="人员管理"
          @click="showToast('人员管理')"
        />
        <van-grid-item
          icon="setting-o"
          text="冰雪灾害"
          @click="showToast('冰雪灾害')"
        />
      </van-grid>
    </div>

    <!-- <van-tabbar v-model="active" route>
      <van-tabbar-item icon="home-o" to="/">首页</van-tabbar-item>
      <van-tabbar-item icon="user-o" to="/user">我的</van-tabbar-item>
    </van-tabbar> -->
  </div>
</template>

<script setup>
import { ref } from "vue";
import { useRouter } from "vue-router";
import { showToast } from "vant";

const router = useRouter();
const active = ref(0);

const goToUser = () => {
  router.push("/user");
};
</script>

<style scoped>
.home {
  padding-top: var(--van-nav-bar-height); /* 自动匹配导航栏高度 */
}

.content {
  padding: 16px;
}

.grid {
  margin-top: 16px;
}

.btn {
  margin-top: 24px;
}
</style>