加上了成长经历阅历的自传的修改功能，固定序号

Tcsm

2023-10-10 880a49e093fbba2c1e39cdd598268766c99082fe

 ruoyi-ui/src/views/collection/collectionInfo.vue

@@ -96,7 +96,7 @@
                class="el-upload-list__item-thumbnail"
                :src="file.url"
                alt=""
                style="width: 100%; height: 100%; object-fit: cover;"
                style="width: 147px; height: 147px"
                fit="cover"
                :preview-src-list="[file.url]"
              >
@@ -146,14 +146,23 @@
            <div v-if="uploading1" class="upload-status">正在上传...</div>
            <i v-if="!uploading1" slot="default" class="el-icon-plus"></i>
            <div slot="file" slot-scope="{file}">
              <img
              <!-- 添加video元素用于显示视频 -->
              <video
                v-if="file.url.includes('.mp4')"
                class="el-upload-list__item-thumbnail"
                :src="file.url"
                style="width: 147px; height: 147px"
                fit="cover"
              ></video>
              <img v-else
                class="el-upload-list__item-thumbnail"
                src="../../assets/401_images/401.gif"
                alt=""
                style="width: 100%; height: 100%; object-fit: cover;"
                fit="cover"
              >
                style="width: 100%; height: 100%"
                fit="cover">

              <span class="el-upload-list__item-actions">
               <span class="el-upload-list__item-name">{{ file.name }}</span>
                    <span
                      class="el-upload-list__item-preview"
                      @click="handleFileCardPreview(file)"
@@ -175,7 +184,6 @@
                      <i class="el-icon-delete"></i>
                    </span>
                  </span>


            </div>

@@ -549,7 +557,21 @@
          this.formData.url = ul+","+uls
          console.log(this.formData.url)
          updateCollection(this.formData).then(response => {
            this.$modal.msgSuccess("文档上传成功");
            this.$modal.msgSuccess("上传成功");

            const videoElement = document.createElement('video'); // 创建一个新的video元素
            videoElement.src = response.data.url; // 设置video元素的src为视频URL
            // 监听loadedmetadata事件以确保视频元数据加载完成
            videoElement.addEventListener('loadedmetadata', function() {
              const canvas = document.createElement('canvas');// 创建一个canvas元素
              const context = canvas.getContext('2d');
              context.drawImage(videoElement, 0, 0, canvas.width, canvas.height); // 将视频的首帧画面绘制到画布上
              const imageURL = canvas.toDataURL();// 将画布转换为图像URL
              videoElement.setAttribute('poster', imageURL);// 设置视频的封面图像

              // 在页面中显示视频元素
              document.body.appendChild(videoElement);
            });
            // this.open = false;
            // this.btn=false
          });
@@ -592,4 +614,8 @@
  font-weight: 400;
  color: #000000;
}
.el-upload-list__item-name {
  font-size: 14px; /* 调整文件名字的字体大小 */

}
</style>