div(class="file-upload")
  div(
    class="file-upload__dropzone"
    :class="{ 'file-upload__dropzone--dragging': isDragging }"
    @dragover="onDragOver"
    @dragleave="onDragLeave"
    @drop="onDrop"
  )
    div(class="file-upload__content")
      div(class="file-upload__icon") 📁
      h3(class="file-upload__title") Перетащите файлы сюда
      p(class="file-upload__subtitle") или
      label(class="file-upload__browse")
        input(
          type="file"
          :accept="accept"
          :multiple="multiple"
          @change="onFileSelect"
          class="file-upload__input"
        )
        span(class="file-upload__browse-text") выберите файлы
      p(class="file-upload__hint") Поддерживаемые форматы: {{ accept }}
  
  div(v-if="selectedFiles.length > 0" class="file-upload__files")
    h4(class="file-upload__files-title") Выбранные файлы:
    
    div(
      v-for="(file, index) in selectedFiles"
      :key="index"
      class="file-upload__file"
    )
      span(class="file-upload__file-icon") {{ getFileIcon(file) }}
      div(class="file-upload__file-info")
        span(class="file-upload__file-name") {{ file.name }}
        span(class="file-upload__file-size") {{ (file.size / 1024 / 1024).toFixed(2) }} MB
      button(
        @click="removeFile(index)"
        class="file-upload__remove"
        title="Удалить файл"
      ) ×
  
  div(v-if="isUploading" class="file-upload__progress")
    div(class="file-upload__progress-bar")
      div(
        class="file-upload__progress-fill"
        :style="{ width: uploadProgress + '%' }"
      )
    span(class="file-upload__progress-text") {{ uploadProgress }}%
  
  div(v-if="selectedFiles.length > 0 && !isUploading" class="file-upload__actions")
    ui-button(
      @click="uploadFiles"
      type="primary"
      :disabled="isUploading"
    ) Загрузить файлы