Skip to content

03 Uploads - v_uploadv2

Props

Required:

-

Optional:

  • url { type: String, required: true } - optional seee examples
  • placeholder { type: String, default: '' } - extra information displayed
  • css - class for inout upload
  • readonly { type: Boolean, default: false }
  • preview { type: Boolean, default: true } - show preview of the uploaded files

Events

  • @updated - return object with the selected values at the end of the upload process

Updated object structure:

JSON
  [
  {
    "file_id": null,
    "file_uuid": "4ab0aa22-0e43-850e-8d76-0198affcc76d",
    "file_hash": "5332670f-7432-0f89-cc49-f378ea79f1ea",
    "file_name": "TEST 1.pdf",
    "file_extension": ".pdf",
    "file_description": null,
    "file_type": null,
    "file_status": null,
    "file_remote_uuid": null,
    "file_remote_source": null,
    "file_date": null,
    "file_bytes": 32401
  },
  {
    "file_id": null,
    "file_uuid": "6c534be8-fbc6-8bee-8e68-0198affcc773",
    "file_hash": "aaf76f31-d5f8-7283-55c1-25705abb1d18",
    "file_name": "TEST 7.pdf",
    "file_extension": ".pdf",
    "file_description": null,
    "file_type": null,
    "file_status": null,
    "file_remote_uuid": null,
    "file_remote_source": null,
    "file_date": null,
    "file_bytes": 31610
  }
]

Examples

Custom upload to the remote datastore upload file to [app].[files]

HTML
1
2
3
4
5
  <v_uploadv2 
    v-model="file" 
    :endpoint="'/api/core/files/uploadv2/' + getAppName +'?file_remote_uuid=' + system.remoteID + '&file_remote_source=' + system.remoteSource"
    @updated="test = $event;" >
  </v_uploadv2>

Upload and preview the uploaded file, v-model can be used to directly use component in form

  • v-model should be equal to file_hash + file_extension
HTML
1
2
3
4
5
  <v_uploadv2 
    v-model="file" 
    @updated="test = $event[0]" 
    :preview="true">
  </v_uploadv2>