diff --git a/uniapp/youjiala/src/components/file-action-sheet/file-action-sheet.vue b/uniapp/youjiala/src/components/file-action-sheet/file-action-sheet.vue new file mode 100644 index 0000000..2ead6af --- /dev/null +++ b/uniapp/youjiala/src/components/file-action-sheet/file-action-sheet.vue @@ -0,0 +1,258 @@ + + + + + diff --git a/uniapp/youjiala/src/components/file-grid-list/file-grid-list.vue b/uniapp/youjiala/src/components/file-grid-list/file-grid-list.vue index 4a33618..cc57fac 100644 --- a/uniapp/youjiala/src/components/file-grid-list/file-grid-list.vue +++ b/uniapp/youjiala/src/components/file-grid-list/file-grid-list.vue @@ -78,7 +78,8 @@ function onCardTap(file: FileItem): void { - + + diff --git a/uniapp/youjiala/src/components/file-tab-filter/file-tab-filter.vue b/uniapp/youjiala/src/components/file-tab-filter/file-tab-filter.vue index b40d97a..95aba9c 100644 --- a/uniapp/youjiala/src/components/file-tab-filter/file-tab-filter.vue +++ b/uniapp/youjiala/src/components/file-tab-filter/file-tab-filter.vue @@ -57,8 +57,10 @@ const emit = defineEmits<{ + - + diff --git a/uniapp/youjiala/src/components/quick-entry/quick-entry.vue b/uniapp/youjiala/src/components/quick-entry/quick-entry.vue index 5682de4..19dae7d 100644 --- a/uniapp/youjiala/src/components/quick-entry/quick-entry.vue +++ b/uniapp/youjiala/src/components/quick-entry/quick-entry.vue @@ -1,6 +1,6 @@ @@ -322,6 +494,9 @@ function onAdd(): void { } .file-page__selection { + display: flex; + align-items: center; + justify-content: space-between; margin: 20rpx 24rpx 0; padding: 16rpx 32rpx; border-radius: 24rpx; @@ -333,6 +508,82 @@ function onAdd(): void { color: #2b8fff; } +/* 全选 / 取消全选:贴右并排的图标胶囊按钮 */ +.file-page__selection-actions { + display: flex; + align-items: center; + gap: 20rpx; +} + +.file-page__selection-btn { + display: flex; + align-items: center; + gap: 8rpx; + padding: 10rpx 24rpx; + border: 2rpx solid #e6e7ea; + border-radius: 999rpx; + background-color: #f7f8fa; + + &--primary { + border-color: #bcdcff; + background-color: #eaf4ff; + } +} + +.file-page__selection-btn-text { + font-size: 24rpx; + color: #5c626b; + + .file-page__selection-btn--primary & { + color: #2b8fff; + } +} + +/* 多选底部操作栏:贴底常驻白底板,两排等分胶囊按钮 */ +.file-page__actions { + position: absolute; + right: 0; + bottom: 0; + left: 0; + z-index: 9; + display: flex; + flex-direction: column; + gap: 16rpx; + padding: 24rpx 24rpx calc(24rpx + env(safe-area-inset-bottom)); + border-radius: 32rpx 32rpx 0 0; + background-color: #ffffff; + box-shadow: 0 -4rpx 24rpx rgba(31, 35, 41, 0.06); +} + +.file-page__actions-row { + display: flex; + gap: 16rpx; +} + +.file-page__action-btn { + display: flex; + flex: 1; + align-items: center; + justify-content: center; + gap: 10rpx; + padding: 22rpx 0; + border-radius: 999rpx; + background-color: #f5f6f8; + + &--danger { + background-color: #fdecec; + } +} + +.file-page__action-text { + font-size: 26rpx; + color: #1f2329; + + .file-page__action-btn--danger & { + color: #f0413e; + } +} + .file-page__state { display: flex; align-items: center;