fix:阻止事件冒泡

src/components/editTemplate/form/AudioForm.vue

@@ -80,12 +80,25 @@ export default {
       this.showAudio = true;
     },
     deleteAudios(index) {
-      this.localHash.splice(index, 1);
-      this.localObjects.splice(index, 1);
-      this.$message({
-        type: "success",
-        message: "删除成功!",
-      });
+      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          this.localHash.splice(index, 1);
+          this.localObjects.splice(index, 1);
+          this.$message({
+            type: "success",
+            message: "删除成功!",
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
     },
     // 上传文件
     upFile() {
@@ -180,7 +193,7 @@ export default {
   line-height: 36px;
   color: rgba(121, 125, 132, 1);
   background: #f6f6f7;
-  border: 1px solid #DCDFE6;
+  border: 1px solid #dcdfe6;
   .iconyinpin2 {
     font-size: 24px;
     vertical-align: sub;

src/components/editTemplate/form/ImageForm.vue

@@ -22,7 +22,7 @@
             <img class="list-item-img" :src="item.url || item.dataUrl" />
             <i
               class="iconfont iconshanchu3"
-              @click="deleteimg(item, index)"
+              @click.stop="deleteimg(item, index)"
             ></i>
           </div>
           <div class="add_wrapper">
@@ -122,7 +122,24 @@ export default class ImageForm extends Vue {
   }
   // 删除图片
   deleteimg(item: any, index: number) {
-    this.imageInfo.imgList.splice(index, 1);
+    this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
+      confirmButtonText: "确定",
+      cancelButtonText: "取消",
+      type: "warning",
+    })
+      .then(() => {
+        this.imageInfo.imgList.splice(index, 1);
+        this.$message({
+          type: "success",
+          message: "删除成功!",
+        });
+      })
+      .catch(() => {
+        this.$message({
+          type: "info",
+          message: "已取消删除",
+        });
+      });
   }
   public fileChange(e: any) {
     const file: File = e.target.files[0];

src/components/editTemplate/form/VideoForm.vue

@@ -32,11 +32,7 @@
       @change="fileChange"
     />
     <!-- 视频预览 -->
-    <common-dialog
-      v-if="showVideo"
-      @closePopup="showVideo = false"
-      showMask
-    >
+    <common-dialog v-if="showVideo" @closePopup="showVideo = false" showMask>
       <div>
         <video controls="controls" style="outline: none" :src="Vurl"></video>
       </div>
@@ -121,11 +117,28 @@ export default {
     },
     // 删除当前视频||终止上传
     termination(index) {
-      if (xhr) {
-        xhr.abort();
-      }
-      this.hashList.splice(index, 1);
-      this.locaVideos.splice(index, 1);
+      this.$confirm("此操作将永久删除该文件, 是否继续?", "提示", {
+        confirmButtonText: "确定",
+        cancelButtonText: "取消",
+        type: "warning",
+      })
+        .then(() => {
+          if (xhr) {
+            xhr.abort();
+          }
+          this.hashList.splice(index, 1);
+          this.locaVideos.splice(index, 1);
+          this.$message({
+            type: "success",
+            message: "删除成功!",
+          });
+        })
+        .catch(() => {
+          this.$message({
+            type: "info",
+            message: "已取消删除",
+          });
+        });
     },
     //
     upFile() {
@@ -242,7 +255,7 @@ export default {
   width: 151px;
   background: #f6f6f7;
   border-radius: 4px;
-  border: 1px solid #DCDFE6;
+  border: 1px solid #dcdfe6;
   color: #353535;
   line-height: 36px;
   text-align: center;