update document

Author: JackPu

README.md

@@ -128,6 +128,18 @@ plugins: [
   <td>10485760(10M)</td>
   <td>Limit the size of the file</td>
  </tr>
+ <tr>
+  <td>maxFileSize</td>
+  <td align="left">Number</td>
+  <td>10485760(10M)</td>
+  <td>Limit the size of the file</td>
+ </tr>
+ <tr>
+  <td>multipleSize</td>
+  <td align="left">Number</td>
+  <td>5</td>
+  <td>Limit the count of the file</td>
+ </tr>
  <tr>
   <td>maxWidth</td>
   <td align="left">Number</td>
@@ -176,5 +188,3 @@ plugins: [
 ### Contributions
 
 Your contributions and suggestions are welcome 😄😄😄💐💐💐.
-
-

dist/style/style.css

@@ -8,6 +8,9 @@
  right: 0;
  top:0;
  bottom:0;
+ width: 100%;
+ height: 100%;
+ min-height: 61px;
  opacity: 0;
 }
 .g-core-image-upload-container{

dist/vue-core-image-upload.vue

@@ -1,7 +1,7 @@
 <template>
  <div class="g-core-image-upload-btn" ref="container">
  <slot>{{text}}</slot>
- <form class="g-core-image-upload-form" v-show="!hasImage" method="post" enctype="multipart/form-data" action="/api2/common_user/cropHeadUrl" style="display: block; cursor: pointer; position: absolute; left: 0px; top: 0px; width: 1242px; height: 61px; opacity: 0; margin: 0px; padding: 0px; overflow: hidden;">
+ <form class="g-core-image-upload-form" v-show="!hasImage" method="post" enctype="multipart/form-data" action="" style="">
  <input v-bind:disabled="uploading" v-bind:id="'g-core-upload-input-' + formID" v-bind:name="name" v-bind:multiple="multiple" type="file" v-bind:accept="inputAccept" v-on:change="change" v-on:dragover="dragover" v-on:dragenter="dragover" v-on:dragleave="dragleave" v-on:dragend="dragleave" v-on:drop="dragleave" style="width: 100%; height: 100%;">
  </form>
  <div class="g-core-image-corp-container" v-bind:id="'vciu-modal-' + formID" v-show="hasImage">
@@ -106,6 +106,11 @@
  return this.__dispatch('errorhandle','FILE IS TOO LARGER MAX FILE IS ' + formatSize);
  }
 
+ if (this.multipleSize > 0 && e.target.files.length > this.multipleSize) {
+ console.warn('FILE NUM IS LARGER THAN ' + this.multipleSize);
+ return this.__dispatch('errorhandle', 'FILE NUM OVERLOAD');
+ }
+
  this.files = e.target.files;
  if (this.crop || this.resize) {
  this.__showImage();

index.js

@@ -1,6 +1,6 @@
 {
  "name": "vue-core-image-upload",
- "version": "2.3.7",
+ "version": "2.3.10",
  "description": "a vue plgin for image upload and crop",
  "main": "dist/vue-core-image-upload.vue",
  "dependencies": {

package.json

@@ -45,13 +45,17 @@ export default {
  </p>
  <div class="center">
  <vue-core-image-upload
- class="btn btn-primary"
- :crop="false"
- @imageuploaded="imageuploaded"
- :data="data"
- :max-file-size="5242880"
- url="http://101.198.151.190/api/upload.php" >
- </vue-core-image-upload>
+ class="postImg"
+ :crop="false"
+ @imageuploaded="imageuploaded"
+ @imageuploading="imageuploading"
+ :data='data'
+ inputOfFile="FeedBack"
+ compress="50"
+ :max-file-size="10485760"
+ :credentials="false"
+ url="https://v3.imacco.com/Upload/api/UploadImg" >
+ </vue-core-image-upload>
  </div>
  <p>First of all , we need to include out plugin in <code>components</code> . Then we must define the <code>url</code> as your server api ,then we bind a function to
  <code>@imageuploaded</code> for handling the server response.

site/client/components/doc/en/GetStarted.vue

@@ -8,6 +8,9 @@
  right: 0;
  top:0;
  bottom:0;
+ width: 100%;
+ height: 100%;
+ min-height: 61px;
  opacity: 0;
 }
 .g-core-image-upload-container{

src/style/style.css

@@ -1,7 +1,7 @@
 <template>
  <div class="g-core-image-upload-btn" ref="container">
  <slot>{{text}}</slot>
- <form class="g-core-image-upload-form" v-show="!hasImage" method="post" enctype="multipart/form-data" action="/api2/common_user/cropHeadUrl" style="display: block; cursor: pointer; position: absolute; left: 0px; top: 0px; width: 1242px; height: 61px; opacity: 0; margin: 0px; padding: 0px; overflow: hidden;">
+ <form class="g-core-image-upload-form" v-show="!hasImage" method="post" enctype="multipart/form-data" action="" style="">
  <input v-bind:disabled="uploading" v-bind:id="'g-core-upload-input-' + formID" v-bind:name="name" v-bind:multiple="multiple" type="file" v-bind:accept="inputAccept" v-on:change="change" v-on:dragover="dragover" v-on:dragenter="dragover" v-on:dragleave="dragleave" v-on:dragend="dragleave" v-on:drop="dragleave" style="width: 100%; height: 100%;">
  </form>
  <div class="g-core-image-corp-container" v-bind:id="'vciu-modal-' + formID" v-show="hasImage">
@@ -105,7 +105,7 @@
  console.warn('FILE IS TOO LARGER MAX FILE IS ' + formatSize);
  return this.__dispatch('errorhandle','FILE IS TOO LARGER MAX FILE IS ' + formatSize);
  }
- 
+
  if (this.multipleSize > 0 && e.target.files.length > this.multipleSize) {
  console.warn('FILE NUM IS LARGER THAN ' + this.multipleSize);
  return this.__dispatch('errorhandle', 'FILE NUM OVERLOAD');