no message

src/views/SellTemplate/components/TreeFile.vue

+<template>
+    <el-dialog v-model="show" v-loading="loading" :show-close="false" 
+    :close-on-press-escape="false" :close-on-click-modal="false" 
+    style="max-width:1000px;min-width: 600px;">
+        <template #header>
+            <div class="row overflow-hide">
+                <div>
+                    <img class="q-px-md" 
+                    :src="FileType==1?datas.pdfImg:datas.adsImg" 
+                    style="height: 43px;" />
+                </div>
+                <div class="q-pl-md col">
+                    <div>
+                        <el-tooltip
+                        placement="top-start">
+                            <template #content><div style="max-width: 600px;">{{details.FileName}}</div></template>
+                            <div class="TreeFile-Title pointer">{{details.FileName}}</div>
+                        </el-tooltip>
+                    </div>
+                    <div class="text-small text-5B5D62 q-pt-sm">创建者：{{details.CreateName}}</div>
+                </div>
+            </div>
+            
+        </template>
+        
+        <div class="TreeFile-container"
+        style="min-height: 200px;max-height: 400px;overflow: scroll;">
+            <el-input class="q-pb-md q-px-md" v-model="filterText" placeholder="关键词检索文件夹" />
+            <el-tree 
+            ref="treeRef"
+            :data="dataList" 
+            :props="defaultProps" 
+            node-key="FileId"
+            :default-expanded-keys="[datas.FolderId]"
+            :default-checked-keys="[datas.FolderId]"
+            default-expand-all
+            show-checkbox 
+            :filter-node-method="filterNode"
+            @check="handleTreeNodeClick"
+            @check-change="handleCheckChange"/>
+        </div>
+        
+        <template #footer>
+            <span class="dialog-footer">
+                <el-button @click="()=>closedhandler()">关闭</el-button>
+                <el-button type="primary" @click="()=>MoveToFolder()"> 保存分享配置 </el-button>
+            </span>
+        </template>
+    </el-dialog>
+</template>
+<script setup lang="ts">
+import { ApiResult } from '@/configs/axios';
+import OrgService from '@/services/OrgService';
+import { ref,reactive,watch } from 'vue';
+import { View,Download,EditPen,Delete } from '@element-plus/icons-vue';
+import { ElMessage,ElTree } from 'element-plus';
+import ConfigService from '@/services/ConfigService';
+import FolderService from "@/services/FolderService";
+
+    const props = defineProps({
+        details:{
+            type:Object,
+            required:''
+        },
+        SelectedDatas:{
+            type:Number || Array,
+            required:''
+        },
+        FileType: {
+            type:Number,
+            required: 1
+        }
+    })
+    const emit = defineEmits<{
+        (event: 'close'): void,
+        (event: 'success'): void
+    }>()
+
+    interface Tree {
+        [key: string]: any
+    }
+    const filterText = ref('')
+    const treeRef = ref<InstanceType<typeof ElTree>>()
+    const defaultProps = ref(
+        {
+            children: 'ChildList',
+            label: 'FileName',
+            disabled: 'disabled',
+        }
+    )
+    const datas = reactive({
+        pdfImg: 'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1708337830000_43.png',
+        adsImg: 'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Test/Upload/Goods/1708250377000_777.png',
+        fileList: [] as Tree[],
+        FolderId: '',
+        FolderObj: {}
+    })
+
+    const show=ref(true)
+    const loading = ref(true)
+    const deleteLoading = ref<any>(null);
+    const dataList=ref([])
+
+    const closedhandler=()=>{
+        emit('close')
+    }
+    const handleCheckChange = (data:any, checked:any, indeterminate:any) => {
+        if (checked) {
+            treeRef.value.setCheckedKeys([data.FileId])
+        }
+    }
+    const handleTreeNodeClick = (data:any,checkObj:any) => {
+        // 共两个参数，依次为：传递给 data 属性的数组中该节点所对应的对象、树目前的选中状态对象
+        // 树目前的选中状态对象，包含 checkedNodes、checkedKeys、halfCheckedNodes、halfCheckedKeys 四个属性
+        console.log(checkObj,'----')
+        if (checkObj.checkedKeys.length != 0) {
+            if (checkObj.checkedKeys.length == 2) {
+                // 如果选择超过一个节点，则只保留最后一个节点
+                //单选实现
+                datas.FolderId = data.FileId
+                // if(checkObj.checkedNodes.length>1) 
+                treeRef.value.setCheckedKeys([data.FileId]);
+            }
+        }
+    }
+    const filterNode = (value: string, data: Tree) => {
+        if (!value) return true
+        return data.FileName.includes(value)
+    }
+    const MoveToFolder = () => {
+        recursiveFun(dataList.value,1)
+        let File = datas.FolderObj
+        let title = ''
+        let Id = ''
+        console.log(File,'=====File')
+        if(!props.details) {
+            title = `文件${props.SelectedDatas.join(',')}`
+            Id = props.SelectedDatas.join(',')
+        }else {
+            title = props.details.FileName
+            Id = props.details.FileId
+        }
+        
+        ElMessageBox.confirm(`此操作将${title}移动到${File.FileName}，是否确定?`, "提示", {
+            confirmButtonText: "确定",
+            cancelButtonText: "取消",
+            type: "warning",
+        })
+            .then(async () => {
+            try {
+                let queryMsg = {
+                    FolderId: datas.FolderId, //文件夹Id
+                    Id: Id, //广告行程Id
+                };
+                console.log(queryMsg,'---queryMsg')
+                deleteLoading.value = ElLoading.service({
+                    lock: true,
+                    text: "正在处理",
+                });
+                let pageRes = await FolderService.UpdateTripOtherFolder(queryMsg);
+                if (pageRes.data.resultCode == 1) {
+                    ElMessage({
+                        showClose: true,
+                        message: `移动${props.FileType == 2 ? "广告" : "行程"}至文件夹成功`,
+                        type: "success",
+                    });
+                    emit('close')
+                    emit('success')
+                } else {
+                    ElMessage({
+                        showClose: true,
+                        message: `移动${props.FileType == 2 ? "广告" : "行程"}至文件夹失败`,
+                        type: "warning",
+                    });
+                }
+                deleteLoading.value.close();
+                deleteLoading.value = null;
+            } catch (error) {}
+            })
+            .catch(() => {});
+        }
+
+    const getFile = async () => {
+        let querys = {
+            FileType: props.FileType
+        }
+        let pageRes = await FolderService.GetMyFolderTree(querys);
+        if (pageRes.data.resultCode == 1) {
+            dataList.value = pageRes.data.data
+            recursiveFun(dataList.value)
+        }
+    }
+
+    
+    const recursiveFun = (arrs:Array,type:any) =>{
+        if(arrs.length>0) arrs.forEach(x => {
+            Object.assign(x,{disabled:false})
+            if(type&&x.FileId==datas.FolderId) datas.FolderObj = x
+            if(x.ChildList.length>0){
+                if(!type) recursion(x)
+                else recursion(x,type)
+            }
+        })
+        else {
+            Object.assign(arrs,{disabled:false})
+            if(type&&arrs.FileId==datas.FolderId) datas.FolderObj = arrs
+        }
+        
+    }
+    const recursion = (arrs:any,type:any) => {
+        if(arrs&&arrs.ChildList.length>0) {
+            if(!type) recursiveFun(arrs.ChildList)
+            else recursiveFun(arrs.ChildList,type)
+        }
+    }
+
+    watch(filterText, (val) => {
+        treeRef.value!.filter(val)
+    })
+    getFile()
+</script>
+<style scoped>
+    .TreeFile-Title{
+        width: 100%;
+        overflow: hidden;
+        white-space: nowrap;
+        text-overflow: ellipsis;
+        font-size: 15px;
+        position: relative;
+    }
+    .TreeFile-container th{
+        padding: 0 10px 5px 10px;
+        border-bottom: 1px solid #f6f6f6;
+        background: #fff;
+        position: sticky;
+        top: 0px;
+        z-index: 2;
+    }
+    .TreeFile-container td{
+        padding:  8px 10px;
+        border-bottom: 1px solid #f6f6f6;
+    }
+    .TreeFile-table {
+
+    }
+</style>
\ No newline at end of file