src/views/basicData/vehicle/index.vue
@@ -83,6 +83,19 @@
            </el-tag>
          </template>
        </el-table-column>
        <el-table-column label="车辆照片"
                         min-width="100"
                         align="center">
          <template #default="scope">
            <el-image v-if="scope.row.vehiclePhotos && scope.row.vehiclePhotos.length"
                      :src="scope.row.vehiclePhotos[0]"
                      :preview-src-list="scope.row.vehiclePhotos"
                      preview-teleported
                      fit="cover"
                      style="width: 60px; height: 44px; border-radius: 4px" />
            <span v-else>--</span>
          </template>
        </el-table-column>
        <el-table-column label="备注"
                         prop="remark"
                         min-width="160"
@@ -196,6 +209,16 @@
            </el-form-item>
          </el-col>
        </el-row>
        <el-row :gutter="30">
          <el-col :span="24">
            <el-form-item label="车辆照片:"
                          prop="vehiclePhotos">
              <ImageUpload v-model:file-list="form.vehiclePhotos"
                           :limit="10"
                           permanent />
            </el-form-item>
          </el-col>
        </el-row>
      </el-form>
    </FormDialog>
  </div>
@@ -203,6 +226,7 @@
<script setup>
  import FormDialog from "@/components/Dialog/FormDialog.vue";
  import ImageUpload from "@/components/AttachmentUpload/image/index.vue";
  import pagination from "@/components/PIMTable/Pagination.vue";
  import { ref, reactive, toRefs, getCurrentInstance } from "vue";
  import { ElMessageBox } from "element-plus";
@@ -239,6 +263,7 @@
      loadCapacity: null,
      status: "启用",
      remark: "",
      vehiclePhotos: [],
    },
    rules: {
      plateNumber: [{ required: true, message: "请输入车牌号", trigger: "blur" }],
@@ -299,6 +324,8 @@
        loadCapacity,
        status: status || "启用",
        remark,
        // 接口返回的就是 URL 字符串数组,直接喂给 el-upload 回显
        vehiclePhotos: Array.isArray(row.vehiclePhotos) ? [...row.vehiclePhotos] : [],
      };
    } else {
      form.value = {
@@ -309,6 +336,7 @@
        loadCapacity: null,
        status: "启用",
        remark: "",
        vehiclePhotos: [],
      };
    }
  };
@@ -317,7 +345,15 @@
    proxy.$refs["formRef"].validate(valid => {
      if (valid) {
        const api = form.value.id ? updateVehicle : addVehicle;
        api(form.value).then(() => {
        // 后端 vehiclePhotos 是 List<String>,只存 URL;上传组件给的是 {name, url} 对象数组,
        // 直接传对象会 JSON 解析失败报 400。另外传 null 不更新,想删光必须显式传 []
        const payload = {
          ...form.value,
          vehiclePhotos: (form.value.vehiclePhotos || [])
            .map(item => (typeof item === "string" ? item : item?.url || item?.previewURL || ""))
            .filter(Boolean),
        };
        api(payload).then(() => {
          proxy.$modal.msgSuccess("操作成功");
          closeDia();
          getList();