| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273 |
- div(class="media-page")
- h1 Медиа-менеджер
-
- div(class="media-toolbar")
- div(class="media-upload-area")
- file-upload(
- accept="image/*,.pdf,.doc,.docx"
- :multiple="true"
- @select="onFilesSelect"
- @upload="uploadFiles"
- )
-
- div(class="media-filters")
- select(v-model="filterType" class="filter-select")
- option(value="") Все типы
- option(value="image") Изображения
- option(value="document") Документы
- input(
- type="text"
- v-model="searchQuery"
- placeholder="Поиск по названию..."
- class="search-input"
- )
- div(class="media-content")
- div(v-if="uploading" class="upload-progress")
- div(class="progress-bar")
- div(
- class="progress-fill"
- :style="{ width: uploadProgress + '%' }"
- )
- span {{ uploadProgress }}%
- div(class="media-grid")
- div(
- v-for="file in visibleFiles"
- :key="file._id"
- class="media-item"
- :class="{ 'media-item--selected': selectedFiles.includes(file._id) }"
- @click="toggleSelect(file._id)"
- )
- div(class="media-item__preview")
- lazy-image(
- v-if="file.type === 'image'"
- :src="getFileUrl(file)"
- :alt="file.name"
- class="media-item__image"
- )
- div(v-else class="media-item__icon") 📄
-
- div(class="media-item__info")
- div(class="media-item__name") {{ file.name }}
- div(class="media-item__meta")
- span {{ formatFileSize(file.size) }}
- span {{ formatDate(file.createdAt) }}
-
- div(class="media-item__actions")
- button(
- @click.stop="deleteFile(file)"
- class="media-item__delete"
- title="Удалить файл"
- ) ×
- div(v-if="hasMoreFiles" class="media-load-more")
- ui-button(
- @click="loadMoreFiles"
- :loading="loadingMore"
- type="outline"
- ) Загрузить еще
- div(v-if="selectedFiles.length > 0" class="media-selection")
- span Выбрано: {{ selectedFiles.length }}
- ui-button(@click="deleteSelected" type="danger" size="small") Удалить выбранные
|
