Explorar el Código

fix: 上传组件添加删除二次确认按钮

lirenjie hace 4 meses
padre
commit
6f91921cd9
Se han modificado 1 ficheros con 14 adiciones y 3 borrados
  1. 14 3
      src/components/mobile/uploader.vue

+ 14 - 3
src/components/mobile/uploader.vue

@@ -1,10 +1,10 @@
 <template>
-    <van-uploader v-model="fileList" :after-read="afterRead" @oversize="oversize" v-bind="props.componentProps" />
+    <van-uploader v-model="fileList" :after-read="afterRead" @oversize="oversize" :before-delete="deleteFile" v-bind="props.componentProps"/>
 </template>
 <script setup>
 import { fileApi } from '/src/api/support/file-api';
 import { FILE_FOLDER_TYPE_ENUM } from '/@/constants/support/file-const';
-import { showFailToast, showToast } from 'vant';
+import { showConfirmDialog, showFailToast, showToast } from 'vant';
 const fileList = defineModel('fileList')
 const props = defineProps({
     componentProps: Object,
@@ -42,7 +42,7 @@ async function afterRead(options) {
     emit('change', fileList.value);
 }
 function oversize(options) {
-    console.log(options);
+
     if (options) {
         showToast({
             type:'fail',
@@ -52,6 +52,17 @@ function oversize(options) {
         })
     }
 }
+function deleteFile(options){
+
+    showConfirmDialog({
+        title: '提示',
+        message: '是否确定删除该文件',
+    }).then(() => {
+        fileList.value=fileList.value.filter((item)=>item.fileKey !== options.fileKey)
+    }).catch(() => {
+        // on cancel
+    });
+}
 function FileSize(byte) {
     if (byte < 1024) {
         return byte + 'B'