src/views/environmentAccess/vehicleInfoCollect/index.vue
@@ -71,6 +71,18 @@
        </el-select>
      </el-form-item>
      <el-form-item label="车牌照片" prop="platePhoto">
        <PhotoCapture v-model="form.platePhoto" placeholder="拍摄车牌" />
      </el-form-item>
      <el-form-item label="行驶证照片" prop="licensePhoto">
        <PhotoCapture v-model="form.licensePhoto" placeholder="拍摄行驶证" />
      </el-form-item>
      <el-form-item label="车辆全景照片" prop="scenePhoto">
        <PhotoCapture v-model="form.scenePhoto" placeholder="拍摄车辆全景" />
      </el-form-item>
      <div class="collect-actions">
        <el-button type="primary" size="large" :loading="submitting" style="width: 100%" @click="submit">
          提交采集
@@ -85,6 +97,7 @@
import { ref, reactive } from "vue";
import { ElMessage } from "element-plus";
import { addVehicleInfo } from "@/api/environmentAccess/vehicleInfo.js";
import PhotoCapture from "../components/PhotoCapture.vue";
defineOptions({ name: "车辆信息采集" });
@@ -110,6 +123,9 @@
  registeDate: "",
  natureOfUse: "",
  fuelType: "",
  platePhoto: "",
  licensePhoto: "",
  scenePhoto: "",
});
const form = reactive(emptyForm());
@@ -186,4 +202,28 @@
.collect-actions {
  margin-top: 22px;
}
/* 手机端适配 */
@media (max-width: 768px) {
  .collect-page {
    padding: 12px 12px calc(48px + env(safe-area-inset-bottom));
    min-height: auto;
  }
  .collect-header h2 {
    font-size: 18px;
  }
  .collect-form :deep(.el-form-item) {
    margin-bottom: 16px;
  }
  .collect-actions {
    position: sticky;
    bottom: 0;
    padding: 10px 0 calc(10px + env(safe-area-inset-bottom));
    background: #fff;
    margin-top: 12px;
  }
}
</style>