vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Fixed #262, Fixed #265

pull/310/head
cagataycivici 2020-04-07 15:04:25 +03:00
parent 2aa2f1fd26
commit 86d98e5e42
4 changed files with 53 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/dialog/Dialog.vue
View File

@ -28,6 +28,7 @@
<script>
import UniqueComponentId from '../utils/UniqueComponentId';
import DomHandler from '../utils/DomHandler';
export default {
inheritAttrs: false,
props: {

38
src/components/fileupload/FileUpload.vue
View File

@ -25,6 +25,10 @@
</div>
</div>
</div>
<div class="p-fileupload-empty" v-if="$scopedSlots.empty && !hasFiles">
<slot name="empty">
</slot>
</div>
</div>
</div>
<span :class="basicChooseButtonClass" @mouseup="onBasicUploaderClick" v-else-if="isBasic">
@ -38,6 +42,7 @@
import Button from '../button/Button';
import ProgressBar from '../progressbar/ProgressBar';
import Message from '../message/Message';
import DomHandler from '../utils/DomHandler';
export default {
props: {
@ -233,17 +238,38 @@ export default {
return true;
},
onDragEnter() {
},
onDragLeave() {
onDragEnter(event) {
console.log('enter');
if (!this.disabled) {
event.stopPropagation();
event.preventDefault();
}
},
onDragOver() {
if (!this.disabled) {
DomHandler.addClass(this.$refs.content, 'p-fileupload-highlight');
event.stopPropagation();
event.preventDefault();
}
},
onDragLeave() {
if (!this.disabled) {
DomHandler.removeClass(this.$refs.content, 'p-fileupload-highlight');
}
},
onDrop() {
if (!this.disabled) {
DomHandler.removeClass(this.$refs.content, 'p-fileupload-highlight');
event.stopPropagation();
event.preventDefault();
const files = event.dataTransfer ? event.dataTransfer.files : event.target.files;
const allowDrop = this.multiple || (files && files.length === 1);
if (allowDrop) {
this.onFileSelect(event);
}
}
},
onBasicUploaderClick() {
if (this.hasFiles) {

6
src/views/fileupload/FileUploadDemo.vue
View File

@ -9,7 +9,11 @@
<div class="content-section implementation">
<h3>Advanced</h3>
<FileUpload name="demo[]" url="./upload.php" @upload="onUpload" :multiple="true" accept="image/*" :maxFileSize="1000000" />
<FileUpload name="demo[]" url="./upload.php" @upload="onUpload" :multiple="true" accept="image/*" :maxFileSize="1000000">
<template #empty>
<p>Drag and drop files to here to upload.</p>
</template>
</FileUpload>
<h3>Basic</h3>
<FileUpload mode="basic" name="demo[]" url="./upload.php" accept="image/*" :maxFileSize="1000000" @upload="onUpload" />

16
src/views/fileupload/FileUploadDoc.vue
View File

@ -56,6 +56,16 @@ import FileUpload from 'primevue/fileupload';
<h3>Request Customization</h3>
<p>XHR request to upload the files can be customized using the before-upload callback that passes the xhr instance and FormData object as event parameters.</p>
<h3>Empty Template</h3>
<p>When there is no file selected, you may use the empty slot to display content.</p>
<CodeHighlight>
&lt;FileUpload name="demo[]" url="./upload" /&gt;
&lt;template #empty&gt;
&lt;p&gt;Drag and drop files to here to upload.&lt;/p&gt;
&lt;/template&gt;
&lt;/FileUpload&gt;
</CodeHighlight>
<h3>Properties</h3>
<div class="doc-tablewrapper">
<table class="doc-table">
@ -252,7 +262,11 @@ import FileUpload from 'primevue/fileupload';
<CodeHighlight>
<template v-pre>
&lt;h3&gt;Advanced&lt;/h3&gt;
&lt;FileUpload name="demo[]" url="./upload.php" @upload="onUpload" :multiple="true" accept="image/*" :maxFileSize="1000000" /&gt;
&lt;FileUpload name="demo[]" url="./upload.php" @upload="onUpload" :multiple="true" accept="image/*" :maxFileSize="1000000"&gt;
&lt;template #empty&gt;
&lt;p&gt;Drag and drop files to here to upload.&lt;/p&gt;
&lt;/template&gt;
&lt;/FileUpload&gt;
&lt;h3&gt;Basic&lt;/h3&gt;
&lt;FileUpload mode="basic" name="demo[]" url="./upload.php" accept="image/*" :maxFileSize="1000000" @upload="onUpload" /&gt;