<template>
  <div class="q-gutter-y-md">
    <q-file
      ref="uploader"
      :accept="accept"
      :disable="model.loading || disable"
      :label="$t('base.uploader.upload')"
      :multiple="multiple"
      :rules="rules"
      clearable
      counter
      filled
      @clear="clearHandler"
      v-model="model.files"
      @input="inputHandler"
      @rejected="rejectHandler"
    >
      <template #prepend>
        <q-icon name="attach_file" />
      </template>
    </q-file>
    <div v-if="showDescription">
      <q-slide-transition>
        <q-input
          v-if="withInput"
          v-model="model.description.value"
          :disable="model.loading"
          :label="currentInputLabel"
          filled
          type="textarea"
        />
      </q-slide-transition>
    </div>
    <div v-if="showAction" class="row justify-end">
      <q-btn
        :disable="isNotAvailible"
        :label="$t('base.uploader.upload')"
        :loading="model.loading"
        color="primary"
        @click="uploadHandler"
      />
    </div>
  </div>
</template>

<script lang="ts" src="./index.ts" />
