<script setup lang="ts">
import FileUpload from '@/components/common/file-upload.vue';
import ImageUpload from '@/components/common/image-upload.vue';
import type { ModelData } from '@/views/system/oss/index.vue';
import { $t } from '@/locales';

defineOptions({
  name: 'OssUploadModal'
});

const modelData = defineModel<ModelData>('modelData', {
  default: () => {
    return {
      visible: false,
      type: 0,
      file: ''
    };
  }
});

const emit = defineEmits<{
  (e: 'getData'): void;
}>();
function handleSubmit() {
  modelData.value.visible = false;
  emit('getData');
}
</script>

<template>
  <NModal
    v-model:show="modelData.visible"
    :title="`上传${modelData.type === 0 ? '文件' : '图片'}`"
    preset="card"
    class="w-600px"
  >
    <FileUpload v-if="modelData.type === 0" v-model:model-value="modelData.file" :default-upload="false"></FileUpload>
    <ImageUpload v-else v-model:model-value="modelData.file" :max-count="5"></ImageUpload>
    <template #footer>
      <NSpace justify="end">
        <NButton size="small" class="mt-16px" @click="modelData.visible = false">
          {{ $t('common.cancel') }}
        </NButton>
        <NButton type="primary" size="small" class="mt-16px" @click="handleSubmit">
          {{ $t('common.confirm') }}
        </NButton>
      </NSpace>
    </template>
  </NModal>
</template>

<style scoped>

</style>
