完善各模块的视频上传功能，显示正在上传和上传完成提示

Tcsm

2023-08-09 1a55d5008d2484e4730a5e8919cdb95e14da98d5

 ruoyi-ui/src/views/self/memoInfo.vue

@@ -1,7 +1,9 @@
<template>
  <div class="app-container">
    <div class="form-header mt">
      <h4 class="dt h4">个人记事本详细信息 </h4>
      <el-page-header @back="goBack" content="个人记事本详细信息">
      </el-page-header>
<!--      <h4 class="dt h4"> </h4>-->
    </div>
    <div>
      <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-position="left" label-width="100px">
@@ -11,7 +13,7 @@
              <el-row>
                <el-cow :span="8">
                  <el-form-item label="时间" prop="happenTime" label-width="50px" style="background: #FAD1E0;border-radius: 7px 7px 7px 7px;opacity: 1;">
                    <el-input v-model="formData.happenTime" placeholder="请输入时间" clearable :style="{width: '100%'}" :disabled="dsb">
                    <el-input v-model="formData.happenTime" placeholder="请输入时间" type="date" clearable :style="{width: '100%'}" :disabled="dsb">
                    </el-input>
                  </el-form-item>
                </el-cow>
@@ -51,7 +53,8 @@
          :http-request="requestUpload"
          :file-list="fileList"
        >
          <i slot="default" class="el-icon-plus"></i>
          <div v-if="uploading" class="upload-status">正在上传...</div>
          <i v-if="!uploading" slot="default" class="el-icon-plus"></i>
          <div slot="file" slot-scope="{file}">
            <img
              class="el-upload-list__item-thumbnail"
@@ -63,14 +66,14 @@
            >
            <span class="el-upload-list__item-actions">
        <span
          v-if="isShow"

          class="el-upload-list__item-preview"
          @click="handlePictureCardPreview(file)"
        >
          <i class="el-icon-zoom-in"></i>
        </span>
        <span
          v-if="isShow"

          class="el-upload-list__item-delete"
          @click="handleDownload(file.url)"
        >
@@ -97,12 +100,12 @@
          multiple
          list-type="picture-card"
          :on-preview="handleFileCardPreview"
          :on-remove="handleRemove"
          :on-remove="handleRemoveFile"
          :http-request="requestUpload"
          :show-file-list="true"
        >

          <i slot="default" class="el-icon-plus"></i>
          <div v-if="uploading" class="upload-status">正在上传...</div>
          <i v-if="!uploading" slot="default" class="el-icon-plus"></i>
          <div slot="file" slot-scope="{file}">
            <img
              class="el-upload-list__item-thumbnail"
@@ -113,19 +116,18 @@
            >
            <span class="el-upload-list__item-actions">
                <span
                  v-if="isShow"

                  class="el-upload-list__item-preview"
                  @click="handleFileCardPreview(file)"
                >
                  <i class="el-icon-zoom-in"></i>
                </span>
                <span
                  v-if="isShow"
                  @click="handleRemove(file)"
                  class="el-upload-list__item-delete"

                  class="el-upload-list__item-delete"
                  @click="handleDownload(file.url)"
                >
                  <i class="el-icon-download"></i>
          <i class="el-icon-download"></i>
                </span>
                <span
                  v-if="isShow"
@@ -168,14 +170,12 @@
      cdi:"个人记事本详情",
      udi:"个人记事本详情",
      fot:[".jpg",".jif","png"],
      fileList:[
      ],
      fileListOther:[

      ],
      fileList:[],
      fileListOther:[],
      dsb:true,
      btn:false,
      isShow:true,
      uploading: false,
      // 个记事本表格数据
      noteList: [],
      formData: {
@@ -245,7 +245,7 @@
    let _this = this
    if (id) {
      this.loading = true;
      getNote(id).then((response) => {
      getNote({id}).then((response) => {
        this.formData = response.data;
        let paths = response.data.url.split(",");
        for(let i = 0; i < paths.length; i++)
@@ -308,6 +308,7 @@
          }
        }
      })
      this.goBack()
    },
    resetForm() {
      this.$refs['elForm'].resetFields()
@@ -362,22 +363,29 @@
        saveAs(blob, filename)
      })
    },
    goBack() {
      this.$router.go(-1);
      this.$router.push({ path: "/self/self/memo" });
    },

    handleEdit()
    {
      this.dsb = false
      // this.btn = true
      this.isShow=false
    },

    requestUpload(params)
    {
      var file = params.file;
      var formData = new FormData();
      formData.append('uploadFile', file);
      let _this = this

      this.uploading = true;
      uploadPic(formData).then(response => {
        let pth = response.data.originalFilename.substr(response.data.originalFilename.length-4, response.data.originalFilename.length)

        this.uploading = false;
        this.$modal.msgSuccess("上传成功");
        if(_this.fot.includes(pth) === true)
        {
          _this.fileList.push({name:response.data.fileName, "url":response.data.url})