双奇点改造 1.产品维护添加图片、高度等字段

gaoluyang

2026-02-03 d43d7b9c90ae36c2d369f5c52b207b5549675766

 src/views/basicData/product/ImportExcel/index.vue

@@ -3,15 +3,36 @@
    导入
  </el-button>
  <el-dialog v-model="upload.open" :title="upload.title">
    <FileUpload
      ref="fileUploadRef"
    <el-upload
      ref="uploadRef"
      :limit="1"
      accept=".xlsx, .xls"
      :headers="upload.headers"
      :action="upload.url + '?updateSupport=' + upload.updateSupport"
      :disabled="upload.isUploading"
      :showTip="false"
      @success="handleFileSuccess"
    />
      :before-upload="upload.beforeUpload"
      :on-progress="upload.onProgress"
      :on-success="upload.onSuccess"
      :on-error="upload.onError"
      :on-change="upload.onChange"
      :auto-upload="false"
      drag
    >
      <el-icon class="el-icon--upload"><UploadFilled /></el-icon>
      <div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
      <template #tip>
        <div class="el-upload__tip text-center">
          <span>仅允许导入xls、xlsx格式文件。</span>
          <el-link
            type="primary"
            :underline="false"
            style="font-size: 12px; vertical-align: baseline"
            @click="handleDownloadTemplate"
            >下载模板</el-link
          >
        </div>
      </template>
    </el-upload>
    <template #footer>
      <div class="dialog-footer">
        <el-button type="primary" @click="submitFileForm">确 定</el-button>
@@ -22,17 +43,18 @@
</template>

<script setup>
import { reactive } from "vue";
import { reactive, ref, getCurrentInstance } from "vue";
import { getToken } from "@/utils/auth.js";
import { FileUpload } from "@/components/Upload";
import { ElMessage } from "element-plus";
import { UploadFilled } from "@element-plus/icons-vue";

defineOptions({
  name: "产品维护导入",
});

const emits = defineEmits(["uploadSuccess"]);
const fileUploadRef = ref();
const uploadRef = ref();
const { proxy } = getCurrentInstance();
const upload = reactive({
  // 是否显示弹出层（供应商导入）
  open: false,
@@ -44,6 +66,20 @@
  headers: { Authorization: "Bearer " + getToken() },
  // 上传的地址
  url: import.meta.env.VITE_APP_BASE_API + "/system/supplier/import",
  updateSupport: false,
  beforeUpload: () => {
    upload.isUploading = true;
  },
  onProgress: () => {},
  onChange: () => {},
  onError: () => {
    upload.isUploading = false;
    ElMessage({ message: "上传失败", type: "error" });
  },
  onSuccess: (response) => {
    upload.isUploading = false;
    handleFileSuccess(response);
  },
});
// 点击导入
const handleImport = () => {
@@ -51,8 +87,13 @@
  upload.title = "产品导入";
};

// 下载导入模板
const handleDownloadTemplate = () => {
  proxy.download("/basic/product/downloadTemplate", {}, "产品导入模板.xlsx");
};

const submitFileForm = () => {
  fileUploadRef.value.uploadApi();
  uploadRef.value.submit();
};

const handleFileSuccess = (response) => {