云盘

src/components/CloudDisk/index.vue

@@ -10,7 +10,7 @@
             <div class="CloudDisk-L-Center fz14">
                 <div class="CloudDisk-L-Title row flex-between cusor-pointer"
                 v-for="(item,index) in GroupList" :key="index" @click="Search(item)"
-                :class="[GroupId==item.Id?'active':'']">
+                :class="[queryObj.CloudGroupId==item.Id?'active':'']">
                     <span class="black">{{item.GName}}</span>
                     <div class="row">
                         <template v-if="item.Id">
@@ -56,7 +56,8 @@
                     </FileInput>
                     
                     <template v-for="(item,index) in dataList">
-                        <div class="CloudDisk-R-Box">
+                        <div class="CloudDisk-R-Box"
+                        :class="[GImg==item.DetailsId?'acitve':'']" @click="setImg(item)">
                             <div class="CloudDisk-R-Img">
                                 <el-image
                                     style="width: 80px; height: 80px"
@@ -108,6 +109,9 @@ import AliyunUpload from '@/utils/upload/aliyun'
 import { useUserStore } from "@/store";
 import { storeToRefs } from 'pinia'
 
+const emit = defineEmits<{
+  (event: 'getImg'): void
+}>()
 const { token, userInfo } = storeToRefs(useUserStore())
 
 const dialogFormVisible = ref(false)
@@ -119,6 +123,7 @@ const queryObj = reactive({
     FileName: '',
 })
 const GName= ref('')
+const GImg= ref(0)
 const addEditMsg = reactive({
     Id: '',
     GName: '',
@@ -133,13 +138,15 @@ const GroupList = ref([] as any)
 const setLoading = ref(false)
 const deleteLoading = ref<any>(null)
 
+const setImg = (item:any) =>{
+    emit('getImg',item.FilePath)
+}
 const insertImageElement = async (files: FileList) => {
   let parms = {
     isppt: '1',
     uid: token.value,
     gid: GroupId.value
   }
-  let filePath="/Upload/User/";
   let name = new Date().getTime()
   let url  = await AliyunUpload.UploadCloudDisk(files[0], `${name}`, parms);
   if(url) Search()
@@ -200,7 +207,8 @@ const deleteGroup = (item:any) => {
           })
           let dataRes = await CloudDiskService.RemovePPTCloudGroup(item.Id)
           if (dataRes.data.resultCode == 1) {
-              querySearchGroup()
+              if(queryObj.CloudGroupId==item.Id) queryObj.CloudGroupId = ''
+              Search()
           }
           deleteLoading.value.close()
           deleteLoading.value = null
@@ -231,7 +239,7 @@ const querySearchGroup = async () =>{
 }
 
 const Search = (item:any) =>{
-    if(item) GroupId.value = item.Id
+    if(item) queryObj.CloudGroupId = item.Id
     queryObj.pageIndex = 1
     querySearchHandler()
 }
@@ -371,6 +379,9 @@ onMounted(()=>{
     margin-left: 26px;
     margin-bottom: 24px;
 }
+.CloudDisk-R-Box.active{
+    box-shadow: 0px 0px 13px 0px #0D3EBC;
+}
 .CloudDisk-R-Img{
     width: 80px;
     height: 80px;

src/views/Editor/CanvasTool/UploadPicture.vue

@@ -69,7 +69,7 @@
                             </div>
                         </div>
                     </FileInput> -->
-                    <CloudDisk></CloudDisk>
+                    <CloudDisk @getImg="getImg"></CloudDisk>
                 </el-tab-pane>
                 <el-tab-pane label="图片地址" name="3">
                     <div class="row wrap q-mt-md">
@@ -166,6 +166,10 @@ const handleCurrentChange = (val: number) => {
     getImgList()
 }
 
+const getImg = (url:String) => {
+    propsDatas.value = { src: url }
+}
+
 const insertImageElement = (files: FileList) => {
   const imageFile = files[0]
   if (!imageFile) return