上传图 多选

src/components/CloudDisk/CloudDiskList.vue

@@ -32,7 +32,7 @@
             </template>
           </el-input>
         </div>
-        <FileInput @change="files => insertImageElement(files)">
+        <FileInput :multiple="true" @change="files => insertImageElement(files)">
           <el-button icon="Plus" class="ppt-button text-normal" type="primary">图片</el-button>
         </FileInput>
       </div>
@@ -409,6 +409,7 @@
   layoutType.value.forEach(x=>{
     if(x.ID==queryObj.layout) x.check = true
   })
+  const loadingInstance = ref<any>(null)
 
   const positionList = reactive({
       is_show_mask: false,
@@ -805,18 +806,22 @@ const EditGroup = (item:any) =>{
 }
 
 const insertImageElement = async (files: FileList) => {
-    let name = files[0].name.split('.')
-    const loadingObj = ElLoading.service({
-        text:'正在上传图',
-        lock:true
+    loadingInstance.value = ElLoading.service({
+        text:'收集需要处理的图片'
     })
-    const hash = await calculateFileHash(files[0])
-    if(hash!='') {
-        await checkedUploadFileExsit(files[0],hash)
-    }else{
-        await uoloadFileToService(files[0]) 
+    for(let i=0;i<files.length;i++){
+      loadingInstance.value.text = `当前图片处理进度：${i+1} / ${files.length}`
+      let name = files[0].name.split('.')
+      const hash = await calculateFileHash(files[i])
+      if(hash!='') {
+          await checkedUploadFileExsit(files[i],hash)
+      }else{
+          await uoloadFileToService(files[i]) 
+      }
     }
-    loadingObj.close()
+    loadingInstance.value.close()
+    loadingInstance.value = null
+    
 }
 const checkedUploadFileExsit = async (file:File,hash:any)=>{
     let parms = {

src/components/CloudDisk/index.vue

@@ -55,7 +55,7 @@
             </div>
             <div ref="imgDiskRef" style="height:  420px;padding-top: 20px;">
                 <div class="CloudDisk-R-Center row" v-loading="loading">
-                    <FileInput @change="files => insertImageElement(files)">
+                    <FileInput :multiple="true" @change="files => insertImageElement(files)">
                        <div class="CloudDisk-R-Box">
                         <div class="CloudDisk-R-Plus column items-center cusor-pointer">
                             <el-icon class="el-input__icon" size="30px" title="">
@@ -112,7 +112,7 @@
                                     {{item.FileName}}
                                 </el-tooltip>
                             </span>
-                            <el-popover placement="top" :width="230" trigger="click">
+                            <el-popover placement="top" :width="230" trigger="click" v-if="!isViewerShow">
                                 <template #reference>
                                     <div class="MoreClick row items-center" @click.stop="clickMore(index)"><el-icon size="13"><MoreFilled /></el-icon></div>
                                 </template>
@@ -257,14 +257,14 @@ const editLoading = ref(false)
 const ShowMessage = ref(false)
 const currentMore = ref(0)
 const errImg = ref(require('@/assets/img/noImg.png') as any)
-
+const loadingInstance = ref<any>(null)
 
 const emit = defineEmits<{
   (event: 'setImg'): void,
   (event: 'getImg'): void,
 }>()
 
-watch(() => props.active, () => {
+watch(() => props.active, (n,o) => {
     if(props.active!=2) ImgId.value = ''
 })
 watch(() => props.show, () => {
@@ -317,18 +317,22 @@ const setImg = (item:any) => {
 }
 
 const insertImageElement = async (files: FileList) => {
-    let name = files[0].name.split('.')
-    const loadingObj = ElLoading.service({
-        text:'正在上传图',
-        lock:true
+    loadingInstance.value = ElLoading.service({
+        text:'收集需要处理的图片'
     })
-    const hash = await calculateFileHash(files[0])
-    if(hash!='') {
-        await checkedUploadFileExsit(files[0],hash)
-    }else{
-        await uoloadFileToService(files[0]) 
+    for(let i=0;i<files.length;i++){
+        loadingInstance.value.text = `当前图片处理进度：${i+1} / ${files.length}`
+        let name = files[i].name.split('.')
+        const hash = await calculateFileHash(files[i])
+        if(hash!='') {
+            await checkedUploadFileExsit(files[i],hash)
+        }else{
+            await uoloadFileToService(files[i]) 
+        }
     }
-    loadingObj.close()
+    loadingInstance.value.close()
+    loadingInstance.value = null
+    
 }
 const checkedUploadFileExsit = async (file:File,hash:any)=>{
     let parms = {
@@ -464,7 +468,7 @@ const querySearchGroup = async () =>{
     if(loadingGroup.value) return
     loadingGroup.value = true
     try {
-        let datasRes = await CloudDiskService.GetPPTCloudList(GName.value);
+        const datasRes = await CloudDiskService.GetPPTCloudList(GName.value);
         if (datasRes.data.resultCode==ApiResult.SUCCESS) {
             GroupList.value = datasRes.data.data.list
             GroupList.value.unshift({

src/components/FileInput.vue

@@ -4,6 +4,7 @@
     <input 
       class="input"
       type="file" 
+      :multiple="multiple"
       name="upload" 
       ref="inputRef" 
       :accept="accept" 
@@ -16,6 +17,7 @@
 import { ref } from 'vue'
 
 withDefaults(defineProps<{
+  multiple?: Boolean,
   accept?: string
 }>(), {
   accept: 'image/*',

src/views/Editor/CanvasTool/UploadPicture.vue

@@ -20,6 +20,9 @@
                     </FileInput> -->
                     <CloudDisk :show="showVisible" :active="activeName" @getImg="getImg"></CloudDisk>
                 </el-tab-pane>
+                <!-- <el-tab-pane v-if="userInfo.it && (userInfo.ia || userInfo.ic)" label="云盘空间" name="5">
+                    <diskSpace :show="showVisible" :active="activeName" @getImg="getImg"></diskSpace>
+                </el-tab-pane> -->
                 <el-tab-pane label="平台资料库" name="1">
                     <template v-if="userInfo.iv||userInfo.it">
                         <el-row>
@@ -114,6 +117,7 @@ import type { PPTImageElement, SlideBackground } from '@/types/slides'
 import FileInput from '@/components/FileInput.vue'
 import BuyProduct from '@/components/User/BuyProduct.vue'
 import CloudDisk from '@/components/CloudDisk/index.vue'
+import diskSpace from '@/components/CloudDisk/diskSpace.vue'
 
 const showVisible = ref(true)
 const activeName = ref("2")
@@ -201,7 +205,7 @@ const setImgs = async () => {
     let url = imgOnline.value
     let downloadInfo:any = {}
     if(activeName.value=='1') propsDatas.value = { src: imgOnline.value } 
-    else if(activeName.value=='2') {
+    else if(activeName.value=='2'||activeName.value=='5') {
         text = '请选择图片'
         url = imgPath.value
     } else if(activeName.value=='3') {