<script setup>
import { getCurrentInstance, onMounted, ref } from 'vue';
import { useRouter, useRoute } from 'vue-router';

/* 返回上一级页面 */
const router = useRouter()

const route = useRoute()
const resourcesInfo = route.query.resourcesInfo ? JSON.parse(route.query.resourcesInfo) : ''

</script>

<template>
  <div class="page-container">
    <van-sticky>
      <van-nav-bar title="应急物资查询" />
    </van-sticky>

    <div class="scroll-container">
      <van-form label-width="8em">
        <van-field
          readonly
          v-model="resourcesInfo.resourceName"
          label="物资名称"
        />
        <van-field
          readonly
          v-model="resourcesInfo.resourceType"
          label="物资类别"
        />
        <van-field
          readonly
          v-model="resourcesInfo.resourceModel"
          label="型号"
        />
        <van-field
          readonly
          v-model="resourcesInfo.quantity"
          label="数量"
        />
        <van-field
          readonly
          v-model="resourcesInfo.unit"
          label="计量单位"
        />
        <van-field
          readonly
          v-model="resourcesInfo.useDesc"
          label="功能用途"
        />
        <van-field
          readonly
          v-model="resourcesInfo.address"
          label="存储地址"
        />
        <van-field
          readonly
          v-model="resourcesInfo.linkPerson"
          label="联系人"
        />
        <van-field
          readonly
          v-model="resourcesInfo.linkDept"
          label="责任单位"
        />
        <van-field
          readonly
          v-model="resourcesInfo.linkPhone"
          label="联系电话"
        />
        <van-field
          readonly
          v-model="resourcesInfo.accidentType"
          label="应对事故类型"
        />
        <van-field
          readonly
          v-model="resourcesInfo.checkDate"
          label="上次审验时间"
        />
        <van-field
          readonly
          v-model="resourcesInfo.checkCycle"
          label="审验周期(年-月)"
        />
        <van-field
          readonly
          v-model="resourcesInfo.checkNextDate"
          label="下次审验时间"
        />
      </van-form>
    </div>

  </div>
</template>

<style scoped>
.page-container {
  height: 100vh; /* 关键：外层容器高度设为视口高度 */
  display: flex;
  flex-direction: column;

}
/*  overflow-y: auto; !* 启用垂直滚动 *!*/


.scroll-container {
  flex: 1;
  overflow: auto;
  -webkit-overflow-scrolling: touch; /* iOS 平滑滚动 */
}

/* 可选：隐藏滚动条（视觉优化） */
.scroll-container::-webkit-scrollbar {
  display: none;
}
</style>
