提交一把订单

jiangping

2025-06-25 60acccaebef503315c852f31677b44eb3fd40a4f

 company/src/components/common/upload.vue

@@ -12,7 +12,11 @@
                <i class="el-icon-plus"></i>
            </div>
        </div>
        <input type="file" ref="file" :accept="accept" @change="getFile" />
        <div style="display: block;">
          <input type="file" ref="file" :accept="accept" @change="getFile" />
          <progress id="progressBar" value="0" max="100"></progress>
          <span id="status">0%</span>
        </div>
    </div>
</template>

@@ -57,11 +61,29 @@
    },
    getFile (e) {
      if (e.target && e.target.files.length > 0) {
        const config = {
          onUploadProgress: function(progressEvent) {
            console.log(progressEvent)
            const percentCompleted = Math.round((progressEvent.loaded * 100) / progressEvent.total);
            document.getElementById('progressBar').value = percentCompleted;
            document.getElementById('status').textContent = percentCompleted + '%';
          },
          headers: {
            'Content-Type': 'multipart/form-data'
          }
        }

        const loading = this.$loading({
              lock: true,
              text: '上传中，请等待',
              spinner: 'el-icon-loading',
              background: 'rgba(0, 0, 0, 0.7)'
          });
        this.$emit('loading')
        const formdate = new FormData()
        formdate.append('file', e.target.files[0])
        formdate.append('folder', this.folder)
        axios.post(this.uploadImgUrl, formdate)
        axios.post(this.uploadImgUrl, formdate,config)
          .then(res => {
            this.$emit('success', res.data.data)
          })
@@ -69,6 +91,7 @@
            this.$message.error(e)
          })
          .finally(() => {
            loading.close();
            this.$refs.file.value = null
          })
      }