<script setup>
import ImgCutter from "vue-img-cutter";
import { uploadFile } from "@/api/uploadFile.js";

let emits = defineEmits(["getUrl"]);
let cutDown = (data) => {
  let formData = new FormData();
  console.log(data,"图片信息");
  
  let { file } = data;
   // 校验文件类型
  const isImage = file.type.startsWith("image/");
  if (!isImage) {
    ElMessage.error("只能上传图片格式文件");
    return false;
  }
  // 校验文件大小（2MB）
  const isLt2M = file.size / 1024 / 1024 < 4;
  if (!isLt2M) {
    ElMessage.error("图片大小不能超过4MB");
    return false;
  }

  formData.append("file", file);
  uploadFile(formData).then((res) => {
    emits("getUrl", res);
  });
};
</script>

<template>
  <ImgCutter
    :boxWidth="1200"
    :boxHeight="600"
    :cutWidth="750"
    :cutHeight="480" 
    :sizeChange="false"
    :originalGraph="true"
    @cutDown="cutDown"
  ></ImgCutter>
</template>

<style lang="scss" scoped></style>
