云盘

src/components/CloudDisk/CloudDiskList.vue

@@ -132,10 +132,13 @@
                   
                   <el-dropdown trigger="click" @visible-change="changeDrop(2)"
                   :class="[currentSearchType==2?'DiskRHActive':'']" class="cusor-pointer">
-                    <el-button color="#EFEFEF">
+                    <div style="position: relative;width: 95px;height: 34px;">
+                      <el-button color="#EFEFEF" style="position:absolute;left: 0;right: 0;z-index: 2;">
                         <span class="cusor-pointer">添加时间</span> <el-icon color="#9DA2AA" class="el-icon--right"><arrow-down /></el-icon>
+                      </el-button>
                       <div class="CloudDisk-R-Date">
                         <el-date-picker
+                            class="CloudDisk-date"
                             style="width: 95px;"
                             v-model="queryObj.date"
                             type="daterange"
@@ -145,7 +148,7 @@
                             ref="dropdownDade"
                           />
                       </div>
-                      </el-button>
+                    </div>
                   </el-dropdown>
                   <el-dropdown trigger="click" @visible-change="changeDrop(3)"
                   @command="OpenDropdown"
@@ -406,9 +409,7 @@
     if(x.ID==queryObj.layout) x.check = true
   })
 
-  const MultipleChoice = (row:Array) =>{
-    datas.SelectedDatas = row
-    console.log(datas.SelectedDatas,'---000')
+  const newDatasSelected = () =>{
     if(datas.SelectedDatas.length==0) {
       datas.selectAll = false
       datas.indeterminate = false
@@ -422,10 +423,21 @@
     }
   }
 
+  const MultipleChoice = (row:Array) =>{
+    datas.SelectedDatas = row
+    newDatasSelected()
+  }
+
   const setSelecAll = () => {
     if(datas.selectAll){
+      dataList.value.forEach(x=>{
+        x.check = true
+      })
       datas.SelectedDatas = dataList.value.map(x=>{x.DetailsId})
     }else{
+      dataList.value.forEach(x=>{
+        x.check = false
+      })
       datas.SelectedDatas = []
     }
     datas.indeterminate = false
@@ -700,6 +712,7 @@ const SearchImg = () =>{
         dataList.value = dataList.value.concat(pageRes.data.data.pageData);
         srcList.value = srcList.value.concat(imgs);
         queryObj.pageCount = pageRes.data.data.pageCount;
+        newDatasSelected()
       }
       loading.value = false;
       RefreshLoading.value = false;
@@ -738,19 +751,13 @@ onMounted(()=>{
   </script>
   <style lang="scss" scoped>
     .CloudDisk-R-Date{
-      width: 0;
-    }
-    .CloudDisk-R-Date::v-deep(.el-scrollbar+.el-popper__arrow){
-      display: none;
-    }
-    .CloudDisk-R-Date::v-deep(.el-date-editor){
-      opacity: 0;
-      height: 0;
-      width: 0;
-      position: relative;
-      left: -100px;
-      top: 15px;
+      position: absolute;
+      left: 0;
+      top: 0;
+      right: 0;
+      bottom: 0;
       z-index: 0;
+      opacity: 0;
     }
   .figureTBOX.active{
     color: #3556F9;

src/components/CloudDisk/waterfallFlowList.vue

@@ -11,6 +11,10 @@
             :loadProps="loadProps"
         >
             <template #item="{ item, url, index }">
+                <div style="position: relative;">
+                    <el-checkbox style="position: absolute;left: 30px;top: -3px;" 
+                    class="fz14" label="" v-model="item.check" 
+                    @change="handleSelectionChange(item)"/>
                     <el-dropdown trigger="click">
                         <div class="CloudDisk-R-Box cursor-pointer" :key="index">
                             <div class="CloudDisk-R-Img">
@@ -58,6 +62,7 @@
                           </el-dropdown-menu>
                         </template>
                     </el-dropdown>
+                </div>
             </template>
         </Waterfall>
             
@@ -96,8 +101,15 @@
     const multipleSelection = ref([] as any)
 
     const handleSelectionChange = (row: any) =>{
+        let filter = props.Parent.SelectedDatas.filter(x=>x==row.DetailsId)
+        if(filter.length==0&&row.check) {
             multipleSelection.value.push(row.DetailsId)
             emit('MultipleChoice',multipleSelection.value)
+        }else {
+            let newFilter = props.Parent.SelectedDatas.filter(x=>x!=row.DetailsId)
+            multipleSelection.value = newFilter
+            emit('MultipleChoice',multipleSelection.value)
+        }
     }
     const setCloudNameHandler = async (target:any)=>{
         if(editLoading.value || nickNam.value=='' || !nickNam.value) return