Appearance

Collage Details Page ​

File Information ​

  • Path: pages/_workspace_id/dam/collage/_id/index.vue
  • Route: /:workspace_id/dam/collage/:id
  • Middleware: authCheck, checkWorkspace, check-if-suspended, can-access-dam-module
  • Layout: damLayout

Purpose ​

The Collage Details page displays all assets within a specific collage. Users can view, organize, manage, and perform operations on assets within the collage.

Key Features ​

  1. Asset Display

    • Grid, list, and mosaic view modes
    • Asset thumbnails and previews
    • Asset metadata display

  2. Collage Management

    • Rename collage
    • Update description
    • Set permissions
    • Share collage
    • Delete collage

  3. Asset Operations

    • View asset details
    • Remove from collage
    • Download assets
    • Rename assets
    • Delete assets

  4. Bulk Operations

    • Multi-select assets
    • Bulk download
    • Bulk delete
    • Bulk share

  5. View Modes

    • Mosaic view
    • Grid view
    • List view

Components Used ​

  • FileListingCard - Asset display card
  • DeleteDialog - Confirmation dialog
  • ShareAssetDialog - Share dialog
  • CreateCollageDialog - Rename dialog
  • PermissionDialog - Permission management
  • SaveToCollection - Add to collage dialog

Data Properties ​

javascript
{
  collage: object,          // Collage data
  assets: array,           // Assets in collage
  selectedItems: array,   // Selected assets
  viewMode: string,       // 'mosaic', 'grid', or 'list'
  loading: boolean,       // Loading state
  currentPage: number,    // Pagination
  lastPage: number       // Last page
}

Methods ​

getCollageDetails() ​

Fetches collage details from API

loadCollageAssets(page) ​

Loads assets in collage

fetchMoreAssets() ​

Handles infinite scroll

fileSelect(file) ​

Toggles asset selection

toggleSelectAll() ​

Selects/deselects all assets

openAsset(file) ​

Opens asset details

downloadFile(file) ​

Downloads asset

removeCollage() ​

Deletes collage

updateCollage() ​

Updates collage details

onPermissionUpdated(permission) ​

Updates collage permissions

API Endpoints ​

  • GET /dam/collages/:id - Fetch collage details
  • GET /dam/collages/:id/assets - Fetch collage assets
  • PUT /dam/collages/:id - Update collage
  • DELETE /dam/collages/:id - Delete collage
  • POST /dam/collages/:id/assets/:asset_id - Add asset to collage
  • DELETE /dam/collages/:id/assets/:asset_id - Remove asset from collage