<template>
  <HandleAllKindsOfType
    v-if="activedMenu === eCollectionType.picture"
    type="uploadPicture"
    :file="fileData"
    @clear="
      () => {
        clearCollectionMsg();
      }
    "
    @upload="upload"
  ></HandleAllKindsOfType>
  <HandleAllKindsOfType
    v-else-if="activedMenu === eCollectionType.album"
    type="selectAlbum"
    :file="fileData"
    @clear="
      () => {
        clearCollectionMsg();
      }
    "
    @click-center-btn="handleClickCenterBtn"
  ></HandleAllKindsOfType>
</template>

<script setup lang="ts">
import { eCollectionType } from "../types";
import { getFileName } from "../../../../utils/file";
import HandleAllKindsOfType from "@/components/HandleAllKindsOfType/index.vue";

const props = defineProps<{
  activedMenu: eCollectionType;
  fileData: any;
  clearCollectionMsg: any;
}>();

const emit = defineEmits(["uploadCollection", "selectAlbum"]);

const upload = (file: File) => {
  emit("uploadCollection", {
    formData: {
      amount: 1,
      type: "1",
      name: getFileName(file.name),
      fileData: file,
    },
  });
};

const handleClickCenterBtn = () => {
  emit("selectAlbum");
};
</script>

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