前端导入, 怎么将上传文件的请求封装?

上传

我目前action和header都写死在页面上,特别是index.php这个, 感觉不太合理, 请问怎么优化好

<template>
    <div class="centered-container">
      <el-form :model="form">
        <el-form-item label="备注">
          <el-input v-model="form.remark" autocomplete="off" />
        </el-form-item>
        <el-form-item label="文件">
          <el-upload
            ref="upload"
            action="http://localhost:8000/index.php/admin/goods/import"
            :auto-upload="false"
            :headers="headerObj"
            :data="form"
            :on-success="onSuccess"
          >
            <el-button type="primary">选择文件</el-button>
          </el-upload>
        </el-form-item>
      </el-form>
      <span class="dialog-footer">
        <el-button type="warning" @click="submitUpload">开始导入</el-button>
        <el-button>清空</el-button>
      </span>
    </div>
  </template>
  
  cleanXss
  import { useAdminInfo } from '/@/stores/adminInfo';
  import { reactive, ref} from 'vue';
  
  import type { UploadInstance } from 'element-plus';
  import { ElNotification } from 'element-plus';
  
  const upload = ref<UploadInstance>();
  
  const submitUpload = () => {
    upload.value!.submit();
  };
  const form = reactive({
    remark: ''
  });

  const adminInfo = useAdminInfo();
  const headerObj = {
    batoken: adminInfo.getToken() // 获取状态商店的batoken
  };
  cleanXss