<template>
  <div class="detail-container">
    <el-form
      ref="formRef"
      label-position="right"
      label-width="150px"
      style="max-height: 60vh; overflow-y: auto; padding-right: 50px"
    >
      <el-form-item label="所属服务站：">
        <span>{{ yhzData.rawName }}</span>
      </el-form-item>
      <el-form-item label="物资名称：">
        <el-input
          maxlength="20"
          show-word-limit
          v-model="form.material.wzmc"
        ></el-input>
      </el-form-item>
      <el-form-item label="数量与单位：">
        <el-row :gutter="20">
          <el-col :span="16">
            <el-input
              v-model="form.material.sl"
              type="number"
              placeholder="请输入数量"
            ></el-input>
          </el-col>
          <el-col :span="8">
            <el-select
              v-model="form.material.dw"
              filterable
              allow-create
              clearable
              placeholder="选择单位"
            >
              <el-option label="个" value="个"></el-option>
              <el-option label="包" value="包"></el-option>
              <el-option label="盒" value="盒"></el-option>
              <el-option label="桶" value="桶"></el-option>
              <el-option label="箱" value="箱"></el-option>
              <el-option label="袋" value="袋"></el-option>
            </el-select>
          </el-col>
        </el-row>
      </el-form-item>
      <el-form-item label="设备经度：">
        <span>{{ yhzData.jd }}</span>
      </el-form-item>
      <el-form-item label="设备纬度：">
        <span>{{ yhzData.wd }}</span>
      </el-form-item>
    </el-form>
  </div>
</template>
    
    <script setup>
import { ref } from "vue";
const formRef = ref(null);
defineExpose({ formRef });

const props = defineProps({
  yhzData: {
    type: Object,
    default: () => ({}),
  },
  form: {
    type: Object,
    default: () => ({}),
  },
});
</script>
    
    <style>
</style>