-Go服务器开发

要完善上传图片的功能并完成接口联调，你可以按照以下步骤进行：

修正代码中的语法错误：确保你的Vue组件和JavaScript代码没有语法错误，特别是在模板、事件绑定和函数定义部分。
实现beforeUpload、handleChange和handleRemove方法：这些方法应该用于处理文件上传前的验证、上传后的状态变化和文件删除操作。
调用后端接口：在合适的位置使用 AJAX 请求或其他 HTTP 客户端库（如 axios）将文件发送到后端。

以下是一个完整示例，展示了如何实现这个功能：

<template>
  <a-row>
    <a-col :span="16">
      <a-form-item label="上传附件" style="width:178%; margin-left: -145px">
        <a-upload
          v-model:file-list="fileList"
          name="upload"
          :before-upload="beforeUpload"
          @change="handleChange"
          accept=".jpg,.jpeg,.png,.gif,.bmp"
          :max-count="1">
          <template #default>
            <div v-if="fileList.length < 1">
              <a-icon type="plus" />
              <div style="margin-top:8px">上传附件</div>
            </div>
          </template>
        </a-upload>
      </a-form-item>
    </a-col>
  </a-row>
</template>
<script setup>
import { ref } from 'vue';
import { message } from 'ant-design-vue';
import axios from 'axios';
const fileList = ref([]);
const beforeUpload = (file) => {
  const isImage = /\.(png|jpe?g|gif|bmp)$/i.test(file.name);
  if (!isImage) {
    message.error('只能上传图片文件！');
    return false;
  }
  
  // 可以加入额外的条件，例如限制文件大小等
  return true; // 返回true以继续上传
};
const handleChange = async (info) => {
  if (info.file.status === 'done') {
    console.log('上传成功', info.file.response);
    message.success(`${info.file.name} 文件上传成功`);
  } else if (info.file.status === 'error') {
    console.error('上传失败', info.file.response);
    message.error(`${info.file.name} 文件上传失败`);
  } else if (info.file.status === 'uploading') {
    fileList.value.push(info.file); // 在开始上传时，将文件添加到列表中
  }
};
const handleRemove = (file) => {
  fileList.value = fileList.value.filter((item) => item.uid !== file.uid);
};
// 上传文件到服务器的方法
const saveAttachment = async (formData) => {
  try {
    const response = await axios.post('/api/upload', formData, {
      headers: { 'Content-Type': 'multipart/form-data' },
    });
    
    return response.data; // 假设返回的数据包含 success 和 message 字段
  } catch (error) {
    console.error('接口请求出错', error);
    throw new Error('接口请求失败');
  }
};
</script>
<style scoped>
/* 添加样式 */
</style>